/* Canonical controls. Legacy semantic classes are aliases while screens migrate
   to controls.mjs; no surface owns its own primary color, bevel or shadow. */
:root {
 --control-fill:var(--accent,#d97942); --control-on:var(--accent-on,#170e08);
 --control-radius:10px; --control-height:44px;
 --panel-radius:14px; --choice-radius:12px;
}
body.strategy-game :where(button,a).ui-button {
 display:inline-flex;align-items:center;justify-content:center;gap:8px;
 min-height:var(--control-height);padding:10px 15px;border:1px solid var(--border-strong);
 border-radius:var(--control-radius);background:var(--surface-raised);color:var(--fg);
 font:600 var(--text-body)/1.35 var(--font-sans);letter-spacing:0;text-align:center;
 box-shadow:none;text-shadow:none;cursor:pointer;white-space:normal;
}
body.strategy-game :is(.ui-button--primary,.game-action,.primary-action,.phone-primary,.phone-run:not(.running):not(.ui-button--quiet):not(.ui-button--secondary),.notification-action,.outcome-actions>.primary,.phone-outcome-actions>.primary,.work-slot.empty) {
 background:var(--control-fill)!important;color:var(--control-on)!important;
 border:1px solid transparent!important;border-radius:var(--control-radius)!important;
 box-shadow:none!important;text-shadow:none!important;font-weight:650;
}
body.strategy-game :is(.ui-button--primary,.game-action,.primary-action,.phone-primary,.phone-run:not(.running):not(.ui-button--quiet):not(.ui-button--secondary),.notification-action):hover:not(:disabled) {
 background:color-mix(in srgb,var(--control-fill) 86%,white)!important;
}
body.strategy-game :is(.ui-button--primary,.game-action,.primary-action,.phone-primary,.phone-run:not(.running):not(.ui-button--quiet):not(.ui-button--secondary),.notification-action):active:not(:disabled) {
 background:color-mix(in srgb,var(--control-fill) 85%,black)!important;
}
body.strategy-game :is(.ui-button,.game-action,.primary-action,.phone-primary,.phone-run,.notification-action):disabled {
 background:var(--surface-raised)!important;color:var(--fg-subtle)!important;
 border-color:var(--border-subtle)!important;box-shadow:none!important;opacity:.6;cursor:not-allowed;
}
body.strategy-game :is(.ui-button,.game-action,.primary-action,.phone-primary,.phone-run,.notification-action):focus-visible {
 outline:2px solid var(--accent);outline-offset:3px;
}
body.strategy-game .ui-button--quiet {background:none!important;border-color:transparent!important;color:var(--fg-muted)!important;box-shadow:none;}
body.strategy-game .ui-button--quiet:hover {background:var(--surface);color:var(--fg);}
body.strategy-game .ui-button--icon {width:44px;height:44px;min-width:44px;padding:11px;background:none;border-color:transparent;color:var(--fg-muted);}
body.strategy-game .ui-button--icon svg {width:22px;height:22px;}
body.strategy-game .ui-button--secondary,.phone-run.running {background:var(--surface-raised)!important;color:var(--fg)!important;border:1px solid var(--border-strong)!important;box-shadow:none!important;}
@media(prefers-reduced-motion:no-preference){body.strategy-game .ui-button{transition:background .12s ease,color .12s ease;}}

/* Navigation and saved-run cards use the same surface as research/work rows. */
body.strategy-game .ui-button.card-button {
 display:flex;width:100%;min-width:0;min-height:52px;margin:0;padding:14px;
 border:1px solid var(--border-subtle);border-radius:var(--choice-radius);
 background:var(--surface);color:var(--fg);text-align:left;box-shadow:none;
}
body.strategy-game .ui-button.card-button:hover {background:var(--surface-raised);border-color:var(--border-strong);}
body.strategy-game .ui-button.card-button:active {background:var(--surface-raised);}
.ui-button.card-button .decision-label small {display:block;}
.ui-button.card-button .card-meta {font-size:var(--text-meta);color:var(--fg-muted);}
@media(max-width:700px),(pointer:coarse) and (max-height:500px) {
 body.strategy-game .ui-button.card-button {padding:12px;}
 .ui-button.card-button .decision-label strong {font-size:var(--text-meta);}
 .ui-button.card-button .decision-label small {font-size:var(--text-meta);}
 .ui-button.card-button .card-meta {font-size:var(--text-meta);}
}