@font-face{font-family:Drift;src:url('assets/inter-tight.woff2') format('woff2');font-display:swap;font-weight:100 900}
@font-face{font-family:Han;src:url('assets/noto-sans-sc.woff2') format('woff2');font-display:swap;font-weight:100 900}
:root{--bg:#e7def2;--panel:#f4eef8;--line:#b6a6c8;--text:#32213f;--muted:#705b80;--cyan:#6d3f88;--pink:#9b3d83;--yellow:#694180}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#e7def2;font-family:Drift,Han,sans-serif;color:var(--text)}
button,a{font:inherit;color:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #8d4aa6;outline-offset:4px}button{transition:background .18s ease,color .18s ease,transform .18s ease}button:active{transform:translateY(1px)}::selection{background:#b38cc9;color:#24152f}
#app{position:relative;width:100%;height:100%;display:grid;place-items:center;overflow:hidden;background:#ded2ea}
#stage{position:relative;width:min(100vw,56.25svh);height:min(100svh,177.7778vw);aspect-ratio:9/16;overflow:hidden;background:#e7def2;container-type:inline-size}
canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}
.hidden{display:none!important}
.screen{position:absolute;inset:0;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;padding:8.8cqw 7.8cqw 5cqw;z-index:5}
.game-back{position:absolute;z-index:7;left:7.8cqw;bottom:5.2cqw;font-size:max(11px,2.7cqw);color:#6c527e;text-decoration:none;border-bottom:1px solid #9c84af;padding-bottom:3px}
.edition{position:absolute;z-index:2;right:7.8cqw;bottom:5.2cqw;font-size:max(11px,2.7cqw);color:#6c527e}
.logo{text-align:left;letter-spacing:-.035em;font-weight:850;line-height:1.15}
.logo b{display:block;font-size:7.5cqw;font-weight:850;color:#382345}
.logo span{display:block;margin-top:1.6cqw;font-size:3.2cqw;font-weight:650;letter-spacing:0;color:#786087}
.sub{margin-top:2.7cqw;color:#705780;font-size:3cqw;text-align:left}
.menu-panel{width:100%;margin-top:4.8cqw;padding:0;background:none;border:0;box-shadow:none}
.section-title{display:flex;align-items:center;justify-content:space-between;margin:0 0 1.8cqw;font-size:max(11px,2.8cqw);color:#705780;gap:2cqw}
.section-title b{font-weight:700;color:#432d52}.section-title span{font-size:max(11px,2.3cqw)}
.option-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6cqw}.mode-grid{grid-template-columns:repeat(2,1fr)}
.option{position:relative;min-height:10.3cqw;border:1px solid #b9a9c9;border-radius:12px;background:#efe7f5;padding:1.5cqw 1.7cqw;cursor:pointer;overflow:hidden}
.option:hover{background:#f8f2fc}.option.active{border-color:#78518f;background:#e1d1ee;box-shadow:none}
.mode-option{min-height:10.3cqw;display:grid;grid-template-columns:6.4cqw 1fr;align-items:center;text-align:left;padding:1.6cqw 2.2cqw}
.mode-option .icon{grid-row:1/3;display:flex;align-items:center;justify-content:center;width:5cqw;height:5cqw;color:#624077}.mode-option .icon svg{width:100%;height:100%}
.option .name{font-size:max(11px,2.8cqw);font-weight:750;text-align:left;line-height:1.3}.option .desc{font-size:max(11px,2.2cqw);color:#705780;text-align:left;margin-top:.5cqw;line-height:1.3}
.option[data-car]{display:grid;grid-template-columns:3.5cqw 1fr;align-items:center;gap:0 1.2cqw;padding:1.6cqw 1.5cqw;min-height:8.6cqw}
.option[data-car] .icon{grid-row:1/3;width:3.1cqw;height:3.1cqw;border-radius:50%;background:currentColor;font-size:0;box-shadow:inset 0 0 0 1px #0002,inset 1px 2px 3px #fff8}
.option[data-car] .name{font-size:max(11px,2.5cqw)}.option[data-car] .desc{font-size:max(11px,2cqw)}
.option.active:after{content:attr(data-badge);position:absolute;right:1cqw;top:.7cqw;color:#5d3d74;font-weight:800;font-size:max(11px,2cqw)}
.start-btn,.primary,.secondary,.share-primary{width:100%;border:0;border-radius:12px;cursor:pointer;font-weight:750;letter-spacing:0}
.start-btn{margin-top:2.7cqw;padding:3.1cqw 4cqw;background:#56336b;color:#fff;font-size:3.3cqw;box-shadow:0 8px 18px #43225325}
.start-btn:hover,.share-primary:hover{background:#67407c}.primary,.share-primary{padding:3.1cqw;background:#56336b;color:#fff;font-size:3.2cqw}
.secondary{padding:2.8cqw;background:#e2d4ec;border:0;margin-top:2cqw;color:#4f345f;font-size:3cqw}.secondary:hover{background:#d8c5e6}
.tips{margin-top:2.2cqw;color:#57386a;font-size:max(11px,2.7cqw);font-weight:500;line-height:1.65;text-align:center}
#hud{position:absolute;inset:0;z-index:3;pointer-events:none;padding:calc(env(safe-area-inset-top) + 6cqw) 6cqw 5cqw}
.hud-top{display:flex;align-items:flex-start;justify-content:space-between;gap:2cqw}
.hud-box{min-width:24cqw;border:0;border-radius:0;padding:2cqw 0;background:none;backdrop-filter:none}
.hud-label{font-size:max(11px,2.5cqw);color:#745a83;letter-spacing:0}.hud-value{font-size:5.3cqw;line-height:1.4;font-weight:800;font-variant-numeric:tabular-nums}.hud-value.cyan,.hud-value.yellow{color:#56336b!important;text-shadow:none}
#soundBtn{pointer-events:auto;width:10cqw;height:10cqw;border-radius:50%;border:1px solid #b7a2c7;background:#e6daf0;font-size:4cqw;cursor:pointer}
#hint{position:absolute;left:8cqw;right:8cqw;bottom:14cqw;padding:3.5cqw 3cqw;border:1px solid #b8a0c8!important;border-radius:12px;background:#f0e8f6;text-align:center;font-size:3cqw;font-weight:650;line-height:1.5;box-shadow:none;color:#5c3b70}
#countdown{position:absolute;left:50%;top:35%;transform:translate(-50%,-50%);z-index:4;font-size:24cqw;font-weight:850;letter-spacing:-.04em;color:#67417d;text-shadow:0 10px 30px #4d2d6120;pointer-events:none}
#result{background:linear-gradient(180deg,#e7def2 0%,#e7def2f2 41%,#e7def200 70%)}
.result-card{text-align:center;margin-top:5cqw;border:0;background:none;padding:0;box-shadow:none}.result-kicker{font-size:max(11px,2.8cqw);color:#705780;letter-spacing:0}.result-title{font-size:7cqw;font-weight:800;margin:2cqw 0}.result-score{font-size:15cqw;font-weight:850;line-height:1.1;color:#694180!important;text-shadow:none;font-variant-numeric:tabular-nums}
.result-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:1.6cqw;margin:4cqw 0}.meta-item{padding:1.6cqw 0;border-radius:0;background:none}.meta-item+.meta-item{border-left:1px solid #c3b2d0}.meta-item b{display:block;font-size:4cqw}.meta-item span{font-size:max(11px,2.5cqw);color:#705780}
.result-share-note{margin:2cqw 0 3cqw;color:#705780;font-size:max(11px,2.3cqw)}.result-actions{display:grid;grid-template-columns:1fr 1fr;gap:2cqw}.result-actions .secondary{margin-top:0}
.flash{position:absolute;inset:0;z-index:10;pointer-events:none;background:white;opacity:0}
.share-modal{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:4cqw;background:#e7def2ed;overflow:auto}
.share-sheet{position:relative;width:100%;max-height:100%;padding:4cqw;border:0;border-radius:16px;background:#f5eff9;box-shadow:0 20px 60px #4b285b30;overflow:auto}
.share-close{position:absolute;right:3cqw;top:3cqw;z-index:2;width:8cqw;height:8cqw;border:1px solid #c4afd4;border-radius:50%;background:#e7dbef;font-size:5cqw;line-height:1}
.share-heading{padding-right:10cqw;font-size:4cqw;font-weight:750}.share-subtitle{margin:1.5cqw 10cqw 3cqw 0;color:#705780;font-size:max(11px,2.5cqw);line-height:1.55}.poster-wrap{position:relative;display:flex;justify-content:center;border-radius:12px;background:#d7c6e4;overflow:hidden}
#sharePoster{display:block;width:auto;max-width:100%;height:min(53svh,560px);aspect-ratio:3/4;object-fit:contain;-webkit-touch-callout:default;user-select:auto}
.share-tip{margin:2.5cqw 0;color:#705780;font-size:max(11px,2.6cqw);line-height:1.55;text-align:center}.share-actions{display:grid;grid-template-columns:1.2fr .8fr;gap:2cqw}.share-actions .secondary{display:flex;align-items:center;justify-content:center;margin-top:0;color:inherit;font:inherit;text-decoration:none;text-align:center}
.toast{position:absolute;left:50%;bottom:8cqw;z-index:40;transform:translate(-50%,12px);max-width:82%;padding:3cqw 4cqw;border:0;border-radius:12px;background:#4e315f;color:#fff;font-size:max(11px,2.8cqw);text-align:center;opacity:0;pointer-events:none;transition:.22s ease}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(prefers-reduced-motion:reduce){button,.toast{transition:none}}
@media(max-aspect-ratio:9/16){#stage{width:100vw;height:100svh}#stage canvas{height:100%;object-fit:contain}.screen{padding-top:max(8cqw,env(safe-area-inset-top))}.game-back,.edition{bottom:max(5cqw,env(safe-area-inset-bottom))}}

#soundBtn{font-size:0;display:grid;place-items:center}#soundBtn::after{content:"";display:block;width:5.5cqw;height:5.5cqw;background:center/contain no-repeat url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2356336b%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M11%205%206%209H3v6h3l5%204V5Z%22%2F%3E%3Cpath%20d%3D%22M15%208a6%206%200%200%201%200%208m3-11a10%2010%200%200%201%200%2014%22%2F%3E%3C%2Fsvg%3E") }
#soundBtn[data-muted="true"]::after{background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%20viewBox%3D%220%200%2024%2024%22%20fill%3D%22none%22%20stroke%3D%22%2356336b%22%20stroke-width%3D%221.7%22%20stroke-linecap%3D%22round%22%20stroke-linejoin%3D%22round%22%3E%3Cpath%20d%3D%22M11%205%206%209H3v6h3l5%204V5Z%22%2F%3E%3Cpath%20d%3D%22m16%209%206%206m0-6-6%206%22%2F%3E%3C%2Fsvg%3E") }