.picker{flex-direction:column;gap:8px;display:flex}.picker-row{flex-wrap:wrap;gap:8px;display:flex}.chip{cursor:pointer;display:block;position:relative}.chip-face{border:1px solid var(--p-text-muted);background:var(--p-raised);color:var(--p-text-body);white-space:nowrap;border-radius:999px;padding:8px 14px;font-size:13px;line-height:18px;display:block}.chip input:checked+.chip-face{border-color:var(--p-text-strong);background:var(--p-text-strong);color:var(--p-bg)}.chip input:focus-visible+.chip-face{outline:2px solid var(--p-focus);outline-offset:2px}@media (hover:hover) and (pointer:fine){.chip:hover input:not(:checked)+.chip-face{border-color:var(--p-text-strong);color:var(--p-text-strong)}}@media (width<=599px){.picker{margin-inline:-24px;display:block;position:relative}.picker-legend{margin-inline:24px;margin-bottom:8px}.picker-row{scrollbar-width:none;flex-wrap:nowrap;margin-block:-4px;padding-block:4px;padding-inline:24px;scroll-padding-inline:24px;overflow-x:auto}.picker-row::-webkit-scrollbar{display:none}.picker:after{content:"";background:linear-gradient(to right, transparent, var(--p-bg));pointer-events:none;width:40px;position:absolute;top:0;bottom:0;right:0}.chip{margin-block:-4px;padding-block:4px}}.day-beats{flex-direction:column;gap:64px;padding:0;list-style:none;display:flex}.beat-time{color:var(--p-text-muted);letter-spacing:-.01em;font-size:28px;font-weight:600;line-height:34px}.beat-title{letter-spacing:-.01em;text-wrap:balance;margin-top:6px;font-size:28px;font-weight:600;line-height:34px}.beat-body{color:var(--p-text-body);margin-top:8px;font-size:17px;line-height:26px}.beat-keys{flex-wrap:wrap;align-items:center;gap:8px;margin-top:14px;display:flex}.beat-keys-unit{white-space:nowrap;align-items:center;gap:8px;display:flex}.beat-pic{margin-top:18px}@media (width>=600px){.beat-time{letter-spacing:-.015em;font-size:40px;line-height:44px}.beat-title{margin-top:12px}.beat-body{margin-top:16px}.beat-keys{margin-top:24px}}@media (width>=1000px){.day{--pic-w:calc(min(1120px, 100vw - 64px) - 440px + max(0px, 50vw - 640px));--pic-h:calc(var(--pic-w) * 600 / 760)}.day-beats{gap:120px}.beat{grid-template-columns:440px minmax(0,1fr);align-items:start;display:grid}.beat-text{padding-top:20px}.beat-text>:not(.beat-keys){max-width:400px}.beat-pic{margin-top:0;margin-right:min(0px,640px - 50vw)}}.day[data-pinned] .day-track:after{content:"";height:320vh;display:block}.day[data-pinned] .day-beats{top:max(0px, 50vh - var(--pic-h) / 2);grid-template-columns:440px minmax(0,1fr);align-items:start;gap:0;display:grid;position:sticky}.day[data-pinned] .beat{display:contents}.day[data-pinned] .beat-text{opacity:0;transition:opacity .2s var(--ease-out-quad);grid-area:1/1}.day[data-pinned] .beat-pic{grid-area:1/2}.day[data-pinned] .beat[data-active] .beat-text{opacity:1}.day[data-pinned] .beat:not(:first-child) .mac{background:0 0}.day[data-pinned] .beat:not([data-active]) .mac-bar,.day[data-pinned] .beat:not([data-active]) .qp{visibility:hidden}.day[data-pinned] .mac-win{transition:opacity .25s var(--ease-out-quad)}.day[data-pinned] .beat:not([data-active]) .mac-win{opacity:0}.day [data-slot]{transition:opacity .15s var(--ease-out-quad)}.day[data-swapping] [data-slot]{opacity:0}@media (prefers-reduced-motion:reduce){.day [data-slot]{transition:none}}.mac-fit{container-type:inline-size}.mac{--u:calc(100cqw / 760);--q:calc(var(--u) * .82);aspect-ratio:760/600;border-radius:calc(16 * var(--u));background:var(--p-stone);font-family:var(--font);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.mac-bar{z-index:1;height:calc(28 * var(--u));background:var(--p-raised);opacity:.92;color:var(--h-text);font-size:calc(13 * var(--u));line-height:calc(16 * var(--u));white-space:nowrap;font-weight:600;position:absolute;inset:0 0 auto}.mac-bar__app,.mac-bar__clock,.mac-bar__icon{top:calc(7 * var(--u));position:absolute}.mac-bar__app{left:calc(16 * var(--u))}.mac-bar__icon{top:calc(6 * var(--u));left:calc(628 * var(--u));width:calc(16 * var(--u));height:calc(16 * var(--u))}.mac-bar__clock{left:calc(656 * var(--u))}.mac-win{top:calc(48 * var(--u));left:calc(32 * var(--u));box-sizing:border-box;width:calc(696 * var(--u));height:calc(528 * var(--u));border:1px solid var(--h-line);border-radius:calc(12 * var(--u));background:var(--h-window);box-shadow:0 calc(18 * var(--u)) calc(20 * var(--u)) #00000024;color:var(--h-text);position:absolute;overflow:hidden}.mac-light{top:calc(15 * var(--u));left:calc(var(--x) * var(--u));width:calc(12 * var(--u));height:calc(12 * var(--u));border-radius:50%;position:absolute}.mac-title{top:calc(11 * var(--u));left:calc(87 * var(--u));font-size:calc(15 * var(--u));line-height:calc(20 * var(--u));white-space:nowrap;font-weight:600;position:absolute}.mac-bubble{top:calc(69 * var(--u));left:calc(23 * var(--u));box-sizing:border-box;width:calc(440 * var(--u));padding:calc(10 * var(--u)) calc(14 * var(--u));border-radius:calc(14 * var(--u));background:var(--h-bar);font-size:calc(15 * var(--u));line-height:calc(22 * var(--u));position:absolute}.mac-composer{top:calc(439 * var(--u));left:calc(23 * var(--u));box-sizing:border-box;width:calc(648 * var(--u));min-height:calc(56 * var(--u));padding:calc(16 * var(--u)) calc(11 * var(--u));border:1px solid var(--h-field-border);border-radius:calc(10 * var(--u));background:var(--h-window);font-size:calc(15 * var(--u));line-height:calc(22 * var(--u));position:absolute}.mac-doc{top:calc(96 * var(--u));left:calc(36 * var(--u));width:calc(608 * var(--u));font-size:calc(15 * var(--u));line-height:calc(22 * var(--u));position:absolute}.mac-selection{padding:0 calc(2 * var(--u));background:var(--h-selection);-webkit-box-decoration-break:clone;box-decoration-break:clone}.mac-tab{top:calc(9 * var(--u));left:calc(var(--x) * var(--u));box-sizing:border-box;width:calc(120 * var(--u));height:calc(30 * var(--u));padding:calc(7 * var(--u)) calc(12 * var(--u));border-radius:calc(8 * var(--u));background:var(--h-bar);font-size:calc(12 * var(--u));line-height:calc(16 * var(--u));position:absolute}.mac-tab--active{background:var(--h-window)}.mac-empty,.mac-empty-note{color:var(--p-text-muted);text-align:center;position:absolute;inset-inline:0}.mac-empty{top:calc(239 * var(--u));font-size:calc(28 * var(--u));line-height:calc(34 * var(--u));letter-spacing:-.01em;font-weight:600}.mac-empty-note{top:calc(289 * var(--u));font-size:calc(13 * var(--u));line-height:calc(18 * var(--u))}.qp{z-index:2;top:calc(var(--qp-y) * var(--u));left:calc(var(--qp-x) * var(--u));--qp-h:350;--qp-card-h:290;--qp-foot:261.5;--qp-row:256;box-sizing:border-box;width:calc(480 * var(--q));height:calc(var(--qp-h) * var(--q));border:calc(1 * var(--q)) solid var(--s-border-subtle);border-radius:calc(16 * var(--q));background:var(--s-bg-window);box-shadow:0 calc(20 * var(--q)) calc(56 * var(--q)) #00000038;color:var(--s-text-primary);position:absolute;overflow:hidden}.qp[data-size=tall]{--qp-h:385;--qp-card-h:325;--qp-foot:296.6;--qp-row:290}.qp-light{top:calc(16 * var(--q));left:calc(var(--x) * var(--q));width:calc(14 * var(--q));height:calc(14 * var(--q));background:var(--s-fill-window-control);box-shadow:inset 0 0 0 calc(1 * var(--q)) var(--s-border-window-control);border-radius:50%;position:absolute}.qp-btn{top:calc(11 * var(--q));left:calc(var(--x) * var(--q));width:calc(24 * var(--q));height:calc(24 * var(--q));border-radius:calc(12 * var(--q));background:var(--s-bg-panel);place-items:center;display:grid;position:absolute}.qp-btn--bare{top:calc(var(--qp-row) * var(--q));background:0 0}.qp svg{width:calc(14 * var(--q));height:calc(14 * var(--q));display:block}.qp-btn svg{opacity:.7}.qp-card{top:calc(47 * var(--q));left:calc(11 * var(--q));box-sizing:border-box;width:calc(456 * var(--q));height:calc(var(--qp-card-h) * var(--q));border:calc(1 * var(--q)) solid var(--s-border-subtle);border-radius:calc(8 * var(--q));background:var(--s-bg-panel);position:absolute;overflow:hidden}.qp-lang{top:calc(var(--y) * var(--q));left:calc(11 * var(--q));align-items:center;gap:calc(21 * var(--q));font-size:calc(13 * var(--q));line-height:calc(16 * var(--q));white-space:nowrap;font-weight:600;display:flex;position:absolute}.qp-lang svg{width:calc(12 * var(--q));height:calc(12 * var(--q))}.qp-src,.qp-tgt{left:calc(11 * var(--q));width:calc(432 * var(--q));position:absolute}.qp-src{top:calc(43 * var(--q));color:var(--s-text-secondary);font-size:calc(17 * var(--q));line-height:calc(22 * var(--q))}.qp-tgt{top:calc(195 * var(--q));font-size:calc(22 * var(--q));line-height:calc(26 * var(--q))}.qp-rule{top:calc(138.5 * var(--q));left:calc(var(--x) * var(--q));width:calc(var(--w) * var(--q));height:calc(1 * var(--q));background:var(--s-border-subtle);position:absolute}.qp-swap{top:calc(127 * var(--q));left:calc(214 * var(--q));width:calc(27 * var(--q));height:calc(24 * var(--q));border-radius:calc(12 * var(--q));background:var(--s-bg-window);place-items:center;display:grid;position:absolute}.qp-footer{top:calc(var(--qp-foot) * var(--q));left:calc(11 * var(--q));color:var(--s-text-secondary);font-size:calc(10 * var(--q));line-height:calc(13 * var(--q));white-space:nowrap;font-weight:600;position:absolute}.qp-replace{top:calc(var(--qp-row) * var(--q));left:calc(356 * var(--q));justify-content:center;align-items:center;gap:calc(6 * var(--q));box-sizing:border-box;width:calc(91 * var(--q));height:calc(27 * var(--q));border-radius:calc(8 * var(--q));background:var(--s-text-primary);color:var(--s-bg-window);font-size:calc(12 * var(--q));line-height:calc(16 * var(--q));white-space:nowrap;font-weight:600;display:flex;position:absolute}.qp-replace svg{width:calc(12 * var(--q));height:calc(12 * var(--q))}.bf-panel{--color-control:var(--p-text-muted);--color-canvas:var(--p-raised);--color-ink:var(--p-text-strong);--color-muted:var(--p-text-muted);--color-line:var(--p-line);--color-surface:var(--p-stone);--color-error:var(--p-error);--color-accent:var(--p-text-strong);--color-on-accent:var(--p-bg);--color-state-hover:color-mix(in srgb, var(--p-text-strong) 6%, transparent);--font-sans:var(--font);--focus-ring:var(--p-focus)}.bf-nojs{display:none}:root:not(.js) .bf-nojs{display:block}:root:not(.js) .bf-form{display:none}.bf-fields{min-width:0}.bf-fields:disabled{opacity:.6}.bf-control{border:1px solid var(--color-control);background:var(--color-canvas);width:100%;height:44px;color:var(--color-ink);font-family:var(--font-sans);border-radius:10px;padding:0 12px 0 14px;font-size:17px;line-height:26px}.bf-control::placeholder{color:var(--color-muted);opacity:1}.bf-control[aria-invalid=true]{border-color:var(--color-error);box-shadow:inset 0 0 0 1px var(--color-error)}.bf-select{min-width:0;position:relative}.bf-select select{appearance:none;text-overflow:ellipsis;padding-right:36px}.bf-select svg{color:var(--color-muted);pointer-events:none;position:absolute;top:50%;right:14px;translate:0 -50%}.bf-pair{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr) auto;align-items:center;gap:8px;display:grid}.bf-pairs[data-count="1"] .bf-pair{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)}.bf-pairs[data-count="1"] .bf-remove{display:none}.bf-pair .bf-error{grid-column:1/-1}.bf-remove{border:1px solid var(--color-control);background:var(--color-canvas);width:44px;height:44px;color:var(--color-muted);transition:background-color .15s var(--ease-out-quad);border-radius:10px;place-items:center;display:grid}.bf-remove-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}@media (hover:hover) and (pointer:fine){.bf-remove:hover{background:var(--color-state-hover)}}@media (width<=599px){.bf-pair,.bf-pairs[data-count="1"] .bf-pair{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);column-gap:6px}.bf-select select{padding-left:10px;padding-right:30px}.bf-select svg{right:10px}.bf-remove{width:auto;height:44px;color:var(--color-accent);font-family:var(--font-sans);border:0;grid-column:1/-1;justify-self:end;margin-block:-6px;padding-inline:4px;font-size:14px;font-weight:500}.bf-remove svg{display:none}.bf-remove-label{clip-path:none;width:auto;height:auto;position:static;overflow:visible}}.bf-pill{border:1px solid var(--color-control);background:var(--color-canvas);height:36px;color:var(--p-text-body);font-family:var(--font-sans);cursor:pointer;border-radius:999px;align-items:center;gap:6px;padding-inline:14px;font-size:13px;line-height:18px;display:inline-flex;position:relative}.bf-pill input{opacity:0;cursor:pointer;margin:0;position:absolute;inset:0}.bf-pill svg{display:none}.bf-pill:has(input:checked){border-color:var(--color-accent);background:var(--color-accent);color:var(--color-on-accent)}.bf-pill:has(input:checked) svg{display:block}.bf-pill:has(input:focus-visible){outline:2px solid var(--focus-ring);outline-offset:2px}@media (hover:hover) and (pointer:fine){.bf-pill:not(:has(input:checked)):hover{background:var(--color-state-hover)}}.bf-check{cursor:pointer;grid-template-columns:20px 1fr;column-gap:10px;display:grid}.bf-check input{border:1.5px solid var(--color-control);background:var(--color-canvas);appearance:none;cursor:pointer;border-radius:5px;place-content:center;width:20px;height:20px;margin:1px 0 0;display:grid}.bf-check input:before{background:var(--color-on-accent);content:"";visibility:hidden;width:12px;height:12px;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='black' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2.5 6.25 2.25 2.25 4.75-5'/%3E%3C/svg%3E") 50%/contain no-repeat}.bf-check input:checked{border-color:var(--color-accent);background:var(--color-accent)}.bf-check input:checked:before{visibility:visible}.bf-note{border:1px solid var(--color-line);background:var(--color-surface);border-radius:10px;gap:10px;padding:12px 14px;display:flex}.bf-note svg{color:var(--color-muted);flex:none;margin-top:3px}.bf-error{color:var(--color-error);font-family:var(--font-sans);align-items:flex-start;gap:6px;font-size:13px;line-height:18px;display:flex}.bf-error svg{color:var(--color-error);flex:none}.bf-glyph{stroke:var(--color-canvas)}.bf-error a{text-underline-offset:3px;text-decoration:underline 1px}.bf-turnstile{background:var(--color-surface);border-radius:6px;width:300px;height:65px;overflow:hidden}@media (width<=599px){.bf-turnstile{width:150px;height:140px}}.bf-submit[data-blocked]{opacity:.6;cursor:not-allowed}.bf-step{grid-template-columns:22px 1fr;column-gap:10px;display:grid}.bf-step-number{border:1px solid var(--color-line);background:var(--color-surface);width:22px;height:22px;color:var(--color-ink);font-family:var(--font-sans);border-radius:50%;place-items:center;margin-top:1px;font-size:12px;font-weight:500;display:grid}.bf-done-mark{color:var(--color-accent);flex:none}.bf-done{animation:bf-in .15s var(--ease-out-quad)}@keyframes bf-in{0%{opacity:0}}@media (prefers-reduced-motion:reduce){.bf-done{animation:none}}.faq-mark[data-astro-cid-tycplb2i]:before{content:"+"}.faq[data-astro-cid-tycplb2i][open]:not([data-state]) .faq-mark[data-astro-cid-tycplb2i]:before{content:"–"}.faq-answer[data-astro-cid-tycplb2i]{transition:grid-template-rows .2s var(--ease-out-quad), opacity .2s var(--ease-out-quad);grid-template-rows:1fr;display:grid}.faq[data-astro-cid-tycplb2i][data-state] .faq-answer[data-astro-cid-tycplb2i]{opacity:0;grid-template-rows:0fr}.faq[data-astro-cid-tycplb2i][data-state=closing] .faq-answer[data-astro-cid-tycplb2i]{transition-duration:.15s}@media (prefers-reduced-motion:reduce){.faq-answer[data-astro-cid-tycplb2i]{transition:none}}.feature{gap:24px;display:grid}@media (width>=1000px){.feature{grid-template-columns:460px minmax(0,1fr);align-items:start;gap:20px}.feature-text{padding-top:60px}}.demo-fit{container-type:inline-size}.demo{--u:calc(100cqw / 640);--q:calc(var(--u) * .82);aspect-ratio:640/400;border-radius:calc(16 * var(--u));background:var(--p-stone);font-family:var(--font);-webkit-user-select:none;user-select:none;position:relative;overflow:hidden}.demo-keys{top:calc(90 * var(--u));left:calc(470 * var(--u));padding:0;list-style:none;position:absolute}.demo-keys li{top:calc(var(--y) * var(--u));align-items:center;gap:calc(10 * var(--u));white-space:nowrap;display:flex;position:absolute}.demo-key{padding:calc(8 * var(--u)) calc(12 * var(--u));border:calc(1 * var(--u)) solid var(--p-key-edge);border-radius:calc(8 * var(--u));background:var(--p-key-face);box-shadow:var(--demo-key-contact,0 calc(2 * var(--u)) calc(4 * var(--u)) #2c363314);color:var(--p-key-text);font-size:calc(15 * var(--u));line-height:calc(18 * var(--u));font-weight:500;display:block}.demo-key[data-pressed]{background:var(--p-key-face-pressed);box-shadow:0 calc(1 * var(--u)) calc(1 * var(--u)) #2c36331a;translate:0 calc(1 * var(--u))}.demo-key-label{color:var(--p-text-muted);font-size:calc(13 * var(--u));line-height:calc(18 * var(--u))}.demo .qp-was{z-index:3}.demo-menu{z-index:4;top:calc(40 * var(--u));left:calc(420 * var(--u));box-sizing:border-box;width:calc(200 * var(--u));height:calc(150 * var(--u));border:calc(1 * var(--u)) solid var(--s-border-subtle);border-radius:calc(10 * var(--u));background:var(--s-bg-panel);box-shadow:0 calc(10 * var(--u)) calc(30 * var(--u)) #00000040;transform-origin:100% 0;position:absolute}.demo-bar{top:calc(var(--y) * var(--u));left:calc(var(--x) * var(--u));width:calc(var(--w) * var(--u));height:calc(8 * var(--u));border-radius:calc(4 * var(--u));background:var(--s-text-skeleton);position:absolute}.demo-menu-item{top:calc(43 * var(--u));left:calc(7 * var(--u));box-sizing:border-box;width:calc(184 * var(--u));height:calc(26 * var(--u));padding:calc(5 * var(--u)) calc(10 * var(--u));border-radius:calc(6 * var(--u));background:var(--s-native-accent);color:#fff;font-size:calc(13 * var(--u));line-height:calc(16 * var(--u));white-space:nowrap;position:absolute}.demo-window{top:calc(35 * var(--u));left:calc(40 * var(--u));box-sizing:border-box;width:calc(560 * var(--u));height:calc(330 * var(--u));border:calc(1 * var(--u)) solid var(--s-border-subtle);border-radius:calc(12 * var(--u));background:var(--s-bg-window);box-shadow:0 calc(20 * var(--u)) calc(56 * var(--u)) #0000001f;color:var(--s-text-primary);position:absolute;overflow:hidden}.demo-saved{width:calc(150 * var(--u));background:var(--s-bg-panel);position:absolute;inset:0 auto 0 0}.demo-saved-head,.demo-window-pair{top:calc(39 * var(--u));color:var(--s-text-secondary);font-size:calc(13 * var(--u));line-height:calc(16 * var(--u));white-space:nowrap;font-weight:600;position:absolute}.demo-saved-head{left:calc(15 * var(--u))}.demo-window-pair{left:calc(170 * var(--u))}.demo-window-src,.demo-window-out{left:calc(170 * var(--u));width:calc(360 * var(--u));position:absolute}.demo-window-src{top:calc(68 * var(--u));color:var(--s-text-secondary);font-size:calc(17 * var(--u));line-height:calc(22 * var(--u))}.demo-window-out{top:calc(158 * var(--u));font-size:calc(22 * var(--u));line-height:calc(26 * var(--u))}
