body.fortress-page{background:#141c17;color:#e7dfcc;min-height:100svh}.fortress-page:before{display:none}.fortress-page>.header,.fortress-page>footer,.fortress-page .world{display:none}.fortress-page .auth-layout{display:block;width:100%;max-width:none;padding:0;margin:0}.fortress-page #app{display:block;width:100%;max-width:none}.fortress-page button,.fortress-page select{font-family:inherit}.game-topbar{display:flex;align-items:center;gap:22px;min-height:86px;padding:14px 26px;background:#20291ff2;border-bottom:1px solid #71644468;box-shadow:0 6px 24px #0003}.game-brand{display:flex;align-items:center;gap:10px;flex-shrink:0}.game-brand img{object-fit:contain}.game-brand span{max-width:120px;font-family:Georgia,serif;font-size:12px;letter-spacing:.12em;line-height:1.5;color:#dbc18d}.resource-bar{display:grid;grid-template-columns:repeat(5,minmax(105px,1fr));flex:1;gap:7px;max-width:840px;margin:0 auto}.resource-item{display:flex;align-items:center;gap:9px;min-width:0;padding:8px 10px;border:1px solid #8d784c40;border-radius:4px;background:#151d1699;white-space:nowrap}.resource-icon{display:flex;color:#c19c5f;flex:none}.resource-icon svg{width:23px;height:23px}.resource-icon.wood{color:#bda077}.resource-icon.stone{color:#a2ada4}.resource-icon.iron{color:#9badb7}.resource-icon.food{color:#c7b67b}.resource-icon.gold{color:#dfb459}.resource-name{display:block;font-size:10px;color:#a7ae9a;margin-bottom:4px}.resource-item strong{font-size:15px;font-weight:550;line-height:1;font-variant-numeric:tabular-nums}.resource-item small{font-size:9px;color:#7c8b77}.player-menu{display:flex;align-items:center;gap:12px;flex-shrink:0;font-size:12px}.player-menu>span{max-width:105px;overflow:hidden;text-overflow:ellipsis}.quiet-button{background:none;border:0;color:#b1bca7;font-size:12px;padding:9px;cursor:pointer}.quiet-button:hover{color:#e8d19d}.fortress-content{padding:22px 26px 24px;max-width:1800px;margin:0 auto}.fortress-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:20px}.section-kicker,.panel-kicker{font-size:9px;letter-spacing:.16em;color:#a39979;margin:0 0 7px}.fortress-title-row{display:flex;align-items:center;gap:22px}.fortress-title-row h1{font-family:Georgia,serif;font-size:27px;line-height:1.1;margin:0;color:#ead6ae}.fortress-title-row select{width:230px;max-width:100%;padding:9px 30px 9px 12px;color:#d3d5c6;background:#20291e;border:1px solid #5b634b;border-radius:3px;font-size:12px;cursor:pointer}.outline-button{display:inline-flex;justify-content:center;align-items:center;gap:8px;background:#293224;border:1px solid #a0844c7a;color:#e2c38b;padding:10px 14px;border-radius:3px;font-size:12px;cursor:pointer}.outline-button:hover{background:#35422d}.outline-button:disabled{opacity:.6;cursor:wait}.outline-button.primary{background:#ba9454;color:#201f14;border-color:#d0aa67}.fortress-workspace{display:grid;grid-template-columns:minmax(0,1fr) 270px;gap:18px;align-items:start}.map-section{overflow:hidden;border:1px solid #6b62468c;border-radius:5px;background:#1c261c;box-shadow:0 12px 35px #0003}.map-header,.map-footer{height:38px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 16px;background:#222c20;border-bottom:1px solid #70614240;font-size:11px;color:#b5bba6}.map-header>span:first-child,.legend{display:inline-flex;align-items:center;gap:8px}.legend-dot{display:inline-block;width:5px;height:5px;background:#c9a464;transform:rotate(45deg)}.legend-dot.empty{background:none;border:1px solid #a6ab84;width:7px;height:7px}.map-footer{border:0;border-top:1px solid #70614240;font-size:10px;color:#a3ad97}.fortress-board{height:calc(100svh - 268px);min-height:420px;max-height:1100px;position:relative;overflow:hidden;background:#42482d url('/assets/ground.webp') repeat;background-size:500px}.board-canvas{position:absolute;left:50%;top:50%;width:1280px;height:860px;transform-origin:center}.board-fence{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.plot-button{position:absolute;transform:translate(-50%,-65%);width:170px;height:130px;padding:0;border:0;background:none;color:#e6dec1;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;outline-offset:4px}.plot-building{position:absolute;bottom:21px;left:-10px;width:190px;height:190px;object-fit:contain;filter:drop-shadow(0 10px 6px #0007);transition:filter .15s}.plot-button.occupied{height:190px}.plot-foundation{position:relative;display:grid;place-items:center;width:100px;height:62px;transform:rotate(-30deg) skewX(30deg);background:#7469422e;border:2px dashed #c0bd877d;box-shadow:inset 0 0 0 5px #1f2b1a35,0 8px 12px #0002;margin-bottom:17px;transition:background .15s,border-color .15s}.plot-plus{font-size:31px;font-weight:200;color:#d6cf9b;transform:skewX(-30deg) rotate(30deg)}.plot-caption{position:relative;background:#1b271bd9;border:1px solid #b09b644f;border-radius:3px;padding:6px 10px;font-size:12px;line-height:1.2;white-space:nowrap;text-shadow:0 1px #000;box-shadow:0 4px 8px #0003;max-width:190px}.plot-caption b{display:inline-block;font-size:10px;font-weight:500;color:#dec485;border-left:1px solid #a28b4d66;padding-left:7px;margin-left:6px}.plot-button:hover .plot-foundation,.plot-button.selected .plot-foundation{border-color:#e7c87a;background:#c8a75735}.plot-button.selected .plot-caption{border-color:#dfbb6c;color:#f6e1ac}.plot-button:hover .plot-building,.plot-button.selected .plot-building{filter:drop-shadow(0 10px 6px #0007) brightness(1.1)}.plot-panel{background:#222b21;border:1px solid #6b62468c;border-radius:5px;overflow:hidden;padding:22px 20px;min-height:440px}.plot-preview{height:175px;display:flex;align-items:center;justify-content:center;margin:0 -10px 14px;background:radial-gradient(ellipse,#83956718,transparent 70%)}.plot-preview img{width:190px;height:190px;object-fit:contain;filter:drop-shadow(0 10px 5px #0005)}.plot-preview.planned img{opacity:.45;filter:grayscale(.65) drop-shadow(0 10px 5px #0005)}.plot-panel h2{font-family:Georgia,serif;font-size:24px;font-weight:400;color:#ead4aa;margin:0 0 12px;line-height:1.2}.plot-state{display:inline-block;border:1px solid #727c5766;color:#aab497;background:#192319;font-size:10px;padding:5px 8px;border-radius:2px}.plot-state.built{color:#d7bd85;border-color:#a3884a66}.plot-description{font-size:12px;line-height:1.7;color:#aeb69f;margin:18px 0}.plot-note{padding:12px;border-left:2px solid #a7905a66;background:#131e153d;font-size:11px;line-height:1.6;color:#adb396}.panel-footnote{font-size:9px;color:#79876f;letter-spacing:.04em;padding-top:20px}.storage-heading{font-size:11px;color:#d6c28d;border-top:1px solid #62704a55;padding-top:16px;margin-top:18px}.warehouse-name{font-size:10px;margin-top:12px;color:#a5b298}.storage-list{list-style:none;padding:0;margin:8px 0 0}.storage-list li{display:flex;justify-content:space-between;font-size:11px;padding:7px 0;border-bottom:1px solid #7d8b5b22;color:#bac2aa;gap:12px}.storage-list small{color:#77886d;font-size:9px}.fortress-error{font-size:12px;line-height:1.5;color:#f0b4a0;background:#442a23;padding:10px 12px;border:1px solid #955f434d;border-radius:3px;margin:12px 0}.fortress-error[hidden]{display:none}.fortress-loading{min-height:70svh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;font-size:14px;color:#c3bd9b}.fortress-pending .map-section,.fortress-pending .plot-panel{opacity:.65;pointer-events:none}.new-fortress-dialog{width:380px;max-width:calc(100% - 36px);background:#222b21;color:#e7dec4;padding:26px;border:1px solid #a78b566b;border-radius:5px;box-shadow:0 20px 70px #0008}.new-fortress-dialog::backdrop{background:#08100acd}.new-fortress-dialog h2{font-family:Georgia,serif;font-size:25px;font-weight:400;margin:0 0 24px;color:#ead6ad}.new-fortress-dialog label{font-size:12px}.new-fortress-dialog input{height:44px;background:#151f16}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:22px}.fortress-page button:focus-visible,.fortress-page select:focus-visible{outline:2px solid #dfbd73;outline-offset:3px}
@media(max-width:1180px){.game-topbar{gap:12px;padding:12px 18px}.game-brand span{display:none}.resource-bar{gap:5px}.resource-item{min-width:0;padding:7px;gap:6px}.resource-item small{font-size:8px}.player-menu{gap:3px}.fortress-content{padding:20px 18px}.fortress-workspace{grid-template-columns:minmax(0,1fr) 230px;gap:12px}.plot-panel{padding:20px 16px}.resource-bar{grid-template-columns:repeat(5,minmax(90px,1fr))}}
@media(max-width:820px){.game-topbar{flex-wrap:wrap;padding:10px 14px;gap:10px}.game-brand span{display:block;font-size:10px;max-width:none}.game-brand img{width:30px;height:30px}.player-menu{margin-left:auto}.resource-bar{order:3;flex-basis:100%;max-width:none;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px}.resource-item{display:block;text-align:center;padding:7px 3px}.resource-icon{justify-content:center;margin-bottom:4px}.resource-icon svg{width:19px;height:19px}.resource-item strong{font-size:13px}.resource-name{font-size:9px}.resource-item small{display:none}.fortress-content{padding:17px 12px}.fortress-title-row{gap:12px;flex-wrap:wrap}.fortress-title-row h1{font-size:24px}.fortress-title-row select{width:170px}.fortress-toolbar{gap:10px;align-items:flex-end}.fortress-toolbar .outline-button{font-size:10px;padding:9px}.fortress-workspace{display:flex;flex-direction:column}.map-section,.plot-panel{width:100%}.fortress-board{height:55svh;min-height:340px}.plot-panel{min-height:0;position:relative;padding:20px 20px 20px 150px}.plot-preview{position:absolute;left:3px;top:28px;width:140px;height:150px;margin:0}.plot-preview img{width:150px;height:150px}.panel-kicker{margin-bottom:10px}.plot-panel h2{font-size:23px}.map-footer{font-size:9px;padding:0 10px}.map-header{font-size:10px;padding:0 10px}.panel-footnote{padding-top:12px}}

/* Keep plot markers legible over the detailed terrain as the map scales. */
.plot-foundation{width:130px;height:76px;background:#172517ba;border:3px dashed #e1cea0b8;box-shadow:inset 0 0 0 5px #1f2b1a55,0 8px 12px #0004}.plot-plus{color:#f0db9d;font-weight:400}.plot-caption{font-size:var(--plot-label-size,19px);max-width:290px;padding:6px 11px}.plot-caption b{font-size:.8em}.plot-button:hover .plot-foundation,.plot-button.selected .plot-foundation{background:#655a29d9;border-color:#ffe1a0}

/* A single compact resource strip belongs to the map, directly above its terrain. */
.fortress-actions{display:flex;align-items:center;gap:22px}
.map-section>.resource-bar{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));width:100%;max-width:none;gap:0;margin:0;padding:0;min-height:48px;background:linear-gradient(180deg,#293326,#20291e);border-bottom:1px solid #a68b5359}
.resource-bar .resource-item{display:flex;align-items:center;justify-content:center;gap:10px;min-width:0;margin:10px 0;padding:3px 10px;border:0;border-radius:0;background:none;white-space:nowrap}
.resource-bar .resource-item+.resource-item{border-left:1px solid #a58d5438}
.resource-bar .resource-icon{display:flex;justify-content:center;margin:0}
.resource-bar .resource-icon svg{width:22px;height:22px}
.resource-bar .resource-item strong{font-size:15px;font-weight:500;color:#eee2c4;line-height:1.2;font-variant-numeric:tabular-nums}
.fortress-board{height:calc(100svh - 210px)}
@media(max-width:820px){.fortress-actions{flex-direction:column;align-items:flex-end;gap:5px}.fortress-actions .player-menu{margin:0;font-size:11px}.map-section>.resource-bar{min-height:44px}.resource-bar .resource-item{gap:6px;padding:2px 4px;margin:9px 0}.resource-bar .resource-icon svg{width:19px;height:19px}.resource-bar .resource-item strong{font-size:13px}.fortress-board{height:55svh}}
@media(max-width:380px){.resource-bar .resource-item{gap:4px}.resource-bar .resource-item strong{font-size:11px}.resource-bar .resource-icon svg{width:17px;height:17px}.fortress-title-row select{width:155px}.fortress-toolbar{gap:5px}}
/* The fortress uses a complete painted island rather than a repeated ground tile. */
.fortress-page .fortress-board{background:#078dab}
.board-terrain{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;pointer-events:none;user-select:none}
.fortress-page .plot-foundation{background:#3a652ca6;border-color:#e4d29eb5;box-shadow:inset 0 0 0 5px #36552a36,0 7px 10px #13321c30}
.fortress-page .plot-button:hover .plot-foundation,.fortress-page .plot-button.selected .plot-foundation{background:#5e7525bd;border-color:#ffe7aa}
/* Fill the terrain window while keeping all interactive building sprites proportional. */
.fortress-page .board-canvas{width:100%;height:100%}
.fortress-page .plot-button{transform:scale(var(--scene-scale,1)) translate(-50%,-65%);transform-origin:0 0}
/* The town hall is the settlement's main landmark; its ground anchor stays fixed. */
.fortress-page .plot-button.capital .plot-building{width:300px;height:300px;left:-65px;bottom:21px;filter:drop-shadow(0 15px 9px #12220f70)}
.fortress-page .plot-button.capital .plot-caption{border-color:#d7b669;color:#ffe5a6;background:#30351bea;box-shadow:0 3px 12px #0005}
.fortress-page .plot-button.capital:hover .plot-building,.fortress-page .plot-button.capital.selected .plot-building{filter:drop-shadow(0 15px 9px #12220f70) brightness(1.08)}
/* On phones the island is a fixed-size scene viewed through a touch-scroll camera. */
.map-pan-hint{display:none}
@media(max-width:820px){
 .fortress-page .fortress-board{height:calc(100svh - 245px);min-height:340px;max-height:700px;overflow:auto;touch-action:pan-x pan-y;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;overflow-anchor:none}
 .fortress-page .fortress-board::-webkit-scrollbar{display:none}
 .fortress-page .board-canvas{position:relative;left:0;top:0;width:1248px;height:832px;transform:none;transform-origin:0 0}
 .fortress-page .map-footer .legend{display:none}
 .map-pan-hint{display:inline;color:#c4c9aa;white-space:nowrap}
 .fortress-page .map-footer{gap:8px;font-size:9px}
}
/* The play screen starts with one narrow resource strip, with no management header. */
.fortress-page .fortress-content{padding:0;max-width:none;margin:0}
.fortress-page .fortress-workspace{gap:0}
.fortress-page .map-section{border:0;border-radius:0}
.fortress-page .map-section>.resource-bar{min-height:36px;height:36px}
.fortress-page .resource-bar .resource-item{margin:5px 0;padding:2px 8px;gap:8px}
.fortress-page .resource-bar .resource-icon svg{width:19px;height:19px}
.fortress-page .resource-bar .resource-item strong{font-size:13px}
.fortress-page .fortress-board{height:calc(100svh - 74px);max-height:none;min-height:0}
.fortress-page .plot-panel{border-radius:0;border-top:0;border-right:0;min-height:100svh}
@media(max-width:820px){
 .fortress-page .fortress-board{height:calc(100svh - 36px);min-height:0;max-height:none}
 .fortress-page .map-footer{display:none}
 .fortress-page .plot-panel{min-height:0;border-left:0;border-top:1px solid #6b62468c}
 .fortress-page .resource-bar .resource-item{gap:6px;padding:2px 4px}
}
/* Painted resource icons: transparent WebP, including high-density screens. */
.fortress-page .resource-bar .resource-item{margin:4px 0;padding-top:0;padding-bottom:0}
.fortress-page .resource-icon img{display:block;width:24px;height:24px;object-fit:contain;flex:none}
@media(max-width:380px){.fortress-page .resource-icon img{width:22px;height:22px}}
/* Construction is a modal so it works without leaving the mobile map camera. */
.construction-dialog{position:fixed;margin:auto;width:390px;max-width:calc(100vw - 28px);max-height:calc(100svh - 28px);overflow-y:auto;padding:25px;background:linear-gradient(145deg,#293225,#1b261c);color:#e7dec4;border:1px solid #a58a556e;border-radius:6px;box-shadow:0 22px 80px #0009;overscroll-behavior:contain}
.construction-dialog::backdrop{background:#07100bba;backdrop-filter:blur(3px)}
.build-close{position:absolute;right:9px;top:6px;font-size:25px;line-height:1;padding:8px}
.build-preview{height:115px;display:flex;justify-content:center;align-items:center;background:radial-gradient(ellipse,#7b925320,transparent 70%);margin:0 0 9px}
.build-preview img{width:145px;height:145px;object-fit:contain;filter:drop-shadow(0 7px 5px #0005)}
.construction-dialog h2{font:400 26px/1.2 Georgia,serif;color:#ead6ad;margin:10px 0}
.build-description{color:#aeb69f;font-size:12px;line-height:1.6;margin:0 0 20px}
.build-cost-heading{display:flex;justify-content:space-between;font-size:10px;color:#93a087;border-bottom:1px solid #74805c4d;padding-bottom:8px}
.build-costs{list-style:none;padding:0;margin:0}
.build-costs li{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid #72835824;font-size:12px;color:#cbd3b9;font-variant-numeric:tabular-nums}
.cost-resource{display:flex;align-items:center;gap:9px}.cost-resource img{width:26px;height:26px;object-fit:contain}.build-costs strong{font-weight:500;color:#d9c58c}.cost-available{font-size:11px;color:#8da080}.build-costs .shortage strong,.build-costs .shortage .cost-available{color:#eaa290}
.build-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px}.build-actions .primary:disabled{opacity:.45;cursor:not-allowed}
.build-error{font-size:11px;color:#efad95;line-height:1.6;margin:12px 0 0}.build-error[hidden]{display:none}
@media(max-width:420px){.construction-dialog{padding:22px}.build-preview{height:95px}.build-preview img{width:125px;height:125px}.construction-dialog h2{font-size:24px}.build-description{margin-bottom:15px}}
/* The map occupies the whole play screen; plot information uses construction dialogs. */
.fortress-page .fortress-workspace{display:block;width:100%}
.fortress-page .map-section{width:100%}
/* One proportional world and one square camera viewport on every device. */
.fortress-page .fortress-content{min-height:100svh;display:flex;align-items:center;justify-content:center}
.fortress-page .map-section{width:min(1024px,100vw,calc(100svh - 36px));margin:0 auto;box-shadow:0 15px 60px #0006;outline:1px solid #8c84543d}
.fortress-page .fortress-board{width:100%;height:auto;aspect-ratio:1;min-height:0;max-height:none;overflow:auto;touch-action:pan-x pan-y;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;scrollbar-width:none;overflow-anchor:none;cursor:grab;user-select:none;-webkit-user-select:none}
.fortress-page .fortress-board::-webkit-scrollbar{display:none}
.fortress-page .board-canvas{position:relative;left:0;top:0;width:1920px;height:1280px;transform:none;transform-origin:0 0}
.fortress-page .board-terrain{object-fit:contain;pointer-events:none;-webkit-user-drag:none}
.fortress-page .plot-button{cursor:inherit}
.fortress-page .fortress-board.camera-dragging,.fortress-page .fortress-board.camera-dragging .plot-button{cursor:grabbing}
.fortress-page .map-footer{display:none}
/* Ground anchor shared by vacant and occupied plots. */
.fortress-page .plot-button{transform:scale(var(--scene-scale,1)) translate(-50%,-100%)}
.fortress-page .plot-building{left:50%;bottom:-30px;transform:translateX(-50%)}
.fortress-page .plot-button.capital .plot-building{left:50%;bottom:-48px}
.fortress-page .plot-foundation{position:absolute;left:50%;top:100%;margin:0;transform:translate(-50%,-50%) rotate(-30deg) skewX(30deg)}
.fortress-page .plot-caption{position:absolute;left:50%;top:calc(100% + 34px);transform:translateX(-50%)}
/* Compact plot markers; detailed names appear when a site is inspected. */
.fortress-page .plot-foundation{width:100px;height:58px;border-width:2px}
.fortress-page .plot-button.vacant .plot-caption{opacity:1;pointer-events:none}
.fortress-page .plot-button.vacant:hover .plot-caption,.fortress-page .plot-button.vacant:focus-visible .plot-caption,.fortress-page .plot-button.vacant.selected .plot-caption{opacity:1}
/* Layout coordinates now represent the actual center of every building tile. */
.fortress-page .plot-button{transform:scale(var(--scene-scale,1)) translate(-50%,-50%)}
.fortress-page .plot-building,.fortress-page .plot-button.capital .plot-building{left:50%;top:50%;bottom:auto;transform:translate(-50%,-50%)}
.fortress-page .plot-building,.fortress-page .plot-button.capital .plot-building{width:var(--building-size,190px);height:var(--building-size,190px)}
.fortress-page .plot-button.mirrored .plot-building{transform:translate(-50%,-50%) scaleX(-1)}
.fortress-page .plot-button.vacant{width:110px;height:110px}
.fortress-page .plot-foundation{width:88px;height:88px;left:50%;top:50%;transform:translate(-50%,-50%);border:0;background:transparent url('/assets/construction-site.webp') center/contain no-repeat;box-shadow:none;transition:filter .15s}
.fortress-page .plot-plus{transform:none;font-size:24px;font-weight:400;line-height:1;color:#fff3ce;text-shadow:0 1px 3px #503515,0 0 5px #503515;pointer-events:none}
.fortress-page .plot-button:hover .plot-foundation,.fortress-page .plot-button.selected .plot-foundation{background:transparent url('/assets/construction-site.webp') center/contain no-repeat;filter:brightness(1.12) drop-shadow(0 0 4px #ffe2a080)}
.fortress-page .plot-caption{top:calc(50% + 80px)}
.fortress-page .plot-button.occupied .plot-caption{top:calc(50% + 107px)}
.fortress-page .plot-button.capital .plot-caption{top:calc(50% + 162px)}
.fortress-page .plot-button.vacant .plot-caption{top:calc(50% - 48px);transform:translate(-50%,-100%);padding:3px 7px;font-size:calc(var(--plot-label-size,19px)*.8)}
.fortress-page .plot-level{position:absolute;left:calc(50% + var(--level-x,0px));top:calc(50% + var(--level-y,-70px) - 3px);transform:translate(-50%,-100%);min-width:1.8em;padding:.2em .45em;border:1px solid #c6a96c9c;border-radius:3px;background:#1b271beb;color:#ffe3a3;font-size:calc(var(--plot-label-size,19px)*.8);font-weight:600;line-height:1.2;text-align:center;text-shadow:0 1px #000;box-shadow:0 2px 5px #0004;pointer-events:none}
