:root{--bg:#14161ee0;--bg2:#282c3af2;--fg:#f1f2f6;--muted:#a3a8b8;--accent:#ffb703;--danger:#e63946;--radius:10px;color:var(--fg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:14px}*{box-sizing:border-box}html,body{background:#111;height:100%;margin:0;overflow:hidden}#game{touch-action:none;outline:none;width:100vw;height:100vh;display:block}#ui{pointer-events:none;position:fixed;inset:0}#ui>*{pointer-events:auto}#topbar{background:var(--bg);border-radius:var(--radius);flex-wrap:wrap;align-items:center;gap:6px;padding:6px 10px;display:flex;position:absolute;top:10px;left:10px;right:10px}#topbar .title{align-items:center;gap:6px;margin-right:10px;font-weight:700;display:flex}#topbar .title img{border-radius:4px;height:24px}#topbar .spacer{flex:1}#panel{background:var(--bg);border-radius:var(--radius);width:300px;max-height:calc(100vh - 140px);padding:12px;position:absolute;top:66px;right:10px;overflow-y:auto}#panel:empty{display:none}#panel h3{margin:4px 0 8px;font-size:15px}#panel h4{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:14px 0 6px;font-size:12px}#panel .row{align-items:center;gap:8px;margin:6px 0;display:flex}#panel .row label{color:var(--muted);flex:0 0 110px}#panel .row input[type=text],#panel .row select{flex:1;min-width:0}#panel .row input[type=range]{flex:1}#panel .row .val{text-align:right;font-variant-numeric:tabular-nums;width:38px}#panel .grid{grid-template-columns:repeat(3,1fr);gap:6px;display:grid}#panel .note{color:var(--muted);font-size:12px;line-height:1.4}#panel img.logo{background:#fff2;border-radius:6px;max-width:100%;max-height:80px;margin:6px 0;display:block}button,select,input[type=text]{font:inherit;color:var(--fg);background:var(--bg2);border:1px solid #fff2;border-radius:7px;padding:6px 10px}button{cursor:pointer}button:hover:not(:disabled){border-color:var(--accent)}button.active{background:var(--accent);color:#222;border-color:var(--accent)}button.danger{border-color:var(--danger)}button:disabled{opacity:.45;cursor:not-allowed}button.wide{width:100%;margin:3px 0}button.tile{flex-direction:column;align-items:center;gap:2px;padding:8px 4px;font-size:12px;display:flex}button.tile .ico{font-size:22px}button.tile .tag{color:var(--muted);font-size:10px}input[type=color]{cursor:pointer;background:0 0;border:none;width:44px;height:30px;padding:0}#hint{background:var(--bg);border-radius:var(--radius);max-width:calc(100vw - 340px);color:var(--muted);padding:6px 12px;font-size:12px;position:absolute;bottom:10px;left:10px}#hint:empty{display:none}#hint kbd{color:var(--fg);background:#fff2;border-radius:4px;padding:0 5px;font-family:inherit}#prompt{background:var(--bg);border-radius:var(--radius);padding:10px 18px;font-size:16px;display:none;position:absolute;bottom:80px;left:50%;transform:translate(-50%)}#prompt.show{display:block}#toast{background:var(--accent);color:#222;border-radius:var(--radius);opacity:0;pointer-events:none;padding:8px 16px;font-weight:600;transition:opacity .3s;position:absolute;top:70px;left:50%;transform:translate(-50%)}#toast.show{opacity:1}#fade{opacity:0;pointer-events:none;background:#000;transition:opacity .4s;position:absolute;inset:0}#fade.on{opacity:1}#crosshair{color:#fff8;pointer-events:none;font-size:20px;display:none;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#crosshair.show{display:block}@media (width<=700px){#panel{width:auto;max-height:45vh;top:auto;bottom:50px;left:10px}#hint{max-width:calc(100vw - 20px)}}
