/* Cohesive island palette override for ada.html. Loaded after ada.css. */
:root{
    --warm-bg:#39362f;
    --warm-bg-deep:#211f1b;
    --warm-surface:#4a4439;
    --warm-surface-2:#2d2a24;
    --warm-paper:#f4ead6;
    --warm-paper-2:#e5d2ad;
    --warm-ink:#352a21;
    --warm-muted:#665544;
    --warm-line:#b99a69;
    --warm-gold:#d99a35;
    --warm-gold-2:#f4c56f;
    --warm-red:#c95749;
    --warm-cyan:#d2a24d;
}

html body #base-app .topbar{
    background:linear-gradient(180deg,#4b453a 0%,#292722 100%)!important;
    border-color:rgba(229,194,122,.58)!important;
    box-shadow:0 13px 28px rgba(18,14,9,.42),inset 0 1px 0 rgba(255,255,255,.13)!important;
}

html body #base-app .brand-mark{
    color:#f0c66f!important;
    background:linear-gradient(180deg,#5b4b34 0%,#30291f 100%)!important;
    border-color:rgba(232,193,113,.58)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 3px 8px rgba(18,14,9,.25)!important;
}

html body #base-app .resource-row .resource{
    background:linear-gradient(180deg,#514c42 0%,#34312b 58%,#24231f 100%)!important;
    border-color:rgba(223,186,108,.54)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 5px 12px rgba(18,14,9,.3)!important;
}

html body #base-app .resource-row .resource span{
    color:#e9c984!important;
    text-shadow:0 1px 2px rgba(16,12,8,.75)!important;
}

html body #base-app .resource-row .resource strong{
    color:#fff!important;
    text-shadow:0 2px 2px rgba(16,12,8,.82)!important;
}

html body #base-app .panel{
    background:linear-gradient(180deg,#494239 0%,#292722 100%)!important;
    border:2px solid rgba(218,178,96,.58)!important;
    color:var(--warm-ink)!important;
    box-shadow:0 18px 38px rgba(18,14,9,.46),inset 0 1px 0 rgba(255,255,255,.11)!important;
    scrollbar-color:#c78a32 #2d2923;
}

html body #base-app .panel-head{
    background:linear-gradient(145deg,#594f40 0%,#3c372f 55%,#292620 100%)!important;
    border:1px solid rgba(226,190,114,.35)!important;
    border-left:0!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 5px 12px rgba(16,12,8,.3)!important;
}

html body #base-app .panel-head:after{
    background:linear-gradient(90deg,transparent,rgba(232,192,111,.72),transparent)!important;
}

html body #base-app .panel-head-icon{
    color:#fff!important;
    background:linear-gradient(180deg,#e1b55c 0%,#996323 100%)!important;
    border-color:rgba(255,228,168,.7)!important;
    box-shadow:0 3px 8px rgba(18,13,8,.38),inset 0 1px 0 rgba(255,255,255,.38)!important;
}

html body #base-app .panel-head span:not(.panel-head-icon),
html body #base-app .panel h2{
    color:#fff!important;
    text-shadow:0 2px 2px rgba(17,12,8,.78),0 0 1px rgba(17,12,8,.9)!important;
}

html body #base-app .panel p{
    color:#eee4d1!important;
    text-shadow:0 1px 2px rgba(17,12,8,.6)!important;
}

html body #base-app .stat-grid div,
html body #base-app .cost-box,
html body #base-app .system-card,
html body #base-app .bonus-card{
    background:linear-gradient(180deg,var(--warm-paper) 0%,var(--warm-paper-2) 100%)!important;
    border:1px solid var(--warm-line)!important;
    color:var(--warm-ink)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.76),0 4px 10px rgba(25,17,9,.2)!important;
}

html body #base-app .stat-grid span,
html body #base-app .cost-box > span,
html body #base-app .system-card p,
html body #base-app .bonus-card ul,
html body #base-app .bonus-card li,
html body #base-app #panel-cost{
    color:var(--warm-muted)!important;
    text-shadow:none!important;
}

html body #base-app .stat-grid strong,
html body #base-app .system-card h3,
html body #base-app .bonus-card h3{
    color:var(--warm-ink)!important;
    text-shadow:none!important;
}

html body #base-app .level-track{
    background:#725f4b!important;
    border-color:#d6bd91!important;
    box-shadow:inset 0 2px 4px rgba(61,43,28,.32)!important;
}

html body #base-app .level-track span{
    background:linear-gradient(90deg,#c95749 0%,#dc8733 58%,#efc46f 100%)!important;
    box-shadow:0 0 10px rgba(220,135,51,.32)!important;
}

html body #base-app .captain-card{
    background:linear-gradient(145deg,#78512c 0%,#4c3424 55%,#2d2822 100%)!important;
    border-color:rgba(232,190,103,.66)!important;
    color:#fff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 7px 16px rgba(20,13,7,.28)!important;
}

html body #base-app .captain-card .captain-head strong,
html body #base-app .captain-card .captain-head em,
html body #base-app .captain-card .captain-info span,
html body #base-app .captain-card .captain-info small{
    color:#fff!important;
    text-shadow:0 2px 2px rgba(18,12,8,.82),0 0 1px rgba(18,12,8,.9)!important;
}

html body #base-app .captain-portrait{
    background:linear-gradient(180deg,#e7c47e 0%,#9b632a 100%)!important;
    border-color:rgba(255,224,155,.82)!important;
    box-shadow:0 4px 10px rgba(20,13,7,.38),inset 0 1px 0 rgba(255,255,255,.35)!important;
}

html body #base-app .upgrade-btn,
html body #base-app .captain-card button,
html body #base-app .scroll-command{
    background:linear-gradient(180deg,#f4d487 0%,#d89536 46%,#8d5625 100%)!important;
    border-color:#5b3a21!important;
    color:#2d2117!important;
    text-shadow:0 1px 0 rgba(255,244,203,.55)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.55),0 4px 8px rgba(61,39,20,.28)!important;
}

html body #base-app .upgrade-btn:disabled,
html body #base-app .captain-card button:disabled,
html body #base-app .scroll-command:disabled{
    background:linear-gradient(180deg,#9b9b92 0%,#666a64 100%)!important;
    color:#f4eee3!important;
    text-shadow:0 1px 1px rgba(35,27,20,.45)!important;
}

html body #base-app #collect-btn,
html body #base-app .scroll-command.command-collect{
    background:linear-gradient(180deg,#a7dfaa 0%,#3ea863 52%,#1b663f 100%)!important;
    border-color:#174f34!important;
    color:#082a1a!important;
}

html body #base-app #sail-btn,
html body #base-app .scroll-command.command-sail{
    background:linear-gradient(180deg,#f3c77c 0%,#dc7e2d 55%,#88401c 100%)!important;
    border-color:#663019!important;
    color:#2c1608!important;
}

html body #base-app .bonus-card li{
    border-top-color:rgba(116,91,62,.18)!important;
}

html body #base-app .bonus-card li:before{
    background:var(--warm-cyan)!important;
    box-shadow:0 0 10px rgba(210,162,77,.44)!important;
}

html body #base-app .building-dock{
    background:linear-gradient(180deg,#eee1c7 0%,#d1ba91 100%)!important;
    border:2px solid rgba(100,76,45,.82)!important;
    box-shadow:0 14px 30px rgba(20,14,8,.34),inset 0 1px 0 rgba(255,255,255,.72)!important;
    backdrop-filter:none!important;
}

html body #base-app .building-tab,
html body #base-app .building-tab:nth-child(n){
    background:linear-gradient(180deg,#514b40 0%,#302e29 100%)!important;
    border:1px solid rgba(221,185,109,.32)!important;
    color:#fff!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 4px 9px rgba(20,14,8,.25)!important;
}

html body #base-app .building-tab:hover:not(:disabled){
    background:linear-gradient(180deg,#665c4b 0%,#403b32 100%)!important;
    border-color:rgba(236,197,117,.68)!important;
    transform:translateY(-1px)!important;
}

html body #base-app .building-tab.active,
html body #base-app .building-tab:active:not(:disabled){
    background:linear-gradient(180deg,#f0c46f 0%,#d8832e 55%,#8b451d 100%)!important;
    border-color:#f9dda0!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.5),0 0 0 2px rgba(61,40,21,.3),0 7px 15px rgba(20,14,8,.34)!important;
}

html body #base-app .building-tab strong,
html body #base-app .building-tab em,
html body #base-app .building-tab small{
    color:#fff!important;
    text-shadow:0 2px 2px rgba(16,12,8,.72)!important;
}

html body #base-app .building-tab.active strong,
html body #base-app .building-tab.active em,
html body #base-app .building-tab.active small{
    color:#2c2118!important;
    text-shadow:0 1px 0 rgba(255,231,174,.62)!important;
}

html body #base-app .building-tab svg{
    color:#f5e2ae!important;
    background:linear-gradient(180deg,#d8aa52 0%,#86581f 100%)!important;
    border-color:rgba(255,224,158,.58)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 2px 5px rgba(18,12,7,.28)!important;
}

html body #base-app .building-tab.active svg{
    color:#fff!important;
    background:linear-gradient(180deg,#e0b25a 0%,#8f5b1f 100%)!important;
    border-color:rgba(255,246,213,.75)!important;
}

/* Icon hierarchy: crests, seals and resource medallions. */
html body #base-app .panel-head-icon{
    width:56px!important;
    height:56px!important;
    border-radius:50%!important;
    position:relative!important;
    flex:0 0 56px!important;
    border-width:2px!important;
    outline:1px solid rgba(74,48,20,.72)!important;
    outline-offset:3px!important;
}

html body #base-app .panel-head-icon:before{
    content:"";
    position:absolute;
    inset:5px;
    border:1px solid rgba(255,239,190,.42);
    border-radius:50%;
    pointer-events:none;
}

html body #base-app .panel-head-icon svg{
    width:27px!important;
    height:27px!important;
    filter:drop-shadow(0 2px 1px rgba(52,31,12,.48));
}

html body #base-app .stat-grid div{
    position:relative!important;
    overflow:hidden!important;
    padding:10px 9px!important;
}

html body #base-app .stat-grid div:after{
    content:"";
    position:absolute;
    left:9px;
    right:9px;
    bottom:0;
    height:2px;
    background:linear-gradient(90deg,transparent,#c78a32,transparent);
    opacity:.7;
}

html body #base-app .stat-grid span{
    gap:7px!important;
    color:#695441!important;
    font-weight:900!important;
}

html body #base-app .stat-grid span svg,
html body #base-app .cost-box > span svg{
    display:block!important;
    width:25px!important;
    height:25px!important;
    padding:5px!important;
    flex:0 0 25px!important;
    color:#f8dd9d!important;
    border:1px solid #765020!important;
    border-radius:50%!important;
    background:linear-gradient(180deg,#d9a64a 0%,#82531e 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 2px 4px rgba(48,30,13,.22)!important;
}

html body #base-app .stat-grid span svg{
    width:18px!important;
    height:18px!important;
    padding:3px!important;
    flex-basis:18px!important;
}

html body #base-app .stat-grid span{
    gap:3px!important;
    font-size:8px!important;
    letter-spacing:.2px!important;
    white-space:nowrap!important;
    overflow:visible!important;
}

html body #base-app .stat-grid strong{
    max-width:100%!important;
    overflow-wrap:anywhere!important;
    font-size:14px!important;
    line-height:1.15!important;
}

html body #base-app .stat-grid strong{
    margin-top:7px!important;
}

html body #base-app .system-card h3,
html body #base-app .bonus-card h3{
    display:flex!important;
    align-items:center!important;
    gap:8px!important;
    overflow:hidden!important;
}

html body #base-app .system-card h3:after,
html body #base-app .bonus-card h3:after{
    content:"";
    height:1px;
    min-width:18px;
    flex:1;
    background:linear-gradient(90deg,rgba(151,101,38,.72),transparent);
}

html body #base-app .system-card h3 svg,
html body #base-app .bonus-card h3 svg{
    display:block!important;
    width:25px!important;
    height:25px!important;
    padding:5px!important;
    flex:0 0 25px!important;
    color:#f7dda0!important;
    border:1px solid #75501f!important;
    border-radius:50%!important;
    background:linear-gradient(180deg,#d7a54b 0%,#81521d 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 2px 5px rgba(58,36,15,.22)!important;
}

html body #base-app #panel-cost{
    gap:7px!important;
}

html body #base-app #panel-cost .cost-item{
    min-height:43px!important;
    padding:6px 11px 6px 7px!important;
    gap:7px!important;
    border-color:#6e573a!important;
    background:linear-gradient(180deg,#4a4740 0%,#292925 100%)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.13),0 3px 6px rgba(41,27,13,.18)!important;
}

html body #base-app #panel-cost .cost-item svg{
    display:none!important;
}

html body #base-app #panel-cost .cost-item:before{
    content:"";
    width:29px;
    height:29px;
    flex:0 0 29px;
    border-radius:50%;
    background-position:center;
    background-repeat:no-repeat;
    background-size:contain;
    filter:drop-shadow(0 2px 2px rgba(0,0,0,.42));
}

html body #base-app #panel-cost .cost-gold:before{background-image:url("assets/ui/resources/resource-gold-v1.png")}
html body #base-app #panel-cost .cost-wood:before{background-image:url("assets/ui/resources/resource-wood-v1.png")}
html body #base-app #panel-cost .cost-stone:before{background-image:url("assets/ui/resources/resource-stone-v1.png")}

html body #base-app .building-tab,
html body #base-app .building-tab:nth-child(n){
    min-height:56px!important;
    grid-template-columns:40px minmax(0,1fr)!important;
    column-gap:8px!important;
    padding:7px 8px!important;
}

html body #base-app .building-tab svg{
    width:38px!important;
    height:38px!important;
    padding:9px!important;
    border-radius:50%!important;
    border-width:2px!important;
    outline:1px solid rgba(238,196,111,.2)!important;
    outline-offset:2px!important;
    filter:drop-shadow(0 2px 2px rgba(18,12,7,.42));
    transition:transform .18s ease,filter .18s ease!important;
}

html body #base-app .building-tab:hover:not(:disabled) svg{
    transform:translateY(-1px) scale(1.06)!important;
    filter:drop-shadow(0 3px 3px rgba(18,12,7,.5));
}

html body #base-app .building-tab.active svg{
    color:#f5c968!important;
    background:linear-gradient(180deg,#4b3928 0%,#281f18 100%)!important;
    border-color:#ffe0a0!important;
    outline-color:rgba(255,237,190,.48)!important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.14),0 0 12px rgba(255,200,91,.34)!important;
}

html body #base-app .building-tab strong{
    font-size:12px!important;
}

html body #base-app .building-tab em,
html body #base-app .building-tab small{
    font-size:9px!important;
}

html body #base-app .btn-icon,
html body #base-app .upgrade-time svg{
    filter:drop-shadow(0 1px 1px rgba(38,23,10,.34));
}

/* Readability pass: preserve labels before secondary timing metadata. */
html body #base-app #panel-time,
html body #base-app #panel-time span{
    color:#5a422d!important;
    text-shadow:none!important;
}

html body #base-app #panel-time svg{
    color:#b97824!important;
}

html body #base-app .building-tab span{
    min-width:0!important;
    width:auto!important;
    overflow:visible!important;
}

html body #base-app .building-tab strong{
    width:auto!important;
    max-width:none!important;
    line-height:1.08!important;
}

html body #base-app .captain-head{
    align-items:start!important;
}

html body #base-app .captain-card .captain-head strong{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    line-height:1.08!important;
    display:-webkit-box!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
}

html body #base-app .captain-card .captain-info small{
    font-size:10px!important;
    line-height:1.2!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
}

html body #base-app .captain-card .captain-info span{
    font-size:11px!important;
}

@media (max-width:1400px){
    html body #base-app .building-tab,
    html body #base-app .building-tab:nth-child(n){
        grid-template-columns:29px minmax(0,1fr)!important;
        grid-template-rows:1fr!important;
        column-gap:5px!important;
        padding:6px 5px!important;
    }

    html body #base-app .building-tab svg{
        width:28px!important;
        height:28px!important;
        padding:6px!important;
    }

    html body #base-app .building-tab span{
        grid-column:2!important;
        width:auto!important;
        min-width:0!important;
        overflow:visible!important;
    }

    html body #base-app .building-tab strong{
        font-size:10px!important;
        white-space:normal!important;
        overflow:visible!important;
        text-overflow:clip!important;
        display:-webkit-box!important;
        -webkit-box-orient:vertical!important;
        -webkit-line-clamp:2!important;
    }

    html body #base-app .building-tab em,
    html body #base-app .building-tab small{
        display:none!important;
    }
}

/* Final dock layout: labels own the content column; time is never a grid column. */
html body #base-app .building-tab,
html body #base-app .building-tab:nth-child(n){
    position:relative!important;
    grid-template-columns:40px minmax(0,1fr)!important;
    grid-template-rows:1fr!important;
    column-gap:8px!important;
    overflow:hidden!important;
}

html body #base-app .building-tab span{
    grid-column:2!important;
    grid-row:1!important;
    align-self:center!important;
    width:100%!important;
    min-width:0!important;
    padding:0!important;
    overflow:visible!important;
}

html body #base-app .building-tab strong{
    display:-webkit-box!important;
    width:100%!important;
    max-width:none!important;
    overflow:hidden!important;
    text-overflow:clip!important;
    white-space:normal!important;
    line-height:1.08!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
}

html body #base-app .building-tab em{
    display:none!important;
}

html body #base-app .building-tab small{
    display:none!important;
    position:absolute!important;
    right:6px!important;
    bottom:4px!important;
    width:auto!important;
    min-width:0!important;
    max-width:none!important;
    padding:1px 4px!important;
    border:0!important;
    border-radius:3px!important;
    background:rgba(17,14,10,.46)!important;
    color:#f7dfaa!important;
    font-size:8px!important;
    line-height:1.15!important;
    overflow:visible!important;
    text-overflow:clip!important;
    white-space:nowrap!important;
    text-shadow:0 1px 1px rgba(0,0,0,.7)!important;
}

html body #base-app .panel h2{
    font-size:20px!important;
    line-height:1.14!important;
    overflow:visible!important;
}

html body #base-app .pirate-production-summary,
html body #base-app .crew-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
}

html body #base-app .pirate-production-summary div{
    padding:8px!important;
}

html body #base-app .pirate-production-summary span,
html body #base-app .pirate-production-summary em,
html body #base-app .pirate-production-summary strong{
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
}

html body #base-app .pirate-production-summary span,
html body #base-app .pirate-production-summary em{
    line-height:1.2!important;
}

html body #base-app .crew-grid .mini-btn{
    min-width:0!important;
    min-height:72px!important;
    padding:8px!important;
}

html body #base-app .crew-grid .mini-btn span,
html body #base-app .crew-grid .mini-btn small{
    max-width:100%!important;
    white-space:normal!important;
    overflow:visible!important;
    text-overflow:clip!important;
    overflow-wrap:anywhere!important;
    line-height:1.12!important;
}

html body #base-app .panel .research-row,
html body #base-app .panel .research-row:nth-child(n){
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    align-items:start!important;
    padding:10px!important;
}

html body #base-app .panel .research-row > div{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:6px!important;
    min-width:0!important;
    width:100%!important;
}

html body #base-app .panel .research-row strong{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:8px!important;
    min-width:0!important;
    width:100%!important;
    font-size:14px!important;
    line-height:1.18!important;
    white-space:normal!important;
    overflow:visible!important;
}

html body #base-app .panel .research-row em{
    flex:0 0 auto!important;
    width:auto!important;
    white-space:nowrap!important;
    font-size:11px!important;
    line-height:1.2!important;
}

html body #base-app .panel .research-row span{
    display:block!important;
    width:100%!important;
    min-width:0!important;
    font-size:11px!important;
    line-height:1.35!important;
    white-space:normal!important;
    overflow:visible!important;
}

html body #base-app .panel .research-row .mini-btn{
    width:100%!important;
    min-width:0!important;
    min-height:38px!important;
}

html body #base-app .building-tab.active small{
    background:rgba(51,29,12,.74)!important;
    color:#fff2ce!important;
    text-shadow:0 1px 1px rgba(30,16,7,.72)!important;
}

html body #base-app .bonus-card li{
    background:linear-gradient(180deg,#e7dbc4 0%,#d7c5a4 100%)!important;
    border:1px solid #b69a70!important;
    color:#49382a!important;
    font-weight:800!important;
    text-shadow:none!important;
}

html body #base-app .bonus-card li:before{
    background:#d3a34c!important;
    box-shadow:0 0 7px rgba(211,163,76,.4)!important;
}

@media (max-width:1400px){
    html body #base-app .building-tab,
    html body #base-app .building-tab:nth-child(n){
        grid-template-columns:29px minmax(0,1fr)!important;
        column-gap:5px!important;
    }

    html body #base-app .building-tab span{
        padding-bottom:0!important;
    }

    html body #base-app .building-tab small{
        display:none!important;
    }
}

@media (min-width:1500px){
    html body #base-app .building-tab,
    html body #base-app .building-tab:nth-child(n){
        grid-template-columns:36px minmax(0,1fr) 36px!important;
        column-gap:6px!important;
        padding:6px!important;
    }

    html body #base-app .building-tab svg{
        width:36px!important;
        height:36px!important;
        padding:8px!important;
    }

    html body #base-app .building-tab span{
        grid-column:2!important;
        padding:0!important;
    }

    html body #base-app .building-tab strong{
        font-size:11px!important;
    }

    html body #base-app .building-tab small{
        display:block!important;
        position:static!important;
        grid-column:3!important;
        grid-row:1!important;
        align-self:center!important;
        justify-self:end!important;
        width:auto!important;
        max-width:36px!important;
        padding:2px 3px!important;
        overflow:hidden!important;
        text-overflow:ellipsis!important;
    }
}

/* Generated PNG building assets: same object-first language as resource icons. */
html body #base-app .building-tab-png{
    grid-column:1!important;
    grid-row:1!important;
    align-self:center!important;
    justify-self:center!important;
    width:34px!important;
    height:34px!important;
    max-width:none!important;
    object-fit:contain!important;
    pointer-events:none!important;
    filter:drop-shadow(0 3px 3px rgba(18,12,7,.5)) saturate(1.04)!important;
    transform:translateZ(0)!important;
    transition:transform .18s ease,filter .18s ease!important;
}

html body #base-app .building-tab:hover:not(:disabled) .building-tab-png{
    transform:translateY(-1px) scale(1.07)!important;
    filter:drop-shadow(0 4px 4px rgba(18,12,7,.58)) saturate(1.1) brightness(1.04)!important;
}

html body #base-app .building-tab.active .building-tab-png{
    transform:scale(1.06)!important;
    filter:drop-shadow(0 0 7px rgba(255,220,132,.78)) drop-shadow(0 3px 3px rgba(62,31,10,.5)) saturate(1.12) brightness(1.06)!important;
}

@media (max-width:1400px){
    html body #base-app .building-tab-png{
        width:27px!important;
        height:27px!important;
    }
}

@media (min-width:1500px){
    html body #base-app .building-tab,
    html body #base-app .building-tab:nth-child(n){
        grid-template-columns:35px minmax(0,1fr) 32px!important;
        column-gap:5px!important;
        padding:5px!important;
    }

    html body #base-app .building-tab-png{
        width:34px!important;
        height:34px!important;
    }

    html body #base-app .building-tab strong{
        display:block!important;
        width:100%!important;
        font-size:10px!important;
        line-height:1.08!important;
        white-space:normal!important;
        overflow:visible!important;
        -webkit-line-clamp:unset!important;
    }

    html body #base-app .building-tab small{
        max-width:32px!important;
        font-size:7px!important;
    }
}

html body #base-app #upgrade-btn .upgrade-worker-icon[hidden]{
    display:none!important;
}

html body #base-app #upgrade-btn.workers-busy{
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    gap:8px!important;
    min-height:58px!important;
    padding:5px 12px!important;
}

html body #base-app #upgrade-btn.workers-busy .btn-icon{
    display:none!important;
}

html body #base-app #upgrade-btn .upgrade-worker-icon{
    width:44px!important;
    height:44px!important;
    flex:0 0 44px!important;
    object-fit:contain!important;
    filter:drop-shadow(0 3px 3px rgba(29,18,9,.38))!important;
}

html body #base-app #upgrade-btn.workers-busy span{
    min-width:0!important;
    color:#2e2923!important;
    font-size:13px!important;
    line-height:1.1!important;
    white-space:normal!important;
}

/* Balanced V14 dock: one visual rhythm for icons, labels and duration badges. */
html body #base-app .building-dock{
    grid-template-columns:repeat(8,minmax(0,1fr))!important;
    grid-auto-columns:auto!important;
    gap:6px!important;
    height:83px!important;
    min-height:83px!important;
    padding:12px 8px 7px!important;
    overflow:visible!important;
}

html body #base-app .building-tab,
html body #base-app .building-tab:nth-child(n){
    position:relative!important;
    display:grid!important;
    grid-template-columns:44px minmax(0,1fr)!important;
    grid-template-rows:1fr!important;
    align-items:center!important;
    column-gap:6px!important;
    width:100%!important;
    min-width:0!important;
    height:62px!important;
    padding:5px 34px 5px 5px!important;
    overflow:hidden!important;
}

html body #base-app .building-tab-png{
    grid-column:1!important;
    grid-row:1!important;
    width:42px!important;
    height:42px!important;
    align-self:center!important;
    justify-self:center!important;
}

html body #base-app .building-tab span{
    grid-column:2!important;
    grid-row:1!important;
    display:flex!important;
    align-items:center!important;
    min-width:0!important;
    height:100%!important;
    padding:0!important;
}

html body #base-app .building-tab strong{
    display:block!important;
    width:100%!important;
    font-size:11px!important;
    line-height:1.2!important;
    text-align:left!important;
    white-space:normal!important;
    overflow:visible!important;
    overflow-wrap:normal!important;
    word-break:normal!important;
    -webkit-line-clamp:unset!important;
}

html body #base-app .building-tab small{
    display:block!important;
    position:absolute!important;
    top:5px!important;
    right:4px!important;
    width:auto!important;
    max-width:28px!important;
    padding:2px 3px!important;
    border-radius:4px!important;
    font-size:7px!important;
    line-height:1!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
}

html body #base-app #upgrade-btn.workers-busy{
    min-height:48px!important;
    gap:6px!important;
    padding:5px 12px!important;
}

html body #base-app #upgrade-btn .upgrade-worker-icon{
    width:30px!important;
    height:30px!important;
    flex:0 0 30px!important;
}

html body #base-app #upgrade-btn.workers-busy span{
    font-size:12px!important;
}

html body #base-app .crew-grid .mini-btn{
    position:relative!important;
    display:grid!important;
    grid-template-columns:54px minmax(0,1fr)!important;
    grid-template-rows:auto auto!important;
    align-items:center!important;
    gap:2px 7px!important;
    min-height:72px!important;
    padding:6px 25px 6px 6px!important;
    text-align:left!important;
    overflow:hidden!important;
}

html body #base-app .crew-grid{
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px!important;
}

html body #base-app .crew-grid .crew-unit-icon{
    grid-column:1!important;
    grid-row:1 / 3!important;
    width:52px!important;
    height:60px!important;
    object-fit:contain!important;
    align-self:end!important;
    justify-self:center!important;
    pointer-events:none!important;
    filter:drop-shadow(0 3px 3px rgba(32,18,8,.38))!important;
}

html body #base-app .crew-grid .mini-btn span{
    grid-column:2!important;
    grid-row:1!important;
    align-self:end!important;
    font-size:13px!important;
    line-height:1.08!important;
    text-align:left!important;
    white-space:nowrap!important;
}

html body #base-app .crew-grid .mini-btn small{
    grid-column:2!important;
    grid-row:2!important;
    align-self:start!important;
    justify-self:start!important;
    max-width:100%!important;
    font-size:9px!important;
    line-height:1!important;
}

html body #base-app .crew-grid .mini-btn b{
    position:absolute!important;
    top:5px!important;
    right:5px!important;
    min-width:18px!important;
    padding:2px 4px!important;
    font-size:9px!important;
    line-height:1!important;
}

@media (max-width:1400px){
    html body #base-app .building-tab,
    html body #base-app .building-tab:nth-child(n){
        grid-template-columns:31px minmax(0,1fr)!important;
        column-gap:4px!important;
        height:56px!important;
        padding:4px 4px!important;
    }

    html body #base-app .building-tab-png{
        width:30px!important;
        height:30px!important;
    }

    html body #base-app .building-tab strong{
        font-size:9px!important;
        text-align:center!important;
    }

    html body #base-app .building-tab small{
        display:none!important;
    }
}