/* GW-151: approved warm editorial appearance. Original layout/controllers stay
   in /ui; no remote fonts or assets, and no behavior/security overrides. */
:root, :root[data-theme] {
  --radius: 0px;
  --card-background: var(--panel);
  --card-shadow: none;
  --popup-shadow: none;
  --inset-background: var(--panel-2);
  --ledger-rule: #d8cfb7;
  --ledger-control: #998a70;
  font-family: Arial, "Helvetica Neue", sans-serif;
}

body { background: var(--bg); }
h1, h2, h3, .model-info-header strong, .dialog-heading strong {
  font-family: Georgia, "Times New Roman", serif;
  font-weight: 400;
  letter-spacing: -.025em;
}
h2 { font-size: 27px; line-height: 1.2; }
h3 { font-size: 22px; }
.brand-mark { width: 160px; }
.topbar { border-bottom-color: var(--line); }
.nav-button { font-size: 13px; font-weight: 400; }
.nav-button.active { background: var(--accent-dark); color: var(--accent-text); }
:is(.card, .generation-settings, .generation-key, .generation-key-budget, .connection,
    .reference-card, .reference-dropzone, .reference-library, .model-info-popup,
    .control-popup, .model-select-popup, .picker-option, .toggle-option,
    .price-card, .detail-media-card, .detail-media-preview, dialog,
    button, input:not([type="checkbox"]):not([type="radio"]), textarea, select) {
  border-radius: 0 !important;
  box-shadow: none;
}
:is(.card, .generation-settings, .reference-library, dialog) { border-color: var(--line); }
.generation-settings { background: transparent; }
:is(input:not([type="checkbox"]):not([type="radio"]), textarea, .floating-field > .select-trigger) {
  border-color: var(--ledger-control);
}
.primary, .secondary { font-weight: 400; font-size: 14px; border: 1px solid var(--line); }
.primary { background: var(--accent); border-color: var(--accent); color: var(--on-accent); }
.primary:hover { background: var(--accent-text); border-color: var(--accent-text); color: var(--on-accent); }
.secondary { background: var(--field); color: var(--text); }
.secondary:hover { background: var(--accent-dark); }
:is(button, a, input, textarea, select, [role="combobox"], [tabindex]):focus-visible {
  outline: 2px solid var(--accent-text);
  outline-offset: 3px;
}
:is(.floating-label, .generation-budget-stats dt, .model-info-facts dt, .task-meta,
    .task-cost, .reference-size, .status-badge, .field-meta, .reference-card small) {
  font-family: "Courier New", Courier, monospace;
}
:is(.generation-budget-stats dt, .model-info-facts dt) {
  font-size: 10px;
  text-transform: uppercase;
  letter-spacing: .1em;
}
.generation-budget-stats dd { font-family: "Courier New", Courier, monospace; }
.task { border-color: var(--ledger-rule); }
.task-title { font-weight: 400; }
.reference-dropzone { border-color: var(--ledger-control); background: transparent; }
.reference-card { background: var(--field); border-color: var(--line); }
.reference-card[data-selected="true"] { border-color: var(--accent); background: var(--accent-dark); }
.reference-name { font-weight: 400; }
.prompt-reference-token { color: var(--accent-text); background: var(--accent-dark); border-radius: 0; }
.prompt-reference-token.missing { color: var(--red); }
.model-info-popup, .control-popup, dialog { box-shadow: none; }
.model-info-sources, .reference-library-header, .reference-library-footer { border-color: var(--ledger-rule); }
@media (max-width: 600px) { h2 { font-size: 25px; } h3 { font-size: 21px; } }

/* The editor mirror and media inherit the same flat frame treatment. */
.prompt-reference-container, .task-media, .reference-card img, .reference-placeholder, .reference-preview-popup img { border-radius:0 !important; }
:is(.card, .reference-library, .confirm-heading, .dialog-heading, .form-heading) h2 { font-family:Georgia,"Times New Roman",serif; font-weight:400; font-size:27px; }
@media(max-width:600px){:is(.card,.reference-library,.confirm-heading,.dialog-heading,.form-heading) h2{font-size:25px;}}
.floating-field.multiline-field { border-color: var(--ledger-control); }
/* Stable balance geometry, including delayed and failed background refreshes. */
#generationKeyBudget .balance-status { min-height: 1.4em; margin: 0; font-size: 12px; color: var(--red); }
#generationKeyBudget .generation-budget-stats { margin: 0; }

/* GW-155: exact reference palette is available before site.json arrives. */
:root, :root[data-theme] { color-scheme:light; --bg:#f5efe2; --panel:#fff8e8; --field:#fff8e8; --panel-2:#fff8e8; --popup:#fff8e8; --text:#1a1510; --muted:#7a6e5e; --line:#c9bfa9; --accent:#9a7a2e; --accent-dark:#ede6d4; --accent-text:#9a7a2e; --on-accent:#fff8e8; --red:#a44a3a; }
.section-nav { color:#3a2f22; }
.primary { font-size:19px; font-weight:700; }


/* GW-155: header composition measured against the supplied 1157px reference. */
.shell { width:100%; max-width:none; }
.shell > main { width:min(1280px, calc(100% - 34px)); margin:0 auto; }
.topbar, .topbar.wrapped {
 display:flex; box-sizing:border-box; height:60px; min-height:60px;
 padding:0 max(17px, calc((100% - 1280px)/2)); gap:16px;
 border-bottom:1px solid var(--ledger-rule); --brand-full-width:89px; --brand-image-height:24px;
}
.topbar .brand, .topbar.wrapped .brand { min-height:44px; flex:0 0 89px; }
.topbar .brand-wordmark, .topbar.compact-brand .brand-wordmark { display:block !important; width:89px; height:24px; max-width:89px; }
.topbar .brand-symbol, .topbar.compact-brand .brand-symbol { display:none !important; }
.topbar #sectionNav, .topbar.wrapped #sectionNav { margin-left:auto; align-self:center; align-items:center; gap:4px; min-height:32px; flex-wrap:nowrap; }
.topbar .nav-button { min-height:32px; padding:7px 12px; font:400 13px/18px Arial,"Helvetica Neue",sans-serif; color:#3a2f22; }
.topbar .nav-button.active { color:#9a7a2e; background:#ede6d4; }
.topbar .nav-button.active::after { display:none; }
.topbar .nav-button:hover { background:#ede6d4; color:#1a1510; }
.topbar-actions:has(#userMenu[hidden]) { display:none; }
@media(max-width:360px){.topbar,.topbar.wrapped{gap:8px;}.topbar .nav-button{padding-inline:9px;}}
/* GW-155: outlined OFF, filled ON and separated thumb; no visible state words. */
input[type=checkbox] {
 flex:0 0 60px; width:60px; min-width:60px; height:30px; min-height:30px;
 box-sizing:border-box; border:2px solid #7a6e5e; border-radius:999px;
 background:#fff8e8; transition:background-color .15s ease;
}
input[type=checkbox]::before { width:20px; height:20px; left:3px; top:3px; background:#7a6e5e; }
input[type=checkbox]:checked { background:#9a7a2e; border-color:#9a7a2e; box-shadow:none; }
input[type=checkbox]:checked::before { transform:translateX(30px); background:#fff8e8; }
input[type=checkbox]:focus-visible { outline:2px solid #1a1510; outline-offset:3px; }
label:has(> input[type=checkbox]) { min-height:44px; }
input[type=checkbox]:disabled { opacity:.5; cursor:not-allowed; }
@media(prefers-reduced-motion:reduce){input[type=checkbox],input[type=checkbox]::before{transition:none;}}
