:root{--paper: #f4eedf;--paper-deep: #e9e0cc;--ink: #1d1a16;--ink-soft: #5f574a;--rule: #cfc4ab;--rule-strong: #8f8571;--hot: #d8401c;--hot-soft: #f6c9b5;--cool: #1f5f5b;--debug: #e5b54a;--block: #fffaf0;--display: "Fraunces", "Iowan Old Style", Georgia, serif;--body: "Instrument Sans", "Avenir Next", sans-serif;--mono: "DM Mono", ui-monospace, Menlo, monospace}*{box-sizing:border-box}html,body{margin:0}html{touch-action:manipulation}body{overflow-x:clip}body{background:var(--paper);background-image:radial-gradient(circle at 12% -10%,rgba(216,64,28,.07),transparent 45%),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 .2 0 0 0 0 .15 0 0 0 0 .1 0 0 0 .07 0'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");color:var(--ink);font:16px/1.5 var(--body);min-height:100vh}[hidden]{display:none!important}button,select,textarea,input{font:inherit;color:inherit}button{cursor:pointer}.masthead{display:flex;align-items:baseline;gap:2rem;padding:1rem max(clamp(1rem,4vw,3rem),env(safe-area-inset-right)) .8rem max(clamp(1rem,4vw,3rem),env(safe-area-inset-left));border-bottom:1.5px solid var(--ink);position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--paper) 92%,transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.logo{font:600 1.7rem/1 var(--display);letter-spacing:-.02em;color:var(--ink);text-decoration:none}.logo i{color:var(--hot);font-weight:400}.song-head{display:flex;align-items:center;gap:1.6rem;flex:1;min-width:0}.back{flex:none;align-self:center;display:inline-grid;place-items:center;width:1.8rem;height:1.8rem;margin:0 -.9rem 0 -.35rem;border-radius:50%;color:var(--ink-soft);text-decoration:none;transition:color .15s,background .15s}.back svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}.back:hover{color:var(--hot);background:var(--block)}.back:hover svg{transform:translate(-2px)}.back[hidden]{display:none}.song-title{font:600 1.25rem/1.2 var(--display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:0 1 auto;min-width:4rem}.song-title em{font-weight:400;color:var(--ink-soft);margin-left:.6rem}.facts{display:flex;flex:none;white-space:nowrap;gap:1.2rem;margin:0;font:.78rem var(--mono);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em}.facts div{display:flex;gap:.4rem}.facts dt{opacity:.7}.facts dd{margin:0;color:var(--ink)}.facts-group{margin-left:auto;display:flex;align-items:center;gap:.5rem}.facts-more{display:flex}.more-button{padding:0 .2rem;height:1rem;border:0;background:none;color:var(--ink-soft);display:grid;place-items:center;transition:color .15s}.more-button svg{width:1.2rem;height:1.2rem;fill:currentColor;transform:translateY(-2px)}.more-button:hover,.more-button[aria-expanded=true]{color:var(--hot)}.menu.facts-list{margin:0;padding:.9rem 1.1rem;gap:.6rem;min-width:15rem}.facts-list div{display:flex;justify-content:space-between;gap:2rem;align-items:baseline}.facts-list dt{font:.68rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft)}.facts-list dd{margin:0;font:.85rem var(--mono);color:var(--ink);text-align:right}.facts-feedback{margin-top:.2rem;padding-top:.7rem;border-top:1px solid var(--rule)}.facts-feedback dd a{color:var(--ink);font:.85rem var(--body);text-decoration:underline;text-underline-offset:3px}.head-actions{margin-left:auto;display:flex;flex:none;gap:.6rem;align-items:center;white-space:nowrap}.ghost{background:none;border:1px solid var(--rule-strong);border-radius:999px;padding:.3rem .9rem;font-size:.85rem;text-decoration:none;color:var(--ink)}.ghost:hover{border-color:var(--ink);background:var(--block)}.dropdown{position:relative}.dropdown[hidden]{display:none}.menu-button{display:inline-flex;align-items:center;gap:.45rem}.menu-button:after{content:"";width:.35rem;height:.35rem;border:solid currentColor;border-width:0 1.5px 1.5px 0;transform:translateY(-.12rem) rotate(45deg);transition:transform .15s}.menu-button[aria-expanded=true]:after{transform:translateY(.08rem) rotate(-135deg)}.edit-menu:has([aria-pressed=true]) .menu-button{background:var(--cool);border-color:var(--cool);color:var(--paper)}.menu{position:absolute;top:calc(100% + .4rem);right:0;z-index:40;min-width:12rem;width:max-content;max-width:min(22rem,90vw);display:grid;padding:.35rem;background:var(--paper);border:1.5px solid var(--ink);border-radius:12px;box-shadow:0 10px 28px #1d1a1629}.menu[hidden]{display:none}.menu-item{display:flex;align-items:center;justify-content:space-between;gap:1rem;background:none;border:0;border-radius:8px;padding:.5rem .75rem;text-align:left;font-size:.9rem;color:var(--ink);cursor:pointer}.menu-item:hover,.menu-item:focus-visible{background:var(--block);outline:none}.menu-item:disabled{opacity:.45;cursor:default;background:none}.menu-item.danger{color:var(--hot)}a.menu-item{text-decoration:none}.menu-item.debug-item:after{content:"Debug";padding:.08rem .35rem;border-radius:4px;background:var(--debug);color:var(--ink);font:600 .55rem/1.2 var(--mono);text-transform:uppercase;letter-spacing:.1em}.menu-install-tip{margin:0;padding:.1rem .8rem .5rem;font-size:.84rem;line-height:1.4;color:var(--ink-soft);white-space:normal;width:0;min-width:100%;box-sizing:border-box}.menu-item[aria-pressed=true]:after{content:"on";font:.7rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--cool)}.library{max-width:880px;margin:0 auto;padding:3rem clamp(1rem,4vw,3rem) 6rem;display:grid;gap:2.6rem}#library{display:flex;flex-direction:column;min-height:calc(100vh - var(--masthead-h, 3.55rem));padding-bottom:2rem}#library>footer{margin-top:auto}.intro h1{font:400 clamp(2.6rem,7vw,4.6rem)/.98 var(--display);letter-spacing:-.035em;margin:0 0 1rem}.intro h1 i{color:var(--hot)}.intro p{max-width:34rem;color:var(--ink-soft);font-size:1.08rem;margin:0}.import{display:grid;grid-template-columns:minmax(0,1fr);overflow:hidden;margin:-.4rem;padding:.4rem}.import-view{grid-area:1 / 1;transition:transform .45s cubic-bezier(.3,.7,.2,1),opacity .35s,visibility 0s .45s}.import[data-view=progress] .upload,.import[data-view=form] .importing{opacity:0;visibility:hidden;pointer-events:none}.import[data-view=progress] .upload{transform:translate(-104%)}.import[data-view=form] .importing{transform:translate(104%)}.import[data-view=form] .upload,.import[data-view=progress] .importing{transition-delay:0s}.importing{display:flex;flex-direction:column;gap:.4rem}.importing-list li:last-child{border-bottom:0}.importing-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;padding-top:.8rem;border-top:1px solid var(--rule)}.importing-foot p{margin:0;font-size:.88rem;color:var(--ink-soft);max-width:30rem}.upload-actions{display:flex;align-items:center;gap:1rem}.text-button{background:none;border:0;padding:0;font-size:.88rem;color:var(--ink-soft);text-decoration:underline;text-underline-offset:3px;cursor:pointer}.text-button:hover{color:var(--hot)}.upload,.importing{padding:1.4rem 1.6rem;border:1.5px solid var(--ink);border-radius:14px;background:var(--block)}.upload{display:flex;flex-direction:column;gap:1rem}.upload h2,.importing h2{border:0;padding:0;margin:0}.drop{display:grid;justify-items:center;gap:.3rem;padding:1.8rem 1rem;cursor:pointer;text-align:center;border:1.5px dashed var(--rule-strong);border-radius:12px;background:var(--paper);transition:border-color .15s,background .15s}.drop:hover,.drop.over{border-color:var(--hot);background:color-mix(in srgb,var(--hot-soft) 30%,var(--paper))}.drop-icon{width:1.8rem;height:1.8rem;fill:none;stroke:var(--hot);stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin-bottom:.2rem}.drop-title{font:600 1.15rem var(--display)}.drop-sub{font:.74rem var(--mono);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.08em}.drop.chosen{border-style:solid;border-color:var(--ink)}.link{display:grid;gap:.5rem}.field-label{font:.72rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft)}.upload .or{display:flex;align-items:center;gap:.8rem;font:.72rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft)}.upload .or:before,.upload .or:after{content:"";flex:1;border-top:1px solid var(--rule)}.upload .or[hidden]{display:none}.upload-head{display:flex;align-items:center;gap:.8rem}.upload-head h2{flex:1}.tokens-left{font:.74rem var(--mono);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em}.link input{padding:.65rem 1rem;border:1px solid var(--rule-strong);border-radius:10px;background:var(--paper);font:.95rem var(--body)}.link input:focus{outline:2px solid var(--hot);outline-offset:1px}.ultrastar-field{display:grid;gap:.5rem;padding:1.05rem .8rem .7rem}.ultrastar-field[hidden]{display:none}.ultrastar-field textarea{margin-top:0;min-height:4.5rem;font:.8rem var(--mono);resize:vertical}.finder{display:grid;gap:.55rem}.finder[hidden]{display:none}.finder-field{position:relative;display:block}.finder-field svg{position:absolute;left:.95rem;top:50%;width:1.15rem;height:1.15rem;transform:translateY(-50%);fill:none;stroke:var(--ink-soft);stroke-width:1.8;stroke-linecap:round;pointer-events:none}.finder-field input{width:100%;padding:.8rem 1rem .8rem 2.7rem;border:1.5px solid var(--ink);border-radius:12px;background:var(--paper);font:1.02rem var(--body);color:var(--ink)}.finder-field input:focus{outline:2px solid var(--hot);outline-offset:1px}.found{list-style:none;margin:0;padding:.3rem;display:grid;gap:.15rem;border:1px solid var(--rule);border-radius:12px;background:var(--paper)}.found[hidden]{display:none}.found li{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:.8rem;padding:.4rem .55rem;border-radius:9px;cursor:pointer}.found li.chosen{background:color-mix(in srgb,var(--hot-soft) 45%,var(--paper))}.found-thumb{width:4.4rem;aspect-ratio:16 / 9;border-radius:6px;object-fit:cover;background:var(--rule);display:block}.found-text{display:grid;gap:.1rem;min-width:0}.found-title{font-weight:600;font-size:.95rem;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.found-meta{font-size:.8rem;color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.found-go{font:.72rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--hot);opacity:0}.found li.chosen .found-go{opacity:1}.found-note{margin:0;font-size:.84rem;color:var(--ink-soft);min-height:1.2em}@media(max-width:720px){.found li{grid-template-columns:auto 1fr;gap:.6rem;padding:.4rem}.found-thumb{width:3.4rem}.found-go{display:none}}.found-note.problem{color:var(--hot)}.other-ways{display:grid;gap:.9rem}.other-ways>summary{font-size:.92rem;color:var(--ink);list-style:none;display:flex;align-items:center;gap:.5rem}.other-ways>summary::-webkit-details-marker{display:none}.other-ways>summary:before{content:"+";font:600 1rem var(--mono);color:var(--hot);width:.8rem}.other-ways[open]>summary{margin-bottom:.9rem}.other-ways[open]>summary:before{content:"−"}.other-ways>summary[hidden]{display:none}.other-ways .link+.or,.other-ways .or+.drop{margin-top:.9rem}.form-error{color:var(--hot);font-size:.9rem;margin:0}details summary{cursor:pointer;color:var(--ink-soft);font-size:.92rem}textarea{width:100%;margin-top:.6rem;padding:.8rem 1rem;resize:vertical;border:1px solid var(--rule-strong);border-radius:10px;background:var(--block);line-height:1.5}textarea:focus{outline:2px solid var(--hot);outline-offset:1px}.upload-row{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:auto;padding-top:.9rem;border-top:1px solid var(--rule)}.upload-row label{font-size:.9rem;color:var(--ink-soft);display:flex;gap:.5rem;align-items:center}select{border:1px solid var(--rule-strong);border-radius:8px;background:var(--block);padding:.25rem .5rem}button[type=submit],#lyrics-save{background:var(--ink);color:var(--paper);border:0;border-radius:999px;padding:.6rem 1.5rem;font-weight:600}button[type=submit]:disabled{opacity:.35;cursor:not-allowed}button[type=submit]:not(:disabled):hover,#lyrics-save:hover{background:var(--hot)}.library h2{font:600 .8rem var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft);border-bottom:1px solid var(--rule);padding-bottom:.5rem;margin:0 0 .2rem}.songs{list-style:none;margin:0;padding:0}.songs li{border-bottom:1px solid var(--rule)}.songs .pending{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.35rem 0;align-items:center;padding:.95rem .2rem}.songs .pending>*{grid-column:1 / -1}.songs .pending .name{grid-column:1;font-size:1.15rem;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.songs .pending .song-cancel{grid-column:2;grid-row:1;margin:-.45rem -.45rem -.45rem .5rem;width:2.5rem;height:2.5rem}.pending-error{font-size:.9rem;line-height:1.4;overflow-wrap:anywhere;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}.pending-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:.45rem}.songs .song{display:grid;grid-template-columns:auto 1fr auto auto;gap:1rem;align-items:center;padding:.7rem .2rem}.song-open{display:grid;gap:.15rem;color:inherit;text-decoration:none;min-width:0;padding:.25rem 0}.song-practice{font-size:.84rem;color:var(--ink-soft)}.song-open:hover .name{color:var(--hot)}.song-play{width:2.4rem;height:2.4rem;border-radius:50%;border:1.5px solid var(--ink);background:transparent;color:var(--ink);display:grid;place-items:center;padding:0;transition:background .15s,color .15s}.song-play svg{width:1rem;height:1rem;fill:currentColor;margin-left:2px}.song-play:hover{background:var(--hot);border-color:var(--hot);color:var(--paper)}.song-delete{display:inline-flex;align-items:center;gap:.35rem;height:2rem;padding:0 .45rem;border-radius:999px;border:1px solid transparent;background:transparent;color:var(--ink-soft);font-size:.8rem;opacity:.55;transition:opacity .15s,color .15s,border-color .15s}.song-delete svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.song-delete span{display:none}.songs li:hover .song-delete,.song-delete:focus-visible{opacity:1}.song-delete:hover{color:var(--hot)}.song-delete.armed{opacity:1;color:var(--paper);background:var(--hot);border-color:var(--hot);padding:0 .7rem 0 .55rem}.song-delete.armed span{display:inline;font-weight:600}.songs .name{font:600 1.3rem var(--display)}.songs .name em{font-weight:400;color:var(--ink-soft);margin-left:.5rem;font-size:1rem}.songs .meta{font:.78rem var(--mono);color:var(--ink-soft);text-transform:uppercase;letter-spacing:.06em}.songs .bar-progress{grid-column:1 / -1;height:3px;background:var(--rule);border-radius:2px;overflow:hidden}.songs .bar-progress i{display:block;height:100%;background:var(--hot);transition:width .6s}.songs .failed .meta{color:var(--hot)}.song-cancel{display:inline-grid;place-items:center;width:1.9rem;height:1.9rem;padding:0;border-radius:50%;border:1px solid transparent;background:transparent;color:var(--ink-soft);transition:color .15s,border-color .15s}.song-cancel svg{width:.95rem;height:.95rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.song-cancel:hover:not(:disabled){color:var(--hot);border-color:var(--hot)}.song-cancel:disabled{opacity:.4;cursor:default}.song-retry{display:inline-flex;align-items:center;gap:.45rem;height:2.5rem;padding:0 1.05rem 0 .85rem;border:0;border-radius:999px;background:var(--ink);color:var(--paper);font-weight:600;font-size:.9rem;transition:background .15s}.song-retry svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.song-retry:hover:not(:disabled){background:var(--hot)}.song-retry:disabled{opacity:.4;cursor:default}.pending .song-delete{height:2.5rem;padding:0 1.05rem 0 .85rem;font-size:.9rem;opacity:1}.pending .song-delete:not(.armed){border-color:var(--rule-strong);color:var(--ink)}.pending .song-delete:not(.armed):hover{border-color:var(--hot);color:var(--hot)}.pending .song-delete span{display:inline;font-weight:600}.empty{color:var(--ink-soft);padding:1rem .2rem;margin:0}.your-songs{display:grid;gap:1rem}.songs-head{display:flex;align-items:center;justify-content:space-between;gap:1rem;border-bottom:1px solid var(--rule);padding-bottom:.6rem}.songs-head h2{border:0;padding:0;margin:0}.songs-tools{display:flex;align-items:center;gap:.8rem}.songs-tools select{-moz-appearance:none;appearance:none;-webkit-appearance:none;border:0;border-radius:6px;cursor:pointer;padding:.3rem 1.6rem .3rem .45rem;font:.84rem var(--body);color:var(--ink-soft);background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 9l6 6 6-6' fill='none' stroke='%235f574a' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") right .4rem center / .85rem no-repeat}.songs-tools select:hover{color:var(--ink);background-color:var(--block)}.songs-tools select:focus-visible{outline:2px solid var(--hot);outline-offset:1px}.add-song{display:inline-flex;align-items:center;gap:.4rem;padding:.5rem 1.1rem .5rem .85rem;border:0;border-radius:999px;background:var(--ink);color:var(--paper);font-weight:600;font-size:.9rem;transition:background .15s}.add-song svg{width:1.05rem;height:1.05rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.add-song:hover,.add-song[aria-expanded=true]{background:var(--hot)}.add-song[hidden]{display:none}.add-song svg{transition:transform .2s}.song-search{width:min(22rem,100%);padding:.5rem .95rem;border:1px solid var(--rule-strong);border-radius:999px;background:var(--block);font:.9rem var(--body);color:var(--ink)}.song-search:focus{outline:2px solid var(--hot);outline-offset:1px}.import[hidden]{display:none}.song-groups{display:grid;gap:1.6rem}.continue{display:flex;align-items:center;gap:1.1rem;padding:1.1rem 1.4rem;border:1.5px solid var(--ink);border-radius:14px;background:var(--block)}.continue[hidden]{display:none}.continue-play{flex:none;width:3.4rem;height:3.4rem;border-radius:50%;border:0;background:var(--hot);color:var(--paper);display:grid;place-items:center;padding:0;transition:transform .1s}.continue-play svg{width:1.4rem;height:1.4rem;fill:currentColor;margin-left:3px}.continue-play:active{transform:scale(.94)}.continue-text{display:grid;gap:.2rem;min-width:0;color:inherit;text-decoration:none}.continue-label{font:.72rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft)}.continue-name{font:600 1.4rem/1.2 var(--display);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.continue-name em{font-weight:400;color:var(--ink-soft);margin-left:.5rem;font-size:1.05rem}.continue-meta{font-size:.86rem;color:var(--ink-soft)}.continue-text:hover .continue-name{color:var(--hot)}.page-drop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:80;display:grid;place-items:center;pointer-events:none;background:color-mix(in srgb,var(--paper) 82%,transparent);border:3px dashed var(--hot)}.page-drop[hidden]{display:none}.page-drop p{font:600 clamp(1.6rem,4vw,2.4rem) var(--display);color:var(--hot);margin:0}@media(max-width:720px){.songs-head{flex-wrap:nowrap}.add-song{position:fixed;z-index:40;right:max(1rem,env(safe-area-inset-right));bottom:calc(1.2rem + env(safe-area-inset-bottom));width:3.5rem;height:3.5rem;padding:0;gap:0;justify-content:center;border-radius:50%;font-size:0;box-shadow:0 6px 18px #1d1a1647}.add-song svg{width:1.5rem;height:1.5rem}.add-song[aria-expanded=true] svg{transform:rotate(45deg)}#library{padding-bottom:6rem}html.sheet-open,html.sheet-open body{overflow:hidden}html.sheet-open .add-song{display:none}.import.sheet{position:fixed;z-index:70;left:0;right:0;top:var(--view-top, 0px);height:var(--view-height, 100dvh);margin:0;padding:0;background:var(--paper);overflow-y:auto;overscroll-behavior:contain}.import.sheet .upload{min-height:100%;border:0;border-radius:0;background:transparent;gap:.9rem;padding:max(.9rem,env(safe-area-inset-top)) max(1rem,env(safe-area-inset-right)) max(1rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}.import.sheet .upload-head h2{font:600 1.45rem var(--display);letter-spacing:0;text-transform:none;color:var(--ink);border:0;padding:0;margin:0}.import.sheet .song-cancel{width:2.75rem;height:2.75rem;margin-right:-.6rem;color:var(--ink)}.import.sheet .song-cancel svg{width:1.2rem;height:1.2rem}.import.sheet .finder-field{position:sticky;top:env(safe-area-inset-top);z-index:1;padding:.3rem 0;margin:-.3rem 0;background:var(--paper)}.import.sheet .found{border:0;padding:0;background:transparent;gap:0}.import.sheet .found li{padding:.6rem .2rem;border-radius:0;border-bottom:1px solid var(--rule)}.import.sheet .found li.chosen{background:transparent}.import.sheet .found li:active{background:var(--block)}.import.sheet .found-thumb{width:4.2rem}.import.sheet:has(#find:focus) .upload-row{display:none}.continue{padding:.9rem 1rem;gap:.9rem}.continue-name{font-size:1.2rem}.upload,.importing{padding:1.1rem 1rem}.import{position:relative}.import[data-view=progress] .upload,.import[data-view=form] .importing{position:absolute;inset:0 0 auto}}.song-group h3{font:italic 400 1.15rem var(--display);color:var(--ink-soft);margin:0;padding-bottom:.2rem;border-bottom:1.5px solid var(--ink)}.song-group h3.unknown{font-style:normal;font:.78rem var(--mono);text-transform:uppercase;letter-spacing:.08em}.player{padding:0 clamp(1rem,4vw,3rem) 11rem}.now{position:sticky;top:var(--masthead-h, 3.55rem);z-index:15;min-height:5.6rem;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:0 .5ch;padding:1rem 0;margin-bottom:1rem;font:400 clamp(1.5rem,3.4vw,2.5rem)/1.2 var(--display);letter-spacing:-.01em;background:linear-gradient(var(--paper) 78%,transparent)}.now .w{white-space:nowrap}.now .s{color:color-mix(in srgb,var(--ink) 32%,transparent);transition:color .08s}.now .s.past{color:var(--ink)}.now .s.on{color:var(--hot)}.now .idle{color:var(--ink-soft);font-style:italic;font-size:1.1rem}.now .next-line{flex-basis:100%;min-height:1.3em;margin-top:.15rem;text-align:center;font-size:.58em;line-height:1.3;color:var(--ink-soft)}.now .countdown{flex-basis:100%;text-align:center;font:.72rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft)}.score{position:relative;display:grid;gap:1.1rem;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}.system{display:flex;position:relative;border-left:1.5px solid var(--ink)}.system.quiet .bar{height:46px}.system.quiet .count:not(.beat),.system.quiet .tick:not(.beat){display:none}.system.quiet .count{bottom:12px;opacity:.55}.unsure-note{margin:1rem clamp(1rem,4vw,3rem) 0;padding:.7rem 1rem;font-size:.92rem;border:1px dashed var(--hot);border-radius:10px;background:#f6c9b54d}.unsure-bar{display:flex;align-items:center;gap:.4rem 1rem;padding:.3rem clamp(.5rem,2vw,1.5rem) .3rem clamp(1rem,4vw,3rem);font-size:.86rem;background:var(--hot);color:var(--paper)}.unsure-bar[hidden]{display:none}.unsure-bar p{flex:1;margin:0}.unsure-actions{display:flex;flex:none;align-items:center;gap:.3rem}.unsure-bar .ghost{border-color:#f4eedf99}.unsure-bar .ghost:hover{border-color:var(--paper);background:#f4eedf26}.unsure-bar .song-cancel{color:var(--paper)}.unsure-bar .song-cancel:hover{color:var(--paper);border-color:var(--paper)}.system.current .bar{background:#fffaf0bf}.bar{position:relative;height:calc(138px + var(--hear-rows, 0) * 13px);min-width:0;cursor:pointer;border-right:1.5px solid var(--ink);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);transition:background .2s}.bar.in-loop{box-shadow:inset 0 -4px 0 var(--cool)}.bar-num{position:absolute;top:-1px;left:0;font:500 .68rem var(--mono);background:var(--ink);color:var(--paper);padding:0 .35rem;line-height:1.5;z-index:2}.bar.in-loop .bar-num{background:var(--cool)}.tick{position:absolute;top:0;bottom:0;width:1px;pointer-events:none;background:repeating-linear-gradient(to bottom,var(--rule) 0 1px,transparent 1px 3px)}.tick.beat{background:var(--rule-strong)}.tick.half{background:repeating-linear-gradient(to bottom,var(--rule-strong) 0 4px,transparent 4px 7px);opacity:.6}.count{position:absolute;bottom:5px;font:.72rem var(--mono);color:var(--rule-strong);transform:translate(4px);pointer-events:none}.count.beat{color:var(--ink);font-weight:500;font-size:.86rem}.count.hit{color:var(--hot)}.syl{position:absolute;top:24px;height:84px;pointer-events:none}.syl .note{position:absolute;left:-2px;top:0;width:22px;height:34px;fill:var(--ink);stroke:var(--ink)}.syl .body{position:absolute;left:1px;right:2px;top:40px;height:34px;border:1.2px solid var(--ink);border-radius:4px 9px 9px 4px;background:var(--block);overflow:hidden;display:flex;align-items:center}.syl.line-start .body{border-left:4px solid var(--ink)}.syl .fill{position:absolute;inset:0 auto 0 0;width:0;background:var(--hot-soft)}.syl .text{position:relative;padding:0 5px;font:600 15px/1 var(--body);font-stretch:88%;white-space:nowrap}.syl.tie .body{border-left:0;border-radius:0 9px 9px 0;left:-1px;background:repeating-linear-gradient(90deg,var(--block) 0 6px,transparent 6px 9px)}.syl.cont .body{border-right:0;border-radius:4px 0 0 4px;right:-1px}.syl.unsure .body{border-style:dashed}.syl.unsure .note{opacity:.45}.syl.past .body{background:var(--paper-deep)}.syl.past .fill{width:100%!important;opacity:.45}.syl.on .body{border-color:var(--hot);box-shadow:0 2px 0 var(--hot)}.syl.on .note{fill:var(--hot);stroke:var(--hot)}.ghost[aria-pressed=true]{background:var(--cool);border-color:var(--cool);color:var(--paper)}.edit-help{display:flow-root;margin:0;padding:.35rem clamp(1rem,4vw,3rem);font-size:.8rem;line-height:1.45;background:var(--cool);color:var(--paper);-webkit-text-size-adjust:100%;text-size-adjust:100%}.edit-help #edit-state{float:right;margin-left:.6rem;font:.72rem/1.6rem var(--mono);text-transform:uppercase;letter-spacing:.08em;opacity:.85}.edit-tools{float:right;display:flex;gap:.35rem;margin:-.1rem 0 0 .6rem}.edit-tools button{display:grid;place-items:center;width:1.6rem;height:1.6rem;padding:0;border:1px solid rgba(244,238,223,.5);border-radius:50%;background:none;color:var(--paper);font:600 .75rem/1 var(--body)}.edit-tools button:hover:not(:disabled){border-color:var(--paper);background:#f4eedf26}.edit-tools button:disabled{opacity:.35;cursor:default}.edit-tools svg{width:.95rem;height:.95rem;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}.edit-help.brief>:not(b,#edit-state,.edit-tools){display:none}.editing .bar{cursor:default}.editing .syl :is(.body,.grip){pointer-events:auto;touch-action:none}.editing .syl .body{cursor:grab}.editing .syl .body:active{cursor:grabbing}.syl .grip{display:none;position:absolute;top:40px;height:34px;cursor:ew-resize;right:0;width:min(14px,34%)}.editing .syl .grip{display:block}.editing .syl .grip:after{content:"";position:absolute;right:4px;top:9px;bottom:9px;width:2px;border-radius:1px;background:var(--rule-strong)}.editing .syl.selected .grip{right:max(-7px,-17%)}.editing .syl.selected .grip:after{right:calc(50% + 2px)}.syl.edited .body{border-color:var(--cool)}.syl.selected .body{outline:2px solid var(--cool);outline-offset:2px}.editing .syl.selected{z-index:3}.grid-place{position:absolute;top:59px;height:44px;margin-left:-4px;padding-right:8px;box-sizing:content-box;border:1.5px dashed var(--cool);border-radius:7px 12px 12px 7px;pointer-events:none;z-index:4}@media(pointer:coarse){.edit-help .keys{display:none}.edit-tools{gap:.5rem;margin-block:-.3rem}.edit-tools button{width:2.1rem;height:2.1rem}.edit-help #edit-state{line-height:1.5rem}.editing .syl.selected .grip{right:-18px;width:calc(18px + min(8px,34%))}.editing .syl.selected .grip:after{right:20px}}.syl.deleted{display:none}.editing .syl.deleted{display:block;opacity:.35}.editing .syl.deleted .text{text-decoration:line-through}.editing .syl.deleted .body{border-style:dashed}.chord{position:absolute;top:1px;z-index:2;pointer-events:none;transform:translate(4px);font:600 1rem/1.25 var(--display);color:var(--cool);white-space:nowrap}.chord.at-start{transform:translate(28px)}.chord.carried{opacity:.5;font-weight:400}.chord.tight .chord-bass{font-size:.7em}.chord.stacked{line-height:1.05}.chord.stacked .chord-bass{display:block;font-size:.7em}.hide-chords .chord{display:none}.cmp{position:absolute;top:calc(112px + var(--lane, 0) * 15px);height:14px;box-sizing:border-box;z-index:3;overflow:hidden;white-space:nowrap;border-radius:3px;background:var(--rule);color:var(--ink-soft);font:500 10px/14px var(--mono);padding-left:3px;border-left:2px solid var(--lane-color, var(--rule-strong))}.lane-0{--lane-color: #7a4fd1;--lane-light: #cdbff0;--lane-dark: #3b2470}.lane-1{--lane-color: #1f8a70;--lane-light: #bde3d6;--lane-dark: #0f4d3d}.lane-2{--lane-color: #d1641f;--lane-light: #f3d2bb;--lane-dark: #7a3a10}.lane-3{--lane-color: #b8336a;--lane-light: #efc1d6;--lane-dark: #6a1a3c}.cmp.resized{background:var(--lane-light);color:var(--lane-dark)}.cmp.moved{background:var(--lane-color);border-left-color:var(--lane-dark);color:#fff}.cmp.lit,.syl.lit .body{outline:2px solid #7a4fd1;outline-offset:1px}.comparing .syl.b-moved .body{box-shadow:inset 0 -3px #7a4fd1}.compare{display:flex;gap:.8rem;align-items:center;flex-wrap:wrap}.compare .stats{opacity:.8}.swatch{display:inline-block;width:10px;height:10px;border-radius:2px;background:var(--lane-color)}.show-tab .cmp{top:calc(196px + var(--lane, 0) * 15px)}.show-tab .sug{top:195px}.score:is(.comparing,.suggesting) .bar{height:calc(142px + max(var(--lanes, 1),1)*15px)}.score:is(.comparing,.suggesting).has-strum:not(.hide-strum) .bar{height:calc(164px + max(var(--lanes, 1),1)*15px)}.score:is(.comparing,.suggesting).show-tab .bar{height:calc(226px + max(var(--lanes, 1),1)*15px)}.score:is(.comparing,.suggesting).show-tab.has-strum:not(.hide-strum) .bar{height:calc(248px + max(var(--lanes, 1),1)*15px)}.score:is(.comparing,.suggesting) .system.quiet .bar{height:calc(46px + var(--hear-rows, 0) * 13px)}.sug{position:absolute;top:111px;height:16px;box-sizing:border-box;z-index:4;display:flex;align-items:center;justify-content:space-between;gap:2px;overflow:hidden;border:1.5px dashed var(--cool);border-radius:4px;background:#dcefe9;color:var(--cool);font:600 10px/1 var(--mono);padding:0 1px 0 3px;white-space:nowrap;cursor:pointer;pointer-events:auto}.sug:hover{background:var(--cool);color:var(--paper)}.sug button{all:unset;cursor:pointer;padding:0 3px;font-size:10px;opacity:.7}.sug button:hover{opacity:1}#sug-count{font-weight:600}#compare-stats{font:.72rem var(--mono);opacity:.8}.strum{position:absolute;bottom:25px;z-index:1;pointer-events:auto;transform:translate(2px);font:700 20px/1 var(--body);color:var(--cool);opacity:.4}.strum.strong{opacity:1}.hide-strum .strum{display:none}.score.has-strum:not(.hide-strum) .bar{height:calc(160px + var(--hear-rows, 0) * 13px)}.score.has-strum.show-tab:not(.hide-strum) .bar{height:calc(260px + var(--hear-rows, 0) * 13px)}.score.has-strum:not(.hide-strum) .system.quiet .bar{height:calc(76px + var(--hear-rows, 0) * 13px)}.score.has-strum:not(.hide-strum) .system.quiet .count{bottom:5px}.tabstaff{display:none;position:absolute;left:0;right:0;top:112px;height:61px;pointer-events:none;background:repeating-linear-gradient(to bottom,var(--rule-strong) 0 1px,transparent 1px 12px)}.system .bar:first-child .tabstaff:before{content:"e\a B\aG\a D\a A\a E";white-space:pre;position:absolute;left:-13px;top:-6px;font:9px/12px var(--mono);color:var(--rule-strong)}.syl .fret,.syl .pitch{display:none;position:absolute;left:1px;cursor:pointer;pointer-events:auto;-webkit-user-select:none;user-select:none}.syl.sounding .body{box-shadow:0 0 0 3px var(--cool)}.syl.sounding .fret{background:var(--cool);color:var(--paper)}.syl .fret{font:600 12px/12px var(--mono);padding:0 2px;border-radius:3px;background:var(--block);color:var(--ink);pointer-events:auto}.syl .pitch{top:156px;font:10px/1 var(--mono);color:var(--ink-soft);white-space:nowrap}.show-tab .bar{height:calc(238px + var(--hear-rows, 0) * 13px)}.show-tab .tabstaff,.show-tab .syl .fret,.show-tab .syl .pitch{display:block}.show-tab .system.quiet .bar{height:46px}.show-tab .system.quiet .tabstaff{display:none}.syl.on .fret{background:var(--hot);color:var(--paper)}.syl.unsure .fret,.syl.unsure .pitch{opacity:.55}.playhead{position:absolute;width:2px;background:var(--hot);z-index:5;pointer-events:none;will-change:transform;top:0;left:0}.playhead:before{content:"";position:absolute;top:-5px;left:-5px;border:6px solid transparent;border-top-color:var(--hot)}.transport{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;flex-direction:column;background:var(--ink);color:var(--paper)}@supports (height: 100dvh){.transport{bottom:auto;top:100dvh;transform:translateY(-100%)}}.transport-row{display:flex;align-items:center;gap:1.4rem;padding:.8rem max(clamp(1rem,4vw,3rem),env(safe-area-inset-right)) max(.8rem,calc(env(safe-area-inset-bottom) + .2rem)) max(clamp(1rem,4vw,3rem),env(safe-area-inset-left))}.transport-bar{display:flex;align-items:center;gap:1.6rem;flex:1;min-width:0}.transport-bar>*{flex-shrink:0}.more-toggle{flex:none;margin-left:auto;width:2.5rem;height:2.5rem;padding:0;display:grid;place-items:center;background:transparent;color:var(--paper);border:1px solid rgba(244,238,223,.4);border-radius:50%;transition:border-color .15s}.more-toggle svg{width:1.25rem;height:1.25rem;fill:currentColor}.more-toggle:hover{border-color:var(--paper)}.more-toggle[aria-expanded=true]{background:var(--paper);color:var(--ink);border-color:var(--paper)}.more-options{display:grid;gap:.9rem;padding:1rem clamp(1rem,4vw,3rem);border-bottom:1px solid rgba(244,238,223,.14);background:color-mix(in srgb,var(--ink) 88%,var(--paper));max-height:45vh;overflow-y:auto}.more-options[hidden]{display:none}.option-row{display:flex;align-items:center;gap:2rem;overflow-x:auto;padding:4px;margin:-4px;scrollbar-width:none}.option-row::-webkit-scrollbar{display:none}.option-row>*{flex:none}.option-row.more-right{-webkit-mask-image:linear-gradient(to right,#000 calc(100% - 3rem),transparent);mask-image:linear-gradient(to right,#000 calc(100% - 3rem),transparent)}.option-row.more-left{-webkit-mask-image:linear-gradient(to left,#000 calc(100% - 3rem),transparent);mask-image:linear-gradient(to left,#000 calc(100% - 3rem),transparent)}.option-row.more-left.more-right{-webkit-mask-image:linear-gradient(to right,transparent,#000 3rem,#000 calc(100% - 3rem),transparent);mask-image:linear-gradient(to right,transparent,#000 3rem,#000 calc(100% - 3rem),transparent)}.option-row[hidden]{display:none}.option-row+.option-row{padding-top:1.1rem;border-top:1px solid rgba(244,238,223,.1)}.more-options{gap:1.1rem;padding-top:1.2rem;padding-bottom:1.2rem}.more-options .toggle{height:2.25rem;padding:0 1.1rem}.explained{cursor:help}.more-options .option-row:has(.option-button){gap:1rem}.option-button>button{display:flex;align-items:center;gap:.5rem;height:2.5rem;padding:0 .95rem 0 .75rem;background:transparent;color:var(--paper);border:1px solid rgba(244,238,223,.4);border-radius:999px;font-size:.88rem;white-space:nowrap;transition:background .15s,border-color .15s}.option-button>button:hover,.option-button>button[aria-expanded=true]{border-color:var(--paper)}.option-button>button[aria-expanded=true]{background:#f4eedf1f}.option-button>button svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.option-value{font:.8rem var(--mono);color:color-mix(in srgb,var(--paper) 65%,transparent)}.option-button.active>button{background:var(--paper);color:var(--ink);border-color:var(--paper)}.option-button.active .option-value{color:var(--ink)}.option-panel{position:fixed;z-index:60;display:grid;gap:.65rem;width:max-content;min-width:14rem;max-width:min(19rem,calc(100vw - 16px));max-height:calc(100vh - 16px);max-height:calc(100dvh - 16px);overflow-y:auto;padding:.85rem .95rem .95rem;color:var(--paper);--panel-bg: color-mix(in srgb, var(--ink) 84%, var(--paper));background:var(--panel-bg);border:1px solid rgba(244,238,223,.22);border-radius:12px;box-shadow:0 10px 28px #00000059}.option-panel[hidden]{display:none}.option-head{margin:0;font:.7rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:color-mix(in srgb,var(--paper) 70%,transparent)}.option-about{margin:0;font-size:.82rem;line-height:1.4;color:color-mix(in srgb,var(--paper) 85%,transparent)}.option-panel .loop{display:flex;align-items:center;gap:.6rem}.option-panel .range input{height:2.25rem;width:4.2rem;text-align:center;-webkit-appearance:textfield;appearance:textfield;-moz-appearance:textfield}.option-panel .range input::-webkit-inner-spin-button,.option-panel .range input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.option-panel .stepper{gap:.6rem}.option-panel .stepper button{width:2.1rem;height:2.1rem}.option-panel .toggle{height:2.25rem;padding:0 1rem}.segments{display:inline-flex;justify-self:start;border:1px solid rgba(244,238,223,.4);border-radius:999px;overflow:hidden}.segments button{height:2.1rem;min-width:2.6rem;padding:0 .75rem;border:0;background:transparent;color:var(--paper);font:.85rem var(--mono)}.segments button+button{border-left:1px solid rgba(244,238,223,.25)}.segments button:hover{background:#f4eedf1a}.segments button[aria-pressed=true]{background:var(--paper);color:var(--ink)}.option-row:has(.check){gap:1rem}.option-row .knob+.check{margin-left:1rem}.more-options .check{position:relative;height:2.25rem;padding:0 1.1rem 0 .85rem;gap:.5rem;font-size:.9rem;border:1px solid rgba(244,238,223,.4);border-radius:999px;cursor:pointer;transition:background .15s,border-color .15s}.more-options .check:hover{border-color:var(--paper)}.more-options .check input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}.more-options .check:before{content:"";width:.95rem;height:.95rem;flex:none;border-radius:50%;box-sizing:border-box;border:1.5px solid rgba(244,238,223,.6)}.more-options .check:has(input:checked){background:var(--paper);color:var(--ink);border-color:var(--paper)}.more-options .check:has(input:checked):before{border:0;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.3l2.3 2.2 4.7-4.9' fill='none' stroke='%23f4eedf' stroke-width='1.9' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 100% no-repeat}.more-options .check:has(input:focus-visible){outline:1.5px solid var(--paper);outline-offset:2px}.more-options .option-row.debug-zone{margin:0;padding:1.05rem .7rem .55rem;gap:1.4rem;color:var(--debug)}.option-row+.option-row.debug-zone{padding-top:1.05rem;border-top:1px dashed color-mix(in srgb,var(--debug) 55%,transparent)}.option-row.debug-zone button,.option-row.debug-zone .check,.option-row.debug-zone .option-button>button{color:var(--debug);border-color:color-mix(in srgb,var(--debug) 55%,transparent)}.option-row.debug-zone button:hover,.option-row.debug-zone .check:hover{border-color:var(--debug);background:color-mix(in srgb,var(--debug) 14%,transparent)}.option-row.debug-zone .check:before{border-color:color-mix(in srgb,var(--debug) 75%,transparent)}.option-row.debug-zone .check:has(input:checked),.option-row.debug-zone [aria-pressed=true]{background:var(--debug);color:var(--ink);border-color:var(--debug)}.tip{display:none;position:fixed;z-index:60;width:max-content;max-width:min(18rem,calc(100vw - 16px));padding:.55rem .75rem;border-radius:8px;background:var(--paper);color:var(--ink);font:.82rem/1.4 var(--body);box-shadow:0 8px 24px #00000059;pointer-events:none}.tip.open{display:block}.play{width:54px;height:54px;border-radius:50%;border:0;background:var(--hot);display:grid;place-items:center;transition:transform .1s}.play:active{transform:scale(.94)}.play.loading{animation:pulse .8s ease-in-out infinite alternate}.play,.preview-play{position:relative}.play.counting svg,.preview-play.counting svg{visibility:hidden}.loaded{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none;font:600 .72rem var(--mono);color:var(--paper);letter-spacing:-.02em}.play.counting:after,.preview-play.counting:after{content:"";position:absolute;top:-4px;right:-4px;bottom:-4px;left:-4px;border-radius:50%;pointer-events:none;background:conic-gradient(var(--hot) calc(var(--loaded, 0) * 1turn),color-mix(in srgb,var(--hot) 22%,transparent) 0);-webkit-mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2.5px));mask:radial-gradient(farthest-side,transparent calc(100% - 3px),#000 calc(100% - 2.5px))}@keyframes pulse{to{opacity:.45}}.play-problem{position:absolute;left:0;bottom:calc(100% + 10px);z-index:5;width:max-content;max-width:min(17rem,calc(100vw - 2rem));padding:.55rem .75rem;border-radius:8px;background:var(--paper);color:var(--ink);text-align:left;font:.82rem/1.4 var(--body);box-shadow:0 8px 24px #00000059;pointer-events:none}.play-problem:after{content:"";position:absolute;top:100%;left:20px;border:7px solid transparent;border-top-color:var(--paper)}.play svg{width:24px;height:24px;fill:var(--paper)}.clock{display:grid;min-width:4.2rem}.clock b{font:500 1.5rem/1 var(--mono)}.clock>span{font:.75rem var(--mono);opacity:.6;white-space:nowrap}.knob{display:grid;grid-template-rows:1.25rem auto;align-items:center;gap:.15rem;font:.7rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:color-mix(in srgb,var(--paper) 70%,transparent)}.knob output{color:var(--paper)}.knob input[type=range]{width:120px;accent-color:var(--hot)}.knob select{background:transparent;color:var(--paper);border-color:#f4eedf59}.knob select option{color:var(--ink)}.stepper{display:flex;align-items:center;gap:.3rem}.stepper button{width:1.6rem;height:1.6rem;border-radius:50%;border:1px solid rgba(244,238,223,.4);background:transparent;color:var(--paper);font:1rem/1 var(--mono)}.stepper button:hover{border-color:var(--paper)}.stepper output{min-width:2rem;text-align:center;margin:0;font:.95rem var(--mono)}.toggle{background:transparent;color:var(--paper);border:1px solid rgba(244,238,223,.4);border-radius:999px;padding:.4rem 1rem;font-size:.85rem}.toggle[aria-pressed=true]{background:var(--paper);color:var(--ink);border-color:var(--paper)}.transport-bar .level+.level{margin-left:-.9rem}.level{position:relative}.level-button{display:flex;align-items:center;gap:.45rem;height:2.5rem;padding:0 .85rem 0 .7rem;background:transparent;color:var(--paper);border:1px solid rgba(244,238,223,.4);border-radius:999px}.level-button:hover,.level-button[aria-expanded=true]{border-color:var(--paper)}.level-button[aria-expanded=true]{background:#f4eedf1f}.level-button svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.level-button svg circle{fill:currentColor;stroke:none}.level-value{font:.8rem var(--mono);min-width:2.6rem;text-align:left}.level-slash{display:none;stroke:var(--hot);stroke-width:2}.level.can-be-off.at-rest .level-slash{display:inline}.level.can-be-off.at-rest .level-button{color:color-mix(in srgb,var(--paper) 55%,transparent)}.level-panel{position:absolute;bottom:calc(100% + .7rem);left:50%;transform:translate(-50%);z-index:5;display:grid;gap:.55rem;width:13rem;padding:.8rem .9rem .9rem;background:color-mix(in srgb,var(--ink) 84%,var(--paper));border:1px solid rgba(244,238,223,.22);border-radius:12px;box-shadow:0 10px 28px #00000059}.level-panel[hidden]{display:none}.level-head{display:flex;justify-content:space-between;align-items:baseline;font:.7rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:color-mix(in srgb,var(--paper) 70%,transparent)}.level-head output{color:var(--paper);font-size:.85rem;letter-spacing:0;text-transform:none}.level-panel input[type=range]{width:100%;margin:0;accent-color:var(--hot)}.level-switch{justify-self:stretch;padding:.35rem .8rem;font-size:.82rem}.level-switch:hover:not(:disabled){border-color:var(--paper)}.level-switch:disabled{opacity:.35}.transport.compact .transport-bar{gap:1rem}.transport.compact .transport-bar .level+.level{margin-left:-.5rem}.transport.compact .level-button{position:relative;width:2.5rem;padding:0;justify-content:center}.transport.compact .level-value{display:none}.transport.compact .level.moved .level-value{display:block;position:absolute;top:-.5rem;right:-.55rem;min-width:0;padding:.05rem .3rem;font-size:.62rem;line-height:1.3;border-radius:999px;background:var(--paper);color:var(--ink)}@media(max-width:720px){.transport-row{position:relative;gap:.5rem}.level{position:static}.level-panel{left:1rem;right:1rem;width:auto;transform:none;bottom:calc(100% + .4rem)}.transport.compact .transport-bar{gap:.5rem}.transport.compact .transport-bar .level+.level{margin-left:-.15rem}.play{width:48px;height:48px}.play svg{width:21px;height:21px}.clock{min-width:0}.clock b{font-size:1.25rem;min-width:5ch}.clock>span{font-size:.7rem}.transport.compact .level-button,.more-toggle{position:relative;width:2.5rem;height:2.5rem}.transport.compact .level-button svg,.more-toggle svg{width:1.2rem;height:1.2rem}.transport.compact .level-button:after,.more-toggle:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%}}@media(max-width:409px){.clock .time-length{display:none}}@media(max-width:389px){.transport-row,.transport.compact .transport-bar{gap:.45rem}.play{width:46px;height:46px}.clock b{font-size:1.1rem}.transport.compact .level-button,.more-toggle{width:2.375rem;height:2.375rem}}@media(max-width:339px){.clock>span{display:none}}.transport .ghost{color:var(--paper);border-color:#f4eedf66}.transport .ghost:hover{background:transparent;border-color:var(--paper)}.loop{display:flex;align-items:center;gap:.6rem}.range{display:flex;align-items:center;gap:.35rem;text-transform:none;letter-spacing:0}.range input{width:4.2rem;padding:.2rem .4rem;border-radius:6px;font:.9rem var(--mono);background:transparent;color:var(--paper);border:1px solid rgba(244,238,223,.4)}.range input:focus{outline:none;border-color:var(--paper)}.range input::placeholder{color:#f4eedf73}.hint{font-size:.75rem;opacity:.5;line-height:1.25}.transport .hint{max-width:9rem}.check{font-size:.82rem;display:flex;gap:.4rem;align-items:center}.check input{accent-color:var(--hot)}dialog{border:1.5px solid var(--ink);border-radius:14px;background:var(--paper);color:var(--ink);width:min(640px,92vw);padding:1.6rem}dialog::backdrop{background:#1d1a1680}dialog h3{font:600 1.5rem var(--display);margin:0 0 .3rem}dialog p{margin:0;color:var(--ink-soft);font-size:.92rem}dialog .upload-row{margin-top:1rem}html.tv .masthead,html.tv .unsure-bar,html.tv .edit-help,html.tv #demo-strip{display:none}html.tv .player{padding:0 max(1rem,env(safe-area-inset-right)) 10rem max(1rem,env(safe-area-inset-left))}html.tv .now{--tv-line: clamp(1.9rem, 4.4vw, 5.5rem);--tv-count: calc(var(--tv-line) * .33);top:0;padding:calc(var(--tv-count) + .55rem) 0 .45rem;margin-bottom:.7rem;font-size:min(var(--tv-line),calc(170vw/max(var(--line-chars, 24),12)));min-height:calc(var(--tv-line) * 1.98 + var(--tv-count) + 1rem);background:linear-gradient(var(--paper) 84%,transparent)}html.tv .now,html.tv.header-collapsed .now{transform:none}html.tv .now .next-line{font-size:min(.6em,calc(170vw/max(var(--next-chars, 24),12)));margin-top:0}html.tv .now .idle{font-size:.6em}html.tv .now .s:not(.past,.on){color:color-mix(in srgb,var(--ink) 60%,transparent)}html.tv .now .countdown{position:absolute;top:.35rem;left:0;right:0;font-size:var(--tv-count);line-height:1}html.tv .score{gap:.8rem}html.tv .system.current .bar{background:#fffaf0}html.tv .system.current{box-shadow:-3px 0 0 var(--hot)}html.tv .playhead{width:3px}html.tv .syl.on .body{box-shadow:0 3px 0 var(--hot)}html.tv .transport-row{gap:1rem;padding:.5rem max(1rem,env(safe-area-inset-right)) max(.5rem,env(safe-area-inset-bottom)) max(1rem,env(safe-area-inset-left))}html.tv .more-options{max-height:38vh;padding:.8rem max(1rem,env(safe-area-inset-right)) .8rem max(1rem,env(safe-area-inset-left))}@media(min-width:1000px){html.tv .score,html.tv .transport-row,html.tv .more-options,html.tv .option-panel{zoom:1.25}html.tv .player{padding-bottom:12.5rem}}@media(min-width:1400px){html.tv .score,html.tv .transport-row,html.tv .more-options,html.tv .option-panel{zoom:1.5}html.tv .player{padding-bottom:15rem}}@media(max-height:480px){html.tv .now{--tv-line: clamp(1.6rem, 3.8vw, 5.5rem);padding:calc(var(--tv-count) + .3rem) 0 .25rem;margin-bottom:.4rem;min-height:calc(var(--tv-line) * 1.98 + var(--tv-count) + .55rem);background:linear-gradient(var(--paper) 92%,transparent)}html.tv .score{zoom:.8;gap:.5rem}html.tv .play{width:44px;height:44px}html.tv .transport-row{gap:.8rem;padding-top:.35rem;padding-bottom:max(.35rem,env(safe-area-inset-bottom))}html.tv .player{padding-bottom:8rem}}html.tv .chord{font-size:1.2rem}html.tv .count{font-size:.83rem}html.tv .count.beat{font-size:1rem}html.tv .transport:before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px;background:linear-gradient(transparent,#1d1a16e6);pointer-events:none}.tv-leave{order:1;flex:none;display:flex;align-items:center;gap:.45rem;height:2.5rem;padding:0 .95rem 0 .7rem;background:var(--paper);color:var(--ink);border:1px solid var(--paper);border-radius:999px;font:500 .8rem var(--mono);white-space:nowrap}.tv-leave svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.tv-leave[hidden]{display:none}.option-panel .tv{display:grid;gap:.6rem}.tv-steps{margin:0;padding-left:1.2rem;display:grid;gap:.35rem;font-size:.84rem;line-height:1.4}.tv-steps li::marker{font:600 .8rem var(--mono);color:var(--hot)}.tv-note,.tv-output{margin:0;font-size:.8rem;line-height:1.4;color:color-mix(in srgb,var(--paper) 70%,transparent)}.tv-output[hidden],.tv-note[hidden]{display:none}.tv-actions{display:flex;gap:.6rem;flex-wrap:wrap;position:sticky;bottom:-.95rem;margin:0 -.95rem;padding:.4rem .95rem .95rem;background:var(--panel-bg)}.tv-steps[hidden]{display:none}.tv-reset-note{margin-top:-.2rem}.option-panel .tv-primary{background:var(--paper);color:var(--ink);border-color:var(--paper)}.option-panel .toggle:disabled{opacity:.75}.tv-turn{display:none;align-items:center;justify-content:center;gap:.6rem;flex-wrap:wrap;margin:0;padding:.4rem 1rem max(.4rem,env(safe-area-inset-bottom));background:var(--hot);color:var(--paper);font-size:.9rem;text-align:center}.tv-turn-leave{min-height:2.5rem;padding:0 .9rem;border:1px solid rgba(244,238,223,.7);border-radius:999px;background:transparent;color:var(--paper);font-size:.85rem}@media(orientation:portrait){html.tv:not([data-device=computer]) .tv-turn{display:flex}html.tv:not([data-device=computer]) .transport-row{padding-bottom:.5rem}}@media(orientation:portrait)and (max-width:720px){html.tv:not([data-device=computer]) .tv-leave{display:none}}@media(orientation:portrait)and (min-width:721px){html.tv .tv-turn-leave{display:none}}html.keyboard-open .transport{visibility:hidden}@media(max-width:720px){dialog{width:calc(100vw - 1.5rem);max-width:none;max-height:calc(var(--view-height, 100dvh) - 1.5rem);padding:1.2rem}dialog[open]{margin:calc(var(--view-top, 0px) + max(.75rem,env(safe-area-inset-top) + .4rem)) auto auto}#lyrics-dialog[open]{height:calc(var(--view-height, 100dvh) - 1.5rem)}#lyrics-form{display:flex;flex-direction:column;gap:.6rem;height:100%}#lyrics-edit{flex:1;min-height:6rem}#lyrics-form .upload-row{margin-top:0}html.keyboard-open #lyrics-form>p:not(.account-problem){display:none}}@media(max-width:720px){.facts,.range{display:flex;align-items:center;gap:.35rem;text-transform:none;letter-spacing:0}.range input{width:4.2rem;padding:.2rem .4rem;border-radius:6px;font:.9rem var(--mono);background:transparent;color:var(--paper);border:1px solid rgba(244,238,223,.4)}.range input:focus{outline:none;border-color:var(--paper)}.range input::placeholder{color:#f4eedf73}.transport .hint{display:none}.knob input[type=range]{width:84px}.bar{height:128px}}.account-button{width:2rem;height:2rem;padding:0;border-radius:50%;border:1px solid var(--rule-strong);background:none;color:var(--ink);display:grid;place-items:center;transition:background .15s,border-color .15s}.account-button svg{width:1.1rem;height:1.1rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.account-button:hover,.account-button[aria-expanded=true]{border-color:var(--ink);background:var(--block)}.menu-label{margin:0;padding:.45rem .75rem 0;font:.68rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft)}.menu-email{margin:0;padding:.15rem .75rem .6rem;font-size:.9rem;font-weight:600;overflow:hidden;text-overflow:ellipsis;border-bottom:1px solid var(--rule);margin-bottom:.3rem}.menu-tokens{margin:0 0 .3rem;padding:.1rem .75rem .6rem;font-size:.9rem;border-bottom:1px solid var(--rule)}.menu-tokens b{font-family:var(--mono)}.menu-tokens small{display:block;margin-top:.2rem;font-size:.8rem;color:var(--ink-soft)}.menu-tokens.empty b{color:var(--hot)}.menu-tokens a{color:var(--ink)}.account-problem{margin:0;color:var(--hot);font-size:.95rem}#account-switch,#account-submit{height:2.75rem;padding:0 1.4rem;font-size:.95rem}@media(max-width:1700px){.masthead{flex-wrap:wrap;row-gap:.5rem}.song-head{order:3;flex-basis:100%}}@media(max-width:720px){.song-head{gap:1rem}.song-title{font-size:1.1rem}.song-title em{font-size:.95rem}}.masthead,#edit-menu,.now{transition:transform .28s cubic-bezier(.2,.7,.2,1)}.masthead :is(.logo,#account-menu,#sign-in){transition:opacity .2s}.header-collapsed .masthead{transform:translateY(calc(-1 * var(--collapse-lift, 0px)))}.header-collapsed .masthead :is(.logo,#account-menu,#sign-in){opacity:0;pointer-events:none}.header-collapsed #edit-menu{transform:translate(var(--edit-x, 0px),var(--edit-y, 0px))}.header-collapsed .song-head{padding-right:var(--edit-room, 0px)}.header-collapsed .now{transform:translateY(calc(-1 * var(--collapse-lift, 0px)))}@media(prefers-reduced-motion:reduce){.masthead,#edit-menu,.now,.masthead :is(.logo,#account-menu,#sign-in){transition:none}}.syl .note-mark{cursor:pointer;pointer-events:auto;touch-action:none}.syl .note-mark:hover,.syl.sounding .note-mark{fill:var(--cool);stroke:var(--cool)}.tutorial{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;pointer-events:none;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.tutorial-ring{position:absolute;left:0;top:0;border-radius:12px;box-shadow:0 0 0 2px var(--hot),0 0 0 5px #f4eedfd9,0 0 0 150vmax #1d1a1661}.tutorial-ring.sliding{transition:transform .3s cubic-bezier(.3,.7,.2,1),width .3s cubic-bezier(.3,.7,.2,1),height .3s cubic-bezier(.3,.7,.2,1),border-radius .3s}.tutorial-bubble{position:absolute;left:0;top:0;pointer-events:auto;width:max-content;max-width:min(21rem,calc(100vw - 24px));padding:1rem 1.15rem .85rem;background:var(--paper);color:var(--ink);border:1.5px solid var(--ink);border-radius:14px;box-shadow:0 14px 36px #1d1a1647}.tutorial-bubble:before{content:"";position:absolute;left:calc(var(--tail, 50%) - 7px);width:14px;height:14px;background:var(--paper);border:solid var(--ink);border-width:1.5px 0 0 1.5px;transform:rotate(45deg)}.tutorial-bubble[data-side=below]:before{top:-8px}.tutorial-bubble[data-side=above]:before{bottom:-8px;transform:rotate(225deg)}.tutorial-bubble.arrived{animation:tutorial-in .22s ease-out}@keyframes tutorial-in{0%{opacity:0;translate:0 6px}}.tutorial-count{margin:0 0 .25rem;font:.68rem var(--mono);text-transform:uppercase;letter-spacing:.1em;color:var(--ink-soft)}.tutorial-title{margin:0 0 .35rem;font:600 1.2rem/1.2 var(--display);letter-spacing:-.01em}.tutorial-text{margin:0;font-size:.92rem;line-height:1.45}.tutorial-actions{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.9rem;padding-top:.7rem;border-top:1px solid var(--rule)}.tutorial-moves{display:flex;gap:.5rem}.tutorial-next{background:var(--ink);color:var(--paper);border:0;border-radius:999px;padding:.35rem 1.1rem;font-size:.85rem;font-weight:600}@media(hover:hover){.tutorial-next:hover{background:var(--hot)}}@media(prefers-reduced-motion:reduce){.tutorial-ring.sliding{transition:none}.tutorial-bubble.arrived{animation:none}}.feedback-page{max-width:720px}.feedback-page .intro h1{font-size:clamp(2.2rem,6vw,3.6rem)}#feedback-writing{display:grid;gap:1rem}.feedback-page textarea{margin-top:0;min-height:9rem;background:var(--paper);font-size:.95rem}.feedback-page .link small.optional{font-weight:400;font-size:.82rem;color:var(--ink-soft);margin-left:.3rem}.feedback-reply{margin:0;font-size:.9rem;color:var(--ink-soft)}.feedback-reply b{font-weight:600;color:var(--ink)}.feedback-count{font:.78rem var(--mono);color:var(--ink-soft);min-height:1.2em}.feedback-count.over{color:var(--hot)}.feedback-page .upload-actions{margin-left:auto}.feedback-back{display:inline-flex;align-items:center;height:2.4rem;padding:0 1.1rem}.feedback-page button[type=submit]{height:2.4rem;padding:0 1.5rem}.feedback-page [aria-invalid=true]{border-color:var(--hot)}.feedback-sent h2{font:400 1.8rem/1.1 var(--display);letter-spacing:-.02em;margin:0 0 .3rem;text-transform:none;border:0;padding:0;color:var(--ink)}.feedback-sent h2:focus{outline:none}.feedback-sent>p{margin:0;color:var(--ink-soft)}.feedback-sent .cta{display:inline-flex;align-items:center;height:2.4rem;padding:0 1.5rem;border:0;margin-left:auto}.feedback-sent .upload-row{row-gap:.75rem}.feedback-received{display:grid;gap:1rem;padding:1.4rem .8rem .8rem}.feedback-received h1{font:600 .8rem var(--mono);text-transform:uppercase;letter-spacing:.12em;color:var(--ink-soft);margin:0;flex:1}.feedback-none{margin:0;color:var(--ink-soft)}.feedback-list{list-style:none;margin:0;padding:0;display:grid;gap:1rem}.feedback-entry{padding:1rem 1.2rem;border:1px solid var(--rule);border-radius:12px;background:var(--block);display:grid;gap:.5rem}.feedback-meta{margin:0;font-size:.84rem;color:var(--ink-soft);overflow-wrap:anywhere}.feedback-meta b{color:var(--ink)}.feedback-text{margin:0;white-space:pre-wrap;overflow-wrap:anywhere}.feedback-browser{font:.72rem var(--mono);color:var(--ink-soft);overflow-wrap:anywhere}@media(max-width:720px){.feedback-received{padding-inline:.5rem}.feedback-entry{padding:.9rem 1rem}}.small-print{font-size:.82rem;color:var(--ink-soft);margin:0}.small-print a{color:inherit}.foot-item{white-space:nowrap}.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}.small-sep{margin:0 .6rem}.landing{padding:0 0 6rem}.landing section,.pillars-more{max-width:1120px;margin:0 auto;padding:0 clamp(1rem,4vw,3rem)}.eyebrow{font:600 .78rem var(--mono);text-transform:uppercase;letter-spacing:.14em;color:var(--hot);margin:0 0 1rem}.cta{display:inline-block;padding:.85rem 1.4rem;border-radius:999px;background:var(--ink);color:var(--paper);text-decoration:none;font-weight:600;border:1.5px solid var(--ink)}.cta:hover{background:var(--hot);border-color:var(--hot)}.small-cta{padding:.35rem .95rem;font-size:.85rem}.ghost-cta{background:transparent;color:var(--ink)}.ghost-cta:hover{background:var(--block);color:var(--ink);border-color:var(--ink)}.hero-actions{display:flex;gap:.8rem;flex-wrap:wrap;margin:0}.hero{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:1.4rem clamp(2rem,5vw,4rem);align-items:center;padding-top:clamp(2.5rem,7vw,5.5rem)!important;padding-bottom:1rem!important}.hero h1{font:400 clamp(3rem,7vw,5.6rem)/.95 var(--display);letter-spacing:-.04em;margin:0 0 1.2rem}.hero h1 i{color:var(--hot);font-style:italic}.lede{font-size:clamp(1.05rem,1.5vw,1.25rem);line-height:1.5;color:var(--ink-soft);max-width:34rem;margin:0 0 1.6rem}.hero-small{margin:.8rem 0 0;font-size:.85rem;color:var(--ink-soft)}.hero .credit{grid-column:2;margin:-.6rem 0 0;padding:0;font-size:.76rem;color:var(--ink-soft)}.preview{margin:0;border:1.5px solid var(--ink);border-radius:16px;background:var(--block);overflow:hidden}.preview-head{display:flex;justify-content:space-between;align-items:baseline;gap:1rem;padding:.8rem 1.1rem 0;font:.74rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft)}.preview-head b{font-weight:500;color:var(--ink)}.preview-other{margin-left:.8rem;color:var(--ink-soft)}.preview-pos{white-space:nowrap}.preview-now .now{position:static;min-height:4.4rem;margin:0;padding:.4rem 1rem .6rem;font-size:clamp(1.25rem,2.4vw,1.75rem);background:none}.preview-frame{position:relative;height:22rem;overflow:hidden;overflow-anchor:none;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:var(--paper)}.preview-frame .player{padding:.9rem .9rem 6rem}.preview-frame .score.has-strum .bar{height:calc(138px + var(--hear-rows, 0) * 13px)}.preview-frame .strum{display:none}.preview-controls{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;padding:.75rem 1rem;background:var(--ink);color:var(--paper)}.preview-play{width:48px;height:48px;flex:none;border-radius:50%;border:0;background:var(--hot);display:grid;place-items:center;transition:transform .1s}.preview-play svg{width:21px;height:21px;fill:var(--paper)}.preview-play:active{transform:scale(.94)}.preview-play.loading{animation:pulse .8s ease-in-out infinite alternate}.preview-toggle{height:2.5rem;padding:0 1.05rem;border-radius:999px;border:1px solid rgba(244,238,223,.45);background:transparent;color:var(--paper);font-size:.88rem}.preview-toggle:hover{border-color:var(--paper)}.preview-toggle[aria-pressed=true]{background:var(--paper);color:var(--ink);border-color:var(--paper)}.preview-full{margin-left:auto;display:inline-flex;align-items:center;gap:.35rem;font-size:.88rem;color:var(--paper);text-decoration:none;white-space:nowrap}.preview-full svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .15s}.preview-full:hover{color:var(--hot-soft)}.preview-full:hover svg{transform:translate(2px)}.demo:not(.demo-full) .transport,.demo:not(.demo-full) .song-head{display:none!important}.demo-strip{display:flex;align-items:center;gap:.6rem 1.4rem;flex-wrap:wrap;padding:.55rem max(clamp(1rem,4vw,3rem),env(safe-area-inset-left));font-size:.9rem;background:var(--block);border-bottom:1px solid var(--rule)}.demo-strip[hidden]{display:none}.demo-strip a{color:var(--ink)}.demo-strip span{color:var(--ink-soft)}.pillars{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1.6rem 2rem;padding-top:4.5rem!important}.pillars h3{font:600 1.3rem/1.15 var(--display);margin:0 0 .5rem}.pillar-icon{display:grid;place-items:center;width:2.75rem;height:2.75rem;margin-bottom:.9rem;border-radius:50%;border:1.5px solid var(--hot);color:var(--hot);background:var(--block)}.pillar-icon svg{width:1.35rem;height:1.35rem;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.pillar-icon svg circle{fill:currentColor;stroke:none}.pillars p{margin:0;color:var(--ink-soft);line-height:1.5}.pillars-more{margin-top:1.4rem;color:var(--ink-soft);font-size:.95rem}.how,.pricing,.faq,.on-phone{padding-top:4.5rem!important}.on-phone{display:grid;grid-template-columns:auto 1fr;gap:clamp(2rem,6vw,4.5rem);align-items:center}.phone{margin:0;width:clamp(210px,24vw,270px);padding:9px;border-radius:46px;background:var(--ink);box-shadow:0 0 0 1px #ffffff14 inset,0 26px 50px -18px #1d1a1673}.phone img{display:block;width:100%;height:auto;border-radius:37px}.on-phone h2{font:400 clamp(1.8rem,4vw,2.6rem)/1.1 var(--display);letter-spacing:-.02em;margin:0 0 1rem}.on-phone p{max-width:36rem;margin:0 0 1.2rem;font-size:1.05rem}.on-phone ul{margin:0;padding:0;list-style:none;display:grid;gap:.7rem;max-width:36rem;color:var(--ink-soft)}.on-phone li{padding-left:1rem;border-left:2px solid var(--hot)}.on-phone li b{color:var(--ink)}@media(max-width:720px){.on-phone{grid-template-columns:1fr}.phone{justify-self:center;width:min(240px,68vw);order:2}}.how h2,.pricing h2,.faq h2{font:400 clamp(1.8rem,4vw,2.6rem)/1.1 var(--display);letter-spacing:-.02em;margin:0 0 1rem}.how ol{margin:0;padding-left:2.2rem;display:grid;gap:.8rem;max-width:44rem;font-size:1.05rem}.how li::marker{font:600 1rem var(--mono);color:var(--hot)}.pricing p{max-width:40rem;color:var(--ink-soft);margin:0 0 1.4rem}.faq dl{margin:0;display:grid;gap:0;max-width:46rem}.faq dl>div{padding:1rem 0;border-top:1px solid var(--rule)}.faq dl>div:last-child{border-bottom:1px solid var(--rule)}.faq dt{font:600 1.1rem var(--display);margin-bottom:.35rem}.faq dd{margin:0;color:var(--ink-soft);line-height:1.55}.landing-foot{max-width:1120px;margin:4rem auto 0;padding:0 clamp(1rem,4vw,3rem)}@media(max-width:900px){.hero{grid-template-columns:minmax(0,1fr)}.hero .credit{grid-column:1}.preview-frame{height:19rem}}.lane-4{--lane-color: #5a6e1f;--lane-light: #dbe3b8;--lane-dark: #2f3b0f}.lane-5{--lane-color: #8a5a1f;--lane-light: #ead9bf;--lane-dark: #4a2f0f}.compare .legend{display:inline-flex;gap:.9rem;flex-wrap:wrap;align-items:center;font-size:.82rem;margin-left:.6rem}.legend-item .stats{opacity:.75}.models{border-collapse:collapse;margin:1rem 0;width:100%}.models th{text-align:left;font:600 .72rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft);padding:.3rem .6rem}.models td{padding:.45rem .6rem;border-top:1px solid var(--rule)}.models td:first-child{text-align:center;width:4rem}.models input[type=checkbox],.models input[type=radio]{accent-color:var(--hot);transform:scale(1.15)}.syl .conf{display:none;position:absolute;right:3px;top:26px;font:9px/1 var(--mono);color:var(--ink-soft);pointer-events:none}.show-confidence .syl .conf{display:block}.show-confidence .syl .body:after{content:"";position:absolute;left:0;bottom:0;height:3px;width:calc(var(--c, 0) * 100%);background:var(--cool);border-radius:0 0 0 6px}.show-confidence .cmp:after{content:attr(data-conf);position:absolute;right:3px;top:0;font:9px/14px var(--mono);opacity:.85}.show-confidence .cmp:before{content:"";position:absolute;left:0;bottom:0;height:3px;width:calc(var(--c, 0) * 100%);background:currentColor;opacity:.7}.hear{position:absolute;bottom:calc(24px + var(--row, 0) * 13px);height:12px;box-sizing:border-box;overflow:hidden;font:9px/12px var(--mono);color:var(--lane-dark, var(--ink));padding-left:1px;border-left:1px solid color-mix(in srgb,var(--lane-color, var(--rule-strong)) 55%,transparent);white-space:nowrap;pointer-events:auto;z-index:2}.has-strum:not(.hide-strum) .hear{bottom:calc(46px + var(--row, 0) * 13px)}.system.quiet .hear,.score.no-main .syl{display:none}.vocals-choice{display:flex;gap:.6rem;align-items:center;margin:.2rem 0 .8rem}.pipeline{padding:1rem 0 3rem}.pipeline.debug-zone{padding:1.2rem .8rem 3rem;margin-top:.75rem}.pipeline-open .now,.pipeline-open .transport,.pipeline-open .unsure-note{display:none}.pipeline-open .player{padding-bottom:2rem}.pipeline-head h2{font:600 1.6rem var(--display);margin:0 0 .3rem}.pipeline-head>.hint{font-size:.92rem;line-height:1.45;color:var(--ink-soft);opacity:1;max-width:62rem}.pipeline-actions{display:flex;gap:.6rem;align-items:center;flex-wrap:wrap;margin-top:.8rem}.pipeline-actions button:not(.ghost){background:var(--ink);color:var(--paper);border:1.5px solid var(--ink);border-radius:999px;padding:.5rem 1rem;font-weight:600}.pipeline-groups{display:grid;gap:2.6rem;margin-top:2rem}.stage-head{display:grid;grid-template-columns:auto 1fr;column-gap:.9rem;align-items:center;padding-bottom:.9rem;margin-bottom:1.1rem;border-bottom:1.5px solid var(--ink)}.stage-number{grid-row:span 2;width:2.4rem;height:2.4rem;border-radius:50%;background:var(--ink);color:var(--paper);display:grid;place-items:center;font:600 1.05rem var(--mono)}.stage-head h3{font:600 1.35rem var(--display);margin:0}.stage-about{margin:.1rem 0 0;font-size:.9rem;color:var(--ink-soft);max-width:58rem}.stage-steps{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(340px,100%),1fr));gap:1rem}.step{display:flex;flex-direction:column;gap:.6rem;border:1px solid var(--rule-strong);border-radius:12px;background:var(--block);padding:1rem 1.1rem .8rem}.step-head{display:flex;align-items:baseline;gap:.6rem}.step-number{font:600 .78rem var(--mono);color:var(--hot);letter-spacing:.04em}.step h4{font:600 1.08rem var(--display);margin:0}.step-about{margin:0;font-size:.88rem;line-height:1.45;color:var(--ink-soft)}.step .hint{font-size:.8rem;color:var(--ink-soft);opacity:.85;margin:0}.step select{width:100%;padding:.45rem .55rem;border-radius:8px;border:1px solid var(--rule-strong);background:var(--paper);font-size:.88rem}.step-foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:.6rem;padding-top:.55rem;border-top:1px dashed var(--rule)}.step .run{font:.68rem var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--ink-soft);opacity:.75}.from-here{background:none;border:0;padding:.15rem 0;font-size:.78rem;color:var(--ink-soft);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:3px;cursor:pointer}.from-here:hover{color:var(--hot);text-decoration-color:currentColor}.choices .choice{border-top:1px solid var(--rule);padding:.5rem 0}.choices .choice:first-child{border-top:0;padding-top:0}.choice.off{opacity:.55}.part-name{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.92rem}.part-name button:first-of-type{margin-left:auto}.licence{display:flex;align-items:center;gap:.35rem;margin:0;font-size:.74rem;color:var(--ink-soft)}.licence svg{flex:none;width:.85rem;height:.85rem;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round}.licence.restricted{color:var(--hot);font-weight:600}.licence.runs-on{color:var(--cool)}.runs-on-tag{margin-left:auto;display:inline-flex;align-items:center;gap:.3rem;padding:.05rem .5rem;border:1px solid var(--cool);border-radius:999px;font:.68rem var(--mono);text-transform:uppercase;letter-spacing:.06em;color:var(--cool);white-space:nowrap}.runs-on-tag svg{width:.8rem;height:.8rem;fill:none;stroke:currentColor;stroke-width:1.3;stroke-linejoin:round;stroke-linecap:round}.part-name input{accent-color:var(--hot)}button.tiny{padding:0 .4rem;font-size:.8rem;line-height:1.4}.part{padding:.3rem 0 0 1.55rem;display:grid;gap:.35rem}.step>.choice>.part{padding-left:0}.param{display:grid;grid-template-columns:1fr auto;column-gap:.8rem;row-gap:.1rem;align-items:center;font-size:.85rem}.param input[type=checkbox]{accent-color:var(--hot);justify-self:end}.param input[type=number],.param input[type=text]{width:6rem;padding:.25rem .4rem;border:1px solid var(--rule-strong);border-radius:6px;background:var(--paper);font:.85rem var(--mono)}.param .hint{grid-column:1 / -1;margin:0;font-size:.76rem}.silence-choice{margin:.2rem 0 .8rem}.hear.breath{color:var(--ink-soft);opacity:.6;letter-spacing:-.05em}.debug-zone{border:1px dashed color-mix(in srgb,var(--debug) 55%,transparent);border-radius:12px;background-image:linear-gradient(color-mix(in srgb,var(--debug) 6%,transparent),color-mix(in srgb,var(--debug) 6%,transparent))}.debug-zone:not(dialog){position:relative}.debug-zone:before{content:"Debug";position:absolute;top:0;left:0;z-index:1;padding:.1rem .4rem .12rem;border-top-left-radius:inherit;border-bottom-right-radius:6px;font:600 .5rem/1.2 var(--mono);text-transform:uppercase;letter-spacing:.12em;background:var(--debug);color:var(--ink)}.corpus-badge{display:inline-block;margin-right:.4rem;padding:.08rem .35rem;vertical-align:.12em;border-radius:4px;background:var(--debug);color:var(--ink);font:600 .55rem/1.2 var(--mono);text-transform:uppercase;letter-spacing:.1em}.consent{position:fixed;z-index:95;left:50%;bottom:calc(1rem + env(safe-area-inset-bottom));transform:translate(-50%);width:min(34rem,calc(100vw - 32px));display:grid;gap:.8rem;padding:1rem 1.1rem;background:var(--block);border:1.5px solid var(--ink);border-radius:14px;box-shadow:0 10px 30px #1d1a162e;font-size:.9rem;line-height:1.45}.consent p{margin:0}.consent b{display:block;margin-bottom:.2rem;font:600 1.1rem/1.2 var(--display)}.consent a{color:inherit}.consent-now{color:var(--ink-soft)}.consent-choices{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:.6rem}.consent-choices button{flex:1 1 8rem;max-width:12rem;padding:.55rem 1.2rem;border-radius:999px;border:1.5px solid var(--ink);background:var(--ink);color:var(--paper);font-weight:600}@media(hover:hover){.consent-choices button:hover{background:var(--hot);border-color:var(--hot)}}.link-button{padding:0;border:0;background:none;color:inherit;font:inherit;text-decoration:underline}.guide{padding:0 0 6rem}.guide article>*{max-width:760px;margin-inline:auto;padding-inline:clamp(1rem,4vw,3rem)}.guide article p{font-size:1.08rem;line-height:1.6}.guide-head{padding-top:clamp(2.5rem,7vw,5rem)}.guide-head h1{font:400 clamp(2.4rem,6vw,4.2rem)/1 var(--display);letter-spacing:-.035em;margin:0 0 1.2rem}.guide-head h1 i{color:var(--hot)}.guide-head .lede{font-size:clamp(1.05rem,1.5vw,1.25rem);margin:0}.guide-why,.guide-listen,.guide-steps,.guide-mid,.guide-memorize,.guide-questions,.guide-end{padding-top:4rem}.guide h2{font:400 clamp(1.8rem,4vw,2.6rem)/1.1 var(--display);letter-spacing:-.02em;margin:0 0 1rem}.guide h1,.guide h2,.guide h3{text-wrap:balance}.guide .guide-quote{margin:0 0 1.8rem;padding-left:1.2rem;border-left:3px solid var(--hot);font:italic 400 clamp(1.35rem,2.6vw,1.75rem)/1.3 var(--display);color:var(--ink)}.guide-reasons{margin:0;padding:0;list-style:none;display:grid;gap:1rem}.guide-reasons li{padding-left:1rem;border-left:2px solid var(--rule);color:var(--ink-soft);font-size:1.05rem;line-height:1.6}.guide-reasons b{color:var(--ink)}.listen{display:flex;gap:.8rem;flex-wrap:wrap;margin:1.4rem 0 1.2rem}.listen-clip{display:inline-flex;align-items:center;gap:.6rem;min-height:2.9rem;padding:0 1.35rem 0 1rem;border-radius:999px;border:1.5px solid var(--ink);background:var(--block);color:var(--ink);font:600 1rem var(--body);cursor:pointer}.listen-clip:hover{background:var(--paper-deep)}.listen-clip svg{width:1.1rem;height:1.1rem;fill:var(--hot)}.listen-clip .clip-pause,.listen-clip[aria-pressed=true] .clip-play{display:none}.listen-clip[aria-pressed=true] .clip-pause{display:inline}.listen-clip[aria-pressed=true]{background:var(--ink);color:var(--paper)}.listen-clip[aria-pressed=true] svg{fill:var(--paper)}.listen-answer{border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}.listen-answer summary{min-height:2.75rem;display:flex;align-items:center;gap:.7rem;cursor:pointer;list-style:none;font:600 1.1rem var(--display);text-decoration:underline;text-decoration-color:var(--rule-strong);text-underline-offset:4px}.listen-answer summary::-webkit-details-marker{display:none}.listen-answer summary:before{content:"";flex:none;width:.45rem;height:.45rem;margin-left:.15rem;border-right:2px solid var(--hot);border-bottom:2px solid var(--hot);transform:rotate(-45deg);transition:transform .15s}.listen-answer[open] summary:before{transform:rotate(45deg)}.listen-answer summary:hover{color:var(--hot)}.guide .listen-answer p{margin:0 0 .9rem;color:var(--ink-soft)}.guide-steps-intro{margin:0;color:var(--ink-soft)}.guide-step-list{margin:2.2rem 0 0;padding:0;list-style:none;counter-reset:guide-step;display:grid;gap:3rem}.guide-step{counter-increment:guide-step;display:grid;gap:1.1rem}.guide-step h3{display:flex;align-items:baseline;gap:.7rem;font:600 1.45rem/1.2 var(--display);margin:0 0 .4rem}.guide-step h3:before{content:counter(guide-step);font:600 1rem var(--mono);color:var(--hot)}.guide .guide-step p{margin:0;color:var(--ink-soft)}.example{display:flex;flex-direction:column}.example .preview-controls{order:-1}.example:not(.holding) .preview-now,.example:not(.holding) .preview-frame{display:none}.example .preview-frame{height:22rem;border-bottom:0}.example-status{margin-left:auto;font:.74rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:#f4eedfbf}.example-switch,.example-key{display:inline-flex;align-items:center;padding:2px;border:1px solid rgba(244,238,223,.45);border-radius:999px}.example-choice{min-height:2.75rem;padding:0 1rem;border:0;border-radius:999px;background:transparent;color:var(--paper);font-size:.88rem;white-space:nowrap;cursor:pointer}.example-choice:hover:not([aria-checked=true]):not([aria-disabled=true]){background:#f4eedf24}.example-choice[aria-checked=true]{background:var(--paper);color:var(--ink)}.example-choice:focus-visible{outline:2px solid var(--hot-soft);outline-offset:2px}.example-key .example-choice{width:2.75rem;padding:0;font-size:1.15rem}.example-key .example-choice[aria-disabled=true]{opacity:.35;cursor:default}.example-key output{min-width:8.2rem;text-align:center;font-size:.88rem}@media(max-width:900px){.example .preview-frame{height:19rem}}.guide-end p{color:var(--ink-soft)}.guide-end .hero-actions{margin-top:1.4rem}.guide .guide-end .credit{margin-top:2.4rem;font-size:.76rem;line-height:1.5}.guide-end .credit a{color:inherit}.guide-head .guide-offer{margin-top:1.8rem;padding:1.2rem 1.3rem;border:1.5px solid var(--ink);border-radius:14px;background:var(--block)}.guide .guide-offer p{margin:0 0 1rem;color:var(--ink)}.guide .guide-offer .hero-small{margin:.8rem 0 0;font-size:.85rem;color:var(--ink-soft)}.guide-offer .hero-actions{margin:0}.guide-questions h3{font:600 1.2rem/1.25 var(--display);margin:1.6rem 0 .4rem}.guide .guide-questions p,.guide .guide-memorize>p{margin:0;color:var(--ink-soft)}.guide-memorize .guide-reasons{margin-top:1.2rem}.clip-length{font-weight:400;color:var(--ink-soft)}.listen-clip[aria-pressed=true] .clip-length{color:#f4eedfb3}.guide-more{color:var(--ink);text-underline-offset:3px}.guide-more:hover{color:var(--hot)}.how-guide{max-width:44rem;margin:1.2rem 0 0;color:var(--ink-soft)}.how-guide a{color:var(--ink);text-underline-offset:3px}@media(pointer:coarse){#sign-in,#start-free{min-height:2.75rem;display:inline-flex;align-items:center}}.guide .guide-date{margin:1.1rem 0 0;font:.74rem var(--mono);text-transform:uppercase;letter-spacing:.08em;color:var(--ink-soft)}.guide .guide-aha{margin:1.1rem 0 0}.guide-aha a{color:var(--ink);font-weight:600;text-underline-offset:3px}.guide-aha a:hover{color:var(--hot)}@media(pointer:coarse){.guide-aha a{display:inline-block;padding:.6rem 0}}