@font-face{font-family:Archivo Variable;font-style:italic;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/_astro/archivo-vietnamese-wdth-italic.DS6JCx7O.woff2)format("woff2-variations");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Archivo Variable;font-style:italic;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/_astro/archivo-latin-ext-wdth-italic.Cq9u_6Zz.woff2)format("woff2-variations");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Archivo Variable;font-style:italic;font-display:swap;font-weight:100 900;font-stretch:62% 125%;src:url(/_astro/archivo-latin-wdth-italic.BuvkOFDm.woff2)format("woff2-variations");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--cyc:#d9c9a8;--hot:#f4e8d0;--ink:#1f1a12;--ink2:#4d4434;--rule:#1f1a1233;--board-h:78px;--bar-h:60px;--ease:cubic-bezier(.16, 1, .3, 1);--font:"Archivo Variable", "Helvetica Neue", sans-serif;--yw:132px}*{box-sizing:border-box}html{background:var(--cyc);scrollbar-color:var(--rule) transparent}body{font-family:var(--font);color:var(--ink);background:var(--cyc);-webkit-font-smoothing:antialiased;overscroll-behavior-y:none;margin:0}::selection{background:var(--ink);color:var(--cyc)}:focus{outline:none}:focus-visible{outline:2px solid var(--ink);outline-offset:3px;border-radius:2px}button{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}a{color:inherit;text-underline-offset:.2em;text-decoration-thickness:1px}.bar{z-index:30;height:var(--bar-h);padding:0 18px;padding-top:env(safe-area-inset-top);justify-content:space-between;align-items:center;display:flex;position:fixed;top:0;left:0;right:0}.name{font-variation-settings:"wdth" 88;letter-spacing:.005em;font-size:15px;font-weight:650;text-decoration:none}.name span{color:var(--ink2);font-variation-settings:"wdth" 92;margin-left:10px;font-weight:400;display:none}.sound{border:1px solid var(--rule);font-variation-settings:"wdth" 85;background:#ffffff2e;border-radius:19px;align-items:center;gap:8px;height:38px;padding:0 14px 0 10px;font-size:13px;display:inline-flex}.sound svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;width:19px;height:19px}.sound .spk{fill:currentColor;stroke:none}.sound .x,.sound[data-state=muted] .w{display:none}.sound[data-state=muted] .x{display:inline}.sound[data-state=locked]{background:var(--ink);color:var(--cyc);border-color:var(--ink)}.sound[data-state=playing] .w{animation:1.4s ease-in-out infinite breathe}@keyframes breathe{50%{opacity:.35}}.page{position:relative}.stage{touch-action:pan-y;-webkit-user-select:none;user-select:none;cursor:grab;height:100svh;position:sticky;top:0;overflow:hidden}.stage.dragging{cursor:grabbing}.wash{background:radial-gradient(60% 46% at 50% 34%, var(--hot), transparent 72%), linear-gradient(var(--cyc), var(--cyc) 62%, color-mix(in oklab, var(--cyc), var(--ink) 14%));position:absolute;inset:0}.scene{padding:calc(var(--bar-h) + 14px) 22px calc(var(--board-h) + 18px);will-change:opacity, transform;flex-direction:column;align-items:center;display:flex;position:absolute;inset:0}.piece{flex-direction:column;flex:auto;justify-content:center;align-items:center;width:100%;min-height:0;display:flex;position:relative}.piece img{width:auto;max-width:min(80vw,440px);height:auto;max-height:calc(100% - 34px);display:block;box-shadow:0 28px 50px -22px #0000008c,0 2px 6px #0000002e}.piece .ph{aspect-ratio:4/5;border:1px solid var(--rule);width:min(64vw,300px);color:var(--ink2);letter-spacing:.08em;text-transform:uppercase;font-variation-settings:"wdth" 80;text-align:center;place-items:center;padding:20px;font-size:12px;display:grid}.credit{color:var(--ink2);text-align:center;max-width:36ch;margin:10px 0 0;font-size:12px}.words{text-align:center;flex:none;width:100%;padding-top:16px}.meta{letter-spacing:.1em;text-transform:uppercase;font-variation-settings:"wdth" 78;color:var(--ink2);font-variant-numeric:tabular-nums;margin:0 0 8px;font-size:12px;font-weight:650}.title{letter-spacing:-.025em;font-variation-settings:"wdth" 112;text-wrap:balance;margin:0;font-size:clamp(34px,9.6vw,52px);font-weight:250;line-height:.98}.more{left:0;right:0;bottom:calc(var(--board-h) - 2px);text-align:center;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2);font-variation-settings:"wdth" 80;margin:0;font-size:11px;font-weight:600;position:absolute}.detail{z-index:2;background:var(--cyc);border-top:1px solid var(--rule);padding:28px 22px calc(var(--board-h) + 40px);transition:opacity .35s;position:relative}.detail.scrubbing{opacity:.25}.detail h2{letter-spacing:-.02em;font-variation-settings:"wdth" 108;margin:0 0 4px;font-size:30px;font-weight:300;line-height:1.02}.by{color:var(--ink2);margin:8px 0 18px;font-size:15px;line-height:1.5}.by b{color:var(--ink);font-weight:600}.desc{max-width:62ch;margin:0 0 24px;font-size:17px;line-height:1.6}.clips{border-top:1px solid var(--rule);margin:0 0 26px;padding:0;list-style:none}.clip{border-bottom:1px solid var(--rule);text-align:left;grid-template-columns:44px 1fr auto;align-items:center;gap:12px;width:100%;padding:10px 0;font-size:15px;display:grid;position:relative}.clip .ico{border:1.5px solid var(--ink);border-radius:50%;place-items:center;width:44px;height:44px;display:grid}.clip .ico svg{fill:currentColor;width:13px;height:13px}.clip[data-on="1"] .ico{background:var(--ink);color:var(--cyc)}.clip small{color:var(--ink2);font-size:12px;display:block}.clip .t{color:var(--ink2);font-variant-numeric:tabular-nums;font-size:12px}.clip .prog{background:var(--ink);transform-origin:0;height:2px;transform:scaleX(var(--p,0));position:absolute;bottom:-1px;left:56px;right:0}.board{z-index:20;height:var(--board-h);padding:0 0 env(safe-area-inset-bottom);background:linear-gradient(transparent, color-mix(in oklab, var(--cyc), var(--ink) 6%) 22%);position:fixed;bottom:0;left:0;right:0}.strip{touch-action:none;cursor:ew-resize;height:68px;position:relative;overflow:hidden;mask-image:linear-gradient(90deg,#0000,#000 16% 84%,#0000)}.ticks{will-change:transform;position:absolute;top:0;bottom:0;left:50%}.tick{flex-direction:column;align-items:center;width:44px;height:46px;margin-left:-22px;display:flex;position:absolute;top:14px}.tick:before{content:"";background:var(--ink);opacity:.35;border-radius:1px;width:2px;height:18px;transition:height .2s,opacity .2s}.tick[data-sound="1"]:before{width:3px}.tick.on:before{opacity:1;height:26px}.tick span{font-variation-settings:"wdth" 75;letter-spacing:.04em;color:var(--ink2);font-variant-numeric:tabular-nums;opacity:0;margin-top:6px;font-size:10.5px;font-weight:650}.tick.yr span{opacity:1}.playhead{width:0;height:40px;position:absolute;top:8px;left:50%}.playhead:before{content:"";background:var(--ink);width:2px;height:40px;position:absolute;top:0;left:-1px}.playhead:after{content:"";border:6px solid #0000;border-top:8px solid var(--ink);position:absolute;top:-2px;left:-6px}@media (width>=900px){:root{--board-h:76px;--yw:168px}.bar{padding:0 32px}.name span{display:inline}html,body{height:100%;overflow:hidden}.stage{height:auto;position:fixed;inset:0}.wash{background:radial-gradient(42% 58% at 28% 44%, var(--hot), transparent 72%), linear-gradient(var(--cyc), var(--cyc) 66%, color-mix(in oklab, var(--cyc), var(--ink) 12%))}.scene{padding:calc(var(--bar-h) + 28px) 5vw calc(var(--board-h) + 10px);grid-template-rows:auto 1fr;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);align-items:start;column-gap:5vw;display:grid}.piece{flex-direction:column;grid-row:1/span 2;height:100%}.piece img{max-width:100%;max-height:calc(100% - 30px)}.words{text-align:left;padding-top:2vh}.title{font-size:clamp(48px,5.4vw,6rem)}.more{display:none}.detail{top:calc(var(--bar-h) + 28px + 2vh + var(--words-h,180px));bottom:var(--board-h);border-top:1px solid var(--rule);scrollbar-width:thin;background:0 0;width:41.48vw;padding:18px 8px 24px 0;position:fixed;right:5vw;overflow-y:auto}.detail h2{display:none}.tick{width:56px;margin-left:-28px}}@media (prefers-reduced-motion:reduce){.sound .w{animation:none!important}.detail{transition:none}}.intro{z-index:40;color:#111;padding:calc(var(--bar-h) + 10px) 24px 32px;transition:opacity .7s var(--ease), visibility 0s;background:#f7f6f2;justify-content:center;align-items:center;display:flex;position:fixed;inset:0;overflow-y:auto}.intro-in{width:min(640px,100%)}.intro .intro-h{letter-spacing:-.03em;font-variation-settings:"wdth" 112;text-wrap:balance;margin:0 0 28px;font-size:clamp(40px,10vw,76px);font-weight:250;line-height:.96}.intro .intro-h span{font-variant-numeric:tabular-nums;display:block}.intro p{color:#222;max-width:58ch;margin:0 0 16px;font-size:18px;line-height:1.55}.intro .now{color:#555;font-size:15px}.begin{color:#f7f6f2;background:#111;border-radius:26px;align-items:center;gap:12px;height:52px;margin-top:18px;padding:0 24px;font-size:16px;font-weight:600;display:inline-flex}.begin svg{fill:none;stroke:currentColor;stroke-width:1.6px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:12px}.begin:hover{background:#000}.intro .hint{color:#666;margin-top:14px;font-size:13px}body[data-intro="1"]{overflow:hidden}body[data-intro="1"] .bar{color:#111;z-index:45}body[data-intro="1"] .sound{background:0 0;border-color:#0003}body[data-intro="1"] .sound[data-state=locked]{color:#f7f6f2;background:#111;border-color:#111}body[data-intro="1"] .board{z-index:45;--ink:#111;--ink2:#5a5a5a;--cyc:#f7f6f2;color:#111;background:linear-gradient(#f7f6f200,#f7f6f2 30%)}.intro{padding-bottom:calc(var(--board-h) + 24px)}.intro-tick span{letter-spacing:.08em;text-transform:uppercase;opacity:1!important}body[data-intro="0"] .intro{opacity:0;visibility:hidden;pointer-events:none;transition:opacity .7s var(--ease), visibility 0s linear .7s}@media (width>=900px){.intro p{font-size:20px}}.yrmark{pointer-events:none;width:0;height:52px;position:absolute;top:8px}.yrmark:before{content:"";background:var(--ink);opacity:.55;border-radius:1px;width:2px;height:30px;position:absolute;top:0;left:-1px}.yrmark span{font-variation-settings:"wdth" 75;letter-spacing:.04em;color:var(--ink2);font-variant-numeric:tabular-nums;white-space:nowrap;font-size:10.5px;font-weight:650;position:absolute;top:18px;left:5px}.tick{width:26px;height:40px;margin-left:-13px;top:16px}.tick:before{height:12px}.tick.on:before{height:22px}.intro-tick span{margin-top:4px}@media (width>=900px){.tick{width:28px;margin-left:-14px}.intro-tick{width:52px;margin-left:-26px}}html:has(body[data-intro="1"]),body[data-intro="1"]{background:#f7f6f2}body[data-intro="1"] .sound{visibility:hidden}.strip{height:70px}.playhead{height:40px;top:4px}.playhead:before{width:2px;height:40px;top:0;left:-1px}.tick,.yrmark{height:44px;top:0}.tick{flex-direction:column;justify-content:flex-end;align-items:center;width:24px;margin-left:-12px;display:flex}.tick:before{opacity:.4;width:1.5px;height:9px;transition:height .2s var(--ease), opacity .2s;border-radius:0}.tick[data-sound="1"]:before{width:1.5px;height:12px}.tick.near:before{opacity:.65}.tick.on:before{opacity:1;width:2px;height:16px}.yrmark:before{opacity:.75;border-radius:0;width:1.5px;height:20px;top:auto;bottom:0;left:-.75px}.yrmark.end:before{opacity:.3}.yrmark span{color:var(--ink2);font-size:10.5px;top:49px;left:0;transform:translate(-50%)}.intro-tick{width:48px;margin-left:-24px}.intro-tick:before{opacity:.75;width:1.5px;height:20px}.intro-tick span{margin:0;font-size:10.5px;position:absolute;top:49px;left:50%;transform:translate(-50%)}@media (width>=900px){.tick{width:26px;margin-left:-13px}}.more{bottom:calc(var(--board-h) + 10px)}@media (width<=899px){.scene{padding-bottom:calc(var(--board-h) + 46px)}.more{bottom:calc(var(--board-h) + 14px)}}.credit,.more{color:var(--ink)}.credit{opacity:.82}.board:has(.strip:focus-visible){outline:2px solid var(--ink);outline-offset:-4px;border-radius:4px}.strip:focus-visible .playhead:before{width:3px;left:-1.5px}.tick[data-sound="1"]:before{opacity:.6;width:2.5px;height:14px}@media (width>=900px){.detail{padding-right:0!important}.detail>*{margin-right:8px}}.name{letter-spacing:-.005em;font-variation-settings:"wdth" 92;font-size:18px;font-weight:700}.name span{font-size:15px;font-weight:400}@media (width>=900px){.name{font-size:20px}.name span{font-size:16px}}[hidden]{display:none!important}.piece picture{display:contents}a.begin{text-decoration:none}a.clip,a.tick{color:inherit;text-decoration:none}.desc em{font-style:italic}.piece img.production-logo{object-fit:contain;width:150px;max-width:min(100%,150px);height:auto;max-height:150px}@media (width<=899px){.detail{background:color-mix(in srgb, var(--cyc) 94%, transparent)}.detail .by,.detail .clip small,.detail .clip .t{color:var(--ink)}.words,.more,.credit{transition:opacity .3s}body.notes-open .words,body.notes-open .more,body.notes-open .credit{opacity:0!important}}@media (prefers-reduced-motion:reduce){.words,.more,.credit{transition:none}}html[data-intro="1"] .scene{visibility:hidden}html[data-intro="1"] .wash{background:#f7f6f2}