:root{--paper:#f3eddf;--paper-2:#ebe1cd;--ink:#25312c;--muted:#69736d;--line:rgba(37,49,44,.14);--green:#315f4c;--green-2:#264a3c;--lime:#c7d56c;--gold:#d5a948;--red:#b75959;--white:#fffdf7;--shadow:0 20px 60px rgba(58,48,30,.14);--radius:24px}
*{box-sizing:border-box}html{min-height:100%;background:var(--paper)}body{margin:0;min-height:100%;font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:radial-gradient(circle at 12% 6%,rgba(199,213,108,.22),transparent 28%),linear-gradient(135deg,var(--paper),#f7f2e8 60%,var(--paper-2));font-size:16px}button,input,select{font:inherit;color:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid rgba(49,95,76,.35);outline-offset:3px}[hidden]{display:none!important}.app-shell{min-height:100vh;min-height:100dvh}.site-header{height:86px;padding:0 clamp(20px,5vw,72px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);position:relative;z-index:20}.brand{border:0;background:none;display:flex;align-items:center;gap:13px;padding:6px 0;text-align:left}.brand strong{font-size:17px;letter-spacing:.16em;display:block}.brand small{font:500 10px/1.2 ui-monospace,monospace;text-transform:uppercase;color:var(--muted);letter-spacing:.08em}.brand-mark{width:38px;height:38px;position:relative;display:block}.brand-mark i{position:absolute;width:20px;height:23px;background:var(--green);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}.brand-mark i:nth-child(1){left:0;top:7px}.brand-mark i:nth-child(2){left:17px;top:0;background:var(--lime)}.brand-mark i:nth-child(3){left:17px;top:15px;background:var(--gold)}.header-actions{display:flex;align-items:center;gap:12px}.icon-button,.guest-chip{min-height:44px;border:1px solid var(--line);background:rgba(255,253,247,.65);border-radius:999px}.icon-button{width:44px;display:grid;place-items:center}.icon-button svg{width:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.guest-chip{padding:0 16px;display:flex;align-items:center;gap:9px;font-weight:700}.status-dot{width:8px;height:8px;border-radius:50%;background:#58a96f;box-shadow:0 0 0 4px rgba(88,169,111,.15)}main{min-height:calc(100vh - 86px)}.view{animation:view-in .35s ease both}@keyframes view-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.home-view{max-width:1180px;margin:auto;padding:clamp(52px,8vh,94px) 28px 48px}.hero{max-width:780px}.eyebrow{font:700 12px/1.3 ui-monospace,SFMono-Regular,monospace;letter-spacing:.15em;text-transform:uppercase;color:var(--green);margin:0 0 15px}.hero h1{font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:clamp(52px,7.3vw,94px);line-height:.94;letter-spacing:-.055em;margin:0}.hero h1 em{font-weight:400;color:var(--green);text-decoration:none}.hero-copy{font-size:clamp(17px,2vw,20px);line-height:1.65;color:var(--muted);max-width:670px;margin:27px 0 42px}.mode-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.mode-card{min-height:156px;border:1px solid var(--line);border-radius:var(--radius);background:rgba(255,253,247,.72);padding:28px;display:flex;align-items:center;gap:22px;text-align:left;box-shadow:0 1px 0 rgba(255,255,255,.8) inset;transition:transform .2s ease,box-shadow .2s ease,border-color .2s}.mode-card:hover{transform:translateY(-4px);box-shadow:var(--shadow);border-color:rgba(49,95,76,.28)}.mode-card.online{background:var(--green);color:var(--white);border-color:var(--green)}.mode-icon{width:78px;height:78px;flex:0 0 78px;border-radius:21px;background:rgba(49,95,76,.09);display:grid;place-items:center}.online .mode-icon{background:rgba(255,255,255,.1)}.mode-icon svg{width:50px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.mode-copy{display:flex;flex-direction:column;gap:5px}.mode-copy small{font:600 11px ui-monospace,monospace;letter-spacing:.08em;text-transform:uppercase;opacity:.7}.mode-copy strong{font:500 26px Georgia,serif}.mode-copy span{color:var(--muted);font-size:14px;line-height:1.35}.online .mode-copy span{color:rgba(255,255,255,.68)}.arrow{margin-left:auto;font-size:28px;transition:transform .2s}.mode-card:hover .arrow{transform:translateX(4px)}.feature-strip{display:grid;grid-template-columns:repeat(4,1fr);margin-top:38px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.feature-strip>div{display:flex;align-items:center;gap:12px;padding:19px 12px;border-right:1px solid var(--line)}.feature-strip>div:last-child{border:0}.feature-strip b{font:500 26px Georgia,serif;color:var(--green)}.feature-strip span{font-size:12px;line-height:1.35;color:var(--muted)}.back-button,.text-button{border:0;background:none;color:var(--green);font-weight:800;padding:10px 0}.online-view,.lobby-view{max-width:1050px;margin:auto;padding:42px 28px 70px}.section-heading{margin:35px 0}.section-heading h2,.lobby-card h2,.modal h2{font:500 clamp(38px,5vw,58px)/1 Georgia,serif;margin:0 0 15px}.section-heading>p:last-child{color:var(--muted)}.online-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.panel{position:relative;background:rgba(255,253,247,.75);border:1px solid var(--line);border-radius:var(--radius);padding:34px;min-height:260px}.panel .step{font:500 46px Georgia,serif;color:rgba(49,95,76,.17);position:absolute;right:28px;top:22px}.panel h3,.public-lobbies h3{font:500 26px Georgia,serif;margin:25px 0 10px}.panel p{color:var(--muted);line-height:1.5;max-width:370px}.primary-button,.secondary-button,.danger-button{min-height:50px;border-radius:14px;border:0;padding:0 22px;font-weight:800;transition:transform .15s,filter .15s}.primary-button{background:var(--green);color:white}.primary-button:hover{filter:brightness(1.08);transform:translateY(-1px)}.secondary-button{background:#e7dfd0}.danger-button{background:#f4dddd;color:#8c3030}.wide{width:100%}.create-panel .primary-button{margin-top:19px}.join-row{display:flex;gap:10px}.join-row input{min-width:0;flex:1;text-transform:uppercase;letter-spacing:.15em;font-weight:800}.panel label,.modal label>span,.field-group>span{display:block;font-weight:800;font-size:13px;margin-bottom:8px}.panel input,.modal input,.modal select{width:100%;min-height:50px;border:1px solid var(--line);border-radius:13px;background:var(--white);padding:0 15px}.public-lobbies{margin-top:36px}.list-title{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.lobby-list{display:grid;gap:10px;padding-top:14px}.lobby-row{display:flex;align-items:center;gap:16px;border:1px solid var(--line);background:rgba(255,253,247,.65);border-radius:16px;padding:15px 18px}.lobby-row strong{font:600 20px ui-monospace,monospace;letter-spacing:.1em}.lobby-row span{color:var(--muted);font-size:13px}.lobby-row button{margin-left:auto}.empty-state{color:var(--muted);text-align:center;padding:28px}.lobby-card{max-width:620px;margin:20px auto;background:rgba(255,253,247,.78);border:1px solid var(--line);border-radius:30px;padding:45px;box-shadow:var(--shadow);text-align:center}.room-code{border:0;background:none;margin:14px auto 25px;display:flex;flex-direction:column;gap:8px}.room-code span{font:700 clamp(44px,8vw,72px)/1 ui-monospace,monospace;letter-spacing:.16em;color:var(--green)}.room-code small{color:var(--muted)}.lobby-players{display:grid;gap:8px;margin:20px 0}.lobby-player{display:flex;align-items:center;gap:12px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;text-align:left}.player-swatch{width:18px;height:18px;clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}.lobby-player small{margin-left:auto;color:var(--muted)}.lobby-options{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:20px 0}.option-chip{background:var(--paper);border-radius:999px;padding:7px 11px;font-size:12px}.waiting-note{font-size:13px;color:var(--muted)}.game-view{height:calc(100vh - 86px);height:calc(100dvh - 86px);display:flex;flex-direction:column;overflow:hidden;background:#ded4bf}.game-topbar{height:70px;flex:0 0 70px;background:rgba(255,253,247,.92);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 18px;gap:14px}.turn-players{display:flex;gap:8px;overflow:auto;scrollbar-width:none;flex:1}.turn-player{display:flex;align-items:center;gap:8px;border:1px solid transparent;border-radius:999px;padding:7px 11px;white-space:nowrap;font-size:12px;color:var(--muted)}.turn-player.active{border-color:var(--line);background:white;color:var(--ink);font-weight:800}.turn-player.eliminated{opacity:.38;text-decoration:line-through}.turn-player i{width:12px;height:12px;border-radius:50%}.round-badge{display:flex;align-items:baseline;gap:6px;padding:0 12px;border-left:1px solid var(--line)}.round-badge small{color:var(--muted)}.round-badge strong{font-size:22px}.game-menu-button{width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:white;font-weight:900}.game-layout{position:relative;flex:1;min-height:0}.map-stage{position:absolute;inset:0;overflow:hidden;background:radial-gradient(circle at 50% 45%,#eee6d5,#d8ccb5)}#gameMap{width:100%;height:100%;touch-action:none;user-select:none}.hex-cell{cursor:pointer;transition:filter .12s}.hex-cell:hover .hex-shape{filter:brightness(1.06)}.hex-shape{stroke:rgba(43,51,44,.12);stroke-width:.45;vector-effect:non-scaling-stroke;transition:stroke .14s,filter .14s}.hex-cell.selected .hex-shape{stroke:#fff;stroke-width:4}.hex-cell.target .hex-shape{stroke:#25312c;stroke-width:3;stroke-dasharray:5 3}.hex-cell.hidden .hex-shape{fill:#b8b2a5}.hex-icon{pointer-events:none}.economy-card,.event-card{position:absolute;top:18px;z-index:4;background:rgba(255,253,247,.9);backdrop-filter:blur(12px);border:1px solid rgba(37,49,44,.12);border-radius:18px;box-shadow:0 10px 30px rgba(38,45,39,.12)}.economy-card{left:18px;width:175px;padding:14px}.economy-card>div{display:flex;justify-content:space-between;padding:7px 2px;border-bottom:1px solid var(--line);font-size:13px}.economy-card span{color:var(--muted)}.economy-card p{margin:11px 0 0;font-size:12px;font-weight:800;color:var(--green)}.positive{color:#408d60}.negative{color:var(--red)}.event-card{right:18px;width:220px;padding:16px}.event-card h3{font:500 18px Georgia,serif;margin:0 0 10px}.event-card p{font-size:11px;color:var(--muted);line-height:1.35;margin:0;padding:7px 0;border-top:1px solid var(--line)}.map-loader{position:absolute;inset:0;display:grid;place-content:center;gap:12px;text-align:center;font-size:13px;color:var(--muted);background:#e4dac7}.map-loader span{width:32px;height:32px;border:3px solid rgba(49,95,76,.15);border-top-color:var(--green);border-radius:50%;animation:spin .8s linear infinite;margin:auto}@keyframes spin{to{transform:rotate(360deg)}}.action-dock{height:92px;flex:0 0 92px;background:rgba(255,253,247,.96);border-top:1px solid var(--line);display:flex;align-items:center;justify-content:center;gap:14px;padding:9px 18px;position:relative;z-index:8}.dock-group{display:flex;gap:6px;align-items:end;position:relative;padding-top:17px}.dock-group>small{position:absolute;top:0;left:3px;text-transform:uppercase;font:700 9px ui-monospace,monospace;color:var(--muted);letter-spacing:.1em}.dock-group button{width:54px;height:57px;border:1px solid var(--line);border-radius:12px;background:white;display:grid;place-items:center;padding:4px;transition:.15s}.dock-group button:hover,.dock-group button.active{border-color:var(--green);background:#eef2dc;transform:translateY(-2px)}.dock-group button>span{font-size:10px;color:var(--muted)}.unit{width:25px;height:25px;border-radius:50%;display:grid;place-items:center;background:var(--green);color:#fff;font-style:normal;font-size:11px;font-weight:900;border:2px solid var(--gold)}.u2{border-width:3px}.u3{border-style:double;border-width:4px}.u4{background:#263b34;box-shadow:0 0 0 2px var(--gold)}.building{width:27px;height:25px;display:block;position:relative}.building.farm:before{content:"";position:absolute;left:3px;right:3px;bottom:1px;height:15px;background:var(--gold);clip-path:polygon(50% 0,100% 45%,88% 45%,88% 100%,12% 100%,12% 45%,0 45%)}.building.tower:before,.building.fort:before{content:"";position:absolute;inset:3px 5px 0;background:var(--green);clip-path:polygon(0 0,25% 0,25% 20%,45% 20%,45% 0,65% 0,65% 20%,100% 20%,100% 100%,0 100%)}.building.fort:before{inset:0 2px;background:#263b34}.dock-separator{height:52px;width:1px;background:var(--line)}.end-turn-button{height:58px;border:0;border-radius:15px;background:var(--green);color:white;padding:0 18px;display:flex;align-items:center;gap:18px;font-weight:800}.end-turn-button:disabled{opacity:.45;cursor:not-allowed}.end-turn-button b{font-size:24px}.modal-backdrop{position:fixed;inset:0;background:rgba(30,38,34,.48);backdrop-filter:blur(8px);display:grid;place-items:center;padding:18px;z-index:100;overflow:auto}.modal{position:relative;background:var(--paper);border:1px solid rgba(255,255,255,.5);border-radius:28px;width:min(100%,650px);padding:38px;box-shadow:0 30px 90px rgba(21,29,25,.3);animation:modal-in .25s ease both}@keyframes modal-in{from{opacity:0;transform:scale(.97) translateY(8px)}to{opacity:1;transform:none}}.modal-close{position:absolute;right:18px;top:18px;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:transparent;font-size:25px}.guest-modal{width:min(100%,480px);text-align:center}.guest-modal>p:not(.eyebrow){color:var(--muted);line-height:1.5}.guest-modal form{text-align:left;margin-top:24px}.guest-modal .primary-button{margin-top:12px}.mini-map{height:82px;width:100px;margin:0 auto 25px;position:relative}.mini-map i{position:absolute;width:34px;height:39px;background:var(--green);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)}.mini-map i:nth-child(1){left:33px;top:0}.mini-map i:nth-child(2){left:0;top:20px;background:var(--gold)}.mini-map i:nth-child(3){left:66px;top:20px;background:#ef7189}.mini-map i:nth-child(4){left:33px;top:40px;background:#669be8}.mini-map i:nth-child(5){left:0;top:60px;background:#c7d56c}.mini-map i:nth-child(6){left:66px;top:60px;background:#53c4bd}.mini-map i:nth-child(7){left:33px;top:80px;background:#9b7ad9}.field-group{margin:24px 0}.segmented{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.segmented label{position:relative;border:1px solid var(--line);border-radius:14px;padding:13px;cursor:pointer}.segmented input{position:absolute;opacity:0}.segmented label:has(input:checked){border-color:var(--green);background:#e9edd7;box-shadow:0 0 0 1px var(--green)}.segmented b,.segmented small{display:block}.segmented small{color:var(--muted);font-size:10px;margin-top:3px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.form-grid label>span{margin-bottom:7px}.toggle-label{grid-column:1/-1;display:flex!important;align-items:center;justify-content:space-between;border:1px solid var(--line);border-radius:14px;padding:12px 14px}.toggle-label span{margin:0!important}.toggle-label small{display:block;color:var(--muted);font-weight:400}.toggle-label input{position:absolute;opacity:0}.toggle-label i{width:48px;height:28px;border-radius:999px;background:#c9c4b9;position:relative}.toggle-label i:after{content:"";position:absolute;width:22px;height:22px;left:3px;top:3px;border-radius:50%;background:white;transition:.2s}.toggle-label input:checked+i{background:var(--green)}.toggle-label input:checked+i:after{transform:translateX(20px)}.options-modal .primary-button{margin-top:22px}.rules-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.rules-grid article{border:1px solid var(--line);border-radius:16px;padding:18px}.rules-grid article>b{font:500 24px Georgia,serif;color:var(--gold)}.rules-grid h3{font:500 20px Georgia,serif;margin:8px 0}.rules-grid p{color:var(--muted);font-size:13px;line-height:1.45}.game-menu-modal{max-width:420px}.game-menu-modal h2{margin-bottom:25px}.game-menu-modal button+button{margin-top:10px}.result-modal{text-align:center;max-width:450px}.result-emblem{font-size:70px;color:var(--gold)}.toast{position:fixed;left:50%;bottom:24px;z-index:200;transform:translate(-50%,30px);opacity:0;background:#26342e;color:white;border-radius:12px;padding:12px 18px;box-shadow:var(--shadow);pointer-events:none;transition:.25s;font-weight:700;font-size:13px}.toast.show{transform:translate(-50%,0);opacity:1}
@media(max-width:800px){.site-header{height:68px;padding:0 16px}.brand small{display:none}main{min-height:calc(100dvh - 68px)}.home-view{padding:38px 16px}.hero h1{font-size:clamp(45px,14vw,68px)}.hero-copy{margin:22px 0 30px}.mode-grid,.online-grid{grid-template-columns:1fr}.mode-card{min-height:132px;padding:20px;gap:15px}.mode-icon{width:60px;height:60px;flex-basis:60px}.mode-icon svg{width:40px}.mode-copy strong{font-size:22px}.feature-strip{grid-template-columns:1fr 1fr}.feature-strip>div:nth-child(2){border-right:0}.feature-strip>div:nth-child(-n+2){border-bottom:1px solid var(--line)}.online-view,.lobby-view{padding:24px 16px 50px}.panel{padding:25px}.lobby-card{padding:28px 18px}.game-view{height:calc(100dvh - 68px)}.game-topbar{height:60px;flex-basis:60px;padding:0 8px}.turn-player{padding:6px 8px}.turn-player span{max-width:70px;overflow:hidden;text-overflow:ellipsis}.round-badge{padding:0 7px}.round-badge small{display:none}.game-layout{padding-bottom:0}.economy-card{left:8px;top:8px;width:auto;display:flex;padding:7px 9px;gap:8px}.economy-card>div{display:block;border:0;padding:0 7px;border-right:1px solid var(--line)}.economy-card span{font-size:9px;display:block}.economy-card strong{font-size:13px}.economy-card p{display:none}.event-card{display:none}.action-dock{height:104px;flex-basis:104px;justify-content:flex-start;overflow-x:auto;padding:8px;gap:8px}.dock-group button{width:46px;height:55px}.dock-separator{display:none}.end-turn-button{position:sticky;right:0;min-width:60px;padding:0 13px;margin-left:auto}.end-turn-button span{display:none}.end-turn-button b{font-size:28px}.modal{padding:30px 20px;border-radius:22px}.modal h2{font-size:38px}.form-grid,.rules-grid{grid-template-columns:1fr}.segmented{gap:5px}.segmented label{padding:10px 7px}.room-code span{font-size:48px}.join-row{flex-direction:column}.lobby-row{gap:9px}.lobby-row span{display:none}}
@media(max-width:370px){.mode-copy span{display:none}.mode-card{min-height:112px}.mode-icon{width:52px;height:52px;flex-basis:52px}.feature-strip span{font-size:11px}.guest-chip{padding:0 10px}.guest-chip #guestName{max-width:85px;overflow:hidden;text-overflow:ellipsis}.dock-group button{width:43px}.action-dock{padding-left:5px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.theme-button .moon-icon{display:none}.five-sizes{grid-template-columns:repeat(5,1fr)}.five-sizes label{padding:13px 9px}.options-modal{width:min(100%,760px)}
:root[data-theme="dark"]{--paper:#151d19;--paper-2:#0d1411;--ink:#edf1eb;--muted:#a7b1aa;--line:rgba(237,241,235,.14);--green:#78aa90;--green-2:#56816c;--white:#202b25;--shadow:0 20px 60px rgba(0,0,0,.38)}
:root[data-theme="dark"] body{background:radial-gradient(circle at 12% 6%,rgba(120,170,144,.12),transparent 28%),linear-gradient(135deg,var(--paper),#101814 60%,var(--paper-2))}:root[data-theme="dark"] .theme-button .sun-icon{display:none}:root[data-theme="dark"] .theme-button .moon-icon{display:block}
:root[data-theme="dark"] .icon-button,:root[data-theme="dark"] .guest-chip,:root[data-theme="dark"] .mode-card,:root[data-theme="dark"] .panel,:root[data-theme="dark"] .lobby-row,:root[data-theme="dark"] .lobby-card{background:rgba(31,43,36,.78)}
:root[data-theme="dark"] .mode-card.online,:root[data-theme="dark"] .primary-button,:root[data-theme="dark"] .end-turn-button{background:#416e59;color:#fff}:root[data-theme="dark"] .secondary-button{background:#34433b}:root[data-theme="dark"] .danger-button{background:#4b292b;color:#ffb6b6}
:root[data-theme="dark"] .game-view{background:#111713}:root[data-theme="dark"] .game-topbar,:root[data-theme="dark"] .action-dock{background:rgba(23,32,27,.96)}:root[data-theme="dark"] .turn-player.active,:root[data-theme="dark"] .game-menu-button,:root[data-theme="dark"] .dock-group button{background:#25332b}:root[data-theme="dark"] .dock-group button:hover,:root[data-theme="dark"] .dock-group button.active{background:#31493d}
:root[data-theme="dark"] .map-stage{background:radial-gradient(circle at 50% 45%,#253129,#101713)}:root[data-theme="dark"] .map-loader{background:#18221c}:root[data-theme="dark"] .economy-card,:root[data-theme="dark"] .event-card{background:rgba(22,31,26,.9)}
:root[data-theme="dark"] .modal{background:#19221d;border-color:rgba(255,255,255,.09)}:root[data-theme="dark"] .panel input,:root[data-theme="dark"] .modal input,:root[data-theme="dark"] .modal select{background:#202c25;color:var(--ink)}:root[data-theme="dark"] .option-chip{background:#25332b}:root[data-theme="dark"] .segmented label:has(input:checked){background:#2d493a}:root[data-theme="dark"] .hex-cell.selected .hex-shape{stroke:#fff}:root[data-theme="dark"] .hex-cell.target .hex-shape{stroke:#f2e8d6}
@media(max-width:800px){.five-sizes{grid-template-columns:repeat(2,1fr)}.five-sizes label:last-child{grid-column:1/-1}.theme-button{flex:0 0 44px}.header-actions{gap:6px}.guest-chip{padding:0 10px}.guest-chip #guestName{display:block;max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}}
.map-stage{isolation:isolate;background:radial-gradient(ellipse at 48% 42%,#78b8ba 0,#548f9c 48%,#356f80 100%)}.map-stage:before{content:"";position:absolute;inset:-20%;z-index:0;pointer-events:none;opacity:.42;background:radial-gradient(ellipse at 20% 30%,transparent 0 22%,rgba(224,249,242,.32) 22.5% 23%,transparent 23.5%),radial-gradient(ellipse at 70% 65%,transparent 0 18%,rgba(216,246,240,.24) 18.5% 19%,transparent 19.5%);background-size:170px 90px,230px 120px;animation:sea-drift 18s linear infinite}.map-stage:after{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(115deg,rgba(255,255,255,.12),transparent 38%,rgba(22,76,91,.12) 72%,transparent)}#gameMap{position:relative;z-index:1}.coast-outline{fill:none;stroke:#c9e4d8;stroke-width:8;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}:root[data-theme="dark"] .coast-outline{stroke:#416a67}.map-loader{z-index:3;background:#5b9299;color:rgba(255,255,255,.82)}
:root[data-theme="dark"] .map-stage{background:radial-gradient(ellipse at 48% 42%,#285962 0,#173e49 52%,#0b2732 100%)}:root[data-theme="dark"] .map-stage:before{opacity:.28;background-image:radial-gradient(ellipse at 20% 30%,transparent 0 22%,rgba(122,193,190,.3) 22.5% 23%,transparent 23.5%),radial-gradient(ellipse at 70% 65%,transparent 0 18%,rgba(100,170,176,.22) 18.5% 19%,transparent 19.5%)}:root[data-theme="dark"] .map-loader{background:#173e49}
@keyframes sea-drift{to{background-position:170px 90px,230px 120px}}
@media(prefers-reduced-motion:reduce){.map-stage:before{animation:none}}
.game-active .site-header{height:60px;padding-top:0;padding-bottom:0}.game-active .brand-mark{transform:scale(.82)}.game-active main{min-height:calc(100dvh - 60px)}.game-active .game-view{height:calc(100dvh - 60px)}.game-active .game-topbar{height:52px;flex-basis:52px}.game-active .action-dock{height:76px;flex-basis:76px;padding-top:4px;padding-bottom:4px}.game-active .dock-group{padding-top:13px}.game-active .dock-group button{height:52px}.game-active .end-turn-button{height:52px}
.dock-group button{box-shadow:0 3px 10px rgba(33,53,44,.12),inset 0 1px rgba(255,255,255,.6)}.dock-group button:active{transform:scale(.96)}.unit{width:29px;height:29px;font-size:12px;background:linear-gradient(145deg,#4ab99a,#23745f);border-color:#ffe071;box-shadow:0 3px 7px rgba(24,78,64,.3)}.unit.u2{background:linear-gradient(145deg,#62a9e8,#326fba)}.unit.u3{background:linear-gradient(145deg,#a67bd7,#7249aa)}.unit.u4{background:linear-gradient(145deg,#5f4c73,#30263c);border-color:#ffcf49;box-shadow:0 0 0 2px #765f35,0 4px 9px rgba(30,20,39,.4)}.building{width:30px;height:29px;filter:drop-shadow(0 3px 2px rgba(49,54,34,.25))}.building.farm:before{background:linear-gradient(145deg,#ffe06c,#d69d2b)}.building.tower:before{background:linear-gradient(145deg,#55a98b,#2d6a55)}.building.fort:before{background:linear-gradient(145deg,#745b91,#40334f)}
.map-piece{filter:drop-shadow(0 2px 1.5px rgba(17,38,31,.38))}
.piece-shadow{fill:rgba(19,40,36,.25);filter:blur(.4px)}
.home-beacon{pointer-events:none;fill:none;stroke:#fff8a8;stroke-width:4;vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center;animation:home-beacon 1.35s ease-in-out 6}.hex-cell.located .hex-shape{animation:located-base .75s ease-in-out 3;transform-box:fill-box;transform-origin:center}@keyframes home-beacon{0%,100%{opacity:.3;transform:scale(.78)}50%{opacity:1;transform:scale(1.2)}}@keyframes located-base{0%,100%{filter:brightness(1)}50%{filter:brightness(1.45);stroke:#fff8a8;stroke-width:5}}.turn-player{font-family:inherit;background:transparent;cursor:pointer}.turn-player:active{transform:scale(.97)}
@media(max-width:800px){.game-active .site-header{height:50px;padding:0 8px}.game-active .brand{gap:5px}.game-active .brand-mark{width:30px;transform:scale(.68);transform-origin:left center}.game-active .brand strong{font-size:13px}.game-active .icon-button,.game-active .guest-chip{min-height:44px}.game-active main{min-height:calc(100dvh - 50px)}.game-active .game-view{height:calc(100dvh - 50px)}.game-active .game-topbar{height:46px;flex-basis:46px;padding:0 5px;gap:4px}.game-active .turn-players{gap:2px}.game-active .turn-player{padding:4px 6px;font-size:10px}.game-active .turn-player i{width:9px;height:9px}.game-active .round-badge{padding:0 4px}.game-active .round-badge strong{font-size:17px}.game-active .game-menu-button{width:44px;height:44px}.game-active .economy-card{top:5px;left:5px;padding:4px 5px}.game-active .action-dock{height:62px;flex-basis:62px;display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:0;padding:4px;overflow:hidden}.game-active .dock-group{display:contents;padding:0}.game-active .dock-group>small,.game-active .dock-separator{display:none}.game-active .dock-group button{width:100%;min-width:0;height:54px;border-radius:10px;padding:2px}.game-active .dock-group button>span{font-size:8px;line-height:9px}.game-active .unit{width:27px;height:27px}.game-active .building{width:27px;height:26px}.game-active .end-turn-button{position:static;width:100%;min-width:0;height:54px;margin:0;padding:0;display:grid;place-items:center;border-radius:10px}.game-active .end-turn-button b{font-size:25px}.game-active .end-turn-button span{display:none}}

/* Two-button game control and expandable creation center. */
.game-view{position:relative}.action-dock{position:absolute;left:0;right:0;bottom:0;height:72px;flex:0 0 72px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:7px max(12px,env(safe-area-inset-right)) max(7px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));overflow:visible;background:transparent;border:0;pointer-events:none}
.create-action-button,.end-turn-button{pointer-events:auto;height:58px;border:1px solid rgba(255,255,255,.34);box-shadow:0 8px 24px rgba(20,43,37,.26),inset 0 1px rgba(255,255,255,.2)}
.create-action-button{grid-column:2;border-radius:18px;background:linear-gradient(145deg,#3b8068,#245944);color:#fff;display:flex;align-items:center;gap:9px;padding:5px 16px 5px 7px;font-size:12px;font-weight:900;letter-spacing:.02em}
.create-action-button:hover,.create-action-button[aria-expanded="true"]{filter:brightness(1.1);transform:translateY(-2px)}
.create-action-button:disabled,.end-turn-button:disabled{opacity:.45;cursor:not-allowed}.create-action-button.has-tool{box-shadow:0 0 0 3px #f5df73,0 8px 24px rgba(20,43,37,.3)}
.create-action-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:14px;background:rgba(255,255,255,.12)}
.create-action-icon svg{width:39px;height:39px;fill:rgba(199,213,108,.2);stroke:#e9f19b;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.end-turn-button{grid-column:3;justify-self:end;margin:0;min-width:156px;background:linear-gradient(145deg,#d7aa47,#a97624);border-radius:18px;padding:0 18px;color:#fff}
.end-turn-button b{width:34px;height:34px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.14)}
.creation-panel{pointer-events:auto;position:absolute;left:50%;bottom:76px;transform:translateX(-50%);width:min(680px,calc(100vw - 24px));max-height:min(600px,calc(100dvh - 180px));overflow:auto;background:rgba(246,241,229,.97);border:1px solid rgba(255,255,255,.62);border-radius:24px;padding:15px;box-shadow:0 24px 70px rgba(13,32,27,.35);backdrop-filter:blur(18px);animation:creation-in .2s ease both}
@keyframes creation-in{from{opacity:0;transform:translateX(-50%) translateY(12px) scale(.98)}to{opacity:1;transform:translateX(-50%)}}
.creation-panel-head{display:flex;align-items:center;justify-content:space-between;padding:2px 2px 12px;border-bottom:1px solid var(--line)}
.creation-panel-head div{display:flex;flex-direction:column;gap:2px}.creation-panel-head small{font:700 9px ui-monospace,monospace;letter-spacing:.13em;text-transform:uppercase;color:var(--green)}.creation-panel-head strong{font:500 23px Georgia,serif}
.creation-panel-head button{width:42px;height:42px;border:1px solid var(--line);border-radius:13px;background:rgba(255,255,255,.64);font-size:25px}
.creation-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:12px}.creation-column{min-width:0;display:grid;gap:7px;align-content:start}.creation-column+ .creation-column{border-left:1px solid var(--line);padding-left:12px}.creation-column h3{margin:0 0 2px;padding-left:4px;font:800 11px ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.creation-column button{min-width:0;height:68px;border:1px solid var(--line);border-radius:15px;background:rgba(255,255,255,.72);padding:4px 8px 4px 3px;display:flex;align-items:center;text-align:left;gap:5px;transition:transform .14s,border-color .14s,background .14s}
.creation-column button:hover,.creation-column button.active{border-color:#3c8169;background:#edf2dc;transform:translateY(-1px)}.creation-column button:disabled{opacity:.42;cursor:not-allowed}.creation-column button>span{min-width:0;display:flex;flex-direction:column;gap:3px}.creation-column button b{font-size:12px;line-height:1.05;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.creation-column button small{font-size:10px;color:var(--muted)}
.creation-mini{width:55px;height:55px;flex:0 0 55px;overflow:visible;filter:drop-shadow(0 3px 2px rgba(25,47,39,.25))}.creation-mini ellipse{fill:rgba(22,43,37,.22)}.soldier{stroke:#26353a;stroke-width:1.6;stroke-linejoin:round}.soldier .armor{fill:#319178}.soldier .light{fill:#70ccb4;stroke:none;opacity:.55}.soldier rect{fill:#26353a}.soldier .visor{fill:none;stroke:#91f6e5;stroke-width:3;stroke-linecap:round}.soldier .accent{fill:#ffd25b}.soldier.s2 .armor{fill:#397fc2}.soldier.s2 .light{fill:#79bced}.soldier.s3 .armor{fill:#8055b1}.soldier.s3 .light{fill:#bd91e4}.soldier.s4 .armor{fill:#443650}.soldier.s4 .light{fill:#836d96}.soldier .crown{fill:none;stroke:#ffd25b;stroke-width:2.5}
.structure{stroke:#293a3c;stroke-width:1.5;stroke-linejoin:round}.structure .base{fill:#42575d}.structure .panel{fill:#397184}.structure .core{fill:#ffe16d}.structure .core-side{fill:#d39831}.structure .body{fill:#4f987d}.structure .top{fill:#72b99f}.structure .barrel{fill:none;stroke:#273b3b;stroke-width:4;stroke-linecap:round}.stronghold .body{fill:#715889}.stronghold .light{fill:#9a7ab6}.stronghold .base{fill:#44394f}
:root[data-theme="dark"] .action-dock{background:transparent}:root[data-theme="dark"] .creation-panel{background:rgba(24,34,29,.97);border-color:rgba(255,255,255,.12)}:root[data-theme="dark"] .creation-column button,:root[data-theme="dark"] .creation-panel-head button{background:#27372f}:root[data-theme="dark"] .creation-column button:hover,:root[data-theme="dark"] .creation-column button.active{background:#344c40}:root[data-theme="dark"] .piece-shadow{fill:rgba(0,0,0,.38)}
@media(max-width:800px){.game-active .action-dock{height:68px;flex-basis:68px;display:grid;grid-template-columns:1fr auto 1fr;gap:0;padding:5px 7px max(5px,env(safe-area-inset-bottom));overflow:visible}.game-active .create-action-button{grid-column:2;width:auto;height:56px;border-radius:17px;padding:5px 12px 5px 6px}.game-active .create-action-icon{width:44px;height:44px}.game-active .create-action-button>span:last-child{font-size:11px}.game-active .end-turn-button{grid-column:3;justify-self:end;width:56px;min-width:56px;height:56px;border-radius:17px;padding:0}.game-active .end-turn-button b{font-size:27px}.creation-panel{bottom:71px;width:calc(100vw - 12px);max-height:calc(100dvh - 170px);border-radius:20px;padding:11px}.creation-panel-head{padding-bottom:9px}.creation-panel-head strong{font-size:20px}.creation-columns{gap:8px;padding-top:9px}.creation-column+ .creation-column{padding-left:8px}.creation-column button{height:62px;padding:2px 3px;gap:1px}.creation-mini{width:46px;height:50px;flex-basis:46px}.creation-column button b{font-size:10px}.creation-column button small{font-size:9px}.creation-column h3{font-size:9px}}
@media(max-width:370px){.game-active .create-action-button>span:last-child{display:none}.game-active .create-action-button{padding:5px}.creation-panel{width:calc(100vw - 8px);padding:8px}.creation-column button{height:59px}.creation-mini{width:41px;flex-basis:41px}.creation-column button b{font-size:9px}}
.hex-shape{stroke:rgba(43,51,44,.08);stroke-width:.3}
.game-menu-player{display:flex;align-items:center;gap:8px;margin:0 0 14px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;color:var(--muted);font-size:12px}.game-menu-player strong{margin-left:auto;color:var(--ink);font-size:14px}
.game-active .site-header{display:none}.game-active main{min-height:100dvh}.game-active .game-view{height:100dvh}.game-active .game-topbar{position:absolute;z-index:12;top:0;left:0;right:0;height:54px;flex-basis:auto;background:linear-gradient(180deg,rgba(246,241,229,.72),rgba(246,241,229,.18) 72%,transparent);border:0;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px)}.game-active .game-layout{height:100%;flex:1}.game-active .economy-card{top:58px}:root[data-theme="dark"] .game-active .game-topbar{background:linear-gradient(180deg,rgba(18,28,23,.72),rgba(18,28,23,.18) 72%,transparent)}
@media(max-width:800px){.game-active main{min-height:100dvh}.game-active .game-view{height:100dvh}.game-active .game-topbar{height:48px;flex-basis:auto;background:linear-gradient(180deg,rgba(246,241,229,.64),rgba(246,241,229,.12) 75%,transparent);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}.game-active .economy-card{top:51px}:root[data-theme="dark"] .game-active .game-topbar{background:linear-gradient(180deg,rgba(18,28,23,.68),rgba(18,28,23,.12) 75%,transparent)}}
.creation-mini.soldier{stroke:#18282e;stroke-width:1.7}.creation-mini.soldier .armor{fill:#34464d}.creation-mini.soldier .plate{fill:#1e2e34}.creation-mini.soldier .leg,.creation-mini.soldier .antenna{fill:none;stroke:#1a2a30;stroke-width:3;stroke-linecap:round}.creation-mini.soldier .shoulder{fill:#4b5f66}.creation-mini.soldier .visor{fill:#61ead8;stroke:#c4fff7;stroke-width:1}.creation-mini.soldier .ai-core,.creation-mini.soldier .signal{fill:#63f3df;stroke:#d5fff9;stroke-width:1;filter:drop-shadow(0 0 3px #4ff3da)}.creation-mini.soldier .circuit{fill:none;stroke:#69e8d8;stroke-width:1.5}.creation-mini.soldier.s2 .plate{fill:#263b49}.creation-mini.soldier.s2 .ai-core{fill:#62bfff}.creation-mini.soldier.s3 .plate{fill:#333148}.creation-mini.soldier.s3 .ai-core{fill:#b187ff}.creation-mini.soldier.s4 .armor{fill:#272d35}.creation-mini.soldier.s4 .plate{fill:#3c3548}.creation-mini.soldier.s4 .ai-core{fill:#ffd55f;stroke:#fff3b7;filter:drop-shadow(0 0 4px #ffc940)}
.creation-mini.structure{stroke:#172a30;stroke-width:1.6}.creation-mini.structure .base{fill:#31454d}.creation-mini.structure .body{fill:#344d55}.creation-mini.structure .plate{fill:#1e3037}.creation-mini.structure .panel{fill:#264f61;stroke:#7dc9d9}.creation-mini.structure .core{fill:#65f2df;stroke:#dcfffa;filter:drop-shadow(0 0 4px #4be7d2)}.creation-mini.structure .ring,.creation-mini.structure .energy-beam,.creation-mini.structure .antenna{fill:none;stroke:#65f2df;stroke-width:2}.creation-mini.structure .head{fill:#3d535b}.creation-mini.structure .visor{fill:none;stroke:#65f2df;stroke-width:3;stroke-linecap:round}.creation-mini.structure .network{fill:#243a42;stroke:#72ebdc}.creation-mini.stronghold .body{fill:#343b47}.creation-mini.stronghold .plate{fill:#202832}.creation-mini.stronghold .base{fill:#282f39}
.game-active .economy-card{top:auto;bottom:82px;left:12px;width:auto;display:flex;align-items:center;gap:0;padding:8px 10px;border-radius:16px}.game-active .economy-card>div{min-width:72px;display:block;padding:1px 11px;border:0;border-right:1px solid var(--line)}.game-active .economy-card>div:last-of-type{border-right:0}.game-active .economy-card span{display:block;font-size:10px;font-weight:700;letter-spacing:.02em}.game-active .economy-card strong{display:block;margin-top:2px;font-size:18px;line-height:1.05}.game-active .economy-card p{display:none}
@media(max-width:800px){.game-active .economy-card{top:auto;bottom:75px;left:7px;padding:7px 8px}.game-active .economy-card>div{min-width:59px;padding:1px 8px}.game-active .economy-card span{font-size:10px}.game-active .economy-card strong{font-size:17px}}
.hex-cell.choice-muted{opacity:.58;filter:saturate(.7)}.hex-cell.valid-target .hex-shape{stroke:#b9fff2;stroke-width:3;filter:brightness(1.13) drop-shadow(0 0 5px rgba(75,238,211,.85))}.target-marker{pointer-events:none;fill:rgba(91,241,216,.13);stroke:#8ff7e5;stroke-width:2;stroke-dasharray:4 3;vector-effect:non-scaling-stroke;transform-box:fill-box;transform-origin:center;animation:target-pulse 1.25s ease-in-out infinite}@keyframes target-pulse{0%,100%{opacity:.55;transform:scale(.82)}50%{opacity:1;transform:scale(1.06)}}:root[data-theme="dark"] .hex-cell.choice-muted{opacity:.48}:root[data-theme="dark"] .hex-cell.valid-target .hex-shape{stroke:#72f1dc}
@media(prefers-reduced-motion:reduce){.target-marker{animation:none;opacity:.9}}
.game-theme-button{width:44px;height:44px;flex:0 0 44px;border:1px solid var(--line);border-radius:50%;background:rgba(255,255,255,.72);display:grid;place-items:center;backdrop-filter:blur(8px)}.game-theme-button svg{grid-area:1/1;width:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}:root[data-theme="dark"] .game-theme-button{background:rgba(30,43,36,.82)}
.game-active .economy-card{bottom:7px;height:58px}.game-active .create-action-button,.game-active .end-turn-button{height:58px}
@media(max-width:800px){.game-active .game-theme-button{width:42px;height:42px;flex-basis:42px}.game-active .game-topbar{gap:3px}.game-active .round-badge{padding:0 3px}.game-active .economy-card{left:5px;bottom:6px;width:126px;height:56px;padding:5px 3px;border-radius:16px}.game-active .economy-card>div{min-width:0;width:40px;padding:1px 3px;text-align:center}.game-active .economy-card span{font-size:8px;line-height:10px}.game-active .economy-card strong{font-size:17px;margin-top:3px}.game-active .create-action-button,.game-active .end-turn-button{height:56px}}