:root{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;color:#dedcf0;background:#10121e;font-synthesis:none;line-height:1.43}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 90% 2%,#232042 0%,transparent 48%),#10121e;min-height:100vh}button,select,input{font:inherit}button{cursor:pointer}button:disabled{opacity:.46;cursor:not-allowed}
button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #b6a0ff;outline-offset:2px}
#app{max-width:920px;margin:auto;padding:18px 20px}.topbar{display:flex;gap:13px;align-items:center;border-bottom:1px solid #34304c;padding:2px 0 16px}.brand-mark{flex:none;display:grid;place-items:center;width:46px;height:46px;border:1px solid #765cbd;background:linear-gradient(145deg,#473976,#251f44);border-radius:13px;color:#d9c4ff;box-shadow:0 0 23px #7057c927}.brand{flex:1;min-width:0}.brand>span,.eyebrow{font-size:10px;font-weight:800;letter-spacing:1.55px;color:#9995c2}.brand h1{margin:3px 0 0;font-size:19px;color:#f5eefe;line-height:1.25}.role{font-size:10px;letter-spacing:.8px;color:#c6b1fc;background:#30254a;border-radius:30px;padding:8px 11px;font-weight:850}.mode-nav{display:flex;gap:10px;margin:17px 0}.mode-nav button{padding:9px 15px;border-radius:9px;background:#1b1c2f;border:1px solid #37334e;color:#aaa5c5;font-size:12px;font-weight:800}.mode-nav button.chosen{color:#eee3ff;background:#493663;border-color:#9778c9}
.workspace{display:grid;grid-template-columns:216px minmax(0,1fr);gap:15px;align-items:start}.side{position:sticky;top:12px;background:#181928;border:1px solid #333149;border-radius:12px;padding:11px}.side-title{padding:7px 6px 13px}.person-card{width:100%;padding:9px;display:flex;align-items:center;gap:8px;background:#202038;color:#c9c3db;text-align:left;border:1px solid #333147;border-radius:10px;margin-bottom:7px}.person-card.selected{border-color:#a18bdf;background:#373057;color:#fff}.avatar{width:33px;height:33px;background:color-mix(in srgb,var(--player),transparent 70%);border:1px solid var(--player);border-radius:11px;display:grid;place-items:center;color:#fff;font-weight:850;flex-shrink:0}.person-copy{min-width:0;flex:1;display:grid;gap:2px}.person-copy strong{font-size:11px;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.person-copy small{font-size:10px;color:#9694ad}.effect-count{border-radius:10px;padding:2px 6px;background:#694f98;color:white;font-size:10px}.side .refresh{width:100%;margin-top:10px}.side-footer{padding:16px 4px 5px;color:#777b99;font-size:10px}.content{min-width:0}.section-heading{display:flex;justify-content:space-between;align-items:center;margin:8px 0 13px}.section-heading h2{font-size:20px;color:#faf7ff;margin:4px 0 0;word-break:break-word}.counter{font-size:10px;border:1px solid #61587e;border-radius:30px;padding:6px 10px;color:#b7a8d7;white-space:nowrap}.panel{border:1px solid #39354f;background:#1c1d30;border-radius:13px;padding:15px 16px;margin:0 0 14px}.panel h2{font-size:20px;margin:8px 0}.panel h3,.section-top h3{font-size:14px;margin:0;color:#ebdfff}.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}.hint-tag{font-size:10px;color:#a7a1c2;background:#25263b;padding:4px 8px;border-radius:6px}.bind-row{display:flex;gap:8px}.bind-row select{flex:1;min-width:0}.bind-row button{flex:none}.bind-row select,.duration select,.settings input,.offset-row input{border:1px solid #524b6e;background:#121624;color:#e5dff2;border-radius:8px;padding:10px 9px;font-size:12px}.bind-row .secondary,.secondary{border:1px solid #6c5a91;background:#332b4d;color:#dbcafa;border-radius:8px;padding:9px 10px;font-size:11px;font-weight:760}.secondary:hover{background:#4b3b69}.help{color:#a4a1bb;font-size:11px;line-height:1.5;margin:11px 0 0}.soft-warning{color:#d9bba2}.offset-row{display:flex;gap:9px;margin-top:10px}.offset-row label{display:grid;flex:1;gap:5px;color:#9796b6;font-size:10px}.offset-row input{min-width:0;width:100%;padding:6px 8px}
.section-top{display:flex;align-items:center;justify-content:space-between;margin:12px 0 13px;gap:7px}.duration{font-size:10px;color:#adacc6;display:flex;gap:7px;align-items:center}.duration select{padding:7px}.effect-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.effect-card{padding:13px;border:1px solid #3d3a53;background:linear-gradient(135deg,#1f2136,#191b2c);border-radius:12px;min-width:0;transition:background .2s,border-color .2s}.effect-card.enabled{border-color:#7862a5;background:linear-gradient(135deg,#2b2646,#1b1d33)}.effect-head{display:flex;align-items:center;gap:9px;min-height:50px}.effect-glyph{display:grid;place-items:center;width:37px;height:37px;border-radius:10px;border:1px solid #544d75;background:#332c4b;color:#d3b9ff;font-size:21px;flex:none}.effect-glyph.blind{color:#aaa8de}.effect-glyph.drunk{color:#a0cff7}.effect-glyph.trip{color:#d4abfb}.effect-glyph.fear{color:#e89d9e}.effect-glyph.poison{color:#9bd2a8}.effect-glyph.stun{color:#f1cc95}.effect-title{flex:1;min-width:0}.effect-title strong{font-size:12px;color:#ebe5f5}.effect-title small{font-size:10px;color:#9999b6;display:block;margin-top:3px;line-height:1.36}.toggle{position:relative;flex:none;cursor:pointer}.toggle input{position:absolute;opacity:0;width:43px;height:25px;z-index:1;cursor:pointer;margin:0}.toggle-track{display:block;width:43px;height:25px;border-radius:16px;background:#3c3b52;border:1px solid #55516c;transition:background .2s}.toggle-track:before{content:"";position:absolute;background:#b9b1c9;top:4px;left:4px;width:17px;height:17px;border-radius:50%;transition:transform .2s}.toggle input:checked+.toggle-track{background:#7860b1}.toggle input:checked+.toggle-track:before{transform:translateX(18px);background:white}.effect-controls{border-top:1px solid #333249;margin-top:11px;padding-top:11px}.range-head,.range-foot{display:flex;justify-content:space-between;gap:7px;align-items:center;font-size:10px;color:#a6a0b9}.range-head strong{font-size:11px;color:#d4c1ff}.effect-controls>input[type=range]{width:100%;margin:9px 0;accent-color:#b18cfa;height:14px}.range-foot{font-size:10px;color:#8c8aa8;min-height:14px}.compact-grid{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-bottom:10px}.compact-grid label{display:grid;gap:4px;font-size:10px;color:#b4acc9}.compact-grid input{min-width:0;padding:6px;border:1px solid #494260;border-radius:7px;color:#ddd0ff;background:#161729}.movement .panel-head{margin-bottom:3px}.danger-actions{display:flex;flex-wrap:wrap;gap:9px;margin:13px 0 16px}.danger-btn{border:1px solid #a55468;color:#ffd6dc;background:#4c2838;border-radius:9px;padding:11px 13px;font-size:11px;font-weight:750}.danger-btn:hover{background:#723345}.ghost{padding:10px 12px;border:1px solid #4d4967;border-radius:9px;background:#242438;color:#c8badc;font-size:11px}.ghost:hover{background:#343049}
.settings{max-width:640px;margin:0 auto}.settings label{display:grid;gap:8px;margin-top:15px;color:#beb4d9;font-size:12px}.settings input{width:130px}.settings h3{margin-top:22px}.divider{border-top:1px solid #3a3552;margin-top:22px}.player-layout{max-width:640px;margin:22px auto}.player-layout .panel{margin-bottom:13px}.player-conditions{padding:21px}.active-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:13px}.condition-chip{display:inline-flex;gap:6px;align-items:center;font-weight:750;font-size:12px;color:#e2cfff;background:#393058;border-radius:30px;padding:9px 13px;border:1px solid #6e5a9c}.setting-toggle{display:flex;align-items:center;gap:10px;color:#eee5ff;font-size:12px;cursor:pointer}.setting-toggle input{accent-color:#9673d5;width:17px;height:17px}.pad{text-align:center}.pad h3{margin:5px}.pad p{font-size:12px;color:#a4a0bc}.pad-grid{display:grid;grid-template-columns:repeat(3,53px);grid-auto-rows:50px;gap:6px;justify-content:center;margin:16px auto}.pad-grid button{border-radius:10px;background:#493a67;color:#e8deff;border:1px solid #8a6ab1;font-weight:850;font-size:24px}.pad-grid button:active{transform:scale(.95);background:#6e5593}.pad-grid span,.pad-grid .pad-center{display:grid;place-items:center;color:#807a98}.muted{color:#8e8eac;font-size:12px}.alert{margin:12px 0;padding:12px 15px;border-radius:10px;font-size:12px;display:flex;justify-content:space-between;gap:12px;align-items:center}.alert.danger{border:1px solid #9e5267;background:#4e2636;color:#ffd8de}.alert.good{border:1px solid #46765e;background:#1d3831;color:#9bdfbd}.alert button{border:0;background:transparent;color:inherit;font-size:20px}footer{display:flex;align-items:center;gap:8px;margin-top:17px;padding-top:12px;border-top:1px solid #343249;color:#82809c;font-size:10px}.footer-version{margin-left:auto}.status-light{width:7px;height:7px;border-radius:100%;background:#777394;flex:none}.status-light.live{background:#81d2a7;box-shadow:0 0 8px #81d2a7}.status-light.bad{background:#e990a4}.loading{text-align:center;padding:45px;color:#b0a8c4}
@media(max-width:720px){#app{padding:12px}.workspace{grid-template-columns:1fr}.side{position:static;display:flex;flex-wrap:wrap;gap:7px}.side-title{width:100%;padding:0}.person-card{flex:1 1 145px;margin:0}.side-footer{width:100%;padding:5px}.side .refresh{width:auto}.effect-grid{grid-template-columns:1fr 1fr}.brand h1{font-size:16px}}
@media(max-width:490px){.effect-grid{grid-template-columns:1fr}.bind-row{flex-wrap:wrap}.bind-row select{flex-basis:100%}.topbar{gap:8px}.brand-mark{height:40px;width:40px}.brand>span{font-size:8px}.role{font-size:9px;padding:7px}.section-heading h2{font-size:17px}}

/* Token-center calibration controls — coordinates are now computed automatically. */
.offset-reset{margin-top:8px;min-height:32px;padding:6px 11px;font-size:11px;color:#cbbef1;border:1px solid #514872;border-radius:8px;}
.offset-reset:hover{color:#fff;border-color:#a78ce8;}