*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;background:#f3c9b8;font:14px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;color:#3b2430;-webkit-user-select:none;user-select:none}
#c{position:fixed;inset:0;width:100%;height:100%;display:block;touch-action:none}
#loading{position:fixed;inset:0;display:grid;place-items:center;font-size:18px;letter-spacing:.04em;transition:opacity .8s}
body.ready #loading{opacity:0;pointer-events:none}
header{position:fixed;top:calc(env(safe-area-inset-top) + 12px);left:16px;display:flex;align-items:baseline;gap:12px;pointer-events:none;text-shadow:0 1px 8px rgba(255,255,255,.5)}
h1{margin:0;font:300 28px/1 Georgia,"Times New Roman",serif;letter-spacing:.12em;color:#5a2a3c}
#stats{font-size:11px;opacity:.65;font-variant-numeric:tabular-nums}
#panel{position:fixed;right:14px;bottom:calc(env(safe-area-inset-bottom) + 14px);width:270px;padding:14px 16px 12px;border-radius:18px;background:rgba(255,246,248,.55);backdrop-filter:blur(14px) saturate(1.3);-webkit-backdrop-filter:blur(14px) saturate(1.3);box-shadow:0 8px 30px rgba(80,30,50,.18);border:1px solid rgba(255,255,255,.6)}
#panelToggle{position:absolute;top:-14px;right:-6px;width:32px;height:32px;border-radius:50%;border:0;background:rgba(255,255,255,.85);box-shadow:0 2px 8px rgba(0,0,0,.15);font-size:16px;cursor:pointer;color:#5a2a3c}
.rows label{display:block;font-size:12px;letter-spacing:.03em;margin-bottom:8px}
input[type=range]{width:100%;margin:4px 0 0;accent-color:#d76a8c;height:26px}
.btns{display:flex;gap:8px;margin-top:4px}
.btns button{flex:1;padding:9px 6px;border-radius:12px;border:0;background:#e98aa6;color:#fff;font-weight:600;font-size:13px;cursor:pointer;box-shadow:0 2px 8px rgba(200,80,120,.3)}
.btns button:active{transform:scale(.97)} #sound{background:rgba(255,255,255,.75);color:#5a2a3c} #sound.on{background:#7a5a9a;color:#fff}
body.collapsed #panel .rows{display:none} body.collapsed #panel{width:auto;padding:0;background:none;border:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
body.collapsed #panelToggle{position:static;width:44px;height:44px;font-size:20px}
@media (max-aspect-ratio:1/1){#panel{left:12px;right:12px;width:auto} body.collapsed #panel{left:auto} h1{font-size:24px}}