:root{--ink:#fffffff0;--dim:#ffffff85;--faint:#ffffff42;--gold:#c9b477;--edge:#ffffff29;--pad:clamp(18px, 3.2vw, 42px)}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{color:var(--ink);word-break:keep-all;overscroll-behavior:none;-webkit-font-smoothing:antialiased;background:#05060a;font-family:-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Noto Sans KR,sans-serif;overflow:hidden}canvas{display:block;position:fixed;inset:0}button,a{font:inherit;color:inherit}button{cursor:pointer;background:0 0;border:0;padding:0}a{text-decoration:none}.mark,.rail,.stage,.foot,.threshold,.fallback{z-index:2;position:fixed}.mark,.rail,.foot,.threshold{pointer-events:none}.mark button,.rail button,.foot a,.sound,.threshold button{pointer-events:auto}.mark{top:var(--pad);left:var(--pad);flex-direction:column;gap:4px;display:flex}.mark button{letter-spacing:.02em;font-size:15px;font-weight:600}.mark span{letter-spacing:.18em;color:var(--faint);text-transform:uppercase;font-size:11px}.rail{right:var(--pad);flex-direction:column;align-items:flex-end;gap:16px;display:flex;top:50%;transform:translateY(-50%)}.rail button{align-items:center;gap:10px;display:flex}.tick{background:var(--faint);width:18px;height:1px;transition:width .5s cubic-bezier(.16,1,.3,1),background .5s;display:block}.rail .on .tick{background:var(--gold);width:40px}.name{color:var(--dim);opacity:0;white-space:nowrap;order:-1;font-size:12px;transition:opacity .35s,transform .35s;transform:translate(6px)}.rail button:hover .name,.rail button:focus-visible .name,.rail .on .name{opacity:1;transform:none}.rail .on .name{color:var(--ink)}.stage{left:var(--pad);bottom:calc(var(--pad) + 58px);pointer-events:none;max-width:min(560px,62vw)}.stage h1{letter-spacing:-.03em;margin:0 0 10px;font-size:clamp(30px,5.4vw,58px);font-weight:600;line-height:1.1}.stage .line{color:var(--ink);margin:0;font-size:clamp(14px,1.5vw,17px)}.stage .note{color:var(--dim);max-width:42ch;margin:14px 0 0;font-size:13px;line-height:1.75}.foot{left:var(--pad);right:var(--pad);bottom:var(--pad);color:var(--faint);align-items:center;gap:20px;font-size:12px;display:flex}.foot a{color:var(--dim);border-bottom:1px solid #0000;transition:color .3s,border-color .3s}.foot a:hover{color:var(--ink);border-color:var(--edge)}.foot .hint{margin-left:auto}.sound{color:var(--faint);white-space:nowrap;margin-left:20px;font-size:12px;transition:color .3s}.sound:hover{color:var(--ink)}.threshold{text-align:center;padding:var(--pad);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:radial-gradient(#05060ab8,#05060af5 70%);place-items:center;display:grid;inset:0}.threshold .eyebrow,.fallback .eyebrow{letter-spacing:.22em;color:var(--faint);text-transform:uppercase;margin:0 0 14px;font-size:11px}.threshold h1{letter-spacing:-.045em;margin:0 0 12px;font-size:clamp(44px,9vw,96px);font-weight:600}.threshold .line{color:var(--dim);margin:0 0 40px;font-size:clamp(14px,1.7vw,18px)}.enter{border:1px solid var(--edge);letter-spacing:.06em;border-radius:999px;padding:13px 34px;font-size:14px;transition:border-color .4s,background .4s,letter-spacing .4s}.enter:hover{border-color:var(--gold);letter-spacing:.12em;background:#c9b47717}.mute-note{color:var(--faint);margin:18px 0 0;font-size:11px}.fallback{padding:var(--pad);align-content:center;justify-items:start;max-width:640px;display:grid;inset:0}.fallback h1{letter-spacing:-.04em;margin:0 0 10px;font-size:clamp(36px,8vw,64px)}.fallback .note{color:var(--dim);font-size:14px;line-height:1.8}.fallback a{color:var(--gold);border-bottom:1px solid var(--edge);margin-top:18px}.skip{top:-60px;left:var(--pad);z-index:5;border:1px solid var(--edge);background:#05060a;border-radius:8px;padding:10px 16px;transition:top .2s;position:fixed}.skip:focus{top:var(--pad)}:focus-visible{outline:1px solid var(--gold);outline-offset:6px}@media (max-width:760px){.stage{right:var(--pad);max-width:none;bottom:calc(var(--pad) + 74px)}.stage .note{display:none}.rail{top:auto;bottom:calc(var(--pad) + 34px);left:var(--pad);right:var(--pad);flex-direction:row;justify-content:space-between;gap:8px;transform:none}.rail button{flex:1}.tick{width:100%}.rail .on .tick{width:100%;height:2px}.name,.foot .hint{display:none}.sound{margin-left:auto}}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important}}