/* ==========================================================================================
   Harav GPT – "Seforim library" theme. Loaded last on every page; overrides the base styles.
   Light: warm parchment, ink navy, restrained gold.  Dark: a beis medrash at night (lamp-lit).
   Fonts are self-hosted (CSP 'self'): Frank Ruhl Libre (display + reading), Heebo (interface).
   ========================================================================================== */
@import url(/static/fonts/fonts.css);

:root {
  --paper:#f4efe4; --paper-2:#ece5d6; --sheet:#fbf8f1; --ink:#1b2638; --ink-2:#3a4558; --muted:#6e685c;
  --rule:#d8cdb8; --rule-soft:#e6dece; --gold:#9c7a3c; --gold-ink:#7a5c28; --gold-2:#b8975a; --gold-soft:#efe4cc;
  --accent:#1f3354; --accent-ink:#fbf8f1; --danger:#8f2d24; --danger-soft:#f6e3dc; --ok:#3f6a3c; --ok-soft:#e5eedb;
  --warn-ink:#6b4a12; --warn-soft:#f5e9cc; --focus:#b8975a;
  --serif:"Frank Ruhl Libre", "David Libre", "Times New Roman", serif;
  --sans:"Heebo", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --radius:4px; --radius-lg:6px;
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.35  0 0 0 0 0.28  0 0 0 0 0.18  0 0 0 .055 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  /* base-stylesheet variables, remapped */
  --blue:var(--accent); --bg:var(--paper); --fg:var(--ink); --me:transparent; --bot:var(--sheet); --warn:var(--warn-soft);
  --side:var(--paper-2); --border:var(--rule); --code:#ebe3d2; --pre:#1d2533; --pretext:#efe7d6;
  --card:var(--sheet); --soft:var(--paper); --soft2:var(--rule-soft); --tab:var(--paper); --input:var(--sheet);
  --okbg:var(--ok-soft); --bad:var(--danger); --badbg:var(--danger-soft); --warnbg:var(--warn-soft); --warnfg:var(--warn-ink);
  --shadow:none; --langseg-bg:transparent; --langseg-on:var(--ink);
  color-scheme:light;
}
:root[data-theme=dark] {
  --paper:#121419; --paper-2:#171a21; --sheet:#1b1f27; --ink:#ebe3d1; --ink-2:#cdc4af; --muted:#958d7b;
  --rule:#2d323c; --rule-soft:#242931; --gold:#d3ae63; --gold-ink:#d3ae63; --gold-2:#e2c27e; --gold-soft:#2b2618;
  --accent:#d3ae63; --accent-ink:#15171c; --danger:#e8907f; --danger-soft:#33201d; --ok:#9cc78f; --ok-soft:#1d2a1d;
  --warn-ink:#ecd093; --warn-soft:#2c2617; --focus:#d3ae63; --code:#252a33; --pre:#0e1015; --pretext:#e9e1cf;
  --grain:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1  0 0 0 0 .9  0 0 0 0 .7  0 0 0 .03 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
  color-scheme:dark;
}

/* ---------- foundations ---------- */
html { -webkit-text-size-adjust:100%; }
body { font-family:var(--sans); background-color:var(--paper); background-image:var(--grain); color:var(--ink);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
:root[data-theme=dark] body { background-image:var(--grain), radial-gradient(1200px 600px at 50% -10%, rgba(211,174,99,.07), transparent 70%); }
::selection { background:var(--gold-soft); color:var(--ink); }
:focus-visible { outline:2px solid var(--focus) !important; outline-offset:2px; }
a { color:var(--accent); text-decoration-color:color-mix(in srgb, currentColor 35%, transparent); text-underline-offset:3px; }
a:hover { text-decoration-color:currentColor; }
h1, h2, h3, .serif { font-family:var(--serif); font-weight:600; letter-spacing:.005em; }
code, kbd, pre { font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace; }
button, input, select, textarea { font-family:inherit; }
input, select, textarea { background:var(--sheet); color:var(--ink); border:1px solid var(--rule); border-radius:var(--radius); }
input::placeholder, textarea::placeholder { color:color-mix(in srgb, var(--muted) 80%, transparent); }
input:focus, select:focus, textarea:focus { border-color:var(--gold-2); outline:none; box-shadow:0 0 0 3px color-mix(in srgb, var(--gold-2) 22%, transparent); }
select { appearance:none; -webkit-appearance:none; padding-inline-end:28px !important;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1.5l5 5 5-5' fill='none' stroke='%239c7a3c' stroke-width='1.4'/></svg>");
  background-repeat:no-repeat; background-position:right 10px center; }
[dir=rtl] select { background-position:left 10px center; }
select[multiple], select[size] { background-image:none; padding-inline-end:8px !important; }
input[type=checkbox], input[type=radio] { accent-color:var(--accent); }
.muted { color:var(--muted); }
svg.ico { display:block; }

/* buttons: quiet by default, ink for the primary action */
button { border-radius:var(--radius); transition:background-color .15s, border-color .15s, color .15s, transform .08s; }
button:active:not(:disabled) { transform:translateY(1px); }
button.primary, .modal button.primary, form button#send, #newChat {
  background:var(--accent) !important; color:var(--accent-ink) !important; border:1px solid var(--accent) !important; }
button.primary:hover:not(:disabled), form button#send:hover:not(:disabled), #newChat:hover { background:color-mix(in srgb, var(--accent) 88%, var(--gold)) !important; }
button.danger { color:var(--danger) !important; border-color:color-mix(in srgb, var(--danger) 40%, transparent) !important; background:transparent !important; }

/* ---------- wordmark ---------- */
.wordmark { display:inline-flex; align-items:center; gap:10px; font-family:var(--serif) !important; font-weight:600; color:var(--ink);
  letter-spacing:.01em; white-space:nowrap; min-width:0; }
.wordmark .wm-seal { color:var(--gold); flex:none; }
.wordmark .wm-name { overflow:hidden; text-overflow:ellipsis; }
.wm-lg { font-size:2rem !important; flex-direction:column; gap:12px; margin:4px 0 0 !important; color:var(--ink) !important; }
.wm-lg .wm-seal { width:46px; height:46px; }
.bsd { font-family:var(--serif); color:var(--muted) !important; opacity:1 !important; }

/* ---------- top bars (chat + admin) ---------- */
header, header.top { background:color-mix(in srgb, var(--paper) 92%, transparent) !important; color:var(--ink) !important;
  border-bottom:1px solid var(--rule); box-shadow:0 1px 0 var(--sheet) inset; backdrop-filter:saturate(1.1) blur(6px); }
header::after { content:none; }
header h1, header.top h1 { color:var(--ink); font-size:1.28rem; }
header a, header .who, header.top a, header.top .who { color:var(--ink-2) !important; text-decoration:none; font-size:.86rem; }
header a:hover, header.top a:hover { color:var(--ink) !important; text-decoration:underline; }
header .hdate { color:var(--muted); font-family:var(--serif); font-size:.9rem; opacity:1; }
.iconbtn, header.top .hbtn { background:transparent !important; color:var(--ink-2) !important; border:1px solid transparent !important;
  border-radius:var(--radius) !important; padding:6px !important; line-height:0; }
.iconbtn:hover, header.top .hbtn:hover { color:var(--ink) !important; background:var(--paper-2) !important; border-color:var(--rule) !important; }
header .avatar { background:transparent; color:var(--gold); border:1px solid var(--gold-2); font-family:var(--serif); font-weight:600; }
.modelchip { background:transparent !important; color:var(--ink-2) !important; border:1px solid var(--rule) !important; border-radius:999px !important;
  font-size:.8rem !important; padding:4px 12px !important; }
.modelchip:hover { border-color:var(--gold-2) !important; color:var(--ink) !important; }
.modelchip .dot { background:var(--gold) !important; }
.langseg { border:1px solid var(--rule) !important; border-radius:999px !important; overflow:hidden; background:transparent !important; }
.langseg button { color:var(--ink-2) !important; background:transparent !important; border:0 !important; font-size:.78rem; font-family:var(--sans); }
.langseg button.on { background:var(--ink) !important; color:var(--paper) !important; }
:root[data-theme=dark] .langseg button.on { background:var(--gold) !important; color:#15171c !important; }

/* ---------- chat: sidebar ---------- */
aside { background:color-mix(in srgb, var(--paper-2) 85%, transparent) !important; border-inline-end:1px solid var(--rule) !important; }
aside #newChat { border-radius:var(--radius) !important; font-weight:500; letter-spacing:.01em; }
aside input { background:var(--sheet) !important; border-radius:var(--radius) !important; }
aside h4 { font-family:var(--sans); font-size:.7rem !important; letter-spacing:.14em !important; color:var(--gold) !important; font-weight:600; }
.conv { border-radius:0 !important; border-inline-start:2px solid transparent; padding-inline-start:12px !important; color:var(--ink-2); }
.conv:hover { background:color-mix(in srgb, var(--sheet) 70%, transparent) !important; }
.conv.active { background:var(--sheet) !important; border-inline-start-color:var(--gold); color:var(--ink); font-weight:500 !important; }
.conv.pinned::before { content:""; display:inline-block; width:6px; height:6px; margin-inline-end:7px; vertical-align:middle;
  background:var(--gold); transform:rotate(45deg); }
.conv small { color:var(--muted) !important; }
.side-foot { border-top-color:var(--rule) !important; } .side-foot a { color:var(--muted); }
.menu { background:var(--sheet) !important; border:1px solid var(--rule) !important; border-radius:var(--radius) !important; box-shadow:0 10px 30px rgba(20,20,10,.12) !important; }
.menu button:hover { background:var(--paper-2) !important; }

/* ---------- chat: page + welcome ---------- */
.main-col { background:transparent; }
#chat { max-width:780px !important; }
.welcome { margin-top:7vh !important; color:var(--ink-2) !important; }
.welcome h2 { font-size:2.3rem; color:var(--ink); margin:.2em 0 .35em; font-weight:500; }
.welcome p { max-width:560px; margin-inline:auto; line-height:1.65; }
.welcome .small { color:var(--muted); font-size:.85rem; }
.ornament { display:flex; align-items:center; justify-content:center; gap:12px; color:var(--gold); }
.ornament::before, .ornament::after { content:""; height:1px; width:64px; background:linear-gradient(90deg, transparent, var(--gold-2)); }
.ornament::after { transform:scaleX(-1); }
.ornament span { width:7px; height:7px; border:1px solid var(--gold); transform:rotate(45deg); }
.starters { display:grid !important; grid-template-columns:1fr 1fr !important; gap:0 !important; max-width:640px !important; margin-top:28px !important;
  border-top:1px solid var(--rule); }
.starter { background:transparent !important; border:0 !important; border-bottom:1px solid var(--rule) !important; border-radius:0 !important;
  margin:0 !important; padding:14px 16px !important; transition:background-color .15s; position:relative; }
.starter:nth-child(odd) { border-inline-end:1px solid var(--rule) !important; }
.starter:hover { background:var(--sheet) !important; }
.starter b { font-family:var(--serif); font-size:1.02rem !important; font-weight:600; color:var(--ink); }
.starter span { color:var(--muted) !important; }
.notice, .banner, .limits, .closed { border-radius:var(--radius) !important; }
.notice { background:transparent !important; border:0 !important; border-bottom:1px solid var(--rule) !important; color:var(--muted) !important;
  text-align:center; font-size:.78rem !important; border-radius:0 !important; }
.banner { background:var(--gold-soft) !important; color:var(--ink) !important; border:1px solid var(--rule) !important; }
.closed { background:var(--warn-soft) !important; color:var(--warn-ink) !important; border:1px solid var(--rule) !important; }

/* ---------- chat: messages – typeset, not bubbles ---------- */
.msg { background:transparent !important; box-shadow:none !important; border-radius:0 !important; margin:0 !important;
  padding:18px 2px 14px !important; border-bottom:1px solid var(--rule-soft); }
.msg .role { font-size:.68rem !important; letter-spacing:.14em; text-transform:uppercase; color:var(--gold) !important; font-weight:600; gap:10px !important; }
.msg .role .avatar { display:none !important; }
.msg .role .ts { letter-spacing:0; text-transform:none; color:var(--muted); font-weight:400; }
.msg.user { margin-inline-start:0 !important; padding-inline-start:16px !important; border-inline-start:2px solid var(--gold-2); border-bottom:0;
  margin-top:14px !important; }
.msg.user .body { font-size:1.02rem; color:var(--ink); font-weight:500; }
.msg.assistant { margin-inline-end:0 !important; }
.msg.assistant .body { font-family:var(--serif); font-size:1.12rem; line-height:1.75; color:var(--ink); }
.msg.assistant .body p { margin:.45em 0 .7em; }
.msg.assistant .body h1, .msg.assistant .body h2, .msg.assistant .body h3 { font-size:1.15em; margin:1em 0 .35em; }
.msg.assistant .body strong { font-weight:600; }
.msg blockquote { border-inline-start:2px solid var(--gold-2) !important; color:var(--ink-2) !important; font-style:italic; }
.msg a { color:var(--accent) !important; }
.msg code { background:var(--code) !important; }
.msg.blocked { border-inline-start:2px solid var(--warn-ink) !important; padding-inline-start:16px !important; background:var(--warn-soft) !important; }
.msg.blocked .body { font-family:var(--sans); font-size:.98rem; }
.msg.error { border-inline-start:2px solid var(--danger) !important; padding-inline-start:16px !important; background:var(--danger-soft) !important; color:var(--danger) !important; }
.msg.error .body { font-family:var(--sans); font-size:.95rem; }
.status-msg .body { font-family:var(--sans) !important; font-size:.92rem !important; }
.typing i { background:var(--gold) !important; }
.actions { opacity:.0 !important; transition:opacity .15s; margin-top:8px !important; }
.msg:hover .actions, .msg:last-child .actions, .actions:focus-within { opacity:1 !important; }
.actions button { border:0 !important; background:transparent !important; color:var(--muted) !important; font-size:.75rem !important; padding:3px 8px !important;
  border-radius:var(--radius) !important; letter-spacing:.02em; }
.actions button:hover { color:var(--ink) !important; background:var(--paper-2) !important; }
.cites, .citations { font-size:.82rem; color:var(--muted); border-top:1px dashed var(--rule); margin-top:10px; padding-top:8px; }

/* composer */
form#form { padding-top:12px !important; }
.inputwrap textarea, textarea#input { background:var(--sheet) !important; border:1px solid var(--rule) !important; border-radius:var(--radius-lg) !important;
  padding:14px 14px 18px !important; font-size:1rem; box-shadow:0 1px 0 rgba(255,255,255,.6) inset, 0 6px 24px -18px rgba(40,30,10,.5); }
textarea#input:focus { border-color:var(--gold-2) !important; box-shadow:0 0 0 3px color-mix(in srgb, var(--gold-2) 20%, transparent) !important; outline:none !important; }
form button#send, form button#stop { border-radius:var(--radius-lg) !important; font-weight:500; letter-spacing:.02em; padding:0 22px !important; }
form button#stop { background:transparent !important; color:var(--danger) !important; border:1px solid var(--danger) !important; }
footer { color:var(--muted) !important; font-size:.72rem !important; }

/* torah tools panel */
.torah { background:var(--sheet) !important; border:1px solid var(--rule) !important; border-radius:var(--radius-lg) !important;
  border-top:2px solid var(--gold-2) !important; }
.torah h3, .torah h4, .torah b { font-family:var(--serif); }
.torah button { background:transparent !important; border:1px solid var(--rule) !important; border-radius:var(--radius) !important; }
.torah button:hover { border-color:var(--gold-2) !important; background:var(--paper) !important; }

/* ---------- modals (chat + admin) ---------- */
.modal-bg { background:rgba(24,20,12,.42) !important; backdrop-filter:blur(2px); }
:root[data-theme=dark] .modal-bg { background:rgba(0,0,0,.6) !important; }
.modal { background:var(--sheet) !important; color:var(--ink) !important; border:1px solid var(--rule) !important; border-radius:var(--radius-lg) !important;
  box-shadow:0 30px 80px -30px rgba(30,20,0,.45) !important; animation:kai-rise .18s ease-out; }
@keyframes kai-rise { from { opacity:0; transform:translateY(6px); } to { opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce) { .modal { animation:none; } }
.modal h2 { font-family:var(--serif); font-weight:600; }
.modal input, .modal select, .modal textarea { background:var(--paper) !important; border:1px solid var(--rule) !important; border-radius:var(--radius) !important; }
.modal button { border-radius:var(--radius) !important; background:transparent; border:1px solid var(--rule); color:var(--ink); }
.modal button:hover { border-color:var(--gold-2); }
.modal-x { color:var(--muted) !important; }

/* ---------- settings window ---------- */
.settings .shead { border-bottom:1px solid var(--rule) !important; padding:18px 24px !important; }
.settings .shead h2 { font-size:1.45rem !important; font-weight:500 !important; }
.settings .x { color:var(--muted) !important; }
.settings .saved { color:var(--ok) !important; font-size:.78rem !important; letter-spacing:.04em; }
.settings .sbody { grid-template-columns:210px 1fr !important; }
.settings .stabs { background:var(--paper) !important; border-inline-end:1px solid var(--rule) !important; padding:14px 0 !important; gap:0 !important; }
.settings .stabs button { border-radius:0 !important; padding:10px 22px !important; color:var(--ink-2) !important; position:relative; font-size:.93rem; }
.settings .stabs button::before { content:""; position:absolute; inset-block:8px; inset-inline-start:0; width:2px; background:var(--gold); transform:scaleY(0); transition:transform .18s ease; }
.settings .stabs button:hover { color:var(--ink) !important; }
.settings .stabs button.on { background:transparent !important; color:var(--ink) !important; font-weight:600; }
.settings .stabs button.on::before { transform:scaleY(1); }
.settings .spane { padding:8px 28px 24px !important; }
.settings h4 { font-family:var(--sans) !important; color:var(--gold-ink) !important; letter-spacing:.14em !important; font-size:.7rem !important; margin-top:24px !important; font-weight:600; }
.settings .srow { border-bottom:1px solid var(--rule-soft) !important; padding:14px 0 !important; }
.settings .srow b { font-weight:500; color:var(--ink); }
.settings .srow small { color:var(--muted) !important; }
.settings .lock { color:var(--warn-ink) !important; display:inline-flex; gap:5px; align-items:center; }
.settings .lock::before { content:""; width:10px; height:10px; flex:none; border:1.4px solid currentColor; border-radius:2px; box-sizing:border-box;
  box-shadow:0 -3px 0 -1px var(--sheet), 0 -4px 0 0 currentColor; margin-top:3px; }
.settings .note { background:var(--paper) !important; border:1px solid var(--rule-soft); border-radius:var(--radius) !important; }
.settings .codes { background:var(--paper) !important; }
.settings a.btn { border-radius:var(--radius) !important; }
input.switch { appearance:none; -webkit-appearance:none; width:40px !important; height:22px !important; min-height:0 !important; border-radius:999px !important;
  background:var(--rule) !important; border:0 !important; position:relative; cursor:pointer; transition:background-color .18s; flex:none; padding:0 !important; }
input.switch::after { content:""; position:absolute; top:3px; inset-inline-start:3px; width:16px; height:16px; border-radius:50%; background:var(--sheet);
  box-shadow:0 1px 2px rgba(0,0,0,.25); transition:inset-inline-start .18s; }
input.switch:checked { background:var(--accent) !important; }
input.switch:checked::after { inset-inline-start:21px; }
input.switch:disabled { opacity:.5; cursor:not-allowed; }

/* ---------- login ---------- */
.center-page { background-image:var(--grain); }
.card.login { background:var(--sheet) !important; border:1px solid var(--rule) !important; border-radius:var(--radius-lg) !important;
  box-shadow:0 1px 0 var(--sheet) inset, 0 40px 80px -50px rgba(40,30,0,.45) !important; padding:28px 30px 22px !important; width:380px; position:relative; }
.card.login::before { content:""; position:absolute; inset:6px; border:1px solid var(--rule-soft); border-radius:3px; pointer-events:none; }
.card.login > * { position:relative; }
.card.login .muted { font-family:var(--serif); font-style:italic; font-size:1rem; }
.card.login label { color:var(--ink-2); font-size:.82rem !important; letter-spacing:.02em; }
.card.login input { padding:10px 12px !important; }
.card.login button[type=submit] { padding:11px !important; font-size:.98rem; letter-spacing:.03em; }
.card.login #showPw { background:transparent !important; border:0 !important; color:var(--muted) !important; }
.card.login .err { color:var(--danger); }

/* ---------- admin ---------- */
nav.tabs { background:transparent !important; border-bottom:1px solid var(--rule) !important; padding:0 18px !important; gap:4px !important; }
nav.tabs button { background:transparent !important; border-radius:0 !important; color:var(--muted) !important; padding:12px 12px 11px !important;
  border-bottom:2px solid transparent !important; margin-bottom:-1px; font-size:.9rem; }
nav.tabs button:hover { color:var(--ink) !important; }
nav.tabs button.active { color:var(--ink) !important; border-bottom-color:var(--gold) !important; font-weight:600; background:transparent !important; }
nav.tabs .count { background:var(--danger) !important; }
main h2, .page-head h2 { font-family:var(--serif); font-weight:500; font-size:1.6rem; }
main h3 { font-family:var(--serif); font-weight:600; }
.card, .esec, .pcard { background:var(--sheet) !important; border:1px solid var(--rule) !important; border-radius:var(--radius-lg) !important; box-shadow:none !important; }
.card h3, .esec h4 { font-family:var(--serif); font-weight:600; }
table { background:transparent !important; border-radius:0 !important; }
th { background:transparent !important; color:var(--muted); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:600;
  border-bottom:1px solid var(--rule) !important; }
td { border-bottom:1px solid var(--rule-soft) !important; }
tr:hover td { background:color-mix(in srgb, var(--paper) 60%, transparent); }
.pill { background:transparent !important; border:1px solid var(--rule); color:var(--ink-2) !important; border-radius:999px !important; }
.pill.ok, .pill.global { border-color:color-mix(in srgb, var(--ok) 45%, transparent); color:var(--ok) !important; }
.pill.off { color:var(--muted) !important; }
.callout { background:var(--warn-soft) !important; color:var(--warn-ink) !important; border:1px solid var(--rule) !important; border-radius:var(--radius) !important; }
.savebar { background:color-mix(in srgb, var(--sheet) 94%, transparent) !important; border-top:1px solid var(--rule); }
.pitem { background:var(--sheet) !important; border:1px solid var(--rule) !important; border-radius:var(--radius) !important; }
.pitem.active { border-color:var(--gold-2) !important; box-shadow:inset 2px 0 0 var(--gold) !important; }
[dir=rtl] .pitem.active { box-shadow:inset -2px 0 0 var(--gold) !important; }
.pitem .lv i.standard { background:var(--gold-2) !important; } .pitem .lv i.strict { background:var(--danger) !important; }
.seg { border-radius:var(--radius) !important; }
.seg button.on, .seg button.active { background:var(--accent) !important; color:var(--accent-ink) !important; }
.badge-dot { background:var(--danger) !important; }
.ebar { background:var(--sheet) !important; border-bottom-color:var(--rule) !important; }
.eback { color:var(--accent) !important; }

/* ---------- phones ---------- */
@media (max-width: 760px) {
  header h1 { font-size:1.08rem; } .wordmark { gap:7px; } .wordmark .wm-seal { width:24px; height:24px; }
  .welcome { margin-top:4vh !important; } .welcome h2 { font-size:1.75rem; }
  .starters { grid-template-columns:1fr !important; }
  .starter:nth-child(odd) { border-inline-end:0 !important; }
  .msg.assistant .body { font-size:1.06rem; line-height:1.7; }
  .settings .sbody { grid-template-columns:1fr !important; }
  .settings .stabs { flex-direction:row !important; overflow-x:auto; padding:0 !important; border-inline-end:0 !important; border-bottom:1px solid var(--rule) !important; }
  .settings .stabs button { padding:12px 14px !important; }
  .settings .stabs button::before { inset-block:auto 0; inset-inline:12px; width:auto; height:2px; transform:scaleX(0); }
  .settings .stabs button.on::before { transform:scaleX(1); }
  .settings .spane { padding:4px 16px 24px !important; }
  .card.login { width:100%; padding:24px 20px 18px !important; }
  nav.tabs { padding:0 8px !important; }
}
@media print { body { background:#fff !important; } }

/* provider monograms: engraved, not app-icon badges */
.pcard .ph .ico { background:transparent !important; color:var(--ink) !important; border:1px solid var(--gold-2); border-radius:var(--radius) !important;
  font-family:var(--serif); font-weight:600; letter-spacing:.04em; box-shadow:inset 0 0 0 2px var(--sheet), inset 0 0 0 3px var(--rule-soft); }
form#form { max-width:780px !important; }
.settings select[size], .settings select[multiple] { background:var(--paper) !important; }
.settings .picker select option:checked { background:var(--gold-soft); color:var(--ink); }
.card.login #stepPw, .card.login #stepCode { display:flex; flex-direction:column; gap:14px; text-align:start; }
.card.login #stepPw[hidden], .card.login #stepCode[hidden] { display:none !important; }
.card.login button[type=submit] { width:100%; margin-top:4px; }
.card.login .langrow { margin-bottom:2px; }
/* admin tables: compact row actions */
main td button, main td .small { padding:3px 10px !important; font-size:.78rem !important; margin:2px 2px 2px 0; }
main td:last-child { white-space:normal; }
@media (min-width: 1100px) { main td:last-child button { display:inline-block; } }
/* touch screens have no hover: keep message actions reachable (subtle) instead of invisible-but-taking-space */
@media (hover: none) { .actions { opacity:.6 !important; } .msg:last-child .actions { opacity:1 !important; } }
/* admin forms on phones: fields never run past the card edge */
@media (max-width: 640px) {
  main select, main input:not([type=checkbox]):not([type=radio]), main textarea { max-width:100% !important; box-sizing:border-box; }
  main .card, main section, main fieldset { min-width:0; max-width:100%; box-sizing:border-box; }
}
/* save bars: solid, so content scrolling underneath doesn't ghost through */
.savebar { background:var(--paper) !important; backdrop-filter:none !important; border-top:1px solid var(--rule) !important; }
/* Hebrew/Yiddish: no faux-italic (Hebrew has no italic form) – except inside AI answers, which keep their own emphasis */
html[dir=rtl] *:not(.body *):not(.body) { font-style:normal !important; }
/* chat list: room for the ⋯ button on the interface's end side; titles ellipsize inside */
.conv { padding-inline-end:40px !important; }
.conv .ct { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
html[dir=rtl] .conv .ct { text-align:right; }
/* phone drawer: solid sheet (the chat used to show through the translucent sidebar) */
@media (max-width: 760px) { aside, #sidebar { background:var(--paper-2) !important; } }
/* phone admin cards: badges keep their size; row actions sit side by side */
@media (max-width: 640px) {
  main table.stack td { justify-items:start; }
  main table.stack td > select, main table.stack td > input:not([type=checkbox]) { justify-self:stretch; }
  main table.stack td[data-label=""] { display:flex !important; flex-wrap:wrap; gap:6px; }
  main table.stack td[data-label=""] button { margin:0 !important; min-height:40px; padding:6px 14px !important; }
}
/* grids on phones: a long <option> must not force the column wider than the card (1fr = minmax(auto,1fr)) */
@media (max-width: 980px) { .defaults { grid-template-columns:repeat(2, minmax(0, 1fr)) !important; } }
@media (max-width: 560px) {
  .defaults, .grid2, .grid3 { grid-template-columns:minmax(0, 1fr) !important; }
  main .field { min-width:0; } main select { min-width:0; width:100%; }
}
@media (max-width: 640px) {
  .settings .stabs { padding:0 !important; align-items:stretch; }
  .settings .stabs button { white-space:nowrap; flex:0 0 auto; padding:12px 16px !important; }
  .settings .stabs button::before { inset-block:auto 0; inset-inline:12px; width:auto; height:2px; transform:scaleX(0); }
  .settings .stabs button.on::before { transform:scaleX(1); }
}

/* ---------- phone sheets that really scroll (iOS Safari + Android) ----------
   Settings: a flex column exactly one screen tall; header and tab strip stay, only the pane scrolls. */
@media (max-width: 760px) {
  .modal-bg { overscroll-behavior:contain; }
  .modal.wide { height:100vh; height:100dvh; min-height:0 !important; max-height:100dvh; display:flex; flex-direction:column; overflow:hidden !important; }
  .modal.wide > .settings { flex:1 1 auto; min-height:0 !important; display:flex; flex-direction:column; }
  .settings .shead { flex:none; position:static !important; }
  .settings .sbody { flex:1 1 auto; min-height:0 !important; display:flex !important; flex-direction:column; }
  .settings .stabs { flex:none; position:static !important; }
  .settings .spane { flex:1 1 auto; min-height:0; max-height:none !important; overflow-y:auto !important; -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain; touch-action:pan-y; }
}
/* admin profile editor sheet on phones */
@media (max-width: 640px) {
  body.drawer-open .editor { height:100vh; height:100dvh; overflow-y:auto !important; -webkit-overflow-scrolling:touch; overscroll-behavior:contain; touch-action:pan-y; }
}

/* small phones: no room for the name beside the pickers - show the seal alone, never a clipped letter */
@media (max-width: 520px) { header:has(#modelChip) .wordmark .wm-name { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; } }   /* chat page only; still read by screen readers */
