:root{--plastic:#d3d0c8;--plastic-hi:#ffffffad;--plastic-lo:#00000029;--plastic-deep:#0000001a;--bevel-up:inset 0 1px 0 var(--plastic-hi), inset 0 -2px 3px var(--plastic-deep);--bevel-down:inset 0 2px 5px #00000038, inset 0 -1px 0 #ffffff59;--drop:0 8px 18px #00000052;--ink:#24272c;--ink-dim:#5b6069;--ink-faint:#83878f;--red:#c8281f;--red-hi:#e0483c;--red-lo:#8f1a14;--blue:#2f6fd0;--green:#3f9e52;--amber:#e08a1e;--radius:16px;--radius-sm:10px;--mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;--sans:-apple-system, BlinkMacSystemFont, "Segoe UI", Inter, Roboto, system-ui, sans-serif}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}@supports (height:100dvh){html,body,#root{height:100dvh}}body{color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased;background:#0d1016;font-size:13px;line-height:1.45;overflow:hidden}body[data-dragging=true]{cursor:grabbing}canvas{touch-action:none;display:block}.app{width:100%;height:100%;position:relative}.hud{pointer-events:none;padding:max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right)) max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));flex-direction:column;justify-content:space-between;display:flex;position:absolute;inset:0}.hud>*{pointer-events:none}.panel,.button,.policy,.cardthumb,.chip,select,input,textarea{pointer-events:auto}.row{align-items:center;gap:10px;display:flex}.row.wrap{flex-wrap:wrap}.spacer{flex:1}.panel{border-radius:var(--radius);background:linear-gradient(180deg, #dad7cf, var(--plastic));box-shadow:var(--bevel-up), var(--drop);color:var(--ink);border:1px solid #00000038;flex-direction:column;gap:12px;padding:14px;display:flex}.panel__head{justify-content:space-between;align-items:center;gap:8px;display:flex}.panel__title{letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);font-size:10.5px;font-weight:800}.brand{flex-direction:column;gap:3px;display:flex}.brand__eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--ink-faint);font-size:10.5px;font-weight:800}.brand__logo{letter-spacing:-.035em;text-transform:uppercase;white-space:nowrap;flex-direction:column;font-size:25px;font-weight:900;line-height:.94;display:flex}.brand__logo-top{color:var(--ink)}.brand__logo-bottom{color:var(--red)}.nameplate{border-radius:var(--radius);background:linear-gradient(180deg, #dad7cf, var(--plastic));box-shadow:var(--bevel-up), var(--drop);border:1px solid #00000038;align-items:center;padding:14px 18px;display:flex}.statcard{border-radius:var(--radius);background:linear-gradient(180deg, #dad7cf, var(--plastic));box-shadow:var(--bevel-up), var(--drop);border:1px solid #00000038;align-items:center;gap:16px;padding:12px 16px;display:flex}.stat{flex-direction:column;gap:1px;min-width:56px;display:flex}.stat__value{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink);font-size:19px;font-weight:700;line-height:1.1}.stat__label{letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);font-size:9.5px}.stat__value.stat--good,.stat--good .stat__value{color:var(--green)}.stat__value.stat--warn,.stat--warn .stat__value{color:var(--amber)}.divider{background:#0000001a;border-radius:2px;align-self:stretch;width:2px;box-shadow:1px 0 #ffffff8c}.button{border-radius:var(--radius-sm);color:var(--ink);font:inherit;cursor:pointer;white-space:nowrap;background:linear-gradient(#f0ede6,#d9d5cd);border:1px solid #0000003d;padding:8px 14px;font-size:12.5px;font-weight:700;transition:transform 80ms,box-shadow 80ms,background .15s;box-shadow:inset 0 1px #ffffffd9,0 3px #0000002e}.button:hover:not(:disabled){background:linear-gradient(#f7f4ee,#e2ded6)}.button:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 2px 5px #0000003d,inset 0 -1px #fff6}.button:disabled{opacity:.45;cursor:not-allowed}.button--primary{background:linear-gradient(180deg, var(--red-hi), var(--red));color:#fff;box-shadow:inset 0 1px 0 #fff6, 0 3px 0 var(--red-lo);border-color:#0000004d}.button--primary:hover:not(:disabled){background:linear-gradient(#ee5a4c,#d33027)}.button--primary:active:not(:disabled){box-shadow:inset 0 2px 6px #00000059, 0 1px 0 var(--red-lo)}.button--ghost{background:#ffffff47;box-shadow:inset 0 1px #fff9,0 2px #0000001f}.button--on{color:#7c1b14;background:linear-gradient(#fbe0dd,#f3c9c4);border-color:#c8281f80;box-shadow:inset 0 1px #ffffffb3,inset 0 -2px 4px #c8281f2e,0 2px #0000001f}.button--danger{color:#7c1b14;background:linear-gradient(#f6d7d3,#e9b6b0);border-color:#8c1e1673}.panel-slot{overscroll-behavior:contain;pointer-events:auto;width:368px;max-height:calc(100% - 32px);position:absolute;top:16px;right:16px;overflow-y:auto}.panel-slot::-webkit-scrollbar{width:10px}.panel-slot::-webkit-scrollbar-thumb{background:#00000038;border-radius:8px}.drawer-toggle{display:none}.policy-grid{grid-template-columns:1fr 1fr;gap:8px;display:grid}.policy{border-radius:var(--radius-sm);color:var(--ink);font:inherit;text-align:left;cursor:pointer;background:linear-gradient(#e6e3dc,#d5d1c9);border:1px solid #00000038;flex-direction:column;gap:3px;padding:9px 11px;transition:transform 80ms,box-shadow 80ms,background .15s;display:flex;box-shadow:inset 0 1px #ffffffb3,0 2px #00000024}.policy:hover:not(:disabled){background:linear-gradient(#f1eee7,#ded9d1)}.policy:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 2px 5px #00000038}.policy[data-active=true]{background:linear-gradient(#fce4e1,#f4cdc8);border-color:#c8281f8c;box-shadow:inset 0 1px #fffc,inset 0 -3px 6px #c8281f29}.policy:disabled{opacity:.5;cursor:not-allowed}.policy__name{align-items:center;gap:6px;font-size:12.5px;font-weight:800;display:flex}.policy__blurb{color:var(--ink-dim);font-size:11px;line-height:1.35}.lock{letter-spacing:.08em;text-transform:uppercase;color:var(--ink-dim);background:#ffffff73;border:1px solid #00000040;border-radius:4px;padding:0 5px;font-size:9px}.note{border-radius:var(--radius-sm);box-shadow:var(--bevel-down);color:var(--ink-dim);background:#0000000e;border:1px solid #00000029;padding:9px 11px;font-size:11.5px;line-height:1.5}.note--warn{color:#6d4708;background:#e08a1e24;border-color:#a0601059}.note code,.mono{font-family:var(--mono);color:#1f4c86;font-size:10.5px}.field{flex-direction:column;gap:5px;display:flex}.field label{letter-spacing:.09em;text-transform:uppercase;color:var(--ink-faint);font-size:10px}.field__row{align-items:stretch;gap:6px;display:flex}.field__row input{flex:1;min-width:0}.field__row .button{flex:none}input,select{border-radius:var(--radius-sm);width:100%;color:var(--ink);font:inherit;font-family:var(--mono);box-shadow:var(--bevel-down);background:#f3f1ec;border:1px solid #0003;padding:7px 10px;font-size:12px}input:focus,select:focus{border-color:#c8281f99;outline:none}table.metrics{border-collapse:collapse;width:100%;font-family:var(--mono);font-variant-numeric:tabular-nums;font-size:11.5px}table.metrics th,table.metrics td{text-align:right;color:var(--ink-dim);border-bottom:1px solid #0000001f;padding:5px 2px}table.metrics th:first-child,table.metrics td:first-child{text-align:left}table.metrics td:first-child{font-family:var(--sans);color:var(--ink)}table.metrics tr:last-child td{border-bottom:none}.calib{flex-direction:column;gap:5px;display:flex}.calib__row{font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink-dim);grid-template-columns:76px 1fr 46px;align-items:center;gap:8px;font-size:10.5px;display:grid}.calib__bar{background:#00000024;border-radius:5px;height:10px;position:relative;overflow:hidden;box-shadow:inset 0 1px 2px #00000040}.calib__bar i{background:linear-gradient(180deg, #4a86e0, var(--blue));position:absolute;inset:0 auto 0 0;box-shadow:inset 0 1px #ffffff59}.calib__bar b{background:#1d7a3c;width:2px;position:absolute;top:0;bottom:0}.log{max-height:150px;font-family:var(--mono);font-variant-numeric:tabular-nums;flex-direction:column;gap:2px;font-size:11px;display:flex;overflow-y:auto}.log__row{color:var(--ink-dim);grid-template-columns:24px 46px 1fr 46px 44px 14px;align-items:center;gap:6px;display:grid}.log__row b{color:var(--ink);font-weight:700}.log__row .ok{color:#1d7a3c}.log__row .no{color:#a3690a}.bottom{flex-direction:column;align-items:center;gap:8px;display:flex}.solve{justify-content:center;display:flex;position:relative}.solve__button{padding:10px 26px;font-size:14px}.solve__menu{gap:8px;width:min(340px,100vw - 32px);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%)}.solve__title{letter-spacing:.14em;text-transform:uppercase;color:var(--ink-dim);font-size:10.5px;font-weight:800}.solve__option{border-radius:var(--radius-sm);color:var(--ink);font:inherit;text-align:left;cursor:pointer;background:linear-gradient(#e6e3dc,#d5d1c9);border:1px solid #00000038;flex-direction:column;gap:3px;padding:10px 12px;transition:transform 80ms,box-shadow 80ms,background .15s;display:flex;box-shadow:inset 0 1px #ffffffb3,0 2px #00000024}.solve__option:hover:not(:disabled){background:linear-gradient(#f1eee7,#ded9d1)}.solve__option:active:not(:disabled){transform:translateY(2px);box-shadow:inset 0 2px 5px #00000038}.solve__option:disabled{opacity:.5;cursor:not-allowed}.solve__name{align-items:center;gap:6px;font-size:13px;font-weight:800;display:flex}.solve__badge{letter-spacing:.08em;text-transform:uppercase;color:#fff;background:var(--red);border-radius:4px;padding:0 5px;font-size:9px;font-weight:800;box-shadow:inset 0 1px #ffffff59}.solve__blurb{color:var(--ink-dim);font-size:11px;line-height:1.35}.legend{text-align:center;color:#ffffff80;text-shadow:0 1px 2px #000000a6;margin:0;padding:0 8px;font-size:11px}.legend b{color:#ffffffd1;font-weight:800}.toast{border-radius:var(--radius-sm);background:linear-gradient(180deg, var(--red-hi), var(--red));color:#fff;border:1px solid #0000004d;padding:9px 16px;font-size:12px;font-weight:700;position:absolute;bottom:112px;left:50%;transform:translate(-50%);box-shadow:inset 0 1px #ffffff59,0 6px 14px #0006}.overlay{z-index:20;pointer-events:auto;background:#080a0eb8;justify-content:center;align-items:center;animation:.2s fade;display:flex;position:absolute;inset:0}@keyframes fade{0%{opacity:0}}.sheet{width:min(960px,100% - 48px);max-height:calc(100% - 64px);box-shadow:var(--bevel-up), 0 30px 60px #00000080;color:var(--ink);background:linear-gradient(#dedbd3,#cbc7bf);border:1px solid #00000040;border-radius:20px;padding:22px;overflow-y:auto}.sheet h2{letter-spacing:-.01em;color:var(--ink);margin:0 0 2px;font-size:21px}.sheet p.sub{color:var(--ink-faint);margin:0 0 16px;font-size:12px}.tier-block{margin-bottom:18px}.tier-block__head{letter-spacing:.12em;text-transform:uppercase;color:var(--ink-dim);align-items:center;gap:10px;margin-bottom:10px;font-size:11px;font-weight:800;display:flex}.tier-block__band{border-radius:4px;width:42px;height:9px;box-shadow:inset 0 1px #ffffff59,0 1px 2px #00000040}.tier-block__grid{grid-template-columns:repeat(auto-fill,200px);justify-content:center;gap:14px;display:grid}.cardthumb{color:var(--ink);font:inherit;cursor:pointer;background:0 0;border:2px solid #0000;border-radius:14px;justify-content:center;padding:6px;transition:transform .1s,border-color .15s;display:flex}.cardthumb svg{filter:drop-shadow(0 8px 12px #00000059)}.cardthumb:hover{transform:translateY(-3px)}.cardthumb[data-active=true]{border-color:var(--red)}.win{text-align:center;max-width:520px}.win h1{letter-spacing:-.02em;color:var(--ink);margin:6px 0;font-size:30px}.win p{color:var(--ink-dim);margin:0 0 16px;font-size:13px}.win__grid{justify-content:center;gap:10px;margin-bottom:18px;display:flex}.win__moves{border-radius:var(--radius-sm);box-shadow:var(--bevel-down);font-family:var(--mono);font-variant-numeric:tabular-nums;color:var(--ink-dim);text-align:left;background:#0000000d;border:1px solid #00000024;max-height:170px;margin-bottom:18px;padding:12px;font-size:11.5px;line-height:1.7;overflow-y:auto}.win__moves span{min-width:54px;color:var(--ink);display:inline-block}.legend--touch{display:none}@media (hover:none){.legend--mouse{display:none}.legend--touch{display:inline}}@media (max-width:1120px){.panel-slot{width:330px}.hud{padding:12px}}@media (max-width:820px){.hud{padding:max(10px, env(safe-area-inset-top)) max(10px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(10px, env(safe-area-inset-left))}.nameplate{padding:10px 14px}.brand__eyebrow{letter-spacing:.14em;font-size:9.5px}.brand__logo{font-size:20px}.statcard{flex-wrap:wrap;justify-content:center;gap:12px;padding:9px 12px}.stat{min-width:46px}.stat__value{font-size:16px}.drawer-toggle{display:inline-flex}.panel-slot{z-index:15;border-radius:18px 18px 0 0;width:auto;max-height:none;padding:0;transition:transform .22s cubic-bezier(.32,.9,.35,1);position:absolute;inset:auto 0 0;overflow:hidden;transform:translateY(102%)}.panel-slot[data-open=true]{transform:none}.panel-slot .panel{overscroll-behavior:contain;max-height:72vh;padding-bottom:max(14px, env(safe-area-inset-bottom));border-radius:18px 18px 0 0;overflow-y:auto}.panel-slot .panel::-webkit-scrollbar{width:10px}.panel-slot .panel::-webkit-scrollbar-thumb{background:#00000038;border-radius:8px}.bottom{gap:6px}.field-row{flex-direction:column;align-items:stretch}.field-row .field{flex:none;width:100%}.panel .row.wrap .button{flex:auto;justify-content:center}input,select{padding:9px 11px;font-size:16px}.field label{font-size:10.5px}}@media (max-width:560px){.sheet{border-radius:0;width:100%;max-height:100%;padding:14px}.tier-block__grid{grid-template-columns:repeat(auto-fill,180px);gap:10px}.overlay{padding:0}.win{width:100%;max-width:none;max-height:100%;overflow-y:auto}}@media (max-height:520px){.panel-slot .panel{max-height:80vh}.nameplate{padding:8px 12px}.brand__logo{font-size:18px}}