.app-frame{min-height:100vh;background-color:var(--color-forest);background-image:linear-gradient(135deg,color-mix(in srgb,var(--color-forest) 62%,transparent),color-mix(in srgb,var(--color-violet-night) 72%,transparent)),var(--theme-background-art),radial-gradient(circle at 14% 18%,color-mix(in srgb,var(--color-sky) 38%,transparent),transparent 28rem),radial-gradient(circle at 92% 12%,color-mix(in srgb,var(--color-sun) 42%,transparent),transparent 22rem),linear-gradient(135deg,var(--color-forest),var(--color-deep-water) 54%,var(--color-violet-night));background-attachment:fixed,fixed,fixed,fixed,fixed;background-position:center,center,center,center,center;background-repeat:no-repeat,no-repeat,no-repeat,no-repeat,no-repeat;background-size:cover,min(92rem,150vw),auto,auto,cover;color:var(--color-paper)}@media(pointer:fine){.app-frame{cursor:var(--cursor-master-sword),auto}.app-frame a,.app-frame button:not(:disabled),.app-frame select,.app-frame [role=button],.app-frame .side-nav-card,.app-frame .sound-pad,.app-frame .drum-kit-slot.filled,.app-frame .youtube-preview-button{cursor:var(--cursor-master-sword),pointer}.app-frame input,.app-frame textarea{cursor:text}.app-frame button:disabled,.app-frame [aria-disabled=true]{cursor:not-allowed}}.brand-mark,.side-nav-link{color:inherit;text-decoration:none}.brand-mark{display:inline-flex;align-items:center;gap:var(--space-3);padding:var(--space-3)}.side-nav-icon{display:grid;place-items:center;border-radius:999px;background:var(--color-sun);color:var(--color-ink);font-family:var(--font-display);font-weight:800}.brand-name,.side-nav-title{display:block}.brand-name{font-family:var(--font-display);font-size:var(--font-size-4);font-weight:800}.mobile-current-section{display:block;color:color-mix(in srgb,var(--color-paper) 76%,transparent);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:800;line-height:1.1}.app-body{display:grid;grid-template-columns:minmax(11.5rem,13.5rem) minmax(0,1fr);gap:var(--space-5);min-height:100vh;width:100%;margin:0;padding:0 var(--space-5) 0 0}.side-menu{position:sticky;top:0;align-self:start;min-height:100vh}.side-menu-panel{display:grid;grid-template-rows:auto auto auto 1fr;gap:var(--space-4);min-height:100vh;max-height:100vh;padding:var(--space-4) var(--space-2) var(--space-4) var(--space-3);border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-top:0;border-bottom:0;border-left:0;border-radius:0 var(--radius-2) var(--radius-2) 0;background:radial-gradient(circle at 0% 0%,color-mix(in srgb,var(--color-sky) 28%,transparent),transparent 15rem),linear-gradient(160deg,color-mix(in srgb,var(--color-sun) 13%,transparent),transparent 40%),color-mix(in srgb,var(--color-ink) 54%,transparent);box-shadow:var(--shadow-stage);overflow:auto}.mobile-topbar,.mobile-menu-backdrop,.side-menu-sheet-header{display:none}.side-menu-sheet-header h2{margin:var(--space-1) 0 0;font-family:var(--font-display);font-size:clamp(1.55rem,5vw,2.2rem);line-height:1}.side-menu-sheet-close,.mobile-menu-toggle{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:var(--control-size-md);border:1px solid color-mix(in srgb,var(--color-paper) 22%,transparent);border-radius:999px;background:color-mix(in srgb,var(--color-paper) 12%,transparent);color:var(--color-paper);font-family:var(--font-display);font-weight:900;padding:0 var(--space-3)}.side-menu-sheet-close:hover,.side-menu-sheet-close:focus-visible,.mobile-menu-toggle:hover,.mobile-menu-toggle:focus-visible{border-color:color-mix(in srgb,var(--color-sun) 72%,var(--color-paper));background:color-mix(in srgb,var(--color-paper) 16%,transparent);box-shadow:0 .8rem 1.6rem color-mix(in srgb,var(--color-ink) 26%,transparent);outline:none}.theme-selector{display:grid;gap:.35rem;padding:.45rem;border:1px solid color-mix(in srgb,var(--color-paper) 12%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-ink) 18%,transparent)}.theme-selector-heading{display:flex;justify-content:space-between;color:var(--color-sun);font-family:var(--font-display);font-size:.68rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.theme-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.35rem}.theme-options-sheet{grid-template-columns:repeat(auto-fit,minmax(4.4rem,1fr))}.theme-option{display:grid;place-items:center;min-height:2.35rem;border:1px solid color-mix(in srgb,var(--color-paper) 14%,transparent);border-radius:var(--radius-1);background:radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--color-sun) 28%,transparent),transparent 3.2rem),color-mix(in srgb,var(--color-paper) 7%,transparent);color:var(--color-paper);cursor:pointer;font-family:var(--font-display);font-weight:900;letter-spacing:.06em;padding:.28rem var(--space-1);text-align:center;transition:background-color var(--motion-quick),border-color var(--motion-quick),box-shadow var(--motion-quick)}.theme-option-sheet{min-height:2.75rem;padding:.4rem var(--space-2)}.theme-option:hover,.theme-option:focus-visible,.theme-option.active{border-color:color-mix(in srgb,var(--color-sun) 72%,var(--color-paper));background-color:color-mix(in srgb,var(--color-paper) 13%,transparent);box-shadow:0 .6rem 1.2rem color-mix(in srgb,var(--color-ink) 22%,transparent);outline:none}.theme-option-name{line-height:1}.side-menu-mascot{position:sticky;top:var(--space-4);z-index:2;width:min(100%,9.5rem);margin:0 auto;filter:drop-shadow(0 1rem 1.4rem color-mix(in srgb,var(--color-ink) 44%,transparent))}.side-menu-mascot:after{position:absolute;right:18%;bottom:.2rem;left:18%;z-index:0;height:.65rem;border-radius:999px;background:radial-gradient(ellipse,color-mix(in srgb,var(--color-ink) 72%,transparent) 0%,transparent 70%);filter:blur(.2rem);opacity:.62;transform:translateY(.25rem);content:""}.side-menu-mascot img{position:relative;z-index:1;display:block;width:100%;height:auto;object-fit:contain}.side-nav{display:grid;gap:var(--space-2);align-content:start;padding-bottom:var(--space-4)}.side-nav-link{position:relative;display:block;border-radius:var(--radius-2)}.side-nav-card{position:relative;display:grid;grid-template-columns:auto 1fr;gap:var(--space-2);align-items:center;min-height:var(--control-size-lg);padding:var(--space-2) calc(var(--space-2) * .85);border:1px solid color-mix(in srgb,var(--color-paper) 14%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-paper) 7%,transparent);transition:box-shadow var(--motion-quick),color var(--motion-quick),background-color var(--motion-quick),border-color var(--motion-quick);overflow:hidden}.side-nav-card:before{position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,color-mix(in srgb,var(--color-sun) 28%,transparent),transparent 60%),radial-gradient(circle at 12% 50%,color-mix(in srgb,var(--color-sky) 34%,transparent),transparent 32%);opacity:0;transform:translate(-1.5rem);transition:opacity var(--motion-quick),transform var(--motion-gentle);content:""}.side-nav-link:hover .side-nav-card,.side-nav-link:focus-visible .side-nav-card,.side-nav-link.active .side-nav-card{border-color:color-mix(in srgb,var(--color-sun) 72%,var(--color-paper));background:color-mix(in srgb,var(--color-paper) 14%,transparent);box-shadow:0 .8rem 1.8rem color-mix(in srgb,var(--color-ink) 28%,transparent);outline:none}.side-nav-link:focus-visible{outline:none}.side-nav-link:hover .side-nav-card:before,.side-nav-link:focus-visible .side-nav-card:before,.side-nav-link.active .side-nav-card:before{opacity:1;transform:translate(0)}.side-nav-icon{width:var(--control-size-md);height:var(--control-size-md);font-size:var(--font-size-3);transition:transform var(--motion-gentle),box-shadow var(--motion-quick)}.side-nav-link:hover .side-nav-icon,.side-nav-link:focus-visible .side-nav-icon,.side-nav-link.active .side-nav-icon{transform:rotate(-8deg) scale(1.12);box-shadow:0 0 0 .25rem color-mix(in srgb,var(--color-sun) 18%,transparent)}.side-nav-title{font-family:var(--font-display);font-weight:800;transition:transform var(--motion-gentle)}.side-nav-link:hover .side-nav-title,.side-nav-link:focus-visible .side-nav-title,.side-nav-link.active .side-nav-title{transform:translate(.15rem)}@media(max-width:72rem){.app-body{display:block;padding:0 var(--space-3) var(--space-3)}.side-menu{position:sticky;top:0;z-index:40;min-height:auto;margin-inline:calc(-1 * var(--space-3));margin-bottom:var(--space-4)}.mobile-topbar{position:sticky;top:0;z-index:42;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-3);align-items:center;padding:var(--space-3);border-bottom:1px solid color-mix(in srgb,var(--color-paper) 18%,transparent);background:radial-gradient(circle at 0% 0%,color-mix(in srgb,var(--color-sky) 24%,transparent),transparent 13rem),linear-gradient(160deg,color-mix(in srgb,var(--color-sun) 10%,transparent),transparent 40%),color-mix(in srgb,var(--color-ink) 72%,transparent);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);box-shadow:0 .75rem 1.8rem color-mix(in srgb,var(--color-ink) 24%,transparent)}.mobile-topbar-copy{min-width:0}.mobile-brand{padding:0}.mobile-brand .brand-name{font-size:clamp(1.45rem,5vw,2rem)}.mobile-menu-backdrop{position:fixed;inset:0;z-index:41;display:block;border:0;background:color-mix(in srgb,var(--color-ink) 62%,transparent);opacity:0;pointer-events:none;transition:opacity var(--motion-gentle)}.side-menu.mobile-open .mobile-menu-backdrop{opacity:1;pointer-events:auto}.side-menu-panel{position:fixed;top:calc(var(--space-3) + 4.75rem);right:var(--space-3);left:var(--space-3);z-index:42;min-height:0;max-height:calc(100vh - 6.5rem);padding:var(--space-4);border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--color-sun) 18%,transparent),transparent 18rem),linear-gradient(135deg,color-mix(in srgb,var(--color-paper) 10%,transparent),transparent),color-mix(in srgb,var(--color-ink) 76%,transparent);box-shadow:var(--shadow-stage);opacity:0;overflow:auto;overscroll-behavior:contain;pointer-events:none;transform:translateY(-.75rem);transition:opacity var(--motion-fast),transform var(--motion-gentle)}.side-menu.mobile-open .side-menu-panel{opacity:1;pointer-events:auto;transform:translateY(0)}.side-menu-sheet-header{display:flex;gap:var(--space-3);align-items:start;justify-content:space-between}.theme-selector{margin-bottom:0}.theme-selector.sidebar{display:none}.theme-selector.sheet{padding:var(--space-3)}.side-menu-mascot{position:static;top:auto;width:min(36vw,7.5rem);margin:0 auto}.side-nav{gap:var(--space-3);padding-right:0;padding-bottom:0}.side-nav-card{min-height:4rem;padding-inline:var(--space-3)}}@media(prefers-reduced-motion:reduce){.side-nav-link,.side-nav-card,.side-nav-card:before,.side-nav-icon,.side-nav-title{transition:none}.theme-option{transition:none}.side-nav-link:hover .side-nav-icon,.side-nav-link:focus-visible .side-nav-icon,.side-nav-link.active .side-nav-icon,.side-nav-link:hover .side-nav-title,.side-nav-link:focus-visible .side-nav-title,.side-nav-link.active .side-nav-title{transform:none}}@media(max-width:46rem){.mobile-topbar{padding:var(--space-2) var(--space-3)}.side-menu-panel{top:calc(var(--space-2) + 4.35rem);right:var(--space-2);left:var(--space-2);max-height:calc(100vh - 5.5rem);padding:var(--space-3)}.theme-options-sheet{grid-template-columns:repeat(3,minmax(0,1fr))}.side-menu-mascot{width:min(44vw,6.75rem)}}.page-shell{width:min(100%,72rem);margin:0 auto;padding:var(--space-5) 0 var(--space-6)}.hero-panel,.page-header{display:grid;border:2px solid color-mix(in srgb,var(--color-paper) 24%,transparent);border-radius:var(--radius-2);background:linear-gradient(120deg,color-mix(in srgb,var(--color-leaf) 32%,transparent),transparent 38%),linear-gradient(0deg,color-mix(in srgb,var(--color-ink) 62%,transparent),color-mix(in srgb,var(--color-ink) 12%,transparent));box-shadow:var(--shadow-stage);overflow:hidden}.hero-panel,.page-header{grid-template-columns:minmax(0,1fr);align-items:end}.hero-panel{min-height:11rem;padding:clamp(var(--space-4),4vw,var(--space-6))}.page-header{min-height:7.5rem;padding:clamp(var(--space-3),2.2vw,var(--space-4))}.hero-copy,.page-header-copy{max-width:46rem}.kicker{margin:0 0 var(--space-3);color:var(--color-sun);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:700;text-transform:uppercase}h1{margin:0;max-width:100%;color:var(--color-paper);font-family:var(--font-display);font-size:clamp(2.25rem,3.5vw,3.75rem);line-height:.98;text-wrap:balance}.translated-title{position:relative;max-width:100%}.translated-title-letters{display:flex;flex-wrap:wrap;row-gap:.08em}.translated-title-letter{position:relative;display:inline-block;min-width:.24em;cursor:default}.translated-title-letter-readable,.translated-title-letter-glyph{display:inline-block;transform-origin:50% 72%}.translated-title-letter-readable{position:relative;z-index:2}.translated-title-letter-glyph{position:absolute;inset:0;z-index:3;color:var(--color-sun);font-feature-settings:"kern";letter-spacing:.03em;text-shadow:0 0 1.2rem color-mix(in srgb,var(--color-sun) 32%,transparent),0 .25rem .7rem color-mix(in srgb,var(--color-ink) 36%,transparent);pointer-events:none}.home-note p:not(.kicker){max-width:44rem;color:color-mix(in srgb,var(--color-paper) 78%,transparent);font-size:var(--font-size-4);line-height:1.45}@media(max-width:72rem){.page-shell{width:min(100%,72rem);padding:var(--space-4) 0 var(--space-5)}.hero-panel{min-height:9rem;padding:clamp(var(--space-3),4vw,var(--space-4))}.page-header{min-height:6rem;padding:var(--space-3)}.page-header-copy,.hero-copy{max-width:none}.kicker{margin-bottom:var(--space-2);font-size:.76rem;letter-spacing:.08em}h1{font-size:clamp(1.95rem,5vw,3rem);line-height:1}}@media(max-width:54rem){.hero-panel,.page-header{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.translated-title-letter-glyph{display:none}.translated-title-letter-readable{opacity:1!important;transform:none!important;filter:none!important}}@media(max-width:46rem){.page-shell{padding:0 0 var(--space-4)}.hero-panel{min-height:8.5rem}.page-header{min-height:5.25rem;padding:var(--space-3) var(--space-2)}h1{font-size:clamp(1.65rem,8vw,2.35rem)}.translated-title-letter{min-width:.18em}}.section-tile,.content-card,.link-stack a{color:inherit;text-decoration:none}.section-icon{display:grid;place-items:center;border-radius:999px;background:var(--color-sun);color:var(--color-ink);font-family:var(--font-display);font-weight:800}.section-title,.section-description,.card-meta,.card-title,.card-description{display:block}.section-grid,.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:var(--space-4);margin-block:var(--space-6)}.home-note{margin-block:var(--space-6);padding:var(--space-5);border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 90% 0%,color-mix(in srgb,var(--color-sun) 20%,transparent),transparent 18rem),color-mix(in srgb,var(--color-paper) 10%,transparent)}.home-note h2{margin:0;font-family:var(--font-display);font-size:clamp(2rem,4vw,3.5rem);line-height:1}.section-tile,.content-card,.info-panel{border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-paper) 10%,transparent)}.section-tile,.content-card{display:grid;min-height:8rem;padding:var(--space-4);transition:transform var(--motion-quick),background-color var(--motion-quick),border-color var(--motion-quick)}.content-card:has(.content-card-image){align-content:start;gap:var(--space-3);padding:var(--space-3)}.content-card-image{display:block;aspect-ratio:16 / 9;margin:calc(var(--space-3) * -1) calc(var(--space-3) * -1) 0;border-radius:calc(var(--radius-2) - .15rem) calc(var(--radius-2) - .15rem) var(--radius-1) var(--radius-1);background:color-mix(in srgb,var(--color-ink) 56%,transparent);overflow:hidden}.content-card-image img{width:100%;height:100%;display:block;object-fit:cover;transition:transform var(--motion-medium)}.content-card:hover .content-card-image img,.content-card:focus-visible .content-card-image img{transform:scale(1.045)}.section-tile{grid-template-columns:auto 1fr;gap:var(--space-3)}.section-tile:hover,.section-tile:focus-visible,.content-card:hover,.content-card:focus-visible{transform:translateY(-.25rem);border-color:color-mix(in srgb,var(--color-sun) 72%,var(--color-paper));background:color-mix(in srgb,var(--color-paper) 16%,transparent);outline:none}.section-icon{width:var(--control-size-lg);height:var(--control-size-lg);font-size:var(--font-size-4)}.section-title,.card-title{font-family:var(--font-display);font-size:var(--font-size-4);font-weight:800}.section-description,.card-description{margin-top:var(--space-2);color:color-mix(in srgb,var(--color-paper) 76%,transparent);line-height:1.45}.card-meta{margin-bottom:var(--space-3);color:var(--color-sun);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:700;text-transform:uppercase}.detail-layout{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:var(--space-4);margin-block:var(--space-6)}.info-panel{padding:var(--space-5)}.info-panel h2{margin:0 0 var(--space-3);font-family:var(--font-display)}.info-panel ul{margin:0;padding-left:var(--space-5)}.info-panel li+li{margin-top:var(--space-2)}.link-stack{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));gap:var(--space-2)}.link-stack a{display:inline-grid;min-height:var(--control-size-md);align-items:center;padding:0 var(--space-3);border-radius:var(--radius-1);background:color-mix(in srgb,var(--color-sun) 18%,transparent);font-family:var(--font-display);font-weight:700}.link-stack a:hover,.link-stack a:focus-visible{background:color-mix(in srgb,var(--color-sun) 32%,transparent);outline:2px solid var(--color-sun)}.template-panel{margin-block:var(--space-6);padding:var(--space-5);border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:linear-gradient(135deg,color-mix(in srgb,var(--color-paper) 11%,transparent),transparent),color-mix(in srgb,var(--color-ink) 28%,transparent)}.template-section-heading{max-width:44rem;margin-bottom:var(--space-4)}.template-section-heading h2{margin:0;font-family:var(--font-display)}.template-section-grid,.control-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:var(--space-4)}.template-section-grid article{padding:var(--space-4);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-paper) 9%,transparent)}.template-section-grid p,.template-panel p{color:color-mix(in srgb,var(--color-paper) 78%,transparent);line-height:1.5}@media(max-width:72rem){.template-panel{margin-block:var(--space-5);padding:var(--space-4)}.template-section-heading{gap:var(--space-2)}.template-section-grid{gap:var(--space-3)}.template-section-grid article{padding:var(--space-3)}}@media(max-width:54rem){.card-grid{gap:var(--space-3);margin-block:var(--space-4)}.content-card{min-height:auto;padding:var(--space-3)}.content-card:has(.content-card-image){gap:var(--space-2)}.content-card-image{margin:calc(var(--space-3) * -1) calc(var(--space-3) * -1) 0}.card-title{font-size:clamp(1.15rem,4.6vw,1.45rem)}.card-description{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:3}.detail-layout{gap:var(--space-3);margin-block:var(--space-4)}.info-panel{padding:var(--space-4)}.link-stack{grid-template-columns:repeat(auto-fit,minmax(min(100%,9.5rem),1fr))}.link-stack a+a{margin-top:0}.template-panel{gap:var(--space-3);margin-block:var(--space-4);padding:var(--space-4)}.template-section-heading{margin-bottom:var(--space-3)}.template-section-grid{gap:var(--space-3)}}@media(max-width:46rem){.template-panel{padding:var(--space-3)}}.media-card{border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-paper) 10%,transparent)}.media-card h3,.attribution-list h3{margin:0;font-family:var(--font-display)}.media-grid,.attribution-list,.youtube-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:var(--space-4)}.media-card,.attribution-list article,.image-card,.youtube-card{padding:var(--space-4);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-paper) 9%,transparent)}.media-card p,.attribution-list p,.youtube-card p,.image-card p{color:color-mix(in srgb,var(--color-paper) 78%,transparent);line-height:1.5}.media-group-stack{display:grid;gap:var(--space-6)}.media-group h3,.youtube-card h3,.image-card h3{margin:0;font-family:var(--font-display)}.media-group>h3{margin-bottom:var(--space-3);color:var(--color-sun);font-size:var(--font-size-4)}.youtube-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,21rem),1fr))}.youtube-card{display:grid;gap:var(--space-4);overflow:hidden}.youtube-frame{position:relative;aspect-ratio:16 / 9;border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-ink) 72%,transparent);overflow:hidden}.youtube-frame iframe{width:100%;height:100%;border:0}.youtube-preview-button{position:relative;display:block;width:100%;height:100%;min-height:100%;padding:0;border:0;background:radial-gradient(circle at 50% 45%,color-mix(in srgb,var(--color-sun) 18%,transparent),transparent 13rem),color-mix(in srgb,var(--color-ink) 72%,black);cursor:pointer;overflow:hidden}.youtube-preview-button img{width:100%;height:100%;display:block;object-fit:cover;transition:filter var(--motion-medium),transform var(--motion-medium)}.youtube-preview-button:after{position:absolute;inset:0;background:radial-gradient(circle at 50% 50%,transparent 0 18%,color-mix(in srgb,var(--color-ink) 42%,transparent) 72%),linear-gradient(0deg,color-mix(in srgb,var(--color-ink) 32%,transparent),transparent 44%);content:""}.youtube-preview-play{position:absolute;top:50%;left:50%;z-index:2;display:grid;place-items:center;width:4.6rem;height:4.6rem;border-radius:999px;background:radial-gradient(circle at 35% 28%,color-mix(in srgb,white 48%,transparent),transparent 42%),#ff1f1f;color:#fff;font-family:var(--font-display);font-size:1.75rem;line-height:1;padding-left:.18rem;transform:translate(-50%,-50%);box-shadow:0 .8rem 2.2rem color-mix(in srgb,black 32%,transparent),0 0 0 .42rem color-mix(in srgb,white 12%,transparent)}.youtube-preview-button:hover img,.youtube-preview-button:focus-visible img{filter:saturate(1.18) brightness(1.06);transform:scale(1.04)}.youtube-preview-button:focus-visible{outline:3px solid var(--color-sun);outline-offset:-3px}.youtube-card-body{display:grid;gap:var(--space-2)}.youtube-card-actions{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-3);align-items:center;justify-content:space-between}.youtube-theater-button,.youtube-inline-close,.video-theater-close{min-height:var(--control-size-md);border:1px solid color-mix(in srgb,var(--color-sun) 42%,var(--color-paper));border-radius:999px;background:radial-gradient(circle at 30% 20%,color-mix(in srgb,var(--color-paper) 28%,transparent),transparent 42%),var(--color-sun);color:var(--color-ink);cursor:pointer;font-family:var(--font-display);font-weight:900;padding:0 var(--space-4);box-shadow:0 .45rem 1.2rem color-mix(in srgb,var(--color-ink) 22%,transparent)}.youtube-inline-close{position:absolute;right:var(--space-2);bottom:var(--space-2);z-index:2;min-height:2.5rem;padding:0 var(--space-3);opacity:.92}.youtube-theater-button:hover,.youtube-theater-button:focus-visible,.youtube-inline-close:hover,.youtube-inline-close:focus-visible,.video-theater-close:hover,.video-theater-close:focus-visible{outline:2px solid color-mix(in srgb,var(--color-paper) 72%,transparent);box-shadow:0 0 0 .24rem color-mix(in srgb,var(--color-sun) 24%,transparent),0 .45rem 1.2rem color-mix(in srgb,var(--color-ink) 22%,transparent)}.media-source a,.attribution-list a{color:var(--color-sun);font-weight:800}.video-theater-backdrop{position:fixed;inset:0;z-index:80;display:grid;place-items:center;padding:clamp(var(--space-2),1.75vw,var(--space-4));background:radial-gradient(circle at 50% 0%,color-mix(in srgb,var(--color-sun) 16%,transparent),transparent 26rem),color-mix(in srgb,var(--color-ink) 84%,black);-webkit-backdrop-filter:blur(.55rem);backdrop-filter:blur(.55rem)}.video-theater-stage{position:relative;display:grid;grid-template-columns:minmax(2.5rem,.12fr) minmax(0,1fr) minmax(2.5rem,.12fr);gap:clamp(var(--space-2),2vw,var(--space-4));width:min(98vw,112rem);max-height:min(96vh,70rem);padding:clamp(var(--space-2),1.35vw,var(--space-4));border:2px solid color-mix(in srgb,var(--color-sun) 52%,var(--color-paper));border-radius:calc(var(--radius-2) + .4rem);background:var(--theme-accent-art),radial-gradient(circle at 50% -15%,color-mix(in srgb,var(--color-sun) 22%,transparent),transparent 28rem),linear-gradient(135deg,color-mix(in srgb,var(--color-moss) 40%,var(--color-ink)),color-mix(in srgb,var(--color-bark) 38%,var(--color-ink)));background-size:cover,auto,auto;box-shadow:0 2rem 6rem color-mix(in srgb,black 54%,transparent),inset 0 0 3rem color-mix(in srgb,var(--color-paper) 8%,transparent);overflow:hidden}.video-theater-content{position:relative;z-index:2;display:grid;grid-template-rows:auto minmax(0,1fr);gap:var(--space-3);min-width:0}.video-theater-heading{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:start;justify-content:space-between;padding:var(--space-3);border:1px solid color-mix(in srgb,var(--color-paper) 16%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-ink) 48%,transparent)}.video-theater-heading h2{margin:0;color:var(--color-paper);font-family:var(--font-display);font-size:clamp(1.45rem,3vw,2.65rem);line-height:1}.video-theater-heading p{margin:var(--space-2) 0 0;color:color-mix(in srgb,var(--color-paper) 74%,transparent)}.video-theater-frame{aspect-ratio:16 / 9;min-height:min(72vh,48rem);border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--color-sun) 10%,transparent),transparent 22rem),#000;box-shadow:0 1rem 3rem color-mix(in srgb,black 44%,transparent);overflow:hidden}.video-theater-frame iframe{width:100%;height:100%;border:0}.video-theater-decor{position:relative;z-index:1;min-width:2.5rem;border:1px solid color-mix(in srgb,var(--color-sun) 26%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 50% 14%,color-mix(in srgb,var(--color-sun) 30%,transparent),transparent 3rem),repeating-linear-gradient(135deg,color-mix(in srgb,var(--color-paper) 12%,transparent) 0 .18rem,transparent .18rem 1.2rem),color-mix(in srgb,var(--color-ink) 28%,transparent);opacity:.86}.video-theater-decor:before,.video-theater-decor:after{position:absolute;left:50%;width:1.2rem;height:1.2rem;border:2px solid color-mix(in srgb,var(--color-sun) 74%,var(--color-paper));transform:translate(-50%) rotate(45deg);content:""}.video-theater-decor:before{top:12%}.video-theater-decor:after{bottom:12%}.video-theater-fairy{--fairy-size: 1.25rem;position:absolute;top:20%;left:8%;z-index:3;width:var(--fairy-size);height:var(--fairy-size);pointer-events:none;animation:fairy-flight 10.5s cubic-bezier(.34,.01,.2,1) both}.video-theater-fairy-core{position:absolute;inset:0;border-radius:999px;background:radial-gradient(circle,white 0 18%,#bff7ff 28%,#5bd5ff 48%,transparent 72%);box-shadow:0 0 .8rem #c9fbff,0 0 1.8rem color-mix(in srgb,var(--color-sun) 48%,#79f3ff),0 0 3.4rem #65e4ff}.video-theater-wing{position:absolute;top:-.32rem;width:.95rem;height:1.4rem;border-radius:100% 0;background:color-mix(in srgb,white 68%,#8df4ff);filter:blur(.02rem);opacity:.72;transform-origin:bottom center}.video-theater-wing.wing-left{right:58%;transform:rotate(-38deg)}.video-theater-wing.wing-right{left:58%;transform:scaleX(-1) rotate(-38deg)}.video-theater-dust{--dust-delay: calc(var(--dust-index) * .22s);position:absolute;top:50%;left:50%;width:.35rem;height:.35rem;border-radius:999px;background:var(--color-sun);box-shadow:0 0 .75rem color-mix(in srgb,var(--color-sun) 72%,#8df4ff);opacity:0;animation:fairy-dust 3.8s ease-out var(--dust-delay) both}@keyframes fairy-flight{0%{opacity:0;transform:translateZ(0) scale(.74) rotate(-8deg)}12%{opacity:1}42%{transform:translate3d(38vw,-9vh,0) scale(1.06) rotate(8deg)}74%{opacity:1;transform:translate3d(68vw,18vh,0) scale(.9) rotate(-12deg)}to{opacity:0;transform:translate3d(82vw,-6vh,0) scale(.66) rotate(18deg)}}@keyframes fairy-dust{0%{opacity:0;transform:translateZ(0) scale(.5)}22%{opacity:.96}to{opacity:0;transform:translate3d(calc((var(--dust-index) - 3) * -.62rem),calc((var(--dust-index) + 1) * .48rem),0) scale(.08)}}.image-card{display:grid}.image-card figure{display:grid;gap:var(--space-3);margin:0}.image-card img{width:100%;max-height:22rem;object-fit:contain;border-radius:var(--radius-2);background:radial-gradient(circle at 50% 0%,color-mix(in srgb,var(--color-sun) 18%,transparent),transparent 16rem),color-mix(in srgb,var(--color-paper) 8%,transparent)}.image-card figcaption{display:grid;gap:var(--space-2)}.image-gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,18rem),1fr));gap:var(--space-4);margin-block:var(--space-6)}.image-gallery-card{display:grid;overflow:hidden;border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-paper) 9%,transparent);transition:transform var(--motion-quick),border-color var(--motion-quick),background-color var(--motion-quick)}.image-gallery-card:hover{transform:translateY(-.25rem);border-color:color-mix(in srgb,var(--color-sun) 72%,var(--color-paper));background:color-mix(in srgb,var(--color-paper) 13%,transparent)}.image-gallery-preview{position:relative;display:block;width:100%;padding:0;border:0;overflow:hidden;background:color-mix(in srgb,var(--color-ink) 52%,transparent);color:inherit;cursor:inherit}.image-gallery-preview img{width:100%;aspect-ratio:16 / 10;display:block;object-fit:cover;background:color-mix(in srgb,var(--color-ink) 52%,transparent);transition:transform var(--motion-slow),filter var(--motion-quick)}.image-gallery-card:hover .image-gallery-preview img,.image-gallery-card:focus-within .image-gallery-preview img{transform:scale(1.045);filter:saturate(1.12) contrast(1.06)}.image-gallery-expand{position:absolute;right:var(--space-3);bottom:var(--space-3);display:grid;width:2.45rem;aspect-ratio:1;place-items:center;border:1px solid color-mix(in srgb,var(--color-paper) 46%,transparent);border-radius:999px;background:color-mix(in srgb,var(--color-ink) 76%,transparent);color:var(--color-paper);box-shadow:0 .55rem 1.3rem color-mix(in srgb,var(--color-ink) 32%,transparent);opacity:0;transform:translateY(.35rem) scale(.92);transition:opacity var(--motion-quick),transform var(--motion-quick),background-color var(--motion-quick)}.image-gallery-card:hover .image-gallery-expand,.image-gallery-card:focus-within .image-gallery-expand{opacity:1;transform:translateY(0) scale(1)}.image-gallery-preview:focus-visible{outline:3px solid var(--color-sun);outline-offset:-.35rem}.image-gallery-card-body{display:grid;gap:var(--space-2);padding:var(--space-4)}.image-gallery-card h2,.image-gallery-card h3{margin:0;font-family:var(--font-display);font-size:var(--font-size-3)}.image-gallery-card a{color:var(--color-sun);font-weight:800}.game-image-grid{margin-block:0}.image-modal-backdrop{position:fixed;inset:0;z-index:60;display:grid;place-items:center;padding:clamp(1rem,3vw,2rem);background:radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--color-sun) 20%,transparent),transparent 18rem),radial-gradient(circle at 82% 76%,color-mix(in srgb,var(--color-accent) 18%,transparent),transparent 22rem),color-mix(in srgb,var(--color-ink) 82%,transparent);-webkit-backdrop-filter:blur(.65rem);backdrop-filter:blur(.65rem)}.image-modal-stage{position:relative;width:min(96vw,82rem);max-height:min(88vh,58rem);display:grid;place-items:center}.image-modal-decor{position:absolute;inset:-1.2rem;border:1px solid color-mix(in srgb,var(--color-sun) 38%,transparent);border-radius:var(--radius-2);background:linear-gradient(90deg,transparent 0 42%,color-mix(in srgb,var(--color-sun) 18%,transparent) 42% 43%,transparent 43% 57%,color-mix(in srgb,var(--color-sun) 18%,transparent) 57% 58%,transparent 58%),linear-gradient(180deg,transparent 0 42%,color-mix(in srgb,var(--color-sun) 14%,transparent) 42% 43%,transparent 43% 57%,color-mix(in srgb,var(--color-sun) 14%,transparent) 57% 58%,transparent 58%);opacity:.72;pointer-events:none}.image-modal-frame{position:relative;z-index:1;width:100%;margin:0;overflow:hidden;border:2px solid color-mix(in srgb,var(--color-paper) 34%,transparent);border-radius:var(--radius-2);background:linear-gradient(135deg,color-mix(in srgb,var(--color-paper) 10%,transparent),transparent),color-mix(in srgb,var(--color-ink) 88%,transparent);box-shadow:0 2rem 6rem color-mix(in srgb,black 46%,transparent)}.image-modal-frame img{width:100%;max-height:min(72vh,48rem);display:block;object-fit:contain;background:color-mix(in srgb,var(--color-ink) 78%,black)}.image-modal-frame figcaption{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between;padding:var(--space-4);background:radial-gradient(circle at 0% 50%,color-mix(in srgb,var(--color-sun) 12%,transparent),transparent 17rem),color-mix(in srgb,var(--color-ink) 70%,transparent)}.image-modal-frame h2,.image-modal-frame p{margin:0}.image-modal-frame h2{font-family:var(--font-display);font-size:clamp(1.45rem,3vw,2.45rem)}.image-modal-frame p{color:color-mix(in srgb,var(--color-paper) 76%,transparent)}.image-modal-actions{display:flex;gap:var(--space-2);align-items:center}.image-modal-actions a,.image-modal-close{min-height:var(--control-size-sm);border:1px solid color-mix(in srgb,var(--color-paper) 28%,transparent);border-radius:999px;background:color-mix(in srgb,var(--color-paper) 12%,transparent);color:var(--color-paper);display:inline-grid;grid-auto-flow:column;gap:var(--space-2);align-items:center;justify-content:center;padding:0 var(--space-3);font-weight:900;text-decoration:none}.image-modal-close{width:var(--control-size-sm);padding:0}.image-modal-actions a:hover,.image-modal-actions a:focus-visible,.image-modal-close:hover,.image-modal-close:focus-visible{border-color:var(--color-sun);background:var(--color-sun);color:var(--color-ink);outline:0}@media(max-width:72rem){.youtube-grid,.image-gallery-grid{gap:var(--space-3)}.youtube-card{padding:var(--space-3)}.media-group>h3{font-size:clamp(1.15rem,3vw,1.75rem)}}@media(max-width:54rem){.media-group-stack{gap:var(--space-4)}.media-group>h3{margin-bottom:var(--space-2)}.youtube-card-actions{align-items:flex-start;justify-content:flex-start}.media-source{margin:0}.image-gallery-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,10.5rem),1fr));margin-block:var(--space-4)}.image-gallery-card-body{padding:var(--space-3)}.image-gallery-card h2,.image-gallery-card h3{font-size:clamp(.95rem,4vw,1.15rem)}.image-gallery-expand{opacity:1;transform:translateY(0) scale(1)}.video-theater-backdrop{padding:var(--space-2)}.video-theater-stage{grid-template-columns:1fr;width:96vw;max-height:94vh;padding:var(--space-3)}.video-theater-decor{display:none}.video-theater-frame{min-height:auto}.video-theater-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-2);align-items:start}.video-theater-close{justify-self:end}.image-modal-frame figcaption{flex-direction:column;align-items:stretch;gap:var(--space-2);padding:var(--space-3)}.image-modal-actions{width:100%;flex-wrap:wrap;justify-content:flex-start}.image-modal-close{margin-left:auto}}@media(prefers-reduced-motion:reduce){.video-theater-fairy,.video-theater-dust{animation:none!important;display:none}}@media(max-width:46rem){.image-gallery-grid{grid-template-columns:1fr 1fr}.video-theater-stage,.image-modal-stage{width:100%;max-height:92vh}.video-theater-stage,.video-theater-heading{padding:var(--space-2)}.video-theater-heading h2{font-size:clamp(1.2rem,7vw,1.7rem)}.image-modal-frame img{max-height:min(58vh,25rem)}}.soundboard-panel{display:grid;gap:var(--space-4);margin-block:var(--space-6);padding:var(--space-5);border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--color-sun) 19%,transparent),transparent 20rem),linear-gradient(135deg,color-mix(in srgb,var(--color-paper) 11%,transparent),transparent),color-mix(in srgb,var(--color-ink) 26%,transparent)}.soundboard-heading{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between}.soundboard-heading h2{margin:0;font-family:var(--font-display);font-size:clamp(2rem,4vw,3.5rem);line-height:1}.soundboard-stop,.soundboard-more{min-height:var(--control-size-md);border:0;border-radius:999px;background:var(--color-sun);color:var(--color-ink);font-family:var(--font-display);font-weight:900;padding:0 var(--space-4)}.soundboard-stop:hover,.soundboard-stop:focus-visible,.soundboard-more:hover,.soundboard-more:focus-visible{box-shadow:0 0 0 .25rem color-mix(in srgb,var(--color-sun) 22%,transparent);outline:2px solid color-mix(in srgb,var(--color-paper) 65%,transparent)}.soundboard-filters{display:grid;grid-template-columns:minmax(min(100%,18rem),2fr) repeat(2,minmax(min(100%,12rem),1fr));gap:var(--space-3)}.drum-kit{display:grid;gap:var(--space-3);padding:var(--space-4);border:1px solid color-mix(in srgb,var(--color-sun) 34%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 10% 10%,color-mix(in srgb,var(--color-sun) 22%,transparent),transparent 16rem),linear-gradient(135deg,color-mix(in srgb,var(--color-bark) 58%,transparent),color-mix(in srgb,var(--color-ink) 30%,transparent));box-shadow:inset 0 0 2rem color-mix(in srgb,var(--color-ink) 18%,transparent)}.drum-kit-heading{display:flex;flex-wrap:wrap;gap:var(--space-2) var(--space-4);align-items:end;justify-content:space-between}.drum-kit-heading h3{margin:0;font-family:var(--font-display);font-size:clamp(1.35rem,3vw,2.25rem);line-height:1}.drum-kit-heading p{max-width:28rem;margin:0;color:color-mix(in srgb,var(--color-paper) 76%,transparent);line-height:1.35}.drum-kit-actions{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center;justify-content:flex-end}.drum-kit-autoplay{display:grid;gap:var(--space-3);padding:var(--space-3);border:1px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--color-sky) 20%,transparent),transparent 18rem),color-mix(in srgb,var(--color-ink) 22%,transparent)}.drum-kit-autoplay-copy{display:grid;gap:var(--space-1)}.drum-kit-autoplay-copy h4{margin:0;font-family:var(--font-display);font-size:clamp(1.2rem,2.4vw,1.8rem);line-height:1}.drum-kit-autoplay-copy p{margin:0;color:color-mix(in srgb,var(--color-paper) 78%,transparent);line-height:1.4}.drum-kit-autoplay-controls{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr));gap:var(--space-3);align-items:end}.drum-kit-autoplay-controls label{display:grid;gap:var(--space-1);color:var(--color-sun);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:800;text-transform:uppercase}.drum-kit-autoplay-controls select,.drum-kit-autoplay-controls input{width:100%}.drum-kit-tempo-readout{color:color-mix(in srgb,var(--color-paper) 82%,transparent);font-size:.9rem}.drum-kit-autoplay-toggle{min-height:var(--control-size-md);border:1px solid color-mix(in srgb,var(--color-paper) 36%,transparent);border-radius:999px;background:color-mix(in srgb,var(--color-paper) 12%,transparent);color:var(--color-paper);cursor:pointer;font-family:var(--font-display);font-size:.95rem;font-weight:900;padding:0 var(--space-3)}.drum-kit-autoplay-toggle.active,.drum-kit-autoplay-toggle:hover:not(:disabled),.drum-kit-autoplay-toggle:focus-visible:not(:disabled){background:var(--color-sun);color:var(--color-ink);outline:2px solid color-mix(in srgb,var(--color-paper) 65%,transparent)}.drum-kit-autoplay-toggle:disabled{cursor:not-allowed;opacity:.45}.drum-kit-step-strip{display:grid;grid-template-columns:repeat(16,minmax(0,1fr));gap:.35rem}.drum-kit-step{height:.6rem;border-radius:999px;background:color-mix(in srgb,var(--color-paper) 14%,transparent)}.drum-kit-step.bar{background:color-mix(in srgb,var(--color-sun) 24%,transparent)}.drum-kit-step.active{background:var(--color-sky);box-shadow:0 0 1rem color-mix(in srgb,var(--color-sky) 42%,transparent)}.drum-kit-clear-all{min-height:var(--control-size-md);border:1px solid color-mix(in srgb,var(--color-paper) 36%,transparent);border-radius:999px;background:color-mix(in srgb,var(--color-paper) 12%,transparent);color:var(--color-paper);cursor:pointer;font-family:var(--font-display);font-weight:900;padding:0 var(--space-3)}.drum-kit-clear-all:hover:not(:disabled),.drum-kit-clear-all:focus-visible:not(:disabled){background:var(--color-coral);color:var(--color-ink);outline:2px solid color-mix(in srgb,var(--color-paper) 65%,transparent)}.drum-kit-clear-all:disabled{cursor:not-allowed;opacity:.46}.drum-kit-slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,8.75rem),1fr));gap:var(--space-3)}.drum-kit-slot{position:relative;min-height:8.75rem;border:2px dashed color-mix(in srgb,var(--color-paper) 28%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-ink) 26%,transparent);transition:border-color var(--motion-fast),box-shadow var(--motion-fast),transform var(--motion-fast)}.drum-kit-slot:has(.drum-kit-pad:focus-visible),.drum-kit-slot:hover{border-color:color-mix(in srgb,var(--color-sun) 75%,var(--color-paper));box-shadow:0 0 1.2rem color-mix(in srgb,var(--color-sun) 16%,transparent);transform:translateY(-.15rem)}.drum-kit-slot.assigned{border-style:solid;background:radial-gradient(circle at 20% 15%,color-mix(in srgb,var(--color-sun) 24%,transparent),transparent 45%),color-mix(in srgb,var(--color-moss) 48%,var(--color-ink))}.drum-kit-slot.pending{border-color:var(--color-sun);box-shadow:0 0 0 .25rem color-mix(in srgb,var(--color-sun) 18%,transparent),0 0 1.5rem color-mix(in srgb,var(--color-sun) 26%,transparent)}.drum-kit-slot.playing{border-color:color-mix(in srgb,var(--color-sky) 78%,var(--color-paper));box-shadow:0 0 0 .22rem color-mix(in srgb,var(--color-sky) 20%,transparent),0 0 1.5rem color-mix(in srgb,var(--color-sky) 26%,transparent)}.drum-kit-slot.failed{border-color:color-mix(in srgb,var(--color-coral) 78%,var(--color-paper))}.drum-kit-pad{display:grid;gap:var(--space-2);width:100%;min-height:8.75rem;padding:var(--space-3);border:0;border-radius:calc(var(--radius-2) - .1rem);background:transparent;color:var(--color-paper);cursor:pointer;text-align:left}.drum-kit-key{display:inline-grid;place-items:center;width:2.6rem;height:2.6rem;border-radius:.75rem;background:var(--color-sun);color:var(--color-ink);font-family:var(--font-display);font-size:var(--font-size-3);font-weight:900}.drum-kit-part{color:color-mix(in srgb,var(--color-paper) 76%,transparent);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:800;letter-spacing:.04em;text-transform:uppercase}.drum-kit-title{font-family:var(--font-display);font-size:var(--font-size-3);font-weight:900;line-height:1.05}.drum-kit-meta,.drum-kit-error{color:color-mix(in srgb,var(--color-paper) 72%,transparent);font-size:var(--font-size-1);line-height:1.25}.drum-kit-clear{position:absolute;top:var(--space-2);right:var(--space-2);min-height:2rem;border:1px solid color-mix(in srgb,var(--color-paper) 34%,transparent);border-radius:999px;background:color-mix(in srgb,var(--color-ink) 42%,transparent);color:var(--color-paper);cursor:pointer;font-family:var(--font-display);font-size:.72rem;font-weight:800;padding:0 var(--space-2)}.drum-kit-clear:hover,.drum-kit-clear:focus-visible{background:var(--color-coral);color:var(--color-ink);outline:none}.soundboard-filters label{display:grid;gap:var(--space-1);color:var(--color-sun);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:800;text-transform:uppercase}.soundboard-filters input,.soundboard-filters select{min-height:var(--control-size-md);width:100%;border:1px solid color-mix(in srgb,var(--color-paper) 22%,transparent);border-radius:var(--radius-1);background:color-mix(in srgb,var(--color-ink) 58%,transparent);color:var(--color-paper);font:inherit;padding:0 var(--space-3);text-transform:none}.soundboard-count,.soundboard-empty,.soundboard-note{margin:0;color:color-mix(in srgb,var(--color-paper) 78%,transparent);line-height:1.5}.soundboard-note{max-width:48rem;padding:var(--space-3);border:1px solid color-mix(in srgb,var(--color-sun) 28%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-sun) 10%,transparent);color:color-mix(in srgb,var(--color-paper) 86%,transparent)}.soundboard-groups{display:grid;gap:var(--space-5)}.soundboard-group{display:grid;gap:var(--space-3)}.soundboard-group-heading{align-items:center;color:var(--color-paper);display:flex;font-family:var(--font-display);font-size:1.05rem;font-weight:800;justify-content:space-between;letter-spacing:.03em}.soundboard-group-heading small{color:color-mix(in srgb,var(--color-paper) 70%,transparent);font-family:var(--font-body);font-size:.78rem;font-weight:800;text-transform:uppercase}.soundboard-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));gap:var(--space-3)}.sound-pad-shell{position:relative}.sound-send-to-kit,.sound-favorite{position:absolute;top:var(--space-2);z-index:2;display:grid;place-items:center;width:2.35rem;height:2.35rem;border:1px solid color-mix(in srgb,var(--color-paper) 40%,transparent);border-radius:999px;background:color-mix(in srgb,var(--color-ink) 48%,transparent);color:color-mix(in srgb,var(--color-paper) 75%,transparent);cursor:pointer;font-size:1.1rem;transition:background var(--motion-fast),color var(--motion-fast),transform var(--motion-fast)}.sound-send-to-kit{right:calc(var(--space-2) + 2.75rem)}.sound-favorite{right:var(--space-2)}.sound-send-to-kit:hover,.sound-send-to-kit:focus-visible,.sound-favorite:hover,.sound-favorite:focus-visible{background:var(--color-sun);color:var(--color-ink);transform:rotate(12deg) scale(1.1)}.sound-send-to-kit:disabled{cursor:not-allowed;opacity:.38;transform:none}.sound-send-to-kit:disabled:hover{background:color-mix(in srgb,var(--color-ink) 48%,transparent);color:color-mix(in srgb,var(--color-paper) 75%,transparent)}.sound-favorite.active{background:var(--color-sun);color:var(--color-ink);box-shadow:0 0 1rem color-mix(in srgb,var(--color-sun) 42%,transparent)}.sound-pad{position:relative;display:grid;gap:var(--space-2);min-height:9rem;align-content:start;border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 18% 18%,color-mix(in srgb,var(--color-sun) 48%,transparent),transparent 35%),linear-gradient(135deg,color-mix(in srgb,var(--color-moss) 78%,var(--color-paper)),color-mix(in srgb,var(--color-bark) 72%,var(--color-ink)));color:var(--color-paper);padding:var(--space-4) 3.3rem var(--space-4) var(--space-4);box-shadow:0 .9rem 1.5rem color-mix(in srgb,var(--color-ink) 24%,transparent);text-align:left;overflow:hidden;width:100%}.sound-pad:after{position:absolute;right:-1.7rem;bottom:-1.7rem;width:5rem;height:5rem;border-radius:999px;background:color-mix(in srgb,var(--color-paper) 11%,transparent);content:""}.sound-pad:hover,.sound-pad:focus-visible,.sound-pad.active{border-color:color-mix(in srgb,var(--color-sun) 76%,var(--color-paper));outline:none}.sound-pad.failed{border-color:color-mix(in srgb,var(--color-coral) 72%,var(--color-paper))}.sound-pad-title,.sound-pad-meta,.sound-pad-review{position:relative;z-index:1}.sound-pad-title{font-family:var(--font-display);font-size:var(--font-size-4);font-weight:900;line-height:1.05}.sound-pad-meta,.sound-pad-review{color:color-mix(in srgb,var(--color-paper) 78%,transparent);font-size:var(--font-size-1);line-height:1.25}.sound-pad-review{justify-self:start;border-radius:999px;background:color-mix(in srgb,var(--color-ink) 32%,transparent);padding:var(--space-1) var(--space-2)}.soundboard-more{justify-self:center}.keyboard-key{display:inline-grid;min-height:2rem;align-items:center;padding:0 var(--space-3);border-radius:999px;background:color-mix(in srgb,var(--color-sun) 20%,transparent);color:var(--color-paper);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:800;text-transform:uppercase}.playful-control{position:relative;display:grid;gap:var(--space-2);min-height:var(--control-size-xl);padding:var(--space-4);border:0;border-radius:var(--radius-2);background:radial-gradient(circle at 20% 20%,color-mix(in srgb,var(--color-sun) 50%,transparent),transparent 42%),linear-gradient(135deg,var(--color-coral),var(--color-violet-night));color:var(--color-paper);box-shadow:var(--shadow-stage);text-align:left}.playful-control:disabled{cursor:not-allowed;opacity:.88}.playful-control-label{font-family:var(--font-display);font-size:var(--font-size-4);font-weight:800}.playful-control-description{color:color-mix(in srgb,var(--color-paper) 78%,transparent);line-height:1.35}.keyboard-key{justify-self:start}@media(max-width:54rem){.soundboard-panel{gap:var(--space-3);margin-block:var(--space-4);padding:var(--space-4)}.soundboard-filters{grid-template-columns:1fr}.soundboard-group{gap:var(--space-2)}.drum-kit{padding:var(--space-3)}.drum-kit-heading{align-items:start}.drum-kit-actions{justify-content:flex-start}.drum-kit-autoplay-controls{grid-template-columns:1fr}.sound-pad{min-height:8rem;padding:var(--space-3) 3rem var(--space-3) var(--space-3)}.sound-pad-title{font-size:clamp(1.15rem,4vw,1.55rem)}.sound-send-to-kit,.sound-favorite{width:2.15rem;height:2.15rem}.sound-send-to-kit{right:calc(var(--space-2) + 2.5rem)}}@media(max-width:46rem){.soundboard-panel{padding:var(--space-3)}.soundboard-grid,.drum-kit-slots{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-2)}.drum-kit-slot,.drum-kit-pad{min-height:7.5rem}.drum-kit-step-strip{grid-template-columns:repeat(8,minmax(0,1fr))}.drum-kit-title{font-size:clamp(1.05rem,4.8vw,1.35rem)}.drum-kit-key{width:2.35rem;height:2.35rem}.sound-pad{padding:var(--space-3) 2.8rem var(--space-3) var(--space-3)}}.music-page{padding-bottom:10rem}.music-library-panel,.playlist-panel{display:grid;gap:var(--space-4);margin-block:var(--space-6);padding:var(--space-5);border:2px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 100% 0%,color-mix(in srgb,var(--color-sun) 18%,transparent),transparent 19rem),linear-gradient(135deg,color-mix(in srgb,var(--color-deep-water) 34%,transparent),transparent),color-mix(in srgb,var(--color-ink) 26%,transparent)}.music-library-heading,.music-group-heading,.playlist-heading,.playlist-detail-heading{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between}.music-library-heading h2,.playlist-heading h3,.music-group-heading h3{margin:0;font-family:var(--font-display);line-height:1}.music-library-heading h2{font-size:clamp(2rem,4vw,3.5rem)}.music-library-actions{display:flex;flex-wrap:wrap;gap:var(--space-2);justify-content:flex-end}.playlist-heading h3,.music-group-heading h3{font-size:clamp(1.35rem,3vw,2.25rem)}.music-count,.music-status{margin:0;color:color-mix(in srgb,var(--color-paper) 78%,transparent);line-height:1.5}.music-status.error{color:color-mix(in srgb,var(--color-coral) 84%,var(--color-paper))}.music-filters{display:grid;grid-template-columns:minmax(min(100%,18rem),2fr) repeat(2,minmax(min(100%,12rem),1fr));gap:var(--space-3)}.music-filters label,.playlist-controls label{display:grid;gap:var(--space-1);color:var(--color-sun);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:800;text-transform:uppercase}.music-filters input,.music-filters select,.playlist-controls select,.playlist-create-row input,.playlist-detail-heading input{min-height:var(--control-size-md);width:100%;border:1px solid color-mix(in srgb,var(--color-paper) 22%,transparent);border-radius:var(--radius-1);background:color-mix(in srgb,var(--color-ink) 58%,transparent);color:var(--color-paper);font:inherit;padding:0 var(--space-3)}.music-action-button,.music-show-more,.music-icon-button,.music-icon-link,.music-source-link,.music-text-button{min-height:var(--control-size-md);border:0;border-radius:999px;background:var(--color-sun);color:var(--color-ink);cursor:pointer;font-family:var(--font-display);font-weight:900;text-decoration:none}.music-action-button,.music-show-more,.music-source-link{display:inline-flex;gap:var(--space-2);align-items:center;justify-content:center;padding:0 var(--space-4)}.music-text-button{padding:0 var(--space-3);background:color-mix(in srgb,var(--color-paper) 12%,transparent);color:var(--color-paper);font-size:var(--font-size-1)}.music-icon-button,.music-icon-link{display:inline-grid;place-items:center;width:var(--control-size-md);height:var(--control-size-md);padding:0}.music-icon-button.primary,.music-icon-button.play,.music-icon-button.active,.music-track-row.active .music-icon-button.play{background:var(--color-coral);color:var(--color-paper)}.music-icon-button.danger{background:color-mix(in srgb,var(--color-coral) 82%,var(--color-ink));color:var(--color-paper)}.music-action-button:hover:not(:disabled),.music-action-button:focus-visible:not(:disabled),.music-show-more:hover,.music-show-more:focus-visible,.music-icon-button:hover:not(:disabled),.music-icon-button:focus-visible:not(:disabled),.music-icon-link:hover,.music-icon-link:focus-visible,.music-source-link:hover,.music-source-link:focus-visible,.music-text-button:hover,.music-text-button:focus-visible{box-shadow:0 0 0 .25rem color-mix(in srgb,var(--color-sun) 22%,transparent);outline:2px solid color-mix(in srgb,var(--color-paper) 65%,transparent)}.music-action-button:disabled,.music-icon-button:disabled{cursor:not-allowed;opacity:.45}.playlist-create-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-3)}.playlist-detail{display:grid;gap:var(--space-3);padding:var(--space-3);border:1px solid color-mix(in srgb,var(--color-paper) 18%,transparent);border-radius:var(--radius-2);background:color-mix(in srgb,var(--color-ink) 32%,transparent)}.playlist-detail-heading{align-items:stretch}.playlist-detail-heading input{max-width:24rem;font-family:var(--font-display);font-weight:900}.playlist-detail-actions,.music-group-actions,.music-track-actions,.music-player-controls{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center}.playlist-track-list{display:grid;gap:var(--space-2);margin:0;padding-left:1.3rem}.playlist-track-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-2);align-items:center;color:color-mix(in srgb,var(--color-paper) 84%,transparent)}.music-results-bar{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;justify-content:space-between}.music-results-actions{display:flex;flex-wrap:wrap;gap:var(--space-2)}.music-groups{display:grid;gap:var(--space-5)}.music-group{display:grid;gap:var(--space-3);padding:var(--space-4);border:1px solid color-mix(in srgb,var(--color-sun) 28%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 10% 10%,color-mix(in srgb,var(--color-sun) 14%,transparent),transparent 15rem),color-mix(in srgb,var(--color-bark) 44%,transparent)}.music-track-list{display:grid;gap:var(--space-2)}.music-track-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:var(--space-3);align-items:center;padding:var(--space-2);border:1px solid color-mix(in srgb,var(--color-paper) 14%,transparent);border-radius:var(--radius-1);background:color-mix(in srgb,var(--color-ink) 30%,transparent)}.music-track-row.active{border-color:color-mix(in srgb,var(--color-sun) 72%,var(--color-paper));box-shadow:0 0 1rem color-mix(in srgb,var(--color-sun) 14%,transparent)}.music-track-copy{min-width:0}.music-track-copy h4{display:flex;gap:var(--space-2);align-items:baseline;margin:0;color:var(--color-paper);font-family:var(--font-display);font-size:var(--font-size-3);line-height:1.05}.music-track-copy h4 span{color:var(--color-sun);font-size:var(--font-size-1)}.music-track-copy p{margin:var(--space-1) 0 0;color:color-mix(in srgb,var(--color-paper) 68%,transparent);font-size:var(--font-size-1)}.music-show-more{justify-self:center}.music-player{position:fixed;right:var(--space-4);bottom:var(--space-4);width:min(68rem,calc(100vw - 19.5rem));z-index:20;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--space-3) var(--space-4);align-items:center;padding:var(--space-4);border:2px solid color-mix(in srgb,var(--color-sun) 52%,var(--color-paper));border-radius:var(--radius-2);background:radial-gradient(circle at 8% 0%,color-mix(in srgb,var(--color-sun) 26%,transparent),transparent 16rem),linear-gradient(135deg,color-mix(in srgb,var(--color-bark) 74%,var(--color-ink)),var(--color-ink));box-shadow:0 1rem 3rem color-mix(in srgb,var(--color-ink) 46%,transparent)}.music-player-track{grid-column:1 / -1;min-width:0}.music-player-track p{margin:0;color:color-mix(in srgb,var(--color-paper) 76%,transparent);overflow:hidden;text-overflow:ellipsis;white-space:normal}.music-player-title-line{display:grid;gap:var(--space-1);min-width:0}.music-player-title-line>*{min-width:0}.music-player-title-line strong{overflow:hidden;color:var(--color-paper);font-family:var(--font-display);font-size:var(--font-size-3);line-height:1.02;text-overflow:ellipsis;white-space:normal}.music-player-meta{display:flex;flex-wrap:wrap;gap:var(--space-1) var(--space-2);color:color-mix(in srgb,var(--color-paper) 78%,transparent);font-size:var(--font-size-1);font-weight:800}.music-player-meta>span+span:before{margin-right:var(--space-2);color:color-mix(in srgb,var(--color-paper) 52%,transparent);content:"|"}.music-player-progress,.music-player-volume{display:grid;gap:var(--space-2);align-items:center}.music-player-progress{grid-template-columns:3.2rem minmax(10rem,1fr) 3.2rem}.music-player-volume{grid-template-columns:auto auto minmax(0,1fr) auto;color:color-mix(in srgb,var(--color-paper) 78%,transparent);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:800}.music-player-progress span,.music-player-volume span{color:color-mix(in srgb,var(--color-paper) 78%,transparent);font-size:var(--font-size-1);font-weight:800}.music-player-progress input,.music-player-volume input{width:100%;accent-color:var(--color-sun)}@media(max-width:72rem){.music-library-panel,.playlist-panel{margin-block:var(--space-5);padding:var(--space-4)}.music-library-heading,.music-group-heading,.playlist-heading{gap:var(--space-2)}.music-library-heading h2{font-size:clamp(1.7rem,4vw,2.7rem)}.music-group-heading h3{font-size:clamp(1.15rem,3vw,1.75rem)}}@media(max-width:54rem){.music-library-panel,.playlist-panel{gap:var(--space-3);margin-block:var(--space-4);padding:var(--space-4)}.music-page{padding-bottom:18rem}.music-filters,.playlist-create-row,.music-track-row,.music-player{grid-template-columns:1fr}.music-track-actions,.music-group-actions,.music-library-actions{justify-content:flex-start}.music-player{right:var(--space-3);bottom:var(--space-3);left:var(--space-3);width:auto;max-width:none;grid-template-columns:minmax(0,1fr);gap:var(--space-3);max-height:min(46vh,19rem);overflow-y:auto;padding:var(--space-3)}.music-player-track{grid-column:1 / -1}.music-player-track .card-meta{display:block;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.music-player-title-line{gap:var(--space-1)}.music-player-title-line strong{font-size:clamp(1.1rem,5vw,1.45rem)}.music-player-meta{display:grid;gap:.2rem}.music-player-meta>span+span:before{content:none}.music-player-controls{justify-content:space-between;flex-wrap:wrap}.music-player-progress,.music-player-volume{grid-column:1 / -1}.music-player-progress{grid-template-columns:3.2rem minmax(0,1fr) 3.2rem}.music-player-volume{grid-template-columns:auto auto minmax(0,1fr) 3rem}}@media(max-width:46rem){.music-library-panel,.playlist-panel{padding:var(--space-3)}}.ocarina-page{padding-bottom:var(--space-6)}.ocarina-play-layout{display:grid;gap:var(--space-4)}.ocarina-stage,.ocarina-song-panel,.ocarina-recent-panel{border:1px solid color-mix(in srgb,var(--color-paper) 22%,transparent);border-radius:var(--radius-2);background:radial-gradient(circle at 16% 16%,color-mix(in srgb,var(--color-sun) 18%,transparent),transparent 15rem),linear-gradient(135deg,color-mix(in srgb,var(--color-paper) 9%,transparent),color-mix(in srgb,var(--color-ink) 18%,transparent));box-shadow:var(--shadow-soft)}.ocarina-stage{order:-1;display:grid;gap:var(--space-4);align-items:center;padding:clamp(var(--space-4),4vw,var(--space-6));overflow:hidden}.ocarina-stage-copy{display:grid;gap:var(--space-3);justify-items:center;text-align:center}.ocarina-stage-copy h2{margin:0;color:var(--color-paper);font-family:var(--font-display);font-size:clamp(2.5rem,7vw,5.6rem);line-height:.92}.ocarina-stage-copy p{max-width:35rem;margin:0;color:color-mix(in srgb,var(--color-paper) 82%,transparent);font-size:var(--font-size-3);line-height:1.45}.ocarina-audio-warning{padding:var(--space-3);border:1px solid color-mix(in srgb,var(--color-sun) 50%,transparent);border-radius:var(--radius-1);background:color-mix(in srgb,var(--color-sun) 15%,transparent)}.ocarina-picker-row{display:grid;grid-template-columns:minmax(0,20rem);gap:var(--space-3);align-items:end;justify-content:center;margin-top:calc(-1 * var(--space-2))}.ocarina-picker-row label{display:grid;gap:var(--space-1);color:var(--color-sun);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:900;letter-spacing:.08em;text-transform:uppercase}.ocarina-picker-row select{min-height:var(--control-size-md);border:1px solid color-mix(in srgb,var(--color-paper) 24%,transparent);border-radius:var(--radius-1);background:color-mix(in srgb,var(--color-ink) 48%,transparent);color:var(--color-paper);font:inherit;letter-spacing:.02em;padding:0 var(--space-3);text-transform:none}.ocarina-picker-row p{grid-column:1 / -1;font-size:var(--font-size-2)}.ocarina-instrument{position:relative;min-height:clamp(22rem,38vw,35rem);border-radius:48% 52% 46% 54%;isolation:isolate}.ocarina-body{position:absolute;inset:7% 3% 6% 4%;z-index:1;filter:drop-shadow(0 1.8rem 2rem color-mix(in srgb,var(--color-ink) 38%,transparent))}.ocarina-belly{position:absolute;inset:15% 16% 13% 18%;border:2px solid color-mix(in srgb,var(--color-paper) 34%,transparent);border-radius:58% 42% 48% 52%/46% 52% 48% 54%;background:radial-gradient(circle at 35% 28%,color-mix(in srgb,var(--color-sky) 72%,white 8%),transparent 18%),radial-gradient(circle at 75% 68%,color-mix(in srgb,var(--color-violet-night) 40%,transparent),transparent 22%),linear-gradient(135deg,color-mix(in srgb,var(--color-sky) 78%,var(--color-paper)),color-mix(in srgb,var(--color-deep-water) 76%,var(--color-violet-night)));box-shadow:inset 0 1.4rem 2rem color-mix(in srgb,white 18%,transparent),inset 0 -1.2rem 2.4rem color-mix(in srgb,var(--color-ink) 34%,transparent)}.ocarina-tail{position:absolute;right:7%;bottom:14%;width:24%;height:18%;border:2px solid color-mix(in srgb,var(--color-paper) 28%,transparent);border-radius:20% 74% 68% 32%;background:linear-gradient(135deg,color-mix(in srgb,var(--color-sky) 62%,var(--color-paper)),var(--color-deep-water));transform:rotate(24deg)}.ocarina-button{position:absolute;top:var(--note-y);left:var(--note-x);z-index:3;display:grid;place-items:center;width:clamp(4rem,7vw,6.3rem);height:clamp(4rem,7vw,6.3rem);translate:-50% -50%;border:3px solid color-mix(in srgb,var(--color-paper) 58%,transparent);border-radius:999px;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,white 36%,transparent),transparent 30%),linear-gradient(135deg,var(--color-sun),color-mix(in srgb,var(--color-coral) 74%,var(--color-sun)));color:var(--color-ink);box-shadow:0 .7rem 1.6rem color-mix(in srgb,var(--color-ink) 34%,transparent),inset 0 -.45rem .8rem color-mix(in srgb,var(--color-bark) 34%,transparent);font-family:var(--font-display);touch-action:manipulation}.ocarina-button.note-center{background:radial-gradient(circle at 35% 30%,color-mix(in srgb,white 40%,transparent),transparent 30%),linear-gradient(135deg,color-mix(in srgb,var(--color-ocarina-action) 88%,var(--color-paper)),color-mix(in srgb,var(--color-deep-water) 58%,var(--color-ocarina-action)));box-shadow:0 .7rem 1.6rem color-mix(in srgb,var(--color-ink) 34%,transparent),inset 0 -.45rem .8rem color-mix(in srgb,var(--color-deep-water) 38%,transparent)}.ocarina-button:hover,.ocarina-button:focus-visible,.ocarina-button.active{border-color:color-mix(in srgb,var(--color-paper) 88%,white);box-shadow:0 0 0 .32rem color-mix(in srgb,var(--color-sun) 22%,transparent),0 0 2.8rem color-mix(in srgb,var(--color-sun) 66%,transparent),inset 0 -.45rem .8rem color-mix(in srgb,var(--color-bark) 34%,transparent);outline:none}.ocarina-button.note-center:hover,.ocarina-button.note-center:focus-visible,.ocarina-button.note-center.active{box-shadow:0 0 0 .32rem color-mix(in srgb,var(--color-ocarina-action) 28%,transparent),0 0 2.8rem color-mix(in srgb,var(--color-ocarina-action) 68%,transparent),inset 0 -.45rem .8rem color-mix(in srgb,var(--color-deep-water) 38%,transparent)}.ocarina-key,.ocarina-note-name{display:block;line-height:1}.ocarina-key{font-size:clamp(1.35rem,3vw,2.4rem);font-weight:900}.ocarina-note-name{margin-top:.25rem;color:color-mix(in srgb,var(--color-ink) 72%,transparent);font-size:.78rem;letter-spacing:.1em;text-transform:uppercase}.ocarina-trail{position:absolute;inset:0;z-index:4;pointer-events:none}.ocarina-trail-note{position:absolute;top:28%;left:64%;display:grid;place-items:center;width:2.3rem;height:2.3rem;border-radius:999px;background:color-mix(in srgb,var(--color-paper) 88%,transparent);color:var(--color-ink);font-family:var(--font-display);font-weight:900;box-shadow:0 0 1.4rem color-mix(in srgb,var(--color-sun) 68%,transparent)}.ocarina-song-panel{display:grid;gap:var(--space-4);padding:clamp(var(--space-4),3vw,var(--space-5))}.ocarina-song-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3)}@media(min-width:116rem){.page-shell.ocarina-page{width:min(100%,132rem)}.ocarina-play-layout{grid-template-columns:minmax(18rem,.8fr) minmax(34rem,1.05fr) minmax(18rem,.8fr);gap:var(--space-5);align-items:stretch}.ocarina-stage{position:sticky;top:var(--space-4);order:0;grid-column:2;align-self:stretch;grid-template-rows:auto minmax(0,1fr) auto;min-height:100%}.ocarina-song-panel{align-self:start}.ocarina-song-panel.primary{grid-column:1}.ocarina-song-panel:not(.primary){grid-column:3}.ocarina-song-grid{grid-template-columns:1fr}.ocarina-stage-copy h2{font-size:clamp(2.25rem,3.5vw,4.3rem)}.ocarina-instrument{min-height:clamp(22rem,31vw,31rem)}.ocarina-song-card{padding:var(--space-3)}.ocarina-song-card h3{font-size:clamp(1.25rem,1.7vw,var(--font-size-4))}.ocarina-staff{min-height:4.8rem;padding-right:2.2rem;padding-left:3.9rem}.ocarina-clef{left:.55rem;font-size:2.7rem}}.ocarina-song-card,.ocarina-recent-panel{background:color-mix(in srgb,var(--color-paper) 8%,transparent)}.ocarina-song-card{display:grid;gap:var(--space-3);padding:var(--space-4);border:1px solid color-mix(in srgb,var(--color-paper) 14%,transparent);border-radius:var(--radius-2);transition:background .18s ease,border-color .18s ease,box-shadow .18s ease}.ocarina-song-card.completed{border-color:color-mix(in srgb,var(--color-sun) 74%,var(--color-paper));background:radial-gradient(circle at 96% 8%,color-mix(in srgb,var(--color-sun) 26%,transparent),transparent 7rem),linear-gradient(135deg,color-mix(in srgb,var(--color-accent) 15%,transparent),transparent 58%),color-mix(in srgb,var(--color-paper) 12%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--color-sun) 20%,transparent),0 0 1.35rem color-mix(in srgb,var(--color-sun) 15%,transparent)}.ocarina-song-card.just-played{animation:ocarina-song-blink .9s ease-in-out 2}.ocarina-song-card-heading{display:flex;gap:var(--space-2);align-items:center;justify-content:space-between}.ocarina-song-card h3{margin:0;color:var(--color-paper);font-family:var(--font-display);font-size:var(--font-size-4)}.ocarina-song-complete{flex:0 0 auto;padding:.2rem .55rem;border-radius:999px;background:var(--color-sun);color:var(--color-ink);font-family:var(--font-display);font-size:var(--font-size-1);font-weight:900;letter-spacing:.03em}@keyframes ocarina-song-blink{0%,to{transform:translateY(0) scale(1);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--color-sun) 20%,transparent),0 0 1.35rem color-mix(in srgb,var(--color-sun) 15%,transparent)}45%{border-color:var(--color-sun);background:radial-gradient(circle at 50% 50%,color-mix(in srgb,var(--color-sun) 48%,transparent),transparent 9rem),color-mix(in srgb,var(--color-sun) 24%,var(--color-paper));transform:translateY(-.12rem) scale(1.018);box-shadow:0 0 0 .2rem color-mix(in srgb,var(--color-sun) 22%,transparent),0 0 2.5rem color-mix(in srgb,var(--color-sun) 42%,transparent)}}@media(prefers-reduced-motion:reduce){.ocarina-song-card.just-played{animation:none;border-color:var(--color-sun)}}.ocarina-staff{position:relative;min-height:5.6rem;width:100%;padding:var(--space-2) 3.3rem var(--space-2) 4.7rem;border-radius:var(--radius-1);background:linear-gradient(90deg,color-mix(in srgb,var(--color-ink) 64%,transparent),transparent 24%),color-mix(in srgb,var(--color-ink) 24%,transparent);overflow:hidden}.ocarina-staff.compact{flex:1 1 22rem;min-height:4.8rem}.ocarina-clef{position:absolute;top:50%;left:.8rem;z-index:2;color:var(--color-sun);font-family:Georgia,serif;font-size:3.3rem;line-height:1;text-shadow:0 0 .9rem color-mix(in srgb,var(--color-sun) 34%,transparent);transform:translateY(-50%)}.ocarina-staff-lines{position:absolute;inset:1.1rem 2.1rem 1.1rem 3.8rem;display:grid;grid-template-rows:repeat(5,1fr)}.ocarina-staff-lines span{align-self:center;height:2px;background:color-mix(in srgb,var(--color-coral) 82%,var(--color-sun));box-shadow:0 0 .35rem color-mix(in srgb,var(--color-coral) 34%,transparent)}.ocarina-staff-note{position:absolute;top:50%;left:calc(5.6rem + ((100% - 9.2rem) * var(--note-step)));z-index:3;display:grid;place-items:center;min-width:2.2rem;min-height:2rem;padding:0 var(--space-1);border:2px solid color-mix(in srgb,var(--color-ink) 44%,transparent);border-radius:999px;background:radial-gradient(circle at 35% 30%,color-mix(in srgb,white 34%,transparent),transparent 35%),color-mix(in srgb,var(--color-sun) 92%,var(--color-paper));color:var(--color-ink);font-family:var(--font-display);font-weight:900;line-height:1;transform:translate(-50%,-50%);white-space:nowrap}.ocarina-staff-note.note-center{top:74%;border-color:color-mix(in srgb,var(--color-deep-water) 46%,transparent);background:radial-gradient(circle at 35% 30%,color-mix(in srgb,white 36%,transparent),transparent 35%),color-mix(in srgb,var(--color-ocarina-action) 86%,var(--color-paper));box-shadow:0 0 .65rem color-mix(in srgb,var(--color-ocarina-action) 32%,transparent)}.ocarina-staff-note.note-up{top:26%}.ocarina-staff-note.note-down{top:62%}.ocarina-staff-note.note-left{top:38%}.ocarina-staff-note.note-right{top:50%}.ocarina-sequence-pill{display:grid;place-items:center;min-width:2.4rem;min-height:2.4rem;padding:0 var(--space-2);border-radius:999px;background:color-mix(in srgb,var(--color-sun) 82%,var(--color-paper));color:var(--color-ink);font-family:var(--font-display);font-weight:900}.ocarina-sequence-empty{position:relative;z-index:3;color:color-mix(in srgb,var(--color-paper) 72%,transparent)}.ocarina-recent-panel{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;padding:var(--space-4);color:var(--color-paper);font-family:var(--font-display);font-weight:900}@media(max-width:54rem){.ocarina-stage{grid-template-columns:1fr;gap:var(--space-3);padding:var(--space-4)}.ocarina-instrument{min-height:18rem}.ocarina-stage-copy h2{font-size:clamp(2.15rem,10vw,4rem)}.ocarina-song-panel{gap:var(--space-3);padding:var(--space-3)}.ocarina-song-grid{grid-template-columns:1fr}.ocarina-song-card{gap:var(--space-2);padding:var(--space-3)}.ocarina-song-card h3{font-size:clamp(1.1rem,4.6vw,1.45rem)}.ocarina-staff{min-height:5rem;padding:var(--space-2) 2.8rem var(--space-2) 4rem}.ocarina-staff-lines{inset:1rem 1.6rem 1rem 3.2rem}.ocarina-clef{left:.55rem;font-size:2.6rem}.ocarina-staff-note{left:calc(4.85rem + ((100% - 7.8rem) * var(--note-step)));min-width:2rem;min-height:1.9rem}.ocarina-button{width:clamp(3.5rem,15vw,5rem);height:clamp(3.5rem,15vw,5rem)}.ocarina-key{font-size:clamp(1.2rem,5.6vw,1.8rem)}.ocarina-note-name{font-size:.68rem}.ocarina-recent-panel{gap:var(--space-2);padding:var(--space-3)}.ocarina-picker-row{grid-template-columns:1fr}}@media(prefers-reduced-motion:reduce){.ocarina-trail-note{animation:none!important;display:none}.ocarina-button{transition:none}}@media(max-width:46rem){.ocarina-stage{padding:var(--space-3)}.ocarina-stage-copy h2{font-size:clamp(2rem,11vw,3.25rem)}.ocarina-instrument{min-height:16.5rem}.ocarina-staff{padding:var(--space-2) 2.4rem var(--space-2) 3.7rem}.ocarina-staff-lines{inset:.95rem 1.35rem .95rem 3rem}.ocarina-staff-note{left:calc(4.45rem + ((100% - 7.1rem) * var(--note-step)))}}@font-face{font-display:swap;font-family:"Hylia Serif";font-style:normal;font-weight:400;src:url(/assets/fonts/hylia-serif/HyliaSerifBeta-Regular.otf) format("opentype")}@font-face{font-display:swap;font-family:BOTW Sheikah;font-style:normal;font-weight:400;src:url(/assets/fonts/botw-sheikah/BotW_Sheikah.ttf) format("truetype")}@font-face{font-display:swap;font-family:Gerudo Typography;font-style:normal;font-weight:400;src:url(/assets/fonts/gerudo/GerudoTypography.ttf) format("truetype")}@font-face{font-display:swap;font-family:SS Ancient Hylian;font-style:normal;font-weight:400;src:url(/assets/fonts/ss-ancient-hylian/SSAncientHylian.ttf) format("truetype")}@font-face{font-display:swap;font-family:TP Hylian;font-style:normal;font-weight:400;src:url(/assets/fonts/tp-hylian/TPHylian-GCNRegular.otf) format("opentype")}:root{color-scheme:dark;--color-moss: #51634a;--color-parchment: #d0cabb;--color-bark: #5a422e;--color-mist: #bbbbbb;--color-stone: #aaaaaa;--color-ink: #171a15;--color-paper: var(--color-parchment);--color-forest: var(--color-moss);--color-leaf: #68745e;--color-deep-water: #435a3e;--color-sky: var(--color-mist);--color-sun: var(--color-parchment);--color-coral: var(--color-bark);--color-violet-night: var(--color-bark);--color-ocarina-action: #6ca6d9;--theme-background-art: none;--theme-accent-art: none;--font-display: "Hylia Serif", "Trebuchet MS", "Gill Sans", "Avenir Next", sans-serif;--font-body: Georgia, "Times New Roman", serif;--font-glyph: "BOTW Sheikah", "Hylia Serif", serif;--font-size-1: .875rem;--font-size-2: 1rem;--font-size-3: 1.125rem;--font-size-4: 1.35rem;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.5rem;--space-6: 2rem;--space-7: 3rem;--space-8: 4rem;--radius-1: .375rem;--radius-2: .5rem;--control-size-md: 2.75rem;--control-size-lg: 3.5rem;--control-size-xl: 4.5rem;--motion-quick: .18s ease;--motion-fast: var(--motion-quick);--motion-gentle: .36s cubic-bezier(.2, .8, .2, 1);--shadow-stage: 0 1.25rem 4rem color-mix(in srgb, var(--color-ink) 46%, transparent)}*{box-sizing:border-box}html{min-width:320px;min-height:100%;background:var(--color-ink);font-family:var(--font-body);text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{min-width:320px;min-height:100vh;margin:0}button,a{min-height:var(--control-size-md)}img,svg,video,canvas{max-width:100%}