:root{--st-bg:#090d12;--st-panel:#121820;--st-panel2:#0d131a;--st-line:#6e5933;--st-line-soft:#3e3526;--st-gold:#c8a96a;--st-text:#eee7d6;--st-muted:#9e9a90;--st-board:#101820;} body{margin:0!important;background:radial-gradient(circle at 50% -20%,rgba(105,83,45,.18),transparent 38%),linear-gradient(180deg,#090d12 0%,#070a0e 100%)!important;color:var(--st-text);} #stoneThrowShell{--st-master-width:1418px;width:min(var(--st-master-width),calc(100vw - 28px));max-width:1418px;margin:14px auto 0;font-family:Georgia,"Times New Roman",serif;} .st-frame{border:1px solid var(--st-line);background:linear-gradient(180deg,rgba(24,29,35,.98),rgba(10,14,19,.98));box-shadow:0 12px 35px rgba(0,0,0,.48),inset 0 0 0 3px rgba(0,0,0,.25);} .st-topbar{min-height:70px;display:grid;grid-template-columns:minmax(240px,1fr) auto minmax(240px,1fr);align-items:center;gap:18px;padding:8px 14px;} .st-brand{display:flex;align-items:center;gap:12px;min-width:0;} .st-brand-mark{width:38px;height:38px;border:1px solid var(--st-line);display:grid;place-items:center;transform:rotate(45deg);background:linear-gradient(135deg,#222a31,#0d1116);box-shadow:inset 0 0 0 3px #11161c;} .st-brand-mark span{transform:rotate(-45deg);font-size:19px;color:var(--st-gold);font-weight:700} .st-title{font-size:28px;font-weight:700;white-space:nowrap} .st-subtitle{font:11px Arial,sans-serif;letter-spacing:.22em;color:var(--st-muted);text-transform:uppercase;margin-top:3px} .st-center-status{text-align:center;min-width:280px} .st-status{color:var(--st-gold);font-size:18px;text-transform:uppercase;font-weight:700} .st-center-start{appearance:none;border:1px solid #8f7441;background:linear-gradient(180deg,#2a2419 0%,#17140f 100%);color:#f0d79a;padding:7px 18px 6px;min-width:132px;border-radius:5px;font:700 13px Arial,sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;box-shadow:inset 0 0 0 1px rgba(255,220,145,.08),0 2px 7px rgba(0,0,0,.45);} .st-center-start:hover{border-color:#c9a85f;color:#ffe4a3;box-shadow:inset 0 0 0 1px rgba(255,220,145,.12),0 0 10px rgba(201,168,95,.25),0 2px 7px rgba(0,0,0,.45);} .st-center-start:active{transform:translateY(1px)} .st-center-start:focus-visible{outline:1px solid #d9bd78;outline-offset:3px} .st-meta{font:12px Arial,sans-serif;color:var(--st-muted);margin-top:6px;letter-spacing:.08em} .st-actions{display:flex;justify-content:flex-end;gap:8px;align-items:center} .st-btn{border:1px solid var(--st-line);background:linear-gradient(#262c31,#151a20);color:var(--st-text);padding:10px 14px;font:700 12px Arial,sans-serif;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;} .st-btn:hover{border-color:var(--st-gold);background:linear-gradient(#30373d,#191f25)} .st-btn[disabled]{opacity:.35;cursor:default} .st-btn.primary{color:#fff1c5;border-color:#a98749} .st-icon-btn{width:39px;padding:10px 0;font-size:17px} .st-stats-ribbon{width:100%;box-sizing:border-box;margin:12px 0 0;padding:8px 10px;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:7px;} .st-stat-card{position:relative;min-width:0;padding:8px 9px 9px;display:grid;grid-template-rows:minmax(0,1fr) auto;align-content:stretch;border:1px solid #6c532d;background:linear-gradient(180deg,rgba(66,50,31,.94) 0 7%,rgba(38,30,22,.96) 7% 15%,rgba(21,25,28,.97) 16% 84%,rgba(45,34,23,.96) 85% 93%,rgba(74,55,31,.94) 94% 100%);box-shadow:inset 0 0 0 1px rgba(226,190,112,.12),inset 0 3px 5px rgba(255,220,150,.05),inset 0 -4px 6px rgba(0,0,0,.45),0 2px 7px rgba(0,0,0,.28);clip-path:polygon(4px 0,calc(100% - 4px) 0,100% 4px,100% calc(100% - 4px),calc(100% - 4px) 100%,4px 100%,0 calc(100% - 4px),0 4px);} .st-stat-card:before,.st-stat-card:after{content:'';position:absolute;top:5px;width:5px;height:5px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#c6a15d 0 18%,#71542e 22% 48%,#241b11 52% 100%);box-shadow:0 calc(100%+35px) 0 #4f3a21;opacity:.7;pointer-events:none;} .st-stat-card:before{left:5px}.st-stat-card:after{right:5px} .st-stat-head{display:grid;grid-template-columns:27px minmax(0,1fr);gap:8px;align-items:start;align-self:start} .st-stat-icon{width:25px;height:25px;display:grid;place-items:center;color:#cdb376;filter:drop-shadow(0 1px 1px #000)} .st-stat-icon svg{width:24px;height:24px;display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round} .st-stat-label{font:700 8.5px/1.2 Arial,sans-serif;text-transform:uppercase;color:var(--st-muted);white-space:nowrap} .st-stat-values{display:flex;align-items:baseline;justify-content:space-between;gap:7px;margin-top:2px;font:700 17px/1 Georgia,serif;color:#eee7d6} .st-stat-you{color:#a8cde6}.st-stat-enemy{color:#dda3a3}.st-stat-sep{font:9px Arial,sans-serif;color:#70777d} .st-duel-bar{position:relative;height:14px;margin-top:8px;padding:2px;display:flex;overflow:hidden;border:1px solid #8a6b3a;border-radius:7px;background:linear-gradient(180deg,#3c2c1c 0%,#18120d 43%,#0d0e10 48%,#17120d 100%);box-shadow:inset 0 1px 0 rgba(255,225,165,.22),inset 0 -1px 0 rgba(0,0,0,.8),inset 0 0 5px rgba(0,0,0,.7),0 1px 2px rgba(0,0,0,.55);} .st-duel-bar:before{content:'';position:absolute;inset:2px;border-radius:5px;pointer-events:none;z-index:3;background:linear-gradient(180deg,rgba(255,255,255,.18),rgba(255,255,255,.035) 35%,rgba(0,0,0,.08) 55%,rgba(0,0,0,.32));box-shadow:inset 0 0 0 1px rgba(255,255,255,.045);} .st-duel-you,.st-duel-enemy{height:100%;transition:width .25s ease;position:relative;z-index:1} .st-duel-you{background:linear-gradient(180deg,rgba(203,231,246,.25),transparent 38%),linear-gradient(90deg,#4d7186,#6f98ad 58%,#88a8b7);box-shadow:inset 0 0 5px rgba(196,225,240,.14);} .st-duel-enemy{background:linear-gradient(180deg,rgba(246,214,214,.18),transparent 38%),linear-gradient(90deg,#a27273,#8c5f61 54%,#75494c);box-shadow:inset 0 0 5px rgba(235,190,190,.10);} .st-duel-mid:after{content:'';position:absolute;left:50%;top:-1px;bottom:-1px;width:3px;transform:translateX(-1px);z-index:4;background:linear-gradient(90deg,#4d371e,#d2b36c 45%,#f1d899 50%,#9c7941 55%,#3d2b19);box-shadow:0 0 3px rgba(220,188,112,.28);pointer-events:none;} .st-stat-chain-values{display:flex;justify-content:space-between;align-items:center;gap:7px;margin-top:3px;font:700 17px/1 Georgia,serif} .st-stat-chain-values>span:first-child,.st-stat-chain-values>span:last-child{display:flex;align-items:baseline;gap:4px} .st-stat-chain-values small{font:700 7px/1 Arial,sans-serif;letter-spacing:.08em;color:#70777d} .st-stat-chain-vs{font:700 7px/1 Arial,sans-serif;letter-spacing:.08em;color:#777d82;text-align:center} .st-battle-stats{border-top:1px solid rgba(255,255,255,.045);padding-top:9px} .st-battle-stats-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px} .st-battle-stats-head span{font:700 8px Arial,sans-serif;letter-spacing:.09em;text-transform:uppercase;color:var(--st-muted);text-align:right} .st-impact-chart{height:142px;border:1px solid #343b42;background:linear-gradient(180deg,rgba(8,13,18,.75),rgba(13,20,27,.9));position:relative;overflow:hidden} .st-impact-chart svg{display:block;width:100%;height:100%} .st-impact-grid{stroke:rgba(201,164,91,.10);stroke-width:1} .st-impact-axis{stroke:rgba(201,164,91,.25);stroke-width:1} .st-impact-you{fill:none;stroke:#86aec9;stroke-width:2;vector-effect:non-scaling-stroke} .st-impact-enemy{fill:none;stroke:#bd797c;stroke-width:2;vector-effect:non-scaling-stroke} .st-impact-dot-you{fill:#86aec9}.st-impact-dot-enemy{fill:#bd797c} .st-impact-label{fill:#7f878d;font:8px Arial,sans-serif} .st-impact-legend{display:flex;gap:12px;margin-top:5px;font:9px Arial,sans-serif;color:var(--st-muted)} .st-impact-legend i{display:inline-block;width:12px;height:2px;vertical-align:middle;margin-right:4px;background:currentColor} .st-impact-legend .you{color:#86aec9}.st-impact-legend .enemy{color:#bd797c} .st-stats-foot{margin-top:7px;font:9px/1.35 Arial,sans-serif;color:#777d82} @media(max-width:980px){.st-stats-ribbon{grid-template-columns:repeat(2,minmax(0,1fr))}.st-stat-card:last-child{grid-column:1/-1}} .st-main{display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:12px;margin-top:12px;align-items:start;} .st-left-stack{min-width:0;display:flex;flex-direction:column;gap:12px;} .st-battle{padding:12px;min-width:0;} .st-boards{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:18px;} .st-board-wrap{min-width:0} .st-board-head{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid var(--st-line-soft);padding:0 3px 8px;margin-bottom:8px;} .st-board-title{font-size:16px;letter-spacing:.14em;text-transform:uppercase;color:var(--st-gold)} .st-board-note{font:11px Arial,sans-serif;color:var(--st-muted)} .st-grid-host{display:flex;justify-content:center;align-items:center;min-height:440px;padding:8px;background:linear-gradient(rgba(255,255,255,.015),rgba(255,255,255,.015)),var(--st-board);border:1px solid #343b42;box-shadow:inset 0 0 24px rgba(0,0,0,.45);overflow:hidden;} .st-grid-host>*{max-width:100%} .st-roster{margin-top:8px;min-height:0;border:0;background:transparent;padding:0;display:flex;align-items:flex-start;justify-content:center;overflow:visible;} .st-roster .unit-strip{margin:0 auto;} .st-unit-placeholder{flex:0 0 38px;height:38px;border:1px solid #454a4f;background:linear-gradient(145deg,#252b31,#11161b);display:grid;place-items:center;color:#b8aa8b;font:700 10px Arial,sans-serif;position:relative;cursor:help;} .st-unit-placeholder:hover{border-color:var(--st-gold);color:#f2dfac} .st-unit-placeholder .count{position:absolute;right:-4px;bottom:-4px;min-width:15px;height:15px;line-height:15px;text-align:center;border-radius:8px;background:#080b0f;border:1px solid var(--st-line);font-size:9px;color:#eee;} .st-side{padding:12px;display:flex;flex-direction:column;gap:12px;} .st-side h3,.st-events h3{margin:0 0 8px;color:var(--st-gold);font-size:13px;text-transform:uppercase;} .st-legend-row[hidden]{display:none!important} .st-legend-row{display:flex;align-items:center;gap:8px;padding:6px 0;border-bottom:1px solid rgba(255,255,255,.05);font:12px Arial,sans-serif;color:#c7c4bc;} .st-dot{width:11px;height:11px;border:1px solid #666;display:inline-block} .st-side-placeholder{font:12px/1.45 Arial,sans-serif;color:var(--st-muted);} .st-events{margin-top:0;padding:10px 12px;display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start;} .st-event-list{max-height:184px;overflow-y:auto;overflow-x:hidden;padding-right:5px;scrollbar-width:thin;scrollbar-color:#695936 #11161c;} .st-event{padding:4px 9px 5px;border-left:2px solid var(--st-line-soft);background:rgba(255,255,255,.018);font:11px/1.38 Arial,sans-serif;color:#c9c5bb;} .st-event+.st-event{margin-top:3px} .st-event-round{margin-top:8px!important;padding:5px 9px 3px;border-left-color:var(--st-gold);background:linear-gradient(90deg,rgba(201,164,91,.13),rgba(201,164,91,0));color:#e8d39e;font-weight:800;letter-spacing:.10em;text-transform:uppercase;} .st-event-major{color:#eee3c8;border-left-color:#a68143} .st-event-danger{color:#e9c8c8;border-left-color:#9a4848} .st-event strong{color:#f0d89f;font-weight:800} .st-event-list::-webkit-scrollbar{width:8px} .st-event-list::-webkit-scrollbar-track{background:#11161c} .st-event-list::-webkit-scrollbar-thumb{background:#695936;border-radius:6px} .st-hover-card{position:fixed;z-index:99999;display:none;width:280px;padding:13px;border:1px solid var(--st-gold);background:linear-gradient(180deg,#171c22,#0b0f14);box-shadow:0 16px 40px rgba(0,0,0,.7);pointer-events:none;} .st-hover-card strong{display:block;color:var(--st-gold);font-size:18px;margin-bottom:5px} .st-hover-card span{font:12px/1.45 Arial,sans-serif;color:#c9c5bb} .combat-float{position:fixed;left:0;top:0;z-index:10050;display:flex;align-items:center;gap:5px;min-width:max-content;padding:3px 7px;border-radius:8px;border:1px solid rgba(226,232,240,.35);background:rgba(8,15,27,.92);color:#f8fafc;font-size:12px;font-weight:800;line-height:22px;text-shadow:0 1px 2px #000;box-shadow:0 4px 14px rgba(0,0,0,.38);pointer-events:none;transform:translate(-50%,4px);opacity:0;animation:combatFloatUp 1.45s ease-out forwards;white-space:nowrap;} .combat-float img{width:22px;height:22px;object-fit:contain;image-rendering:auto;flex:0 0 22px} .combat-float .combat-unit-icon{width:22px!important;height:22px!important;min-width:22px!important;min-height:22px!important;flex:0 0 22px!important;padding:0!important;margin:0!important;border-radius:2px!important;pointer-events:none!important} .combat-float .combat-target-icon{width:18px;height:18px;border:2px solid #ef4444;border-radius:50%;position:relative;flex:0 0 18px} .combat-float .combat-target-icon::before,.combat-float .combat-target-icon::after{content:'';position:absolute;background:#ef4444} .combat-float .combat-target-icon::before{width:22px;height:2px;left:-4px;top:6px} .combat-float .combat-target-icon::after{width:2px;height:22px;left:6px;top:-4px} .combat-float .combat-rock-icon{width:22px;height:22px;flex:0 0 22px;background:no-repeat center/22px 22px url("assets/effects/combat-rock.svg")} .combat-float .combat-scout-icon{width:20px;height:20px;flex:0 0 20px;border:2px solid #60a5fa;border-radius:50%;box-shadow:0 0 7px #60a5fa,inset 0 0 5px rgba(147,197,253,.8);animation:combatScoutShimmer .65s ease-in-out infinite alternate} .combat-float .combat-plague-icon{width:22px;height:22px;flex:0 0 22px;border-radius:2px;box-shadow:inset 0 0 6px rgba(25,8,35,.88),inset 0 0 0 1px rgba(192,101,231,.48),0 0 5px rgba(143,72,183,.45);background:radial-gradient(circle at 28% 30%,rgba(211,147,255,.72) 0 10%,rgba(154,73,190,.58) 23%,transparent 44%),radial-gradient(circle at 72% 68%,rgba(176,95,222,.68) 0 12%,rgba(100,47,135,.58) 28%,transparent 50%),linear-gradient(145deg,rgba(66,24,89,.88),rgba(117,48,151,.78) 52%,rgba(37,18,57,.9))} .combat-float .combat-monk-close-icon{width:22px;height:22px;flex:0 0 22px;display:grid;place-items:center;font-size:18px;font-weight:950;line-height:1;color:#facc15;text-shadow:0 1px 2px #000,0 0 5px rgba(250,204,21,.45)} .combat-float .combat-resurrection-icon{width:22px;height:22px;flex:0 0 22px;background:no-repeat center/22px 22px url("assets/cursors/resurrection.png")} @keyframes combatFloatUp{0%{opacity:0;transform:translate(-50%,7px)}14%{opacity:1}72%{opacity:1}100%{opacity:0;transform:translate(-50%,-16px)}} @keyframes combatScoutShimmer{from{filter:brightness(.9);box-shadow:0 0 4px #60a5fa}to{filter:brightness(1.5);box-shadow:0 0 10px #93c5fd}} @media (prefers-reduced-motion:reduce){.combat-float{animation-duration:1.45s}.combat-float .combat-scout-icon{animation:none}} .dragon-flight-overlay{position:fixed;left:0;top:0;width:44px;height:44px;z-index:10020;pointer-events:none;user-select:none;transform:translate(-50%,-50%);will-change:left,top;filter:drop-shadow(0 2px 4px rgba(0,0,0,.72));} .dragon-flight-overlay img{display:block;width:44px;height:44px;object-fit:contain;image-rendering:auto;} .archer-arrow-flight{position:fixed;width:30px;height:8px;z-index:10023;pointer-events:none;transform:translate(-50%,-50%);transform-origin:50% 50%;will-change:left,top,transform,opacity;filter:drop-shadow(0 1px 2px rgba(0,0,0,.8));} .archer-arrow-flight::before{content:"";position:absolute;left:3px;top:3px;width:20px;height:2px;background:#d8b36a;box-shadow:0 0 2px rgba(255,240,190,.45);} .archer-arrow-flight::after{content:"";position:absolute;right:0;top:1px;width:0;height:0;border-left:8px solid #eef2f4;border-top:3px solid transparent;border-bottom:3px solid transparent;} .archer-arrow-feather{position:absolute;left:0;top:1px;width:7px;height:6px} .archer-arrow-feather::before,.archer-arrow-feather::after{content:"";position:absolute;left:0;width:7px;height:2px;background:#b91c1c} .archer-arrow-feather::before{top:0;transform:rotate(28deg)} .archer-arrow-feather::after{bottom:0;transform:rotate(-28deg)} .goblin-bomb-flight{position:fixed;width:22px;height:22px;z-index:10021;pointer-events:none;border-radius:50%;background:radial-gradient(circle at 35% 30%,#888 0 9%,#292929 27%,#080808 72%);box-shadow:0 2px 4px rgba(0,0,0,.75);will-change:left,top,transform} .goblin-bomb-flight::after{content:"";position:absolute;width:8px;height:8px;right:-4px;top:-4px;border-radius:50%;background:radial-gradient(circle,#fff9bf 0 14%,#ff9c16 30%,#e53908 55%,transparent 73%);filter:drop-shadow(0 0 4px #ff7800);animation:goblinFuseSpark .12s steps(2,end) infinite alternate} @keyframes goblinFuseSpark{from{transform:scale(.65) rotate(-18deg);opacity:.5}to{transform:scale(1.4) rotate(22deg);opacity:1}} .goblin-bomb-boom{position:fixed;width:62px;height:62px;z-index:10024;pointer-events:none;border-radius:50%;background:radial-gradient(circle,#fff8c8 0 9%,#ffad22 22%,rgba(235,55,5,.88) 46%,rgba(100,0,0,0) 76%);mix-blend-mode:screen;will-change:transform,opacity} .wizard-meteor-flight{position:fixed;width:40px;height:40px;z-index:10022;pointer-events:none;border-radius:50%;background:radial-gradient(circle at 68% 58%,rgba(255,250,190,.98) 0 13%,rgba(255,135,20,.96) 27%,rgba(210,35,4,.86) 48%,rgba(75,0,0,0) 72%);filter:drop-shadow(0 0 10px rgba(255,90,0,.92));will-change:left,top,transform,opacity} .wizard-blast-layer{position:fixed;z-index:10024;pointer-events:none;border-radius:50%;background:radial-gradient(circle,rgba(255,250,205,.98) 0 10%,rgba(255,155,30,.95) 25%,rgba(235,55,5,.78) 50%,rgba(110,0,0,0) 78%);mix-blend-mode:screen;will-change:transform,opacity} .demon-fire-whoosh{position:fixed;width:48px;height:48px;z-index:10020;pointer-events:none;border:2px solid rgba(255,30,30,.95);border-radius:50%;box-shadow:inset 0 0 9px rgba(255,0,0,.5),0 0 11px rgba(255,0,0,.75);filter:drop-shadow(0 0 6px #b40000);will-change:left,top,transform,opacity} .demon-fire-whoosh::before{content:"★";position:absolute;inset:-5px;display:flex;align-items:center;justify-content:center;color:rgba(255,45,45,.92);font-size:48px;line-height:1;text-shadow:0 0 7px #ff0000;transform:rotate(180deg)} .dragon-breath-puff{position:fixed;z-index:10015;pointer-events:none;width:32px;height:26px;border-radius:50%;background:radial-gradient(ellipse at 58% 50%,rgba(255,248,170,.96) 0 10%,rgba(255,145,20,.90) 28%,rgba(230,55,5,.72) 52%,rgba(110,0,0,0) 78%);mix-blend-mode:screen;filter:blur(.35px);will-change:left,top,transform,opacity} .demon-rune{position:fixed;z-index:10019;pointer-events:none;width:14px;height:14px;display:flex;align-items:center;justify-content:center;color:#ff3434;font:700 12px/1 serif;text-shadow:0 0 2px #ff0000,0 0 3px #7d0000;animation:demonRuneShimmer .32s ease-in-out infinite alternate} @keyframes demonRuneShimmer{from{opacity:.5;filter:brightness(.82);transform:translate(-50%,-50%) scale(.76)}to{opacity:1;filter:brightness(1.55);transform:translate(-50%,-50%) scale(.94)}} .demon-mega-blast{position:fixed;z-index:10025;pointer-events:none;border-radius:10px;background:radial-gradient(circle,rgba(255,250,200,.98) 0 10%,rgba(255,145,25,.94) 27%,rgba(225,45,5,.76) 53%,rgba(100,0,0,0) 78%);mix-blend-mode:screen;will-change:transform,opacity} .catapult-rock-flight{position:fixed;left:0;top:0;width:28px;height:28px;z-index:10030;pointer-events:none;user-select:none;transform:translate(-50%,-50%);will-change:left,top,transform;background:no-repeat center/28px 28px url("assets/effects/combat-rock.svg");filter:drop-shadow(0 3px 3px rgba(0,0,0,.72));} .st-settings{position:fixed;z-index:99998;display:none;right:24px;top:86px;width:230px;padding:12px;border:1px solid var(--st-line);background:#11171d;box-shadow:0 14px 35px rgba(0,0,0,.6);} .st-settings.open{display:block} .st-mini-reset{font-size:9px;padding:3px 6px;background:#18202a;color:#aab4c0;border:1px solid #384452;border-radius:4px;cursor:pointer}.st-mini-reset:hover{color:#ffd37a;border-color:#8b6a2b}.st-settings-title{font-weight:700;color:var(--st-gold);margin-bottom:9px} .st-setting-row{font:12px Arial,sans-serif;padding:7px 0;border-top:1px solid #292f35;color:#bbb} .st-setting-row.st-toggle-row{display:flex;align-items:center;justify-content:space-between;gap:12px} .st-toggle{min-width:46px;padding:4px 7px;border:1px solid #475569;background:#18212a;color:#d8dee6;font:700 11px Arial,sans-serif;cursor:pointer;border-radius:4px;} .st-toggle.on{border-color:#8b7447;color:#e6c878;background:#211f19} .st-settings-menu-btn{width:100%;margin-top:8px;padding:7px 9px;border:1px solid #6f5b34;background:#211f19;color:#e6c878;font:800 11px Arial,sans-serif;letter-spacing:.05em;cursor:pointer;border-radius:4px}.st-settings-menu-btn:hover{border-color:#9a7a3c;color:#ffd98a} #enemyGrid .cell.aim-assist-impossible{background-color:rgba(51,65,85,.46)!important;} #enemyGrid .cell.aim-assist-impossible::after{content:none!important;display:none!important;} .st-grid-host .grid,.st-grid-host [id$="Grid"]{margin:auto!important} .st-grid-host .hdr,.st-grid-host .header,.st-grid-host [class*="header"]{display:none!important} @media(max-width:1100px){.st-main{grid-template-columns:1fr} .st-side{display:grid;grid-template-columns:1fr 1fr} .st-grid-host{min-height:350px}} @media(max-width:800px){.st-topbar{grid-template-columns:1fr;text-align:center} .st-brand,.st-actions{justify-content:center} .st-center-status{min-width:0} .st-boards{grid-template-columns:1fr} .st-event-list{grid-template-columns:1fr}} .st-giveup-overlay{display:none;position:fixed;inset:0;z-index:10000;background:rgba(0,0,0,.68);align-items:center;justify-content:center;} .st-giveup-overlay.open{display:flex;} .st-giveup-box{width:min(390px,calc(100vw - 40px));border:1px solid var(--st-line);background:linear-gradient(180deg,#171d23,#0b1015);box-shadow:0 18px 55px rgba(0,0,0,.65);padding:22px;text-align:center;font-family:Georgia,"Times New Roman",serif;} .st-giveup-box h3{margin:0 0 10px;color:var(--st-gold);letter-spacing:.1em;text-transform:uppercase;} .st-giveup-box p{margin:0 0 18px;color:var(--st-text);font:14px Arial,sans-serif;} .st-giveup-actions{display:flex;justify-content:center;gap:10px;} body.story-mode-active .st-grid-host{box-sizing:border-box!important;flex:0 0 auto!important;} body.story-mode-active .st-grid-host>.grid{margin:auto!important;align-self:center;justify-self:center;}
/* v1.424 — unified master layout */
.st-side-left{display:flex}
.st-side-right{min-width:0}
.st-side-left .st-events{
  margin:0;
  padding:0;
  display:block;
  border:0;
  box-shadow:none;
  background:transparent;
}
.st-side-left .st-events h3{margin-bottom:8px}
.st-side-left .st-battle-stats{
  border-top:0;
  padding-top:0;
}
.st-side-left .st-events{
  border-top:1px solid rgba(255,255,255,.045);
  padding-top:10px;
}
.st-side-left .st-event-list{
  max-height:304px;
  min-height:210px;
}

/* Top bar, stats and command area share one master width. */
.st-topbar,.st-stats-ribbon,.st-main{width:100%}

/* Sidebars absorb spare room; boards remain content-sized. */
.st-main{
  display:grid;
  grid-template-columns:minmax(185px,1fr) max-content minmax(250px,1fr);
  gap:clamp(8px,.8vw,12px);
  margin-top:12px;
  align-items:start;
}
.st-side-left{
  grid-column:1;
  grid-row:1;
  flex-direction:column;
  gap:10px;
  padding:clamp(9px,.75vw,12px);
  min-width:0;
}
.st-left-stack{
  grid-column:2;
  grid-row:1;
  width:max-content;
  max-width:100%;
  min-width:0;
  justify-self:center;
}
.st-side-right{
  grid-column:3;
  grid-row:1;
  padding:clamp(9px,.75vw,12px);
  min-width:0;
}
.st-side-left,.st-side-right{overflow:hidden}
.st-side-left *,.st-side-right *{min-width:0}
.st-legend-row{min-width:0}
.st-legend-row>*:last-child{overflow-wrap:normal;word-break:normal;white-space:normal}.st-battle-legend{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:14px}.st-battle-legend .st-legend-row{align-items:flex-start;line-height:1.22}
.st-battle{
  width:max-content;
  max-width:100%;
  box-sizing:border-box;
}
.st-board-wrap{
  width:max-content;
  max-width:100%;
}
.st-side-left .st-impact-chart{height:clamp(112px,9vw,132px)}
.st-side-left .st-stats-foot{font-size:8.5px}

/* Full Game 15×15 is the widest battlefield. */
body:not(.story-mode-active) #stoneThrowShell{
  --cell:clamp(19.5px,1.62vw,22.67px);
}

/* JS adds this only when the ACTUAL current center + minimum sidebars no longer fit. */
#stoneThrowShell.st-command-collapsed .st-main{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  grid-template-areas:
    "center center"
    "left right";
  gap:10px;
}
#stoneThrowShell.st-command-collapsed .st-left-stack{
  grid-area:center;
  justify-self:center;
}
#stoneThrowShell.st-command-collapsed .st-side-left{
  grid-area:left;
}
#stoneThrowShell.st-command-collapsed .st-side-right{
  grid-area:right;
}
#stoneThrowShell.st-command-collapsed .st-side-left .st-event-list{
  max-height:220px;
  min-height:150px;
}
@media(max-width:760px){
  #stoneThrowShell.st-command-collapsed .st-main{
    grid-template-columns:1fr;
    grid-template-areas:
      "center"
      "left"
      "right";
  }
  .st-side-left,.st-side-right{min-width:0}
  .st-side-left .st-event-list{
    max-height:184px;
    min-height:142px;
  }
}

 
/* Small Story ribbons must fit the zero-value labels before the first shot.
   Let the central caption use available space instead of forcing two 7px gaps. */
body.story-mode-active .st-stat-chain-values{column-gap:0}
/* The narrowest Story ribbon also needs the number/owner gaps to yield. */
body.story-mode-active .st-stat-chain-values>span:first-child,body.story-mode-active .st-stat-chain-values>span:last-child{column-gap:0}

/* Narrow battlefield controls retain readable labels and touch targets. */
@media(max-width:520px){.st-topbar .st-actions{display:flex;flex-wrap:wrap;gap:8px;width:100%;min-width:0}.st-topbar .st-actions .st-btn{box-sizing:border-box;flex:1 1 120px;min-width:0;min-height:44px;white-space:normal;overflow-wrap:break-word}.st-topbar .st-actions .st-icon-btn{flex:0 0 44px}.st-topbar .st-center-status .st-btn{min-height:44px}}

#stFollowAction{display:none} @media(max-width:650px){body.st-shell-active #stFollowAction{display:inline-block;min-height:44px}#stFollowAction[aria-pressed=true]{background:#554522;border-color:#d8ba70}#stFollowAction[aria-pressed=false]{opacity:.7}}

@media(max-width:650px){body.st-shell-active .st-topbar{grid-template-columns:minmax(0,1fr)!important;gap:8px!important;padding:8px!important}body.st-shell-active .st-topbar .st-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important;width:100%!important;min-width:0!important}body.st-shell-active .st-topbar .st-actions .st-btn{box-sizing:border-box;flex:1 1 110px!important;width:auto!important;min-width:0!important;max-width:100%!important;min-height:44px!important;height:auto!important;white-space:normal!important;padding:9px 10px!important}body.st-shell-active .st-topbar .st-actions .st-icon-btn{flex:0 0 44px!important}body.st-shell-active .st-center-status{min-width:0!important;width:100%!important}}
