/* Inventory is a wrapping dashboard, never a horizontal strip. */
@media(min-width:801px){#game{height:100dvh;display:flex;flex-direction:column}#game>main{height:auto;flex:1;min-height:0}#game>.subbar,#game>.domain-nav,#game>.objective-banner{flex-shrink:0}}
.topbar{height:auto;min-height:102px;padding:10px 18px;gap:18px;flex-shrink:0}
.topbar .brand{min-width:0;flex:0 0 190px;gap:8px}.topbar .brand h1{font-size:20px}.topbar .brand>div>span{font-size:7px;letter-spacing:1.3px}.topbar .crest{font-size:27px}
#resourceScope{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);border:0}
.topbar .header-actions{margin:0;gap:5px;flex-shrink:0}.topbar .icon-button{width:33px;height:33px}
.topbar .resources{display:flex;align-items:stretch;justify-content:flex-start;gap:14px;overflow:visible;flex:1;min-width:0;padding:0}
.resource-group{min-width:0;flex:0 1 auto}.resource-group h2{font:600 9px Segoe UI,Arial,sans-serif;letter-spacing:1px;text-transform:uppercase;color:#d5c397;display:flex;align-items:center;justify-content:space-between;gap:10px;margin:0 0 5px;padding:0 2px}
.resource-group h2>span{font-size:8px;letter-spacing:0;text-transform:none;color:#99aca9;font-weight:400}
.resource-items{display:grid;grid-template-columns:repeat(var(--resource-count),minmax(0,1fr));gap:3px}
.resources .resource{position:relative;display:grid;grid-template-columns:20px minmax(0,1fr);grid-template-rows:13px 16px;gap:1px 5px;align-content:center;align-items:center;min-width:0;width:76px;max-width:100%;padding:6px 5px;border:1px solid #4a605e;border-radius:3px;background:#203033;box-shadow:inset 0 1px #ffffff07;text-align:left;transition:border-color .12s,background .12s;line-height:1.2}
.resources .resource:hover,.resources .resource:focus-visible{background:#30463f;border-color:#b9a877;outline-offset:1px}.resources .resource:active{transform:none}
.resources .resource .r-icon{grid-column:1;grid-row:1/3;width:20px;height:20px;color:var(--resource-color);filter:drop-shadow(0 1px #0008);text-shadow:none}
.r-icon svg{display:block;width:100%;height:100%;image-rendering:pixelated}
.resources .resource-name{font-size:8px;font-weight:500;color:#b8c8be;white-space:nowrap;letter-spacing:.1px}
.resources .resource strong{display:flex;align-items:baseline;gap:2px;grid-column:2;font-size:12px;font-weight:650;color:#f2e6c8;white-space:nowrap;line-height:1.2;font-variant-numeric:tabular-nums}
.resources .resource strong .resource-cap{display:block;font-size:8px;font-weight:400;color:#9cafa8;position:absolute;right:5px;bottom:4px}
.resources .resource{padding-bottom:17px}
.resources .resource:has(.city-stock){padding-bottom:29px}
.resources .resource:has(.city-stock) strong .resource-cap{bottom:16px}
.resources .resource .city-stock{grid-column:1/-1;font-size:8px;line-height:11px;white-space:nowrap;color:#a9bcb2;position:absolute;bottom:3px;left:5px;right:3px;text-align:right;letter-spacing:-.1px}
.resources .resource .city-stock.full{color:#e1b980}
.resources .resource-full{border-bottom-color:#bd9b61}.resources .resource-full strong{color:#e9c78f}.resource-alert{position:absolute;top:2px;right:2px;width:10px;height:10px;border-radius:50%;background:#d4a16a;color:#202e2b;font-size:9px;font-weight:800;text-align:center;line-height:10px}
.resources .resource .food-trend{font-size:13px;line-height:10px;margin-left:1px}.food-trend.up{color:#b2d694}.food-trend.down{color:#ec9a85}.food-trend.stable{color:#b4c0b4}
#resourceTip{position:fixed;z-index:85;width:300px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 16px);overflow:auto;padding:15px 16px;background:#192a2e;color:#e9dfc2;border:1px solid #a7996e;border-top:3px solid #bda572;border-radius:4px;box-shadow:0 8px 28px #0a1519b0;line-height:1.5;font-size:12px;scrollbar-width:thin}
#resourceTip[hidden]{display:none}#resourceTip header{display:flex;align-items:center;gap:10px;margin-bottom:14px}#resourceTip header .r-icon{width:32px;height:32px;flex-shrink:0;color:var(--resource-color)}#resourceTip header small{font-size:9px;color:#aabaae}#resourceTip h3{font:17px Georgia,serif;color:#f1dfb1}#resourceTip header em{margin-left:auto;font-style:normal;font-size:9px;color:#edc68e;border:1px solid #8f7852;padding:2px 6px}
.resource-detail-row{display:flex;justify-content:space-between;gap:12px;padding:5px 0;font-variant-numeric:tabular-nums}.resource-detail-row>span{color:#adbbb0}.resource-detail-row b{font-weight:600;white-space:nowrap}.resource-detail-row small{font-size:10px;color:#99a99e;font-weight:400}.resource-meter{height:3px;background:#101f23;margin-bottom:8px}.resource-meter i{display:block;height:100%;background:#9da873}.resource-warning{font-size:11px;color:#e2b587;border-left:2px solid #c9925c;padding-left:9px;margin:9px 0}.resource-food-balance{border-top:1px solid #45574f;border-bottom:1px solid #45574f;padding:8px 0;margin:10px 0}.resource-food-balance p{font-size:10px;color:#a4b3a6;margin-top:5px}.resource-food-balance .up b{color:#b2d694}.resource-food-balance .down b{color:#ec9a85}
@media(min-width:1650px){.resources .resource{width:88px;padding-left:8px;padding-right:8px}.resources .resource-name{font-size:9px}.resources .resource strong{font-size:14px}.resources .resource strong .resource-cap{font-size:9px}.resources .resource .city-stock{font-size:9px}.topbar .resources{gap:20px}}
@media(max-width:1279px){.topbar{display:grid;grid-template-columns:1fr auto;gap:9px 12px;padding:9px 14px}.topbar .brand{grid-column:1;grid-row:1}.topbar .brand>div>span{display:none}.topbar .header-actions{grid-column:2;grid-row:1}.topbar .resources{grid-column:1/-1;grid-row:2;gap:12px}.resource-group{flex:0 1 auto}.resources .resource{width:82px}}
@media(max-width:800px){.topbar .resources{order:initial;flex-basis:auto}.topbar .brand{flex:none}.resources .resource{width:74px}.resource-group h2{font-size:8px}.resource-group h2>span{font-size:7px}.topbar .resources{gap:8px}}
@media(max-width:899px){.topbar{padding:9px 10px}.topbar .resources{display:flex;flex-direction:column;gap:6px}.resource-group{display:grid;grid-template-columns:76px minmax(0,1fr);gap:6px;align-items:center}.resource-group h2{display:block;letter-spacing:.5px;line-height:1.6;margin:0;font-size:8px}.resource-group h2>span{display:block;font-size:8px}.resources .resource{width:100%;min-height:42px;grid-template-columns:18px minmax(0,1fr);gap:1px 3px;padding:4px 3px 14px}.resources .resource .r-icon{width:18px;height:18px}.resources .resource:has(.city-stock){padding-bottom:25px}.resources .resource strong{font-size:11px}.resources .resource-name{font-size:7px}.resources .resource strong .resource-cap{font-size:7px;right:3px;bottom:3px}.resources .resource:has(.city-stock) strong .resource-cap{bottom:14px}.resources .resource .city-stock{font-size:7px;left:2px;right:2px;bottom:2px}.resource-group:has(.resource-items>.resource:only-child) .resource-items{grid-template-columns:repeat(4,minmax(0,1fr))}}

@media(max-width:360px){.resource-group{grid-template-columns:63px minmax(0,1fr);gap:4px}.resources .resource strong{font-size:10px}.resources .resource .city-stock{letter-spacing:-.3px}.resource-group h2{font-size:7px}.resource-group h2>span{font-size:7px}}

#objectiveBanner{height:auto;min-height:60px;border-top:0;border-bottom:1px solid #758264;padding:9px 20px;flex-shrink:0}.objective-copy{min-width:0}.objective-copy strong,.objective-copy>span:last-child{overflow-wrap:anywhere}.objective-copy>span:last-child{line-height:1.4}#objectiveButton{flex-shrink:0}@media(max-width:800px){#objectiveBanner{padding:10px 12px;gap:9px;min-height:78px}.objective-copy strong{font-size:15px}#objectiveButton{min-width:95px;font-size:10px;padding:9px 8px}}
