.hero{text-align:center;max-width:860px;margin:0 auto;padding:92px 32px 20px}.hero h1{font-family:var(--font-display);font-weight:800;font-size:76px;line-height:1.02;letter-spacing:-.035em;margin:28px 0 0}.hero h1 .serif{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;letter-spacing:-.01em;white-space:nowrap;background:var(--sheen);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:demo-sheen 6s linear infinite}@keyframes demo-sheen{to{background-position:200% 0}}.hero .sub{font-size:17.5px;line-height:1.7;color:var(--ink2);margin:16px auto 0;max-width:640px}.fakewarn{display:flex;gap:13px;align-items:flex-start;max-width:68ch;margin:26px auto 0;text-align:left;border:1.5px dashed color-mix(in srgb,var(--gold) 55%,transparent);background:color-mix(in srgb,var(--gold) 14%,transparent);border-radius:14px;padding:16px 18px}.fw-i{flex:none;width:22px;height:22px;border-radius:50%;background:var(--gold);color:var(--card);display:flex;align-items:center;justify-content:center;font-weight:800;font-size:13px}.fakewarn p{margin:0;font-size:14.5px;line-height:1.7;color:var(--ink2)}.fakewarn p a{color:var(--em)}.player{display:flex;align-items:center;gap:14px;flex-wrap:wrap;max-width:760px;margin:34px auto 0;padding:14px 20px;background:var(--card);border:1px solid var(--line);border-radius:16px}.pbtn2{display:inline-flex;align-items:center;gap:7px;min-height:32px;padding:0 14px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink2);font-size:13.5px;font-weight:600;font-family:inherit;cursor:pointer;transition:border-color .2s,color .2s,background .2s}.pbtn2:hover{border-color:var(--em);color:var(--em);background:color-mix(in srgb,var(--hm-brand) 10%,transparent)}.pbtn2.main{background:var(--btn-grad);border-color:transparent;color:var(--btn-ink)}.pbtn2.main:hover{filter:brightness(1.06)}.p-seg{font-family:var(--font-mono);font-size:12.5px;color:var(--ink3);letter-spacing:.06em;white-space:nowrap}.p-seg b{color:var(--ink);font-weight:600}.p-left{margin-left:auto;display:flex;align-items:center;gap:12px}.p-time{font-family:var(--font-mono);font-size:12.5px;color:var(--ink3);font-variant-numeric:tabular-nums}.pring{width:34px;height:34px;flex:none}.pring .rbg{fill:none;stroke:var(--line);stroke-width:3}.pring .rfg{fill:none;stroke:var(--pos);stroke-width:3;stroke-linecap:round;transform:rotate(-90deg);transform-origin:center;transition:stroke-dashoffset .2s linear}.stagewrap{max-width:1040px;margin:40px auto 0;scroll-margin-top:104px}.beat{display:none}.beat.on{display:block}.beat-head{max-width:74ch}.beat-head .bno{display:inline-flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11.5px;letter-spacing:.16em;color:var(--em)}.beat-head h2{font-family:var(--font-display);font-weight:700;font-size:30px;letter-spacing:-.02em;line-height:1.2;margin:12px 0 0}.beat-head h2 .serif{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;color:var(--em)}.beat-head .bsub{font-size:17px;line-height:1.7;color:var(--ink2);margin-top:12px;max-width:62ch}.beat-grid{display:grid;grid-template-columns:1.32fr 1fr;gap:26px;align-items:start;margin-top:26px}@media(max-width:940px){.beat-grid{grid-template-columns:1fr}}.dshot{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}.ds-bar{display:flex;align-items:center;gap:8px;padding:10px 14px;border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--ink) 5%,transparent);font-family:var(--font-mono);font-size:12px;color:var(--ink3)}.ds-dots{display:inline-flex;gap:4px}.ds-dots i{width:7px;height:7px;border-radius:50%;background:var(--line);display:block}.ds-body{padding:16px 18px;display:flex;flex-direction:column;gap:11px}.ds-row{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}.ds-k{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;color:var(--ink3)}.ds-k.danger{color:var(--danger);border:1px solid var(--danger);border-radius:999px;padding:2px 9px}.ds-k.em{color:var(--em)}.ds-t{font-size:14.5px;font-weight:600;color:var(--ink);line-height:1.5}.ds-p{font-size:14px;line-height:1.7;color:var(--ink2);margin:0}.ds-card{border:1px solid var(--line);border-radius:10px;padding:11px 13px;background:var(--paper)}.ds-card.em{border-color:var(--em);background:color-mix(in srgb,var(--hm-brand) 8%,transparent)}.ds-card.warn{border-color:var(--gold);background:color-mix(in srgb,var(--gold) 12%,transparent)}.ds-card.gold{border-color:var(--gold)}.ds-card.dashed{border-style:dashed}.ds-num{font-family:var(--font-mono);font-size:13.5px;color:var(--ink2);font-variant-numeric:tabular-nums}.ds-num b{color:var(--ink);font-weight:600}.up{color:var(--pos)!important;font-weight:600}.dn{color:var(--danger)!important;font-weight:600}.fl{color:var(--ink3)!important;font-weight:600}.ds-keys{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.ds-key{font-family:var(--font-mono);font-size:11px;border:1px solid var(--line);border-radius:999px;padding:3px 10px;color:var(--ink2);background:var(--card)}.ds-del{color:var(--danger);text-decoration:line-through}.ds-add{color:var(--em)}.ds-hl{background:color-mix(in srgb,var(--gold) 20%,transparent);border-bottom:1px solid var(--gold);padding:0 2px}.ds-split{display:grid;grid-template-columns:1fr 1fr;gap:10px}@media(max-width:560px){.ds-split{grid-template-columns:1fr}}.ds-stats{display:flex;gap:14px;flex-wrap:wrap}.ds-stats .ds-num{display:flex;flex-direction:column;gap:2px}.ds-stats .ds-num b{font-size:18px}.beat-side{display:flex;flex-direction:column;gap:14px}.bs-what{border:1px solid var(--line);border-radius:14px;padding:16px 18px;background:var(--card)}.bs-k{display:block;font-family:var(--font-mono);font-size:10.5px;letter-spacing:.16em;color:var(--ink3);margin-bottom:7px}.bs-what p{margin:0;font-size:14.5px;line-height:1.75;color:var(--ink2)}.quote{border-left:3px solid var(--em);padding:2px 0 2px 15px}.quote p{margin:0;font-size:14.5px;line-height:1.7;color:var(--ink2);font-style:italic}.qsrc{display:block;margin-top:6px;font-family:var(--font-mono);font-size:11.5px;color:var(--ink3)}.beat-next{display:inline-flex;align-items:center;gap:8px;margin-top:24px;padding:10px 18px;border:1px solid var(--line);border-radius:999px;background:var(--card);color:var(--ink2);font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;transition:border-color .2s,background .2s,color .2s}.beat-next:hover{border-color:var(--em);color:var(--em);background:color-mix(in srgb,var(--hm-brand) 10%,transparent)}.beatbar{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:34px auto 0;max-width:1040px}@media(max-width:860px){.hero{padding:72px 20px 12px}.hero h1{font-size:52px}.beatbar{grid-template-columns:repeat(3,1fr)}}@media(max-width:480px){.hero h1{font-size:44px}.hero .sub{font-size:17px}}@media(max-width:460px){.beatbar{grid-template-columns:repeat(2,1fr)}}.bb{text-align:left;background:var(--card);border:1px solid var(--line);border-radius:11px;padding:10px 12px;cursor:pointer;font-family:inherit;transition:border-color .2s}.bb:hover{border-color:var(--ink3)}.bb .bb-n{font-family:var(--font-mono);font-size:10.5px;letter-spacing:.1em;color:var(--ink3)}.bb .bb-l{display:block;font-size:13.5px;font-weight:600;color:var(--ink2);line-height:1.45;margin-top:3px}.bb.on{border-color:var(--em)}.bb.on .bb-l{color:var(--ink)}.bb .bb-p{display:block;height:4px;border-radius:999px;background:var(--line);margin-top:9px;overflow:hidden}.bb .bb-p i{display:block;height:100%;width:0;background:var(--em2);border-radius:999px}.bb.done .bb-p i{width:100%}.bb.done .bb-p{background:color-mix(in srgb,var(--pos) 18%,transparent)}.bb.done .bb-p i{background:var(--pos)}.endcard{display:none;text-align:center}.endcard.show{display:block}.endnote{display:inline-flex;align-items:center;gap:10px;font-family:var(--font-mono);font-size:12.5px;color:var(--em);margin:0 0 18px}.demo-audit{display:flex;align-items:center;gap:10px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:10px 10px 10px 22px;width:620px;max-width:100%;margin:30px auto 0}.demo-audit input{flex:1;min-width:0;border:0;outline:0;font-size:17px;font-family:inherit;color:var(--ink);background:transparent}.demo-audit input::placeholder{color:var(--ink3)}@media(prefers-reduced-motion:reduce){.beat{display:block!important;margin-bottom:54px}.player,.beatbar{display:none}.pring .rfg{transition:none}}