/* One control treatment across the table, dialogs and shop. Card faces keep their own motion. */
:root{--control-radius:7px;--control-edge:#b9d2c12e;--control-face:#254e43;--control-text:#e2eadb;--control-shadow:0 3px 0 #092f29b3,inset 0 1px 0 #ffffff16}
body :is(button:not(.card):not(.joker-card):not(.deck-button):not(.save-row),a.action,.file-import){border-radius:var(--control-radius);border:1px solid var(--control-edge);box-shadow:var(--control-shadow);font-weight:700;line-height:1.3;transition:transform .12s ease,background-color .15s ease,border-color .15s ease,box-shadow .12s ease;touch-action:manipulation;text-decoration:none}
body :is(.sort button,.assist-tools button,.hand-bottom button,.side-buttons button,.hand-guide-nav button,.board-tabs button,.save-row button,.store-manage,.skip-animation,.close,.install-pwa,.file-import){background:var(--control-face);color:var(--control-text)}
body :is(.sort button,.assist-tools button,.hand-bottom button,.side-buttons button,.board-tabs button,.save-row button){min-height:32px}
body :is(.sort button.active,.hand-guide-nav button.active,.board-tabs button.active){background:#e8d49e;color:#263d34;border-color:#fae6b6;box-shadow:0 2px 0 #183c30,inset 0 1px 0 #fff4}
body .action{border-color:#ffffff2e;box-shadow:0 4px 0 #0b302acc,inset 0 1px 0 #ffffff24;text-shadow:none}
body .blue-btn{background:#298cca;color:#f5f5e9}
body .red-btn{background:#c85e60;color:#fff0e7}
body .gold-btn{background:#dfb669;color:#233d33}
body .green-btn{background:#437d65;color:#f2efdf}
body .side-buttons #new-run{background:#704d49;color:#f5d6cb}
body :is([data-save-action="delete"],[data-cloud-delete],[data-slot-joker],[data-slot-consume]){color:#ffb6ac;border-color:#e59a8b55}
body .store-buy{background:#dfb669;color:#233d33}
body .special-item .store-buy{background:#b7a4d6;color:#292b40}
body .store-item.sold .store-buy{background:#344b42;color:#c6d6c8}
body .shop-dialog .pack-grid article button{background:#9ecfd5;color:#223b42}
body .assist-tools button:first-child{color:#f1d598;border-color:#d5b86466}
body :is(button:not(.card):not(.joker-card):not(.deck-button):not(.save-row),a.action):hover:not(:disabled){filter:none;transform:none}
@media(hover:hover) and (pointer:fine){
  body :is(button:not(.card):not(.joker-card):not(.deck-button):not(.save-row),a.action):hover:not(:disabled){transform:translateY(-1px);border-color:#e5eed16e;box-shadow:0 4px 0 #082e28b3,inset 0 1px 0 #ffffff26}
}
body :is(button:not(.card):not(.joker-card):not(.deck-button):not(.save-row),a.action):active:not(:disabled){transform:translateY(2px);box-shadow:0 1px 0 #082e28b3,inset 0 1px 0 #00000012}
body button:not(.card):not(.joker-card):disabled{opacity:.48;box-shadow:none;transform:none;filter:saturate(.65);cursor:not-allowed}
body :is(button,a.action):focus-visible,.file-import:focus-within{outline:2px solid #f3d18a;outline-offset:3px}
.top-actions{gap:12px}
.top-actions .icon-btn{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-height:36px;padding:6px 8px;background:#17453799}
.top-actions .icon-btn svg{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.top-actions .icon-btn span{margin:0;font-size:12px}
.top-actions .install-pwa{min-height:36px;padding:6px 8px;font-size:12px}
body .close{display:inline-grid;place-items:center;width:34px;height:34px;padding:0;font-size:23px}
body .modal-actions .action{min-height:44px}
body .settings-grid :is(select,input[type="checkbox"]){accent-color:#dfb669}
@media(max-width:700px){
  .top-actions{gap:6px}
  .top-actions .icon-btn{min-width:32px;padding:4px}
  .top-actions .install-pwa{font-size:11px;padding:4px 5px;min-height:32px}
}
@media(max-width:380px){.top-actions{gap:3px}}
@media(prefers-reduced-motion:reduce){body :is(button:not(.card):not(.joker-card),a.action){transition:none}}
/* Preserve the centered position of the fixed PWA update prompt. */
#pwa-update,#pwa-update:hover:not(:disabled),#pwa-update:active:not(:disabled){transform:translateX(-50%)}
/* Shared form and feedback tokens. Primary colors meet 4.5:1 for normal text. */
:root{--ui-surface:#203b34;--ui-surface-raised:#2d4840;--ui-text:#f2efdf;--ui-muted:#baccc1;--ui-border:#829e91;--ui-focus:#f3d18a;--ui-blue:#256d9c;--ui-red:#9c494c;--ui-green:#35684f;--ui-gold:#dfb669}
body .blue-btn{background:var(--ui-blue);color:var(--ui-text)}
body .red-btn{background:var(--ui-red);color:var(--ui-text)}
body .green-btn{background:var(--ui-green);color:var(--ui-text)}
body .gold-btn{background:var(--ui-gold)}
.settings-grid fieldset{display:grid;gap:8px;border:1px solid #829e9155;border-radius:10px;margin:0;padding:12px;min-width:0}
.settings-grid legend{padding:0 6px;font-size:14px;color:#dfd8bb}
.settings-grid label{background:var(--ui-surface);color:var(--ui-text);border:1px solid #829e9133;min-height:52px;padding:12px;font-size:14px}
.settings-grid .switch-control{display:flex;align-items:center;gap:10px;flex:none}
.settings-grid .switch-control small{color:var(--ui-muted);font-size:12px}
.settings-grid .switch-control input[type=checkbox]{appearance:none;-webkit-appearance:none;position:relative;width:40px;height:24px;margin:0;background:#4c645a;border:1px solid #a6bbb0;border-radius:20px;flex:none;transition:background-color .15s}
.settings-grid .switch-control input[type=checkbox]::before{content:'';position:absolute;left:3px;top:3px;width:16px;height:16px;border-radius:50%;background:#f2efdf;transition:transform .15s}
.settings-grid .switch-control input[type=checkbox]:checked{background:var(--ui-gold);border-color:#f0d193}
.settings-grid .switch-control input[type=checkbox]:checked::before{transform:translateX(16px);background:#243e33}
.settings-grid :is(select,input[type=range]){min-height:40px}
.settings-grid select{border-radius:var(--control-radius);border:1px solid var(--ui-border);background:var(--ui-surface-raised);color:var(--ui-text);padding:8px 10px;font-size:16px}
.settings-grid input[type=range]{accent-color:var(--ui-gold);margin:0}
.settings-grid :is(input,select):focus-visible{outline:2px solid var(--ui-focus);outline-offset:4px}
.settings-grid :is(input,select):disabled{opacity:.5;cursor:not-allowed}
.settings-grid label:has(input:disabled){color:var(--ui-muted)}
.settings-grid .muted{font-size:13px;color:var(--ui-muted);line-height:1.6;margin:0 4px}
.settings-grid output{font-variant-numeric:tabular-nums}
.file-import{cursor:pointer;position:relative;overflow:hidden;display:inline-flex;align-items:center;justify-content:center;min-height:44px}
.file-import input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
body :is(.sort button,.board-tabs button)[aria-pressed=true]{box-shadow:inset 0 -3px 0 #5b6442,0 2px 0 #183c30}
body :is(.sort button,.board-tabs button):focus-visible{outline-offset:2px}
body .close{width:40px;height:40px;flex:none}
body .modal-actions .action{min-width:112px}
#modal{scrollbar-width:thin;scrollbar-color:#8ba799 #243c35;scroll-padding:12px}
#modal-title:focus{outline:2px solid var(--ui-focus);outline-offset:3px;border-radius:4px}
#modal :is(button,input,select,a){scroll-margin-block:12px}
.toast{max-width:calc(100vw - 24px);width:max-content;line-height:1.5;font-size:14px;text-align:center;z-index:110}
#modal>.toast{top:12px;right:60px;bottom:auto;left:auto;max-width:calc(100% - 84px);transform:translateY(-6px)}
#modal>.toast.show{transform:translateY(0)}
body .update-banner{max-width:calc(100vw - 24px);min-height:44px;line-height:1.5}
@media(pointer:coarse){
  body .modal-actions .action,body .store-buy,body .store-manage,body .shop-dialog .store-buy,body .shop-dialog .pack-grid article button,body .save-row button,body .board-tabs button{min-height:44px}
  body .close{width:44px;height:44px}
  .settings-grid label{min-height:56px}
}
@media(max-width:700px){.settings-grid fieldset{padding:10px}.settings-grid label{gap:12px;padding:10px}}
@media(forced-colors:active){
  .settings-grid .switch-control input[type=checkbox]{appearance:auto;-webkit-appearance:auto;width:24px;height:24px}
  .settings-grid .switch-control input[type=checkbox]::before{display:none}
  body :is(.sort button,.board-tabs button)[aria-pressed=true]{outline:2px solid Highlight;outline-offset:-3px}
}
@media(prefers-reduced-motion:reduce){.settings-grid .switch-control input[type=checkbox],.settings-grid .switch-control input[type=checkbox]::before{transition:none}}

.sync-conflicts{padding:12px;border:1px solid #d3996c;border-radius:10px;background:#493d2f;margin:16px 0}.sync-conflicts h3{margin:0 0 8px;color:#f1d598}.sync-conflicts>p{font-size:13px;line-height:1.6}.sync-conflicts .save-row{margin-top:10px}

.sync-scope,.sync-result{margin:16px 0;padding:14px;border:1px solid #718e82;border-radius:10px;background:#233f36}.sync-scope h3,.sync-result h3{margin:0 0 10px}.sync-scope p,.sync-result p{font-size:14px;line-height:1.65}.sync-result summary{padding:10px 0;cursor:pointer;font-size:14px}.sync-result .save-row{margin-block:8px}.sync-result :focus-visible{outline:2px solid var(--ui-focus);outline-offset:3px}
