:root{--panel: #141b24ee;--panel-solid: #141b24;--panel-2: #1c2531;--line: #2e3b4b;--line-2: #3d4d61;--ink: #e6ebf0;--muted: #95a3b2;--accent: #d6b26e;--accent-ink: #1a1408;--accent-dim: #d6b26e33;--good: #8fc37a;--bad: #e07a6a;--r: 10px;--font: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif}body{font:14px/1.35 var(--font);color:var(--ink);user-select:none;-webkit-user-select:none}button{font:inherit;color:inherit}.ico{width:20px;height:20px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}#top{position:fixed;left:0;right:0;top:0;height:46px;z-index:20;display:flex;align-items:center;gap:4px;padding:0 10px;background:linear-gradient(#18212cf2,#121922f2);border-bottom:1px solid var(--line);box-shadow:0 6px 18px #0006}#top .brand{display:flex;align-items:center;gap:8px;font-weight:650;letter-spacing:.02em;margin-right:10px;white-space:nowrap}#top .brand svg{color:var(--accent)}#top .sep{width:1px;height:24px;background:var(--line);margin:0 6px}#top .spacer{flex:1}.tb{display:inline-flex;align-items:center;gap:7px;height:32px;padding:0 11px;border-radius:7px;background:transparent;border:1px solid transparent;cursor:pointer;white-space:nowrap}.tb:hover{background:#ffffff10;border-color:var(--line)}.tb.on{background:var(--accent-dim);border-color:#d6b26e66;color:#f4dfb4}.seg{display:inline-flex;border:1px solid var(--line);border-radius:8px;overflow:hidden;height:32px}.seg button{background:transparent;border:0;padding:0 11px;cursor:pointer;color:var(--muted)}.seg button+button{border-left:1px solid var(--line)}.seg button:hover{background:#ffffff0d;color:var(--ink)}.seg button.on{background:var(--accent);color:var(--accent-ink);font-weight:600}.field-label{color:var(--muted);margin:0 6px 0 2px;font-size:13px}#hud{font:12px/1 ui-monospace,Consolas,monospace;color:var(--muted);padding:0 8px;white-space:nowrap}.menu{position:relative}.menu-list{position:absolute;top:38px;left:0;min-width:210px;padding:6px;z-index:30;background:var(--panel-solid);border:1px solid var(--line-2);border-radius:var(--r);box-shadow:0 14px 40px #000a}.menu-list[hidden]{display:none}.menu-list button{display:flex;width:100%;align-items:center;gap:8px;text-align:left;background:none;border:0;padding:8px 10px;border-radius:6px;cursor:pointer}.menu-list button:hover{background:#ffffff12}.menu-list button.on:after{content:"✓";margin-left:auto;color:var(--accent)}.menu-list hr{border:0;border-top:1px solid var(--line);margin:6px 4px}.menu-list kbd{margin-left:auto}#rail{position:fixed;left:10px;top:58px;z-index:15;display:flex;flex-direction:column;gap:4px;padding:6px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px #0007}#rail button{position:relative;width:40px;height:40px;display:grid;place-items:center;border-radius:8px;background:transparent;border:1px solid transparent;cursor:pointer;color:var(--muted)}#rail button:hover{background:#ffffff10;color:var(--ink)}#rail button.on{background:var(--accent);color:var(--accent-ink)}#rail button:disabled{opacity:.35;cursor:default}#rail hr{border:0;border-top:1px solid var(--line);margin:2px 4px}[data-tip]:hover:after{content:attr(data-tip);position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);background:#0b0f14;color:var(--ink);border:1px solid var(--line-2);padding:5px 9px;border-radius:6px;font-size:13px;white-space:nowrap;pointer-events:none;z-index:40}#bag{position:fixed;left:70px;top:58px;bottom:16px;width:286px;z-index:14;display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px #0008;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}#bag[hidden]{display:none}#bag header{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--line);font-weight:600}#bag header small{color:var(--muted);font-weight:400}#bag .scroll{overflow:auto;padding:4px 10px 12px}#bag h4{margin:12px 2px 6px;font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:600}#bag .tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.tile{display:flex;flex-direction:column;align-items:center;gap:4px;padding:6px 4px 7px;border-radius:8px;cursor:grab;background:var(--panel-2);border:1px solid var(--line);text-align:center;font-size:12px;line-height:1.2;color:var(--ink)}.tile:hover{border-color:var(--accent);background:#232e3c}.tile:active{cursor:grabbing}.tile .thumb{width:72px;height:72px;border-radius:6px;background:#0e141b;image-rendering:pixelated;display:grid;place-items:center;overflow:hidden}.tile .thumb img{width:72px;height:72px;image-rendering:pixelated}.tile .dot{width:30px;height:30px;border-radius:50%;box-shadow:inset 0 -4px #0005,inset 0 2px #fff4,0 2px #0008}#inspector{position:fixed;right:10px;top:58px;width:262px;z-index:15;padding:0 0 12px;background:var(--panel);border:1px solid var(--line);border-radius:12px;box-shadow:0 10px 30px #0008}#inspector[hidden]{display:none}#inspector header{padding:11px 14px 9px;border-bottom:1px solid var(--line)}#inspector header b{display:block;font-size:15px}#inspector header small{color:var(--muted)}#inspector .row{display:flex;align-items:center;gap:8px;padding:9px 14px 0}#inspector .row>span:first-child{color:var(--muted);font-size:13px;width:78px;flex:none}#inspector .val{min-width:46px;text-align:center;font-variant-numeric:tabular-nums}.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:30px;padding:0 10px;border-radius:7px;background:var(--panel-2);border:1px solid var(--line-2);cursor:pointer;white-space:nowrap}.btn:hover{border-color:var(--accent)}.btn.primary{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}.btn.primary:hover{filter:brightness(1.08)}.btn.danger:hover{border-color:var(--bad);color:#ffd1c9}.btn.icon{width:30px;padding:0}.btn.on{background:var(--accent-dim);border-color:var(--accent);color:#f4dfb4}.switch{position:relative;width:38px;height:22px;border-radius:11px;background:#2a3646;border:1px solid var(--line-2);cursor:pointer;flex:none}.switch:after{content:"";position:absolute;left:2px;top:2px;width:16px;height:16px;border-radius:50%;background:#c4ccd5;transition:left .15s}.switch.on{background:var(--accent);border-color:var(--accent)}.switch.on:after{left:18px;background:#fff}.chips{display:flex;gap:4px;flex-wrap:wrap}.chips button{height:26px;padding:0 8px;border-radius:6px;background:var(--panel-2);border:1px solid var(--line);cursor:pointer;font-size:12px;color:var(--muted)}.chips button.on{background:var(--accent);color:var(--accent-ink);border-color:var(--accent);font-weight:600}#inspector .actions{display:flex;gap:6px;padding:14px 14px 0}#inspector .actions .btn{flex:1}#measure{position:fixed;left:0;top:0;z-index:12;pointer-events:none;padding:4px 9px;border-radius:6px;background:#0b0f14e6;border:1px solid var(--accent);color:#f4dfb4;font:600 14px/1.2 var(--font);font-variant-numeric:tabular-nums;box-shadow:0 4px 12px #0008;white-space:nowrap}#measure[hidden]{display:none}kbd{font:11px/1 ui-monospace,Consolas,monospace;padding:3px 5px;border-radius:4px;border:1px solid var(--line-2);background:#0b0f14;color:var(--muted)}.win{position:fixed;z-index:16;display:flex;flex-direction:column;border-radius:12px;overflow:hidden;background:var(--panel-solid);border:1px solid var(--line-2);box-shadow:0 18px 50px #000b,0 0 0 1px #0006}.win[hidden]{display:none}.win.front{z-index:17}.win>header{display:flex;align-items:center;gap:8px;height:36px;padding:0 6px 0 12px;cursor:move;flex:none;background:linear-gradient(#202a37,#19212c);border-bottom:1px solid var(--line)}.win>header b{font-weight:600}.win>header .ico{color:var(--accent)}.win>header .grow{flex:1}.win>header .x{width:28px;height:28px;border-radius:6px;border:0;background:none;cursor:pointer;color:var(--muted);display:grid;place-items:center}.win>header .x:hover{background:#ffffff14;color:var(--ink)}.dice-view{position:relative;background:#0b0f14}.dice-view canvas{display:block;image-rendering:pixelated;cursor:pointer}.dice-badges{position:absolute;top:0;right:0;bottom:0;left:0;pointer-events:none}.dice-badge{position:absolute;transform:translate(-50%,-100%);min-width:20px;padding:1px 5px;border-radius:5px;text-align:center;font:700 13px/1.3 var(--font);background:#0b0f14d9;border:1px solid var(--line-2);color:var(--ink);animation:pop .25s ease-out}.dice-badge.hit{border-color:var(--good);color:#d4f2c6}.dice-badge.miss{opacity:.55}@keyframes pop{0%{transform:translate(-50%,-60%) scale(.6);opacity:0}}.dice-bar{display:flex;align-items:center;gap:6px;padding:8px 10px;border-top:1px solid var(--line);flex-wrap:wrap}.dice-bar .count{display:inline-flex;align-items:center;border:1px solid var(--line-2);border-radius:7px;overflow:hidden;height:30px}.dice-bar .count button{width:28px;height:30px;border:0;background:var(--panel-2);cursor:pointer}.dice-bar .count button:hover{background:#2a3646}.dice-bar .count span{min-width:44px;text-align:center;font-variant-numeric:tabular-nums}.dice-bar .grow{flex:1}.swatch{width:22px;height:22px;border-radius:5px;border:2px solid transparent;cursor:pointer;padding:0}.swatch.on{border-color:var(--accent)}.dice-result{padding:8px 12px;border-top:1px solid var(--line);min-height:22px;display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.dice-result .sum{font-weight:700;font-size:16px}.dice-result .hits{color:var(--good);font-weight:600}.dice-log{max-height:46px;overflow:auto;padding:0 12px 8px;color:var(--muted);font-size:12px}.dice-log div{padding:2px 0;border-top:1px dashed #2e3b4b88}.dice-log b{color:var(--ink);font-weight:600}.dice-bar select{height:30px;background:var(--panel-2);color:var(--ink);border:1px solid var(--line-2);border-radius:7px;padding:0 6px;font:inherit}.cards-body{display:flex;gap:14px;padding:12px;background:radial-gradient(120% 140% at 30% 0%,#23402e,#15261c 60%,#0f1a14);min-height:236px}.zone{display:flex;flex-direction:column;gap:6px}.zone>span{font-size:12px;text-transform:uppercase;letter-spacing:.08em;color:#b9c8b5}.zone.play{flex:1;min-width:0}.play-row{display:flex;gap:8px;overflow-x:auto;padding:2px 2px 8px;min-height:196px;align-items:flex-start;border-radius:10px;border:1px dashed #ffffff22}.play-row:empty:before{content:"Щёлкните по колоде — карта ляжет сюда";color:#fff5;margin:auto;font-size:13px}.deck{position:relative;width:130px;height:182px;cursor:pointer;flex:none}.deck .card{position:absolute;left:0;top:0}.deck .count{position:absolute;right:-6px;bottom:-6px;z-index:5;background:var(--accent);color:var(--accent-ink);font-weight:700;border-radius:10px;padding:1px 8px;font-size:13px}.deck.empty{cursor:default}.deck.empty:before{content:"Пусто";position:absolute;top:0;right:0;bottom:0;left:0;border:1px dashed #ffffff33;border-radius:9px;display:grid;place-items:center;color:#fff5}.card{width:130px;height:182px;flex:none;perspective:700px;cursor:pointer}.card .flip{position:relative;width:100%;height:100%;transform-style:preserve-3d;transition:transform .5s cubic-bezier(.3,.7,.3,1)}.card.down .flip{transform:rotateY(180deg)}.card .face,.card .back{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:9px;backface-visibility:hidden;overflow:hidden;box-shadow:0 4px 10px #0009}.card .back{transform:rotateY(180deg);background:repeating-linear-gradient(45deg,#5e2f2b 0,#5e2f2b 6px,#6e3a33 6px,#6e3a33 12px);border:3px solid #bc9c69;display:grid;place-items:center}.card .back:after{content:"";width:46px;height:46px;border:3px solid #dabc89;transform:rotate(45deg);border-radius:6px;box-shadow:inset 0 0 0 5px #5e2f2b,inset 0 0 0 8px #dabc89}.card .face{background:linear-gradient(#efe3c8,#dcc9a3);border:3px solid #3b2315;color:#2a1a10;display:flex;flex-direction:column}.card .face .title{background:#3b2315;color:#f4e6cc;font:700 13px/1.15 var(--font);padding:5px 7px 6px}.card .face .art{height:62px;display:grid;place-items:center;background:linear-gradient(#a27046,#6f4628);color:#f4e6cc;border-bottom:2px solid #3b2315}.card .face .art .ico{width:38px;height:38px;stroke-width:1.4}.card .face .text{padding:6px 7px;font-size:11.5px;line-height:1.3;flex:1}.card .face .type{font-size:10px;text-transform:uppercase;letter-spacing:.1em;padding:0 7px 5px;color:#6f4628}.card.flying{position:fixed;z-index:50;pointer-events:none;transition:left .45s cubic-bezier(.3,.7,.3,1),top .45s cubic-bezier(.3,.7,.3,1)}.play-row .card{position:relative}.play-row .card .tools{position:absolute;right:4px;top:4px;display:none;gap:3px;z-index:3}.play-row .card:hover .tools{display:flex}.play-row .card .tools button{width:24px;height:24px;border-radius:5px;border:0;background:#0b0f14d9;color:#fff;cursor:pointer;font-size:13px}.cards-bar{display:flex;gap:6px;padding:8px 10px;border-top:1px solid var(--line)}.card-zoom{position:fixed;top:0;right:0;bottom:0;left:0;z-index:60;background:#000a;display:grid;place-items:center}.card-zoom .card{width:260px;height:364px;cursor:default}.card-zoom .card .face .title{font-size:20px;padding:9px 12px}.card-zoom .card .face .art{height:120px}.card-zoom .card .face .art .ico{width:70px;height:70px}.card-zoom .card .face .text{font-size:16px;padding:12px}.card-zoom .card .face .type{font-size:13px;padding:0 12px 10px}#help{position:fixed;top:0;right:0;bottom:0;left:0;z-index:70;background:#000b;display:grid;place-items:center}#help[hidden]{display:none}#help .box{width:min(760px,calc(100vw - 32px));max-height:calc(100vh - 80px);overflow:auto;background:var(--panel-solid);border:1px solid var(--line-2);border-radius:14px;padding:18px 22px;box-shadow:0 20px 60px #000}#help h2{margin:0 0 12px;font-size:18px}#help .cols{display:grid;grid-template-columns:1fr 1fr;gap:6px 28px}#help .cols div{display:flex;justify-content:space-between;gap:12px;padding:5px 0;border-bottom:1px solid #2e3b4b88}#help .cols div span:last-child{color:var(--muted);text-align:right}@media(max-width:700px){#help .cols{grid-template-columns:1fr}#top .brand span{display:none}}
