*{box-sizing:border-box}html,body,#app{width:100%;height:100%;margin:0;overflow:hidden;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#f7f3ea;background:#16120f}.viewport{position:relative;width:100%;height:100%}#scene{display:block;width:100%;height:100%}.panel{position:absolute;top:16px;left:16px;width:min(360px,calc(100vw - 32px));display:grid;gap:14px;padding:14px;border:1px solid rgb(255 255 255 / 14%);border-radius:8px;background:#12100ed1;box-shadow:0 18px 60px #00000047;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px)}.title{display:grid;gap:2px}h1{margin:0;font-size:18px;font-weight:720;letter-spacing:0}.subtitle{margin:0;color:#bfb5a3;font-size:12px}.ruling{min-height:16px;margin:4px 0 0;color:#e0c98e;font-size:12px;line-height:1.35}.button-row{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}.choice-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.choice-row[hidden]{display:none}button{min-height:34px;border:1px solid rgb(255 255 255 / 16%);border-radius:6px;color:#f7f3ea;background:#2d2520;font:inherit;font-size:12px;cursor:pointer}button:hover{background:#3a3028}button:disabled{cursor:default;opacity:.42}button.primary{border-color:#d9b66c;color:#211911;background:#d9b66c}.mode-strip{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}.mode-strip span{min-height:32px;display:grid;place-items:center;border:1px solid rgb(255 255 255 / 12%);border-radius:6px;color:#bfb5a3;background:#ffffff0d;font-size:12px;font-weight:720}.mode-strip span.active{border-color:#d9b66c;color:#211911;background:#d9b66c}.stroke-meter{height:12px;overflow:hidden;border:1px solid rgb(255 255 255 / 14%);border-radius:999px;background:#00000038}.stroke-meter span{width:100%;height:100%;display:block;transform:scaleX(.02);transform-origin:left center;background:linear-gradient(90deg,#d9b66c,#da6c3c)}.mouse-input-status{display:block;color:#8fca9b;font-size:11px}.mouse-input-status.warning{color:#e0a66f}.readout{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.metric{min-height:52px;display:grid;gap:2px;padding:8px;border:1px solid rgb(255 255 255 / 10%);border-radius:6px;background:#ffffff0f}.metric span:first-child{color:#bfb5a3;font-size:11px}.metric span:last-child{overflow:hidden;color:#fff;font-size:16px;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap}@media(max-width:620px){.panel{top:auto;bottom:12px;left:12px;width:calc(100vw - 24px)}.readout{grid-template-columns:repeat(4,minmax(0,1fr))}.metric{min-height:46px}.metric span:last-child{font-size:13px}}