/* ══════════════════════════════════════════════════════════════════════════
   ▓▓ MINIMAL WARM ▓▓  (loaded after style.css, so it wins)
   Warm cream · brown · orange — the "Reo's Home" tone. Airy, soft, friendly.
   Bricolage Grotesque display + Hanken Grotesk body. No mono, no clocks, no
   serials, no hard grid: quiet, minimal, smooth.
   ══════════════════════════════════════════════════════════════════════════ */

body{ letter-spacing:0; }
::selection{ background:var(--gold); color:#fff; }

/* The [hidden] attribute must always win — several elements (Admin Console link,
   modals, tab panels) set display via a class, which would otherwise override the
   browser default and leak a hidden element into view (e.g. staff seeing Admin). */
[hidden]{ display:none !important; }

/* remove leftover technical furniture from the previous theme */
.gw-sys, .gw-cat-serial{ display:none !important; }

/* ── labels: warm, quiet, minimal ───────────────────────────────────── */
.label,.eyebrow{
  display:block; font-family:var(--font-body); font-weight:600;
  font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold);
}
.label::before,.eyebrow::before{ content:none; }
.gw-sub-name,.field-label,.demo-hint-title,.login-sub,.gw-cat-meta,
.stat-label,.ac-note,.ac-tab,.gw-count,.gw-crumb{
  font-family:var(--font-body);
}

/* ── display type: Bricolage Grotesque, warm & confident ────────────── */
.section-heading,.gw-greeting,.cta-heading,.ac-title,.gw-cat-name,
.card-title,.gw-tile-name,.login-titles h1,.gw-brand-name,.hero-heading,
.ac-h2,.gw-admin-title,.ac-modal-head h3,.stat-number{
  font-family:var(--font-display); font-weight:700; letter-spacing:-.015em;
  font-variation-settings:normal;
}
.gw-greeting,.cta-heading,.ac-title,.hero-heading{ font-weight:800; letter-spacing:-.03em; line-height:1.02; }
h1 em,h2 em,.cta-heading em,.section-heading em{ font-style:normal; color:var(--gold); }

/* ── buttons: soft pills, gentle motion ─────────────────────────────── */
.btn-primary{ border-radius:999px; letter-spacing:.06em; font-size:.78rem; font-weight:600; text-transform:none; padding:.9rem 1.9rem; }
.btn-primary:hover{ background:var(--gold); transform:translateY(-2px); }
.btn-sm,.nav-pill,.gw-logout,.gw-admin-link,.btn-ghost-sm{ border-radius:999px; }
.btn-google{ border-radius:14px; }
.btn-google span{ font-family:var(--font-body); font-weight:600; font-size:.82rem; letter-spacing:0; }

/* ══════════════════ LOGIN ══════════════════ */
.login-aura::after{ border-color:var(--line-soft); border-radius:24px; }
.login-card{ border-radius:22px; }
.login-titles h1{ font-size:1.4rem; letter-spacing:-.02em; }
.login-sub{ font-size:.68rem; letter-spacing:.05em; text-transform:none; color:var(--plum-mute); }
.field-label{ font-size:.66rem; letter-spacing:.1em; color:var(--plum-soft); }
.field input{ border-radius:13px; }
.field input:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(224,151,43,.16); }
.demo-row code{ font-family:var(--font-body); }

/* ══════════════════ HEADER ══════════════════ */
.gw-header{ background:rgba(246,239,219,.82); backdrop-filter:saturate(1.05) blur(10px); border-bottom:1px solid var(--line-soft); padding-top:1.15rem; padding-bottom:1.15rem; }
.gw-brand-name{ font-size:1.05rem; letter-spacing:-.01em; }
.gw-crumb{ font-size:.72rem; letter-spacing:.02em; text-transform:none; }
.gw-user-role{ border-radius:999px; font-size:.6rem; letter-spacing:.1em; }
.gw-user-role[data-role="admin"]  { color:#fff; background:var(--gold); border-color:var(--gold); }
.gw-user-role[data-role="manager"]{ color:var(--green); background:rgba(92,158,60,.12); border-color:rgba(92,158,60,.3); }
.gw-user-role[data-role="staff"]  { color:var(--plum-soft); background:var(--paper-2); border-color:var(--line); }
.gw-logout,.gw-admin-link{ text-transform:none; letter-spacing:.01em; }
.nav-pill{ text-transform:none; }

/* ══════════════════ GATEWAY — airy greeting + soft accordion ══════════════════ */
.gw-main{ padding-top:clamp(3rem,7vw,6rem); }
.gw-hello{ margin-bottom:3.5rem; }
.gw-hello .label{ margin-bottom:1.2rem; }
.gw-greeting{ font-size:clamp(2.2rem,1.6rem + 2.8vw,3.6rem); }
.gw-lede{ font-size:1rem; color:var(--plum-soft); }
.gw-count{ font-size:.9rem; color:var(--plum-mute); }

.gw-cat{ border-radius:20px; margin-bottom:1.1rem; }
.gw-cat.is-open{ box-shadow:0 30px 64px -44px rgba(74,50,34,.5); border-color:var(--line); }
.gw-cat-toggle{ gap:1.1rem; padding:1.4rem 1.6rem; }
.gw-cat-icon{ border-radius:13px; width:46px; height:46px; }
.gw-cat-icon svg{ width:23px; height:23px; }
.gw-cat-name{ font-size:clamp(1.2rem,1.05rem + .6vw,1.5rem); letter-spacing:-.02em; }
.gw-cat-meta{ font-size:.74rem; letter-spacing:.02em; text-transform:none; color:var(--plum-mute); }
.gw-cat-chev{ width:1.25rem; height:1.25rem; }
.gw-cat-chev svg{ stroke-width:1.8; }
.gw-sub-name{ font-size:.68rem; letter-spacing:.14em; color:var(--plum-mute); }
.gw-cat-pad{ padding:0 1.6rem 1.8rem; }

/* slower, smoother open/close of a main category */
.gw-cat-body{ transition:grid-template-rows .58s cubic-bezier(.34,0,.16,1); }
.gw-cat-pad{ opacity:0; transform:translateY(-8px); transition:opacity .5s var(--ease) .06s, transform .55s var(--ease) .06s; }
.gw-cat.is-open .gw-cat-pad{ opacity:1; transform:none; }

/* tiles → soft minimal cards, gentle hover */
.gw-grid{ grid-template-columns:repeat(auto-fill,minmax(300px,1fr)); gap:.8rem; }
.gw-tile{ flex-direction:row; align-items:center; gap:1rem; padding:1.05rem 1.15rem; border-radius:16px; box-shadow:none; }
.gw-tile.is-featured{ border-color:var(--line); }
.gw-tile.is-featured::after{ display:none; }
.gw-tile:hover{ transform:translateY(-3px); border-color:transparent; box-shadow:0 20px 44px -26px rgba(74,50,34,.34); }
.gw-tile:hover .gw-tile-go{ color:var(--gold); transform:translateX(3px); }
.gw-tile-icon{ width:40px; height:40px; border-radius:12px; background:var(--paper); border:1px solid var(--line); }
.gw-tile-icon svg{ width:19px; height:19px; }
.gw-tile-body{ flex:1; gap:.15rem; min-width:0; }
.gw-tile-name{ font-family:var(--font-display); font-weight:700; font-size:1rem; letter-spacing:-.01em; }
.gw-tile-desc{ font-size:.82rem; color:var(--plum-mute); }
.gw-tile-go{ width:1.05rem; height:1.05rem; transition:color .3s var(--ease), transform .3s var(--ease); }

/* ══════════════════ ADMIN CONSOLE ══════════════════ */
.ac-title{ letter-spacing:-.03em; }
.ac-note{ font-size:.9rem; letter-spacing:0; color:var(--plum-soft); }
.ac-tab{ font-size:.78rem; letter-spacing:.02em; text-transform:none; }
.ac-tab.is-active{ border-bottom-color:var(--gold); }
.ac-sub{ font-size:.9rem; }
.ac-cat,.ac-table-wrap,.ac-accesstree,.ac-userpick,.gw-matrix-scroll{ border-radius:18px; }
.ac-cat-icon,.ac-cat-icon.sm{ border-radius:12px; }
.ac-link-icon,.ac-iconpick{ border-radius:11px; }
.ac-pill{ border-radius:999px; letter-spacing:.02em; text-transform:none; font-family:var(--font-body); }
.ac-table thead th,.gw-matrix thead th{ font-size:.66rem; letter-spacing:.08em; }
.ac-field input,.ac-field select,.ac-field textarea{ border-radius:12px; }
.ac-modal-card{ border-radius:20px; }
.ac-link-url{ font-family:var(--font-body); }
.perm-toggle input:checked + .perm-track{ background:var(--gold); border-color:var(--gold); }

/* ══════════════════ CUSTOM APP LOGOS ══════════════════ */
/* An uploaded logo fills the icon box; keep it crisp on a clean white plate. */
.gw-tile-icon .face-img,
.ac-link-icon .face-img,
.gw-cat-icon .face-img{ width:100%; height:100%; object-fit:contain; display:block; }
.gw-tile-icon.has-img{ background:#fff; padding:5px; }
.gw-tile-icon.has-img .face-img{ border-radius:8px; }
.ac-link-icon.has-img{ background:#fff; padding:3px; }

/* Icon / logo picker inside the modal */
.ac-seg{ display:inline-flex; gap:.25rem; padding:.25rem; background:var(--paper-2); border:1px solid var(--line); border-radius:12px; margin-bottom:.75rem; }
.ac-seg-btn{ padding:.42rem .9rem; border-radius:9px; font-size:.8rem; font-weight:600; color:var(--plum-mute); background:transparent; border:none; cursor:pointer; transition:background .2s var(--ease), color .2s var(--ease); }
.ac-seg-btn.is-on{ background:var(--surface); color:var(--plum-deep); box-shadow:0 1px 3px rgba(74,46,28,.14); }
.ac-icongrid[hidden], .ac-imgpick[hidden]{ display:none; }
.ac-imgpick{ display:flex; flex-direction:column; gap:.75rem; align-items:flex-start; }
.ac-imgpick-row{ display:flex; gap:.5rem; flex-wrap:wrap; }
.ac-imgpreview{ width:92px; height:92px; border-radius:16px; border:1px solid var(--line); background:var(--paper); display:grid; place-items:center; overflow:hidden; }
.ac-imgpreview img{ width:100%; height:100%; object-fit:contain; padding:6px; }
.ac-imgempty{ font-size:.7rem; color:var(--plum-mute); text-align:center; padding:.4rem; }
.ac-file{ display:none; }

/* ══════════════════ FOOTER + TOAST ══════════════════ */
.gw-foot{ border-top:1px solid var(--line); letter-spacing:.01em; text-transform:none; }
.gw-foot,.site-footer{ font-family:var(--font-body); }
.vsc-toast{ font-family:var(--font-body); font-size:.85rem; letter-spacing:0; border-radius:999px; }