:root {
  /* — brand constants (mode-independent) — */
  --pt-serif: "Palatino Linotype", Palatino, "Book Antiqua", "URW Palladio L", Georgia, "Times New Roman", serif;
  --pt-sans:  "Avenir Next", Avenir, "Segoe UI", "Helvetica Neue", Helvetica, system-ui, sans-serif;
  --pt-gold:        #d4a24e;  /* gold-leaf: rules, diamonds, dark-surface accents */
  --pt-ember:       #8a4b24;  /* primary action fill */
  --pt-ember-hover: #75401f;
  --pt-ivory:       #ede3cf;  /* text on dark surfaces */
  --pt-ivory-dim:   rgba(237, 227, 207, 0.72);
  --pt-ivory-faint: rgba(237, 227, 207, 0.5);
  --pt-sidebar:     #201310;  /* mesa-near: sidebar/topbar base */
  --pt-sidebar-2:   #33201a;  /* sidebar hover surface */

  /* — light (parchment) mode — */
  --pt-page:      #eae0c9;  /* aged-paper page background */
  --pt-surface:   #f6f0e1;  /* cards, tables */
  --pt-inset:     #ece2cb;  /* table heads, hovers, wells */
  --pt-ink:       #2b1a13;  /* body text (umber ink) — 12.9:1 on surface */
  --pt-muted:     #6b5744;  /* secondary text — 6:1 on surface */
  --pt-line:      #d9cbae;  /* component borders */
  --pt-hairline:  rgba(43, 26, 19, 0.14);
  --pt-gold-ink:  #8a6420;  /* gold for TEXT on parchment — 4.7:1 (raw #d4a24e is 1.9:1, never use it as text on light) */
  --pt-success:   #4c6b45;  /* sage        — 5.3:1 on surface, 6:1 w/ white text */
  --pt-danger:    #a13c28;  /* rust oxide  — 5.8:1 on surface */
  --pt-warning:   #b07a1e;  /* amber (fills take dark text) */
  --pt-info:      #55707d;  /* dusty steel */
  --pt-focus:     rgba(212, 162, 78, 0.35);
  --pt-shadow:    0 1px 4px rgba(43, 26, 19, 0.08);

  /* legacy hooks — keep names, remap values */
  --ore: var(--pt-gold);          /* inline badge uses text-dark on this: gold + dark text reads well */
  --rock: var(--pt-sidebar);
  --rock-2: var(--pt-sidebar-2);
  --page-bg: var(--pt-page);
}

[data-bs-theme="dark"] {
  /* — dusk mode — */
  --pt-page:      #171009;  /* ink-sky */
  --pt-surface:   #241811;  /* umber panel */
  --pt-inset:     #2e2016;
  --pt-ink:       #ede3cf;  /* 13.5:1 on surface */
  --pt-muted:     #b3a68b;  /* ~7:1 */
  --pt-line:      #3a2a1d;
  --pt-hairline:  rgba(237, 227, 207, 0.12);
  --pt-gold-ink:  var(--pt-gold);  /* raw gold works on dark: 7.5:1 */
  --pt-success:   #7fa276;
  --pt-danger:    #d0705a;
  --pt-warning:   #d4a24e;
  --pt-info:      #8aa7b4;
  --pt-focus:     rgba(212, 162, 78, 0.4);
  --pt-shadow:    0 1px 6px rgba(0, 0, 0, 0.45);
  --page-bg: var(--pt-page);
}

:root, [data-bs-theme="light"], [data-bs-theme="dark"] {
  --bs-body-bg: var(--pt-page);
  --bs-body-color: var(--pt-ink);
  --bs-body-font-family: var(--pt-sans);
  --bs-secondary-color: var(--pt-muted);
  --bs-tertiary-color: var(--pt-muted);
  --bs-border-color: var(--pt-line);
  --bs-link-color: var(--pt-gold-ink);
  --bs-link-hover-color: var(--pt-ember);
  --bs-emphasis-color: var(--pt-ink);
  --bs-secondary-bg: var(--pt-inset);
  --bs-tertiary-bg: var(--pt-inset);
}
body {
  background-color: var(--pt-page);
  color: var(--pt-ink);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
}

/* ============================================================
   LEFT SIDEBAR NAVIGATION
   Sidebar is the dark --rock shade in both light & dark themes.
   Static fixed column on lg+, off-canvas drawer below lg.
   ============================================================ */
:root { --sidebar-w: 240px; }

.app-nav { background: linear-gradient(180deg, #1a1210, #241610 60%, #2b1a13); color: var(--pt-ivory-dim); }
.app-brand { color: var(--pt-ivory) !important; }
.app-brand i { color: var(--pt-gold); }

/* Mobile top bar */
.app-topbar { background: #1a1210; }  /* flat — sticky bar, no gradient banding */
.app-topbar .app-burger { color: #fff; font-size: 1.4rem; line-height: 1; }
.app-topbar .app-burger:focus { box-shadow: none; }
.app-topbar .pt-brand-sub { display: none; }
.app-topbar .pt-wordmark { font-size: 0.95rem; }

/* Sidebar shell */
.app-sidebar { width: var(--sidebar-w); }
.app-sidebar.offcanvas-lg { color: var(--pt-ivory-dim); }

/* On lg+, the offcanvas-lg renders as a static block in normal flow.
   Make it a fixed full-height left column. */
/* Persistent sidebar only on true desktops (xl+). Tablets/iPads (incl. landscape
   ~1024-1194px) use the off-canvas hamburger drawer so the menu is touch-friendly. */
@media (min-width: 1200px) {
  .app-sidebar {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    width: var(--sidebar-w);
    z-index: 1030;
    overflow: hidden;
  }
}

/* ============================================================
   HORIZONTAL-OVERFLOW GUARDS
   Keep content within the viewport at any width. We use
   overflow-x:clip on the content wrapper (NOT html/body
   overflow-x:hidden, which would break position:sticky on the
   mobile .app-topbar / nested scrollers on iOS). min-width:0
   lets flex/grid children actually shrink.
   ============================================================ */
.app-content {
  min-width: 0;
  max-width: 100%;
  overflow-x: clip;
}
.table-responsive { max-width: 100%; }
img, video, canvas, svg { max-width: 100%; }
.overflow-wrap-anywhere { overflow-wrap: anywhere; word-break: break-word; }

/* ============================================================
   PERSISTENT SIDEBAR OFFSET + DESKTOP COLLAPSE (xl+)
   Placed AFTER the overflow guard so the calc width wins over
   .app-content { max-width:100% }. On xl+ the content sits to the
   right of the 240px fixed sidebar and is exactly viewport-minus-
   sidebar wide (no horizontal scroll). The collapse toggle hides
   the sidebar and reflows content full-width; state is persisted.
   ============================================================ */
.app-sidebar-collapse,            /* collapse chevron — desktop only */
.app-reopen { display: none; }    /* floating reopen — desktop+collapsed only */

.app-reopen {
  position: fixed; top: .5rem; left: .5rem; z-index: 1035;
  width: 2.4rem; height: 2.4rem; border-radius: 8px;
  color: #fff; font-size: 1.3rem; line-height: 1;
  background: #241610;
}
.app-sidebar-collapse { color: var(--pt-ivory-dim); }
.app-sidebar-collapse:hover { color: var(--pt-ivory); }

@media (min-width: 1200px) {
  .app-content { margin-left: var(--sidebar-w); max-width: calc(100% - var(--sidebar-w)); }
  .app-sidebar-collapse { display: inline-flex; }
  html.nav-collapsed .app-sidebar { display: none; }
  html.nav-collapsed .app-content { margin-left: 0; max-width: 100%; }
  html.nav-collapsed .app-reopen { display: inline-flex; align-items: center; justify-content: center; }
}

.app-sidebar-body { height: 100%; overflow-y: auto; }

.app-sidebar-brand {
  font-size: 1.2rem;
  padding: 1rem 1rem .75rem;
  gap: .4rem;
  text-decoration: none;
  border-bottom: 1px solid rgba(212, 162, 78, 0.25);
  padding-bottom: 0.9rem;
}
.app-sidebar-brand i { font-size: 1.4rem; }

/* Wordmark */
.pt-wordmark {
  display: block;
  font-family: var(--pt-serif);
  font-size: 1.06rem;
  font-weight: 400;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pt-ivory);
}
.pt-gem { color: var(--pt-gold); font-size: 0.55em; vertical-align: 0.35em; padding: 0 0.45em; letter-spacing: 0; }
.pt-brand-sub {
  display: block;
  font-family: var(--pt-sans);
  font-size: 0.56rem;
  font-weight: 500;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  color: var(--pt-ivory-faint);
  margin-top: 0.2rem;
}

/* Nav links inside the sidebar */
.app-sidebar-nav { padding: .25rem .5rem; margin: 0; }
.app-sidebar-nav .nav-link {
  color: var(--pt-ivory-dim);
  border-radius: 6px;
  padding: .55rem .75rem;
  display: flex;
  align-items: center;
  gap: .65rem;
  font-weight: 500;
}
.app-sidebar-nav .nav-link i { font-size: 1.1rem; width: 1.25rem; text-align: center; flex: 0 0 auto; }
.app-sidebar-nav .nav-link:hover,
.app-sidebar-nav .nav-link:focus { background: rgba(237, 227, 207, 0.07); color: var(--pt-ivory); }
.app-sidebar-nav .nav-link.active {
  background: rgba(212, 162, 78, 0.14) !important;
  color: #e9cf9a !important;
  box-shadow: inset 3px 0 0 var(--pt-gold);   /* gold rail = active state */
  font-weight: 600;
}
.app-sidebar-nav .nav-link.active i { color: var(--pt-gold); }

.app-sidebar-footer { padding-bottom: .5rem; }
.app-sidebar-divider { border-color: rgba(212, 162, 78, 0.22); margin: .5rem .75rem; opacity: 1; }
.app-sidebar-user {
  display: flex; align-items: center; gap: .5rem;
  padding: .5rem 1.1rem .25rem;
  color: var(--pt-ivory-faint); font-size: .85rem;
}
.app-sidebar-user i { font-size: 1.1rem; }

/* Theme toggle button — styled as a sidebar nav-link in both themes */
#theme-toggle {
  color: var(--pt-ivory-dim);
  text-decoration: none;
  background: transparent;
}
#theme-toggle:hover,
#theme-toggle:focus { background: rgba(237, 227, 207, 0.07); color: var(--pt-ivory); box-shadow: none; }
#theme-toggle i { font-size: 1.1rem; width: 1.25rem; text-align: center; flex: 0 0 auto; }
#theme-toggle span { font-weight: 500; }

/* Larger tap targets on mobile */
@media (max-width: 768px) {
  .btn { padding: .5rem .85rem; }
  .table td, .table th { font-size: .9rem; }
}

/* ============================================================
   TYPOGRAPHY
   ============================================================ */
h1, h2, h3, h4, .card-title {
  font-family: var(--pt-serif);
  font-weight: 400;
  letter-spacing: 0.02em;
  color: var(--pt-ink);
}
h4 > i.bi { color: var(--pt-gold-ink); font-size: 0.85em; margin-right: 0.15rem; }

.card h6 {
  font-family: var(--pt-sans);
  font-size: 0.72rem;
  font-weight: 600;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pt-muted);
}
.card h6::before { content: "\25C6"; color: var(--pt-gold); font-size: 0.7em; margin-right: 0.5em; vertical-align: 0.1em; }

.form-label, .table th {
  font-family: var(--pt-sans);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pt-muted);
  font-weight: 600;
}
.table th { font-size: 0.70rem; }

.stat-card .stat-value {
  font-family: var(--pt-serif);
  font-size: 1.75rem;
  font-weight: 400;
  font-variant-numeric: lining-nums tabular-nums;
  color: var(--pt-ink);
}

hr { border-color: rgba(212, 162, 78, 0.35); opacity: 1; }

.pt-pagehead { border-bottom: 1px solid rgba(212, 162, 78, 0.4); padding-bottom: 0.6rem; margin-bottom: 1rem; }

/* ============================================================
   BUTTONS
   ============================================================ */
.btn-ore, .btn-primary {
  --bs-btn-bg: var(--pt-ember); --bs-btn-border-color: var(--pt-ember); --bs-btn-color: #f6ecda;
  --bs-btn-hover-bg: var(--pt-ember-hover); --bs-btn-hover-border-color: var(--pt-ember-hover); --bs-btn-hover-color: #f6ecda;
  --bs-btn-active-bg: var(--pt-ember-hover); --bs-btn-active-color: #f6ecda;
}
.btn-dark {
  --bs-btn-bg: #3a2a1d; --bs-btn-border-color: #3a2a1d; --bs-btn-color: var(--pt-ivory);
  --bs-btn-hover-bg: #4a3524; --bs-btn-hover-color: var(--pt-ivory);
  --bs-btn-active-bg: #4a3524; --bs-btn-active-color: var(--pt-ivory);
}
.btn-outline-dark, .btn-outline-secondary {
  --bs-btn-color: var(--pt-ink); --bs-btn-border-color: var(--pt-line);
  --bs-btn-hover-bg: var(--pt-inset); --bs-btn-hover-color: var(--pt-ink); --bs-btn-hover-border-color: var(--pt-muted);
  --bs-btn-active-bg: var(--pt-inset); --bs-btn-active-color: var(--pt-ink);
}
.btn-danger {
  --bs-btn-bg: var(--pt-danger); --bs-btn-border-color: var(--pt-danger); --bs-btn-color: #fff;
  --bs-btn-hover-bg: #8a3220; --bs-btn-hover-border-color: #8a3220; --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: #8a3220; --bs-btn-active-color: #fff;
}
.btn-outline-danger {
  --bs-btn-color: var(--pt-danger); --bs-btn-border-color: var(--pt-danger);
  --bs-btn-hover-bg: var(--pt-danger); --bs-btn-hover-color: #fff; --bs-btn-hover-border-color: var(--pt-danger);
  --bs-btn-active-bg: var(--pt-danger); --bs-btn-active-color: #fff;
}
.btn-success {
  --bs-btn-bg: var(--pt-success); --bs-btn-border-color: var(--pt-success); --bs-btn-color: #fff;
  --bs-btn-hover-bg: #3d5738; --bs-btn-hover-border-color: #3d5738; --bs-btn-hover-color: #fff;
  --bs-btn-active-bg: #3d5738; --bs-btn-active-color: #fff;
}
.btn { border-radius: 6px; }

.text-ore { color: var(--pt-gold-ink) !important; }

/* ============================================================
   TABLES
   ============================================================ */
.table {
  --bs-table-bg: transparent;
  --bs-table-color: var(--pt-ink);
  --bs-table-border-color: var(--pt-line);
  --bs-table-striped-bg: rgba(43, 26, 19, 0.03);
  --bs-table-hover-bg: rgba(212, 162, 78, 0.10);
  --bs-table-hover-color: var(--pt-ink);
}
[data-bs-theme="dark"] .table {
  --bs-table-striped-bg: rgba(237, 227, 207, 0.03);
  --bs-table-hover-bg: rgba(212, 162, 78, 0.12);
}
/* thead — templates use .table-light; make it a parchment inset with eyebrow type */
.table-light, .table > thead.table-light th {
  --bs-table-bg: var(--pt-inset); --bs-table-color: var(--pt-muted);
  background-color: var(--pt-inset); color: var(--pt-muted); border-color: var(--pt-line);
}
.table thead th {
  font-family: var(--pt-sans); font-size: 0.70rem; font-weight: 600;
  letter-spacing: 0.08em; text-transform: uppercase;
  border-bottom: 2px solid rgba(212, 162, 78, 0.45);  /* gold hairline under the header row */
}
.table td { border-color: var(--pt-hairline); }
.table-responsive { border-radius: 10px; max-width: 100%; }

/* ============================================================
   CARDS
   ============================================================ */
.card {
  background-color: var(--pt-surface);
  border: 1px solid var(--pt-line);
  border-radius: 10px;
  box-shadow: var(--pt-shadow);
  color: var(--pt-ink);
}
.stat-card { border: 1px solid var(--pt-line); border-radius: 10px; }
.stat-card .stat-icon { font-size: 1.8rem; opacity: 0.75; }

#map { height: 70vh; min-height: 420px; width: 100%; border-radius: 12px; }
[data-bs-theme="dark"] #map { background: var(--pt-surface); }
.area-photo { width: 100%; height: 160px; object-fit: cover; border-radius: 8px; }
.receipt-thumb { max-height: 60px; border-radius: 6px; }

.pipeline-col { min-width: 240px; }
.stage-badge { font-size: .72rem; }

/* ============================================================
   FORMS
   ============================================================ */
.form-control, .form-select {
  background-color: #fbf7ec;
  border: 1px solid #c9b98f;
  color: var(--pt-ink);
  border-radius: 6px;
}
.form-control::placeholder { color: var(--pt-muted); opacity: 0.7; }
.form-control:focus, .form-select:focus {
  background-color: #fffdf6;
  border-color: #b98b2e;
  box-shadow: 0 0 0 0.25rem var(--pt-focus);
  color: var(--pt-ink);
}
[data-bs-theme="dark"] .form-control, [data-bs-theme="dark"] .form-select {
  background-color: #2a1c12; border-color: #4a3826; color: var(--pt-ivory);
}
[data-bs-theme="dark"] .form-control:focus, [data-bs-theme="dark"] .form-select:focus {
  background-color: #312116; border-color: var(--pt-gold);
}
.form-control:-webkit-autofill,
.form-control:-webkit-autofill:hover,
.form-control:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #fbf7ec inset;
  -webkit-text-fill-color: var(--pt-ink);
}
.form-check-input:checked { background-color: var(--pt-ember); border-color: var(--pt-ember); }
.form-check-input:focus { box-shadow: 0 0 0 0.25rem var(--pt-focus); border-color: #b98b2e; }

/* ============================================================
   BADGES
   ============================================================ */
.badge.bg-success   { background-color: var(--pt-success) !important; }
.badge.bg-danger    { background-color: var(--pt-danger) !important; }
.badge.bg-secondary { background-color: var(--pt-muted) !important; }
.badge.bg-warning   { background-color: var(--pt-warning) !important; }  /* keeps its text-dark */
.badge { font-weight: 600; letter-spacing: 0.03em; border-radius: 4px; }
[data-bs-theme="dark"] .badge.bg-success { background-color: #4c6b45 !important; }
[data-bs-theme="dark"] .badge.bg-danger  { background-color: #a13c28 !important; }
[data-bs-theme="dark"] .badge.bg-secondary { background-color: #6b5744 !important; }
[data-bs-theme="dark"] .badge.bg-warning { background-color: #b07a1e !important; }

/* ============================================================
   ALERTS (flash messages)
   ============================================================ */
.alert-success { --bs-alert-bg: #e4e9dc; --bs-alert-color: #33482e; --bs-alert-border-color: #b9c7ae; }
.alert-danger  { --bs-alert-bg: #f0ddd4; --bs-alert-color: #6e2718; --bs-alert-border-color: #d8b0a2; }
.alert-warning { --bs-alert-bg: #f3e7c9; --bs-alert-color: #6d4a0f; --bs-alert-border-color: #ddc48a; }
.alert-info    { --bs-alert-bg: #dfe7ea; --bs-alert-color: #2f4750; --bs-alert-border-color: #b3c5cc; }
[data-bs-theme="dark"] .alert-success { --bs-alert-bg: #22301f; --bs-alert-color: #b9d0b0; --bs-alert-border-color: #3d5237; }
[data-bs-theme="dark"] .alert-danger  { --bs-alert-bg: #38201a; --bs-alert-color: #e5b3a6; --bs-alert-border-color: #6e3a2c; }
[data-bs-theme="dark"] .alert-warning { --bs-alert-bg: #362a14; --bs-alert-color: #e3c98e; --bs-alert-border-color: #6d5526; }
[data-bs-theme="dark"] .alert-info    { --bs-alert-bg: #1e2b30; --bs-alert-color: #b4cdd6; --bs-alert-border-color: #3a545e; }
.alert { border-radius: 8px; border-left: 3px solid var(--bs-alert-border-color); }

/* ============================================================
   PAGINATION, MISC
   ============================================================ */
.page-link { color: var(--pt-gold-ink); background-color: var(--pt-surface); border-color: var(--pt-line); }
.page-link:hover { background-color: var(--pt-inset); color: var(--pt-ink); }
.active > .page-link, .page-link.active { background-color: var(--pt-ember); border-color: var(--pt-ember); color: #f6ecda; }
.list-group-item { background-color: var(--pt-surface); color: var(--pt-ink); border-color: var(--pt-line); }
.bg-white, .bg-light { background-color: var(--pt-surface) !important; }
.border, .border-top, .border-bottom, .border-start, .border-end { border-color: var(--pt-hairline) !important; }

/* Lighten .text-dark on dark surfaces, but NOT on colored badges (e.g.
   bg-warning/bg-info text-dark) where dark text is intentional & readable. */
[data-bs-theme="dark"] .text-dark:not(.badge) { color: #ede3cf !important; }

/* ============================================================
   FOCUS VISIBILITY (global, keyboard)
   ============================================================ */
:focus-visible { outline: 2px solid var(--pt-gold); outline-offset: 2px; }
.btn:focus-visible, .form-control:focus, .form-select:focus { outline: none; } /* they have ring/box-shadow */

/* ============================================================
   ASSISTANT CHAT
   The template hardcodes light surfaces in its own <style>,
   so override them here (white bubbles would hide the light reply text).
   ============================================================ */
[data-bs-theme="dark"] .chat-scroll { background: #1d130c; }
[data-bs-theme="dark"] .bubble-ai {
  background: #2e2016; border-color: #3a2a1d; color: #ede3cf;
}
[data-bs-theme="dark"] .action-card {
  background: #2e2016; border-color: #3a2a1d; color: #ede3cf;
}
[data-bs-theme="dark"] .action-card.tier3 { background: #2a1f1f; border-color: #5a2b2b; }
[data-bs-theme="dark"] .ac-chip { background: #1e2a1e; }

/* ============================================================
   LEAFLET — recolor only, never restyle broadly (guardrail).
   Light mode stays stock white so search/draw controls read as
   obviously interactive. Dark mode gets a themed popup/control skin.
   ============================================================ */
[data-bs-theme="dark"] .leaflet-popup-content-wrapper,
[data-bs-theme="dark"] .leaflet-popup-tip,
[data-bs-theme="dark"] .leaflet-bar a,
[data-bs-theme="dark"] .leaflet-control-layers {
  background: #2e2016; color: #ede3cf; border-color: #3a2a1d;
}
[data-bs-theme="dark"] .leaflet-popup-content a { color: var(--pt-gold); }

/* ============================================================
   LOGIN PAGE — dusk scene, always-on brand moment (see auth/login.html)
   Scoped under .pt-login so it never leaks into app pages.
   ============================================================ */
body.pt-login {
  min-height: 100svh;
  background:
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.06'/%3E%3C/svg%3E"),
    linear-gradient(180deg, #1a1210 0%, #2b1a13 38%, #4a2a1a 62%, #8a4b24 86%, #cf7c3c 100%);
  background-attachment: fixed;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  padding: 2rem 1rem;
}
.pt-login-eyebrow {
  font-family: var(--pt-sans);
  font-size: 0.62rem;
  font-weight: 500;
  letter-spacing: 0.4em;
  text-indent: 0.4em;
  text-transform: uppercase;
  color: var(--pt-ivory-faint);
  text-align: center;
  margin-bottom: 1.1rem;
}
.pt-login-wordmark {
  font-family: var(--pt-serif);
  font-size: clamp(1.9rem, 7vw, 2.6rem);
  font-weight: 400;
  letter-spacing: 0.16em;
  text-indent: 0.16em;
  text-transform: uppercase;
  color: var(--pt-ivory);
  text-align: center;
  line-height: 1.15;
}
.pt-login-wordmark .pt-gem {
  color: var(--pt-gold);
  font-size: 0.32em;
  vertical-align: 0.62em;
  padding: 0 0.5em;
  letter-spacing: 0;
}
.pt-login-rule {
  margin: 1.5rem auto;
  width: 9rem;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(212, 162, 78, 0.7) 25%, rgba(212, 162, 78, 0.7) 75%, transparent);
  position: relative;
}
.pt-login-rule::after {
  content: "";
  position: absolute;
  left: 50%; top: 50%;
  width: 7px; height: 7px;
  background: var(--pt-gold);
  transform: translate(-50%, -50%) rotate(45deg);
}
.pt-login-card {
  background: #f6f0e1;
  border: 1px solid rgba(212, 162, 78, 0.5);
  border-radius: 12px;
  box-shadow: 0 18px 50px rgba(10, 6, 4, 0.5);
  color: #2b1a13;
  max-width: 420px;
  width: 100%;
}
.pt-login-hint { color: var(--pt-ivory-faint); }
.pt-seal {
  margin-top: 1.75rem;
  width: 88px;
  height: auto;
  color: rgba(212, 162, 78, 0.55);
  transform: rotate(-8deg);
}
.pt-seal text {
  font-family: var(--pt-sans);
  font-size: 9.5px;
  font-weight: 500;
  letter-spacing: 2.3px;
  fill: currentColor;
}

/* ============================================================
   MOTION
   Transitions kept short and scoped to interactive-state props only.
   No entrance animations anywhere in the app.
   ============================================================ */
.btn, .nav-link, .form-control, .form-select, .page-link, #theme-toggle {
  transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, box-shadow 150ms ease;
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; }
}