
/* ==========================================================================
 * PRIME NOD LAYER (2026-09-02) - lore.u.cash speaks prime.u.cash's grammar.
 * Plateless surfaces (transparent fills, 1px gold hairlines), square corners
 * (universal kill, prime.css:885 idiom), gold-outline action buttons (hover =
 * brighter ring, never a fill, prime.css:132-140), the terminal type duo
 * (Orbitron display / Space Grotesk reading, both self-hosted latin subsets),
 * AA-shifted gold per theme, and the painted six-gradient chamfer keyline as
 * the HUD signature (appshell.css:203-218 technique, lore-scoped tokens).
 * Base rules above stay untouched; this layer overrides by source order.
 * ========================================================================== */

/* --- fonts (prime's @font-face, verbatim; paths local) --- */
@font-face {
  font-family: 'Orbitron';
  src: url('/media/fonts/orbitron-var.woff2?v=20260903a') format('woff2');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Space Grotesk';
  src: url('/media/fonts/space-grotesk-var.woff2?v=20260903a') format('woff2');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

/* --- prime gold tokens (AA-shifted per theme, prime.css:12-31 values) + HUD keyline --- */
:root {
  --prime-gold: #8a6513;
  --prime-gold-bright: #a37a29;
  --prime-gold-rgb: 138, 101, 19;
  --prime-gold-grad: linear-gradient(92deg, #a37a29, #8a6513);
  --lore-cut: 6px;
  --lore-keyline: rgba(163, 122, 41, 0.35);
  --lore-keyline-active: rgba(163, 122, 41, 0.8);
}
html.una-dark {
  --prime-gold: #f5d27a;
  --prime-gold-bright: #cc9933;
  --prime-gold-rgb: 245, 210, 122;
  --prime-gold-grad: linear-gradient(92deg, #f5d27a, #cc9933 60%, #8a6513);
  --lore-keyline: rgba(212, 168, 75, 0.28);
  --lore-keyline-active: rgba(212, 168, 75, 0.75);
}

/* --- square corners everywhere (prime's universal kill) --- */
*, *::before, *::after { border-radius: 0 !important; }

/* --- TYPE LAW: reading = Space Grotesk (variable 300-700, every weight real); display/labels = Orbitron. --- */
body, .una-text, .una-msg, .una-bubble, #una-input, .una-composer textarea,
.una-field input, .una-field select, .una-conv-search, .una-title-input,
.una-welcome-sub, .una-welcome-stats, .una-usage-sub, .una-diff, .una-result,
.una-cp-input, .una-rail-search input, .una-conv-title, .una-conv-preview, .una-cp-row-sub {
  font-family: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif !important;
  font-variant-numeric: tabular-nums;
}
.una-brand-wordmark, .una-welcome-h1, .una-btn, .una-welcome-chip,
.una-new, .una-section-title, .una-usage-btn, .una-pill, .una-action-tag,
.una-back-btn, .una-cp-close, .una-right-tab, .una-showmore, .una-w-cta,
.una-conv-tab, .una-role, .ut-mode {
  font-family: 'Orbitron', 'Space Grotesk', sans-serif !important;
  text-transform: uppercase;
  letter-spacing: .08em;
}
.una-welcome-h1 { font-weight: 800; letter-spacing: .04em; font-size: 24px; }
/* .una-title deliberately NOT restyled: the app header row stays exactly ai.u.cash's
   (base una.css styling) so the topbar rhythm matches the sibling app. */
.una-new-text, .una-usage-btn span { font-size: 11px; letter-spacing: .12em; font-weight: 600; }
.una-section-title { font-size: 10px; letter-spacing: .22em; color: var(--prime-gold-bright); }
.una-section-title::before { content: '// '; letter-spacing: 0; }

/* --- CHAT COLUMN: full width. Kills the base 768px reading-measure cap
 *     (una.css:214) so the stream + composer span the main pane. --- */
.una-col { max-width: none; }

/* --- BUTTON LAW (prime.css:132-140): gold hairline border, no fill, gold text;
 *     hover lifts + brightens the ring. NEVER a fill. --- */
.una-btn {
  background: none !important;
  border: 1px solid var(--prime-gold-bright);
  color: var(--prime-gold) !important;
  font-weight: 700;
  transition: transform .15s, box-shadow .2s, border-color .15s;
}
.una-btn:hover:not(:disabled) {
  background: none !important;
  transform: translateY(-1px);
  border-color: var(--prime-gold);
  box-shadow: 0 0 0 1px rgba(var(--prime-gold-rgb), .25), 0 10px 30px rgba(var(--prime-gold-rgb), .18);
}
.una-btn:disabled { opacity: .45; }

/* --- PLATELESS STRIPS: fills -> transparent + hairline --- */
.una-side-inner { background: transparent; }
.una-usage-banner { background: none; border: 1px solid rgba(var(--prime-gold-rgb), .3); }
.una-role { background: none; border: 1px solid rgba(var(--prime-gold-rgb), .4); color: var(--prime-gold); }
.ut-mode-ucash { background: none; border-color: rgba(var(--prime-gold-rgb), .5); }
.una-widget-head { background: none; border-bottom: 1px solid rgba(var(--prime-gold-rgb), .25); }
.una-msg.una .una-text code { background: none; border: 1px solid var(--border); padding: 1px 5px; }
.una-form-error { background: none; border: 1px solid rgba(220, 60, 60, .5); }
.una-app ::-webkit-scrollbar-thumb { background: rgba(var(--prime-gold-rgb), .3); }

/* hovers brighten borders instead of washing fills where it matters most */
.una-conv:hover { background: rgba(var(--prime-gold-rgb), .05); }
.una-conv.active { border-color: rgba(var(--prime-gold-rgb), .5); }

/* --- WELCOME: prime divider idiom (90deg transparent-fade gold hairline) + mono stats --- */
.una-welcome-stats {
  padding: 14px 0;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, rgba(var(--prime-gold-rgb), .35), transparent) 1;
  border-left: 0; border-right: 0; border-bottom: 0;
}
.una-welcome-stats a { color: var(--prime-gold); }
.una-welcome-mark { border: 1px solid rgba(var(--prime-gold-rgb), .35); }

/* --- THE CHAMFER SIGNATURE (appshell.css:203-218 technique, lore-scoped).
 *     Painted as six gradient layers on a ::before - four straight 1px edges plus
 *     two 1.4px 135deg stripes on the chamfer hypotenuses (1.4px diagonal = 1px
 *     perpendicular). The paint lives on the pseudo so hit-testing is untouched;
 *     hover/focus re-point the keyline token, never a fill. --- */
.una-welcome-chip, .una-new { position: relative; }
.una-welcome-chip::before, .una-new::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background:
    linear-gradient(135deg, transparent calc(50% - .7px), var(--lore-keyline) calc(50% - .7px), var(--lore-keyline) calc(50% + .7px), transparent calc(50% + .7px)) left 0 top 0 / var(--lore-cut) var(--lore-cut) no-repeat,
    linear-gradient(135deg, transparent calc(50% - .7px), var(--lore-keyline) calc(50% - .7px), var(--lore-keyline) calc(50% + .7px), transparent calc(50% + .7px)) right 0 bottom 0 / var(--lore-cut) var(--lore-cut) no-repeat,
    linear-gradient(var(--lore-keyline), var(--lore-keyline)) left var(--lore-cut) top 0 / calc(100% - var(--lore-cut)) 1px no-repeat,
    linear-gradient(var(--lore-keyline), var(--lore-keyline)) right 0 top 0 / 1px calc(100% - var(--lore-cut)) no-repeat,
    linear-gradient(var(--lore-keyline), var(--lore-keyline)) left 0 bottom 0 / calc(100% - var(--lore-cut)) 1px no-repeat,
    linear-gradient(var(--lore-keyline), var(--lore-keyline)) left 0 top var(--lore-cut) / 1px calc(100% - var(--lore-cut)) no-repeat;
}
.una-welcome-chip { border: 0; background: none; color: var(--prime-gold); font-size: 12px; letter-spacing: .1em; font-weight: 600; padding: 9px 16px; }
.una-welcome-chip span, .una-welcome-chip { position: relative; z-index: 1; }
.una-welcome-chip:hover { background: none; color: var(--prime-gold-bright); }
.una-welcome-chip:hover::before { --lore-keyline: var(--lore-keyline-active); }
.una-new { border-bottom: 1px solid rgba(var(--prime-gold-rgb), .3); }
.una-new:hover::before { --lore-keyline: var(--lore-keyline-active); }

/* overlays keep their paint (functional separation) but already squared by the kill */

/* --- LANDING (lp-*) block: same grammar for lore.u.cash's public page --- */
.lp-badge {
  background: none; border: 0; padding: 0;
  font-family: 'Orbitron', 'Space Grotesk', sans-serif;
  letter-spacing: .3em; text-transform: uppercase;
  font-size: 12px; font-weight: 700; color: var(--prime-gold-bright);
}
.lp-hero h1, .lp-cta-band h2 {
  font-family: 'Orbitron', 'Space Grotesk', sans-serif;
  font-weight: 800; letter-spacing: .01em; line-height: 1.08;
}
.lp-grad { background: var(--prime-gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lp-lede, .lp-feat p, .lp-step p, .lp-trust, .lp-foot-copy {
  font-family: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', Roboto, Arial, sans-serif;
}
.lp-feat h3, .lp-step h3, .lp-feats .lp-feat .lp-feat-ico + h3 {
  font-family: 'Orbitron', 'Space Grotesk', sans-serif;
  text-transform: uppercase; letter-spacing: .1em; font-size: 14px; font-weight: 700;
}
.lp-feat { background: none; border: 1px solid rgba(var(--prime-gold-rgb), .22); padding: 26px 22px; transition: transform .15s, border-color .15s, box-shadow .2s; }
.lp-feat:hover { transform: translateY(-3px); border-color: rgba(var(--prime-gold-rgb), .55); box-shadow: 0 0 0 1px rgba(var(--prime-gold-rgb), .12), 0 14px 34px rgba(var(--prime-gold-rgb), .12); }
.lp-feat-ico { background: none; border: 1px solid rgba(var(--prime-gold-rgb), .4); color: var(--prime-gold); }
.lp-feat-ico .lp-ico { color: inherit; }
.lp-step-n {
  background: none; border: 1px solid rgba(var(--prime-gold-rgb), .5); color: var(--prime-gold);
  font-family: 'Orbitron', 'Space Grotesk', sans-serif; font-weight: 700;
  width: 34px; height: 34px; display: flex; align-items: center; justify-content: center;
}
.lp-cta-band { background: none; border-top: 1px solid rgba(var(--prime-gold-rgb), .25); border-bottom: 1px solid rgba(var(--prime-gold-rgb), .25); }

/* the landing CTA (replaces the CDN filled uc-button--accent): prime button law,
 * hero variant carries the 8px two-corner chamfer (prime's in-card CTA exception). */
.lp-cta {
  display: inline-block; background: none; border: 1px solid var(--prime-gold-bright); color: var(--prime-gold);
  font-weight: 800; letter-spacing: .04em; text-transform: uppercase; font-size: 13px;
  font-family: 'Orbitron', 'Space Grotesk', sans-serif;
  padding: 12px 21px; cursor: pointer; text-decoration: none; text-align: center;
  transition: transform .15s, box-shadow .2s, border-color .15s;
}
.lp-cta:hover { transform: translateY(-1px); border-color: var(--prime-gold); color: var(--prime-gold); box-shadow: 0 0 0 1px rgba(var(--prime-gold-rgb), .25), 0 10px 30px rgba(var(--prime-gold-rgb), .22); }
.lp-cta-chamfer { clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px); padding-left: 18px; padding-right: 18px; }
.lp-cta-band .lp-cta { font-size: 15px; padding: 15px 30px; margin-top: 32px; }

/* --- FIRST-VISIT WELCOME VEIL (the Univirsal intro). Overlay exception like the
 *     command palette: near-solid bg for separation, but square + chamfered. --- */
.lore-welcome-veil { position: fixed; inset: 0; z-index: 99999; background: rgba(0,0,0,.74); display: flex; align-items: center; justify-content: center; animation: lore-veil-in .45s ease both; }
.lore-welcome-veil[hidden] { display: none; }
.lore-welcome-card { position: relative; max-width: 560px; margin: 20px; padding: 46px 42px 40px; text-align: center; background: var(--bg-elev); animation: lore-card-in .55s .08s cubic-bezier(.2,.7,.2,1) both; }
.lore-welcome-card::before {
  content: ''; position: absolute; inset: 0; pointer-events: none;
  --veil-cut: 12px;
  background:
    linear-gradient(135deg, transparent calc(50% - .7px), var(--lore-keyline-active) calc(50% - .7px), var(--lore-keyline-active) calc(50% + .7px), transparent calc(50% + .7px)) left 0 top 0 / var(--veil-cut) var(--veil-cut) no-repeat,
    linear-gradient(135deg, transparent calc(50% - .7px), var(--lore-keyline-active) calc(50% - .7px), var(--lore-keyline-active) calc(50% + .7px), transparent calc(50% + .7px)) right 0 bottom 0 / var(--veil-cut) var(--veil-cut) no-repeat,
    linear-gradient(var(--lore-keyline-active), var(--lore-keyline-active)) left var(--veil-cut) top 0 / calc(100% - var(--veil-cut)) 1px no-repeat,
    linear-gradient(var(--lore-keyline-active), var(--lore-keyline-active)) right 0 top 0 / 1px calc(100% - var(--veil-cut)) no-repeat,
    linear-gradient(var(--lore-keyline-active), var(--lore-keyline-active)) left 0 bottom 0 / calc(100% - var(--veil-cut)) 1px no-repeat,
    linear-gradient(var(--lore-keyline-active), var(--lore-keyline-active)) left 0 top var(--veil-cut) / 1px calc(100% - var(--veil-cut)) no-repeat;
}
.lore-welcome-kicker { font-family: 'Orbitron', 'Space Grotesk', sans-serif; letter-spacing: .3em; text-transform: uppercase; font-size: 11px; font-weight: 700; color: var(--prime-gold-bright); margin-bottom: 14px; animation: lore-rise .5s .3s both; }
.lore-welcome-title { font-family: 'Orbitron', 'Space Grotesk', sans-serif; font-weight: 800; font-size: clamp(21px, 3vw, 28px); letter-spacing: .02em; line-height: 1.2; margin: 0; animation: lore-rise .5s .4s both; }
.lore-welcome-title .grad, .lore-welcome-title { color: var(--text); }
.lore-welcome-line { font-family: 'Space Grotesk', system-ui, -apple-system, sans-serif; color: var(--mute); max-width: 420px; margin: 14px auto 4px; font-size: 14px; line-height: 1.65; animation: lore-rise .5s .5s both; }
.lore-welcome-never { display: flex; gap: 8px; align-items: center; justify-content: center; margin: 20px 0 22px; font-family: 'Space Grotesk', system-ui, -apple-system, sans-serif; font-size: 12.5px; color: var(--mute); cursor: pointer; animation: lore-rise .5s .6s both; }
.lore-welcome-never input { accent-color: var(--prime-gold-bright); width: 14px; height: 14px; cursor: pointer; }
.lore-welcome-enter { animation: lore-rise .5s .7s both; }
@keyframes lore-veil-in { from { opacity: 0; } }
@keyframes lore-card-in { from { opacity: 0; transform: translateY(14px); } }
@keyframes lore-rise { from { opacity: 0; transform: translateY(8px); } }
@media (prefers-reduced-motion: reduce) {
  .lore-welcome-veil, .lore-welcome-card, .lore-welcome-kicker, .lore-welcome-title,
  .lore-welcome-line, .lore-welcome-never, .lore-welcome-enter { animation: none; }
}

/* --- LORE brand pair on the landing (una.css's icon-pair rules don't load here) --- */
html.una-dark .lp-ico-dark { display: inline-block; }
html.una-dark .lp-ico-light { display: none; }
html.una-light .lp-ico-light { display: inline-block; }
html.una-light .lp-ico-dark { display: none; }
.lp-wordmark { height: 22px; width: auto; }

/* --- sidebar brand: the LORE wordmark fills the brand row --- */
/* base una.css parks it at a 24px-tall orphan (letters ~17px, 84px wide in a 192x52
 * row). Width-driven sizing lets the Orbitron glyphs carry the row like a wordmark
 * should; object-fit + max-width keep it honest when the row narrows (peek, future
 * breakpoints). The dark/light pair stays theme-toggled by the base sheet. */
.una-brand .una-brand-wordmark { height: auto; width: 150px; max-width: 100%; object-fit: contain; flex-shrink: 1; }
/* centered in the brand row (the cropped viewBox means the box IS the glyphs, so
 * vertical flex-centering centers the ink). Collapsed keeps the L icon left like ai/una. */
.una-app:not(.side-collapsed) .una-side-head .una-brand { justify-content: center; }

/* --- topbar right cluster: [app drawer][account menu] pinned right, order fixed by markup --- */
/* stretch like ai/una: the hosts carry align-self:stretch and the button height:100%
   (full-bar integrated buttons), so the wrapper must stretch too - align-items:center
   clamped them into small floating chips. */
.una-topbar-right { margin-left: auto; display: flex; align-items: stretch; align-self: stretch; gap: 0; }
/* --- SOURCES WIDGET: the deterministic footer folded into a collapsed block.
 *     Chevron or an inline [n] cite (una.js delegation) expands it; every row
 *     links its real Prime wiki page. Same gold-hairline grammar as the rest. --- */
.una-sources { margin-top: 12px; }
.una-sources-head {
  display: inline-flex; align-items: center; gap: 8px; background: none; border: 0;
  padding: 2px 0; cursor: pointer; color: var(--prime-gold-bright);
  font-family: 'Orbitron', 'Space Grotesk', sans-serif; font-size: 10px;
  letter-spacing: .22em; text-transform: uppercase;
}
.una-sources-head::before { content: '// '; letter-spacing: 0; }
.una-sources-n {
  color: var(--prime-gold); border: 1px solid rgba(var(--prime-gold-rgb), .4);
  padding: 0 5px; font-size: 9px; letter-spacing: 0; line-height: 14px;
}
.una-sources-chev {
  width: 11px; height: 11px; stroke: var(--prime-gold-bright); fill: none;
  stroke-width: 2; transition: transform .15s;
}
.una-sources[data-open="1"] .una-sources-chev { transform: rotate(90deg); }
.una-sources-list {
  display: none; margin-top: 6px; flex-direction: column;
  border-top: 1px solid transparent;
  border-image: linear-gradient(90deg, transparent, rgba(var(--prime-gold-rgb), .35), transparent) 1;
  border-left: 0; border-right: 0; border-bottom: 0;
}
.una-sources[data-open="1"] .una-sources-list { display: flex; }
.una-src {
  display: flex; align-items: baseline; gap: 8px; padding: 5px 0;
  border-bottom: 1px solid rgba(var(--prime-gold-rgb), .14);
  text-decoration: none; color: var(--text); font-size: 12.5px; line-height: 1.5;
}
.una-src:hover .una-src-title { color: var(--prime-gold); }
.una-src-n { color: var(--prime-gold-bright); font-size: 11px; flex-shrink: 0; }
.una-src-kind {
  font-family: 'Orbitron', 'Space Grotesk', sans-serif; font-size: 8.5px;
  letter-spacing: .14em; text-transform: uppercase; color: var(--prime-gold);
  border: 1px solid rgba(var(--prime-gold-rgb), .35); padding: 1px 5px;
  white-space: nowrap; flex-shrink: 0;
}
.una-src-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.una-src.flash { background: rgba(var(--prime-gold-rgb), .12); }
.una-cite { color: var(--prime-gold-bright); cursor: pointer; font-weight: 600; text-decoration: none; }
.una-cite:hover { color: var(--prime-gold); }
