/* Site system: loaded last on every public page so shared controls read the same wherever they appear.
   Page sheets keep layout (width, margins, placement); this sheet owns how a button, a segmented toggle, a page title,
   an eyebrow and a transaction status look. Selectors repeat the page-sheet selectors they settle, at equal specificity,
   so loading last is what decides, not selector weight.
   Brand stays as ui.css defines it: ivory ground, copper for action, Rajdhani for display, Inter for reading, Plex Mono for labels. */

/* ---- Buttons: one filled primary, one outlined secondary, one text-only quiet. ---- */
.btn,.primary,.secondary,.quiet,.concept-button,.chat-quiet,.chat-funding,.wallet-connect,.propose-link,#open-all-rules,.docs-handoff>a,
.deposit-page .concept-button,.deposit-page .finance-panel button:not(.quiet),
.player-preview .btn,.player-preview .finance-panel button:not(.quiet),.player-preview .wallet-panel button:not(.quiet),
.login-card .auth-form :is(button[type=submit],.auth-submit),
.faction-popup .faction-popup-footer .concept-button,.world-state .depth-header .concept-button,
#formation-dialog .proposal-actions button.propose,#formation-dialog .propose-link,
.deposit-wallet .wallet-connect,
body>header.topbar .session-slot :is(.session-hint[data-signed-in="false"],.auth-signed-in button.quiet){
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:9px 18px;
  border:1px solid var(--line-strong);border-radius:var(--radius);clip-path:none;box-shadow:none;cursor:pointer;text-decoration:none;
  font:600 .88rem/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase}

/* Primary: copper with ivory text; hover darkens, text stays ivory. */
.btn,.primary,.concept-button.primary,.chat-funding,.btn-primary,
.founding-canvas .chat-funding,body:has(.founding-canvas) #formation-dialog .chat-funding,
.deposit-page .concept-button.primary,.deposit-page .finance-panel button:not(.quiet),
.player-preview .btn,.player-preview .finance-panel button:not(.quiet),.player-preview .wallet-panel button:not(.quiet),
.login-card .auth-form :is(button[type=submit],.auth-submit),
#formation-dialog .proposal-actions button.propose,
body>header.topbar .session-slot .session-hint[data-signed-in="false"]{
  background:var(--copper);border-color:var(--copper);color:var(--ivory)}
.scenic-login .concept-button.primary{color:var(--ivory)!important}
.btn:hover:not(:disabled),.primary:hover:not(:disabled),.concept-button.primary:hover:not(:disabled),.chat-funding:hover:not(:disabled),.btn-primary:hover:not(:disabled),
.founding-canvas .chat-funding:hover:not(:disabled),
.deposit-page .concept-button.primary:hover:not(:disabled),.deposit-page .finance-panel button:not(.quiet):hover:not(:disabled),
.player-preview .btn:hover:not(:disabled),.player-preview .finance-panel button:not(.quiet):hover:not(:disabled),
.login-card .auth-form :is(button[type=submit],.auth-submit):hover:not(:disabled),
#formation-dialog .proposal-actions button.propose:hover:not(:disabled),
body>header.topbar .session-slot .session-hint[data-signed-in="false"]:hover:not(:disabled){
  background:var(--red-dark);border-color:var(--red-dark);color:var(--ivory);text-decoration:none}

/* Secondary: outlined; hover takes a copper wash. */
.btn-secondary,.secondary,.quiet,.concept-button:not(.primary),.chat-quiet,.wallet-connect,.propose-link,#open-all-rules,.docs-handoff>a,
.founding-canvas .chat-quiet,.deposit-page .concept-button:not(.primary),.deposit-wallet .wallet-connect,
.player-preview .btn-secondary,.player-preview .quiet,#formation-dialog .propose-link,
.faction-popup .faction-popup-footer .concept-button:not(.primary),.world-state .depth-header .concept-button:not(.primary),
body>header.topbar .session-slot .auth-signed-in button.quiet{
  background:transparent;border-color:var(--line-strong);color:var(--text)}
.btn-secondary:hover:not(:disabled),.secondary:hover:not(:disabled),.quiet:hover:not(:disabled),.concept-button:not(.primary):hover:not(:disabled),
.chat-quiet:hover:not(:disabled),.wallet-connect:hover:not(:disabled),.propose-link:hover,#open-all-rules:hover,.docs-handoff>a:hover,
.founding-canvas .chat-quiet:hover:not(:disabled),.deposit-page .concept-button:not(.primary):hover:not(:disabled),.deposit-wallet .wallet-connect:hover,
.player-preview .btn-secondary:hover:not(:disabled),.player-preview .quiet:hover:not(:disabled),#formation-dialog .propose-link:hover,
.world-state .depth-header .concept-button:not(.primary):hover,
body>header.topbar .session-slot .auth-signed-in button.quiet:hover:not(:disabled){
  background:var(--copper-soft);border-color:var(--copper);color:var(--text);text-decoration:none}

/* Quiet: text only, for low-weight actions (close, dismiss). */
.btn-quiet,.flow-text,.player-preview .btn-quiet{background:none;border-color:transparent;color:var(--copper)}
.btn-quiet:hover:not(:disabled),.player-preview .btn-quiet:hover:not(:disabled){background:var(--copper-soft);border-color:transparent;color:var(--red-dark)}

/* Compact size for the header and in-row actions. */
.btn-sm,.player-preview .btn-sm,.mine-row .concept-button,.world-state .depth-header .concept-button,.faction-popup .faction-popup-footer .concept-button,.governor-prompts .concept-button,
.deposit-wallet .wallet-connect,body>header.topbar .session-slot :is(.session-hint,.auth-signed-in button.quiet){
  min-height:32px;padding:5px 12px;font-size:.78rem}
body>header.topbar .session-slot .session-hint[data-signed-in="true"]{background:transparent;border-color:var(--line);color:var(--muted);box-shadow:none;opacity:1;cursor:default}

.btn:disabled,.primary:disabled,.secondary:disabled,.quiet:disabled,.concept-button:disabled,.chat-quiet:disabled,.chat-funding:disabled,.wallet-connect:disabled,
.deposit-page .finance-panel button:disabled,.player-preview .btn:disabled,#formation-dialog .proposal-actions button.propose:disabled{opacity:.45;cursor:not-allowed}
.concept-button:focus-visible,.chat-quiet:focus-visible,.chat-funding:focus-visible,.wallet-connect:focus-visible,.session-hint:focus-visible,.propose:focus-visible,
.player-preview .concept-button:focus-visible{outline:2px solid var(--teal);outline-offset:3px}
.login-card .auth-form :is(button[type=submit],.auth-submit)::after{content:none}
.wallet-connect svg{color:currentColor}
.deposit-page .finance-panel button:not(.quiet),.bond-card .concept-button{white-space:normal}
/* The motion sheet lifted terminal buttons on hover; keep the press feedback, not a second hover language. */
.player-preview .concept-button:not(:disabled):hover{transform:none;box-shadow:none}

/* ---- Segmented toggles: world-state sections and the backing view. ---- */
.world-state>.world-tabs,.backing-view-toggle{display:flex;gap:4px;width:max-content;max-width:100%;padding:4px;
  border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--panel);box-shadow:none}
.backing-view-toggle{margin:0 auto 30px}
.world-state>.world-tabs>.concept-button,.backing-view-toggle button{min-width:0;min-height:36px;padding:8px 20px;border:1px solid transparent;border-radius:2px;
  background:transparent;color:var(--muted);font:600 .82rem/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase;cursor:pointer}
.world-state>.world-tabs>.concept-button[aria-pressed=true],.backing-view-toggle button[aria-pressed=true]{background:var(--copper);border-color:var(--copper);color:var(--ivory)}
.world-state>.world-tabs>.concept-button[aria-pressed=true]:hover,.backing-view-toggle button[aria-pressed=true]:hover{background:var(--red-dark);border-color:var(--red-dark);color:var(--ivory)}
.world-state>.world-tabs>.concept-button[aria-pressed=false]:hover,.backing-view-toggle button[aria-pressed=false]:hover{background:var(--copper-soft);border-color:transparent;color:var(--text)}
@media(max-width:600px){.world-state>.world-tabs,.backing-view-toggle{width:100%}.world-state>.world-tabs>.concept-button,.backing-view-toggle button{flex:1;padding:8px 12px}}

/* ---- Page titles and eyebrows: one scale, sentence case, one eyebrow colour. ---- */
main .concept-title,.canvas-heading h1,.founding-canvas .canvas-heading h1,.docs-intro h1,.docs-hero h1,.site-page>h1{
  font:700 clamp(2.1rem,4.2vw,3rem)/1.02 var(--display);letter-spacing:.01em;text-transform:none;color:var(--text)}
.world-hero .concept-title{color:var(--ivory)}
.concept-note,.founding-eyebrow,.preview-eyebrow,.eyebrow,.chat-caption,.docs-outline-label{
  font:500 .7rem/1.3 var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--copper)}
.world-hero .concept-note,.scenic-login .concept-note,.backing-intro .concept-note,.player-preview .concept-note{color:inherit}

/* ---- Header: the account button sits at the end of the bar on every page. ---- */
body>header.topbar .session-slot{margin-left:auto}

/* ---- Footer: one layout on every page. ---- */
.site-footer .footer-brand{display:inline-flex;align-items:center;gap:12px;color:inherit;text-decoration:none}
.site-footer .footer-brand:hover{color:var(--copper);text-decoration:none}

/* ---- Focus stays visible on interactive map shapes and charts. ---- */
.atlas-land:focus-visible,.faction-depth .faction-stage-chart>svg:focus-visible,.development-chart :focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* ---- Transaction status: the same line for every wallet action. ---- */
.tx-status{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin:10px 0 0;font-size:.88rem;color:var(--text)}
.tx-status:empty{display:none}
.tx-status::before{content:'';flex:none;align-self:center;width:8px;height:8px;border-radius:50%;background:var(--faint)}
.tx-status:is([data-phase=preparing],[data-phase=signing],[data-phase=submitting],[data-phase=confirming])::before{background:var(--wait);animation:tx-pulse 1.2s ease-in-out infinite}
.tx-status[data-phase=confirmed]::before{background:var(--teal)}
.tx-status[data-phase=failed]::before{background:var(--error)}
.tx-status[data-phase=cancelled]{color:var(--muted)}
.tx-status a{font-family:var(--mono);font-size:.78rem;letter-spacing:.02em}
@keyframes tx-pulse{50%{opacity:.35}}
@media(prefers-reduced-motion:reduce){.tx-status::before{animation:none!important}}

/* ---- World state: an atlas with no territory data is one column, not an empty map beside a note. ---- */
.territory-atlas.is-empty{grid-template-columns:1fr;padding:24px 28px}

/* ---- Section headings: sentence case everywhere (h3 stays the uppercase card label). ---- */
h2,.defeated-heading{text-transform:none;letter-spacing:.01em}

/* ---- Faction popup: its section tabs share the segmented-toggle shape; the faction's own accent marks the current one. ---- */
.faction-detail-nav button{min-height:36px;padding:8px 16px;border-radius:2px;font:600 .82rem/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase}
.faction-detail-nav button[aria-pressed=false]:hover{background:var(--copper-soft);color:var(--text)}
.faction-popup-heading .governor-label{color:var(--ivory);opacity:.85}

/* ---- Funding progress: one bar for proposals wherever they are listed. ---- */
.canvas-funding-line{height:6px;border-radius:3px;overflow:hidden;background:var(--panel-2);margin:12px 0 8px}
.canvas-funding-line span{display:block;height:100%;background:var(--copper)}

/* ---- Wallet sign-in form: the same card wherever it is mounted (terminal, dialogs, backing panel, world map). ---- */
.auth-form{display:flex;flex-direction:column;align-items:stretch;gap:10px;max-width:440px}
.auth-form .auth-intro{margin:0 0 4px}
.auth-form .auth-submit,.auth-form button[type=submit],#formation-dialog .auth-form button[type=submit]{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;margin:0;padding:10px 18px;
  border:1px solid var(--copper);border-radius:var(--radius);background:var(--copper);color:var(--ivory);cursor:pointer;
  font:600 .9rem/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase}
.auth-form .auth-submit:hover:not(:disabled),.auth-form button[type=submit]:hover:not(:disabled){background:var(--red-dark);border-color:var(--red-dark);color:var(--ivory)}
.auth-form>.quiet{width:100%;margin:0}
.auth-form>.quiet.btn-sm{width:auto;align-self:flex-start;border-color:transparent;color:var(--copper);padding-inline:0}
.auth-form>.quiet.btn-sm:hover:not(:disabled){background:none;text-decoration:underline}
.session-slot .auth-form{flex-direction:row;align-items:center;max-width:none}
.session-slot .auth-form .auth-submit,.session-slot .auth-form>.quiet{width:auto}

/* ---- Player terminal tabs: the same segmented toggle as World state and Back a faction. ---- */
.player-preview .dashboard-nav{display:flex;flex-wrap:wrap;gap:4px;width:max-content;max-width:100%;padding:4px;margin:0 0 28px;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--panel)}
.player-preview .dashboard-nav button{min-height:36px;padding:8px 20px;border:1px solid transparent;border-radius:2px;background:transparent;color:var(--muted);font:600 .82rem/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase}
.player-preview .dashboard-nav button[aria-selected=true]{background:var(--copper);border-color:var(--copper);color:var(--ivory)}
.player-preview .dashboard-nav button[aria-selected=false]:hover{background:var(--copper-soft);color:var(--text)}
@media(max-width:600px){.player-preview .dashboard-nav{width:100%;flex-wrap:nowrap;overflow-x:auto}.player-preview .dashboard-nav button{flex:1 0 auto;padding:8px 12px;white-space:nowrap}}

/* ---- Scenic pages (terminal, sign-in) sit on dark art: header account controls and the footer read in ivory there. ---- */
body:has(.player-preview,.scenic-login)>header.topbar .session-slot .auth-signed-in button.quiet,
body:has(.player-preview,.scenic-login)>header.topbar .session-slot .session-hint[data-signed-in="true"]{color:var(--ivory);border-color:rgba(242,233,211,.45);background:transparent}
body:has(.player-preview,.scenic-login)>header.topbar .session-slot .auth-signed-in button.quiet:hover:not(:disabled){background:rgba(242,233,211,.12);border-color:var(--ivory);color:var(--ivory)}
body:has(.player-preview,.scenic-login) .site-footer{color:rgba(242,233,211,.72);border-top-color:rgba(242,233,211,.16)}
body:has(.player-preview,.scenic-login) .site-footer a:hover{color:var(--ivory)}
.task-view-toggle{gap:4px;padding:4px;border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--panel)}
.task-view-toggle button{min-height:36px;padding:8px 20px;border:1px solid transparent;border-radius:2px;color:var(--muted);font:600 .82rem/1.2 var(--display);letter-spacing:.06em;text-transform:uppercase}
.task-view-toggle button[aria-pressed=true]{background:var(--copper);border-color:var(--copper);color:var(--ivory)}
.task-view-toggle button[aria-pressed=false]:hover{background:var(--copper-soft);color:var(--text)}
.task-view-toggle button:focus-visible,.player-preview .dashboard-nav button:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* ---- Dialog close: one 36px icon button in every popup. ---- */
.dialog-close,.estimate-close,.faction-popup .faction-popup-close,.icon-button.close-dialog,#application-dialog-close,#connect-dialog-close{
  display:grid;place-items:center;width:36px;height:36px;min-width:36px;min-height:36px;padding:0;margin:0;float:none;
  border:1px solid transparent;border-radius:var(--radius);background:none;color:var(--muted);font-size:22px;line-height:1;cursor:pointer;box-shadow:none}
.dialog-close:hover,.estimate-close:hover,.icon-button.close-dialog:hover,#application-dialog-close:hover,#connect-dialog-close:hover{background:var(--copper-soft);border-color:transparent;color:var(--text)}
.faction-popup .faction-popup-close{color:var(--ivory)}
.faction-popup .faction-popup-close:hover{background:rgba(242,233,211,.14);color:var(--ivory)}

/* ---- Governor line on proposal and defeated cards; the forward link on a defeated card. ---- */
.canvas-model,.defeated-model{font:500 .72rem/1.4 var(--mono);letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.defeated-link{font-size:.88rem;color:var(--copper)}

.founder-faction-reward h3{margin:0 0 6px;font-size:24px;line-height:1.2}.founder-faction-reward p{margin:6px 0}.founder-faction-reward strong{font-size:18px}

.faction-defeated-badge{display:inline-block;padding:3px 8px;border:1px solid #b6423c;border-radius:4px;background:#fbe6e3;color:#922e28;font-weight:600;line-height:1.3}