.touch{position:fixed;top:0;right:0;bottom:0;left:0;z-index:40;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr 64px 56px;gap:6px;padding:6px;box-sizing:border-box;pointer-events:none;user-select:none;-webkit-user-select:none;touch-action:none;font-family:system-ui,-apple-system,sans-serif;color:#fff}.touch[hidden]{display:none}.touch>*{pointer-events:auto;touch-action:none;-webkit-tap-highlight-color:transparent}.tc-label{position:absolute;top:max(8px,env(safe-area-inset-top));left:50%;transform:translate(-50%);display:flex;align-items:center;gap:8px;padding:4px 12px 4px 4px;border-radius:999px;background:#080a14b3;border:1px solid rgba(255,255,255,.15);font-size:13px;pointer-events:none;z-index:2}.tc-label:empty,.tc-label .tc-who:empty{display:none}.tc-seat{width:22px;height:22px;border-radius:6px;display:grid;place-items:center;font-weight:900;font-size:11px;background:#8a91b4}.tc-seat.s0{background:#e8342e}.tc-seat.s1{background:#3b7fe8}.tc-seat.s2{background:#ffd36b;color:#2a1a00}.tc-seat.s3{background:#3ddc84;color:#072a16}.tc-zone{position:relative;border-radius:16px;border:1px solid rgba(255,255,255,.12);background:#ffffff09;overflow:hidden;transition:background .15s,border-color .15s}.tc-zone.live{background:#ffffff12;border-color:#ffffff4d}.tc-move{background:linear-gradient(160deg,#3b7fe829,#3b7fe808)}.tc-attack{background:linear-gradient(200deg,#e8342e29,#e8342e08)}.tc-hint{position:absolute;top:0;right:0;bottom:0;left:0;display:grid;place-items:center;pointer-events:none;color:#ffffff59}.tc-hint>span{position:absolute;bottom:10px;left:0;right:0;text-align:center;font-size:11px;letter-spacing:.3em;font-weight:800}.tc-cross{width:110px;height:110px;background:linear-gradient(#ffffff24,#ffffff24) center / 30px 100% no-repeat,linear-gradient(#ffffff24,#ffffff24) center / 100% 30px no-repeat;border-radius:10px}.tc-compass{position:absolute;top:0;right:0;bottom:0;left:0}.tc-compass b{position:absolute;display:flex;flex-direction:column;align-items:center;font-size:26px;font-weight:900;font-style:italic;line-height:1;color:#ffffff73;transition:color .1s,transform .1s}.tc-compass b small{font-size:9px;letter-spacing:.12em;text-transform:uppercase;font-style:normal;font-weight:700;margin-top:2px}.tc-compass .k{top:14px;left:50%;transform:translate(-50%)}.tc-compass .j{bottom:30px;left:50%;transform:translate(-50%)}.tc-compass .h{left:14px;top:50%;transform:translateY(-50%)}.tc-compass .l{right:14px;top:50%;transform:translateY(-50%)}.tc-compass b.on{color:#fff;text-shadow:0 0 14px #ffd36b}.tc-compass .k.on,.tc-compass .j.on{transform:translate(-50%) scale(1.2)}.tc-compass .h.on,.tc-compass .l.on{transform:translateY(-50%) scale(1.2)}.tc-base{position:absolute;left:50%;top:50%;width:120px;height:120px;margin:-60px 0 0 -60px;border-radius:50%;background:#ffffff14;border:2px solid rgba(255,255,255,.35);box-shadow:inset 0 0 30px #0000004d;display:grid;place-items:center;opacity:0;pointer-events:none;transition:opacity .12s}.tc-base.live{opacity:1}.tc-knob{width:54px;height:54px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#b9bcc4 60%,#7a808a);box-shadow:0 6px 14px #00000080}.tc-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;border-radius:14px;border:1px solid rgba(255,255,255,.18);background:#14182c99;color:#fff;font:inherit;padding:0}.tc-btn b{font-size:18px;font-weight:900;font-style:italic;letter-spacing:.08em;line-height:1}.tc-btn small{font-size:9px;letter-spacing:.12em;text-transform:uppercase;color:#fff9}.tc-btn.down{background:#e8342ecc;border-color:#fff}.tc-btn.latched{background:#ffd36bd9;border-color:#fff;color:#2a1a00}.tc-btn.latched small{color:#2a1a00b3}.tc-jump{grid-column:1 / span 2;background:#a04fff59}@media(max-height:420px){.touch{grid-template-rows:1fr 54px 48px;gap:4px;padding:4px}.tc-base{width:100px;height:100px;margin:-50px 0 0 -50px}.tc-compass b{font-size:22px}}