:root{font-family:Segoe UI,Arial,sans-serif;color:#243f42;background:#ece8de;font-synthesis:none;--ink:#173b40;--gold:#d6ad6b;--muted:#77827d;--line:#d9d4c7;--paper:#f4f1e9;--teal:#236d74}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,a,input,select{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;transition:background .18s,transform .18s,box-shadow .18s}button:disabled{cursor:default;opacity:.45}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #c49145;outline-offset:4px}button:not(:disabled):active{transform:translateY(1px)}button[hidden],[hidden]{display:none!important}a{color:inherit}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Georgia,Times New Roman,serif;font-weight:400}button svg{width:100%;height:100%}.topbar{height:88px;display:flex;align-items:center;justify-content:space-between;padding:0 40px;border-bottom:1px solid #335157;background:#15363c;color:#f1dfbb;position:relative;z-index:10;box-shadow:0 5px 24px #223a3514}.brand{display:flex;align-items:center;gap:13px;text-decoration:none;font-family:Georgia,serif;font-size:21px;letter-spacing:4px}.brand-emblem{width:51px;height:51px;color:#d9b97a}.brand-sub{display:block;letter-spacing:5px;font:9px Segoe UI,sans-serif;text-align:center;margin-top:5px;color:#bfccc3}.chapter{font-size:9px;letter-spacing:2.8px;color:#afbeb4;display:flex;align-items:center;gap:22px}.small-diamond{font-size:7px;color:#b39768}.topbar nav{display:flex;align-items:center;gap:20px}.nav-button,.icon-button{border:0;background:transparent;color:#e2e7db;font-size:12px;padding:9px 4px}.nav-button:hover{color:#f2cd8e}.icon-button{font-size:21px;border-left:1px solid #3b5658;padding-left:20px}.main{position:relative;height:calc(100dvh - 120px);min-height:420px;overflow:clip;background:radial-gradient(ellipse at 53% 48%,#f4efdf,#e3dfd1 70%,#dad8ca)}.viewport{position:absolute;inset:64px 246px 68px 228px;transition:left .35s,right .35s}.viewport canvas{display:block;width:100%;height:100%;outline:none;touch-action:none}.ambient-rings{position:absolute;width:1000px;height:1000px;border:1px solid #ad9a7120;border-radius:50%;top:-120px;left:40%}.ambient-rings:before,.ambient-rings:after{content:"";position:absolute;inset:60px;border:1px solid #ad9a7118;border-radius:50%}.ambient-rings:after{inset:120px}.menu-mode .viewport{inset:15px -5% 0 32%}.hero{position:absolute;left:6.3%;top:50%;transform:translateY(-52%);width:37%;max-width:540px;z-index:2;pointer-events:none}.hero>*{pointer-events:auto}.main:not(.menu-mode) .hero,.main:not(.menu-mode) .arena-caption{display:none}.menu-mode .play-ui{display:none}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2.1px;color:#8d7146;display:flex;align-items:center;gap:12px;margin-bottom:24px}.eyebrow>span{width:28px;height:1px;background:#b18c53}.hero h1{font-size:clamp(34px,3.6vw,62px);letter-spacing:-2.2px;line-height:1.13;color:#173c41}.hero h1 em{font-weight:400;color:#a57842}.hero-copy{font-size:14px;line-height:1.95;max-width:365px;color:#687673;margin:25px 0 30px}.hero-actions{display:flex;align-items:flex-start;flex-direction:column;gap:12px}.primary,.secondary{display:inline-flex;justify-content:center;align-items:center;gap:28px;border-radius:3px;padding:12px 20px;font-size:12px;font-weight:600;border:1px solid transparent;white-space:nowrap}.primary{background:#1f555c;color:#f6e6c6;border-color:#1f555c;box-shadow:0 4px 12px #143f4220}.primary:hover{background:#286870}.secondary{background:#f6f2e8;color:#315253;border-color:#c9c7b8}.secondary:hover{background:#e7e2d4}.large{width:270px;justify-content:space-between;padding:17px 23px;font-size:13px}.primary span{color:#dfbb7f;font-size:18px}.hero-facts{display:flex;gap:28px;margin-top:37px;padding-top:23px;border-top:1px solid #b0a68b50;width:max-content;max-width:100%}.hero-facts>div{display:flex;flex-direction:column;gap:7px}.hero-facts strong{font:25px Georgia,serif;color:#395457}.hero-facts span{font-size:7px;letter-spacing:1.4px;color:#819088}.save-warning{font-size:11px;max-width:350px;margin-top:18px;color:#9a503c}.arena-caption{position:absolute;bottom:45px;right:8%;display:flex;align-items:center;gap:17px;font-size:9px;font-weight:600;letter-spacing:2px;color:#365356;pointer-events:none}.arena-caption small{display:block;font:italic 13px Georgia,serif;letter-spacing:0;color:#7a8578;margin-top:8px}.caption-line{height:1px;width:50px;background:#aa8a59}.camera-controls{position:absolute;bottom:84px;left:50%;transform:translate(-50%);display:flex;align-items:center;border:1px solid #c9c7b78f;background:#f4f0e6ed;border-radius:5px;padding:3px;box-shadow:0 4px 15px #4251450a;z-index:2}.camera-controls button{width:36px;height:32px;border:0;border-radius:3px;background:transparent;color:#3f5a58;font-size:20px}.camera-controls button:hover{background:#dedbcd}.menu-mode .camera-controls{bottom:40px;left:66%;opacity:.8}.site-footer{height:32px;background:#e9e5da;display:flex;align-items:center;justify-content:space-between;padding:0 32px;font-size:8px;letter-spacing:1.3px;color:#7f887d;border-top:1px solid #d9d6c7}.site-footer span:nth-child(2){letter-spacing:.2px;font-size:9px}.turn-banner{position:absolute;top:23px;left:50%;transform:translate(-50%);display:flex;align-items:center;gap:14px;white-space:nowrap;z-index:2}.phase-number{font:26px Georgia,serif;color:#a17c45;border-right:1px solid #a4967350;padding-right:15px}.phase-number.moon{color:#9e5e4b}.turn-banner strong{font:19px Georgia,serif;color:#23464a}.turn-banner small{display:block;font-size:8px;letter-spacing:1.6px;margin-top:8px;color:#849080}.turn-banner small span{margin:0 10px;color:#bd995e}.left-panel,.right-panel{position:absolute;top:36px;bottom:86px;z-index:2}.left-panel{left:26px;width:188px;display:flex;flex-direction:column}.right-panel{right:27px;width:207px}.panel-overline{font-size:8px;letter-spacing:1.6px;color:#8b9385;font-weight:600}.faction{display:flex;gap:10px;align-items:center;margin-top:14px}.faction-symbol{font-size:27px;color:#45838a}.faction h2{font-size:18px;white-space:nowrap}.faction p{font-size:9px;color:#819085;margin-top:5px}.army-count{margin-top:20px}.army-count>strong{font:30px Georgia,serif;color:#234c51}.army-count>span{font-size:9px;color:#7c897d;margin-left:8px}.army-meter{height:3px;background:#cfcec0;margin-top:10px}.army-meter i{display:block;height:100%;background:#477e7d;transition:width .3s}.roster-heading{display:flex;justify-content:space-between;font-size:7px;letter-spacing:1.4px;color:#929688;margin:23px 0 6px}.roster{overflow:auto;min-height:0;scrollbar-width:thin;scrollbar-color:#b4b3a1 transparent}.roster-row{display:flex;align-items:center;width:100%;padding:6px 2px;background:transparent;border:0;border-bottom:1px solid #bfbca728;text-align:left;color:#365351;gap:8px}.roster-row:hover{background:#f8f2df99}.unit-icon{width:26px;height:28px;border:1px solid #ada68166;display:grid;place-items:center;color:#8a734d;font-size:17px;border-radius:3px}.roster-row>span:nth-child(2){font-size:10px;flex:1}.roster-row small{display:block;font-size:6px;letter-spacing:.8px;color:#8c9587;margin-top:2px}.roster-row b{font-size:11px;font-weight:500}.roster-row b small{display:inline;font-size:9px;letter-spacing:0}.depleted{opacity:.45}.text-button{background:transparent;border:0;border-top:1px solid #cac6b4;color:#4b6561;text-align:left;display:flex;justify-content:space-between;align-items:center;padding:14px 0;width:100%;font-size:10px}.text-button:hover{color:#9a723f}.tactical-open{margin-top:12px}.enemy-card{border-bottom:1px solid #cbc7b3;padding-bottom:18px}.enemy-card h2{font-size:20px;margin-top:12px;color:#86533f}.enemy-card h2 span{font-size:22px;margin-right:5px}.enemy-card p{font-size:10px;color:#8b8a77;margin-top:8px}.enemy-card p strong{font-weight:500;color:#8f624b}.selection-card{padding:18px 16px;background:#f5f1e6bb;border:1px solid #f9f5e7;border-radius:5px;margin-top:18px;box-shadow:0 5px 20px #4f4d2910;min-height:225px}.selection-card .panel-overline{font-size:7px;letter-spacing:1px}.selection-card h2{font-size:24px;line-height:1.1;margin:9px 0 5px}.selection-card p{font-size:10px;line-height:1.8;color:#7c8679;margin-top:12px}.military{font-size:9px;color:#9d8b6c}.portrait{height:95px;position:relative;display:flex;align-items:center;justify-content:center;margin-top:12px;background:radial-gradient(ellipse,#e0d4ac66,transparent 70%)}.portrait-symbol{font-size:62px;color:#2b5b61;position:relative;text-shadow:3px 4px 0 #b9a779}.portrait-halo{position:absolute;border:1px solid #c5ad7755;width:86px;height:86px;border-radius:50%}.portrait-halo:after{content:"";position:absolute;inset:8px;border:1px solid #c5ad7733;border-radius:50%}.portrait-rank{position:absolute;bottom:0;right:27px;border-radius:50%;background:#1d4f56;color:#e8c991;width:23px;height:23px;font:14px Georgia,serif;display:grid;place-items:center;border:1px solid #d5b67d}.unit-stats{border-top:1px solid #d9d1b7;margin-top:15px;padding-top:12px;display:flex;justify-content:space-between;font-size:7px;letter-spacing:.6px;color:#7b8b7b}.unit-stats b{margin-left:7px;color:#375a56;font-size:11px}.empty-selection{width:58px;height:65px;color:#ba9d65;margin:20px auto 12px}.empty-selection+h2{font-size:20px;line-height:1.3}.tip-card{margin:21px 0 8px;padding:0 3px}.tip-title{font-size:7px;letter-spacing:1.4px;color:#a08a65}.tip-card p{font-size:10px;line-height:1.9;color:#818b7b;margin-top:8px}.bottom-bar{position:absolute;left:26px;right:27px;bottom:17px;height:48px;display:flex;align-items:center;border-top:1px solid #c8c3ad80;padding-top:13px;gap:10px}.status-dot{width:5px;height:5px;border-radius:50%;background:#59817a}.bottom-bar>span{font-size:10px;color:#6e8075}.setup-actions{margin-left:auto;display:flex;gap:9px}.save-status{margin-left:auto;font-size:7px!important;letter-spacing:1px;color:#929784!important}.setup-actions:not([hidden])~.save-status{display:none}.dialog{width:min(640px,calc(100vw - 32px));max-height:87dvh;padding:40px;background:#f4f0e5;color:#35504e;border:1px solid #c3ae7d;border-radius:7px;box-shadow:0 30px 100px #061a2370;overflow:auto;scrollbar-width:thin}.dialog::backdrop{background:#102f3c88;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px)}.dialog-close{position:absolute;right:14px;top:10px;border:0;background:transparent;color:#8b8d78;font-size:26px;width:28px;height:28px}.dialog .eyebrow{margin-bottom:14px}.dialog h2{font-size:32px;letter-spacing:-.7px;margin-bottom:18px}.dialog p{font-size:13px;line-height:1.8;color:#718174;margin-bottom:15px}.dialog p strong{color:#3e5d54}.modal-actions{display:flex;gap:12px;margin-top:25px}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:22px 0}.rules-grid b{font-size:11px;font-weight:600;color:#9b7d49}.rules-grid p{font-size:12px;margin-top:8px}.rules-special{padding:17px 20px;background:#e7e3d5;border-left:2px solid #ba985b}.rules-special p{font-size:12px;margin:0 0 8px}.rules-special p:last-child{margin:0}.fine-print{font-size:10px!important;line-height:1.8!important;margin-top:18px!important}.source-link{font-size:11px;color:#597c72;text-underline-offset:4px}.setting{display:flex;justify-content:space-between;gap:20px;align-items:center;padding:22px 0;border-bottom:1px solid #d8d1bd;font-size:13px}.setting small{display:block;font-size:10px;color:#8b917f;margin-top:6px}.setting input{accent-color:#28626a}.setting select{padding:8px;border:1px solid #c3bea7;background:#ece8d9;color:#3a5a54}.result-emblem{width:80px;height:80px;color:#b48e4b;margin-bottom:20px}.casualties{display:grid;grid-template-columns:1fr 1fr;gap:25px}.casualties h3{font-size:20px;margin:15px 0}.casualties p{display:flex;justify-content:space-between;border-bottom:1px solid #d9d4c2;font-size:12px;margin:0;padding:6px 0}.tactical-board{display:grid;grid-template-columns:repeat(10,1fr);gap:3px}.tactical-cell{height:44px;border:1px solid #c5baa1;border-radius:3px;background:#d9c7a4;color:#785f3d;position:relative;font:700 17px Georgia,serif;padding:8px 0 0}.tactical-cell small{position:absolute;top:2px;left:3px;font:7px Segoe UI,sans-serif;opacity:.65}.tactical-cell.human{background:#d1ddd2;color:#205d68}.tactical-cell.ai{background:#e3cbb7;color:#9c5d47}.tactical-cell.lake{background:#9ec4bc;color:#d8e9d9;border-color:#91b2a7;opacity:1}.tactical-cell.selected{outline:3px solid #b99141;outline-offset:-3px;background:#ecdda8}.tactical-cell.valid{box-shadow:inset 0 0 0 2px #438b6c;background:#c5d7b8}.tactical-cell:hover:not(:disabled){filter:brightness(1.08)}.combat-banner{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);background:#173c42f5;color:#efd6a4;border:1px solid #b59358;border-radius:5px;text-align:center;padding:23px 36px;box-shadow:0 15px 70px #10262860;z-index:5;pointer-events:none}.combat-banner>span{font-size:8px;letter-spacing:3px;color:#b7c1ad}.combat-banner strong{display:block;font:25px Georgia,serif;margin:12px 0}.combat-banner i{font:20px Georgia,serif;color:#a88250;margin:0 10px}.combat-banner small{font-size:11px;color:#bfc7b2}.combat-banner b{margin:0 14px;color:#c5a369}.toast{position:absolute;bottom:90px;left:50%;transform:translate(-50%);z-index:8;max-width:400px;border:1px solid #c4ad76;border-radius:4px;background:#153c43;color:#eee3c7;font-size:12px;line-height:1.6;padding:12px 22px;box-shadow:0 5px 30px #21392d30}.loading{position:absolute;inset:0;background:#e5e1d3;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;text-align:center;padding:40px}.loading-emblem{width:65px;color:#ab8851;animation:breathe 2s ease-in-out infinite}.loading p{font:17px Georgia,serif}.loading h2{font-size:26px}.loading p{max-width:340px;line-height:1.6}@keyframes breathe{50%{opacity:.4}}@media(min-width:1700px){.left-panel{left:40px;width:220px}.right-panel{right:40px;width:238px}.viewport{left:275px;right:295px}.roster-row{padding:9px 3px}.roster-row>span:nth-child(2){font-size:12px}.roster-row small{font-size:7px}.selection-card{padding:23px}.selection-card p,.tip-card p{font-size:12px}.portrait{height:130px}.portrait-symbol{font-size:80px}.faction h2{font-size:22px}.army-count{margin-top:28px}.turn-banner strong{font-size:23px}.turn-banner{top:29px}.hero-copy{font-size:16px;max-width:410px}}@media(max-height:780px){.topbar{height:72px}.main{height:calc(100dvh - 104px)}.left-panel,.right-panel{top:23px}.roster-row{padding:4px 2px}.unit-icon{height:24px}.roster-heading{margin-top:15px}.army-count{margin-top:13px}.selection-card{margin-top:12px;padding:14px;min-height:200px}.portrait{height:78px}.portrait-symbol{font-size:50px}.selection-card h2{font-size:22px}.tip-card{margin-top:14px}.hero-facts{margin-top:26px;padding-top:18px}.hero-copy{margin-top:20px;margin-bottom:22px}.hero .eyebrow{margin-bottom:20px}.hero h1{font-size:clamp(34px,3.5vw,52px)}.hero{transform:translateY(-50%)}.turn-banner{top:19px}.camera-controls{bottom:80px}}@media(max-width:1050px){.chapter{display:none}.topbar{padding:0 22px}.left-panel{left:18px;width:155px}.right-panel{right:18px;width:180px}.viewport{left:180px;right:200px}.faction h2{font-size:16px}.faction p{font-size:8px}.hero{left:5%;width:44%}.hero-copy{max-width:290px;font-size:12px}.hero-facts{gap:16px}.hero-facts span{font-size:6px}.hero h1{letter-spacing:-1.5px}.turn-banner strong{font-size:15px}.turn-banner small{font-size:7px}.menu-mode .viewport{left:38%;right:-16%}.right-panel .tip-card{display:none}}@media(max-width:760px){body{overflow:auto}.main{min-height:650px}.topbar{height:68px;padding:0 16px}.brand{font-size:16px;letter-spacing:2px}.brand-emblem{width:40px;height:40px}.brand-sub{font-size:7px}.topbar nav{gap:11px}.nav-button{font-size:10px}.icon-button{padding-left:10px}.main.menu-mode{height:calc(100dvh - 100px);min-height:700px}.hero{left:7%;top:55px;transform:none;width:86%;max-width:none}.hero h1{font-size:38px;line-height:1.07}.hero-copy{max-width:300px;font-size:12px;margin:17px 0}.hero .eyebrow{font-size:7px}.hero-facts{display:none}.hero-actions{gap:8px}.large{width:230px;padding:12px 17px;font-size:12px}.menu-mode .viewport{inset:310px -25% 20px 0}.arena-caption{display:none}.menu-mode .camera-controls{left:50%;bottom:15px}.left-panel,.right-panel{display:none}.viewport{inset:80px 0 100px}.turn-banner{left:24px;transform:none}.bottom-bar{left:16px;right:16px;bottom:12px;flex-wrap:wrap;height:auto;min-height:65px}.bottom-bar #status{font-size:9px;max-width:70%}.setup-actions{width:100%;justify-content:space-between;margin-top:4px}.setup-actions .primary,.setup-actions .secondary{font-size:10px;padding:10px}.save-status{font-size:6px!important}.camera-controls{bottom:100px}.site-footer{padding:0 15px}.site-footer span:nth-child(2){display:none}.dialog{padding:30px 20px}.rules-grid{grid-template-columns:1fr}.dialog h2{font-size:28px}.tactical-cell{height:35px;font-size:14px}.setting input[type=range]{width:100px}.combat-banner{padding:20px;width:85%}.combat-banner strong{font-size:20px}}.viewport canvas{cursor:grab}.viewport canvas.orbiting{cursor:grabbing}.viewport canvas:focus-visible{outline:2px solid #b59358;outline-offset:-3px;border-radius:8px}.camera-controls{border-color:#b9b8a3;background:#f5f1e9f5;box-shadow:0 6px 24px #243f421a;border-radius:9px;padding:4px}.camera-controls button{width:38px;height:36px;border-radius:5px}.camera-controls #camera-reset{border-left:1px solid #cbc7b3;border-radius:0}.camera-controls #camera-top{border-right:1px solid #cbc7b3;border-radius:0}.camera-help{position:absolute;bottom:calc(100% + 8px);left:50%;transform:translate(-50%);font-size:10px;letter-spacing:.25px;white-space:nowrap;color:#4c625a;background:#f4f0e6e8;padding:5px 10px;border-radius:12px;pointer-events:none}.touch-help{display:none}@media(pointer:coarse){.mouse-help{display:none}.touch-help{display:inline}.camera-controls button{height:44px}}@media(max-width:760px){.camera-controls button{width:36px;min-height:40px}.menu-mode .camera-controls{opacity:1}.camera-help{font-size:9px}}@media(prefers-reduced-motion:reduce){.viewport,button{transition:none}.loading-emblem{animation:none}}
