@layer fleetwatch, refinements244, adventure, button-silhouette;
/* One material kit for the actual game and its asset gallery.
   Nine-slice corners stay fixed. Textures tile; paintings keep their aspect ratio. */
:root{
 --asset-panel-frame:url('/art/interface-v4/panel-frame.webp');
 --asset-button-frame:url('/art/interface-v4/button-frame.webp');
 --asset-progress-frame:url('/art/interface-v3/progress-frame.webp');
 --asset-timber:url('/art/interface-v4/deck-fill.webp');
 --asset-blue:url('/art/interface-v3/blue-fill.webp');
 --asset-paper:url('/art/interface-v3/parchment-fill.webp');
}
.kit-panel{border:12px solid transparent;border-image:var(--asset-panel-frame) 180 / 28px / 0 stretch;background:#201a16 var(--asset-timber) center/384px;color:#f9e9ce;padding:15px}
.kit-button{border:7px solid transparent;border-image:var(--asset-button-frame) 100 170 / 14px 22px / 0 stretch;border-radius:9px;background:#32231a var(--asset-timber) center/320px;color:#ffedc8;padding:5px 15px;min-height:44px;box-shadow:inset 0 2px 5px #fff2,0 2px 3px #0004;font:inherit;text-shadow:0 1px 2px #1c100b}
.kit-button.selected{background:#174b7c var(--asset-blue) center/256px;color:#fff6df;box-shadow:inset 0 0 8px #64bce957,0 0 0 1px #efc772}
.kit-button:disabled{filter:saturate(.3);opacity:.6;cursor:not-allowed}
.kit-button:not(:disabled):hover{filter:brightness(1.15)}
.kit-progress{appearance:none;width:100%;height:16px;border:3px solid transparent;border-image:var(--asset-progress-frame) 40 110 / 5px 13px / 0 stretch;border-radius:8px;overflow:hidden;background:#081e2b;--bar-fill:linear-gradient(#a2ecf3,#32add8 45%,#1b659e 95%)}
.kit-progress::-webkit-progress-bar{background:#081e2b;border-radius:5px;box-shadow:inset 0 1px 3px #000}
.kit-progress::-webkit-progress-value{background:var(--bar-fill);border-radius:4px;box-shadow:inset 0 1px #f4ffe9b0}
.kit-progress::-moz-progress-bar{background:var(--bar-fill);border-radius:4px}
.kit-progress[data-fill=warn]{--bar-fill:linear-gradient(#ffe9a0,#e9b943 48%,#a56c26)}
.kit-progress[data-fill=full]{--bar-fill:linear-gradient(#ffae7b,#d75a36 48%,#923026)}

:root body#realm-ui[data-ui-theme]{--cabin:var(--asset-timber);--reading-paper:linear-gradient(#fff5e1a8,#fff0d5a8),var(--asset-paper) center/512px;--command-blue:#165285 var(--asset-blue) center/256px}
/* Main panels retain their existing geometry and keep the scenery unobstructed. */
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.carved-panel,.construction-catalog,.build-dossier,.construction-queue,.building-showcase,.recruitment-workbench,.scene-orders,.research-monitor,.council-board,.correspondence-board,.ranking-board,.trade-board,.report-journal,.guide-reader,.account-card,.fleet-board){border-width:10px;border-image-source:var(--asset-panel-frame);border-image-slice:220;border-image-width:32px;border-image-outset:0;border-radius:10px;box-shadow:0 4px 10px #03131b55}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.study-heading,.post-heading,.council-heading,.fleet-board-heading,.construction-catalog>header,.construction-queue>header,.recruitment-order>header,.recruitment-catalog-heading,.plan-heading,.scene-orders-heading){background:#201a16 var(--asset-timber) center/384px;color:#ffe8b7}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.queue-plans,.work-queue,.scene-build-plan)>summary{background:#291f18 var(--asset-timber) center/384px!important}
/* Small frames also cover filters and queue controls, not just the primary action. */
:root body#realm-ui[data-ui-theme] :is(#workspace,#sidebar) :is(button.primary,.island-subnav nav button,.construction-catalog nav>button,.fleet-tabs>button,.ranking-tabs>button,.tab-strip>button,.realm-section-tabs>button,.mobile-menu-tools>button,.queue-controls>button,.order-controls>button,.plan-row-controls>button,.scene-plan-tools>button,.work-queue li>div>button,.recruitment-quantity>button):not(.info-button){border:5px solid transparent!important;border-image:var(--asset-button-frame) 100 170 / 14px 22px / 0 stretch!important;border-radius:16px;background-clip:padding-box!important;background:#30241b var(--asset-timber) center/320px!important;color:#fff0cd;box-shadow:inset 0 1px 3px #fff2,0 1px 3px #0003;text-shadow:0 1px 2px #170e0b}
:root body#realm-ui[data-ui-theme] #workspace :is(button.primary,.island-subnav nav button.active,.construction-catalog nav>button[aria-pressed=true],.fleet-tabs>button.active,.ranking-tabs>button.active,.tab-strip>button.active,.realm-section-tabs>button.active){background:#175283 var(--asset-blue) center/256px!important;color:#fff5dc;box-shadow:inset 0 0 7px #7dc9f44d}
:root body#realm-ui[data-ui-theme] #workspace :is(.construction-catalog nav,.fleet-tabs,.ranking-tabs,.tab-strip,.realm-section-tabs)>button:is([aria-pressed=true],[aria-current=page],.active){background:#175283 var(--asset-blue) center/256px!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page button.primary:not(:disabled),
:root body#realm-ui[data-ui-theme] #workspace .island-subnav nav button:is(.active,[aria-pressed=true],[aria-current=page]):not(:disabled){background:#175283 var(--asset-blue) center/256px!important;color:#fff5dc;box-shadow:inset 0 0 8px #7dc9f44d}
:root body#realm-ui[data-ui-theme] #workspace #content-page button.primary:disabled{background:#35342d var(--asset-timber) center/320px!important;filter:saturate(.2);color:#dfd8c8;box-shadow:none}
:root body#realm-ui[data-ui-theme] #workspace :is(.construction-catalog #building-ribbon>button,.recruitment-catalog>button){border-image:var(--asset-panel-frame) 180 / 11px / 0 stretch;border-radius:7px;background:#171f26}
:root body#realm-ui[data-ui-theme] #workspace :is(.construction-catalog #building-ribbon>button,.recruitment-catalog>button)[aria-pressed=true]{background:#175283 var(--asset-blue) center/256px;box-shadow:inset 0 0 0 2px #ffe3a1,0 0 8px #69bcf299}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch-title{border-image:var(--asset-button-frame) 105 115 / 9px 11px / 0 stretch;background:#261e18 var(--asset-timber) center/320px;border-radius:7px}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch.selected .research-branch-title{background:#175283 var(--asset-blue) center/256px}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-selected-art>img:not(.painted-icon){display:none}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-selected-art>.painted-icon{inset:0;position:absolute;width:100%;height:100%;object-fit:contain;transform:none;margin:0}
:root body#realm-ui[data-ui-theme] progress:not(.resource-gauge){appearance:none;border:2px solid transparent;border-image:var(--asset-progress-frame) 40 110 / 4px 10px / 0 stretch;border-radius:8px;background:#091d29;--bar-fill:linear-gradient(#a2ecf3,#32add8 45%,#1b659e 95%)}
:root body#realm-ui[data-ui-theme] progress:not(.resource-gauge)::-webkit-progress-bar{background:#091d29;border-radius:5px;box-shadow:inset 0 1px 3px #000}
:root body#realm-ui[data-ui-theme] progress:not(.resource-gauge)::-webkit-progress-value{background:var(--bar-fill);border-radius:4px;box-shadow:inset 0 1px #f4ffe9b0}
:root body#realm-ui[data-ui-theme] progress:not(.resource-gauge)::-moz-progress-bar{background:var(--bar-fill);border-radius:4px}
:root body#realm-ui[data-ui-theme] :is(.research-scene-title,.research-project)>.painted-icon{width:36px;height:36px;object-fit:contain}
:root body#realm-ui[data-ui-theme] #workspace button.secondary{border-image:var(--asset-button-frame) 100 170 / 14px 22px / 0 stretch;background:#30241b var(--asset-timber) center/320px;border-radius:7px;color:#fff0cd}
:root body#realm-ui[data-ui-theme] #workspace .resource-gauge{border:1px solid transparent;border-image:var(--asset-progress-frame) 40 110 / 2px 6px / 0 stretch;border-radius:5px;height:6px}
@media(max-width:950px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page :is(.carved-panel,.construction-catalog,.build-dossier,.construction-queue,.recruitment-workbench,.scene-orders,.research-monitor){border-width:5px;border-image-width:18px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch-title{border-image-width:8px 10px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .scene-ribbon-shell #building-ribbon>button{border-image:var(--asset-panel-frame) 180 / 8px / 0 stretch}
 :root body#realm-ui[data-ui-theme] #sidebar .mobile-menu-tools>button{padding:5px 10px}
}
/* Rounded, sculpted surfaces: the scene leads, panels carry only decisions. */
:root body#realm-ui[data-ui-theme]{--warm-ink:#fff0cf;--warm-muted:#dfcba5;--warm-surface:linear-gradient(#211b16d9,#191615ee),var(--asset-timber) center/460px;--weathered-oak:linear-gradient(#2c211aea,#191714f5),var(--asset-timber);--command-blue:linear-gradient(#3384be55,#103b6a66),var(--asset-blue)}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.carved-panel,.construction-catalog,.build-dossier,.construction-queue,.recruitment-workbench,.scene-orders,.research-monitor,.council-board,.correspondence-board,.ranking-board,.trade-board,.report-journal,.guide-reader,.account-card,.fleet-board){border-radius:25px 21px 24px 20px;background-clip:padding-box!important;box-shadow:0 9px 24px #160f0a55;overflow:hidden}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.carved-panel,.study-board,.construction-catalog,.build-dossier,.construction-queue,.recruitment-workbench,.scene-orders,.research-monitor,.council-board,.correspondence-board,.ranking-board,.trade-board,.report-journal,.account-card,.fleet-board){background:var(--warm-surface)!important;color:var(--warm-ink)}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.study-heading,.post-heading,.council-heading,.fleet-board-heading,.construction-catalog>header,.construction-queue>header,.recruitment-order>header,.recruitment-catalog-heading,.plan-heading,.scene-orders-heading){background:linear-gradient(#7b522a33,#130d0a55),var(--asset-timber) center/460px;color:#ffe1a0;border-bottom-color:#cba05b66}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.queue-track,.queue-plans,.queue-plan-scroll,.work-queue,.scene-build-plan,.recruitment-status,.research-contribution,.desk-metrics,.desk-orders,.desk-post,.desk-latest,.desk-shortcuts,.chat-toolbar,.chat-compose,.report-summary,.guide-index,.guide-categories,.captain-stats,.route-create-panel){background:#211c17ed!important;border-radius:12px;color:var(--warm-ink)}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.active-construction,.scene-job,.scene-queued-job,.work-queue li,.construction-orders>li,.fleet-row,.stationed-fleet,.council-member,.chat-message,.guide-topic,.guide-achievement,.account-session){background:linear-gradient(110deg,#44342480,#211a16d9)!important;border:1px solid #b390532b;border-radius:10px;box-shadow:inset 0 1px #ffe1a00b}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.queue-plans,.work-queue,.scene-build-plan)>summary{border-radius:10px;background:linear-gradient(#6d472733,#170f0a44),var(--asset-timber) center/460px!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.research-selection,.recruitment-order,.recruitment-stats,.recruitment-quantity,.fleet-order){background:#211b17;color:var(--warm-ink);border-radius:12px}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(input,select,textarea){border-radius:9px;background:#171511;color:var(--warm-ink);border-color:#aa854d}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.guide-topic-list,.chat-messages,.painted-ranking-table tbody,.report-list){background:#201a16;color:var(--warm-ink);border-radius:12px}
:root body#realm-ui[data-ui-theme] #workspace #content-page .painted-ranking-table tbody tr:nth-child(even){background:#4939234d}
/* An inset image has its own soft edge, rather than a second hairline box. */
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.construction-catalog #building-ribbon>button,.recruitment-catalog>button,.scene-ribbon-shell #building-ribbon>button){border-radius:14px;background-clip:padding-box;box-shadow:0 3px 6px #09060255}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.catalog-art,.scene-tile-art){border-radius:10px 10px 5px 5px;overflow:hidden}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.catalog-art img,.scene-tile-art img){filter:none}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.construction-catalog #building-ribbon>button,.recruitment-catalog>button)[aria-pressed=true]{background:var(--command-blue);box-shadow:inset 0 0 0 2px #ffd77c,0 0 12px #e8ba4f55}
/* Make the whole dossier a compact decision panel in the illustrated scene. */
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier{--reading-paper:transparent;--reading-ink:#fff0cf;--reading-secondary:#dfcba5}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier :is(.dossier-paper,.upgrade-compare,.upgrade-payment,.upgrade-levels,.upgrade-effects,.upgrade-effects>div){background:none!important;color:var(--warm-ink)!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier article>header{background:linear-gradient(#7b522a33,#130d0a55),var(--asset-timber) center/460px;border-bottom:1px solid #d3a85b66}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier article>header>img{border:0;filter:none}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier :is(.dossier-paper small,.planned-notice,.upgrade-footnote,.upgrade-resource>span,.modifier-before){color:var(--warm-muted)!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier .upgrade-resource.short strong{color:#ffb19a!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier .modifier-gain{color:#ceec92!important;background:#628b2b33;border:0;border-radius:8px}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier .upgrade-levels b{border:1px solid #d7ac62;background:#163e58;border-radius:9px;color:#ffe2a2;box-shadow:inset 0 1px #fff3}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier .building-readiness{background:#51402b;color:#ffdeb1;border-radius:9px}
:root body#realm-ui[data-ui-theme] #workspace #content-page .build-dossier .upgrade-payment{border-top:1px solid #d5ab6266}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch{background:#211a1688;border-color:#c1985238;border-radius:12px;overflow:hidden}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch.selected{background:linear-gradient(#16517a99,#1b242a77);border-color:#f1cb7c}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch-title{border-radius:12px;background-clip:padding-box!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-policy{background:#35281ddf;color:#fbe7bb;border-bottom:1px solid #bd945b66}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-policy :is(span,strong,small){color:#fbe7bb}
@media(min-width:951px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen{position:relative;isolation:isolate;display:grid;grid-template-columns:minmax(0,1fr) clamp(350px,30vw,440px);grid-template-rows:minmax(0,1fr) 204px;grid-template-areas:'visual details' 'catalog queue';gap:14px;padding:18px;margin:0;height:calc(100dvh - var(--workspace-top,140px) - var(--notice-height,36px) - 12px);min-height:440px;align-items:start;border-radius:20px;overflow:hidden}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .building-showcase{position:absolute;inset:0;grid-area:auto;width:100%;height:100%;min-height:0;z-index:-1;border:0;border-image:none;border-radius:18px;background:none;box-shadow:none;overflow:hidden}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-scene{width:100%;height:100%;max-width:none}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .building-showcase::after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 55%,#17374433 75%,#11394777)}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .island-overview-button{top:16px;left:18px;right:auto;bottom:auto;z-index:3}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .showcase-plaque{display:none}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .build-dossier{align-self:start;height:auto;max-height:100%;overflow:auto;scrollbar-width:thin}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .build-dossier>article{height:auto;min-height:0;display:block}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .dossier-paper{padding:12px 14px;display:block;min-height:0;flex:none}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .dossier-details{flex:none;min-height:0;overflow:visible}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .build-dossier h2{font-size:25px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-levels{font-size:14px;gap:8px;margin-bottom:7px;padding-bottom:7px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-effects>div{grid-template-columns:27px minmax(0,1fr);min-height:30px;gap:3px 8px;margin:4px 0}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-effects dd{grid-column:2;gap:8px;font-size:16px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-payment{grid-template-columns:1fr;display:block;margin-top:10px;padding-top:10px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-resource{padding:3px 6px;grid-template-columns:28px 1fr}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-resource strong{font-size:21px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-resource small{font-size:11px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-order{display:grid;grid-template-columns:1fr auto;gap:4px 10px;border:0;border-top:1px solid #cba05b44;margin:10px 0 0;padding:9px 0 0;align-items:center}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-order>span{grid-column:1;grid-row:1;font-size:12px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-order>strong{grid-column:1;grid-row:2;font-size:18px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-order>button{grid-column:2;grid-row:1/3;min-height:46px;margin:0}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-order>small{grid-column:1/-1;text-align:center;font-size:11px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .construction-catalog{align-self:end;height:204px;max-width:100%;min-height:0;border-width:8px;padding:0 4px 4px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .construction-catalog>header{padding:2px 5px;min-height:38px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .construction-catalog #building-ribbon>button{flex:0 0 150px;max-width:none}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .construction-catalog .catalog-art{min-height:90px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen #construction-queue{align-self:stretch;height:204px;min-height:0;padding:0 3px 3px;overflow:hidden}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen #construction-queue>header{flex-wrap:wrap;gap:4px;min-height:42px;padding:4px 6px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen #construction-queue>header h3{font-size:17px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen #construction-queue .construction-state{display:none}
}
@media(min-width:951px) and (max-height:820px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen{grid-template-rows:minmax(0,1fr) 150px;padding:10px;gap:10px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen #construction-queue{height:150px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .build-dossier article>header{min-height:44px;padding:3px 8px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .dossier-paper{padding:7px 10px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-effects>div{grid-template-columns:22px 1fr auto;min-height:25px;gap:3px;font-size:12px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-effects dd{grid-column:3;font-size:14px;gap:3px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-effects dt{font-size:12px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-effects .painted-icon{width:22px;height:22px;grid-row:1}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-levels{margin:0;padding-bottom:3px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-payment{margin-top:4px;padding-top:4px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-order{margin-top:4px;padding-top:4px}
}
@media(max-width:950px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page :is(.carved-panel,.construction-catalog,.build-dossier,.construction-queue,.recruitment-workbench,.scene-orders,.research-monitor){border-radius:18px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen{gap:7px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .research-policy{padding:5px 10px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch.selected>.research-ladder{background:#34291e;border-radius:12px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-portrait{border-radius:14px;background:radial-gradient(ellipse at center,#46606b55,transparent 70%)}
}


/* Short desktop windows retain a visible action footer and full-sized thumbnails. */
@media(min-width:951px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .construction-catalog{display:grid;grid-template-rows:38px minmax(0,1fr);height:204px;max-height:none}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-catalog .catalog-scroll{min-height:0;height:100%;align-items:stretch}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-catalog #building-ribbon{height:100%;align-items:stretch;padding:3px 0;overflow-y:hidden}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-catalog #building-ribbon>button{height:100%;min-height:0;display:grid;grid-template-rows:minmax(90px,1fr) auto auto;gap:2px;padding:5px 7px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-catalog .catalog-art{height:100%;min-height:90px;width:100%;margin:0}
}
@media(min-width:951px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .build-dossier{height:100%;max-height:480px;overflow:hidden}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .build-dossier>article{height:100%;display:flex;flex-direction:column}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .build-dossier article>header{flex:none}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .dossier-paper{flex:1;display:flex;flex-direction:column;min-height:0}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .dossier-details{flex:1;overflow:auto;min-height:0}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .construction-screen .upgrade-payment{flex:none}
}
.kit-panel{border-image-slice:220;border-image-width:36px;border-radius:24px;background-clip:padding-box}
.kit-button{border-radius:16px;background-clip:padding-box}

:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.study-board,.research-selection,.research-branch,.desk-board,.ranking-table-wrap,.empty-state){background:linear-gradient(#2c211aea,#191714f5),var(--asset-timber)!important;background-size:auto,460px;color:var(--warm-ink)}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch.selected{background:linear-gradient(#183b55f0,#152b3be8),var(--asset-blue)!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch-title{background:linear-gradient(#34271ddd,#211913ef),var(--asset-timber)!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .research-branch.selected .research-branch-title{background:var(--command-blue)!important}

/* Portraits are independent cutouts, never squeezed into the title lettering. */
@media(min-width:951px) and (min-height:821px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-workbench{grid-template-columns:164px minmax(0,1fr)}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-portrait{width:156px;height:154px;min-height:0}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-portrait>img{width:150px;height:130px;margin:0 0 16px;object-fit:contain}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-workbench .recruitment-order>header{min-height:160px;padding-left:170px}
}
@media(max-width:950px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-workbench{grid-template-rows:100px auto}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-workbench .recruitment-order>header{min-height:100px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-portrait{height:100px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-portrait>img{height:84px;object-fit:contain}
}

/* The same small moulding is used by the secondary destinations. */
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.realm-island-actions>button,.desk-shortcuts>button,.guide-action,.guide-filter-button,.island-overview-button){border:5px solid transparent!important;border-image:var(--asset-button-frame) 100 170 / 14px 22px / 0 stretch!important;border-radius:16px;background:#33261e var(--asset-timber) center/320px!important;background-clip:padding-box!important;color:#fff0cf;box-shadow:0 2px 5px #1b100a55}
:root body#realm-ui[data-ui-theme] #workspace #content-page .guide-filter-button.is-active{background:#175283 var(--asset-blue) center/256px!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .realm-island-card{border:8px solid transparent;border-image:var(--asset-panel-frame) 220 / 28px / 0 stretch;border-radius:22px;overflow:hidden;background-clip:padding-box;box-shadow:0 8px 20px #21150b55}
:root body#realm-ui[data-ui-theme] #workspace #content-page .realm-island-card .realm-island-ledger{background:var(--warm-surface)!important;color:var(--warm-ink)!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .realm-island-card .realm-island-ledger :is(.realm-stock,.realm-stock span,.realm-island-order){color:var(--warm-ink)!important;background:none!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .realm-island-picture{border-radius:14px 14px 0 0}

@media(min-width:951px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-screen{grid-template-columns:minmax(0,1fr) clamp(360px,32vw,480px)}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-workbench{align-self:start;height:auto;max-height:100%;overflow:auto}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-order{height:auto;min-height:0}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-status{max-width:540px}
}
@media(min-width:951px) and (min-height:821px){
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-screen{grid-template-rows:minmax(0,1fr) 34px 160px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-catalog{height:160px}
 :root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-catalog img{height:84px;width:100%;object-fit:contain}
}

:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.recruitment-status,.work-queue,.recruitment-catalog,.combat-monitor,.guide-reader,.guide-task,.guide-steps,.guide-achievement-ledger,.desk-board){border-image-source:var(--asset-panel-frame);border-image-slice:220;border-image-width:26px;border-radius:20px;background-clip:padding-box!important}

:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.combat-squad,.combat-unit){border-radius:14px;background:linear-gradient(110deg,#153c59eb,#132531f5);border-color:#bfa06a88;background-clip:padding-box;box-shadow:0 3px 8px #0d111655}
:root body#realm-ui[data-ui-theme] #workspace #content-page .hostile .combat-squad{background:linear-gradient(110deg,#65332be8,#331d1df5)}
:root body#realm-ui[data-ui-theme] #workspace #content-page .combat-squad.selected{outline:0;box-shadow:inset 0 0 0 2px #ffda82,0 0 10px #e6b44e44}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.combat-notebook,.combat-unit-detail,.combat-tabs,.combat-actions){background:var(--warm-surface)!important;background-clip:padding-box;border-radius:14px}
:root body#realm-ui[data-ui-theme] #workspace #content-page :is(.combat-tabs>button:not(.info-button),.combat-actions>button.secondary){border-image:var(--asset-button-frame) 100 170 / 14px 22px / 0 stretch!important;border-radius:16px;background:#38291c var(--asset-timber) center/320px!important;background-clip:padding-box!important;color:var(--warm-ink)}
:root body#realm-ui[data-ui-theme] #workspace #content-page .combat-tabs>button[aria-pressed=true]{background:#175283 var(--asset-blue) center/256px!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .combat-actions>button.combat-retreat{background:linear-gradient(#8d332ab8,#58231ccc),var(--asset-timber)!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .combat-health{border-radius:7px;overflow:hidden}

:root body#realm-ui[data-ui-theme] #workspace #content-page .painted-ranking-table{background:#241d17;border-radius:14px;border-color:#b3915c66}

:root body#realm-ui[data-ui-theme] #workspace #content-page .realm-island-card .realm-island-ledger :is(strong,span,small,b){color:var(--warm-ink)!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page .recruitment-catalog-heading{background:linear-gradient(#30251eee,#211a16f5),var(--asset-timber)!important;border-radius:10px;color:var(--warm-ink)}

/* The moulding has transparent outer margins. A button's rectangular background
   cannot follow those margins: paint the inset fill and the moulding separately.
   Both layers stay behind text/icons; the original full hit area is preserved. */
@layer button-silhouette {
:root .kit-button,
:root body#realm-ui[data-ui-theme] :is(#workspace,#sidebar) :is(button.primary,button.secondary,.island-subnav nav button,.construction-catalog nav>button,.fleet-tabs>button,.ranking-tabs>button,.tab-strip>button,.realm-section-tabs>button,.mobile-menu-tools>button,.queue-controls>button,.order-controls>button,.plan-row-controls>button,.scene-plan-tools>button,.work-queue li>div>button,.recruitment-quantity>button,.realm-island-actions>button,.desk-shortcuts>button,.guide-action,.guide-filter-button,.island-overview-button,.research-branch-title,.combat-tabs>button):not(.info-button){
 --button-fill:#30241b var(--asset-timber) center/320px;
 position:relative!important;isolation:isolate!important;border:5px solid transparent!important;border-image:none!important;
 background:none!important;background-color:transparent!important;box-shadow:none!important;overflow:visible;
}
:root .kit-button::before,
:root body#realm-ui[data-ui-theme] :is(#workspace,#sidebar) :is(button.primary,button.secondary,.island-subnav nav button,.construction-catalog nav>button,.fleet-tabs>button,.ranking-tabs>button,.tab-strip>button,.realm-section-tabs>button,.mobile-menu-tools>button,.queue-controls>button,.order-controls>button,.plan-row-controls>button,.scene-plan-tools>button,.work-queue li>div>button,.recruitment-quantity>button,.realm-island-actions>button,.desk-shortcuts>button,.guide-action,.guide-filter-button,.island-overview-button,.research-branch-title,.combat-tabs>button):not(.info-button)::before{
 content:''!important;display:block!important;position:absolute!important;inset:6px!important;z-index:-2!important;pointer-events:none;
 width:auto!important;height:auto!important;transform:none!important;border:0!important;border-radius:7px!important;background:var(--button-fill)!important;
 box-shadow:inset 0 1px 4px #fff2;opacity:1;
}
:root .kit-button::after,
:root body#realm-ui[data-ui-theme] :is(#workspace,#sidebar) :is(button.primary,button.secondary,.island-subnav nav button,.construction-catalog nav>button,.fleet-tabs>button,.ranking-tabs>button,.tab-strip>button,.realm-section-tabs>button,.mobile-menu-tools>button,.queue-controls>button,.order-controls>button,.plan-row-controls>button,.scene-plan-tools>button,.work-queue li>div>button,.recruitment-quantity>button,.realm-island-actions>button,.desk-shortcuts>button,.guide-action,.guide-filter-button,.island-overview-button,.research-branch-title,.combat-tabs>button):not(.info-button)::after{
 content:''!important;display:block!important;position:absolute!important;inset:-5px!important;z-index:-1!important;pointer-events:none;
 width:auto!important;height:auto!important;transform:none!important;background:none!important;border:0 solid transparent!important;
 border-image:var(--asset-button-frame) 100 170 / 14px 22px / 0 stretch!important;box-shadow:none;opacity:1;
}
:root .kit-button:is(.selected,[aria-pressed=true]),
:root body#realm-ui[data-ui-theme] :is(#workspace,#sidebar) :is(button.primary,.island-subnav nav button,.construction-catalog nav>button,.fleet-tabs>button,.ranking-tabs>button,.tab-strip>button,.realm-section-tabs>button,.guide-filter-button,.combat-tabs>button):is(.primary,.active,.is-active,[aria-pressed=true],[aria-current=page]),
:root body#realm-ui[data-ui-theme] #workspace .research-branch.selected .research-branch-title{--button-fill:#175283 var(--asset-blue) center/256px!important}
:root body#realm-ui[data-ui-theme] #workspace .combat-actions>button.combat-retreat{--button-fill:linear-gradient(#8d332ab8,#58231ccc),var(--asset-timber)!important}
:root body#realm-ui[data-ui-theme] #workspace #content-page button.primary:disabled{--button-fill:#35342d var(--asset-timber) center/320px!important}

:root body#realm-ui[data-ui-theme] #workspace .island-overview-button{position:absolute!important}
}