/* Shared control finish, loaded after the screen styles. Raised faces distinguish
   actions from the flat borders used by informational panels. */
:root {
  --control-face:linear-gradient(180deg,#405570,#283b53);
  --control-edge:#b9ad8e;
  --control-press-distance:2px;
  --control-raised:inset 0 1px 0 #ffffff38,inset 0 -2px 0 #07101e88,0 2px 0 #060e1c,0 4px 7px #0004;
}

:is(#app,#overlay-root) button,
:is(#app,#overlay-root) a.btn {
  box-shadow:var(--control-raised);
  transition:background .15s,border-color .15s,box-shadow .15s,filter .15s,translate .1s;
}

/* Small actions, navigation and utility buttons need a visible face at rest,
   including controls that previously used transparent "ghost" styling. */
:is(#app,#overlay-root) :is(
  .btn,.icon-btn,.nav-item,.menu-choice,.map-view-toggle,.research-mini,
  .unit-row,.roster-row,.report-chip,.language-options button,
  .modal nav button,.city-switcher button,.city-section-tabs button
) {
  background:var(--control-face);
  border:1px solid var(--control-edge);
  color:#fff3db;
  font-weight:600;
  text-shadow:0 1px 1px #0006;
}

/* Gold still identifies the main action; selection remains visibly distinct. */
:is(#app,#overlay-root) :is(.btn.primary,.menu-choice.continue-choice) {
  background:linear-gradient(180deg,#b59758,#80612e);
  border-color:#f1d28c;
  color:#fff9e7;
}

:is(#app,#overlay-root) :is(
  .nav-item.active,.modal nav button.active,.city-section-tabs button.active,
  .city-switcher button.selected,.language-options button[aria-checked=true],
  .map-view-toggle[aria-pressed=true]
) {
  background:linear-gradient(180deg,#626348,#3d493d);
  border-color:#f1d28c;
  color:#fff4cd;
  box-shadow:inset 0 0 0 1px #efd38a66,inset 0 -3px 0 #d8bc7c,0 2px 4px #0005;
}

:is(#app,#overlay-root) .unit-cycle-button {
  background:linear-gradient(180deg,#47765f,#2b5143);
  border-color:#bad3a6;
}

/* Clickable choice cards retain their artwork and semantic colours. */
:is(#app,#overlay-root) button:is(
  .tech-card,.project-card,.agenda-card,.specialisation-option,
  .difficulty-choice,.founding-choice,.origin-card,
  .building-catalogue>button,.encounter-choices>button,.city-role-options>button
):not(:disabled) {
  border-color:#b4a67f;
}

:is(#app,#overlay-root) button:is(.selected,.chosen,.adopted):not(:disabled) {
  border-color:#f1d28c;
}

@media (hover:hover) {
  :is(#app,#overlay-root) button:not(:disabled):not([aria-disabled=true]):hover,
  :is(#app,#overlay-root) a.btn:hover {
    filter:brightness(1.14);
    border-color:#ffe2a0;
    box-shadow:inset 0 1px 0 #ffffff50,inset 0 -2px 0 #07101e88,0 2px 0 #060e1c,0 5px 10px #0006;
  }
}

:is(#app,#overlay-root) button:not(:disabled):not([aria-disabled=true]):active,
:is(#app,#overlay-root) a.btn:active {
  translate:0 var(--control-press-distance);
  filter:brightness(.95);
  box-shadow:inset 0 2px 4px #0008,0 1px 0 #ffffff20;
}

:is(#app,#overlay-root) button:focus-visible,
:is(#app,#overlay-root) a.btn:focus-visible {
  outline:3px solid #ffe2a0;
  outline-offset:3px;
}

:is(#app,#overlay-root) button:disabled,
:is(#app,#overlay-root) button[aria-disabled=true] {
  box-shadow:inset 0 1px 0 #ffffff12;
  cursor:not-allowed;
}

/* Inline links keep their compact layout and communicate interaction with text. */
:is(#app,#overlay-root) :is(.text-link,.resume-link) {
  text-decoration:underline;
  text-underline-offset:3px;
  box-shadow:none;
}

@media (prefers-reduced-motion:reduce) {
  :root { --control-press-distance:0px; }
  :is(#app,#overlay-root) button,
  :is(#app,#overlay-root) a.btn { transition:none; }
}
:root[data-motion=reduced] { --control-press-distance:0px; }
:root[data-motion=reduced] :is(#app,#overlay-root) button,
:root[data-motion=reduced] :is(#app,#overlay-root) a.btn { transition:none; }
/* Clear destinations and actions, shared by desktop and compact screens. */
.modal>.workspace-heading,.modal>.city-drawer-heading{display:flex;flex-direction:column;align-items:flex-start;padding-right:38px;grid-column:1/-1}
.modal>.workspace-heading h2,.modal>.city-drawer-heading h2{order:-1;font-size:clamp(30px,3.6vw,42px);line-height:1.1;margin:0 0 12px;color:#f5e5bd;overflow-wrap:anywhere}
.modal .empire-tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}
.modal .city-production>.world-wonders,.modal .city-production>.city-activities{margin:24px 0 0;padding:20px 0 0;border:0;border-top:1px solid #80918e66;border-radius:0;background:none}
.production-section-title{font:600 23px Georgia;margin:22px 0 8px;color:#f0dfb6}
.tech-requirement{display:block;font-size:12px;font-weight:600;line-height:1.5;margin:5px 0}
.tech-requirement.locked{color:#f1bd88}.tech-requirement.available{color:#b8d3b9}
.card-tech-lock{position:absolute;z-index:2;top:0;left:0;right:0;padding:7px 34px 7px 8px;background:#502e25f5;color:#ffe1bb;font-size:12px;line-height:1.3;text-align:left}
.single-use-label{display:inline-block;color:#f4d6a2;font-size:11px;font-weight:700;line-height:1.4}
.collection-card .single-use-label{padding:3px 10px}.collection-card:has(.card-tech-lock){border-color:#b38359}
.action-hint{position:relative;display:inline-flex;max-width:100%;vertical-align:top}
.action-hint>.btn{white-space:normal}.action-hint:focus-visible{outline:2px solid #f2d492;outline-offset:3px;border-radius:6px}
.action-tooltip{display:none;position:absolute;z-index:40;left:0;top:100%;width:max-content;max-width:min(260px,75vw);padding:9px 11px;background:#101b2b;color:#ffddae;border:1px solid #c59d69;border-radius:6px;box-shadow:0 4px 12px #0007;font-size:12px;line-height:1.4;pointer-events:none}
.action-hint:hover>.action-tooltip,.action-hint:focus>.action-tooltip{display:block}
.site-actions,.relic-site-links{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
/* Keep site titles and actions below navigation and above the card dock. */
.inspector.site-inspector{padding:14px;max-height:min(65dvh,calc(100dvh - 378px));overflow-y:auto}
.inspector.site-inspector .inspector-scroll{display:block;padding:0;overflow:visible;max-height:none}
.site-inspector .extraction-site,.site-inspector .relic-expedition{padding:0;margin:0;border:0}
.site-inspector h3{font:600 25px Georgia;line-height:1.15;margin:5px 0 10px}
.site-inspector .odyssey-art,.site-inspector .extractor-portrait{display:block;max-height:110px;max-width:160px;margin:12px auto;object-fit:contain;float:none}
.steward-resource>.steward-trade{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
@media(max-width:750px){
 .inspector.site-inspector{max-height:min(42dvh,calc(100dvh - 328px));padding:12px;bottom:168px}
 .inspector.site-inspector>.inspector-scroll{display:block!important}
 .site-inspector h3{font-size:22px}.site-inspector p{font-size:12px;line-height:1.5}
 .site-inspector .btn{min-height:36px;padding:7px 9px;font-size:12px}
 .site-inspector .odyssey-art,.site-inspector .extractor-portrait{max-height:80px}
 .card-tech-lock{font-size:11px}.modal .activity-grid{grid-template-columns:1fr}
}
@media(max-height:500px) and (max-width:950px){
 .inspector.site-inspector{bottom:140px;max-height:calc(100dvh - 296px)}
}
@media(max-width:600px){
 .collection-toolbar nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%;min-width:0}
 .collection-toolbar nav button{min-width:0;white-space:normal;overflow-wrap:anywhere}
}

/* Conclave previews keep numbers and costs visible; the workbench holds full rules. */
.collection-help{font-size:13px;color:#c5cfdb;margin:14px 0}
.collection-grid{grid-template-columns:repeat(auto-fill,minmax(205px,1fr));gap:16px}
.collection-card{display:flex;flex-direction:column;gap:10px;min-width:0;padding:0 0 12px;line-height:1.35}
.collection-card-header{display:block;min-width:0}
.collection-card-header>img{display:block;width:100%;height:100px;object-fit:cover}
.collection-card-header>img.detailed-unit{padding:6px;object-fit:contain}
.collection-card-name{display:block;min-width:0;padding:10px 12px 0}
.collection-card-name>.eyebrow{display:block;color:var(--card-tone);font-size:9px;letter-spacing:1px;margin-bottom:5px}
.collection-card-name>strong{display:block;font:400 19px/1.15 Georgia,serif;overflow-wrap:anywhere}
.collection-card-name>.single-use-label{display:inline-block;padding:4px 0 0;font-size:11px}
.collection-origin{display:block;color:#e6d197;font-size:11px;margin-top:4px}
.collection-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px 4px;margin:0 12px}
.collection-stats>span{display:flex;flex-direction:column;min-width:0;gap:2px}
.collection-stats b{font-size:16px;color:#fff1ce;font-variant-numeric:tabular-nums}
.collection-stats>span>span{font-size:11px;line-height:1.25;color:#c5cfdb;overflow-wrap:anywhere}
.collection-effect{display:block;margin:0 12px;font-size:14px;color:#e3e8ed}
.collection-play-cost{display:flex;flex-direction:column;gap:3px;margin:0 12px;font-size:12px}
.collection-play-cost>b{font-weight:500;color:#b9c8d9;font-size:11px}
.collection-play-cost>span{color:#f0dfba;line-height:1.5}
.collection-play-cost>span>span:not([aria-hidden]){white-space:nowrap}
.collection-upkeep{display:block;margin:0 12px;font-size:11px;color:#bdc8d6}
.collection-card .collection-tech{display:block;position:static;inset:auto;margin:0 12px;padding:7px 8px;border-radius:5px;font-size:12px;line-height:1.4;white-space:normal;overflow-wrap:anywhere}
.collection-tech.available{background:#2b4739;color:#d2e8c5}
.collection-footer{display:flex;align-items:end;justify-content:space-between;gap:10px;margin:auto 12px 0;padding-top:10px;border-top:1px solid #b9c8d933;font-size:12px;color:#bdc8d6}
.collection-purchase{display:flex;flex-direction:column;gap:3px}
.collection-purchase>span{font-size:11px}
.collection-purchase>b{color:#f2d795;font-size:15px}
.collection-details-link{color:#e7d099;font-size:12px;white-space:nowrap}
.card-workbench:focus{outline:none}
.card-workbench .back-to-cards{display:none}
@media(max-width:700px){
 .collection-grid{grid-template-columns:minmax(0,1fr);gap:14px}
 .collection-card{gap:10px;padding:12px;transform:none}
 .collection-card-header{display:grid;grid-template-columns:64px minmax(0,1fr);gap:12px;align-items:center}
 .collection-card-header>img{width:64px;height:76px;border-radius:6px}
 .collection-card-name{padding:0}
 .collection-card-name>strong{font-size:19px;line-height:1.2}
 .collection-card-name>.eyebrow{font-size:10px}
 .collection-stats,.collection-effect,.collection-play-cost,.collection-upkeep,.collection-card .collection-tech,.collection-footer{margin-left:0;margin-right:0}
 .collection-stats{gap:8px 12px;grid-template-columns:repeat(3,minmax(0,1fr))}
 .collection-stats>span>span{font-size:12px}
 .collection-play-cost{font-size:13px}
 .collection-card .collection-tech{font-size:12px}
 .card-workbench .back-to-cards{display:block;width:calc(100% - 34px);min-height:44px;margin-bottom:14px}
 .card-workbench{scroll-margin-top:8px}
 .workbench-art{height:110px;margin-bottom:12px}
}