:root{font-family:system-ui,sans-serif;color:#284235;font-size:14px;--paper:#fffdf5f2;--line:#36544122;--shadow:0 6px 24px #1d392729}*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0;background:#457f9b;overflow:hidden}#scene{position:relative;width:100%;height:100dvh;overflow:hidden}canvas{display:block;width:100%;height:100%;touch-action:none}svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0;pointer-events:none}.icon-defs{position:absolute;width:0;height:0}button{font:inherit;color:inherit;cursor:pointer;border:1px solid var(--line);background:var(--paper);border-radius:12px;touch-action:manipulation;-webkit-tap-highlight-color:transparent}button:hover{background:#f0f3e5}button:focus-visible{outline:3px solid #deb571;outline-offset:2px}button:disabled{opacity:.5;cursor:default}.icon-button{width:44px;height:44px;display:grid;place-items:center;box-shadow:var(--shadow)}.hud-top{position:absolute;top:max(14px,env(safe-area-inset-top));left:16px;right:16px;display:flex;align-items:center;gap:12px;pointer-events:none}.hud-top>*{pointer-events:auto}.brand{margin-right:auto;background:var(--paper);padding:9px 15px;border-radius:14px;box-shadow:var(--shadow)}.brand strong{display:block;font-size:19px}.brand span{display:block;font-size:10px;color:#7b8d74}#stats{display:flex;gap:15px;background:var(--paper);padding:12px 16px;border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);font-weight:650;white-space:nowrap}#stats span{display:flex;align-items:center;gap:6px}#stats svg{width:19px;height:19px;color:#819166}.panel{background:var(--paper);border:1px solid var(--line);border-radius:17px;box-shadow:var(--shadow);backdrop-filter:blur(10px)}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.panel-heading strong{font-size:16px}.panel-heading small{display:block;color:#849077;font-size:11px;margin-top:3px}.close-button{width:36px;height:36px;display:grid;place-items:center;background:transparent;border:0;flex-shrink:0}.close-button svg{width:17px;height:17px}.settings{position:absolute;top:76px;right:16px;width:248px;padding:15px;max-height:calc(100dvh - 100px);overflow:auto}.settings p{font-size:12px;margin:8px 0;color:#778669}#goal{color:#3d6545;font-weight:600}#work-summary{margin-bottom:12px}.menu-row{width:100%;padding:11px 8px;display:flex;gap:10px;align-items:center;text-align:left;border:0;border-radius:9px;background:transparent;min-height:44px}.menu-row svg{width:18px;height:18px}.menu-row.subtle{color:#87927c;font-size:12px;border-top:1px solid var(--line);border-radius:0;margin-top:8px}#help{line-height:1.65;background:#e5eadc;padding:10px;border-radius:9px}.build-toggle{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));left:16px;display:flex;align-items:center;gap:9px;height:46px;padding:0 16px;background:#294e3e;color:#fffdf0;border-color:#ffffff22;box-shadow:var(--shadow);font-weight:600}.build-toggle:hover,.build-toggle[aria-expanded=true]{background:#3e6450}.placement{position:absolute;left:16px;bottom:78px;display:flex;align-items:center;gap:12px;padding:10px 10px 10px 15px;max-width:calc(100% - 80px);width:340px}.placement>svg{color:#73855e}.placement strong{display:block;font-size:13px}.placement small{display:block;color:#7d8c70;font-size:11px;margin-top:3px}.placement .close-button{margin-left:auto}.context-card{position:absolute;width:238px;padding:12px 14px;max-width:calc(100% - 32px)}.context-card .panel-heading{margin-bottom:3px}.context-card .panel-heading strong{font-size:14px}.context-card p{font-size:11px;color:#7a8870;margin:4px 0 10px}.context-card .upgrade{width:100%;padding:10px;background:#e5ecd9;font-size:12px}.context-card .upgrade:not(:disabled):hover{background:#d5e2c6}#map-controls{position:absolute;bottom:max(18px,env(safe-area-inset-bottom));right:16px;display:flex;flex-direction:column;gap:6px}#message{position:absolute;top:82px;left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 110px);border-radius:13px;background:#253f34e8;color:#f6f6e8;padding:10px 14px;box-shadow:var(--shadow);font-size:12px;line-height:1.5;pointer-events:none;text-align:center}#pause-state{position:absolute;top:77px;left:16px;background:var(--paper);border-radius:12px;padding:8px 10px;font-size:12px;box-shadow:var(--shadow)}#pause-state button{padding:5px 8px;font-size:11px;margin-left:8px}@media(max-width:560px){.brand{display:none}.hud-top{gap:9px;left:12px;right:12px}#stats{gap:15px;flex:1;justify-content:space-around;padding:12px 10px;font-size:13px}.build-toggle{left:12px}.settings{right:12px}.placement{left:12px;width:calc(100% - 78px);padding-left:11px;gap:8px}.placement small{font-size:10px}.placement>svg{width:18px}#map-controls{right:12px}#message{top:75px;font-size:11px}#pause-state{top:73px;left:12px}}@media(max-height:480px){.settings{top:68px;max-height:calc(100dvh - 82px)}#map-controls{flex-direction:row}.placement{bottom:70px}}
#seed-label{font-size:10px;overflow-wrap:anywhere}.restart-dialog{width:min(380px,calc(100% - 24px));max-height:calc(100dvh - 32px);overflow:auto;padding:20px;color:#284235}.restart-dialog::backdrop{background:#1b352d80;backdrop-filter:blur(3px)}.restart-dialog p{font-size:12px;color:#7a8870;line-height:1.6;margin:10px 0}.restart-dialog #current-seed{font-size:11px;overflow-wrap:anywhere}.restart-dialog label{display:block;font-size:12px;font-weight:600;margin:16px 0 7px}.seed-row{display:flex;gap:8px}.seed-row input{width:0;flex:1;min-width:0;font:16px system-ui;padding:10px;border:1px solid #b8c6ac;border-radius:10px;background:#fffef7;color:#284235}.seed-row input:focus{outline:2px solid #759267;outline-offset:1px}.seed-row .icon-button{box-shadow:none}.restart-actions{display:flex;gap:8px;justify-content:flex-end;margin-top:20px}.restart-actions button{padding:11px 14px;min-height:44px;font-size:12px}#restart-confirm{background:#294e3e;color:#fffdf0;border-color:#294e3e}#restart-confirm:hover{background:#3e6450}@media(max-height:480px){.restart-dialog{padding:14px}.restart-dialog p{margin:5px 0}.restart-dialog label{margin-top:9px}.restart-actions{margin-top:12px}}
#map-controls,.build-toggle{z-index:2}.settings,.placement,.context-card{z-index:5}.hud-top{z-index:6}#message{z-index:7}#pause-state{z-index:3}
.season-toggle{position:absolute;top:76px;left:16px;z-index:3;padding:8px 12px;display:flex;align-items:center;gap:7px;font-size:11px;box-shadow:var(--shadow);overflow:hidden;min-height:36px}.season-toggle svg{width:17px;height:17px;color:#779765}.season-toggle::after{content:'';position:absolute;bottom:0;left:0;width:var(--season-progress,0%);height:2px;background:#87a66f}.season-toggle[data-season=summer] svg{color:#b69853}.season-toggle[data-season=autumn] svg{color:#b38850}.season-toggle[data-season=winter] svg{color:#7199af}.season-toggle[data-season=winter]::after{background:#93b7c6}.heat-warning{font-size:10px;color:#a26642;border-left:1px solid #b79e772e;padding-left:7px}.season-panel{position:absolute;top:121px;left:16px;width:min(290px,calc(100% - 32px));padding:15px;z-index:5;max-height:calc(100dvh - 143px);overflow:auto}.season-panel p{font-size:12px;line-height:1.6;color:#7e8b72;margin:8px 0}.season-panel progress{width:100%;height:5px;accent-color:#87a66f}.season-panel #season-next{font-size:10px}.season-panel #season-facts{font-size:11px;line-height:1.8;white-space:pre-line;color:#516b50;border-top:1px solid var(--line);padding-top:10px}.season-panel .season-note{font-size:10px;color:#8b9782}.context-card .cold-label{color:#9a714a}.context-card .heat-label{color:#70855e}.context-card .insulation-note{font-size:10px;margin:6px 0 0}.settings{top:121px;max-height:calc(100dvh - 143px)}#message{top:123px}#pause-state{top:120px}@media(max-width:560px){.season-toggle{top:73px;left:12px}.season-panel{left:12px;top:116px}.settings{top:116px}#message{top:119px}#pause-state{top:116px}}@media(max-height:480px){.season-panel,.settings{top:114px;max-height:calc(100dvh - 130px)}}
.wood-saving{display:flex;align-items:flex-start;gap:9px;border-top:1px solid var(--line);padding-top:12px;margin-top:12px;font-size:12px;cursor:pointer}.wood-saving input{width:18px;height:18px;margin:1px 0;accent-color:#68865f;flex-shrink:0}.wood-saving small{display:block;font-size:10px;color:#7e8b72;line-height:1.6;margin-top:3px}
#stats{gap:12px;padding:4px 12px;min-height:48px}#stats>span{gap:5px}#stats>button{border:0;background:transparent;box-shadow:none;display:flex;gap:5px;align-items:center;padding:7px 5px;min-height:40px;font-weight:650;border-radius:8px}#stats>button:hover,#stats>button[aria-expanded=true]{background:#e8eddc}#stats .food-low{color:#b07d38}#stats .food-hungry{color:#b35c48;background:#f7e7da}#stats .food-hungry svg{color:inherit}
.food-panel{position:absolute;top:76px;right:16px;width:min(322px,calc(100% - 24px));padding:15px;z-index:5;max-height:calc(100dvh - 94px);overflow:auto}.food-panel p{font-size:11px;line-height:1.7;color:#70836a;margin:9px 0}.food-panel #food-status{color:#4b674c}.food-numbers{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:12px 0}.food-numbers>span{display:block;background:#e9efdf;padding:9px 8px;border-radius:9px;font-size:10px;color:#718368}.food-numbers strong{display:block;font-size:22px;color:#3b5b43;margin-top:3px}.food-guide{border-top:1px solid var(--line);padding-top:12px;font-size:12px}.food-panel .food-note{font-size:10px;color:#87957a}.food-panel #food-reserve{padding:8px 10px;background:#eee8d9;border-radius:9px;color:#887650}.context-card{max-height:calc(100dvh - 202px);overflow:auto}#empty-village{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(310px,calc(100% - 32px));padding:20px;z-index:4}#empty-village p{font-size:12px;line-height:1.6;color:#7a8870}#empty-village button{padding:10px 14px;background:#e5ecd9}
@media(max-width:560px){#stats{gap:5px;padding:4px 7px;font-size:12px}.food-panel{top:73px;right:12px;max-height:calc(100dvh - 91px)}#stats svg{width:17px;height:17px}.hud-top{gap:8px}.hud-top>.icon-button{flex-shrink:0}}
@media(max-height:480px){}
#stats .stock-count{flex-direction:column;gap:1px;line-height:1.1;min-width:24px;align-items:flex-start}#stats .stock-count small{display:block;font-size:9px;font-weight:400;color:#89977d}.storage-row{display:grid;grid-template-columns:1fr auto;gap:6px;font-size:12px;margin:14px 0}.storage-row progress{grid-column:1/-1;width:100%;height:7px;accent-color:#8aa66f}.storage-row small{grid-column:1/-1;font-size:10px;color:#8a987e}.building-storage{line-height:1.7}.food-numbers strong{font-size:16px;white-space:nowrap}
.context-card .buffer-note{background:#e8eedc;padding:7px 8px;border-radius:7px;color:#667f56;line-height:1.6}.context-card .crew-note{color:#4d7755;font-weight:600}

.stone-toggle{position:absolute;top:104px;left:16px;display:flex;align-items:center;gap:6px;padding:7px 10px;border:1px solid #ffffff55;border-radius:14px;background:#f4efdbe8;color:#334c3b;font-size:11px;box-shadow:0 3px 12px #20382c22;z-index:3}.stone-toggle svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}.stone-toggle:focus-visible{outline:3px solid #e2b86b}

.stone-toggle{top:87px;left:auto;right:16px}@media(max-width:560px){.stone-toggle{top:77px;right:12px;padding:6px 8px;font-size:10px}}

#map-hover{position:absolute;z-index:4;pointer-events:none;max-width:min(205px,calc(100% - 16px));padding:6px 9px;background:#fffdf5ee;border:1px solid #66865c;border-radius:11px;box-shadow:var(--shadow);font-size:12px}#map-hover strong,#map-hover small{display:block}#map-hover small{font-size:10px;line-height:1.5;color:#667e60;margin-top:3px}#map-hover[data-invalid=true]{border-color:#bd705e}#map-hover[data-invalid=true] small{color:#a05343}#confirm-build{background:#294e3e;color:#fffdf0;padding:9px 11px;min-height:44px;font-size:12px;flex-shrink:0}.placement:has(#confirm-build:not([hidden])){width:420px;flex-wrap:wrap}.placement:has(#confirm-build:not([hidden]))>div{flex:1;min-width:110px}.placement:has(#confirm-build:not([hidden])) .close-button{margin-left:0}@media(max-height:480px){}

.production-info{margin:10px 0;padding:10px;background:#e9efdf99;border-radius:10px}.production-info strong{font-size:11px;color:#496b47}.context-card .production-info p{margin:4px 0;font-size:11px}.production-info small{font-size:10px;color:#829076;line-height:1.5;display:block;margin-top:5px}.context-card .production-actual{color:#557c51}.context-card .production-gain{padding:8px;background:#e0ebd2;border-radius:8px;color:#436943;font-size:11px;font-weight:600}

#population-stock{display:flex;align-items:center;gap:6px;border:0;background:transparent;padding:0;font-weight:650}.building-actions{display:flex;gap:7px;margin-top:12px;padding-top:10px;border-top:1px solid var(--line)}.building-actions button{flex:1;min-height:40px;font-size:11px;padding:8px;background:#e8eedc}.building-actions .demolish{background:#f0e3d1;color:#946a48}.salvage-note{display:block;margin-top:10px;font-size:10px;color:#839075;line-height:1.5}#people-summary{display:flex;flex-wrap:wrap;gap:6px;margin:10px 0}#people-summary span{background:#e6edda;padding:6px 8px;border-radius:9px;font-size:11px}#people-summary [data-group=idle]{background:#f0e8d7}#people-list{display:flex;flex-direction:column;gap:5px}.person-row{display:flex;align-items:center;gap:10px;text-align:left;min-height:49px;padding:8px;background:#ffffff66}.person-row strong,.person-row small{display:block}.person-row strong{font-size:12px}.person-row small{font-size:10px;color:#829076;margin-top:3px}

#message[data-kind=job]{top:auto;bottom:135px;max-width:calc(100% - 32px)}

.work-controls{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--line)}.work-controls button{flex:1;min-height:44px;padding:7px;font-size:11px;background:#e5edda}.work-controls button[aria-pressed=true]{background:#eee3cb;color:#8b7046}.work-controls label{display:flex;flex-direction:column;gap:3px;font-size:10px;color:#6d8063}.work-controls select{min-height:36px;max-width:110px;border:1px solid #bccbad;border-radius:8px;background:#fffdf5;color:#34543e;padding:5px;font:inherit}.village-goals{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:10px 0;margin:10px 0}.village-goals summary{cursor:pointer;font-size:12px;color:#426546}.village-goals ul{list-style:none;padding:0;margin:10px 0}.village-goals li{margin:8px 0;padding:8px;background:#edf0e1;border-radius:8px}.village-goals strong,.village-goals small{display:block;font-size:11px}.village-goals small{font-size:10px;line-height:1.5;color:#819174;margin-top:4px}.village-goals .completed{background:#dfead3}.context-card{max-height:calc(100dvh - 130px);overflow-y:auto}

.atlas-panel{position:absolute;right:16px;top:116px;width:min(340px,calc(100% - 32px));max-height:calc(100dvh - 138px);overflow:auto;padding:14px;z-index:6}.atlas-panel p{font-size:11px;color:#819074;line-height:1.5}#atlas-list{display:flex;flex-direction:column;gap:5px}.landscape-row{display:flex;align-items:center;gap:10px;text-align:left;min-height:57px;padding:9px;background:#edf0e299}.biome-color{width:22px;height:34px;border-radius:8px;flex-shrink:0;border:1px solid #687f4633}.landscape-row strong,.landscape-row small{display:block}.landscape-row strong{font-size:12px}.landscape-row small{font-size:10px;color:#79886c;line-height:1.4;margin-top:4px}.context-card .terrain-note{font-size:10px;padding:7px;border-left:3px solid #a3b58b;background:#edf0df;color:#5a7453}

.landscape-group>.landscape-row{width:100%}.landscape-group details{margin:3px 0 8px 12px;border-left:2px solid #a2b58e55;padding-left:8px}.landscape-group summary{cursor:pointer;font-size:11px;color:#59714f;padding:7px 4px}.landscape-feature{width:100%;margin-bottom:4px;background:#f3f4ea88}.landscape-feature .biome-color{width:15px;height:24px}.landscape-feature strong{font-size:11px}

#map-hover small{white-space:pre-line}.construction-status,.animal-status{padding:6px;border-left:3px solid #b6a274;background:#eee9d9}#exploration-status{font-weight:600;color:#4d7056}.placement small{overflow-wrap:anywhere}

.hunt-policy{width:100%;min-height:44px;padding:8px 10px;margin:4px 0 8px;font-size:11px;background:#e5edda}.animal-status+button+small{display:block;line-height:1.5;margin-bottom:10px;color:#76836b}


/* Compact catalog: fixed content rows keep text inside tiles while the catalog scrolls. */
.build-panel{position:absolute;bottom:78px;left:16px;display:flex;flex-direction:column;overflow:hidden;z-index:5;width:590px;max-width:calc(100% - 92px);padding:14px;max-height:min(490px,calc(100dvh - 204px));gap:0;background:#fffdf5f7;border-radius:18px;box-shadow:0 12px 36px #203f3538}
.build-panel .panel-heading{margin:0 0 10px;flex-shrink:0}.build-panel .panel-heading small{font-size:11px;margin-top:2px}
#build{display:grid;overflow-y:auto;min-height:0;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:minmax(116px,auto);align-content:start;gap:6px;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#a8b79a transparent;padding:2px 3px 6px 1px;flex:0 1 auto}
#build .build-card{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-height:116px;padding:3px 5px 8px;overflow:hidden;text-align:center;background:#f0f2e8;border:1px solid transparent;border-radius:11px;transition:background .15s,border-color .15s}
#build .build-card:hover,#build .build-card:focus-visible{background:#e8eddc;border-color:#bac6a5}#build .build-card.selected{background:#dfe9d2;border-color:#7c9969;box-shadow:inset 0 0 0 1px #7c9969}
#build .build-card img{width:80px;height:60px;object-fit:contain;flex-shrink:0;pointer-events:none}#build .build-card strong{font-size:11px;line-height:1.25;min-height:27px;display:flex;align-items:center;justify-content:center;overflow-wrap:anywhere;color:#304f3e}
#build .build-cost{display:flex;justify-content:center;align-items:center;gap:7px;margin-top:auto;font-size:10px;font-weight:550;color:#7c8b6e;white-space:nowrap}#build .build-cost span{display:flex;align-items:center;gap:3px}#build .build-cost svg{width:13px;height:13px}#build .build-cost small{display:inline;margin:0;font-size:9px}#build .build-cost .missing{color:#ac795b}
#build-info{flex-shrink:0;min-height:49px;padding:8px 2px 4px}#build-info strong{display:block;font-size:12px;color:#36563f}#build-info small{display:block;font-size:11px;line-height:1.4;color:#7a886d;margin-top:3px}
#build-tabs{display:flex;flex-shrink:0;border-top:1px solid var(--line);padding-top:9px;margin-top:5px;gap:4px;background:transparent}#build-tabs button{flex:1;border:0;border-radius:9px;min-height:44px;color:#7c8c70;font-size:12px}#build-tabs button[aria-pressed=true]{background:#e2ebd6;color:#34563e;font-weight:650}
.placement{background:#fffdf5f7;border-radius:15px;gap:10px}.placement>div{min-width:0}.placement small{font-size:11px;line-height:1.45}.placement[data-invalid=true] small{color:#a4674c}.placement #confirm-build{min-height:44px;padding:0 14px;background:#355e44;color:#fffdf5;border:0}.placement #confirm-build:disabled{background:#b8bbaa}.placement .close-button{flex-shrink:0}
.context-card{width:288px;padding:12px 14px;background:#fffdf5f7;border-radius:16px;scrollbar-width:thin;overscroll-behavior:contain}.context-card .panel-heading{gap:8px;margin-bottom:6px}.context-card .panel-heading img{object-fit:contain;flex-shrink:0}.context-card .panel-heading strong{flex:1;font-size:14px}.context-card .detail-brief{font-size:11px;line-height:1.5;margin:0 0 10px;color:#7a886c}.context-card .production-info{margin:8px 0;padding:9px 11px;background:#ecf1e3;border-radius:10px}.context-card .production-info p{line-height:1.5}
.detail-section{border-top:1px solid #dce3d1;padding:0;margin:0}.detail-section summary{min-height:44px;display:flex;align-items:center;justify-content:space-between;gap:8px;cursor:pointer;font-size:12px;font-weight:600;color:#536e4b;list-style:none}.detail-section summary::-webkit-details-marker{display:none}.detail-section summary::after{content:'›';font-size:20px;font-weight:400;color:#8f9f7f;transform:rotate(0);flex-shrink:0}.detail-section[open]>summary::after{transform:rotate(90deg)}.detail-section>p,.detail-section>small{line-height:1.55}.detail-section>small{display:block;font-size:10px;margin:5px 0 8px;color:#889479}.detail-section .building-actions{margin:0 0 10px;padding:0;border:0}.detail-section .production-gain{font-weight:500}.detail-section .upgrade{margin-bottom:12px;min-height:44px;background:#355e44;color:#fffdf5;border:0}.upgrade-section summary{flex-wrap:wrap;position:relative;padding:9px 25px 9px 0}.upgrade-section summary small{display:block;width:100%;font-weight:400;font-size:10px;color:#7d8d6e}.upgrade-section summary::after{position:absolute;right:0;top:12px}.context-card .work-controls{padding:8px 0;border-top:0}.context-card .animal-status{padding:8px;border-left:0;line-height:1.4}.context-card .hunt-policy{font-size:10px}
@media(max-width:700px){.build-panel{left:12px;bottom:78px;width:calc(100% - 24px);max-width:none;max-height:min(470px,calc(100dvh - 205px));padding:12px}#build{grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:minmax(112px,auto)}#build .build-card{min-height:112px}#build .build-card img{width:76px;height:54px}#build-info{display:none}#build-tabs{margin-top:5px}.build-panel .panel-heading{margin-bottom:7px}.context-card{width:288px;max-width:calc(100% - 24px)}.placement{left:12px;bottom:78px;width:calc(100% - 24px);max-width:none}.placement:has(#confirm-build:not([hidden])){width:calc(100% - 24px)}.placement:has(#confirm-build:not([hidden]))>div{min-width:160px}.placement:has(#confirm-build:not([hidden])) #confirm-build{margin-left:28px}.placement .close-button{margin-left:auto}}
@media(max-height:480px){.build-panel{bottom:70px;width:min(590px,calc(100% - 92px));max-height:calc(100dvh - 180px);padding:8px 12px}.build-panel .panel-heading{margin-bottom:3px}.build-panel .panel-heading small,#build-info{display:none}#build{grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:minmax(88px,auto)}#build .build-card{min-height:88px;padding:0 4px 5px}#build .build-card img{height:40px;width:65px}#build .build-card strong{font-size:10px;min-height:25px}#build-tabs{padding-top:5px;margin-top:3px}#build-tabs button{min-height:36px}.context-card{max-height:calc(100dvh - 130px)}}

@media(max-width:700px){#scene:has(#build-panel:not([hidden])) #map-controls{visibility:hidden}}

#message[data-context=true]{top:auto;bottom:78px;max-width:calc(100% - 32px)}
.extra-build-options{display:flex;gap:6px;align-items:center;font-size:10px;color:#748869;padding:0 0 8px;flex-shrink:0}.extra-build-options input,.village-policy select,#repeat-build{accent-color:#5d8052}.village-policy{display:flex;flex-direction:column;gap:6px;font-size:11px;margin:12px 0;color:#657958}.village-policy select{min-height:40px;background:#f4f5ed;border:1px solid #c8d4b9;border-radius:9px;padding:6px;color:#36543f}
#repeat-control{display:flex;align-items:center;gap:5px;flex-basis:100%;font-size:10px;color:#728466;margin-left:28px}.placement:has(#repeat-control:not([hidden])){flex-wrap:wrap}.placement:has(#repeat-control:not([hidden]))>div{flex:1;min-width:140px}
.context-card .work-state{padding:7px 9px;border-radius:8px;background:#e7efdc;color:#4f724d;font-size:11px;line-height:1.5}.context-card .work-state[data-problem=true]{background:#f0e6d5;color:#956c4a}.context-card .supply-note{font-size:10px;color:#718268;line-height:1.5}
.resident-profile{border-bottom:1px solid #dce4d3;padding:0 8px 8px;margin-bottom:7px}.resident-profile summary{font-size:10px;cursor:pointer;color:#7c8d70;min-height:28px;line-height:28px}.resident-profile p{font-size:10px;margin:5px 0;color:#66805b}.quest-reward{min-height:40px;padding:7px 10px;margin-top:8px;background:#355e44;color:#fffdf5;border:0;font-size:11px}
#game-speed{display:flex;gap:3px;flex-shrink:0}

#placement-info{flex-shrink:0;font-size:11px;color:#6c8062;border-top:1px solid var(--line);margin-top:5px}#placement-info summary{user-select:none;-webkit-user-select:none;cursor:pointer;min-height:36px;display:list-item;line-height:36px}#placement-info p{font-size:10px;line-height:1.5;margin:0 0 8px;overflow-wrap:anywhere;max-height:110px;overflow:auto}.placement #placement-info{font-size:10px}.placement #placement-info summary{min-height:32px;line-height:32px}
.context-card[data-kind=resident]{width:300px;max-width:calc(100% - 24px);max-height:calc(100dvh - 204px);overflow:auto}.context-card[data-kind=resident] .panel-heading img{background:#e9efdf;border-radius:12px}.resident-needs{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin:10px 0}.resident-needs span{background:#e9efdf;border-radius:8px;padding:7px 9px;font-size:10px;color:#748469}.resident-needs strong{display:block;font-size:16px;color:#456447;margin-top:3px}.context-card .resident-wellbeing{font-size:10px;line-height:1.6}.resident-skill{margin:8px 0}.resident-skill progress{width:100%;height:5px;accent-color:#86a36d}.resident-skill small{font-size:9px;color:#859576;display:block;margin-top:2px}.resident-actions{display:flex;flex-wrap:wrap;gap:5px;margin-top:9px}.resident-actions button{flex:1;padding:8px 5px;min-height:40px;font-size:10px;background:#e8efdf}.context-card[data-kind=resident] summary{user-select:none;-webkit-user-select:none}
.upgrade-look{display:flex;align-items:center;gap:14px;padding:8px 0}.upgrade-look>span{flex:1;text-align:center;background:#edf1e4;border-radius:9px;padding:4px}.upgrade-look>span+span{background:#e2ecd7}.upgrade-look img{display:block;max-width:100%;margin:auto}.upgrade-look small{display:block;font-size:9px;color:#69815d;line-height:1.5}
.context-card[data-kind=resident] .close-button{font-size:20px}.context-card .resident-skill p{font-size:10px;line-height:1.4;margin:4px 0}.resident-skill progress{appearance:none;border:0;border-radius:3px;overflow:hidden;background:#dce5d1}.resident-skill progress::-webkit-progress-bar{background:#dce5d1}.resident-skill progress::-webkit-progress-value{background:#87a370;border-radius:3px}.resident-skill progress::-moz-progress-bar{background:#87a370;border-radius:3px}.resident-actions{position:sticky;bottom:-12px;background:#fffdf5;padding:8px 0;border-top:1px solid var(--line);z-index:1}
/* Time and camera controls stay together in a compact corner of the map. */
#map-controls{flex-direction:row}#time-controls{position:absolute;right:16px;bottom:calc(max(18px,env(safe-area-inset-bottom)) + 52px);z-index:2;display:flex;gap:4px;padding:4px;border-radius:12px;box-shadow:var(--shadow)}#time-controls button{min-width:40px;min-height:40px;padding:5px;border:0;background:transparent;border-radius:8px;font-size:13px;font-weight:600}#time-controls #pause-toggle{border-right:1px solid var(--line);border-radius:8px 0 0 8px;margin-right:1px}#time-controls #pause-toggle[aria-pressed=true]{color:#9d673e;background:#f2e4ce}#time-controls #game-speed button[aria-pressed=true]{background:#355e44;color:#fffdf5}.context-card,.context-card[data-kind=resident]{max-height:calc(100dvh - 248px)}
@media(max-width:560px){#time-controls{right:12px}}@media(max-width:700px){#scene:has(#build-panel:not([hidden])) #time-controls{visibility:hidden}}
.build-card{position:relative}.footprint-badge{position:absolute;top:7px;right:7px;border:1px solid var(--line);border-radius:5px;padding:1px 4px;background:#fffdf5d9;color:#6f8068;font-size:9px}
.parcel-note{display:block;font-size:10px;color:#849077;margin:0 0 9px}

#time-controls #pause-toggle{display:grid;place-items:center}#time-controls #pause-toggle svg{width:18px;height:18px}
/* Desktop text is comfortably readable while phone layouts stay compact. */
@media(min-width:900px) and (hover:hover){
 :root{font-size:16px}.panel-heading strong{font-size:18px}.settings{width:280px}.settings p,.menu-row,.season-panel p,.food-panel p,.storage-panel p{font-size:14px}.settings small,.settings .speed-note{font-size:12px}.context-card{width:300px;line-height:1.5}.context-card[data-kind=resident]{width:330px}.context-card p,.context-card .detail-brief,.context-card .production-info p,.context-card .work-state,.context-card .building-storage,.context-card .buffer-note,.context-card .animal-status,.context-card .construction-status,.context-card .crew-note{font-size:13px}.context-card small,.context-card .parcel-note,.context-card .insulation-note,.context-card .supply-note,.context-card .production-info small,.context-card .resident-skill p,.context-card .resident-wellbeing,.context-card .resident-skill small{font-size:12px}.context-card summary,.context-card button,.context-card select{font-size:13px}.resident-needs span,.resident-actions button{font-size:12px}.resident-needs strong{font-size:19px}.person-row strong{font-size:14px}.person-row small,.resident-profile summary,.resident-profile p{font-size:12px}#build{grid-auto-rows:minmax(132px,auto)}#build .build-card{min-height:132px}#build .build-card strong{font-size:13px}#build .build-cost{font-size:12px}#build-info p,#build-info-note{font-size:12px}#build-tabs button{font-size:13px}.season-toggle,#time-controls button,#placement-info{font-size:13px}
}
.meal-bonus,.restoration-reward{padding:9px;border-radius:9px;background:#e7eed9;color:#4e734b}.restoration-button{width:100%;min-height:44px;padding:10px;background:#355e44;color:#fffdf5;margin:9px 0}.restoration-costs{line-height:1.8}.restoration-costs span{display:inline-block;margin-right:10px}.restoration-costs [data-missing=true]{color:#a46c46}
@media(min-width:900px) and (hover:hover){.context-card .panel-heading strong{font-size:17px}}
