:root{--void:#050505;--gunmetal:#17191d;--gold:#a8844f;--gold-bright:#d9b873;--bone:#e8ddc8;--muted:#948b7d;--red:#e84b3c;--display:"Bodoni 72", Didot, "Songti SC", serif;--body:"Avenir Next", Avenir, "PingFang SC", sans-serif;--mono:"SFMono-Regular", Menlo, monospace}*{box-sizing:border-box}html{background:var(--void);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;min-width:320px}body{background:var(--void);min-height:100vh;color:var(--bone);font-family:var(--body);-webkit-font-smoothing:antialiased;margin:0}button,input{font:inherit}button{color:inherit;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible{outline:2px solid var(--gold-bright);outline-offset:3px}.app-shell{isolation:isolate;background:radial-gradient(circle at 50% 36%,#201713 0,#090909 33%,#030303 72%);min-height:100svh;position:relative;overflow:hidden}.app-shell:before{content:"";z-index:-2;opacity:.22;filter:saturate(.45)contrast(1.22);background:url(/assets/world/gravity-field.webp) 50%/cover no-repeat;position:fixed;inset:-8%}.space-dust{z-index:-1;opacity:.32;pointer-events:none;background-image:radial-gradient(circle,#e8ddc8 0 .6px,#0000 .8px),radial-gradient(circle,#a8844f 0 .7px,#0000 .9px);background-position:0 0,41px 63px;background-size:91px 87px,151px 139px;position:fixed;inset:0;-webkit-mask-image:radial-gradient(circle,#000,#0000 86%);mask-image:radial-gradient(circle,#000,#0000 86%)}.topbar{z-index:50;-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);background:#050505bf;border-bottom:1px solid #a8844f33;justify-content:space-between;align-items:center;min-height:64px;padding:10px clamp(16px,4vw,48px);display:flex;position:relative}.brand{text-align:left;cursor:pointer;background:0 0;border:0;align-items:center;gap:11px;padding:0;display:flex}.brand-sigil{border:1px solid var(--gold);width:34px;height:39px;color:var(--gold-bright);font-family:var(--display);clip-path:polygon(50% 0,96% 24%,96% 76%,50% 100%,4% 76%,4% 24%);background:#15110d;place-items:center;display:grid;box-shadow:inset 0 0 18px #e84b3c22,0 0 16px #a8844f22}.brand>span:last-child{display:grid}.brand b{font-family:var(--display);letter-spacing:.22em;font-size:18px;font-weight:400}.brand small{color:var(--muted);letter-spacing:.2em;font-size:8px}.rules-button{color:#bdb2a1;letter-spacing:.08em;cursor:pointer;background:#0b0b0b99;border:1px solid #a8844f55;padding:9px 13px;font-size:11px}.lobby{grid-template-columns:minmax(0,1.2fr) minmax(320px,.72fr);align-items:center;gap:clamp(40px,8vw,130px);width:min(1180px,100% - 48px);min-height:calc(100svh - 65px);margin:auto;padding:48px 0 78px;display:grid}.eyebrow{color:var(--gold);font-family:var(--mono);letter-spacing:.16em;margin:0 0 22px;font-size:10px}.lobby h1{font-family:var(--display);letter-spacing:-.05em;margin:0;font-size:clamp(48px,6vw,82px);font-weight:400;line-height:.98}.lobby h1 em{color:#0000;-webkit-text-stroke:1px var(--gold-bright);text-shadow:0 0 38px #e84b3c1f;font-style:normal}.lead{border-left:1px solid var(--red);color:#a9a093;max-width:610px;margin:30px 0;padding-left:18px;font-size:15px;line-height:1.8}.mode-pills{grid-template-columns:repeat(3,1fr);gap:8px;max-width:570px;display:grid}.mode-pills button{color:#8f867a;text-align:left;cursor:pointer;background:#080808a8;border:1px solid #5b4a3466;grid-template-columns:auto 1fr;align-items:center;gap:10px;padding:13px;display:grid}.mode-pills button b{color:var(--bone);font-family:var(--display);font-size:22px;font-weight:400}.mode-pills button span{font-size:11px}.mode-pills button.active{border-color:var(--gold-bright);color:var(--gold-bright);background:linear-gradient(135deg,#211a11,#0a0908);box-shadow:inset 0 0 20px #a8844f15}.lobby-console{background:linear-gradient(150deg,#15120fdb,#050505e8 55%);border:1px solid #a8844f66;padding:28px;box-shadow:0 30px 90px #000,inset 0 1px #d9b8732b}.console-line{gap:7px;margin-bottom:18px;display:grid}.console-line span{color:var(--muted);font-family:var(--mono);letter-spacing:.14em;font-size:9px}.console-line input,.join-line input{min-width:0;color:var(--bone);background:#050505;border:1px solid #4b403366;border-radius:0;padding:13px 14px}.primary-action{border:1px solid var(--gold-bright);cursor:pointer;background:linear-gradient(90deg,#8e2b22,#3a1712);justify-content:space-between;width:100%;padding:17px;display:flex}.primary-action i{color:#f4c99b;font-size:11px;font-style:normal}.practice-row{grid-template-columns:1fr auto;gap:8px;margin-top:9px;display:grid}.practice-action,.tutorial-action{color:#c7bba9;cursor:pointer;background:#0b0b0b;border:1px solid #a8844f55;padding:13px}.tutorial-action{min-width:92px;color:var(--gold-bright)}.divider{color:#756c60;letter-spacing:.1em;align-items:center;gap:10px;margin:24px 0 13px;font-size:9px;display:flex}.divider:before,.divider:after{content:"";background:#a8844f33;flex:1;height:1px}.join-line{grid-template-columns:1fr auto;display:grid}.join-line input{font-family:var(--mono);letter-spacing:.22em;text-transform:uppercase}.join-line button{cursor:pointer;background:#1b1712;border:1px solid #a8844f88;padding:0 18px}.notice,.game-notice{color:#ef796d;margin:13px 0 0;font-size:12px;line-height:1.5}.console-note{color:#70685e;margin:18px 0 0;font-size:10px;line-height:1.6}.game-view{grid-template-rows:auto minmax(310px,1fr) auto auto;height:calc(100svh - 65px);display:grid;position:relative;overflow:hidden}.game-status{z-index:30;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#050505b8;border-bottom:1px solid #a8844f2e;grid-template-columns:90px 1fr 90px;align-items:center;gap:12px;padding:9px 18px;display:grid;position:relative}.game-status>button{color:#a89d8f;cursor:pointer;background:0 0;border:0;padding:8px;font-size:11px}.game-status>button:last-child{border:1px solid #a8844f55}.game-status div{justify-items:center;gap:2px;min-width:0;display:grid}.game-status small{color:var(--gold);font-family:var(--mono);letter-spacing:.16em;font-size:8px}.game-status b{color:#ddd3c3;text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:12px;font-weight:500;overflow:hidden}.arena{aspect-ratio:1;isolation:isolate;filter:drop-shadow(0 28px 34px #000);place-self:stretch center;width:auto;max-width:min(92vw,720px);height:100%;min-height:0;margin:0 auto;position:relative;container-type:size}.arena:before,.arena-depth{content:"";clip-path:polygon(10% 0,90% 0,100% 14%,100% 86%,90% 100%,10% 100%,0 86%,0 14%);position:absolute}.arena:before{z-index:-1;background:radial-gradient(circle at 50% 46%,#1a2027 0,#0a0d11 48%,#030405 78%);border:1px solid #56606d66;inset:4% 2%;box-shadow:inset 0 0 80px #000,inset 0 1px #dce7f21c,0 0 0 1px #000}.arena-depth{z-index:-2;background:linear-gradient(90deg,#050608,#222832 48%,#07080a);inset:calc(4% + 10px) 2% calc(4% - 10px);box-shadow:0 18px 34px #000,inset 0 -2px #e4b85c24}.arena-rings{z-index:0;border:1px solid #7c89962b;border-radius:50%;position:absolute;inset:22% 28%;box-shadow:0 0 0 14px #71819108,0 0 0 28px #71819106,inset 0 0 28px #55a7ff08}.board-links,.energy-network{pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.board-links{z-index:1}.board-links line{stroke:#59657340;stroke-width:.16px;vector-effect:non-scaling-stroke}.energy-network{z-index:4;mix-blend-mode:screen}.energy-network line{vector-effect:non-scaling-stroke}.energy-bed{stroke:color-mix(in srgb, var(--energy) 52%, #10141a);stroke-width:7px;opacity:.55;filter:drop-shadow(0 0 4px var(--energy))}.energy-flow{stroke:#fff;stroke-width:2.2px;stroke-linecap:round;stroke-dasharray:4 7;filter:drop-shadow(0 0 2px #fff) drop-shadow(0 0 5px var(--energy));animation:1.15s linear infinite energyTransit;animation-delay:calc(var(--delay) * -1)}.energy-preview .energy-bed{opacity:.72}.energy-preview .energy-flow{stroke-width:2px;animation-duration:.72s}@keyframes energyTransit{to{stroke-dashoffset:-16px}}.hex-cell{--size:clamp(28px, 9.05cqw, 62px);z-index:3;width:var(--size);height:calc(var(--size) * .86);cursor:pointer;background:0 0;border:0;padding:0;position:absolute;overflow:visible;transform:translate(-50%,-50%)}.arena--4 .hex-cell{--size:clamp(19px, 5.7cqw, 39px)}.hex-surface{clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(145deg,#3a424e 0,#1b222a 24%,#0b0f13 67%,#050608);transition:filter .18s,transform .18s,box-shadow .18s;position:absolute;inset:4%;box-shadow:inset 0 0 0 1px #8391a073,inset 0 8px 12px #0009,0 6px #020305,0 9px 10px #000}.hex-surface:before{content:"";clip-path:inherit;background:radial-gradient(circle at 50% 44%,#313d49,#0d1116 68%);position:absolute;inset:14%;box-shadow:inset 0 0 0 1px #9aabba42,inset 0 0 14px #000}.hex-surface:after{content:"";background:#e4b85c42;height:1px;position:absolute;bottom:13%;left:27%;right:27%;box-shadow:0 0 5px #e4b85c35}.hex-cell:hover .hex-surface,.hex-cell:focus-visible .hex-surface{filter:brightness(1.35)}.hex-cell.is-preview .hex-surface{background:linear-gradient(145deg,#39202a,#12090c);box-shadow:inset 0 0 0 1px #e84a4acc,inset 0 8px 12px #000a,0 6px #130507,0 0 18px #e84a4a55}.hex-cell.is-effect .hex-surface{background:linear-gradient(145deg,#3b3420,#151006);box-shadow:inset 0 0 0 1px #e4b85ccc,inset 0 8px 12px #000a,0 6px #100d05,0 0 18px #e4b85c4d}.hex-cell.is-target .hex-surface{box-shadow:inset 0 0 0 1px var(--owner), inset 0 8px 12px #000a, 0 8px 0 #020305, 0 0 20px color-mix(in srgb, var(--owner) 50%, transparent);transform:translateY(-2px)}.piece-art{z-index:5;pointer-events:none;place-items:center;transition:opacity .18s,filter .18s;display:grid;position:absolute;inset:12%;transform:translateY(-7%)}.piece-art:not(.is-powered){opacity:.62;filter:saturate(.45)}.piece-art.is-ghost{opacity:.68;filter:saturate(.9)}.piece-cast-shadow{z-index:-1;filter:blur(3px);background:#000d;border-radius:50%;height:24%;position:absolute;bottom:-10%;left:10%;right:10%}.piece-plinth{clip-path:polygon(25% 0,75% 0,98% 43%,88% 78%,50% 100%,12% 78%,2% 43%);background:linear-gradient(145deg,#4d5864,#161b22 42%,#050609 76%);position:absolute;inset:24% 8% 0;box-shadow:inset 0 0 0 1px #dbe6ef52,0 5px #030407,0 7px 8px #000}.piece-shell{z-index:2;clip-path:polygon(50% 0,82% 18%,94% 72%,68% 100%,32% 100%,6% 72%,18% 18%);background:linear-gradient(100deg,#11161c,#5b6876 46%,#151a20 55%,#050608);position:absolute;inset:7% 24% 22%;box-shadow:inset 0 0 0 1px #d8e3ec42,0 5px 8px #000}.piece-shell:after{content:"";background:linear-gradient(#eaf1f7, var(--owner) 35%, #090b0e 88%);box-shadow:0 0 7px var(--owner);opacity:.28;position:absolute;inset:7px 42% 16%}.piece-art.is-powered .piece-shell:after{opacity:.9;animation:1.5s ease-in-out infinite coreFlux}.piece-art.is-powered .piece-plinth:after{content:"";background:linear-gradient(90deg, transparent, var(--owner), #fff, var(--owner), transparent);height:1px;box-shadow:0 0 5px var(--owner);animation:1.15s linear infinite socketCharge;position:absolute;bottom:15%;left:17%;right:17%}.piece-core{aspect-ratio:1;width:18%;box-shadow:0 0 4px #fff, 0 0 10px var(--owner), 0 0 18px var(--owner);opacity:.88;background:#fff;border:1px solid #fff9;border-radius:50%;position:absolute;top:43%;left:50%;transform:translate(-50%,-50%)}.piece-sigil{z-index:4;background:var(--owner);width:20%;height:2px;box-shadow:0 0 5px var(--owner);position:absolute;top:58%;left:50%;transform:translate(-50%)}.piece-vector{z-index:6;transform:rotate(var(--direction-angle));transform-origin:50%;transition:transform .2s cubic-bezier(.2,.9,.3,1.15);position:absolute;inset:0}.piece-vector>b{background:linear-gradient(90deg, #fff, var(--owner) 35%, transparent);width:46%;height:2px;box-shadow:0 0 4px var(--owner);position:absolute;top:calc(50% - 1px);left:48%}.piece-vector>em:not(.vector-wing){clip-path:polygon(0 0,100% 50%,0 100%,34% 50%);width:22%;height:16%;filter:drop-shadow(0 0 4px var(--owner));background:#fff;position:absolute;top:42%;right:0}.piece-vector .vector-wing{background:linear-gradient(90deg, #fff, var(--owner), transparent);transform-origin:0;width:42%;height:2px;box-shadow:0 0 3px var(--owner);position:absolute;top:calc(50% - 1px);left:48%}.piece-vector .vector-wing--a{transform:rotate(-60deg)}.piece-vector .vector-wing--b{transform:rotate(60deg)}.piece-vector--field{border:1px solid var(--owner);box-shadow:0 0 7px color-mix(in srgb, var(--owner) 65%, transparent), inset 0 0 6px color-mix(in srgb, var(--owner) 42%, transparent);border-radius:50%;inset:26%}.piece-vector--field>b{background:linear-gradient(transparent, var(--owner), transparent);width:2px;height:92%;top:4%;left:50%}.piece-vector--field>em{display:none}.piece-art--triple .piece-shell{clip-path:polygon(50% 0,91% 25%,78% 100%,22% 100%,9% 25%);left:21%;right:21%}.piece-art--pacifier .piece-shell{clip-path:polygon(50% 0,88% 35%,70% 100%,30% 100%,12% 35%)}.piece-art--rotateCw .piece-sigil,.piece-art--rotateCcw .piece-sigil{border:1px solid var(--owner);background:0 0;border-left-color:#0000;border-radius:50%;width:28%;height:28%}.piece-art--rotateCcw .piece-sigil{transform:translate(-50%)scaleX(-1)}.piece-art--repulsor .piece-shell{clip-path:polygon(50% 0,100% 50%,77% 100%,23% 100%,0 50%);left:18%;right:18%}.piece-art--repulsor .piece-vector--field{border-style:double;inset:18%}.piece-art--base{inset:5%;transform:translateY(-9%)}.piece-art--base .piece-plinth{inset:36% 3% 0}.piece-art--base .piece-shell{clip-path:polygon(50% 0,82% 22%,72% 100%,28% 100%,18% 22%);inset:2% 28% 15%}.base-transmitter{z-index:6;border:1px solid color-mix(in srgb, var(--owner) 75%, #fff);box-shadow:0 0 8px var(--owner), inset 0 0 7px var(--owner);border-radius:50%;animation:2.2s ease-in-out infinite basePulse;position:absolute;inset:4%}.base-transmitter b{width:3px;height:3px;box-shadow:0 0 6px var(--owner);transform:rotate(calc(var(--n) * 120deg)) translateX(16px);background:#fff;border-radius:50%;position:absolute;top:50%;left:50%}.base-transmitter b:first-child{--n:0}.base-transmitter b:nth-child(2){--n:1}.base-transmitter b:nth-child(3){--n:2}@keyframes basePulse{50%{opacity:.68;transform:scale(1.08)}}@keyframes coreFlux{50%{filter:brightness(1.6);transform:scaleY(.72)}}@keyframes socketCharge{to{opacity:.35;transform:translateY(-4px)}}.piece-art--crater{inset:15%;transform:translateY(0)}.piece-art--crater .piece-shell,.piece-art--crater .piece-sigil{display:none}.piece-art--crater .piece-plinth{clip-path:polygon(50% 0,85% 14%,100% 50%,82% 91%,50% 100%,13% 86%,0 50%,18% 13%);background:radial-gradient(circle,#020203 20%,#171a20 23%,#040506 62%);border-radius:50%;inset:17%}.piece-icon{flex:0 0 46px;width:46px;height:46px;display:block;position:relative}.piece-icon .piece-art{inset:3%;transform:translateY(-3%)}.target-iris{z-index:8;border:1px solid color-mix(in srgb, var(--owner) 72%, #fff);box-shadow:0 0 14px color-mix(in srgb, var(--owner) 36%, transparent), inset 0 0 14px color-mix(in srgb, var(--owner) 20%, transparent);pointer-events:none;border-radius:50%;animation:.24s ease-out irisIn;position:absolute;inset:-22%}.target-iris i{transform-origin:0;background:linear-gradient(90deg, var(--owner), transparent);width:48%;height:1px;position:absolute;top:50%;left:50%}@keyframes irisIn{0%{opacity:0;transform:scale(.7)rotate(-20deg)}}.player-strip{z-index:15;background:#050505b8;justify-content:center;gap:7px;padding:6px 12px;display:flex;position:relative;overflow-x:auto}.player-strip>span{--player:#fff;color:#8f877d;border:1px solid #3b352e;grid-template-rows:auto auto;grid-template-columns:22px auto;min-width:118px;padding:7px 10px;display:grid}.player-strip i{border:1px solid var(--player);width:18px;height:18px;color:var(--player);font-family:var(--mono);border-radius:50%;grid-row:1/3;place-items:center;margin:auto 7px auto 0;font-size:8px;font-style:normal;display:grid}.player-strip b{white-space:nowrap;font-size:10px;font-weight:600}.player-strip small{font-size:8px}.player-strip>span.active{border-color:var(--player);color:var(--bone);box-shadow:inset 0 0 16px color-mix(in srgb, var(--player) 12%, transparent)}.player-strip>span.eliminated{opacity:.38;filter:grayscale()}.tactics-drawer{z-index:20;min-height:132px;padding:12px clamp(14px, 3vw, 34px) max(12px, env(safe-area-inset-bottom));background:linear-gradient(#15120ff2,#050505fa);border-top:1px solid #a8844f4d;grid-template-columns:minmax(210px,.55fr) minmax(0,1.6fr) minmax(290px,.85fr);align-items:center;gap:14px;display:grid;position:relative;box-shadow:0 -16px 50px #000b}.drawer-head{min-width:0}.drawer-head div{gap:4px;display:grid}.drawer-head small{color:var(--gold);font-family:var(--mono);letter-spacing:.14em;font-size:8px}.drawer-head b{font-size:13px}.drawer-head p{color:#8c8377;margin:7px 0 0;font-size:10px;line-height:1.45}.piece-tray{scrollbar-width:none;gap:6px;padding:4px;display:flex;overflow-x:auto}.piece-tray::-webkit-scrollbar{display:none}.piece-tray button{color:#929ba5;text-align:left;cursor:pointer;background:#07090b;border:1px solid #39414b;flex:0 0 104px;grid-template-columns:46px 1fr;align-items:center;gap:4px;min-height:66px;padding:4px 6px;display:grid}.piece-tray button span{gap:3px;display:grid}.piece-tray button b{font-size:9px}.piece-tray button small{white-space:nowrap;font-size:7px}.piece-tray button.active{border-color:var(--gold-bright);color:var(--bone);background:#16130d;box-shadow:inset 0 0 18px #e4b85c16,0 0 0 1px #e4b85c18}.piece-tray button:disabled{opacity:.3;cursor:not-allowed}.deploy-controls{grid-template-columns:62px 82px 62px 1fr;align-items:stretch;gap:6px;display:grid}.deploy-controls>button{color:var(--gold-bright);cursor:pointer;background:#0a0908;border:1px solid #4d4236;place-items:center;padding:7px;font-size:22px;display:grid}.deploy-controls small{color:#8f867a;font-size:7px}.orientation{background:radial-gradient(circle,#1e252c,#06080a 66%);border:1px solid #5e6874;place-items:center;display:grid}.orientation-vector{width:35px;height:35px;transform:rotate(var(--direction-angle));border:1px solid #59657355;border-radius:50%;transition:transform .2s;position:relative}.orientation-vector i{background:linear-gradient(90deg, #fff, var(--red));width:50%;height:2px;box-shadow:0 0 5px var(--red);position:absolute;top:calc(50% - 1px);left:50%}.orientation-vector i:after{content:"";clip-path:polygon(0 0,100% 50%,0 100%,30% 50%);width:8px;height:10px;filter:drop-shadow(0 0 3px var(--red));background:#fff;position:absolute;top:-4px;right:-1px}.orientation small{font-family:var(--mono)}.deploy-controls .confirm{border-color:var(--gold-bright);color:#fff1dc;background:linear-gradient(100deg,#8c2a21,#341410);min-width:120px;padding:8px 14px;font-size:12px}.deploy-controls .confirm:disabled{color:#625b52;cursor:not-allowed;background:#0c0b0a;border-color:#403931}.game-notice{background:#190b09e8;border:1px solid #e84b3c55;padding:8px 12px;position:absolute;top:-36px;right:18px}.result-card{z-index:80;border:1px solid var(--gold-bright);text-align:center;background:#0a0908f5;width:min(440px,100% - 32px);padding:34px;position:fixed;inset:50% auto auto 50%;transform:translate(-50%,-50%);box-shadow:0 30px 100px #000}.result-card small{color:var(--gold);font-family:var(--mono);letter-spacing:.16em}.result-card h2{font-family:var(--display);margin:14px 0 7px;font-size:36px;font-weight:400}.result-card p{color:var(--muted)}.result-card button{border:1px solid var(--gold);cursor:pointer;background:#21170d;padding:12px 22px}.rules-modal{z-index:100;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#000d;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.rules-sheet{background:linear-gradient(145deg,#18130f,#070707 55%);border:1px solid #a8844f88;width:min(820px,100%);max-height:min(88svh,900px);padding:clamp(24px,5vw,52px);position:relative;overflow-y:auto;box-shadow:0 30px 100px #000}.rules-sheet .close{color:#a89e90;cursor:pointer;background:0 0;border:0;position:absolute;top:18px;right:18px}.rules-sheet h2{font-family:var(--display);margin:0 0 25px;font-size:clamp(32px,5vw,52px);font-weight:400}.rules-sheet ol{counter-reset:rules;grid-template-columns:repeat(5,1fr);gap:10px;margin:0;padding:0;list-style:none;display:grid}.rules-sheet li{counter-increment:rules;border-top:1px solid #a8844f66;align-content:start;gap:7px;padding:14px;display:grid}.rules-sheet li:before{content:"0" counter(rules);color:var(--red);font-family:var(--mono);font-size:9px}.rules-sheet li b{font-size:12px}.rules-sheet li span{color:#958c80;font-size:10px;line-height:1.55}.rule-pieces{grid-template-columns:repeat(3,1fr);gap:8px;margin-top:28px;display:grid}.rule-pieces article{background:#07090b;border:1px solid #353e48;grid-template-columns:64px 1fr;align-items:center;gap:7px;padding:9px;display:grid}.rule-pieces .piece-icon{width:64px;height:64px}.rule-pieces div{gap:4px;display:grid}.rule-pieces b{font-size:11px}.rule-pieces span{color:#8d8478;font-size:9px;line-height:1.4}.tutorial-modal{z-index:110;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#000e;place-items:center;padding:18px;display:grid;position:fixed;inset:0}.tutorial-card{background:linear-gradient(145deg,#18130f,#070707 58%);border:1px solid #a8844f88;grid-template-columns:minmax(240px,.9fr) minmax(300px,1fr);width:min(760px,100%);min-height:430px;display:grid;position:relative;overflow:hidden;box-shadow:0 35px 110px #000}.tutorial-card>.close{z-index:4;color:#9d9386;cursor:pointer;background:0 0;border:0;padding:8px;position:absolute;top:14px;right:16px}.tutorial-demo{background:radial-gradient(circle,#2a1d13,#070707 58%);place-items:center;min-height:360px;display:grid;position:relative;overflow:hidden}.tutorial-demo:before{content:"";border:1px solid #a8844f40;border-radius:50%;width:260px;height:260px;position:absolute;box-shadow:0 0 0 24px #a8844f0a,0 0 0 48px #a8844f08}.demo-cell{z-index:2;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);background:linear-gradient(145deg,#303641,#080b0e);width:112px;height:96px;display:block;position:relative;box-shadow:inset 0 0 0 2px #71809180,0 9px #020305}.demo-cell .piece-art{inset:12%}.demo-target{z-index:1;border:1px solid var(--red);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);transform-origin:50%;background:#5b1c177a;width:55px;height:48px;transition:transform .2s;position:absolute;box-shadow:0 0 22px #e84b3c66}.tutorial-copy{flex-direction:column;justify-content:center;padding:52px 38px 32px;display:flex}.tutorial-copy h2{font-family:var(--display);margin:0 0 14px;font-size:clamp(35px,5vw,52px);font-weight:400;line-height:1}.tutorial-copy>p:not(.eyebrow){color:#9f9689;min-height:74px;margin:0;font-size:13px;line-height:1.75}.tutorial-rotate{grid-template-columns:1fr 1fr;gap:8px;margin:18px 0 0;display:grid}.tutorial-rotate button{color:var(--gold-bright);cursor:pointer;background:#0a0908;border:1px solid #a8844f66;padding:11px}.tutorial-progress{gap:7px;margin:24px 0 18px;display:flex}.tutorial-progress i{background:#3d372f;width:24px;height:2px}.tutorial-progress i.active{background:var(--red);box-shadow:0 0 8px var(--red)}.tutorial-progress i.done{background:var(--gold)}.tutorial-nav{grid-template-columns:1fr 1.4fr;gap:8px;display:grid}.tutorial-nav button{color:#a69c8e;cursor:pointer;background:#0a0908;border:1px solid #4b4238;padding:12px}.tutorial-nav button:disabled{opacity:.3}.tutorial-nav .next{border-color:var(--gold-bright);color:#fff0db;background:#512019}@media (max-width:820px){.topbar{min-height:55px}.brand b{font-size:15px}.brand small{display:none}.brand-sigil{width:29px;height:33px}.lobby{grid-template-columns:1fr;gap:30px;width:min(100% - 28px,590px);min-height:auto;padding:45px 0 60px}.lobby h1{font-size:clamp(45px,14vw,67px)}.lead{font-size:13px}.lobby-console{padding:20px}.game-view{grid-template-rows:auto minmax(300px,1fr) auto auto;height:calc(100svh - 55px)}.game-status{grid-template-columns:62px 1fr 62px;padding:6px 8px}.arena{width:auto;max-width:100vw;height:100%}.piece-art{inset:14%}.piece-art--base{inset:6%}.piece-icon .piece-art{inset:3%}.player-strip{justify-content:flex-start}.tactics-drawer{min-height:194px;padding:8px 10px max(8px, env(safe-area-inset-bottom));grid-template-columns:1fr;gap:7px}.drawer-head{justify-content:space-between;gap:10px;display:flex}.drawer-head p{max-width:52%;margin:0;font-size:8px}.piece-tray button{flex-basis:98px;grid-template-columns:40px 1fr;min-height:56px}.piece-tray .piece-icon{width:40px;height:40px}.deploy-controls{grid-template-columns:52px 70px 52px 1fr}.deploy-controls>button{padding:5px;font-size:18px}.deploy-controls .confirm{min-width:0}.rules-sheet ol{grid-template-columns:1fr}.rule-pieces{grid-template-columns:1fr 1fr}.tutorial-card{grid-template-columns:1fr;max-height:88svh;overflow-y:auto}.tutorial-demo{min-height:270px}.tutorial-copy{padding:28px 24px 24px}.tutorial-copy>p:not(.eyebrow){min-height:58px}}@media (max-width:480px){.mode-pills{gap:5px}.mode-pills button{grid-template-columns:1fr;gap:2px;padding:10px}.mode-pills button b{font-size:19px}.mode-pills button span{font-size:9px}.arena:before{inset:3% 0}.player-strip>span{min-width:105px}.rule-pieces{grid-template-columns:1fr}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation:none!important}}
