:root,
  html[data-theme="night"] {
    --bg: #0a0c10;
    --bg-panel: #12161d;
    --bg-panel-hover: #181e28;
    --bg-deep: #07090d;
    --bg-chip: #0e1218;
    --bg-topbar: rgba(10, 12, 16, 0.88);
    --bg-admin: #0c0f14;
    --bg-toast: rgba(18, 22, 29, 0.96);
    --bg-input: #0e1218;
    --bg-soft: rgba(255, 200, 120, 0.04);
    --bg-overlay: rgba(120, 180, 255, 0.05);
    --line: rgba(160, 190, 230, 0.1);
    --line-active: rgba(255, 180, 84, 0.45);
    --paper: #eef2f7;
    --paper-dim: #8b97a8;
    --amber: #ffb454;
    --amber-ink: #1a140c;
    --amber-glow: rgba(255, 180, 84, 0.35);
    --cool: #6ec8e8;
    --cool-glow: rgba(110, 200, 232, 0.2);
    --neutral: #f3e9d8;
    --green-eco: #34d399;
    --danger: #f0a8a0;
    --pdf-bg: rgba(96, 165, 250, 0.1);
    --pdf-border: rgba(96, 165, 250, 0.32);
    --pdf-text: #93c5fd;
    --room-bg: radial-gradient(ellipse at 50% 36%, #242018 0%, #141820 50%, #080a0e 100%);
    --room-shadow: 0 20px 48px rgba(0, 0, 0, 0.5);
    --cord: rgba(255, 255, 255, 0.18);
    --cct-card-bg: rgba(12, 16, 22, 0.9);
    --cct-card-border: rgba(160, 190, 230, 0.14);
    --cct-hover: rgba(255, 255, 255, 0.06);
    --cct-ring: rgba(10, 12, 16, 0.95);
    --pdp-frame: rgba(160, 190, 230, 0.14);
    --pdp-frame-shadow: 0 16px 40px rgba(0, 0, 0, 0.35);
    --pdp-badge-bg: rgba(255, 180, 84, 0.04);
    --stock-ok: #34d399;
    --lightbox-bg: rgba(6, 8, 12, 0.9);
    --radius: 10px;
    --radius-sm: 6px;
    --radius-md: 14px;
    --radius-2xl: 16px;
    --admin-label-gap: 4px;
    --admin-ink: #f8fafc;
    --admin-ink-muted: #94a3b8;
    --space-section: clamp(44px, 7vw, 88px);
    --space-block: clamp(18px, 2.8vw, 28px);
    --transition: color 0.22s ease, background-color 0.22s ease, border-color 0.22s ease,
      box-shadow 0.25s ease, opacity 0.2s ease, transform 0.25s cubic-bezier(0.16, 1, 0.3, 1);
    --font: "Outfit", "Helvetica Neue", Helvetica, Arial, sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, monospace;
    --glow-soft: 0 0 0 1px rgba(255, 180, 84, 0.12), 0 0 24px rgba(255, 180, 84, 0.12);
    color-scheme: dark;
  }

  html[data-theme="day"] {
    --bg: #eef1f5;
    --bg-panel: #ffffff;
    --bg-panel-hover: #f5f7fa;
    --bg-deep: #e4e8ef;
    --bg-chip: #e8ecf2;
    --bg-topbar: rgba(238, 241, 245, 0.9);
    --bg-admin: #e8ecf2;
    --bg-toast: rgba(255, 255, 255, 0.97);
    --bg-input: #ffffff;
    --bg-soft: rgba(180, 120, 40, 0.05);
    --bg-overlay: rgba(40, 80, 140, 0.04);
    --line: rgba(30, 45, 70, 0.12);
    --line-active: rgba(180, 110, 20, 0.4);
    --paper: #12161d;
    --paper-dim: #5c6a7c;
    --amber: #c47e12;
    --amber-ink: #ffffff;
    --amber-glow: rgba(196, 126, 18, 0.22);
    --cool: #1f8fb0;
    --cool-glow: rgba(31, 143, 176, 0.14);
    --neutral: #3a342c;
    --green-eco: #059669;
    --danger: #b4534a;
    --pdf-bg: rgba(37, 99, 235, 0.08);
    --pdf-border: rgba(37, 99, 235, 0.28);
    --pdf-text: #1d4ed8;
    --room-bg: radial-gradient(ellipse at 50% 36%, #f6efe4 0%, #e8edf4 55%, #dde3ec 100%);
    --room-shadow: 0 16px 36px rgba(30, 45, 70, 0.1);
    --cord: rgba(30, 45, 70, 0.22);
    --cct-card-bg: rgba(255, 255, 255, 0.94);
    --cct-card-border: rgba(30, 45, 70, 0.12);
    --cct-hover: rgba(30, 45, 70, 0.05);
    --cct-ring: rgba(255, 255, 255, 0.95);
    --pdp-frame: rgba(30, 45, 70, 0.12);
    --pdp-frame-shadow: 0 12px 28px rgba(30, 45, 70, 0.08);
    --pdp-badge-bg: rgba(196, 126, 18, 0.05);
    --stock-ok: #059669;
    --lightbox-bg: rgba(14, 18, 26, 0.78);
    --glow-soft: 0 0 0 1px rgba(196, 126, 18, 0.15), 0 8px 24px rgba(196, 126, 18, 0.1);
    --admin-ink: #0f172a;
    --admin-ink-muted: #475569;
    color-scheme: light;
  }

  * { box-sizing: border-box; margin: 0; padding: 0; }
  html {
    scroll-behavior: smooth;
    overflow-x: clip;
    max-width: 100%;
  }
  @media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
  }

  body {
    background:
      radial-gradient(ellipse 80% 50% at 80% -10%, rgba(255, 180, 84, 0.07), transparent 55%),
      radial-gradient(ellipse 60% 40% at 0% 100%, rgba(110, 200, 232, 0.05), transparent 50%),
      var(--bg);
    color: var(--paper);
    font-family: var(--font);
    font-weight: 400;
    font-size: 15px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    line-height: 1.55;
    letter-spacing: 0.01em;
    transition: background-color 0.35s ease, color 0.35s ease;
    overflow-x: clip;
    max-width: 100%;
    width: 100%;
  }
  html[data-theme="day"] body {
    background:
      radial-gradient(ellipse 80% 50% at 85% -5%, rgba(196, 126, 18, 0.06), transparent 50%),
      radial-gradient(ellipse 50% 35% at 0% 100%, rgba(31, 143, 176, 0.05), transparent 45%),
      var(--bg);
  }

  h1, h2, h3, h4 {
    font-weight: 600;
    letter-spacing: -0.025em;
    line-height: 1.2;
  }

  .mono { font-family: var(--font-mono); letter-spacing: 0; }

  .wrap {
    width: 100%; max-width: 1260px; margin: 0 auto; padding: 0 12px;
    min-width: 0;
  }
  @media (min-width: 640px) { .wrap { padding: 0 24px; } }
  @media (min-width: 1024px) { .wrap { padding: 0 40px; } }

  img { max-width: 100%; height: auto; }
  #app, main, .section { min-width: 0; max-width: 100%; }
  #app {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    min-height: 100dvh;
  }
  #app > main { flex: 1 0 auto; }

  /* ---------- TOPBAR ---------- */
  /* Camadas: topbar 100 · toast 200 · projeto drawer 220+ · lightbox 300 */
  .topbar {
    position: sticky; top: 0; z-index: 100;
    background: var(--bg-topbar);
    backdrop-filter: blur(18px) saturate(1.2);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 1px 0 rgba(255, 180, 84, 0.04);
  }
  .topbar-inner {
    display: flex; align-items: center; gap: 14px 22px; flex-wrap: nowrap;
    min-height: 72px; padding-block: 12px; padding-inline: 18px; box-sizing: border-box;
    min-width: 0; max-width: 100%;
  }
  @media (min-width: 640px) { .topbar-inner { padding-inline: 28px; } }
  @media (min-width: 1024px) { .topbar-inner { padding-inline: 40px; } }

  .logo {
    text-decoration: none; color: var(--paper);
    display: flex; align-items: center; gap: 11px; cursor: pointer;
    flex: none; min-width: 0;
  }
  .logo-img {
    display: block;
    height: 28px;
    width: auto;
    max-width: min(132px, 36vw);
    object-fit: contain;
    object-position: left center;
    flex: none;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
  }
  .logo.has-logo-img {
    gap: 0;
  }
  .logo-text { display: flex; flex-direction: column; min-width: 0; }
  .logo-title { font-size: 19px; font-weight: 700; line-height: 1; letter-spacing: -0.02em; }
  .logo-title span { color: var(--amber); }
  .logo-sub {
    font-size: 8px; font-weight: 600; letter-spacing: 0.2em;
    color: var(--paper-dim); margin-top: 4px; text-transform: uppercase;
  }

  .search {
    flex: 1 1 180px; width: auto; min-width: 0; max-width: 380px;
    display: flex; align-items: center; gap: 9px;
    background: var(--bg-panel); border: 1px solid var(--line);
    border-radius: 999px; height: 40px; padding: 0 14px; box-sizing: border-box;
    transition: var(--transition);
  }
  .search:focus-within {
    border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
    box-shadow: var(--glow-soft);
    background: var(--bg-panel-hover);
  }
  .search input {
    background: none; border: none; outline: none;
    color: var(--paper); font-size: 13px; line-height: 1.25; width: 100%;
    padding: 0; min-height: 0; height: auto;
  }
  .search input::placeholder { color: var(--paper-dim); }
  .search svg { flex: none; width: 15px; height: 15px; color: var(--paper-dim); }

  .nav-desktop {
    display: flex; gap: 18px; font-size: 13px; align-items: center;
    flex: none; flex-wrap: nowrap; min-width: 0;
  }
  .nav-desktop .nav-link,
  .nav-desktop > a {
    color: var(--paper-dim); text-decoration: none; font-weight: 500;
    transition: var(--transition); position: relative; padding: 5px 0; white-space: nowrap;
  }
  .nav-desktop .nav-link:hover,
  .nav-desktop .nav-link.active,
  .nav-desktop > a:hover,
  .nav-desktop > a.active { color: var(--paper); }
  .nav-desktop .nav-link.active::after,
  .nav-desktop > a.active::after {
    content: ""; position: absolute; bottom: 0; left: 0; right: 0;
    height: 2px; background: linear-gradient(90deg, var(--amber), transparent);
    border-radius: 2px; box-shadow: 0 0 8px var(--amber-glow);
  }
  .nav-desktop .nav-item {
    position: relative;
    display: flex;
    align-items: center;
  }
  .nav-desktop .nav-link--parent {
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .nav-caret {
    width: 0;
    height: 0;
    border-left: 3.5px solid transparent;
    border-right: 3.5px solid transparent;
    border-top: 4px solid currentColor;
    opacity: 0.55;
    transition: transform 0.2s ease, opacity 0.2s ease;
  }
  .nav-desktop .nav-item:hover .nav-caret,
  .nav-desktop .nav-item:focus-within .nav-caret {
    opacity: 0.9;
    transform: rotate(180deg);
  }
  .nav-dropdown {
    position: absolute;
    top: calc(100% + 10px);
    left: 50%;
    transform: translateX(-50%) translateY(4px);
    min-width: 188px;
    padding: 8px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-panel) 94%, transparent);
    backdrop-filter: blur(16px) saturate(1.15);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
    display: flex;
    flex-direction: column;
    gap: 2px;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease;
    z-index: 80;
  }
  .nav-dropdown::before {
    content: "";
    position: absolute;
    top: -10px;
    left: 0;
    right: 0;
    height: 10px;
  }
  .nav-desktop .nav-item:hover .nav-dropdown,
  .nav-desktop .nav-item:focus-within .nav-dropdown {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(-50%) translateY(0);
  }
  .nav-dropdown-link {
    display: block;
    padding: 9px 12px;
    border-radius: 8px;
    color: var(--paper-dim);
    text-decoration: none;
    font-size: 12.5px;
    font-weight: 560;
    letter-spacing: -0.01em;
    white-space: nowrap;
    transition: var(--transition);
  }
  .nav-dropdown-link:hover,
  .nav-dropdown-link.active {
    color: var(--paper);
    background: color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .nav-dropdown-link.active {
    color: var(--amber);
  }
  .nav-desktop .nav-sheet-children { display: none; }
  .nav-count {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 18px; height: 18px; padding: 0 5px;
    border-radius: 999px; background: var(--amber); color: var(--amber-ink);
    font-size: 10px; font-weight: 700; line-height: 1;
    box-shadow: 0 0 10px var(--amber-glow);
  }
  .nav-count[hidden] { display: none; }

  .topbar-actions {
    display: flex; align-items: center; gap: 8px; flex: none; margin-left: auto;
  }

  .quote-chip {
    display: inline-flex; align-items: center; gap: 7px;
    min-height: 36px; padding: 0 12px 0 10px;
    border-radius: 999px; text-decoration: none;
    color: var(--paper); background: var(--bg-panel);
    border: 1px solid var(--line);
    transition: var(--transition); flex: none;
    position: relative;
  }
  .quote-chip.is-pulse {
    animation: quote-chip-pulse 1.2s ease;
  }
  @keyframes quote-chip-pulse {
    0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--amber) 45%, transparent); }
    40% { box-shadow: 0 0 0 8px color-mix(in srgb, var(--amber) 0%, transparent); }
    100% { box-shadow: 0 0 0 0 transparent; }
  }
  @media (prefers-reduced-motion: reduce) {
    .quote-chip.is-pulse { animation: none; }
  }
  .quote-chip:hover {
    border-color: var(--line-active);
    background: var(--bg-panel-hover);
    color: var(--paper);
  }
  .quote-chip.is-active {
    border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
    box-shadow: var(--glow-soft);
    color: var(--amber);
  }
  .quote-chip-icon {
    display: flex; align-items: center; justify-content: center;
    width: 20px; height: 20px; color: inherit;
  }
  .quote-chip-label {
    font-size: 12.5px; font-weight: 650; letter-spacing: -0.01em;
  }
  .quote-chip-count {
    margin-left: 0;
  }

  .nav-burger {
    display: none;
    width: 42px; height: 42px; padding: 0;
    border-radius: 12px; border: 1px solid var(--line);
    background: var(--bg-panel); color: var(--paper);
    cursor: pointer; transition: var(--transition); flex: none;
    align-items: center; justify-content: center;
  }
  .nav-burger:hover {
    border-color: var(--line-active);
    background: var(--bg-panel-hover);
  }
  .nav-burger-lines {
    display: flex; flex-direction: column; justify-content: center; gap: 5px;
    width: 18px; height: 14px;
  }
  .nav-burger-lines span {
    display: block; height: 1.5px; width: 100%; border-radius: 2px;
    background: currentColor;
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), opacity 0.2s ease;
    transform-origin: center;
  }
  .nav-burger.is-open .nav-burger-lines span:nth-child(1) {
    transform: translateY(6.5px) rotate(45deg);
  }
  .nav-burger.is-open .nav-burger-lines span:nth-child(2) { opacity: 0; }
  .nav-burger.is-open .nav-burger-lines span:nth-child(3) {
    transform: translateY(-6.5px) rotate(-45deg);
  }

  /* Mobile nav sheet — acima do topbar (100), abaixo do lightbox (300) */
  .nav-sheet {
    position: fixed; inset: 0; z-index: 240;
    pointer-events: none; visibility: hidden;
  }
  .nav-sheet.is-open {
    pointer-events: auto; visibility: visible;
  }
  .nav-sheet-backdrop {
    position: absolute; inset: 0; border: 0; padding: 0;
    background: rgba(6, 8, 12, 0.48);
    backdrop-filter: blur(3px);
    cursor: pointer; opacity: 0;
    transition: opacity 0.28s ease;
  }
  .nav-sheet.is-open .nav-sheet-backdrop { opacity: 1; }
  .nav-sheet-panel {
    position: absolute; top: 0; right: 0; bottom: 0;
    width: min(360px, 92vw);
    display: flex; flex-direction: column;
    background: color-mix(in srgb, var(--bg-panel) 92%, transparent);
    backdrop-filter: blur(22px) saturate(1.2);
    border-left: 1px solid var(--line);
    box-shadow: -24px 0 48px rgba(0, 0, 0, 0.35);
    transform: translateX(100%);
    transition: transform 0.36s cubic-bezier(0.16, 1, 0.3, 1);
    overflow: auto;
  }
  .nav-sheet.is-open .nav-sheet-panel { transform: translateX(0); }
  .nav-sheet-head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 12px; padding: 22px 20px 16px;
    border-bottom: 1px solid var(--line);
  }
  .nav-sheet-kicker {
    margin: 0 0 4px;
    font-size: 10px; font-weight: 700; letter-spacing: 0.18em;
    text-transform: uppercase; color: var(--amber);
  }
  .nav-sheet-title {
    margin: 0; font-size: 22px; font-weight: 650; letter-spacing: -0.03em;
  }
  .nav-sheet-close { font-size: 22px; line-height: 1; }
  .nav-sheet-links {
    display: flex; flex-direction: column; padding: 10px 12px 28px; gap: 4px;
  }
  .nav-sheet-links .nav-item {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .nav-sheet-links .nav-dropdown { display: none; }
  .nav-sheet-links .nav-caret { display: none; }
  .nav-sheet-links a,
  .nav-sheet-links .nav-link {
    display: flex; align-items: center;
    min-height: 52px; padding: 0 14px;
    border-radius: 12px; text-decoration: none;
    color: var(--paper); font-size: 16px; font-weight: 600;
    letter-spacing: -0.02em;
    transition: var(--transition);
  }
  .nav-sheet-links a:hover,
  .nav-sheet-links .nav-link:hover {
    background: var(--bg-panel-hover); color: var(--paper);
  }
  .nav-sheet-links a.active,
  .nav-sheet-links .nav-link.active {
    background: color-mix(in srgb, var(--amber) 12%, transparent);
    color: var(--amber);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--amber) 28%, transparent);
  }
  .nav-sheet-children {
    display: flex;
    flex-direction: column;
    gap: 2px;
    margin: 0 0 6px;
    padding: 0 0 0 12px;
    border-left: 2px solid color-mix(in srgb, var(--amber) 35%, var(--line));
    margin-left: 14px;
  }
  .nav-sheet-links .nav-link--child {
    min-height: 42px;
    font-size: 14px;
    font-weight: 550;
    color: var(--paper-dim);
  }
  .nav-sheet-links .nav-link--child.active {
    color: var(--amber);
  }
  body.nav-open { overflow: hidden; }

  @media (max-width: 960px) {
    .topbar-inner {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      grid-template-areas: "logo actions" "search search";
      align-items: center; column-gap: 10px; row-gap: 10px; flex-wrap: unset;
      min-height: 0; padding-block: 10px;
    }
    .logo { grid-area: logo; }
    .logo-title { font-size: 17px; }
    .search { grid-area: search; flex: unset; max-width: none; width: 100%; }
    .nav-desktop { display: none; }
    .topbar-actions { grid-area: actions; margin-left: 0; justify-self: end; gap: 6px; }
    .nav-burger { display: inline-flex; }
    .quote-chip {
      min-height: 42px; padding: 0 11px 0 11px;
    }
  }
  @media (max-width: 420px) {
    .quote-chip-label { display: none; }
    .quote-chip { width: 42px; padding: 0; justify-content: center; }
    .quote-chip-count {
      position: absolute; top: 2px; right: 2px;
      min-width: 16px; height: 16px; font-size: 9px;
      box-shadow: 0 0 0 2px var(--bg-panel);
    }
    .logo-sub { display: none; }
  }
  @media (min-width: 961px) {
    .nav-burger,
    .nav-sheet { display: none !important; }
  }

  .theme-toggle {
    border: 1px solid var(--line); background: var(--bg-panel); border-radius: 999px;
    padding: 3px; cursor: pointer; transition: var(--transition); flex: none; color: var(--paper);
  }
  .theme-toggle:hover {
    border-color: var(--line-active); background: var(--bg-panel-hover);
    box-shadow: 0 0 16px rgba(110, 200, 232, 0.1);
  }
  .theme-toggle-track {
    position: relative; display: grid; grid-template-columns: 1fr 1fr; align-items: center;
    width: 56px; height: 28px; border-radius: 999px;
  }
  .theme-icon {
    display: flex; align-items: center; justify-content: center; z-index: 1;
    color: var(--paper-dim); transition: color 0.25s ease;
  }
  .theme-toggle-knob {
    position: absolute; top: 2px; left: 2px; width: 24px; height: 24px; border-radius: 50%;
    background: var(--paper); color: var(--bg);
    box-shadow: 0 0 12px rgba(255, 180, 84, 0.25);
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
    pointer-events: none;
  }
  html[data-theme="day"] .theme-toggle-knob { transform: translateX(0); background: #12161d; }
  html[data-theme="night"] .theme-toggle-knob { transform: translateX(28px); background: #ffb454; }
  html[data-theme="day"] .theme-icon-sun { color: #f5f7fa; }
  html[data-theme="night"] .theme-icon-moon { color: #1a140c; }

  @media (max-width: 960px) {
    .theme-toggle { border-radius: 12px; padding: 4px; }
    .theme-toggle-track { width: 52px; height: 32px; }
    .theme-toggle-knob { width: 26px; height: 26px; top: 3px; left: 3px; }
    html[data-theme="night"] .theme-toggle-knob { transform: translateX(22px); }
  }

  .product-edit-link {
    display: inline-flex; align-items: center; gap: 11px; min-width: 0;
    color: inherit; text-decoration: none;
  }
  .product-edit-link:hover strong { color: var(--amber); }
  .product-edit-link span { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
  .thumb-sm {
    width: 42px; height: 42px; object-fit: cover; border-radius: var(--radius-sm);
    flex: none; border: 1px solid var(--line); background: var(--bg-deep);
  }
  .list-pick-hits {
    display: flex; flex-direction: column; gap: 6px; max-height: 220px; overflow: auto;
    margin: 8px 0 12px;
  }
  .list-pick-hit {
    display: flex; align-items: baseline; justify-content: space-between; gap: 10px; flex-wrap: wrap;
    text-align: left; cursor: pointer; font: inherit;
    padding: 9px 12px; border-radius: var(--radius-sm); border: 1px solid var(--line);
    background: var(--bg-soft); color: var(--paper);
  }
  .list-pick-hit:hover {
    border-color: var(--line-active); background: var(--bg-panel-hover);
    box-shadow: 0 0 16px rgba(255, 180, 84, 0.08);
  }

  /* ---------- HERO ---------- */
  /* ---------- HOME � Architectural Gallery ---------- */
  .home-page {
    --home-gap: clamp(48px, 8vw, 96px);
    display: flex;
    flex-direction: column;
    gap: 0;
    background: var(--bg);
  }
  .home-editorial {
    position: relative;
    min-height: clamp(600px, 88vh, 920px);
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    isolation: isolate;
    color: #f5f1ea;
  }
  @media (max-width: 719px) {
    .home-editorial {
      min-height: clamp(480px, 100vw, 640px);
    }
  }
  .home-editorial-track {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  .home-editorial-slide {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.7s ease, visibility 0.7s ease;
  }
  .home-editorial-slide.is-active {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    z-index: 1;
  }
  @media (prefers-reduced-motion: reduce) {
    .home-editorial-slide {
      transition: none;
    }
  }
  .home-editorial-media {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  .home-editorial-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transform: scale(1.02);
  }
  .home-editorial-slide.is-active .home-editorial-media img {
    animation: home-editorial-ken 28s ease-out forwards;
  }
  @keyframes home-editorial-ken {
    from { transform: scale(1.06); }
    to { transform: scale(1); }
  }
  @media (prefers-reduced-motion: reduce) {
    .home-editorial-slide.is-active .home-editorial-media img {
      animation: none;
    }
  }
  .home-editorial-shade {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgba(8, 10, 14, 0.28) 0%, rgba(8, 10, 14, 0.55) 48%, rgba(8, 10, 14, 0.88) 100%),
      linear-gradient(90deg, rgba(8, 10, 14, 0.45) 0%, transparent 55%);
  }
  /* Alinha ao .wrap do site (1260px); o texto fica � esquerda dessa coluna. */
  .home-editorial-inner.wrap,
  .home-editorial-inner {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    width: 100%;
    max-width: 1260px;
    margin-left: auto;
    margin-right: auto;
    padding-top: clamp(72px, 10vh, 140px);
    padding-bottom: clamp(40px, 7vh, 80px);
  }
  @media (max-width: 719px) {
    .home-editorial-inner.wrap,
    .home-editorial-inner {
      padding-top: 48px;
      padding-bottom: 28px;
    }
  }
  @media (min-width: 1280px) {
    .home-editorial-inner.wrap,
    .home-editorial-inner {
      padding-bottom: clamp(56px, 9vh, 104px);
    }
  }
  .home-editorial-kicker {
    margin: 0 0 14px;
    max-width: min(34rem, 100%);
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: #ffc56a;
  }
  .home-editorial-title {
    margin: 0 0 14px;
    max-width: min(34rem, 100%);
    font-size: clamp(28px, 4.2vw, 48px);
    font-weight: 650;
    letter-spacing: -0.038em;
    line-height: 1.08;
    text-wrap: balance;
    color: #f7f2ea;
  }
  @media (max-width: 719px) {
    .home-editorial-title {
      font-size: clamp(24px, 6.5vw, 30px);
    }
  }
  @media (min-width: 1280px) {
    .home-editorial-title {
      font-size: clamp(36px, 3.2vw, 48px);
    }
  }
  .home-editorial-lead {
    margin: 0 0 24px;
    max-width: min(40ch, 34rem);
    font-size: clamp(13.5px, 1.45vw, 16px);
    line-height: 1.6;
    color: rgba(247, 242, 234, 0.78);
  }
  @media (max-width: 719px) {
    .home-editorial-lead {
      margin-bottom: 18px;
      font-size: 13.5px;
    }
  }
  .home-editorial-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    max-width: min(36rem, 100%);
  }
  .home-editorial-btn {
    min-height: 44px;
    padding-inline: 20px;
  }
  .home-editorial .ghost-btn {
    border-color: rgba(247, 242, 234, 0.28);
    color: #f7f2ea;
    background: rgba(8, 10, 14, 0.28);
  }
  .home-editorial .ghost-btn:hover {
    border-color: rgba(247, 242, 234, 0.55);
    background: rgba(8, 10, 14, 0.45);
  }
  .home-editorial-controls {
    position: absolute;
    z-index: 2;
    top: clamp(12px, 2vw, 20px);
    right: clamp(12px, 2vw, 24px);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 6px;
    padding: 4px 6px;
    border-radius: 999px;
    border: 1px solid rgba(247, 242, 234, 0.14);
    background: rgba(8, 10, 14, 0.38);
    box-shadow:
      0 8px 20px rgba(0, 0, 0, 0.22),
      inset 0 1px 0 rgba(255, 255, 255, 0.05);
    backdrop-filter: blur(12px) saturate(1.1);
    -webkit-backdrop-filter: blur(12px) saturate(1.1);
    pointer-events: auto;
  }
  @media (max-width: 719px) {
    .home-editorial-controls {
      top: 10px;
      right: 10px;
      gap: 5px;
      padding: 3px 5px;
    }
  }
  .home-editorial-nav {
    width: 24px;
    height: 24px;
    padding: 0;
    border-radius: 999px;
    border: 1px solid transparent;
    background: transparent;
    color: rgba(247, 242, 234, 0.82);
    font-size: 15px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition:
      background 0.2s ease,
      border-color 0.2s ease,
      color 0.2s ease;
  }
  .home-editorial-nav:hover {
    border-color: rgba(255, 197, 106, 0.4);
    background: rgba(255, 197, 106, 0.14);
    color: #ffc56a;
  }
  .home-editorial-nav:focus-visible {
    outline: 2px solid #ffc56a;
    outline-offset: 1px;
  }
  .home-editorial-dots {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 5px;
    padding: 0 2px;
  }
  .home-editorial-dot {
    --editorial-progress-ms: 10000ms;
    position: relative;
    width: 5px;
    height: 5px;
    padding: 0;
    border-radius: 999px;
    border: 0;
    background: rgba(247, 242, 234, 0.34);
    cursor: pointer;
    overflow: hidden;
    transition:
      width 0.25s ease,
      background 0.25s ease,
      box-shadow 0.25s ease;
  }
  .home-editorial-dot:hover {
    background: rgba(247, 242, 234, 0.62);
  }
  .home-editorial-dot.is-active {
    width: 18px;
    background: rgba(247, 242, 234, 0.22);
    box-shadow: 0 0 0 2px rgba(255, 197, 106, 0.16);
  }
  .home-editorial-dot.is-active::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    background: linear-gradient(90deg, #ffb454 0%, #ffc56a 60%, #ffe0a3 100%);
    transform: scaleX(0);
    transform-origin: left center;
    pointer-events: none;
  }
  .home-editorial-dot.is-active.is-running::after {
    animation: home-editorial-dot-progress var(--editorial-progress-ms) linear forwards;
  }
  /*
   * Pausar só ao pairar o conteúdo do slide (ler), não nos botões/dots.
   * Antes :hover/:focus-within nos controlos deixava a barra em scaleX(0)
   * depois de clicar (foco fica no botão) — o countdown «desaparecia».
   */
  .home-editorial:hover:not(:has(.home-editorial-controls:hover)) .home-editorial-dot.is-running::after {
    animation-play-state: paused;
  }
  @keyframes home-editorial-dot-progress {
    from { transform: scaleX(0); }
    to { transform: scaleX(1); }
  }
  .home-editorial-dot:focus-visible {
    outline: 2px solid #ffc56a;
    outline-offset: 1px;
  }
  @media (prefers-reduced-motion: reduce) {
    .home-editorial-nav,
    .home-editorial-dot {
      transition: none;
    }
    .home-editorial-dot.is-active {
      background: #ffc56a;
    }
    .home-editorial-dot.is-active::after {
      display: none;
    }
  }

  .home-catalogo {
    border-bottom: 1px solid var(--line);
  }
  .home-catalogo-title {
    font-size: clamp(28px, 4.4vw, 42px);
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.03em;
    margin: 0 0 16px;
  }
  .home-catalogo-title em {
    color: var(--amber);
    font-style: normal;
  }

  .home-section {
    padding: var(--home-gap) 0;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  }
  .home-section-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px 24px;
    margin-bottom: clamp(24px, 4vw, 40px);
  }
  .home-section-kicker {
    margin: 0 0 8px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--amber);
  }
  .home-section-head h2 {
    margin: 0;
    font-size: clamp(24px, 3.4vw, 34px);
    font-weight: 650;
    letter-spacing: -0.03em;
    line-height: 1.12;
  }
  .home-section-lead {
    margin: 8px 0 0;
    max-width: 42ch;
    font-size: 14px;
    line-height: 1.55;
    color: var(--paper-dim);
  }
  .home-section-link {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-decoration: none;
    color: var(--amber);
    white-space: nowrap;
  }
  .home-section-link:hover {
    color: var(--paper);
  }
  .home-section-empty {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 20px;
    padding: 18px 20px;
    border-radius: 14px;
    border: 1px dashed color-mix(in srgb, var(--line) 85%, transparent);
    background: color-mix(in srgb, var(--bg-soft, var(--bg-panel)) 70%, transparent);
  }
  .home-section-empty p {
    margin: 0;
    font-size: 14px;
    line-height: 1.45;
    color: var(--paper-dim);
  }

  .home-pillars {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(8px, 2.2vw, 16px);
  }
  .home-pillars[data-count="1"] {
    grid-template-columns: minmax(0, 1fr);
    max-width: min(100%, 420px);
  }
  /* Exactly 2: cap row width so tiles don't become giant squares */
  .home-pillars[data-count="2"] {
    max-width: min(100%, 820px);
    margin-inline: auto;
  }
  /* 3 / 5 / 6: 3 cols (avoid locking at 2 forever) */
  @media (min-width: 900px) {
    .home-pillars[data-count="3"],
    .home-pillars[data-count="5"],
    .home-pillars[data-count="6"] {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      max-width: none;
    }
  }
  /* 4 / 7 / 8: 4 cols on wide (never 3+1) */
  @media (min-width: 1100px) {
    .home-pillars[data-count="4"],
    .home-pillars[data-count="7"],
    .home-pillars[data-count="8"] {
      grid-template-columns: repeat(4, minmax(0, 1fr));
    }
  }
  .home-pillars > [role="listitem"] {
    min-width: 0;
    display: flex;
  }
  .home-pillar {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    /* Narrow 2-col: compact square tiles */
    aspect-ratio: 1 / 1;
    max-height: min(46vw, 220px);
    min-height: 0;
    text-decoration: none;
    color: #f5f1ea;
    overflow: hidden;
    isolation: isolate;
    border-radius: 4px;
  }
  @media (min-width: 520px) {
    .home-pillar {
      aspect-ratio: 5 / 4;
      max-height: min(36vw, 280px);
    }
  }
  @media (min-width: 720px) {
    .home-pillar {
      aspect-ratio: 4 / 5;
      max-height: min(34vw, 340px);
    }
    .home-pillars[data-count="2"] .home-pillar {
      aspect-ratio: 5 / 4;
      max-height: min(30vw, 300px);
    }
  }
  @media (min-width: 900px) {
    .home-pillar {
      aspect-ratio: 3 / 4;
      max-height: min(32vw, 400px);
    }
    .home-pillars[data-count="2"] .home-pillar {
      aspect-ratio: 16 / 11;
      max-height: min(28vw, 320px);
    }
  }
  .home-pillar-media {
    position: absolute;
    inset: 0;
    z-index: 0;
    background: linear-gradient(160deg, #1a1612, #0c0e12);
  }
  .home-pillar-media.is-empty {
    background:
      radial-gradient(ellipse 70% 50% at 30% 20%, color-mix(in srgb, var(--amber) 22%, transparent), transparent 60%),
      linear-gradient(160deg, #2a241c, #12151a);
  }
  .home-pillar-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .home-pillar:hover .home-pillar-media img {
    transform: scale(1.05);
  }
  .home-pillar-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, rgba(8, 10, 14, 0.15) 0%, rgba(8, 10, 14, 0.82) 100%);
  }
  .home-pillar-copy {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(4px, 1.2vw, 8px);
    padding: clamp(12px, 2.4vw, 28px) clamp(12px, 2vw, 22px) clamp(14px, 2.6vw, 28px);
    min-width: 0;
  }
  .home-pillar-index {
    font-size: clamp(9px, 1.4vw, 11px);
    font-weight: 650;
    letter-spacing: 0.12em;
    color: rgba(255, 197, 106, 0.85);
  }
  .home-pillar-kicker {
    font-size: clamp(8px, 1.2vw, 10px);
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: rgba(247, 242, 234, 0.55);
  }
  .home-pillar-title {
    font-size: clamp(14px, 1.6vw + 10px, 34px);
    font-weight: 650;
    letter-spacing: -0.03em;
    line-height: 1.08;
  }
  .home-pillar-lead {
    font-size: clamp(11px, 0.9vw + 8px, 13.5px);
    line-height: 1.45;
    color: rgba(247, 242, 234, 0.72);
    max-width: 28ch;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  @media (max-width: 519px) {
    .home-pillar-copy {
      gap: 3px;
      padding: 10px 10px 12px;
    }
    .home-pillar-lead {
      -webkit-line-clamp: 2;
      max-width: none;
    }
    .home-pillar-meta {
      display: none;
    }
  }
  @media (max-width: 899px) {
    .home-pillar-lead {
      -webkit-line-clamp: 2;
      max-width: none;
    }
  }
  .home-pillar-meta {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: clamp(9px, 1.2vw, 11px);
    color: rgba(247, 242, 234, 0.5);
  }
  .home-pillar-cta {
    margin-top: clamp(2px, 0.8vw, 8px);
    font-size: clamp(10px, 1.3vw, 12px);
    font-weight: 650;
    letter-spacing: 0.04em;
    color: #ffc56a;
    transition: transform 0.25s ease;
  }
  .home-pillar:hover .home-pillar-cta {
    transform: translateX(4px);
  }

  .home-projects {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(10px, 2.5vw, 16px);
  }
  @media (min-width: 720px) {
    .home-projects {
      grid-template-columns: minmax(0, 1.35fr) minmax(0, 1fr);
      grid-template-rows: auto auto;
      gap: 16px;
    }
    .home-projects > :first-child {
      grid-row: 1 / span 2;
      min-height: 0;
    }
  }
  .home-projects > * {
    min-width: 0;
  }
  .home-project {
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    width: 100%;
    min-width: 0;
    min-height: clamp(200px, 58vw, 280px);
    aspect-ratio: 16 / 11;
    text-decoration: none;
    color: #f5f1ea;
    overflow: hidden;
    border-radius: 4px;
    isolation: isolate;
  }
  @media (min-width: 720px) {
    .home-project {
      aspect-ratio: auto;
      min-height: 220px;
    }
    .home-projects > :first-child .home-project {
      min-height: 100%;
      height: 100%;
    }
    .home-projects > :not(:first-child) .home-project {
      min-height: clamp(200px, 22vw, 240px);
    }
  }
  .home-project-media {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  .home-project-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .home-project:hover .home-project-media img {
    transform: scale(1.04);
  }
  .home-project-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 20%, rgba(8, 10, 14, 0.88) 100%);
  }
  .home-project-copy {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: clamp(4px, 1.4vw, 8px);
    padding: clamp(12px, 3.2vw, 24px) clamp(12px, 3vw, 20px) clamp(14px, 3.4vw, 24px);
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
  }
  .home-project-meta {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: clamp(9px, 2.4vw, 10px);
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(255, 197, 106, 0.9);
  }
  .home-project-title {
    font-size: clamp(16px, 4.2vw, 28px);
    font-weight: 650;
    letter-spacing: -0.025em;
    line-height: 1.15;
    overflow-wrap: anywhere;
  }
  .home-project-note {
    font-size: clamp(11px, 2.8vw, 13px);
    line-height: 1.45;
    color: rgba(247, 242, 234, 0.7);
    max-width: 40ch;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .home-project-products {
    display: flex;
    flex-wrap: nowrap;
    gap: clamp(6px, 1.6vw, 10px);
    align-items: stretch;
    margin-top: 2px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }
  .home-project-products-label {
    flex: 0 0 auto;
    align-self: center;
    font-size: clamp(8px, 2.2vw, 10px);
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: rgba(247, 242, 234, 0.45);
    margin-right: 4px;
  }
  .home-project-chip {
    flex: 1 1 0;
    min-width: 0;
    max-width: 100%;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: clamp(5px, 1.1vw, 7px) clamp(10px, 2.2vw, 16px);
    border: 1px solid rgba(247, 242, 234, 0.2);
    border-radius: 999px;
    color: rgba(247, 242, 234, 0.85);
    background: rgba(8, 10, 14, 0.35);
    overflow: hidden;
  }
  .home-project-chip-text {
    display: block;
    min-width: 0;
    max-width: 100%;
    font-size: clamp(9px, 2.5vw, 11px);
    letter-spacing: 0.04em;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  @media (max-width: 419px) {
    .home-project-products-label {
      display: none;
    }
  }
  .home-projects-section .home-section-lead {
    font-size: clamp(13px, 3.2vw, 14px);
    max-width: min(42ch, 100%);
  }

  .home-masters {
    display: grid;
    grid-template-columns: 1fr;
    gap: 12px;
  }
  /* Even counts: 2-col from tablet (2 / 2x2 / 3x2) ? never leave a lone card */
  @media (min-width: 640px) {
    .home-masters[data-count="2"],
    .home-masters[data-count="4"],
    .home-masters[data-count="6"],
    .home-masters[data-count="8"] {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 14px;
    }
  }
  /* 3 / 5 / 6 / 9: jump to 3-col (skip awkward 2+1) */
  @media (min-width: 720px) {
    .home-masters[data-count="3"],
    .home-masters[data-count="5"],
    .home-masters[data-count="6"],
    .home-masters[data-count="9"] {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 14px;
    }
  }
  @media (min-width: 960px) {
    .home-masters[data-count="3"],
    .home-masters[data-count="5"],
    .home-masters[data-count="6"],
    .home-masters[data-count="9"] {
      gap: 16px;
    }
  }
  /* 4 / 7 / 8: 4-col on wide (avoid 3+1) */
  @media (min-width: 1100px) {
    .home-masters[data-count="4"],
    .home-masters[data-count="7"],
    .home-masters[data-count="8"] {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 16px;
    }
  }
  .home-masters[data-count="1"] {
    grid-template-columns: minmax(0, 1fr);
    max-width: min(100%, 420px);
  }
  /* 5 cards @ 3-col: center the last row (2 cards) */
  @media (min-width: 720px) {
    .home-masters[data-count="5"] {
      grid-template-columns: repeat(6, minmax(0, 1fr));
    }
    .home-masters[data-count="5"] > [role="listitem"] {
      grid-column: span 2;
    }
    .home-masters[data-count="5"] > :nth-child(4) {
      grid-column: 2 / span 2;
    }
    .home-masters[data-count="5"] > :nth-child(5) {
      grid-column: 4 / span 2;
    }
  }
  /* 7 cards @ 4-col: center the last row (3 cards) */
  @media (min-width: 1100px) {
    .home-masters[data-count="7"] {
      grid-template-columns: repeat(8, minmax(0, 1fr));
    }
    .home-masters[data-count="7"] > [role="listitem"] {
      grid-column: span 2;
    }
    .home-masters[data-count="7"] > :nth-child(5) {
      grid-column: 2 / span 2;
    }
    .home-masters[data-count="7"] > :nth-child(6) {
      grid-column: 4 / span 2;
    }
    .home-masters[data-count="7"] > :nth-child(7) {
      grid-column: 6 / span 2;
    }
  }
  .home-masters > [role="listitem"] {
    min-width: 0;
    display: flex;
  }
  .home-master {
    display: flex;
    flex-direction: column;
    width: 100%;
    text-decoration: none;
    color: inherit;
    border: 1px solid var(--line);
    border-radius: 4px;
    overflow: hidden;
    background: var(--bg-panel);
    transition: border-color 0.2s ease, transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .home-master:hover {
    border-color: color-mix(in srgb, var(--amber) 35%, var(--line));
    transform: translateY(-2px);
  }
  .home-master-media {
    position: relative;
    width: 100%;
    /* 2:1 ? a bit shorter than 16:9; no max-height (fights aspect-ratio on mobile) */
    aspect-ratio: 2 / 1;
    overflow: hidden;
    background: var(--bg-deep);
    flex-shrink: 0;
  }
  @media (min-width: 720px) {
    .home-master-media {
      aspect-ratio: 16 / 9;
    }
  }
  .home-master-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.55s ease;
  }
  .home-master:hover .home-master-media img {
    transform: scale(1.04);
  }
  .home-master-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(180deg, transparent 50%, rgba(8, 10, 14, 0.35));
    pointer-events: none;
  }
  .home-master .tutorial-play {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    color: #f7f2ea;
  }
  .home-master-copy {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 12px 14px 14px;
    min-width: 0;
    flex: 1;
  }
  .home-master-eyebrow {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 10px;
    align-items: center;
    font-size: 10px;
    color: var(--paper-dim);
  }
  .home-master-title {
    font-size: clamp(15px, 1.4vw + 10px, 18px);
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.25;
    color: var(--paper);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .home-master-excerpt {
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--paper-dim);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .home-master-cta {
    margin-top: auto;
    padding-top: 6px;
    font-size: 11.5px;
    font-weight: 650;
    color: var(--amber);
  }

  .home-archive-section {
    padding-bottom: calc(var(--home-gap) - 8px);
  }
  .home-archive-rail {
    display: flex;
    gap: 12px;
    overflow-x: auto;
    padding: 0 max(16px, calc((100vw - var(--wrap, 1120px)) / 2)) 8px;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
  }
  @media (min-width: 800px) {
    .home-archive-rail {
      padding-left: max(32px, calc((100vw - var(--wrap, 1120px)) / 2));
      padding-right: max(32px, calc((100vw - var(--wrap, 1120px)) / 2));
    }
  }
  .home-archive-cell {
    flex: 0 0 min(72vw, 260px);
    scroll-snap-align: start;
  }
  @media (min-width: 720px) {
    .home-archive-cell { flex-basis: 240px; }
  }
  .home-archive-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    text-decoration: none;
    color: inherit;
    border: 1px solid var(--line);
    border-radius: 4px;
    overflow: hidden;
    background: var(--bg-panel);
    transition: border-color 0.2s ease, transform 0.25s ease;
  }
  .home-archive-card:hover {
    border-color: color-mix(in srgb, var(--amber) 30%, var(--line));
    transform: translateY(-2px);
  }
  .home-archive-media {
    position: relative;
    aspect-ratio: 4 / 3;
    background: var(--bg-deep);
    overflow: hidden;
  }
  .home-archive-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .home-archive-spec {
    position: absolute;
    top: 10px;
    left: 10px;
    padding: 4px 8px;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    color: var(--amber-ink);
    background: var(--amber);
    border-radius: 2px;
  }
  .home-archive-copy {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: 14px 14px 16px;
  }
  .home-archive-cat {
    font-size: 10px;
    font-weight: 650;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--paper-dim);
  }
  .home-archive-title {
    font-size: 14px;
    font-weight: 650;
    letter-spacing: -0.015em;
    line-height: 1.3;
    color: var(--paper);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .home-archive-prices {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: baseline;
    font-variant-numeric: tabular-nums;
  }
  .home-archive-prices s {
    font-size: 12px;
    color: var(--paper-dim);
  }
  .home-archive-sale {
    font-size: 14px;
    font-weight: 700;
    color: var(--amber);
  }

  .hero {
    position: relative; overflow: hidden;
    border-bottom: 1px solid var(--line);
    padding: clamp(36px, 6vw, 76px) 0 clamp(32px, 5vw, 56px);
  }
  .hero-glow {
    position: absolute; top: -280px; right: -60px; width: 580px; height: 580px;
    background: radial-gradient(circle at 50% 50%, rgba(255, 180, 84, 0.16), rgba(110, 200, 232, 0.04) 42%, transparent 68%);
    pointer-events: none;
  }
  .hero-grid {
    position: relative; display: grid; grid-template-columns: 1fr; gap: 36px; align-items: center;
  }
  @media (min-width: 992px) {
    .hero-grid { grid-template-columns: 1.12fr 0.88fr; gap: 64px; }
  }
  .hero-eyebrow {
    font-size: 10px; letter-spacing: 0.22em; color: var(--amber);
    font-weight: 650; margin-bottom: 12px; text-transform: uppercase;
  }
  .hero h1 {
    font-size: clamp(30px, 5.2vw, 48px); line-height: 1.1;
    font-weight: 700; letter-spacing: -0.03em; margin-bottom: 16px;
  }
  .hero h1 em { color: var(--amber); font-style: normal; }
  .hero p {
    font-size: 14.5px; color: var(--paper-dim); max-width: 46ch;
    margin-bottom: 26px; line-height: 1.65;
  }
  @media (min-width: 640px) { .hero p { font-size: 15.5px; margin-bottom: 34px; } }

  .badges {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px 12px;
  }
  @media (min-width: 640px) {
    .badges { gap: 14px 22px; }
  }
  .badges .badge {
    display: flex;
    align-items: center;
    gap: clamp(6px, 2vw, 11px);
    min-width: 0;
    font-size: clamp(11px, 2.9vw, 13px);
    line-height: 1.3;
    color: var(--paper);
    font-weight: 500;
  }
  .badges .badge .ic {
    width: clamp(28px, 8vw, 34px);
    height: clamp(28px, 8vw, 34px);
    border: 1px solid var(--line);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--amber);
    background: rgba(255, 180, 84, 0.06);
    flex: none;
    box-shadow: inset 0 0 12px rgba(255, 180, 84, 0.06);
  }
  .badges .badge .ic svg {
    width: clamp(13px, 3.6vw, 16px);
    height: clamp(13px, 3.6vw, 16px);
    display: block;
    flex: none;
  }

  .hero-badge-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-top: 12px;
  }
  .hero-badge-admin {
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg-overlay, var(--bg-panel));
  }
  .hero-badge-admin-title {
    margin: 0 0 8px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--admin-ink-muted);
  }
  .hero-badge-admin textarea.mono {
    font-size: 12px;
    line-height: 1.4;
  }
  .char-icon-cell {
    width: 44px;
    vertical-align: middle;
  }
  .char-icon-preview {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    color: var(--amber, #ffb454);
  }
  .char-icon-preview svg {
    width: 18px;
    height: 18px;
    display: block;
  }
  .char-icon-preview.is-lg {
    width: 40px;
    height: 40px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--bg-panel);
  }
  .char-icon-preview.is-lg svg {
    width: 22px;
    height: 22px;
  }
  .char-icon-preview-wrap {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  .char-list-table th:last-child,
  .char-list-table td.char-list-actions {
    width: 1%;
    white-space: nowrap;
    text-align: left;
    vertical-align: middle;
  }
  .char-list-table td.char-list-order {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
  }
  .char-list-order-controls {
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .char-list-order-controls .mono {
    min-width: 1.5ch;
    text-align: right;
    font-variant-numeric: tabular-nums;
  }
  .char-list-order-controls .icon-btn {
    width: 30px;
    height: 30px;
    font-size: 13px;
    line-height: 1;
  }
  .char-list-order-controls .icon-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
  }

  /* Características — ordenar ficha por produto */
  .admin-subhead {
    margin: 0;
    font-size: 1.05rem;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.25;
    color: var(--admin-ink, var(--paper));
  }
  .char-def-panel-head {
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .char-def-panel-head .hint {
    margin: 0;
  }
  .char-def-panel {
    padding: clamp(14px, 1.8vw, 18px);
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl, 16px);
    background: var(--bg-panel);
  }
  .char-spec-order-panel {
    margin: 0 0 24px;
    padding: clamp(14px, 1.8vw, 18px);
    border: 1px solid color-mix(in srgb, var(--amber) 24%, var(--line));
    border-radius: var(--radius-2xl, 16px);
    background:
      linear-gradient(
        160deg,
        color-mix(in srgb, var(--amber) 8%, transparent),
        transparent 46%
      ),
      var(--bg-panel);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
  }
  html[data-theme="day"] .char-spec-order-panel {
    background:
      linear-gradient(
        160deg,
        color-mix(in srgb, var(--amber) 11%, transparent),
        transparent 46%
      ),
      var(--bg-panel);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  }
  .char-spec-order-panel > .admin-subhead {
    margin-bottom: 2px;
  }
  .char-spec-order-intro {
    margin: 0 0 12px;
    max-width: 52rem;
  }
  .char-spec-order-search {
    max-width: min(100%, 420px);
  }
  .char-spec-order-results {
    margin-top: 2px;
    border: 1px solid var(--line);
    border-radius: 12px;
    overflow: auto;
  }
  .char-spec-order-results .data-table {
    min-width: 0;
    margin: 0;
  }
  .char-spec-order-results .data-table th,
  .char-spec-order-results .data-table td {
    padding: 10px 12px;
  }
  .char-spec-order-results .data-table th:last-child,
  .char-spec-order-results .data-table td:last-child {
    width: 1%;
    white-space: nowrap;
    text-align: right;
  }
  .char-spec-order-empty,
  .char-spec-order-hint {
    margin: 6px 0 0;
  }
  .char-spec-order-selected {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .char-spec-order-selected-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 14px;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-deep) 42%, var(--bg-panel));
  }
  html[data-theme="day"] .char-spec-order-selected-head {
    background: color-mix(in srgb, var(--bg-deep) 6%, var(--bg-panel));
  }
  .char-spec-order-selected-meta {
    min-width: 0;
    flex: 1 1 220px;
  }
  .char-spec-order-selected-meta strong {
    display: block;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }
  .char-spec-order-selected-meta .hint {
    margin: 4px 0 0;
  }
  .char-spec-order-selected-head .row-actions {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
  }
  .char-spec-order-list {
    margin: 0;
    gap: 8px;
  }
  .char-spec-order-row {
    flex-wrap: nowrap;
    align-items: center;
    gap: 10px 12px;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--bg-deep) 28%, var(--bg-overlay, var(--bg-panel)));
  }
  html[data-theme="day"] .char-spec-order-row {
    background: var(--bg-overlay, color-mix(in srgb, var(--bg-deep) 5%, var(--bg-panel)));
  }
  .char-spec-order-row .coluna-label {
    flex: 1 1 160px;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .char-spec-order-row .coluna-label strong {
    font-size: 13px;
    font-weight: 650;
    line-height: 1.3;
    overflow-wrap: anywhere;
  }
  .char-spec-order-row .coluna-label .mono {
    font-size: 11px;
  }
  .char-spec-order-value {
    flex: 0 1 140px;
    min-width: 0;
    max-width: 180px;
    font-size: 13px;
    font-weight: 600;
    text-align: right;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--admin-ink, var(--paper));
  }
  .char-spec-order-value.is-empty {
    font-weight: 500;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .char-spec-order-row .row-actions {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
  }
  .char-spec-order-row .icon-btn,
  .char-spec-field-row .icon-btn {
    width: 32px;
    height: 32px;
  }
  .char-spec-order-row .icon-btn:disabled,
  .char-spec-field-row .icon-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
  }
  .char-spec-order-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 12px;
    line-height: 1.4;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .char-spec-order-status::before {
    content: "";
    width: 7px;
    height: 7px;
    border-radius: 50%;
    flex: none;
    background: var(--line);
  }
  .char-spec-order-status.is-custom::before {
    background: var(--amber);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--amber) 22%, transparent);
  }

  /* Produto → Características técnicas (ordem na ficha) */
  .char-spec-order-fields {
    margin: 0;
    gap: 8px;
  }
  .char-spec-field-row {
    align-items: flex-end;
    flex-wrap: nowrap;
    gap: 10px 12px;
    padding: 10px 12px;
  }
  .char-spec-field-row:focus-within {
    border-color: color-mix(in srgb, var(--amber) 48%, var(--line));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--amber) 14%, transparent);
  }
  .char-spec-field-row .coluna-num {
    align-self: center;
  }
  .char-spec-field-label {
    flex: 1 1 180px;
    min-width: 0;
    margin: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .char-spec-field-label > input,
  .char-spec-field-label > select {
    width: 100%;
    margin: 0;
    box-sizing: border-box;
  }
  .char-spec-field-row > .row-actions {
    flex: none;
    display: inline-flex;
    align-items: center;
    gap: 4px;
    align-self: center;
  }
  @media (max-width: 640px) {
    .char-spec-order-row {
      flex-wrap: wrap;
    }
    .char-spec-order-value {
      flex: 1 1 100%;
      max-width: none;
      text-align: left;
      padding-left: 40px;
      order: 3;
    }
    .char-spec-order-row .row-actions {
      margin-left: auto;
    }
    .char-spec-field-row {
      flex-wrap: wrap;
      align-items: flex-start;
    }
    .char-spec-field-label {
      flex: 1 1 calc(100% - 52px);
    }
    .char-spec-field-row > .row-actions {
      margin-left: auto;
      align-self: flex-start;
    }
    .char-spec-order-selected-head .row-actions {
      justify-content: flex-start;
      width: 100%;
    }
  }
  .char-list-table td.char-list-actions .row-actions {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    width: max-content;
    min-width: 0;
  }
  .char-list-table td.char-list-actions .row-actions > a.button-ghost,
  .char-list-table td.char-list-actions .row-actions > button.button-danger {
    flex: 0 0 auto;
    margin: 0;
    min-height: 30px;
    padding: 5px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.01em;
    line-height: 1.2;
    transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;
  }
  .char-list-table td.char-list-actions .row-actions > a.button-ghost {
    background: color-mix(in srgb, var(--bg-deep) 55%, var(--bg-panel));
    border-color: var(--line);
    color: var(--paper);
  }
  .char-list-table td.char-list-actions .row-actions > a.button-ghost:hover {
    background: var(--bg-panel-hover);
    border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
    color: var(--paper);
  }
  .char-list-table td.char-list-actions .row-actions > button.button-danger {
    background: color-mix(in srgb, var(--danger) 8%, var(--bg-panel));
    border-color: color-mix(in srgb, var(--danger) 32%, var(--line));
    color: var(--danger);
  }
  .char-list-table td.char-list-actions .row-actions > button.button-danger:hover {
    background: color-mix(in srgb, var(--danger) 16%, var(--bg-panel));
    border-color: color-mix(in srgb, var(--danger) 55%, var(--line));
  }
  html[data-theme="night"] .char-list-table td.char-list-actions .row-actions > a.button-ghost {
    background: color-mix(in srgb, var(--bg-panel-hover) 70%, transparent);
  }
  html[data-theme="night"] .char-list-table td.char-list-actions .row-actions > button.button-danger {
    background: color-mix(in srgb, var(--danger) 12%, transparent);
  }

  /* CCT room — preserved */
  .room-visual {
    --pendant-drop: 32%;
    position: relative; width: 100%; aspect-ratio: 4 / 3.2;
    border-radius: var(--radius-md); overflow: hidden;
    background: var(--room-bg);
    border: 1px solid var(--line);
    box-shadow: var(--room-shadow), 0 0 0 1px rgba(255, 180, 84, 0.04);
  }
  .pendant-cord {
    position: absolute; top: 0; left: 50%; width: 1px; height: var(--pendant-drop); background: var(--cord);
    transform: translateX(-50%);
  }
  .pendant-ring {
    position: absolute; top: var(--pendant-drop); left: 50%; width: 120px; height: 120px;
    transform: translate(-50%, 0);
    border: 4px solid var(--lamp, var(--amber)); border-radius: 50%;
    box-shadow: 0 0 40px var(--lamp-glow, var(--amber-glow)), inset 0 0 15px var(--lamp-glow, var(--amber-glow));
    animation: lamp-breathe 4s infinite alternate ease-in-out;
    transition: border-color 0.45s ease, box-shadow 0.45s ease;
  }
  @media (min-width: 640px) { .pendant-ring { width: 140px; height: 140px; } }
  .floor-glow {
    position: absolute; left: 50%; bottom: 6%; width: 72%; height: 34%;
    transform: translateX(-50%); border-radius: 50%;
    background: radial-gradient(ellipse at center, var(--lamp-glow, var(--amber-glow)) 0%, transparent 70%);
    opacity: 0.85; filter: blur(2px); pointer-events: none;
    transition: background 0.45s ease, opacity 0.45s ease;
  }
  @keyframes lamp-breathe {
    0% { opacity: 0.88; filter: drop-shadow(0 0 10px var(--lamp-glow, var(--amber-glow))); }
    100% { opacity: 1; filter: drop-shadow(0 0 28px var(--lamp-glow, var(--amber-glow))); }
  }

  .cct-card {
    position: absolute; right: 12px; bottom: 12px; left: auto;
    width: min(320px, calc(100% - 24px));
    max-width: 320px;
    background: var(--cct-card-bg);
    backdrop-filter: blur(14px);
    border: 1px solid var(--cct-card-border);
    border-radius: var(--radius);
    padding: 11px 13px; z-index: 2;
    box-shadow: var(--room-shadow);
    color: var(--paper);
  }
  .cct-card .label {
    font-size: 8.5px; letter-spacing: 0.16em; color: var(--paper-dim);
    margin-bottom: 9px; text-transform: uppercase; font-weight: 600;
  }
  .cct-row { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 4px; }
  .cct-btn {
    background: transparent; border: 1px solid transparent; border-radius: var(--radius-sm);
    padding: 6px 2px 5px; text-align: center; cursor: pointer;
    color: var(--paper-dim);
    min-width: 0;
    transition: color 0.2s ease, background 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
  }
  .cct-btn:hover { color: var(--paper); background: var(--cct-hover); }
  .cct-btn:focus-visible { outline: none; border-color: color-mix(in srgb, var(--swatch) 55%, transparent); }
  .cct-btn.active {
    color: var(--paper);
    background: color-mix(in srgb, var(--swatch) 14%, transparent);
    border-color: color-mix(in srgb, var(--swatch) 40%, transparent);
  }
  .cct-dot {
    display: block; width: 15px; height: 15px; margin: 0 auto 4px; border-radius: 50%;
    background: var(--swatch);
    box-shadow: 0 0 8px color-mix(in srgb, var(--swatch) 55%, transparent);
    transition: transform 0.25s ease, box-shadow 0.25s ease;
  }
  .cct-btn.active .cct-dot {
    transform: scale(1.12);
    box-shadow:
      0 0 0 2px var(--cct-ring),
      0 0 0 3.5px var(--swatch),
      0 0 14px color-mix(in srgb, var(--swatch) 70%, transparent);
  }
  .cct-k {
    display: block; font-size: 9px; font-weight: 600;
    letter-spacing: 0.02em; font-variant-numeric: tabular-nums; color: inherit;
  }
  @media (max-width: 639px) {
    .room-visual {
      --pendant-drop: 16%;
      aspect-ratio: 4 / 3.5;
    }
    .pendant-ring {
      width: 118px;
      height: 118px;
      border-width: 3.5px;
    }
    .floor-glow {
      bottom: 22%;
      height: 26%;
    }
    .cct-card {
      left: auto;
      right: 8px;
      bottom: 8px;
      width: min(236px, calc(100% - 16px));
      max-width: 236px;
      padding: 10px 12px 9px;
      border-radius: 10px;
      background: color-mix(in srgb, var(--cct-card-bg) 88%, transparent);
      box-shadow: 0 8px 18px rgba(0, 0, 0, 0.2);
    }
    .cct-card .label {
      font-size: 9px;
      letter-spacing: 0.12em;
      margin-bottom: 7px;
    }
    .cct-row {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 5px;
    }
    .cct-btn {
      padding: 5px 2px 4px;
    }
    .cct-dot {
      width: 14px;
      height: 14px;
      margin-bottom: 4px;
    }
    .cct-btn.active .cct-dot {
      transform: scale(1.1);
      box-shadow:
        0 0 0 1.5px var(--cct-ring),
        0 0 0 2.75px var(--swatch),
        0 0 10px color-mix(in srgb, var(--swatch) 65%, transparent);
    }
    .cct-k {
      font-size: 10px;
      letter-spacing: 0.02em;
    }
  }

  .room-visual { --lamp: #FFB454; --lamp-glow: rgba(255, 180, 84, 0.5); }
  .room-visual[data-cct="2200"] { --lamp: #E8943A; --lamp-glow: rgba(232, 148, 58, 0.55); }
  .room-visual[data-cct="2700"] { --lamp: #FFB454; --lamp-glow: rgba(255, 180, 84, 0.5); }
  .room-visual[data-cct="3000"] { --lamp: #FFC98A; --lamp-glow: rgba(255, 201, 138, 0.48); }
  .room-visual[data-cct="4000"] { --lamp: #F7EBD9; --lamp-glow: rgba(247, 235, 217, 0.45); }
  .room-visual[data-cct="6000"] { --lamp: #C8E8F5; --lamp-glow: rgba(200, 232, 245, 0.45); }
  .room-visual[data-cct="6500"] { --lamp: #A5E4F5; --lamp-glow: rgba(165, 228, 245, 0.45); }
  .room-visual .pendant-ring {
    border-color: var(--lamp);
    box-shadow: 0 0 40px var(--lamp-glow), inset 0 0 15px var(--lamp-glow);
  }

  /* ---------- SECTIONS ---------- */
  .section { padding: var(--space-section) 0; min-height: 420px; }
  /* Páginas internas: aproximar breadcrumb da navegação */
  .section.detail-view {
    padding-top: clamp(10px, 1.6vw, 24px);
    padding-bottom: clamp(28px, 5vw, 72px);
    min-height: 0;
  }
  @media (max-width: 639px) {
    .section { padding: clamp(28px, 8vw, 44px) 0; }
    .section.detail-view {
      padding-top: 8px;
      padding-bottom: 28px;
    }
  }
  .page-404 {
    display: flex;
    align-items: center;
    min-height: min(62vh, 560px);
  }
  .page-404-inner {
    max-width: 34rem;
    margin: 0 auto;
    text-align: center;
  }
  .page-404-code {
    margin: 0 0 10px;
    color: var(--amber, #ffb454);
    font-size: clamp(42px, 8vw, 64px);
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    opacity: 0.92;
  }
  .page-404 h1 {
    margin: 0 0 10px;
    font-size: clamp(22px, 3.2vw, 30px);
    font-weight: 700;
    letter-spacing: -0.03em;
  }
  .page-404-lead {
    margin: 0 auto 22px;
    max-width: 36ch;
    color: var(--paper-dim);
    font-size: 15px;
    line-height: 1.55;
  }
  .page-404-actions {
    display: inline-flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
  }

  .section-head {
    display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: var(--space-block); flex-wrap: wrap; gap: 12px;
  }
  .section-head h2 {
    font-size: clamp(20px, 2.4vw, 24px); font-weight: 650; letter-spacing: -0.02em;
  }
  .section-head span { font-size: 12.5px; color: var(--paper-dim); }
  .section-head .ver-mais {
    font-size: 12px; font-weight: 600; color: var(--amber);
    text-decoration: none; transition: var(--transition);
  }
  .section-head .ver-mais:hover { color: var(--paper); text-shadow: 0 0 12px var(--amber-glow); }

  .cat-grid {
    display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px;
  }
  @media (min-width: 540px) { .cat-grid { grid-template-columns: repeat(3, 1fr); gap: 14px; } }
  @media (min-width: 1024px) { .cat-grid { grid-template-columns: repeat(4, 1fr); gap: 16px; } }
  .cat-card {
    border: 1px solid var(--line); border-radius: var(--radius); background: var(--bg-panel);
    padding: 22px 14px 18px; text-align: center; text-decoration: none; color: inherit;
    transition: var(--transition); display: flex; flex-direction: column; align-items: center; cursor: pointer;
  }
  .cat-card:hover {
    border-color: var(--line-active); background: var(--bg-panel-hover);
    transform: translateY(-3px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28), 0 0 24px rgba(255, 180, 84, 0.08);
  }
  .cat-visual {
    width: 58px; height: 58px; margin-bottom: 12px;
    display: flex; align-items: center; justify-content: center;
    overflow: hidden; border-radius: 12px;
    background: var(--bg-deep); border: 1px solid var(--line);
  }
  .cat-visual .cat-icon-img { width: 100%; height: 100%; object-fit: contain; display: block; }
  .cat-visual svg { width: 40px; height: 40px; }
  .cat-name { font-size: 13.5px; font-weight: 600; color: var(--paper); }
  .cat-count { font-size: 10.5px; color: var(--paper-dim); margin-top: 4px; }

  /* ---------- CATEGORY ---------- */
  #detailView { display: none; }
  .breadcrumb-nav {
    display: flex; align-items: center; gap: 8px;
    margin-bottom: 10px; flex-wrap: nowrap;
    min-width: 0; max-width: 100%;
  }
  @media (min-width: 640px) {
    .breadcrumb-nav { gap: 12px; margin-bottom: 14px; }
  }
  .back-btn {
    display: inline-flex; align-items: center; gap: 6px; background: var(--bg-panel);
    border: 1px solid var(--line); color: var(--paper-dim); padding: 5px 11px;
    border-radius: 999px; font-size: 11.5px; font-weight: 600; cursor: pointer; transition: var(--transition);
    flex: 0 0 auto;
  }
  @media (min-width: 640px) {
    .back-btn { padding: 7px 14px; font-size: 12px; }
  }
  .back-btn:hover {
    color: var(--amber); border-color: var(--line-active); background: var(--bg-panel-hover);
  }
  .breadcrumb {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: 0.35em;
    min-width: 0;
    flex: 1 1 auto;
    overflow: hidden;
    font-size: 12px;
    color: var(--paper-dim);
    white-space: nowrap;
  }
  .breadcrumb a {
    flex: 0 0 auto;
    color: var(--paper-dim);
    text-decoration: none;
    cursor: pointer;
  }
  .breadcrumb a:hover { color: var(--amber); }
  .breadcrumb-sep {
    flex: 0 0 auto;
    color: var(--paper-dim);
    font-weight: 500;
  }
  .breadcrumb > span:not(.breadcrumb-sep),
  .breadcrumb .breadcrumb-current {
    flex: 1 1 auto;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: var(--paper);
    font-weight: 600;
  }

  .category-hero-info {
    margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid var(--line);
    display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 8px;
  }
  .category-hero-info h1 {
    font-size: clamp(18px, 4.2vw, 28px); font-weight: 700; margin-bottom: 2px;
  }
  .category-hero-info p { color: var(--paper-dim); font-size: 12.5px; max-width: 54ch; }
  @media (min-width: 640px) {
    .category-hero-info { margin-bottom: 12px; padding-bottom: 12px; gap: 10px; }
    .category-hero-info p { font-size: 13px; }
  }
  .catalog-page.detail-view {
    padding-top: clamp(18px, 3.5vw, 28px);
  }

  .cat-header-right-tools { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
  .total-badge {
    background: rgba(255, 180, 84, 0.1); color: var(--amber);
    border: 1px solid rgba(255, 180, 84, 0.28);
    padding: 5px 12px; border-radius: 999px; font-size: 11.5px; font-weight: 600; white-space: nowrap;
  }

  .catalog-grelha-more {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    padding: 4px 0 8px;
  }
  .catalog-grelha-more-btn {
    min-width: min(240px, 100%);
  }
  .catalog-grelha-more-meta,
  .catalog-grelha-end {
    margin: 0;
    font-size: 12px;
    text-align: center;
  }
  .catalog-grelha-end {
    margin-top: 14px;
  }

  .catalog-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    margin-top: 16px;
    padding: 12px 0 4px;
  }
  .catalog-pager-meta {
    margin: 0;
    font-size: 12px;
  }
  .catalog-pager-controls {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
  }
  .catalog-pager-btn {
    min-width: 34px;
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--bg-panel);
    color: var(--paper-dim);
    font-size: 12.5px;
    font-weight: 650;
    cursor: pointer;
    transition: var(--transition);
  }
  .catalog-pager-btn:hover:not(:disabled) {
    color: var(--paper);
    border-color: var(--line-active);
  }
  .catalog-pager-btn.is-active {
    color: var(--amber);
    border-color: var(--amber);
    background: rgba(255, 180, 84, 0.12);
  }
  .catalog-pager-btn:disabled {
    opacity: 0.38;
    cursor: not-allowed;
  }

  .catalog-toolbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    flex-wrap: wrap;
    margin: 4px 0 10px;
    padding: 4px 2px 8px;
    border: 0;
    border-radius: 0;
    background: transparent;
    border-bottom: 1px solid var(--line);
  }
  .catalog-toolbar-count {
    margin: 0;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.02em;
    color: var(--paper-dim);
  }
  .view-switcher-group {
    display: flex; background: var(--bg-soft); border: 1px solid var(--line);
    border-radius: 10px; padding: 3px; gap: 2px;
  }
  .view-btn {
    background: none; border: none; outline: none; color: var(--paper-dim);
    padding: 7px 11px; border-radius: 8px; cursor: pointer; transition: var(--transition);
    display: inline-flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 650;
  }
  .catalog-default-view {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg-soft);
  }
  .catalog-default-view-copy {
    min-width: 0;
    flex: 1 1 220px;
  }
  .catalog-default-view-switch .view-btn {
    position: relative;
  }
  .catalog-default-view-switch .view-btn input {
    position: absolute;
    inset: 0;
    opacity: 0;
    margin: 0;
    cursor: pointer;
  }
  .view-btn-icon { flex: none; opacity: 0.85; }
  .view-btn:hover { color: var(--paper); }
  .view-btn.active {
    background: color-mix(in srgb, var(--amber) 16%, var(--bg-panel));
    color: var(--amber);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--amber) 35%, transparent);
  }
  .view-btn.active .view-btn-icon { opacity: 1; }

  .voltage-filter-strip, .panel-filter-box, .profile-filter-box {
    display: none; align-items: center; gap: 12px; margin: 8px 0 10px; padding: 10px 12px;
    background: var(--bg-panel); border: 1px solid var(--line); border-radius: var(--radius);
    overflow-x: auto; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  }
  .panel-filter-box { flex-direction: column; align-items: stretch; gap: 8px; padding: 9px 11px; overflow-x: visible; }
  .catalog-page .panel-filter-box.is-on {
    background: var(--bg-panel);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
  }
  .filter-row-section {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap;
    min-width: 0;
  }
  .filter-row-title {
    flex: 0 0 auto;
    font-size: 10px; font-weight: 700; text-transform: uppercase;
    letter-spacing: 0.14em; color: var(--amber); white-space: nowrap;
  }
  .filter-btn-group {
    position: relative;
    display: flex;
    gap: 6px;
    flex-wrap: nowrap;
    flex: 1 1 auto;
    min-width: 0;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scrollbar-width: thin;
    padding-bottom: 2px;
    cursor: default;
    touch-action: pan-x;
    user-select: none;
  }
  .filter-btn-group.is-scrollable {
    cursor: grab;
  }
  /* Fade so a direita enquanto houver mais chips; no fim fica solid. */
  .filter-btn-group.is-scrollable:not(.is-at-end) {
    -webkit-mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 18px), transparent);
    mask-image: linear-gradient(90deg, #000 0, #000 calc(100% - 18px), transparent);
  }
  .filter-btn-group.is-scrollable.is-at-end {
    -webkit-mask-image: none;
    mask-image: none;
  }
  .filter-btn-group.is-scrollable:active,
  .filter-btn-group.is-dragging {
    cursor: grabbing;
    scroll-behavior: auto;
  }
  .filter-btn-group.is-dragging .panel-filter-chip {
    pointer-events: none;
  }
  .filter-btn-group::-webkit-scrollbar { height: 4px; }
  .filter-btn-group::-webkit-scrollbar-thumb {
    background: color-mix(in srgb, var(--line) 70%, var(--paper-dim));
    border-radius: 999px;
  }
  .voltage-filter-strip { gap: 10px; }
  .voltage-filter-label { flex: 0 0 auto; }
  .panel-filter-chip {
    background: var(--bg-chip); border: 1px solid var(--line); color: var(--paper-dim);
    padding: 6px 11px; border-radius: var(--radius-sm); font-size: 11.5px; font-weight: 600;
    cursor: pointer; transition: var(--transition); display: inline-flex; align-items: center; gap: 5px;
    flex: 0 0 auto;
    white-space: nowrap;
  }
  .panel-filter-chip:hover {
    color: var(--paper); border-color: var(--line-active);
  }
  .panel-filter-chip.active {
    background: rgba(255, 180, 84, 0.14); border-color: var(--amber); color: var(--amber);
    box-shadow: 0 0 14px rgba(255, 180, 84, 0.18);
  }

  .voltage-filter-label {
    font-size: 10px; text-transform: uppercase; letter-spacing: 0.14em;
    color: var(--paper-dim); font-weight: 700; white-space: nowrap;
  }
  .voltage-pill-card {
    display: flex; flex-direction: column; align-items: center; gap: 5px;
    cursor: pointer; background: none; border: none; outline: none;
    color: var(--paper-dim); transition: var(--transition); flex-shrink: 0;
  }
  .voltage-pill-card:hover { transform: translateY(-2px); color: var(--paper); }
  .voltage-circle-icon {
    width: 36px; height: 36px; border-radius: 50%; background: var(--bg-chip);
    border: 2px solid var(--line); display: flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 700; color: var(--paper); transition: var(--transition);
  }
  .voltage-pill-card span { font-size: 11px; font-weight: 600; }
  .voltage-pill-card.active .voltage-circle-icon {
    border-color: var(--amber); background: rgba(255, 180, 84, 0.15); color: var(--amber);
    box-shadow: 0 0 16px var(--amber-glow);
  }
  .voltage-pill-card.active span { color: var(--amber); }

  .spec-table-container {
    background: var(--bg-panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
    width: 100%;
    max-width: 100%;
  }
  .table-scroll {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    touch-action: pan-x pan-y;
    width: 100%;
    max-width: 100%;
  }
  .spec-grid-layout {
    display: grid;
    grid-template-columns: var(--spec-cols);
    align-items: center;
    column-gap: 14px;
    row-gap: 0;
    padding: 12px 18px;
    width: max(100%, var(--spec-min, 100%));
    min-width: var(--spec-min, 0);
    box-sizing: border-box;
  }
  .spec-grid-layout > .cell-product,
  .spec-grid-layout > .spec-cell,
  .spec-grid-layout > .price,
  .spec-header > span {
    min-width: 0;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .spec-grid-layout > .spec-cell {
    display: block;
  }
  .spec-grid-layout > .price,
  .spec-header > span:last-child {
    font-variant-numeric: tabular-nums;
    text-align: left;
  }
  .sku-chips { display: flex; flex-wrap: wrap; gap: 5px; margin: 6px 0 2px; }
  .sku-chip {
    font-size: 11px; color: var(--paper-dim); border: 1px solid var(--line);
    border-radius: var(--radius-sm); padding: 3px 7px; background: var(--bg-soft);
  }
  .sku-chip em { font-style: normal; color: var(--amber); font-weight: 600; margin-right: 4px; }
  .spec-header {
    position: sticky;
    top: 0;
    z-index: 2;
    background: var(--bg-soft);
    border-bottom: 1px solid var(--line);
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--paper-dim);
    font-weight: 700;
  }
  .spec-row {
    border-bottom: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    transition: background 0.15s ease;
    font-size: 13px;
    line-height: 1.3;
    min-height: 56px;
  }
  .spec-row .price {
    font-size: 14px;
    font-weight: 700;
    color: var(--amber);
  }
  .spec-row .spec-cell {
    color: var(--paper-dim);
    font-size: 12.5px;
    font-weight: 550;
  }
  .spec-row:last-child { border-bottom: none; }
  .spec-row:hover { background: var(--bg-panel-hover); }

  .cell-thumb-link {
    display: block;
    width: 44px;
    height: 44px;
    border-radius: 9px;
    background: var(--bg-deep);
    border: 1px solid var(--line);
    overflow: hidden;
    flex: none;
  }
  .cell-thumb-link img { width: 100%; height: 100%; object-fit: cover; display: block; }

  .voltage-filter-strip.is-on,
  .panel-filter-box.is-on,
  .profile-filter-box.is-on { display: flex; }
  .profile-filter-box.is-on { flex-direction: column; align-items: stretch; gap: 10px; }
  a.panel-filter-chip { text-decoration: none; }

  .hero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 24px; }
  .amber-btn, .ghost-btn, .danger-btn {
    border-radius: 999px; padding: 11px 18px; font: inherit; font-size: 13px; font-weight: 700;
    cursor: pointer; text-decoration: none; display: inline-flex; align-items: center;
    justify-content: center; gap: 7px; border: 1px solid transparent; transition: var(--transition);
  }
  .amber-btn {
    background: var(--amber); color: var(--amber-ink);
    box-shadow: 0 0 20px rgba(255, 180, 84, 0.2);
  }
  .amber-btn:hover {
    transform: translateY(-1px); box-shadow: 0 8px 24px var(--amber-glow);
  }
  .ghost-btn { background: transparent; color: var(--paper); border-color: var(--line); }
  .ghost-btn:hover { border-color: var(--amber); color: var(--amber); }
  .danger-btn {
    background: transparent; color: var(--danger);
    border-color: color-mix(in srgb, var(--danger) 35%, transparent);
  }
  .btn-small { padding: 7px 12px; font-size: 12px; }

  .product-grid {
    --grelha-cols: 4;
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    width: 100%;
  }
  @media (min-width: 720px) {
    .product-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 12px;
    }
  }
  @media (min-width: 1100px) {
    .product-grid {
      grid-template-columns: repeat(var(--grelha-cols, 4), minmax(0, 1fr));
      gap: 12px;
    }
  }
  .catalog-page .product-grid {
    gap: 10px;
  }
  @media (min-width: 720px) {
    .catalog-page .product-grid { gap: 11px; }
  }
  .sku-card {
    position: relative;
    background: var(--bg-panel);
    border: 1px solid var(--line);
    border-radius: 10px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    min-width: 0;
    transition: border-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  }
  .sku-card:hover {
    border-color: var(--line-active);
    transform: translateY(-2px);
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.16);
  }
  .sku-card--gallery {
    border-radius: 12px;
    background: color-mix(in srgb, var(--bg-panel) 88%, var(--bg-deep));
    box-shadow: 0 1px 0 color-mix(in srgb, var(--paper) 4%, transparent) inset;
    transition:
      border-color 0.28s ease,
      transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  html[data-theme="day"] .sku-card--gallery {
    background: var(--bg-panel);
  }
  .sku-card--gallery:hover {
    border-color: color-mix(in srgb, var(--amber) 42%, var(--line));
    transform: translateY(-3px);
    box-shadow:
      0 12px 24px color-mix(in srgb, var(--bg-deep) 55%, transparent),
      0 0 0 1px color-mix(in srgb, var(--amber) 16%, transparent);
  }
  html[data-theme="day"] .sku-card--gallery:hover {
    box-shadow:
      0 10px 22px rgba(30, 45, 70, 0.09),
      0 0 0 1px color-mix(in srgb, var(--amber) 18%, transparent);
  }
  .sku-pick {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 3;
    display: grid;
    place-items: center;
    width: 24px;
    height: 24px;
    margin: 0;
    border-radius: 7px;
    background: color-mix(in srgb, var(--bg-panel) 86%, transparent);
    border: 1px solid var(--line);
    backdrop-filter: blur(10px);
    cursor: pointer;
  }
  .sku-pick input { margin: 0; width: 14px; height: 14px; }
  .sku-photo {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    background: var(--bg-deep);
    overflow: hidden;
  }
  .sku-card--gallery .sku-photo {
    aspect-ratio: 1 / 1;
    background:
      radial-gradient(ellipse at 50% 40%, color-mix(in srgb, var(--bg-panel-hover) 70%, transparent) 0%, var(--bg-deep) 72%);
  }
  .sku-card--gallery .sku-photo::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 22%;
    pointer-events: none;
    background: linear-gradient(180deg, transparent, color-mix(in srgb, var(--bg-panel) 45%, transparent));
  }
  .sku-photo img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .sku-card:hover .sku-photo img { transform: scale(1.035); }
  .sku-card--gallery:hover .sku-photo img { transform: scale(1.05); }
  .sku-body {
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
    min-width: 0;
  }
  .sku-card--gallery .sku-body {
    padding: 9px 10px 10px;
    gap: 3px;
  }
  .sku-meta, .muted { color: var(--paper-dim); font-size: 12px; }
  .sku-card .sku-meta {
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .catalog-page .sku-card--gallery .sku-meta {
    display: none;
  }
  .sku-card .sku-sku,
  .sku-card .muted.mono {
    margin: 0;
    font-size: 11px;
    color: var(--paper-dim);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
  }
  .sku-body h3 {
    font-size: 13px;
    line-height: 1.3;
    font-weight: 650;
    margin: 0;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sku-card--gallery .sku-body h3 {
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.015em;
    line-height: 1.25;
    white-space: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sku-card--gallery .sku-sku {
    font-size: 10.5px;
  }
  .sku-body h3 a, .cell-name a { color: inherit; text-decoration: none; }
  .sku-body h3 a {
    display: block;
    min-width: 0;
    color: inherit;
    text-decoration: none;
  }
  .sku-card--gallery .sku-body h3 a {
    white-space: inherit;
    overflow: inherit;
    text-overflow: inherit;
  }
  .sku-body h3 a:hover, .cell-name a:hover { color: var(--amber); }
  .sku-price, .price { color: var(--amber); font-weight: 700; }
  .sku-card .sku-price {
    margin: 0;
    font-size: 14px;
    font-variant-numeric: tabular-nums;
  }
  .sku-card--gallery .sku-price {
    font-size: 13.5px;
    font-weight: 750;
    letter-spacing: -0.02em;
  }
  /* Specs from Colunas ? compact modern chips */
  .sku-card .sku-chips {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    width: 100%;
    margin: 2px 0 0;
    padding: 0;
  }
  .sku-card .sku-chip {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    max-width: 100%;
    margin: 0;
    padding: 2px 7px;
    border: 1px solid color-mix(in srgb, var(--line) 90%, transparent);
    border-radius: 999px;
    background: color-mix(in srgb, var(--bg-chip, var(--bg-deep)) 70%, transparent);
    font-size: 10px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--paper-dim);
    white-space: nowrap;
    overflow: hidden;
  }
  .sku-card .sku-chip-ic {
    display: inline-flex;
    flex: none;
    width: 12px;
    height: 12px;
    color: var(--amber);
    opacity: 0.9;
  }
  .sku-card .sku-chip-ic svg {
    width: 12px;
    height: 12px;
    display: block;
  }
  .sku-card .sku-chip-val {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .sku-card .sku-chip em { display: none; }
  .sku-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    margin-top: auto;
    padding-top: 10px;
  }
  .sku-card--gallery .sku-foot {
    margin-top: 6px;
    padding-top: 8px;
    border-top: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  }
  .sku-card .sku-actions .btn-small {
    padding: 5px 8px;
    font-size: 10.5px;
    border-radius: 7px;
  }
  .sku-card--gallery .sku-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--amber) 35%, var(--line));
    background: color-mix(in srgb, var(--amber) 10%, transparent);
    color: var(--amber);
    font-size: 10.5px;
    font-weight: 700;
    letter-spacing: 0.01em;
    text-decoration: none;
    transition: var(--transition);
  }
  .sku-card--gallery .sku-cta:hover {
    background: color-mix(in srgb, var(--amber) 18%, transparent);
    border-color: var(--amber);
    color: var(--amber);
  }
  .sku-actions, .inline-actions, .form-actions, .row-actions {
    display: flex; flex-wrap: wrap; gap: 8px; align-items: center;
  }
  .sku-actions { margin-top: 0; padding-top: 0; flex: 0 0 auto; }
  .sku-card--gallery .sku-actions { gap: 4px; flex-wrap: nowrap; }
  .cell-product {
    display: grid;
    grid-template-columns: 44px minmax(0, 1fr);
    gap: 12px;
    align-items: center;
    min-width: 0;
  }
  .spec-pick,
  .spec-check-head {
    display: grid;
    place-items: center;
    margin: 0;
  }
  .spec-pick {
    width: 28px;
    height: 28px;
    cursor: pointer;
  }
  .spec-pick input { margin: 0; }
  .spec-ref {
    font-size: 11px;
    letter-spacing: 0.02em;
    color: var(--paper-dim);
  }
  .spec-table-container--pro .spec-grid-layout {
    column-gap: 14px;
    padding: 12px 18px;
  }
  .spec-table-container--pro .spec-header {
    padding: 10px 18px;
  }
  .spec-table-container--pro .cell-name strong {
    font-size: 13px;
    font-weight: 650;
  }
  .sku-top { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
  .pick { width: 17px; height: 17px; accent-color: var(--amber); }

  .cell-name {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .cell-name strong {
    display: block; font-size: 12px; line-height: 1.25;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0;
  }
  .cell-name strong a {
    display: block;
    min-width: 0;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  @media (min-width: 640px) {
    .cell-name strong { font-size: 13px; }
  }
  .cell-name span, .spec-row .mono {
    display: block;
    color: var(--paper-dim);
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    min-width: 0;
  }
  .spec-actions { display: flex; justify-content: flex-end; }

  .panorama-block { margin-top: 32px; }

  /* ---------- CAT�LOGO GERAL / PRODUTOS ---------- */
  .lista-page {
    --showroom-accent: var(--amber);
    --lista-jump-h: 44px;
    --lista-radius: 12px;
    overflow: visible;
    background:
      radial-gradient(ellipse 48% 26% at 0% 0%, color-mix(in srgb, var(--amber) 9%, transparent), transparent 68%),
      var(--bg);
  }
  .lista-shell {
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: visible;
  }
  .page-banner,
  .lista-banner {
    position: relative;
    display: flex;
    align-items: flex-end;
    min-height: clamp(112px, 16vw, 168px);
    margin: 0 0 18px;
    padding: clamp(20px, 3vw, 32px) clamp(18px, 3vw, 28px);
    border-radius: var(--lista-radius);
    overflow: hidden;
    isolation: isolate;
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    background:
      linear-gradient(135deg, color-mix(in srgb, var(--bg-panel) 92%, var(--amber) 8%) 0%, var(--bg-panel) 55%, color-mix(in srgb, var(--bg-deep) 88%, var(--bg-panel)) 100%);
  }
  .lista-page .page-banner.is-plain {
    min-height: 0;
    align-items: flex-start;
    margin: 0 0 clamp(20px, 3vw, 28px);
    padding: 4px 0 20px;
    border: 0;
    border-radius: 0;
    border-bottom: 1px solid var(--line);
    background: transparent;
    overflow: visible;
  }
  .page-banner.is-plain {
    min-height: 0;
    align-items: center;
  }
  .page-banner.has-image {
    min-height: clamp(140px, 20vw, 200px);
    border-color: transparent;
  }
  .page-banner-media,
  .page-banner-fallback,
  .lista-banner-media,
  .lista-banner-fallback {
    position: absolute;
    inset: 0;
    z-index: 0;
  }
  .page-banner-media img,
  .lista-banner-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .page-banner-shade,
  .lista-banner-shade {
    position: absolute;
    inset: 0;
    background: linear-gradient(105deg, rgba(10, 12, 16, 0.72) 0%, rgba(10, 12, 16, 0.28) 55%, rgba(10, 12, 16, 0.45) 100%);
  }
  html[data-theme="day"] .page-banner-shade,
  html[data-theme="day"] .lista-banner-shade {
    background: linear-gradient(105deg, rgba(18, 14, 10, 0.55) 0%, rgba(18, 14, 10, 0.2) 55%, rgba(18, 14, 10, 0.35) 100%);
  }
  .page-banner-copy {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: min(40rem, 100%);
  }
  .page-banner-kicker {
    margin: 0;
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.2em;
    text-transform: uppercase;
    color: var(--amber);
  }
  .page-banner.has-image .page-banner-kicker { color: #ffc56a; }
  .page-banner-text,
  .lista-banner-text {
    position: relative;
    z-index: 1;
    margin: 0;
    text-align: left;
    font-size: clamp(28px, 4.4vw, 42px);
    font-weight: 650;
    letter-spacing: -0.035em;
    line-height: 1.08;
    color: var(--paper);
    text-wrap: balance;
    white-space: pre-line;
  }
  .page-banner.has-image .page-banner-text {
    color: #f7f2ea;
    text-shadow: 0 2px 18px rgba(0, 0, 0, 0.35);
  }
  .page-banner-lead {
    margin: 2px 0 0;
    max-width: 48ch;
    font-size: 14.5px;
    line-height: 1.6;
    color: var(--paper-dim);
  }
  .page-banner.has-image .page-banner-lead {
    color: rgba(247, 242, 234, 0.82);
  }

  /* Sticky jump bar — top dinâmico via --topbar-h (medido em JS) */
  .lista-jump {
    position: -webkit-sticky;
    position: sticky;
    top: var(--topbar-h, 72px);
    z-index: 90;
    margin: 0 0 clamp(18px, 2.6vw, 28px);
    padding: 10px 0 12px;
    background: transparent;
  }
  /* Full-bleed sticky strip no telemóvel */
  @media (max-width: 960px) {
    .lista-jump {
      width: 100vw;
      max-width: 100vw;
      margin-left: calc(50% - 50vw);
      margin-right: calc(50% - 50vw);
      padding-left: max(12px, env(safe-area-inset-left, 0px));
      padding-right: max(12px, env(safe-area-inset-right, 0px));
      box-sizing: border-box;
    }
  }
  .lista-jump-rail {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 6px;
    width: fit-content;
    max-width: 100%;
    min-width: 0;
    padding: 4px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg-panel);
    box-shadow: none;
  }
  .lista-jump.has-overflow .lista-jump-rail {
    width: 100%;
  }
  html[data-theme="day"] .lista-jump-rail {
    background: #fff;
    border-color: rgba(30, 45, 70, 0.12);
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.95) inset,
      0 8px 22px rgba(20, 28, 40, 0.06);
  }
  html[data-theme="night"] .lista-jump-rail {
    background: color-mix(in srgb, var(--bg-panel) 88%, var(--bg-deep) 12%);
    border-color: rgba(160, 190, 230, 0.14);
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.05) inset,
      0 10px 26px rgba(0, 0, 0, 0.28);
  }
  .lista-jump:not(.has-overflow) .lista-jump-rail {
    grid-template-columns: minmax(0, 1fr);
  }
  .lista-jump:not(.has-overflow) .lista-jump-arrow {
    display: none;
  }
  .lista-jump-arrow {
    flex: none;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    border: 1px solid transparent;
    background: transparent;
    color: var(--paper-dim);
    font-size: 17px;
    line-height: 1;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: background 0.18s ease, color 0.18s ease, border-color 0.18s ease, opacity 0.18s ease;
  }
  .lista-jump-arrow:hover:not(:disabled) {
    color: var(--paper);
    border-color: color-mix(in srgb, var(--amber) 30%, var(--line));
    background: color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .lista-jump-arrow:disabled {
    opacity: 0.28;
    cursor: default;
  }
  @media (max-width: 719px) {
    .lista-jump-arrow {
      display: none;
    }
    .lista-jump-rail {
      grid-template-columns: minmax(0, 1fr);
      padding: 4px;
      border-radius: 12px;
    }
  }
  .lista-jump-track {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 4px;
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior-x: contain;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    padding: 0;
    min-width: 0;
  }
  .lista-jump.has-overflow:not(.at-start) .lista-jump-track {
    mask-image: linear-gradient(90deg, transparent 0%, #000 16px, #000 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 16px, #000 100%);
  }
  .lista-jump.has-overflow:not(.at-end) .lista-jump-track {
    mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 16px), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 16px), transparent 100%);
  }
  .lista-jump.has-overflow:not(.at-start):not(.at-end) .lista-jump-track {
    mask-image: linear-gradient(90deg, transparent 0%, #000 16px, #000 calc(100% - 16px), transparent 100%);
    -webkit-mask-image: linear-gradient(90deg, transparent 0%, #000 16px, #000 calc(100% - 16px), transparent 100%);
  }
  .lista-jump:not(.has-overflow) .lista-jump-track,
  .lista-jump.at-start.at-end .lista-jump-track {
    mask-image: none;
    -webkit-mask-image: none;
  }
  .lista-jump-track::-webkit-scrollbar { display: none; }
  .lista-jump-btn {
    flex: 0 0 auto;
    scroll-snap-align: start;
    position: relative;
    border: 0;
    background: transparent;
    color: var(--paper-dim);
    border-radius: 9px;
    padding: 8px 13px;
    font: inherit;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: 0.005em;
    text-transform: none;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.2;
    transition: color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
  }
  .lista-jump.is-crowded .lista-jump-btn {
    padding: 7px 11px;
    font-size: 12.5px;
  }
  .lista-jump.is-dense .lista-jump-btn {
    padding: 7px 10px;
    font-size: 12px;
  }
  .lista-jump-btn:hover:not(.is-active) {
    color: var(--paper);
    background: color-mix(in srgb, var(--bg-overlay) 80%, transparent);
  }
  html[data-theme="day"] .lista-jump-btn:hover:not(.is-active) {
    background: rgba(30, 45, 70, 0.06);
  }
  html[data-theme="night"] .lista-jump-btn:hover:not(.is-active) {
    background: rgba(255, 255, 255, 0.06);
  }
  .lista-jump-btn.is-active {
    color: var(--amber-ink);
    background: var(--amber);
    box-shadow: 0 6px 16px var(--amber-glow);
  }
  html[data-theme="day"] .lista-jump-btn.is-active {
    /* day --amber-ink is white on deeper amber */
    color: #fff;
  }
  html[data-theme="night"] .lista-jump-btn.is-active {
    /* night amber is bright; keep dark ink for contrast */
    color: #1a140c;
  }
  .lista-jump-btn:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--amber) 55%, transparent);
    outline-offset: 2px;
  }

  .cat-groups {
    display: flex;
    flex-direction: column;
    gap: clamp(28px, 4vw, 44px);
    padding-bottom: clamp(28px, 4vw, 48px);
  }
  .cat-group {
    min-width: 0;
    scroll-margin-top: calc(var(--topbar-h, 72px) + var(--lista-jump-h, 44px) + 12px);
  }
  .cat-group-head {
    display: grid;
    grid-template-columns: 3px minmax(0, 1fr) auto;
    gap: 0 14px;
    align-items: stretch;
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  }
  .cat-group-accent {
    width: 3px;
    min-height: 2.75rem;
    border-radius: 99px;
    background: var(--showroom-accent, var(--amber));
  }
  .cat-group-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 5px;
  }
  .cat-group-kicker {
    margin: 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--showroom-accent, var(--amber));
  }
  .cat-group-title {
    display: block;
    margin: 0;
    font-size: clamp(22px, 3.2vw, 30px);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: var(--paper);
  }
  .cat-group-title-text {
    min-width: 0;
  }
  .cat-group-lead {
    margin: 0;
    max-width: 52ch;
    font-size: 13.5px;
    line-height: 1.55;
    color: var(--paper-dim);
  }
  .cat-group-meta {
    justify-self: end;
    align-self: center;
    font-size: 10px;
    font-weight: 650;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--paper-dim);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  @media (max-width: 640px) {
    .cat-group-head {
      grid-template-columns: 3px minmax(0, 1fr);
      gap: 0 10px;
    }
    .cat-group-meta {
      grid-column: 2;
      justify-self: start;
      margin-top: 2px;
    }
  }

  .lista-cat-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 14px 12px;
    width: 100%;
    min-width: 0;
  }
  @media (min-width: 640px) {
    .lista-cat-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 18px 16px;
    }
  }
  @media (min-width: 960px) {
    .lista-cat-grid {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 20px 16px;
    }
  }
  @media (min-width: 1200px) {
    .lista-cat-grid {
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 22px 14px;
    }
  }
  @media (min-width: 960px) {
    .lista-cat-media {
      width: clamp(104px, 12vw, 148px);
      height: clamp(104px, 12vw, 148px);
    }
  }
  .lista-cat-cell {
    min-width: 0;
    display: flex;
  }
  .lista-cat-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
    text-decoration: none;
    color: inherit;
    min-width: 0;
    width: 100%;
    height: 100%;
    padding: 6px 8px 4px;
    border: 0;
    border-radius: 0;
    background: transparent;
    overflow: visible;
    transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .lista-cat-card:hover {
    transform: translateY(-3px);
  }
  .lista-cat-card:focus-visible {
    outline: 2px solid var(--amber);
    outline-offset: 4px;
    border-radius: 12px;
  }
  .lista-cat-media {
    position: relative;
    display: grid;
    place-items: center;
    width: clamp(132px, 40vw, 168px);
    height: clamp(132px, 40vw, 168px);
    flex: none;
    border-radius: 18px;
    overflow: hidden;
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.08);
    background:
      linear-gradient(145deg, color-mix(in srgb, var(--bg-deep) 88%, var(--amber) 12%), var(--bg-deep));
    transition: border-color 0.2s ease, box-shadow 0.25s ease;
  }
  .lista-cat-card:hover .lista-cat-media {
    border-color: color-mix(in srgb, var(--amber) 42%, var(--line));
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
  }
  .lista-cat-media.is-mono {
    background:
      radial-gradient(circle at 32% 28%, color-mix(in srgb, var(--amber) 20%, transparent), transparent 58%),
      linear-gradient(155deg, color-mix(in srgb, var(--bg-panel) 55%, var(--bg-deep)), var(--bg-deep));
  }
  html[data-theme="day"] .lista-cat-media.is-mono {
    background:
      radial-gradient(circle at 32% 28%, color-mix(in srgb, var(--amber) 14%, transparent), transparent 58%),
      linear-gradient(155deg, #f7f3ee, #ebe4db);
  }
  .lista-cat-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .lista-cat-card:hover .lista-cat-media img {
    transform: scale(1.06);
  }
  .lista-cat-mono {
    font-size: clamp(22px, 3vw, 28px);
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--amber);
    line-height: 1;
    user-select: none;
    font-family: var(--font-mono, ui-monospace, monospace);
  }
  .lista-cat-copy {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    min-width: 0;
    width: 100%;
    margin-top: 12px;
    padding: 0 2px;
  }
  .lista-cat-name {
    font-size: 14px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.3;
    color: var(--paper);
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.2s ease;
  }
  .lista-cat-card:hover .lista-cat-name {
    color: var(--amber);
  }
  .lista-cat-count {
    display: inline-flex;
    align-items: center;
    padding: 0;
    border: 0;
    border-radius: 0;
    font-size: 11px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    font-family: var(--font-mono, ui-monospace, monospace);
    letter-spacing: 0.02em;
    color: var(--paper-dim);
    background: transparent;
  }
  .lista-cat-card:hover .lista-cat-count {
    color: var(--paper-dim);
    border: 0;
    background: transparent;
  }
  html[data-theme="day"] .lista-cat-count {
    background: transparent;
  }
  .child-links { display: flex; flex-wrap: wrap; gap: 8px; margin: 8px 0 16px; }

  /* ---------- ADMIN: Página Lista / Produtos ---------- */
  .lista-admin {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
  }
  .lista-admin-meta {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
  }
  .lista-admin-sticky {
    position: sticky;
    top: 0;
    z-index: 30;
    margin: 0 -2px;
    padding: 2px;
  }
  .lista-admin-sticky-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px 16px;
    padding: 16px 18px;
    background: var(--bg-panel);
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  }
  html[data-theme="day"] .lista-admin-sticky-inner {
    background: var(--bg-panel);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.08);
  }
  .lista-admin-sticky .pages-save-bar {
    flex-shrink: 0;
  }
  .lista-admin-sticky .pages-save-bar .button {
    min-height: 40px;
    padding-inline: 18px;
  }
  .category-admin {
    display: flex;
    flex-direction: column;
    gap: 16px;
    min-width: 0;
  }
  .category-form-sticky {
    top: 0;
    z-index: 40;
  }
  .category-form-sticky .pages-save-bar {
    margin-left: auto;
  }
  .lista-admin-card {
    background: var(--bg-panel);
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl);
    padding: 18px 18px 16px;
    min-width: 0;
    overflow: hidden;
  }
  html[data-theme="day"] .lista-admin-card {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  }
  .lista-admin-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px 16px;
    margin: 0 0 16px;
    padding: 0 0 14px;
    border-bottom: 1px solid var(--line);
  }
  .lista-admin-copy {
    flex: 1 1 220px;
    min-width: 0;
  }
  .lista-admin-kicker {
    margin: 0 0 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--amber);
  }
  .lista-admin-copy h2 {
    margin: 0 0 4px;
    font-size: clamp(18px, 2vw, 22px);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.25;
    color: var(--admin-ink);
  }
  .lista-admin-copy .hint {
    margin: 0;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
    color: var(--admin-ink-muted);
  }
  .lista-admin-fields {
    gap: 12px;
  }
  .lista-admin-empty {
    padding: 18px 14px;
    border: 1px dashed var(--line);
    border-radius: 12px;
    text-align: center;
    color: var(--admin-ink-muted);
    font-size: 13px;
    font-weight: 500;
  }

  /* Categorias principais ? clean hierarchy list */
  .lista-admin-card--groups {
    padding-bottom: 14px;
  }
  .cat-hier-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
  }
  .cat-hier-group {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bg-panel);
    overflow: hidden;
    min-width: 0;
  }
  html[data-theme="day"] .cat-hier-group {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
  }
  .cat-hier-group.is-collapsed .cat-hier-body {
    display: none;
  }
  .cat-hier-group.is-collapsed .cat-hier-group-head {
    border-bottom: 0;
  }
  .cat-hier-group-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: 10px;
    padding: 10px 12px;
    background: color-mix(in srgb, var(--admin-ink) 3.5%, transparent);
    border-bottom: 1px solid var(--line);
  }
  @media (min-width: 720px) {
    .cat-hier-group-head {
      grid-template-columns: minmax(0, 1fr) auto;
      align-items: center;
      gap: 10px 14px;
    }
  }
  .cat-hier-toggle {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    margin: 0;
    padding: 4px 2px;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    min-width: 0;
    border-radius: 10px;
  }
  .cat-hier-toggle:hover {
    background: color-mix(in srgb, var(--admin-ink) 4%, transparent);
  }
  .cat-hier-toggle:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--amber) 50%, transparent);
    outline-offset: 2px;
  }
  .cat-hier-chevron {
    flex: none;
    width: 18px;
    height: 18px;
    border-radius: 5px;
    position: relative;
    background: color-mix(in srgb, var(--admin-ink) 6%, transparent);
  }
  .cat-hier-chevron::before {
    content: "";
    position: absolute;
    inset: 5px 4px 5px 5px;
    border-right: 2px solid var(--admin-ink-muted);
    border-bottom: 2px solid var(--admin-ink-muted);
    transform: rotate(-45deg);
    transition: transform 0.18s ease;
  }
  .cat-hier-group.is-open .cat-hier-chevron::before {
    transform: rotate(45deg);
    inset: 4px 5px 6px 4px;
  }
  .cat-hier-toggle-label {
    flex: none;
    margin-left: auto;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--amber);
  }
  .cat-hier-index {
    flex-shrink: 0;
    width: 30px;
    height: 30px;
    border-radius: 9px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: var(--amber-ink);
    background: var(--amber);
  }
  .lista-expand-index,
  .lista-prod-num {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: var(--amber-ink);
    background: var(--amber);
  }
  .cat-hier-group-text {
    min-width: 0;
  }
  .cat-hier-group-title {
    display: block;
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.25;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
  }
  .cat-hier-group-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    margin-top: 3px;
  }
  .cat-hier-group-tags .mono {
    font-size: 11px;
    color: var(--admin-ink-muted);
  }
  .cat-hier-actions,
  .cat-hier-sub-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
    min-width: 0;
  }
  .cat-hier-actions {
    justify-content: flex-start;
  }
  @media (min-width: 640px) {
    .cat-hier-actions { justify-content: flex-end; }
  }
  .cat-hier-subs {
    list-style: none;
    margin: 0;
    padding: 4px 0;
  }
  .cat-hier-sub {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr) auto;
    gap: 8px 12px;
    align-items: center;
    padding: 10px 14px;
    min-width: 0;
  }
  .cat-hier-sub + .cat-hier-sub {
    border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
  }
  .cat-hier-sub-tools {
    justify-content: flex-end;
    flex-wrap: nowrap;
  }
  @media (max-width: 560px) {
    .cat-hier-sub {
      grid-template-columns: 42px minmax(0, 1fr);
    }
    .cat-hier-sub-tools {
      grid-column: 1 / -1;
      padding-left: 54px;
      justify-content: flex-start;
    }
  }
  .cat-hier-thumb {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    overflow: hidden;
    background: var(--bg-deep);
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
  }
  .cat-hier-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .cat-hier-sub-body {
    min-width: 0;
  }
  .cat-hier-sub-title {
    display: block;
    font-size: 14px;
    font-weight: 650;
    line-height: 1.3;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
  }
  .cat-hier-sub-meta {
    margin: 2px 0 0;
    font-size: 11px;
    line-height: 1.35;
    color: var(--admin-ink-muted);
  }
  .cat-hier-empty {
    list-style: none;
    margin: 0;
    padding: 18px 16px;
    color: var(--admin-ink-muted);
    font-size: 13px;
    text-align: center;
  }
  .cat-hier-footer {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 10px 12px;
    padding: 12px 14px 14px;
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--admin-ink) 2.5%, transparent);
  }
  .cat-hier-add {
    display: flex;
    flex-direction: column;
    gap: 4px;
    margin: 0;
    flex: 1 1 220px;
    min-width: 0;
    font-size: 12px;
    font-weight: 650;
    color: var(--admin-ink);
  }
  /* Native <option> needs solid light ink ? dark-mode text color breaks the dropdown */
  .cat-hier-select,
  .admin select.cat-hier-select {
    width: auto;
    min-width: 140px;
    max-width: 100%;
    height: 36px;
    padding: 0 10px;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: #ffffff !important;
    color: #0f172a !important;
    color-scheme: light;
  }
  .cat-hier-add .cat-hier-select {
    width: 100%;
    max-width: 360px;
  }
  .cat-hier-select option,
  .admin select.cat-hier-select option {
    background: #ffffff;
    color: #0f172a;
  }
  .cat-hier-footer .button {
    height: 36px;
    white-space: nowrap;
  }
  .lista-admin-card--groups .icon-btn {
    width: 32px;
    height: 32px;
    padding: 0;
    border-radius: 8px;
    border: 1px solid var(--line);
    background: var(--bg-input);
    color: var(--admin-ink);
    font-size: 13px;
    font-weight: 700;
    line-height: 1;
    cursor: pointer;
  }
  .lista-admin-card--groups .icon-btn:hover {
    border-color: var(--line-active);
    background: var(--bg-panel-hover);
  }
  .lista-admin-card--groups .button-small {
    height: 32px;
    padding: 0 10px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
  }

  .lista-order-builder {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
  }
  .lista-admin .lista-block {
    margin: 0;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: color-mix(in srgb, var(--admin-ink) 2%, transparent);
    overflow: hidden;
  }
  .lista-admin .lista-block.is-open {
    background: var(--bg-panel);
  }
  .lista-admin .lista-expand {
    width: 100%;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) auto;
    gap: 10px 12px;
    align-items: center;
    padding: 12px 14px;
    background: transparent;
    border: 0;
    color: inherit;
    text-align: left;
    cursor: pointer;
    font: inherit;
  }
  .lista-admin .lista-expand:hover {
    background: color-mix(in srgb, var(--admin-ink) 4%, transparent);
  }
  .lista-expand-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .lista-expand-copy strong {
    font-size: 14px;
    font-weight: 650;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
  }
  .lista-expand-copy .mono {
    font-size: 11.5px;
  }
  .lista-expand-toggle {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--amber);
    white-space: nowrap;
  }
  .lista-admin .nested-products {
    margin: 0;
    padding: 0 14px 14px;
    border-left: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .lista-search-label {
    gap: 4px;
    font-size: 12px;
  }
  .lista-prod-list {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .lista-admin .assoc-row.lista-prod-row {
    margin: 0;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: var(--bg-overlay);
    gap: 10px;
  }
  .lista-prod-label {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    min-width: 0;
    flex: 1;
    font-size: 12.5px;
    color: var(--admin-ink);
  }
  .lista-prod-num {
    width: 22px;
    height: 22px;
    border-radius: 6px;
    font-size: 11px;
  }

  /* ---------- PDP ---------- */
  .pdp-page {
    padding-bottom: clamp(48px, 8vw, 88px);
  }
  .pdp-page .breadcrumb-nav {
    margin-bottom: 18px;
  }
  .pdp {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(22px, 4vw, 36px);
    margin-top: 4px;
  }
  @media (min-width: 900px) {
    .pdp {
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: clamp(12px, 1.6vw, 18px);
      align-items: start;
    }
  }

  .pdp-gallery {
    display: flex;
    flex-direction: column;
    gap: 12px;
    min-width: 0;
  }
  .pdp-photo {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    padding: 0;
    border: 1px solid var(--pdp-frame);
    border-radius: 16px;
    overflow: hidden;
    background:
      radial-gradient(ellipse at 50% 42%, color-mix(in srgb, var(--bg-panel-hover) 55%, transparent) 0%, var(--bg-deep) 70%);
    cursor: zoom-in;
    box-shadow: var(--pdp-frame-shadow);
    transition: border-color 0.28s ease, box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .pdp-photo:hover {
    border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
    box-shadow:
      var(--pdp-frame-shadow),
      0 0 0 1px color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .pdp-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: opacity 0.3s ease, transform 0.55s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .pdp-photo:hover img {
    transform: scale(1.02);
  }
  .pdp-zoom-layer {
    position: absolute;
    inset: 0;
    opacity: 0;
    pointer-events: none;
    background-repeat: no-repeat;
    background-size: 180%;
    transition: opacity 0.2s ease;
  }
  .pdp-photo:hover img { opacity: 0; }
  .pdp-photo:hover .pdp-zoom-layer { opacity: 1; }
  .pdp-zoom-hint {
    position: absolute;
    right: 14px;
    bottom: 14px;
    z-index: 2;
    width: 36px;
    height: 36px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--bg-panel) 88%, transparent);
    color: var(--paper-dim);
    border: 1px solid var(--line);
    backdrop-filter: blur(10px);
    pointer-events: none;
    transition: color 0.2s ease, border-color 0.2s ease;
  }
  .pdp-photo:hover .pdp-zoom-hint {
    color: var(--amber);
    border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
  }
  .thumbs {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(68px, 1fr));
    gap: 8px;
  }
  .thumbs button {
    width: 100%;
    aspect-ratio: 1 / 1;
    padding: 0;
    border-radius: 10px;
    overflow: hidden;
    border: 1px solid var(--pdp-frame);
    background: var(--bg-deep);
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
  }
  .thumbs button:hover {
    border-color: var(--line-active);
  }
  .thumbs button.active {
    border-color: var(--amber);
    box-shadow: 0 0 0 1px var(--amber);
  }
  .thumbs img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }

  .pdp-buybox {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 2px 0 4px;
    min-width: 0;
  }
  @media (min-width: 900px) {
    .pdp-buybox {
      position: sticky;
      top: calc(var(--topbar-h, 72px) + 16px);
      gap: 15px;
      padding: 18px 18px 16px;
      border: 1px solid var(--line);
      border-radius: 16px;
      background: color-mix(in srgb, var(--bg-panel) 94%, transparent);
      box-shadow: 0 1px 0 color-mix(in srgb, var(--paper) 4%, transparent) inset;
    }
  }
  .pdp-title {
    font-size: clamp(20px, 2.8vw, 28px);
    line-height: 1.18;
    letter-spacing: -0.03em;
    margin: 0;
    color: var(--paper);
    font-weight: 700;
  }
  .pdp-sku {
    margin: -6px 0 0;
    color: var(--paper-dim);
    font-size: 13px;
    letter-spacing: 0.04em;
    line-height: 1.3;
  }
  .pdp-sku-label {
    font-weight: 600;
    letter-spacing: 0.06em;
    opacity: 0.9;
  }
  .pdp-price-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(8px, 1.5vw, 14px);
    flex-wrap: nowrap;
    padding-top: 2px;
  }
  .pdp-price-block {
    display: flex;
    align-items: baseline;
    gap: clamp(6px, 1vw, 10px);
    flex: 0 1 auto;
    min-width: 0;
    flex-wrap: nowrap;
  }
  .pdp-flags {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    margin-left: 2px;
    line-height: 0;
  }
  .pdp-flag {
    display: inline-flex;
    line-height: 0;
  }
  .pdp-flag .country-flag-svg {
    display: block;
    width: 26px;
    height: 18px;
    border-radius: 2px;
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--paper) 18%, transparent);
  }
  .pdp-price {
    font-size: clamp(26px, 3.8vw, 32px);
    font-weight: 750;
    color: var(--amber);
    line-height: 1;
    white-space: nowrap;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
  }
  .pdp-price-pvp {
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.06em;
    color: var(--paper-dim);
    line-height: 1;
    white-space: nowrap;
    align-self: flex-end;
    margin-bottom: 2px;
  }
  .pdp-cert-row {
    display: flex;
    align-items: center;
    flex-wrap: nowrap;
    gap: clamp(4px, 1vw, 8px);
    margin-left: auto;
    flex: 1 1 auto;
    min-width: 0;
    justify-content: flex-end;
  }
  .pdp-energy-label,
  .pdp-cert-mark {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 1 auto;
    min-width: 0;
    min-height: clamp(28px, 8vw, 38px);
    padding: clamp(3px, 1vw, 7px) clamp(4px, 1.2vw, 7px);
    border: 1px solid rgba(40, 30, 18, 0.12);
    border-radius: 8px;
    background: #F5EFE6;
    color: #1C1712;
    line-height: 0;
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.35);
  }
  .pdp-energy-label { appearance: none; cursor: pointer; transition: var(--transition); }
  .pdp-energy-label:hover,
  .pdp-cert-mark:hover {
    border-color: rgba(184, 115, 14, 0.45);
    box-shadow: 0 6px 14px rgba(0, 0, 0, 0.14);
  }
  html[data-theme="night"] .pdp-energy-label,
  html[data-theme="night"] .pdp-cert-mark {
    background: #EDE6DA;
    border-color: rgba(255, 230, 200, 0.18);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.28);
  }
  html[data-theme="night"] .pdp-energy-label:hover,
  html[data-theme="night"] .pdp-cert-mark:hover {
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.35);
  }
  .pdp-energy-label .energy-grade-svg,
  .pdp-energy-label img {
    width: clamp(28px, 9vw, 56px);
    height: auto;
    max-height: clamp(18px, 5.5vw, 36px);
    display: block;
    object-fit: contain;
  }
  .pdp-cert-mark img {
    width: clamp(18px, 5.5vw, 36px);
    height: clamp(18px, 5.5vw, 36px);
    object-fit: contain;
    display: block;
  }
  .pdp-energy-fallback {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 0;
    min-height: clamp(28px, 8vw, 36px);
    padding: 2px 6px;
    font-size: clamp(8px, 2.4vw, 10px);
    font-weight: 700;
    color: #B8730E;
    line-height: 1.2;
    text-align: center;
    white-space: nowrap;
  }
  .pdp-lightbox-svg { padding: 18px; display: grid; place-items: center; background: #fff; }
  .pdp-lightbox-svg .energy-label-full-svg {
    width: min(320px, 86vw);
    height: auto;
    display: block;
  }
  .energy-grade-admin { align-items: end; }
  .energy-grade-preview-wrap { display: flex; flex-direction: column; gap: 8px; }
  .energy-grade-preview {
    min-height: 40px;
    display: flex;
    align-items: center;
    padding: 8px 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--bg-overlay);
  }
  .pdp-price-old {
    font-size: clamp(12px, 3.5vw, 15px);
    color: var(--paper-dim);
    text-decoration: line-through;
    text-decoration-thickness: 1.5px;
    white-space: nowrap;
  }
  .pdp-stock {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size: 13.5px;
    font-weight: 650;
    color: var(--paper);
  }
  .pdp-stock-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--stock-ok);
    box-shadow:
      0 0 0 3px color-mix(in srgb, var(--stock-ok) 22%, transparent),
      0 0 10px color-mix(in srgb, var(--stock-ok) 40%, transparent);
  }
  .pdp-stock.is-out { color: var(--paper-dim); }
  .pdp-stock.is-out .pdp-stock-dot {
    background: var(--paper-dim);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--paper-dim) 18%, transparent);
  }
  .pdp-stock.is-low { color: var(--paper); }
  .pdp-stock.is-low .pdp-stock-dot {
    background: #e6a23c;
    box-shadow:
      0 0 0 3px color-mix(in srgb, #e6a23c 22%, transparent),
      0 0 10px color-mix(in srgb, #e6a23c 35%, transparent);
  }
  .pdp-stock.is-ask { color: var(--paper-dim); }
  .pdp-stock.is-ask .pdp-stock-dot {
    background: var(--cool, #6b8cae);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--cool, #6b8cae) 20%, transparent);
  }

  .pdp-badges {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    padding-top: 2px;
  }
  @media (min-width: 520px) {
    .pdp-badges { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  }
  .pdp-badge {
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    gap: 10px;
    min-height: 100%;
    padding: 12px 11px;
    border-radius: 12px;
    border: 1px solid color-mix(in srgb, var(--line) 90%, transparent);
    background: color-mix(in srgb, var(--bg-chip, var(--bg-deep)) 55%, transparent);
  }
  .pdp-badge-ic {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--amber);
    background: color-mix(in srgb, var(--amber) 14%, transparent);
  }
  .pdp-badge-ic svg {
    width: 15px;
    height: 15px;
    display: block;
  }
  .pdp-badge-text {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
    flex: 1 1 auto;
  }
  .pdp-badge-text em {
    font-style: normal;
    font-size: 10px;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--paper-dim);
    font-weight: 700;
    line-height: 1.2;
  }
  .pdp-badge-text strong {
    font-size: 13px;
    font-weight: 650;
    color: var(--paper);
    line-height: 1.25;
    word-break: break-word;
  }

  .pdp-variants {
    display: grid;
    gap: 0;
    margin: 0;
    padding: 0;
  }
  .pdp-variants-trigger {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 56px;
    padding: 8px 10px 8px 8px;
    margin: 0;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--bg-panel);
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  .pdp-variants-trigger:hover {
    border-color: color-mix(in srgb, var(--amber) 42%, var(--line));
    background: color-mix(in srgb, var(--amber) 4%, var(--bg-panel));
  }
  .pdp-variants-trigger:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--amber) 26%, transparent);
  }
  .pdp-variants-trigger:active {
    transform: translateY(1px);
  }
  .pdp-variants.is-open .pdp-variants-trigger {
    border-color: var(--line);
    border-bottom-color: color-mix(in srgb, var(--line) 75%, transparent);
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
    background: color-mix(in srgb, var(--bg-deep) 12%, var(--bg-panel));
  }
  .pdp-variants-stack {
    position: relative;
    display: flex;
    align-items: center;
    flex: none;
    height: 40px;
    padding-right: 4px;
  }
  .pdp-variants-stack-item {
    position: relative;
    z-index: calc(3 - var(--i, 0));
  }
  .pdp-variants-stack-item + .pdp-variants-stack-item {
    margin-left: -11px;
  }
  .pdp-variant-thumb {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    flex: none;
    background: var(--bg-chip);
    border: 2px solid var(--bg-panel);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--line) 90%, transparent);
  }
  .pdp-variants-stack .pdp-variant-thumb {
    width: 40px;
    height: 40px;
  }
  .pdp-variant-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .pdp-variant-thumb.is-current {
    box-shadow:
      0 0 0 1px color-mix(in srgb, var(--amber) 55%, var(--line)),
      0 0 0 3px color-mix(in srgb, var(--amber) 14%, transparent);
  }
  .pdp-variants-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
    flex: 1 1 auto;
  }
  .pdp-variants-kicker {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.11em;
    text-transform: uppercase;
    color: var(--paper-dim);
    line-height: 1.2;
    font-style: normal;
  }
  .pdp-variants-count {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 18px;
    height: 16px;
    padding: 0 5px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    font-style: normal;
    letter-spacing: 0;
    color: var(--amber);
    background: color-mix(in srgb, var(--amber) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--amber) 28%, transparent);
  }
  .pdp-variants-summary {
    min-width: 0;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--paper);
    font-variant-numeric: tabular-nums;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .pdp-variants-chevron {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    flex: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: var(--paper-dim);
    background: color-mix(in srgb, var(--bg-deep) 18%, transparent);
    border: 1px solid var(--line);
    transition: transform 0.2s ease, color 0.18s ease, background 0.18s ease, border-color 0.18s ease;
  }
  .pdp-variants-trigger:hover .pdp-variants-chevron {
    color: var(--amber);
    border-color: color-mix(in srgb, var(--amber) 34%, var(--line));
    background: color-mix(in srgb, var(--amber) 10%, transparent);
  }
  .pdp-variants-chevron svg {
    width: 14px;
    height: 14px;
    display: block;
  }
  .pdp-variants.is-open .pdp-variants-chevron {
    transform: rotate(180deg);
    color: var(--amber);
    border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
    background: color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .pdp-variants-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.22s ease;
  }
  .pdp-variants.is-open .pdp-variants-panel {
    grid-template-rows: 1fr;
  }
  .pdp-variants-panel > .pdp-variants-list {
    overflow: hidden;
    min-height: 0;
  }
  .pdp-variants-list {
    display: grid;
    gap: 0;
    border: 1px solid var(--line);
    border-top: 0;
    border-radius: 0 0 16px 16px;
    background: color-mix(in srgb, var(--bg-deep) 14%, var(--bg-panel));
  }
  .pdp-variants:not(.is-open) .pdp-variants-list {
    border-color: transparent;
    background: transparent;
  }
  .pdp-variant {
    display: flex;
    align-items: center;
    gap: 12px;
    min-height: 56px;
    padding: 8px 12px;
    border: 0;
    border-top: 1px solid color-mix(in srgb, var(--line) 70%, transparent);
    border-radius: 0;
    background: transparent;
    color: var(--paper);
    text-decoration: none;
    transition: background 0.16s ease;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }
  .pdp-variants:not(.is-open) .pdp-variant {
    border-top-color: transparent;
  }
  .pdp-variant:first-child {
    border-top: 0;
  }
  .pdp-variant:last-child {
    border-radius: 0 0 15px 15px;
  }
  .pdp-variant .pdp-variant-thumb {
    width: 42px;
    height: 42px;
    border-width: 1.5px;
    border-color: color-mix(in srgb, var(--line) 85%, transparent);
    box-shadow: none;
  }
  a.pdp-variant:hover {
    background: color-mix(in srgb, var(--amber) 7%, transparent);
  }
  a.pdp-variant:hover .pdp-variant-label {
    color: var(--amber);
  }
  a.pdp-variant:hover .pdp-variant-thumb {
    border-color: color-mix(in srgb, var(--amber) 45%, var(--line));
  }
  a.pdp-variant:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--amber) 55%, transparent);
    outline-offset: -2px;
  }
  .pdp-variant.is-current {
    background: color-mix(in srgb, var(--amber) 8%, transparent);
    cursor: default;
    pointer-events: none;
  }
  .pdp-variant.is-current .pdp-variant-thumb {
    border-color: color-mix(in srgb, var(--amber) 65%, var(--line));
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--amber) 16%, transparent);
  }
  .pdp-variant-text {
    display: grid;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
  }
  .pdp-variant-label {
    display: block;
    min-width: 0;
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--paper);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .pdp-variant.is-current .pdp-variant-label {
    color: var(--amber);
  }
  .pdp-variant-meta {
    display: block;
    font-size: 11px;
    font-weight: 600;
    color: var(--paper-dim);
    letter-spacing: 0.02em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  @media (pointer: coarse) {
    .pdp-variants-trigger {
      min-height: 60px;
    }
    .pdp-variant {
      min-height: 60px;
      padding: 10px 14px;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .pdp-variants-trigger,
    .pdp-variants-chevron,
    .pdp-variants-panel,
    .pdp-variant {
      transition: none;
    }
    .pdp-variants-trigger:active {
      transform: none;
    }
  }

  .pdp-purchase {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: stretch;
    margin-top: 4px;
    padding: 10px;
    border-radius: 14px;
    border: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-deep) 35%, var(--bg-panel));
  }
  .pdp-qty {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: var(--bg-panel);
  }
  .pdp-qty .icon-btn {
    width: 40px;
    height: 40px;
    min-width: 40px;
    min-height: 40px;
    border-radius: 999px;
    touch-action: manipulation;
  }
  .pdp-qty input {
    width: 52px;
    height: 40px;
    text-align: center;
    border: 0;
    background: transparent;
    color: var(--paper);
    font: inherit;
    font-weight: 700;
    font-size: 14px;
    padding: 0;
    font-variant-numeric: tabular-nums;
    touch-action: manipulation;
  }
  @media (pointer: coarse) {
    .pdp-qty .icon-btn {
      width: 44px;
      height: 44px;
      min-width: 44px;
      min-height: 44px;
    }
    .pdp-qty input {
      width: 56px;
      height: 44px;
    }
  }
  .pdp-qty input:focus { outline: none; box-shadow: none; }
  .pdp-cart-btn {
    flex: 1 1 180px;
    min-height: 46px;
    font-size: 14px;
    border-radius: 999px;
    box-shadow: 0 8px 22px var(--amber-glow);
  }
  .pdp-quick-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 2px; }
  .pdp-avisos {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin-top: 2px;
  }
  .pdp-aviso {
    margin: 0;
    padding: 10px 12px;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--amber) 34%, var(--line));
    background: color-mix(in srgb, var(--amber) 12%, transparent);
    color: var(--paper);
    font-size: 13px;
    line-height: 1.45;
    white-space: pre-wrap;
  }
  .pdp-aviso--shared {
    border-color: color-mix(in srgb, var(--line) 90%, transparent);
    background: color-mix(in srgb, var(--bg-chip, var(--bg-deep)) 55%, transparent);
  }
  .pdp-aviso--custom {
    border-color: color-mix(in srgb, var(--amber) 42%, var(--line));
    background: color-mix(in srgb, var(--amber) 14%, transparent);
  }
  .pdp-secondary-actions {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .pdp-cartaz-btn {
    appearance: none;
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    min-height: 52px;
    padding: 10px 12px 10px 10px;
    border-radius: 14px;
    border: 1px solid color-mix(in srgb, var(--amber) 34%, var(--line));
    background: color-mix(in srgb, var(--amber) 8%, var(--bg-panel));
    color: var(--paper);
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.18s ease, background 0.18s ease, transform 0.15s ease;
  }
  .pdp-cartaz-btn-icon {
    flex: none;
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--amber) 40%, var(--line));
    background: color-mix(in srgb, var(--amber) 14%, transparent);
    color: var(--amber);
  }
  .pdp-cartaz-btn-icon svg {
    display: block;
  }
  .pdp-cartaz-btn-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1 1 auto;
  }
  .pdp-cartaz-btn-copy strong {
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.2;
  }
  .pdp-cartaz-btn-copy em {
    font-style: normal;
    font-size: 11.5px;
    font-weight: 500;
    color: var(--paper-dim);
    line-height: 1.25;
  }
  .pdp-cartaz-btn-arrow {
    flex: none;
    font-size: 15px;
    font-weight: 600;
    color: var(--amber);
    opacity: 0.85;
    transition: transform 0.18s ease, opacity 0.18s ease;
  }
  .pdp-cartaz-btn:hover {
    border-color: color-mix(in srgb, var(--amber) 65%, var(--line));
    background: color-mix(in srgb, var(--amber) 14%, var(--bg-panel));
  }
  .pdp-cartaz-btn:hover .pdp-cartaz-btn-arrow {
    transform: translateX(3px);
    opacity: 1;
  }
  .pdp-cartaz-btn:active {
    transform: translateY(1px);
  }
  .pdp-cartaz-btn:focus-visible {
    outline: none;
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--amber) 28%, transparent);
  }
  .pdp-share {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    padding-top: 12px;
    border-top: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  }
  .pdp-share-label {
    font-size: 10.5px;
    font-weight: 700;
    color: var(--paper-dim);
    letter-spacing: 0.1em;
    text-transform: uppercase;
  }
  .pdp-share-icons { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
  .pdp-share-btn {
    appearance: none;
    width: 34px;
    height: 34px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--paper-dim);
    display: inline-grid;
    place-items: center;
    cursor: pointer;
    transition: var(--transition);
    padding: 0;
  }
  .pdp-share-btn svg { width: 15px; height: 15px; display: block; }
  .pdp-share-btn:hover {
    color: var(--paper);
    border-color: var(--line-active);
    background: var(--bg-panel-hover);
  }
  .pdp-share-whatsapp:hover { color: #25d366; border-color: color-mix(in srgb, #25d366 45%, var(--line)); }
  .pdp-share-facebook:hover { color: #1877f2; border-color: color-mix(in srgb, #1877f2 45%, var(--line)); }
  .pdp-share-x:hover { color: var(--paper); }
  .pdp-share-linkedin:hover { color: #0a66c2; border-color: color-mix(in srgb, #0a66c2 45%, var(--line)); }
  .pdp-share-telegram:hover { color: #2aabee; border-color: color-mix(in srgb, #2aabee 45%, var(--line)); }
  .pdp-share-email:hover { color: var(--amber); border-color: color-mix(in srgb, var(--amber) 45%, var(--line)); }
  .pdp-share-copy:hover { color: var(--amber); border-color: color-mix(in srgb, var(--amber) 45%, var(--line)); }

  /* —— Share poster modal + cartaz —— */
  html.share-poster-open { overflow: hidden; }
  .share-poster-modal {
    position: fixed;
    inset: 0;
    z-index: 1200;
    display: grid;
    place-items: center;
    padding:
      max(12px, env(safe-area-inset-top, 0px))
      max(12px, env(safe-area-inset-right, 0px))
      max(12px, env(safe-area-inset-bottom, 0px))
      max(12px, env(safe-area-inset-left, 0px));
    box-sizing: border-box;
  }
  .share-poster-modal-backdrop {
    position: absolute;
    inset: 0;
    border: 0;
    padding: 0;
    margin: 0;
    background: rgba(4, 6, 12, 0.72);
    backdrop-filter: blur(8px);
    cursor: pointer;
  }
  .share-poster-modal-panel {
    position: relative;
    z-index: 1;
    width: min(440px, 100%);
    max-height: min(96dvh, 980px);
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
    border-radius: 18px;
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 92%, #000);
    box-shadow: 0 28px 64px rgba(0, 0, 0, 0.45);
    box-sizing: border-box;
    min-height: 0;
    overflow: hidden;
  }
  .share-poster-modal-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    flex: none;
  }
  .share-poster-modal-head > div {
    min-width: 0;
  }
  .share-poster-modal-head h2 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.25;
  }
  .share-poster-modal-hint {
    margin: 4px 0 0;
    font-size: 12px;
    color: var(--paper-dim);
    line-height: 1.35;
  }
  .share-poster-modal-close {
    appearance: none;
    flex: none;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--paper);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
  }
  .share-poster-modal-close:hover {
    border-color: var(--amber);
    color: var(--amber);
  }
  .share-poster-modal-stage {
    overflow: auto;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    border-radius: 14px;
    background: #07080d;
    display: flex;
    justify-content: center;
    align-items: flex-start;
    padding: 12px;
    min-height: 0;
    flex: 1 1 auto;
    width: 100%;
    box-sizing: border-box;
  }
  .share-poster-modal-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
    flex: none;
  }
  .share-poster-modal-actions .ghost-btn,
  .share-poster-modal-actions .amber-btn {
    min-height: 42px;
  }
  .share-poster-modal-actions .amber-btn[disabled] {
    opacity: 0.65;
    cursor: wait;
  }
  .share-poster-result {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    width: min(360px, 100%);
    margin: 0 auto;
  }
  .share-poster-result-img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 14px;
    background: #0a0c12;
    /* Necessário no iOS: long-press → Guardar imagem */
    -webkit-touch-callout: default;
    -webkit-user-select: none;
    user-select: none;
    pointer-events: auto;
    touch-action: manipulation;
  }
  .share-poster-result-hint {
    margin: 0;
    padding: 0 4px;
    text-align: center;
    font-size: 12px;
    line-height: 1.4;
    color: var(--paper-dim, #9a948c);
  }
  .share-poster-result-hint strong {
    color: var(--amber, #f0a202);
    font-weight: 700;
  }
  .share-poster-modal.is-mobile-save .share-poster-modal-stage {
    /* Evita que gestos do stage roubem o long-press da imagem */
    overscroll-behavior: contain;
  }

  .share-poster {
    --share-poster-pad: 16px;
    --share-poster-pad-x: 16px;
    --share-poster-gap: 12px;
    --share-poster-section: 12px;
    --share-poster-qr: 104px;
    position: relative;
    width: min(360px, 100%);
    max-width: 100%;
    min-height: 0;
    height: auto;
    aspect-ratio: auto;
    flex: none;
    display: flex;
    flex-direction: column;
    gap: var(--share-poster-section);
    overflow: visible;
    border-radius: 20px;
    color: #f4f1ea;
    font-family: Outfit, system-ui, sans-serif;
    background: #0a0c12;
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.35);
    padding: var(--share-poster-pad) 0;
    box-sizing: border-box;
  }
  .share-poster-bg {
    position: absolute;
    inset: 0;
    background-color: #0a0c12;
    background-image:
      radial-gradient(ellipse 70% 42% at 8% 0%, rgba(240, 162, 2, 0.14), transparent 58%),
      radial-gradient(ellipse 55% 36% at 100% 12%, rgba(70, 110, 180, 0.1), transparent 52%);
    pointer-events: none;
  }
  .share-poster > *:not(.share-poster-bg) {
    position: relative;
    z-index: 1;
  }
  .share-poster-top {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    padding: 0 var(--share-poster-pad-x);
    margin: 0;
  }
  .share-poster-brand {
    display: flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
  }
  .share-poster-brand.has-logo {
    gap: 0;
  }
  .share-poster-brand-logo {
    display: block;
    height: 32px;
    width: auto;
    max-width: 160px;
    object-fit: contain;
    object-position: left center;
    background: transparent;
    border: 0;
    border-radius: 0;
    box-shadow: none;
    flex: none;
  }
  .share-poster-brand-mark {
    width: 26px;
    height: 26px;
    border-radius: 50%;
    flex: none;
    background-color: #12110f;
    box-shadow: inset 0 0 0 7px #f0a202, 0 0 0 1px #5c4414;
  }
  .share-poster-brand strong {
    display: block;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.15;
  }
  .share-poster-brand small {
    display: block;
    margin-top: 3px;
    font-size: 10px;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: #8f8890;
  }
  .share-poster-date,
  .share-poster-top .share-poster-site {
    flex: none;
    max-width: 44%;
    margin: 0;
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.3;
    text-align: right;
    color: #9a948c;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .share-poster-date {
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: #7d7870;
  }
  .share-poster-headline {
    padding: 0 var(--share-poster-pad-x);
    margin: 0;
  }
  .share-poster-headline h2 {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.25;
    max-height: calc(1.25em * 2);
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    word-break: break-word;
    color: #f7f3ea;
  }
  .share-poster-sku {
    margin: 6px 0 0;
    font-family: "JetBrains Mono", ui-monospace, monospace;
    font-size: 11px;
    letter-spacing: 0.02em;
    color: #8a847c;
  }
  /* Preço: planos — compatível com html2canvas */
  .share-poster-price {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 12px;
    margin: 0;
    padding: 10px 14px;
    margin-left: var(--share-poster-pad-x);
    margin-right: var(--share-poster-pad-x);
    border-radius: 12px;
    border: 1px solid #6e521c;
    background-color: #161008;
    box-sizing: border-box;
  }
  .share-poster-price-pvp {
    display: inline-block;
    flex: none;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid #6e521c;
    background-color: #241a0a;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    line-height: 1.2;
    color: #d4a84a;
  }
  .share-poster-price-value {
    display: inline-block;
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.1;
    color: #ffd27a;
  }
  .share-poster-price-old {
    display: inline-block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.2;
    color: #7a746c;
    text-decoration: line-through;
  }
  .share-poster-media {
    display: flex;
    flex-direction: column;
    gap: var(--share-poster-section);
    padding: 0 var(--share-poster-pad-x);
    margin: 0;
    min-width: 0;
  }
  .share-poster-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--share-poster-gap);
    min-width: 0;
  }
  .share-poster-cell {
    aspect-ratio: 1;
    border-radius: 14px;
    overflow: hidden;
    border: 1px solid #2a3344;
    background-color: #12151c;
  }
  .share-poster-cell img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .share-poster-meta {
    display: grid;
    grid-template-columns: minmax(0, 1fr) var(--share-poster-qr);
    gap: 10px;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: visible;
  }
  .share-poster-summary {
    margin: 0;
    min-width: 0;
    min-height: var(--share-poster-qr);
    padding: 12px 12px;
    border-radius: 12px;
    border: 1px solid #2a3344;
    background-color: #10141c;
    display: flex;
    flex-direction: column;
    justify-content: center;
    box-sizing: border-box;
    overflow: visible;
  }
  .share-poster-summary-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: repeat(3, auto);
    gap: 10px 14px;
    align-content: center;
  }
  .share-poster-summary-list li {
    display: flex;
    gap: 7px;
    align-items: center;
    min-width: 0;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    color: #efe9df;
    overflow: hidden;
  }
  .share-poster-summary-list li span:last-child {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .share-poster-summary-empty {
    margin: 0;
    font-size: 12px;
    color: #7a746c;
  }
  .share-poster-bullet {
    flex: none;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background-color: #f0a202;
  }
  .share-poster-scan {
    width: var(--share-poster-qr);
    min-height: var(--share-poster-qr);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 0;
    padding: 8px;
    border-radius: 12px;
    border: 1px solid #2a3344;
    background-color: #10141c;
    box-sizing: border-box;
  }
  .share-poster-qr {
    width: calc(var(--share-poster-qr) - 16px);
    height: calc(var(--share-poster-qr) - 16px);
    border-radius: 10px;
    overflow: hidden;
    background: #fff;
    flex: none;
  }
  .share-poster-qr img,
  .share-poster-qr-fallback {
    width: 100%;
    height: 100%;
    display: block;
    object-fit: contain;
    background: #fff;
  }
  .share-poster-qr-fallback {
    display: grid;
    place-items: center;
    color: #111;
    font-weight: 700;
    font-size: 12px;
  }
  @media (max-width: 560px) {
    .share-poster-modal {
      place-items: end center;
      padding:
        max(8px, env(safe-area-inset-top, 0px))
        0
        0
        0;
    }
    .share-poster-modal-panel {
      width: 100%;
      max-width: none;
      max-height: min(94dvh, 100%);
      border-radius: 18px 18px 0 0;
      padding:
        12px
        max(12px, env(safe-area-inset-right, 0px))
        max(12px, env(safe-area-inset-bottom, 0px))
        max(12px, env(safe-area-inset-left, 0px));
      gap: 10px;
      border-bottom: 0;
    }
    .share-poster-modal-head h2 {
      font-size: 15px;
    }
    .share-poster-modal-hint {
      font-size: 11.5px;
    }
    .share-poster-modal-stage {
      padding: 8px;
      border-radius: 12px;
    }
    .share-poster-modal-actions {
      display: grid;
      grid-template-columns: 1fr 1.35fr;
      gap: 8px;
    }
    .share-poster-modal-actions .ghost-btn,
    .share-poster-modal-actions .amber-btn {
      width: 100%;
      justify-content: center;
      min-height: 44px;
    }
    .share-poster {
      --share-poster-pad: 14px;
      --share-poster-pad-x: 14px;
      --share-poster-gap: 10px;
      --share-poster-section: 10px;
      --share-poster-qr: 92px;
      width: 100%;
      border-radius: 16px;
      box-shadow: none;
    }
    .share-poster-headline h2 {
      font-size: 18px;
    }
    .share-poster-price-value {
      font-size: 22px;
    }
    .share-poster-summary {
      padding: 10px;
    }
    .share-poster-summary-list {
      gap: 8px 10px;
    }
    .share-poster-summary-list li {
      font-size: 11.5px;
    }
  }
  @media (max-width: 380px) {
    .share-poster {
      --share-poster-pad: 12px;
      --share-poster-pad-x: 12px;
      --share-poster-gap: 8px;
      --share-poster-section: 8px;
      --share-poster-qr: 84px;
    }
    .share-poster-brand-mark {
      width: 22px;
      height: 22px;
      box-shadow: inset 0 0 0 6px #f0a202, 0 0 0 1px #5c4414;
    }
    .share-poster-brand strong {
      font-size: 14px;
    }
    .share-poster-headline h2 {
      font-size: 16px;
    }
    .share-poster-meta {
      gap: 8px;
    }
    .share-poster-modal-actions {
      grid-template-columns: 1fr;
    }
  }
  @media (max-height: 700px) and (max-width: 560px) {
    .share-poster-modal-panel {
      max-height: 100dvh;
      border-radius: 14px 14px 0 0;
    }
    .share-poster-modal-hint {
      display: none;
    }
    .share-poster-modal-stage {
      padding: 6px;
    }
  }

  .pdp-info {
    margin-top: clamp(36px, 5.5vw, 56px);
    display: flex;
    flex-direction: column;
    gap: 18px;
  }
  .pdp-info-title {
    margin: 0;
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--paper);
    line-height: 1.15;
  }
  .pdp-info-body {
    display: flex;
    flex-direction: column;
    border: 1px solid var(--line);
    border-radius: 16px;
    background: var(--bg-panel);
    overflow: hidden;
  }
  .pdp-info-block {
    padding: clamp(18px, 2.4vw, 26px) clamp(18px, 2.6vw, 28px);
  }
  .pdp-info-block + .pdp-specs-pair,
  .pdp-specs-pair + .pdp-info-block {
    border-top: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
  }
  .pdp-info-heading {
    margin: 0 0 12px;
    font-size: 12px;
    font-weight: 700;
    color: var(--paper-dim);
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }
  .pdp-specs-pair {
    display: grid;
    grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.85fr);
    gap: 0;
    align-items: stretch;
  }
  .pdp-specs-pair.is-specs-only { grid-template-columns: 1fr; }
  .pdp-specs-box,
  .pdp-dimension-box { min-width: 0; }
  .pdp-specs-pair:not(.is-specs-only) .pdp-dimension-box {
    border-left: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
  }
  .pdp-dimension-figure {
    appearance: none;
    border: 1px solid var(--line);
    border-radius: 12px;
    background-color: color-mix(in srgb, var(--bg-deep) 55%, var(--bg-panel));
    background-image:
      radial-gradient(
        ellipse at 50% 42%,
        color-mix(in srgb, var(--bg-panel) 92%, transparent) 0%,
        transparent 72%
      ),
      linear-gradient(
        color-mix(in srgb, var(--line) 70%, transparent) 1px,
        transparent 1px
      ),
      linear-gradient(
        90deg,
        color-mix(in srgb, var(--line) 70%, transparent) 1px,
        transparent 1px
      );
    background-size: auto, 18px 18px, 18px 18px;
    background-position: center, center, center;
    padding: 0;
    cursor: zoom-in;
    width: 100%;
    aspect-ratio: 1 / 1;
    display: block;
    position: relative;
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.25s ease, background-color 0.2s ease;
    line-height: 0;
  }
  html[data-theme="night"] .pdp-dimension-figure {
    /* Placa clara: desenhos t�cnicos (tra�o escuro) mant�m-se leg�veis de noite */
    background-color: #e8ecf2;
    background-image:
      radial-gradient(ellipse at 50% 40%, #f5f7fa 0%, transparent 70%),
      linear-gradient(rgba(30, 45, 70, 0.07) 1px, transparent 1px),
      linear-gradient(90deg, rgba(30, 45, 70, 0.07) 1px, transparent 1px);
    background-size: auto, 18px 18px, 18px 18px;
    border-color: rgba(160, 190, 230, 0.16);
  }
  .pdp-dimension-figure:hover {
    border-color: color-mix(in srgb, var(--amber) 50%, var(--line));
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08);
  }
  .pdp-dimension-figure img {
    position: absolute;
    inset: 6px;
    width: calc(100% - 12px);
    height: calc(100% - 12px);
    object-fit: contain;
    object-position: center;
    display: block;
  }
  @media (max-width: 820px) {
    .pdp-specs-pair { grid-template-columns: 1fr; }
    .pdp-specs-pair:not(.is-specs-only) .pdp-dimension-box {
      border-left: 0;
      border-top: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
    }
  }
  .pdp-desc {
    margin: 0;
    color: var(--paper);
    line-height: 1.75;
    font-size: 15px;
    max-width: 72ch;
  }
  .pdp-info-docs .pdp-info-heading { margin-bottom: 14px; }
  .pdp-doc-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
  }
  @keyframes pdp-fade {
    from { opacity: 0; transform: translateY(4px); }
    to { opacity: 1; transform: none; }
  }
  .sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
  }

  .pdp-lightbox {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: grid;
    place-items: center;
    place-content: center;
    gap: 12px;
    padding: 24px;
    background: var(--lightbox-bg);
    backdrop-filter: blur(10px);
  }
  .pdp-lightbox[hidden] { display: none; }
  .pdp-lightbox-body {
    width: min(1000px, 94vw);
    max-height: 82vh;
    border-radius: 16px;
    border: 1px solid var(--pdp-frame);
    box-shadow: var(--pdp-frame-shadow);
    background: var(--bg-deep);
    overflow: hidden;
    display: grid;
  }
  .pdp-lightbox-img { width: 100%; max-height: 82vh; object-fit: contain; display: block; }
  .pdp-lightbox-img[hidden],
  .pdp-lightbox-frame[hidden] { display: none; }
  .pdp-lightbox-frame {
    width: min(1000px, 94vw);
    height: min(82vh, 900px);
    border: 0;
    background: #fff;
  }
  .pdp-lightbox-open {
    color: var(--amber);
    font-size: 13px;
    font-weight: 600;
    text-decoration: none;
  }
  .pdp-lightbox-open:hover { text-decoration: underline; }
  .pdp-lightbox-close {
    position: absolute;
    top: 18px;
    right: 18px;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 1px solid var(--line);
    background: var(--bg-panel);
    color: var(--paper);
    font-size: 24px;
    line-height: 1;
    cursor: pointer;
  }
  body.lightbox-open { overflow: hidden; }

  .specs { display: grid; gap: 8px; margin-top: 8px; }
  .specs div {
    display: grid;
    grid-template-columns: minmax(120px, 0.85fr) 1.15fr;
    gap: 12px;
    padding: 11px 0;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
  }
  .specs div:last-child { border-bottom: 0; }
  .specs dt {
    color: var(--paper-dim);
    font-size: 12px;
    font-weight: 600;
  }
  .pdp-specs {
    gap: 0;
    margin: 0;
    display: grid;
    grid-template-columns: 1fr;
  }
  .pdp-specs-pair.is-specs-only .pdp-specs {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    column-gap: clamp(24px, 4vw, 48px);
  }
  .pdp-specs div {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
    padding: 10px 0;
    border-bottom: 1px solid color-mix(in srgb, var(--line) 82%, transparent);
  }
  .pdp-specs div:last-child { border-bottom: 0; }
  .pdp-specs-pair.is-specs-only .pdp-specs div:nth-last-child(2):nth-child(odd) {
    border-bottom: 0;
  }
  .pdp-specs dt {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 12.5px;
    font-weight: 550;
    color: var(--paper-dim);
    line-height: 1.4;
  }
  .pdp-specs dd {
    flex: 0 1 auto;
    margin: 0;
    max-width: 58%;
    font-size: 13.5px;
    line-height: 1.4;
    font-weight: 650;
    color: var(--paper);
    text-align: right;
    font-variant-numeric: tabular-nums;
  }
  @media (max-width: 720px) {
    .pdp-specs-pair.is-specs-only .pdp-specs {
      grid-template-columns: 1fr;
    }
    .pdp-specs-pair.is-specs-only .pdp-specs div:nth-last-child(2):nth-child(odd) {
      border-bottom: 1px solid color-mix(in srgb, var(--line) 82%, transparent);
    }
  }
  .panel {
    background: var(--bg-panel);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 16px;
  }

  @media (hover: none) {
    .pdp-photo:hover img { opacity: 1; transform: none; }
    .pdp-photo:hover .pdp-zoom-layer { opacity: 0; }
  }

  /* ---------- QUOTE ---------- */
  .quote-hero {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 6px;
  }
  .quote-hero-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
  }
  .quote-hero-top h1 {
    flex: 1 1 auto;
    min-width: 0;
    margin-bottom: 0;
  }
  .quote-hero > p {
    margin: 0;
  }
  .quote-clear-btn {
    appearance: none;
    flex: none;
    align-self: flex-start;
    border: 1px solid var(--line);
    background: var(--bg-panel);
    color: var(--paper-dim);
    border-radius: 999px;
    padding: 7px 12px;
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.02em;
    line-height: 1.2;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.18s ease, border-color 0.18s ease, background 0.18s ease;
  }
  .quote-clear-btn:hover {
    color: var(--paper);
    border-color: var(--line-active);
  }
  .quote-picker { margin-bottom: 18px; }
  .quote-picker-head {
    margin-bottom: 4px;
  }
  .quote-picker h2,
  .quote-layout h2,
  .quote-form-card h2 { font-size: 18px; margin-bottom: 4px; }
  .quote-picker-head .hint {
    margin: 0;
  }
  .quote-search { width: 100%; max-width: none; margin: 12px 0; height: 40px; padding: 0 14px; }
  .quote-hits { display: flex; flex-direction: column; }
  .quote-hit {
    display: grid; grid-template-columns: auto 52px minmax(0, 1fr) auto;
    gap: 12px; align-items: center;
    padding: 12px 0; border-bottom: 1px solid var(--line); cursor: pointer;
  }
  .quote-hit:last-child { border-bottom: 0; }
  .quote-hit .muted { display: block; }
  .quote-hit > span:nth-child(3) { min-width: 0; }
  .quote-thumb {
    width: 52px; height: 52px; border-radius: 50%; overflow: hidden;
    background: var(--bg-deep); border: 1.5px solid var(--line); display: block;
  }
  .quote-thumb img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .quote-hit:hover .quote-thumb img { transform: scale(1.18); }
  .quote-hit .sku-price {
    font-size: 13px;
    font-weight: 700;
    color: var(--amber);
    white-space: nowrap;
  }
  @media (max-width: 640px) {
    .quote-hero {
      gap: 8px;
      margin-bottom: 12px;
      padding-bottom: 12px;
    }
    .quote-hero-top {
      align-items: center;
      gap: 10px;
    }
    .quote-clear-btn {
      min-height: 34px;
      padding: 7px 12px;
      font-size: 11.5px;
    }
    .quote-picker {
      padding: 14px 14px 10px;
      margin-bottom: 14px;
    }
    .quote-picker h2 {
      font-size: 16px;
      margin-bottom: 2px;
    }
    .quote-picker-head .hint {
      font-size: 12px;
      line-height: 1.45;
    }
    .quote-search {
      height: 44px;
      margin: 12px 0 10px;
      padding: 0 12px;
      border-radius: 12px;
    }
    .quote-hit {
      grid-template-columns: auto 48px minmax(0, 1fr) auto;
      grid-template-areas:
        "check thumb body price"
        "check thumb body price";
      gap: 0 10px;
      align-items: center;
      padding: 11px 0;
    }
    .quote-hit > .pick,
    .quote-hit > input.pick {
      grid-area: check;
      align-self: center;
      width: 18px;
      height: 18px;
      margin: 0;
    }
    .quote-hit .quote-thumb {
      grid-area: thumb;
      width: 48px;
      height: 48px;
    }
    .quote-hit > span:nth-child(3) {
      grid-area: body;
      align-self: center;
      padding-right: 6px;
    }
    .quote-hit .sku-price {
      grid-area: price;
      align-self: center;
      justify-self: end;
      margin-top: 0;
      font-size: 12.5px;
    }
    .quote-hit strong {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      line-clamp: 2;
      overflow: hidden;
      font-size: 13px;
      line-height: 1.3;
    }
    .quote-hit .muted {
      font-size: 11px;
      margin-top: 2px;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
  }
  .quote-layout { display: grid; grid-template-columns: 1fr; gap: 16px; }
  @media (min-width: 900px) {
    .quote-layout {
      grid-template-columns: minmax(0, 1.15fr) minmax(280px, 0.85fr);
      gap: 20px;
      align-items: start;
    }
    .quote-form-card {
      position: sticky;
      top: 88px;
    }
  }

  .quote-products-card,
  .quote-form-card {
    padding: clamp(14px, 2.2vw, 22px);
    border-radius: var(--radius-md);
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.04) inset,
      0 14px 36px rgba(0, 0, 0, 0.18);
  }
  html[data-theme="day"] .quote-products-card,
  html[data-theme="day"] .quote-form-card {
    box-shadow:
      0 1px 0 rgba(255, 255, 255, 0.85) inset,
      0 12px 28px rgba(30, 45, 70, 0.08);
  }
  .quote-products-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
  }
  .quote-products-kicker {
    margin: 0 0 4px;
    font-size: 10px; font-weight: 700; letter-spacing: 0.16em;
    text-transform: uppercase; color: var(--amber);
  }
  .quote-products-head h2 {
    margin: 0; font-size: clamp(16px, 2vw, 20px);
    font-weight: 650; letter-spacing: -0.02em;
    line-height: 1.25;
  }
  .quote-products-count {
    flex: none;
    margin: 0;
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    padding: 6px 10px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg) 40%, var(--bg-panel));
    font-size: 11.5px;
    color: var(--paper-dim);
    white-space: nowrap;
  }
  .quote-products-count strong {
    font-size: 13px;
    font-weight: 700;
    color: var(--paper);
  }
  .quote-products-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin-bottom: 18px;
  }
  .quote-line {
    display: grid;
    grid-template-columns: 64px minmax(0, 1fr);
    grid-template-areas:
      "thumb info"
      "aside aside";
    gap: 10px 12px;
    align-items: start;
    margin: 0;
    padding: 12px;
    background: color-mix(in srgb, var(--bg) 45%, var(--bg-panel));
    border: 1px solid var(--line);
    border-radius: var(--radius);
  }
  .quote-line-thumb {
    grid-area: thumb;
    display: block;
    width: 64px;
    height: 64px;
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--bg-deep);
    border: 1px solid var(--line);
  }
  .quote-line-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .quote-line-thumb:hover img { transform: scale(1.06); }
  .quote-line-info {
    grid-area: info;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .quote-line-aside {
    grid-area: aside;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 12px;
  }
  .quote-line-title {
    color: inherit;
    text-decoration: none;
    min-width: 0;
  }
  .quote-line-title strong {
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
    font-size: 13.5px;
    line-height: 1.3;
    font-weight: 650;
  }
  .quote-line-title:hover strong { color: var(--amber); }
  .quote-line-sku {
    margin: 0;
    font-size: 11px;
    line-height: 1.35;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .quote-line-calc {
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 4px 6px;
    font-size: 12.5px;
  }
  .quote-line-calc strong {
    color: var(--amber);
    font-size: 13.5px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
  }
  .quote-line-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }
  .quote-line .qty {
    margin: 0;
  }
  .quote-line-remove {
    appearance: none;
    margin: 0;
    min-height: 36px;
    padding: 0 12px;
    border-radius: var(--radius-sm);
    border: 1px solid color-mix(in srgb, #e11d48 32%, var(--line));
    background: transparent;
    color: #e11d48;
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    cursor: pointer;
    transition: background 0.18s ease, border-color 0.18s ease;
  }
  .quote-line-remove:hover {
    background: color-mix(in srgb, #e11d48 8%, transparent);
    border-color: color-mix(in srgb, #e11d48 55%, var(--line));
  }
  .quote-line-sim {
    font-size: 12.5px;
    font-weight: 700;
    color: var(--amber);
  }
  .quote-line-sim::before {
    content: "\2192\00a0";
    color: var(--paper-dim);
    font-weight: 500;
  }
  .quote-line-sim[hidden] { display: none; }
  .quote-liq-tag {
    display: inline;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--amber);
  }
  .quote-liq-note {
    margin: 4px 0 0;
    font-size: 11.5px;
    line-height: 1.4;
  }
  .quote-liq-list {
    font-size: 12px;
    color: var(--paper-dim);
    text-decoration: line-through;
    text-decoration-thickness: 1px;
  }
  .quote-line.is-liquidacao,
  .quote-line.is-promocao {
    border-color: color-mix(in srgb, var(--line) 55%, var(--amber) 45%);
    background:
      linear-gradient(135deg,
        color-mix(in srgb, var(--bg-panel) 92%, var(--amber) 8%),
        var(--bg-panel));
  }
  .quote-line.is-liquidacao .quote-line-sim,
  .quote-line.is-promocao .quote-line-sim { display: none; }
  .quote-line.is-promocao .quote-liq-tag {
    color: #e11d48;
  }

  @media (max-width: 719px) {
    .quote-products-card {
      padding: 14px 12px 12px;
    }
    .quote-products-head {
      margin-bottom: 12px;
      padding-bottom: 10px;
      align-items: center;
    }
    .quote-products-head h2 {
      font-size: 15px;
    }
    .quote-products-count {
      padding: 5px 9px;
      font-size: 11px;
    }
    .quote-products-list {
      gap: 8px;
      margin-bottom: 12px;
    }
    .quote-line {
      position: relative;
      grid-template-columns: 52px minmax(0, 1fr);
      grid-template-areas:
        "thumb info"
        "aside aside";
      gap: 8px 12px;
      padding: 12px 36px 12px 12px;
    }
    .quote-line-thumb {
      width: 52px;
      height: 52px;
      border-radius: 10px;
    }
    .quote-line-info {
      gap: 2px;
      padding-right: 2px;
    }
    .quote-line-title strong {
      font-size: 13px;
      line-height: 1.25;
    }
    .quote-line-sku {
      font-size: 10.5px;
    }
    .quote-line-aside {
      display: flex;
      flex-wrap: nowrap;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin-top: 2px;
      padding-top: 10px;
      border-top: 1px solid var(--line);
    }
    .quote-line-calc {
      flex: 1 1 auto;
      min-width: 0;
      font-size: 11.5px;
      gap: 3px 4px;
    }
    .quote-line-calc strong {
      font-size: 14px;
    }
    .quote-line-actions {
      flex: none;
      gap: 0;
    }
    .quote-line .qty {
      gap: 6px;
    }
    .quote-line .qty input {
      width: 44px;
      height: 34px;
      font-size: 13px;
      font-weight: 650;
    }
    .quote-line .icon-btn {
      width: 34px;
      height: 34px;
    }
    .quote-line-remove {
      position: absolute;
      top: 8px;
      right: 6px;
      z-index: 1;
      width: 32px;
      min-height: 32px;
      padding: 0;
      border: 0;
      border-radius: 999px;
      background: transparent;
      color: var(--paper-dim);
      font-size: 0;
      line-height: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    .quote-line-remove::before {
      content: "\00d7";
      font-size: 22px;
      line-height: 1;
      font-weight: 400;
    }
    .quote-line-remove:hover {
      color: #e11d48;
      background: color-mix(in srgb, #e11d48 8%, transparent);
      border-color: transparent;
    }
    .quote-liq-note {
      font-size: 11px;
      margin-top: 4px;
    }
  }

  @media (min-width: 720px) {
    .quote-line {
      grid-template-columns: 80px minmax(0, 1fr) auto;
      grid-template-areas: "thumb info aside";
      gap: 16px;
      padding: 14px 16px;
      align-items: center;
    }
    .quote-line-thumb {
      width: 80px;
      height: 80px;
    }
    .quote-line-title strong {
      font-size: 15px;
    }
    .quote-line-sku {
      font-size: 12px;
    }
    .quote-line-aside {
      flex-direction: column;
      align-items: flex-end;
      justify-content: center;
      gap: 10px;
      min-width: 200px;
    }
    .quote-line-calc {
      justify-content: flex-end;
      font-size: 13.5px;
      text-align: right;
    }
    .quote-line-calc strong {
      font-size: 16px;
    }
    .quote-line-actions {
      justify-content: flex-end;
      gap: 10px;
    }
    .quote-line-remove {
      min-width: 96px;
    }
  }

  .quote-sim {
    margin-top: 4px; padding-top: 16px;
    border-top: 1px solid var(--line);
    display: flex; flex-direction: column; gap: 14px;
  }
  .quote-sim-intro { min-width: 0; }
  .quote-sim-title {
    margin: 0 0 4px;
    font-size: 15px; font-weight: 650; letter-spacing: -0.015em;
  }
  .quote-sim-sub {
    margin: 0; font-size: 12.5px; line-height: 1.5; color: var(--paper-dim);
    max-width: 52ch;
  }
  .quote-sim-aviso {
    display: flex; gap: 12px; align-items: flex-start;
    margin: 0; padding: 12px 14px;
    border-radius: var(--radius);
    border: 1px solid color-mix(in srgb, var(--amber) 28%, var(--line));
    background: color-mix(in srgb, var(--amber) 8%, var(--bg-panel));
    color: var(--paper-dim);
    font-size: 12.5px; line-height: 1.55;
    width: 100%;
    box-sizing: border-box;
  }
  @media (min-width: 900px) {
    .quote-sim-aviso {
      padding: 13px 16px;
      font-size: 13px;
      line-height: 1.6;
      max-width: none;
    }
  }
  html[data-theme="day"] .quote-sim-aviso {
    background: color-mix(in srgb, var(--amber) 9%, #ffffff);
    border-color: color-mix(in srgb, var(--amber) 30%, rgba(30, 45, 70, 0.12));
    color: #4a5566;
  }
  .quote-sim-aviso-icon {
    flex: none; width: 20px; height: 20px; margin-top: 1px;
    border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 800; font-style: italic;
    color: var(--amber-ink);
    background: var(--amber);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--amber) 18%, transparent);
  }
  .quote-sim-controls {
    display: flex; flex-wrap: wrap; gap: 8px;
  }
  .quote-sim-chip {
    min-height: 36px; padding: 0 14px;
    border-radius: 999px; cursor: pointer;
    border: 1px solid var(--line);
    background: var(--bg-chip); color: var(--paper);
    font: inherit; font-size: 12.5px; font-weight: 700;
    transition: var(--transition);
  }
  .quote-sim-chip:hover {
    border-color: var(--line-active);
    transform: translateY(-1px);
  }
  .quote-sim-chip.is-active {
    color: var(--amber);
    border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
    background: color-mix(in srgb, var(--amber) 12%, var(--bg-panel));
    box-shadow: var(--glow-soft);
  }
  .quote-sim-custom-label {
    display: block; margin-bottom: 6px;
    font-size: 11px; font-weight: 700; letter-spacing: 0.08em;
    text-transform: uppercase; color: var(--paper-dim);
  }
  .quote-sim-custom-row {
    display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  }
  .quote-sim-custom-row input {
    width: 88px; flex: none; text-align: center;
  }
  .quote-sim-prefix,
  .quote-sim-suffix {
    font-size: 13px; font-weight: 700; color: var(--paper-dim);
  }
  .quote-sim-totals {
    display: flex; flex-direction: column; gap: 8px;
    padding: 12px 14px;
    border-radius: var(--radius);
    background: color-mix(in srgb, var(--bg) 40%, var(--bg-panel));
    border: 1px solid var(--line);
  }
  .quote-sim-total-row {
    display: flex; justify-content: space-between; align-items: baseline;
    gap: 12px; flex-wrap: wrap;
    font-size: 13.5px; color: var(--paper-dim);
  }
  .quote-sim-total-row .grand {
    color: var(--paper); font-size: clamp(18px, 2.4vw, 22px);
  }
  .quote-sim-tax-block {
    display: flex; flex-direction: column; gap: 8px;
    padding-top: 8px; border-top: 1px dashed var(--line);
  }
  .quote-sim-tax-block[hidden] { display: none; }
  @media (min-width: 640px) {
    .quote-sim-tax-block {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px 16px;
    }
    .quote-sim-tax-block[hidden] { display: none; }
    .quote-sim-total-row--sim,
    .quote-sim-total-row--iva {
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
      padding: 10px 12px;
      border-radius: var(--radius-sm);
      background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
      border: 1px solid var(--line);
    }
  }
  .quote-sim-total-row--sim em,
  .quote-sim-total-row--iva em {
    font-style: normal; color: var(--amber); font-weight: 700;
  }
  .quote-sim-grand { color: var(--amber) !important; }
  .quote-sim-iva { color: var(--cool) !important; }
  .quote-sim-custom-row .ghost-btn:disabled {
    opacity: 0.45; cursor: not-allowed; transform: none;
  }

  .qty { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-top: 8px; }
  .qty input {
    width: 72px; height: 36px; padding: 0 8px; text-align: center; appearance: textfield;
  }
  .qty input::-webkit-outer-spin-button,
  .qty input::-webkit-inner-spin-button { appearance: none; margin: 0; }
  .icon-btn {
    width: 36px; height: 36px; padding: 0; border-radius: var(--radius-sm);
    border: 1px solid var(--line); background: var(--bg-input); color: var(--paper);
    text-align: center; cursor: pointer; font-weight: 700;
  }
  .grand { font-size: 22px; }
  .stack { display: flex; flex-direction: column; gap: 12px; }
  .hint { color: var(--paper-dim); font-size: 13px; }
  .empty { padding: 28px 16px; text-align: center; color: var(--paper-dim); }
  .empty-cta {
    display: grid;
    gap: 10px;
    justify-items: center;
    padding: 32px 20px;
  }
  .empty-cta-title {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--paper);
  }
  .empty-cta > p {
    margin: 0;
    max-width: 42ch;
    line-height: 1.5;
  }
  .empty-cta-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px;
    margin-top: 6px;
  }
  .back-to-top {
    position: fixed;
    right: max(14px, env(safe-area-inset-right, 0px));
    bottom: max(18px, env(safe-area-inset-bottom, 0px));
    z-index: 90;
    width: 44px;
    height: 44px;
    border-radius: 999px;
    border: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-panel) 92%, transparent);
    color: var(--paper);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
    cursor: pointer;
    font-size: 18px;
    line-height: 1;
    transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease;
  }
  .back-to-top[hidden] {
    display: none !important;
  }
  .back-to-top:hover {
    background: var(--bg-panel);
    border-color: color-mix(in srgb, var(--amber) 45%, var(--line));
    color: var(--amber);
  }
  @media (prefers-reduced-motion: reduce) {
    .back-to-top { transition: none; }
  }
  .quote-success-shell { max-width: 40rem; }
  .quote-success {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 28px 24px;
  }
  .quote-success-kicker {
    margin: 0;
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--amber);
  }
  .quote-success h1 {
    margin: 0;
    font-size: clamp(26px, 4vw, 36px);
    letter-spacing: -0.03em;
    line-height: 1.15;
  }
  .quote-success-lead {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
    color: var(--paper-dim);
  }
  .quote-success-meta {
    margin: 0;
    font-size: 13px;
  }
  .quote-success-lines {
    list-style: none;
    margin: 4px 0 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
    border-top: 1px solid var(--line);
    padding-top: 14px;
  }
  .quote-success-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 2px 12px;
    align-items: baseline;
  }
  .quote-success-line-name {
    grid-column: 1;
    font-weight: 650;
  }
  .quote-success-line .muted {
    grid-column: 1;
    font-size: 12px;
  }
  .quote-success-line strong {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    font-variant-numeric: tabular-nums;
  }
  .quote-success-specs {
    margin: 0;
    padding-top: 4px;
    border-top: 1px solid var(--line);
  }
  .quote-success-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-top: 6px;
  }

  .select-bar {
    position: sticky; bottom: 12px; z-index: 40;
    display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap;
    align-items: center; margin: 12px 0; padding: 12px 14px; border-radius: var(--radius);
    background: var(--bg-toast); border: 1px solid var(--line-active);
    backdrop-filter: blur(12px); box-shadow: 0 8px 28px rgba(0, 0, 0, 0.25);
  }
  .select-bar[hidden] { display: none; }
  .select-bar-count {
    margin: 0;
    font-size: 13px;
  }
  @media (max-width: 640px) {
    .select-bar {
      bottom: calc(10px + env(safe-area-inset-bottom, 0px));
      display: grid;
      grid-template-columns: 1fr;
      gap: 10px;
      margin: 10px 0 8px;
      padding: 12px;
      border-radius: 14px;
    }
    .select-bar-count {
      font-size: 12.5px;
    }
    .select-bar-actions {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 8px;
      width: 100%;
      margin: 0;
    }
    .select-bar-actions .amber-btn {
      width: 100%;
      min-height: 42px;
      justify-content: center;
    }
    .select-bar-actions .ghost-btn {
      min-height: 42px;
      min-width: 84px;
      padding-inline: 12px;
    }
  }

  /* ---------- FORMS (site + base) ---------- */
  form label, .form label {
    display: flex; flex-direction: column; gap: 6px; font-size: 13px; font-weight: 600;
  }
  input, select, textarea {
    width: 100%; background: var(--bg-input); color: var(--paper);
    border: 1px solid var(--line); border-radius: var(--radius-sm);
    padding: 10px 12px; font: inherit; font-size: 14px;
  }
  textarea { min-height: 90px; resize: vertical; }
  input:focus, select:focus, textarea:focus {
    outline: none; border-color: var(--amber);
    box-shadow: 0 0 0 3px rgba(255, 180, 84, 0.15);
  }
  .check { flex-direction: row; align-items: center; font-weight: 500; }
  .check input { width: auto; }
  .form-grid { display: grid; grid-template-columns: 1fr; gap: 12px; }
  @media (min-width: 800px) {
    .form-grid { grid-template-columns: 1fr 1fr; }
    .form-grid .full { grid-column: 1 / -1; }
  }

  /* ---------- ADMIN (SaaS panel) ---------- */
  .admin {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    min-height: 100vh;
    width: 100%;
    max-width: 100%;
    overflow-x: clip;
  }
  @media (min-width: 960px) {
    .admin { grid-template-columns: 260px minmax(0, 1fr); }
  }
  .admin-nav,
  .admin-main {
    min-width: 0;
    max-width: 100%;
  }
  .admin-nav {
    padding: 22px 18px;
    border-bottom: 1px solid var(--line);
    background: var(--bg-admin);
    overflow-x: clip;
  }
  .admin-brand-row {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 4px;
  }
  .admin-brand-row .brand { flex: 1; min-width: 0; text-decoration: none; color: var(--admin-ink); }
  .brand-text { display: flex; flex-direction: column; gap: 2px; }
  .brand-text strong { font-size: 19px; font-weight: 700; letter-spacing: -0.03em; color: var(--admin-ink); }
  .brand-text small {
    font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase;
    color: var(--admin-ink-muted); font-weight: 700;
  }
  @media (min-width: 960px) {
    .admin-nav {
      border-bottom: 0; border-right: 1px solid var(--line);
      position: sticky; top: 0; height: 100vh; overflow: auto;
      overflow-x: hidden;
    }
  }
  .admin-links { display: flex; flex-direction: column; gap: 4px; margin: 16px 0; }
  @media (max-width: 959px) {
    .admin-nav {
      padding: 14px 12px 12px;
    }
    .admin-session-user {
      margin: 2px 0 10px;
      padding: 6px 8px;
    }
    .admin-kicker {
      margin: 0 0 4px;
    }
    .admin-links {
      flex-direction: row;
      flex-wrap: nowrap;
      gap: 6px;
      margin: 8px 0 10px;
      padding: 2px 2px 6px;
      max-width: 100%;
      overflow-x: auto;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      overscroll-behavior-x: contain;
    }
    .admin-links::-webkit-scrollbar { display: none; }
    .admin .nav-link,
    .nav-logout {
      flex: 0 0 auto;
      padding: 8px 12px;
      border: 1px solid var(--line);
      border-radius: 999px;
      background: color-mix(in srgb, var(--bg-panel) 80%, transparent);
      font-size: 12.5px;
    }
    .admin .nav-link.is-active {
      border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
      background: color-mix(in srgb, var(--amber) 14%, transparent);
      color: var(--admin-ink);
    }
    .admin-tools {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 6px;
      width: 100%;
      max-width: 100%;
    }
    .admin-tools .button,
    .admin-tools .button-ghost {
      width: 100%;
      min-height: 36px;
      padding: 8px 10px;
      font-size: 12px;
      border-radius: 10px;
      white-space: nowrap;
    }
    .admin-tools-hint {
      grid-column: 1 / -1;
      margin: 2px 0 0;
      font-size: 11px;
      line-height: 1.35;
    }
    .admin-main {
      padding: 16px 12px 48px;
    }
    .admin-head {
      margin-bottom: 14px;
      gap: 10px;
    }
    .admin-head-actions,
    .products-xlsx-actions {
      width: 100%;
      justify-content: stretch;
    }
    .admin-head-actions > .button,
    .admin-head-actions > .button-ghost,
    .admin-head-actions > a.button,
    .products-xlsx-actions > .button,
    .products-xlsx-actions > .button-ghost,
    .products-xlsx-actions > a.button {
      flex: 1 1 calc(50% - 6px);
      min-width: 0;
      justify-content: center;
      text-align: center;
      white-space: nowrap;
    }
    .products-admin-filters {
      flex-wrap: nowrap;
      max-width: 100%;
      overflow-x: auto;
      padding-bottom: 2px;
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
    }
    .products-admin-filters::-webkit-scrollbar { display: none; }
    .products-admin-filter {
      flex: 0 0 auto;
    }
    .admin-list-toolbar,
    .products-admin-toolbar {
      gap: 10px;
    }
    .admin-list-search,
    .products-admin-search {
      flex: 1 1 100%;
      max-width: none;
    }
  }
  .admin .nav-link, .nav-logout {
    color: var(--admin-ink-muted); text-decoration: none; padding: 9px 11px;
    border-radius: var(--radius-sm); background: none; border: 0;
    font: inherit; font-size: 13.5px; font-weight: 600; text-align: left; cursor: pointer; white-space: nowrap;
  }
  .admin .nav-link.is-active, .admin .nav-link:hover, .nav-logout:hover {
    background: var(--bg-panel-hover); color: var(--admin-ink);
  }
  .admin-kicker, .admin .eyebrow {
    font-size: 11px; letter-spacing: 0.16em; text-transform: uppercase;
    color: var(--amber); font-weight: 700; margin: 0 0 6px;
  }
  .admin-session-user {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 2px 0 14px;
    padding: 8px 10px;
    border-radius: 12px;
    background: color-mix(in srgb, var(--bg-panel) 88%, transparent);
    border: 1px solid var(--line);
    color: var(--admin-ink);
    min-width: 0;
  }
  .admin-session-avatar {
    flex: none;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
    font-weight: 750;
    letter-spacing: -0.02em;
    color: #1a140c;
    background: var(--amber);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--amber) 35%, transparent);
  }
  html[data-theme="day"] .admin-session-avatar {
    color: #fff;
  }
  .admin-session-copy {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
  }
  .admin-session-name {
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.015em;
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .admin-session-handle {
    font-size: 11px;
    font-weight: 500;
    color: var(--admin-ink-muted, var(--paper-dim));
    line-height: 1.25;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .admin-perm-board {
    display: flex;
    flex-direction: column;
    gap: 10px;
    margin: 4px 0 2px;
  }
  .admin-perm-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px 14px;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: color-mix(in srgb, var(--bg-panel) 88%, var(--amber) 4%);
  }
  .admin-perm-summary {
    flex: 1 1 220px;
    margin: 0;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.4;
    color: var(--admin-ink);
  }
  .admin-perm-toolbar-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .admin-perm-group {
    margin: 0;
    padding: 10px 12px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg-panel);
  }
  .admin-perm-group-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin: 0 0 8px;
  }
  .admin-perm-group-toggle {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    cursor: pointer;
    user-select: none;
  }
  .admin-perm-group-toggle input {
    width: 15px;
    height: 15px;
    margin: 0;
    accent-color: var(--amber);
    flex-shrink: 0;
  }
  .admin-perm-group-title {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .admin-perm-group-meta {
    font-size: 11px;
    letter-spacing: 0.04em;
  }
  .admin-perm-grid {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
  .admin-perm-chip {
    display: block;
    margin: 0;
    cursor: pointer;
    user-select: none;
  }
  .admin-perm-chip input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
  }
  .admin-perm-chip-ui {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    min-height: 34px;
    padding: 6px 11px 6px 8px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 70%, transparent);
    color: var(--admin-ink);
    font-size: 12.5px;
    font-weight: 600;
    line-height: 1.2;
    transition: border-color 0.15s ease, background-color 0.15s ease, color 0.15s ease;
  }
  .admin-perm-chip:hover .admin-perm-chip-ui {
    border-color: color-mix(in srgb, var(--amber) 35%, var(--line));
    background: color-mix(in srgb, var(--amber) 6%, transparent);
  }
  .admin-perm-chip-mark {
    width: 16px;
    height: 16px;
    border-radius: 50%;
    border: 1.5px solid color-mix(in srgb, var(--paper-dim) 55%, var(--line));
    background: transparent;
    flex-shrink: 0;
    position: relative;
    transition: border-color 0.15s ease, background-color 0.15s ease;
  }
  .admin-perm-chip-mark::after {
    content: "";
    position: absolute;
    left: 4.5px;
    top: 2px;
    width: 4px;
    height: 7px;
    border-right: 1.5px solid transparent;
    border-bottom: 1.5px solid transparent;
    transform: rotate(40deg);
    transition: border-color 0.15s ease;
  }
  .admin-perm-chip input:checked + .admin-perm-chip-ui {
    border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
    background: color-mix(in srgb, var(--amber) 14%, transparent);
    color: var(--admin-ink);
  }
  .admin-perm-chip input:checked + .admin-perm-chip-ui .admin-perm-chip-mark {
    border-color: var(--amber);
    background: var(--amber);
  }
  .admin-perm-chip input:checked + .admin-perm-chip-ui .admin-perm-chip-mark::after {
    border-right-color: #1a140c;
    border-bottom-color: #1a140c;
  }
  html[data-theme="day"] .admin-perm-chip input:checked + .admin-perm-chip-ui .admin-perm-chip-mark::after {
    border-right-color: #fff;
    border-bottom-color: #fff;
  }
  .admin-perm-chip input:focus-visible + .admin-perm-chip-ui {
    outline: 2px solid var(--amber);
    outline-offset: 2px;
  }
  .admin-perm-chip-label {
    white-space: nowrap;
  }

  /* Categorias list */
  .categorias-list-wrap {
    overflow-x: auto;
  }
  .categorias-list-table {
    min-width: 720px;
  }
  .categorias-list-table th:last-child,
  .categorias-list-table td.categorias-list-actions {
    width: 1%;
    white-space: nowrap;
    text-align: right;
    vertical-align: middle;
  }
  .categorias-list-cat-main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    min-width: 0;
  }
  .categorias-list-thumb {
    width: 44px;
    height: 44px;
    border-radius: 10px;
    object-fit: cover;
    border: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-deep, var(--bg)) 40%, var(--bg-panel));
    flex-shrink: 0;
  }
  .categorias-list-thumb.is-empty {
    display: inline-block;
    background:
      linear-gradient(135deg,
        color-mix(in srgb, var(--line) 55%, transparent),
        color-mix(in srgb, var(--bg-panel) 80%, transparent));
  }
  .categorias-list-cat-copy {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
  }
  .categorias-list-cat-copy strong {
    font-size: 14px;
    line-height: 1.3;
  }
  .categorias-list-desc {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 12.5px;
    line-height: 1.35;
  }
  .categorias-list-key {
    font-size: 12px;
  }
  .categorias-list-subs-text {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 12.5px;
    line-height: 1.35;
    color: var(--admin-ink-muted);
  }
  .categorias-list-count {
    font-variant-numeric: tabular-nums;
  }
  .categorias-list-table td.categorias-list-actions .row-actions {
    display: inline-flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    width: max-content;
    min-width: 0;
    margin-left: auto;
  }
  .categorias-list-table td.categorias-list-actions .row-actions > a.button-ghost,
  .categorias-list-table td.categorias-list-actions .row-actions > button.button-danger {
    flex: 0 0 auto;
    margin: 0;
    min-height: 32px;
    min-width: 4.75rem;
    padding: 6px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.01em;
    line-height: 1.2;
    transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease;
  }
  .categorias-list-table td.categorias-list-actions .row-actions > a.button-ghost {
    background: color-mix(in srgb, var(--bg-deep) 55%, var(--bg-panel));
    border-color: var(--line);
    color: var(--paper);
  }
  .categorias-list-table td.categorias-list-actions .row-actions > a.button-ghost:hover {
    background: var(--bg-panel-hover);
    border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
    color: var(--paper);
  }
  .categorias-list-table td.categorias-list-actions .row-actions > button.button-danger {
    background: color-mix(in srgb, var(--danger) 8%, var(--bg-panel));
    border-color: color-mix(in srgb, var(--danger) 32%, var(--line));
    color: var(--danger);
  }
  .categorias-list-table td.categorias-list-actions .row-actions > button.button-danger:hover {
    background: color-mix(in srgb, var(--danger) 16%, var(--bg-panel));
    border-color: color-mix(in srgb, var(--danger) 55%, var(--line));
  }
  html[data-theme="night"] .categorias-list-table td.categorias-list-actions .row-actions > a.button-ghost {
    background: color-mix(in srgb, var(--bg-panel-hover) 70%, transparent);
  }
  html[data-theme="night"] .categorias-list-table td.categorias-list-actions .row-actions > button.button-danger {
    background: color-mix(in srgb, var(--danger) 12%, transparent);
  }
  html[data-theme="day"] .categorias-list-table td.categorias-list-actions .row-actions > a.button-ghost {
    background: color-mix(in srgb, var(--admin-ink) 4%, #fff);
    color: var(--admin-ink);
  }
  html[data-theme="day"] .categorias-list-table td.categorias-list-actions .row-actions > a.button-ghost:hover {
    background: color-mix(in srgb, var(--amber) 12%, #fff);
    color: var(--admin-ink);
  }

  .audit-log-panel {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 16px 16px;
  }
  .audit-log-meta {
    margin: 0;
    font-size: 13px;
  }
  .audit-log-table {
    min-width: 760px;
  }
  .audit-log-when {
    white-space: nowrap;
    font-size: 12px;
  }
  .audit-log-detail {
    max-width: 28rem;
    font-size: 13px;
    line-height: 1.4;
    word-break: break-word;
  }

  .admin-active-toggle {
    display: block;
    margin: 12px 0 0;
    cursor: pointer;
    user-select: none;
  }
  .admin-active-toggle input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
  }
  .admin-active-toggle-ui {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg-panel);
    transition: border-color 0.15s ease, background-color 0.15s ease;
  }
  .admin-active-toggle:hover .admin-active-toggle-ui {
    border-color: color-mix(in srgb, var(--amber) 30%, var(--line));
  }
  .admin-active-toggle input:checked + .admin-active-toggle-ui {
    border-color: color-mix(in srgb, var(--amber) 45%, var(--line));
    background: color-mix(in srgb, var(--amber) 8%, var(--bg-panel));
  }
  .admin-active-toggle input:focus-visible + .admin-active-toggle-ui {
    outline: 2px solid var(--amber);
    outline-offset: 2px;
  }
  .admin-active-toggle-track {
    position: relative;
    flex: none;
    width: 40px;
    height: 24px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--paper-dim) 28%, var(--bg-deep, #1a140c));
    transition: background-color 0.18s ease;
  }
  .admin-active-toggle-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25);
    transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .admin-active-toggle input:checked + .admin-active-toggle-ui .admin-active-toggle-track {
    background: var(--amber);
  }
  .admin-active-toggle input:checked + .admin-active-toggle-ui .admin-active-toggle-thumb {
    transform: translateX(16px);
  }
  .admin-active-toggle-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  .admin-active-toggle-title {
    font-size: 13.5px;
    font-weight: 650;
    color: var(--admin-ink);
    line-height: 1.25;
  }
  .admin-active-toggle-hint {
    font-size: 12px;
    font-weight: 500;
    color: var(--admin-ink-muted, var(--paper-dim));
    line-height: 1.35;
  }
  .hero-eyebrow {
    font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
    color: var(--amber); font-weight: 700;
  }
  .admin-main { padding: 22px 16px 56px; }
  @media (min-width: 800px) { .admin-main { padding: 36px 32px 72px; } }

  /* Title hierarchy ? stay inside containers */
  .admin-main,
  .admin-card,
  .pages-panel,
  .pages-form-head,
  .pages-form-copy {
    min-width: 0;
  }
  .admin-head {
    display: flex; justify-content: space-between; gap: 14px;
    align-items: flex-start; flex-wrap: wrap; margin-bottom: 22px;
  }
  .admin-head > div:first-child {
    flex: 1 1 220px;
    min-width: 0;
  }
  .admin-head-actions,
  .products-xlsx-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
  }
  .products-xlsx-actions > a.products-lixeira-btn {
    color: color-mix(in srgb, var(--danger) 88%, var(--admin-ink));
    border-color: color-mix(in srgb, var(--danger) 42%, var(--line));
    background: color-mix(in srgb, var(--danger) 12%, transparent);
  }
  .products-xlsx-actions > a.products-lixeira-btn:hover {
    color: color-mix(in srgb, var(--danger) 95%, #fff);
    border-color: color-mix(in srgb, var(--danger) 62%, var(--line));
    background: color-mix(in srgb, var(--danger) 20%, transparent);
  }
  .products-xlsx-actions > a.products-lixeira-btn.is-active {
    color: color-mix(in srgb, var(--danger) 70%, #fff 30%);
    border-color: color-mix(in srgb, var(--danger) 70%, transparent);
    background: color-mix(in srgb, var(--danger) 22%, transparent);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--danger) 28%, transparent);
  }
  html[data-theme="day"] .products-xlsx-actions > a.products-lixeira-btn {
    color: color-mix(in srgb, var(--danger) 92%, #1a1210);
    background: color-mix(in srgb, var(--danger) 8%, #fff);
  }
  html[data-theme="day"] .products-xlsx-actions > a.products-lixeira-btn:hover,
  html[data-theme="day"] .products-xlsx-actions > a.products-lixeira-btn.is-active {
    color: var(--danger);
    background: color-mix(in srgb, var(--danger) 14%, #fff);
    border-color: color-mix(in srgb, var(--danger) 55%, var(--line));
  }
  .products-xlsx-preview {
    margin: 0 0 18px;
    padding: 16px 18px;
  }
  .products-xlsx-preview-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px 16px;
    margin-bottom: 8px;
  }
  .products-xlsx-preview-head h2 {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--admin-ink);
  }
  .products-xlsx-preview-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .admin-head h1,
  .gate-card h1 {
    margin: 0;
    font-size: clamp(24px, 3vw, 32px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.2;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
  }
  .admin-head .hint,
  .admin-head > div > p:not(.eyebrow):not(.admin-kicker) {
    margin: 6px 0 0;
    font-size: 14px;
    font-weight: 500;
    color: var(--admin-ink-muted);
    max-width: 56ch;
  }
  .pages-form-head h2,
  .admin .pages-form-head h2,
  .admin-card > h2,
  .lista-admin-copy h2 {
    margin: 0;
    font-size: clamp(17px, 1.8vw, 20px);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.3;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .home-faixas-admin {
    --home-faixas-jump-top: 10px;
    --home-faixas-stack-gap: 14px;
    display: flex;
    flex-direction: column;
    gap: 18px;
  }
  .editorial-slides-admin {
    gap: 14px;
  }
  .editorial-slide-card {
    padding: 14px 16px;
    border: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
    border-radius: 12px;
    background: color-mix(in srgb, var(--panel, var(--bg)) 92%, var(--line));
  }
  html[data-theme="day"] .editorial-slide-card {
    background: color-mix(in srgb, #fff 88%, var(--line));
  }
  .editorial-slide-card-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
  }
  .editorial-slide-card-head strong {
    font-size: 13px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--muted, #888);
  }
  @media (min-width: 1400px) {
    .home-faixas-admin {
      --home-faixas-jump-top: 12px;
      --home-faixas-stack-gap: 18px;
    }
  }
  .home-faixas-intro.admin-card {
    padding: clamp(14px, 1.8vw, 20px);
  }
  .pages-form-head.home-faixas-intro-head {
    display: block;
    align-items: unset;
    justify-content: unset;
    flex-wrap: unset;
    gap: 0;
    margin: 0;
    padding: 0;
    border: 0;
    border-bottom: 0;
    background: transparent;
    box-shadow: none;
  }
  .pages-form-head.home-faixas-intro-head > div:first-child {
    flex: none;
    max-width: none;
  }
  .pages-form-head.home-faixas-intro-head h2 {
    margin: 0;
    font-size: clamp(20px, 2.4vw, 26px);
    letter-spacing: -0.03em;
  }
  .pages-form-head.home-faixas-intro-head .hint {
    margin: 8px 0 0;
    max-width: 62ch;
    font-size: 14px;
  }
  .home-faixas-jump {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    position: sticky;
    top: var(--home-faixas-jump-top);
    z-index: 10;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl);
    background: color-mix(in srgb, var(--bg-panel) 94%, transparent);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.1);
  }
  html[data-theme="day"] .home-faixas-jump {
    background: color-mix(in srgb, var(--bg-panel) 97%, transparent);
    box-shadow: 0 3px 12px rgba(15, 23, 42, 0.06);
  }
  .home-faixas-jump .button-small {
    min-height: 32px;
  }
  .home-faixa-tag {
    display: inline-block;
    margin-right: 8px;
    padding: 2px 8px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--amber) 45%, var(--line));
    background: color-mix(in srgb, var(--amber) 14%, transparent);
    color: var(--amber);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    vertical-align: middle;
  }
  /* Faixas: accordion + title/Guardar stick under jump when expanded */
  .home-faixas-admin > form.home-faixa-card {
    scroll-margin-top: calc(
      var(--home-faixas-jump-top) + var(--home-faixas-jump-h, 56px) + var(--home-faixas-stack-gap) + 8px
    );
  }
  .home-faixas-admin > form.home-faixa-card.is-collapsed > :not(.pages-form-head) {
    display: none !important;
  }
  .home-faixas-admin > form.home-faixa-card.is-collapsed .pages-save-bar {
    display: none;
  }
  .home-faixas-admin > form.home-faixa-card > .pages-form-head,
  .admin .home-faixas-admin > form.admin-card.home-faixa-card > .pages-form-head {
    position: sticky;
    top: calc(
      var(--home-faixas-jump-top) + var(--home-faixas-jump-h, 56px) + var(--home-faixas-stack-gap)
    );
    z-index: 9;
    align-self: flex-start;
    width: 100%;
    box-sizing: border-box;
    overflow: visible;
    gap: 12px;
    background: var(--bg-panel);
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);
  }
  .home-faixas-admin > form.home-faixa-card.is-collapsed > .pages-form-head {
    position: relative;
    top: auto;
    box-shadow: none;
    cursor: pointer;
  }
  html[data-theme="day"] .home-faixas-admin > form.home-faixa-card > .pages-form-head,
  html[data-theme="day"] .admin .home-faixas-admin > form.admin-card.home-faixa-card > .pages-form-head {
    background: var(--bg-panel);
    box-shadow: 0 4px 14px rgba(15, 23, 42, 0.07);
  }
  html[data-theme="day"] .home-faixas-admin > form.home-faixa-card.is-collapsed > .pages-form-head {
    box-shadow: none;
  }
  .home-faixa-summary-btn {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    flex: 1 1 auto;
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
  }
  .home-faixa-summary-btn:focus-visible {
    outline: 2px solid var(--amber, #ffb454);
    outline-offset: 3px;
    border-radius: 8px;
  }
  .home-faixa-chevron {
    flex: 0 0 auto;
    width: 1.1em;
    margin-top: 0.35em;
    color: var(--muted, #888);
    font-size: 14px;
    line-height: 1;
    transition: transform 0.2s ease;
  }
  .home-faixa-chevron::before {
    content: "\25B8"; /* ? */
  }
  .home-faixa-card.is-expanded .home-faixa-chevron {
    transform: rotate(90deg);
    color: var(--amber, #ffb454);
  }
  .home-faixa-summary-text {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
  }
  .home-faixa-summary-title {
    display: block;
    font-size: clamp(17px, 1.8vw, 20px);
    font-weight: 700;
    letter-spacing: -0.025em;
    line-height: 1.3;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
  }
  .home-faixa-summary-text .hint {
    margin: 0;
  }
  .home-faixas-admin > form.home-faixa-card .pages-save-bar {
    flex-shrink: 0;
    margin-left: auto;
  }
  .home-faixas-admin > form.home-faixa-card .pages-save-bar .button {
    min-width: 7.5rem;
    min-height: 40px;
  }
  .home-faixas-admin > form.home-faixa-card .home-faixa-tag {
    margin-right: 8px;
  }
  @media (prefers-reduced-motion: reduce) {
    .home-faixa-chevron {
      transition: none;
    }
  }
  .admin h3,
  .admin .lista-order-builder h3,
  .pages-form-head h3 {
    margin: 0 0 4px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.3;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
  }

  /* Card shells */
  .admin-card {
    background: var(--bg-panel);
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl);
    padding: clamp(14px, 1.8vw, 20px);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
    overflow: hidden;
  }
  html[data-theme="day"] .admin-card {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  }

  /* Form as stack of section cards (product + complex editors) */
  .admin form.admin-card {
    background: transparent;
    border: 0;
    box-shadow: none;
    padding: 0;
    overflow: visible;
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .admin form.admin-card > .pages-form-head,
  .admin form.admin-card > .form-grid,
  .admin form.admin-card > fieldset,
  .admin form.admin-card > .notice,
  .admin form.admin-card > .form-actions,
  .admin form.admin-card > .product-edit-sticky,
  .admin form.admin-card > .projeto-edit-sticky,
  .admin form.admin-card > .lista-order-builder {
    /* Misturar --bg-soft (rgba quase transparente) tornava o fundo translúcido. */
    background: var(--bg-panel);
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl);
    padding: clamp(14px, 1.8vw, 20px);
    margin: 0;
    min-width: 0;
    overflow: hidden;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
  }
  html[data-theme="day"] .admin form.admin-card > .pages-form-head,
  html[data-theme="day"] .admin form.admin-card > .form-grid,
  html[data-theme="day"] .admin form.admin-card > fieldset,
  html[data-theme="day"] .admin form.admin-card > .notice,
  html[data-theme="day"] .admin form.admin-card > .form-actions,
  html[data-theme="day"] .admin form.admin-card > .product-edit-sticky,
  html[data-theme="day"] .admin form.admin-card > .projeto-edit-sticky,
  html[data-theme="day"] .admin form.admin-card > .lista-order-builder {
    background: var(--bg-panel);
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  }
  .admin-tools-hint {
    flex: 1 1 100%;
    margin: 4px 0 0;
    font-size: 11.5px;
  }
  .skip-link {
    position: fixed;
    left: 12px;
    top: 0;
    z-index: 2000;
    transform: translate3d(0, -220%, 0);
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--amber);
    color: var(--amber-ink);
    font-size: 13px;
    font-weight: 700;
    text-decoration: none;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
    pointer-events: none;
    /* Evita aparecer no overscroll (pull-down) do telemóvel */
    clip-path: inset(100% 0 0 0);
  }
  .skip-link:focus {
    transform: translate3d(0, 12px, 0);
    outline: 2px solid var(--paper);
    outline-offset: 2px;
    pointer-events: auto;
    clip-path: none;
  }
  .admin form.product-edit-form > .product-edit-sticky,
  .admin form.projeto-edit-form > .projeto-edit-sticky {
    position: sticky;
    top: 0;
    z-index: 8;
    align-self: flex-start;
    width: 100%;
    box-sizing: border-box;
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: 20px;
    row-gap: 10px;
    padding: 14px 16px;
    overflow: visible;
    /* Opaco: sticky não deve deixar ver o formulário por baixo (dia = branco). */
    background: var(--bg-panel);
    border-bottom: 1px solid var(--line);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
  }
  html[data-theme="day"] .admin form.product-edit-form > .product-edit-sticky,
  html[data-theme="day"] .admin form.projeto-edit-form > .projeto-edit-sticky {
    background: var(--bg-panel);
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
  }
  .admin form.projeto-edit-form > .projeto-edit-sticky .projeto-edit-sticky-lead {
    min-width: 0;
    display: grid;
    gap: 4px;
  }
  .admin form.projeto-edit-form > .projeto-edit-sticky .projeto-edit-sticky-lead .eyebrow {
    margin: 0;
  }
  .admin form.projeto-edit-form > .projeto-edit-sticky .projeto-edit-sticky-lead h2 {
    margin: 0;
    font-size: clamp(18px, 2vw, 24px);
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.15;
    color: var(--admin-ink);
  }
  .admin form.projeto-edit-form > .projeto-edit-sticky .hint {
    margin: 0;
    max-width: 54ch;
  }
  .admin form.projeto-edit-form > .projeto-edit-sticky .projeto-edit-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
    margin-left: auto;
    flex-shrink: 0;
  }
  .admin form.projeto-edit-form > .projeto-edit-sticky .projeto-edit-actions .button {
    min-height: 40px;
    min-width: 7.5rem;
  }
  @media (max-width: 720px) {
    .admin form.projeto-edit-form > .projeto-edit-sticky {
      grid-template-columns: 1fr;
      align-items: start;
      padding: 12px 14px;
    }
    .admin form.projeto-edit-form > .projeto-edit-sticky .projeto-edit-actions {
      width: 100%;
      justify-content: stretch;
    }
    .admin form.projeto-edit-form > .projeto-edit-sticky .projeto-edit-actions .button,
    .admin form.projeto-edit-form > .projeto-edit-sticky .projeto-edit-actions .button-ghost {
      flex: 1 1 auto;
      justify-content: center;
      text-align: center;
    }
  }
  .admin form.product-edit-form > .product-edit-sticky .product-edit-sticky-lead {
    min-width: 0;
    display: grid;
    gap: 4px;
  }
  .admin form.product-edit-form > .product-edit-sticky .product-edit-sticky-lead .eyebrow {
    margin: 0;
  }
  .admin form.product-edit-form > .product-edit-sticky .product-edit-sticky-lead h1 {
    margin: 0;
    font-size: clamp(20px, 2.2vw, 26px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.15;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
  }
  .admin form.product-edit-form > .product-edit-sticky .notice {
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
    max-width: 52ch;
    font-size: 13px;
    font-weight: 500;
    color: var(--admin-ink-muted, var(--paper-dim));
    line-height: 1.4;
  }
  .admin form.product-edit-form > .product-edit-sticky .product-edit-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    box-shadow: none;
  }
  @media (max-width: 720px) {
    .admin form.product-edit-form > .product-edit-sticky {
      grid-template-columns: 1fr;
      align-items: start;
      padding: 12px 14px;
    }
    .admin form.product-edit-form > .product-edit-sticky .product-edit-actions {
      justify-content: stretch;
      width: 100%;
    }
    .admin form.product-edit-form > .product-edit-sticky .product-edit-actions .button,
    .admin form.product-edit-form > .product-edit-sticky .product-edit-actions .button-ghost {
      flex: 1 1 auto;
      text-align: center;
    }
  }
  .admin form.admin-card:not(.home-faixa-card) > .pages-form-head {
    position: sticky;
    top: 0;
    z-index: 6;
    align-self: flex-start;
    width: 100%;
    box-sizing: border-box;
    overflow: visible;
    background: var(--bg-panel);
  }
  .admin form.admin-card > .notice {
    font-size: 13.5px;
    font-weight: 550;
    color: var(--admin-ink-muted);
    line-height: 1.45;
  }
  .admin form.admin-card > .form-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
  }

  /* Labels ? inputs: max 4px */
  .admin form label,
  .admin .form label,
  .admin label {
    display: flex;
    flex-direction: column;
    gap: var(--admin-label-gap);
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.01em;
    color: var(--admin-ink);
  }
  .admin .form-grid { gap: 14px; }
  .admin .price-input-wrap {
    display: flex;
    align-items: stretch;
    gap: 0;
    width: 100%;
  }
  .admin .price-input-wrap input {
    flex: 1 1 auto;
    min-width: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }
  .admin .price-input-suffix {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-width: 42px;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-left: 0;
    border-radius: 0 8px 8px 0;
    background: color-mix(in srgb, var(--bg-deep) 35%, var(--bg-panel));
    color: var(--admin-ink-muted, var(--paper-dim));
    font-size: 14px;
    font-weight: 700;
  }
  .admin .check {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    font-weight: 600;
    color: var(--admin-ink);
  }
  .admin input,
  .admin select,
  .admin textarea {
    border-radius: 8px;
    padding: 10px 12px;
    font-size: 14px;
    font-weight: 500;
    color: var(--admin-ink);
  }
  .admin .hint,
  .admin .muted,
  .admin .notice {
    color: var(--admin-ink-muted);
  }
  .admin .hint {
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
    margin: 0 0 10px;
  }
  .admin fieldset > .hint:first-of-type,
  .admin fieldset > p.hint:first-child {
    margin-top: 0;
  }

  /* Fieldset / legend as section titles */
  .admin fieldset {
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl);
    padding: clamp(16px, 2vw, 22px);
    background: var(--bg-panel);
    min-width: 0;
  }
  .admin legend {
    float: none;
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    margin: 0 0 10px;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.35;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
    word-break: break-word;
  }
  .admin fieldset.stack {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .admin fieldset.stack > legend {
    margin-bottom: 2px;
  }
  .admin fieldset.stack > .form-grid {
    gap: 14px;
  }

  /* Produto — acordeão de secções */
  .admin form.product-edit-form {
    width: 100%;
    max-width: none;
    gap: 10px;
  }
  .admin form.admin-card.product-edit-form > .product-section-card {
    padding: 0;
    gap: 0;
    border-radius: 14px;
    border: 1px solid var(--line);
    background: var(--bg-panel);
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
    overflow: hidden;
    transition: border-color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
  }
  html[data-theme="day"] .admin form.admin-card.product-edit-form > .product-section-card {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  }
  .admin form.admin-card.product-edit-form > .product-section-card:hover {
    border-color: color-mix(in srgb, var(--amber) 28%, var(--line));
  }
  .admin form.admin-card.product-edit-form > .product-section-card.is-section-open {
    border-color: color-mix(in srgb, var(--amber) 42%, var(--line));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--amber) 14%, transparent);
  }
  .admin form.admin-card.product-edit-form > .product-section-card.is-incomplete {
    border-color: color-mix(in srgb, #d99900 48%, var(--line));
    background:
      linear-gradient(
        90deg,
        color-mix(in srgb, #e0a00a 16%, transparent) 0,
        color-mix(in srgb, #e0a00a 16%, transparent) 4px,
        var(--bg-panel) 4px
      );
  }
  .admin form.admin-card.product-edit-form > .product-section-card.is-incomplete.is-section-open {
    border-color: color-mix(in srgb, #d99900 62%, var(--line));
    box-shadow: 0 0 0 1px color-mix(in srgb, #e0a00a 18%, transparent);
    background:
      linear-gradient(
        90deg,
        color-mix(in srgb, #e0a00a 22%, transparent) 0,
        color-mix(in srgb, #e0a00a 22%, transparent) 4px,
        color-mix(in srgb, #e0a00a 5%, var(--bg-panel)) 4px
      );
  }
  html[data-theme="day"] .admin form.admin-card.product-edit-form > .product-section-card.is-incomplete {
    border-color: color-mix(in srgb, #c48500 40%, var(--line));
    background:
      linear-gradient(
        90deg,
        color-mix(in srgb, #f0b429 28%, transparent) 0,
        color-mix(in srgb, #f0b429 28%, transparent) 4px,
        var(--bg-panel) 4px
      );
  }
  .product-section-tab {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    min-height: 52px;
    padding: 14px 18px;
    cursor: pointer;
    user-select: none;
  }
  .product-section-tab:hover {
    background: color-mix(in srgb, var(--amber) 4%, transparent);
  }
  .product-section-card.is-section-open > .product-section-tab {
    background: color-mix(in srgb, var(--amber) 5%, transparent);
  }
  .product-section-tab:focus-visible {
    outline: 2px solid var(--amber);
    outline-offset: -2px;
  }
  .product-section-tab-copy {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
    pointer-events: none;
  }
  .product-section-tab-copy strong {
    font-size: 15px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--admin-ink);
    line-height: 1.3;
  }
  .product-section-tab-chevron {
    width: 0.55em;
    height: 0.55em;
    border-right: 2px solid var(--paper-dim);
    border-bottom: 2px solid var(--paper-dim);
    transform: rotate(-45deg);
    transition: transform 0.18s ease;
    flex-shrink: 0;
    opacity: 0.7;
  }
  .product-section-card.is-section-open .product-section-tab-chevron {
    transform: rotate(45deg);
  }
  .product-section-status {
    flex-shrink: 0;
    font-size: 12px;
    font-weight: 650;
    padding: 5px 11px;
    border-radius: 999px;
    line-height: 1.3;
    pointer-events: none;
  }
  .product-section-card.is-incomplete .product-section-status {
    color: #8a5600;
    background: color-mix(in srgb, #e0a00a 24%, transparent);
  }
  html[data-theme="day"] .product-section-card.is-incomplete .product-section-status {
    color: #7a4e00;
    background: color-mix(in srgb, #f5c518 32%, #fff);
  }
  .product-section-card.is-complete .product-section-status {
    color: var(--admin-ink-muted, var(--paper-dim));
    background: color-mix(in srgb, var(--line) 45%, transparent);
    font-weight: 600;
  }
  .product-section-body {
    display: none;
    padding: 4px 20px 20px;
    border-top: 1px solid var(--line);
  }
  .product-section-card.is-section-open > .product-section-body {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .product-section-body > .hint:first-child {
    margin: 0;
  }
  .product-section-body .form-grid {
    gap: 14px;
  }
  .document-fields {
    gap: 12px;
  }
  .document-fields-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 2px;
  }

  /* Produto — Ofertas: Promoção / Liquidação */
  .offer-admin {
    gap: 0;
  }
  .offer-admin-tabs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 10px;
    margin: 0 0 12px;
  }
  .offer-admin-tab {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    min-height: 72px;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bg-overlay, var(--bg-panel));
    color: var(--admin-ink, var(--paper));
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .offer-admin-tab:hover {
    border-color: var(--line-active);
  }
  .offer-admin-tab-title {
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
  }
  .offer-admin-tab-status {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-ink-muted, var(--paper-dim));
    background: color-mix(in srgb, var(--line) 55%, transparent);
  }
  .offer-admin-tab--promo.is-active {
    border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 86%, var(--amber) 14%);
    box-shadow: 0 10px 24px -20px color-mix(in srgb, var(--amber) 70%, transparent);
  }
  .offer-admin-tab--promo.is-active .offer-admin-tab-status {
    color: var(--amber-ink, #1a1410);
    background: var(--amber);
  }
  .offer-admin.has-promocao .offer-admin-tab--promo .offer-admin-tab-status {
    color: var(--amber-ink, #1a1410);
    background: var(--amber);
  }
  .offer-admin-tab--liq.is-active {
    border-color: color-mix(in srgb, #e11d48 50%, var(--line));
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 88%, #e11d48 12%);
    box-shadow: 0 10px 24px -20px rgba(225, 29, 72, 0.55);
  }
  .offer-admin-tab--liq.is-active .offer-admin-tab-status {
    color: #fff8f8;
    background: #e11d48;
  }
  .offer-admin.has-liquidacao .offer-admin-tab--liq .offer-admin-tab-status {
    color: #fff8f8;
    background: #e11d48;
  }
  .offer-admin-details {
    margin-top: 4px;
    padding: 14px 16px 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    animation: liquidacao-admin-in 0.22s ease;
  }
  .offer-admin-details[hidden] {
    display: none !important;
  }
  .offer-admin-details--promo {
    border-color: color-mix(in srgb, var(--line) 70%, var(--amber) 30%);
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 94%, var(--amber) 6%);
  }
  .offer-admin-details--liq {
    border-color: color-mix(in srgb, var(--line) 65%, #e11d48 35%);
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 94%, #e11d48 6%);
  }
  .offer-admin-enable {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0 0 10px;
    font-weight: 650;
    color: var(--admin-ink, var(--paper));
    cursor: pointer;
  }
  .offer-admin-details > .hint {
    margin: 0 0 12px;
  }
  @media (max-width: 560px) {
    .offer-admin-tabs {
      grid-template-columns: 1fr;
    }
  }

  .products-admin-filter--promo.is-active {
    color: #f5f3ff;
    background: #7c3aed;
    border-color: transparent;
    box-shadow: 0 8px 20px -12px rgba(124, 58, 237, 0.55);
  }
  .products-admin-row.is-promocao td {
    background: color-mix(in srgb, #7c3aed 7%, transparent);
  }
  .products-admin-row.is-promocao td:first-child {
    box-shadow: inset 3px 0 0 #7c3aed;
  }
  .products-admin-badge--promo {
    color: #ede9fe;
    background: color-mix(in srgb, #7c3aed 55%, transparent);
    border: 1px solid color-mix(in srgb, #a78bfa 55%, transparent);
  }
  html[data-theme="day"] .products-admin-badge--promo {
    color: #5b21b6;
    background: color-mix(in srgb, #7c3aed 14%, #fff);
    border-color: color-mix(in srgb, #7c3aed 35%, transparent);
  }
  .products-admin-row.is-promocao .products-admin-sale {
    color: #a78bfa;
  }
  html[data-theme="day"] .products-admin-row.is-promocao .products-admin-sale {
    color: #6d28d9;
  }

  .pdp-promo-kind {
    color: var(--amber-ink, #1a1410) !important;
    background: var(--amber) !important;
    border-color: transparent !important;
  }

  /* Produto — Liquidação (legado switch, mantido se usado noutro sítio) */
  .liquidacao-admin {
    gap: 0;
  }
  .liquidacao-admin-switch {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bg-overlay, var(--bg-panel));
    cursor: pointer;
    user-select: none;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .liquidacao-admin-switch:hover {
    border-color: color-mix(in srgb, var(--line) 55%, var(--amber) 45%);
  }
  .liquidacao-admin.is-open .liquidacao-admin-switch {
    border-color: color-mix(in srgb, var(--line) 40%, var(--amber) 60%);
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 88%, var(--amber) 12%);
    box-shadow: 0 10px 24px -20px color-mix(in srgb, var(--amber) 70%, transparent);
  }
  .liquidacao-admin-switch input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
  }
  .liquidacao-admin-switch-track {
    position: relative;
    flex: 0 0 auto;
    width: 48px;
    height: 28px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--line) 70%, #64748b 30%);
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    transition: background 0.2s ease, border-color 0.2s ease;
  }
  .liquidacao-admin-switch-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22);
    transition: transform 0.2s ease;
  }
  .liquidacao-admin-switch input:checked + .liquidacao-admin-switch-track {
    background: var(--amber);
    border-color: transparent;
  }
  .liquidacao-admin-switch input:checked + .liquidacao-admin-switch-track .liquidacao-admin-switch-thumb {
    transform: translateX(20px);
  }
  .liquidacao-admin-switch input:focus-visible + .liquidacao-admin-switch-track {
    outline: 2px solid var(--amber);
    outline-offset: 3px;
  }
  .liquidacao-admin-switch-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    flex: 1;
  }
  .liquidacao-admin-switch-title {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--admin-ink, var(--paper));
  }
  .liquidacao-admin-switch-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    font-size: 12px;
    line-height: 1.4;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .liquidacao-admin-status {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 800;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-ink-muted, var(--paper-dim));
    background: color-mix(in srgb, var(--line) 55%, transparent);
  }
  .liquidacao-admin.is-open .liquidacao-admin-status {
    color: var(--amber-ink, #1a1410);
    background: var(--amber);
  }

  /* Produto ? marcas de conformidade + visibilidade */
  .pdp-aviso-admin {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .pdp-aviso-admin-title {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
  }
  .pdp-aviso-block {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: color-mix(in srgb, var(--bg-deep) 22%, var(--bg-panel));
  }
  .pdp-aviso-block[data-pdp-aviso-block="shared"] {
    background: color-mix(in srgb, var(--cool) 6%, var(--bg-panel));
    border-color: color-mix(in srgb, var(--cool) 22%, var(--line));
  }
  .pdp-aviso-block-head {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .pdp-aviso-block-head .hint { margin: 0; }
  .pdp-aviso-field { display: block; margin: 0; }
  .pdp-aviso-field textarea { width: 100%; }
  .country-flags-admin {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
  }
  .country-flags-admin-head {
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .country-flags-admin-title {
    margin: 0;
    font-size: 13px;
    font-weight: 650;
    color: var(--paper);
  }
  .country-flags-admin-head .hint {
    margin: 0;
  }
  .country-flags-admin-list {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
    gap: 8px;
    max-width: 360px;
  }
  .country-flag-option {
    position: relative;
    display: block;
    margin: 0;
    cursor: pointer;
    user-select: none;
  }
  .country-flag-option input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
  }
  .country-flag-option-face {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: 48px;
    padding: 8px 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--bg-deep) 22%, var(--bg-panel));
    transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
  }
  .country-flag-option:hover .country-flag-option-face {
    border-color: color-mix(in srgb, var(--amber, #d4a017) 42%, var(--line));
  }
  .country-flag-option input:focus-visible + .country-flag-option-face {
    outline: 2px solid color-mix(in srgb, var(--amber, #d4a017) 70%, transparent);
    outline-offset: 2px;
  }
  .country-flag-option input:checked + .country-flag-option-face {
    border-color: color-mix(in srgb, var(--amber, #d4a017) 55%, var(--line));
    background: color-mix(in srgb, var(--amber, #d4a017) 10%, var(--bg-panel));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--amber, #d4a017) 28%, transparent);
  }
  .country-flag-option-preview {
    display: inline-flex;
    flex-shrink: 0;
    line-height: 0;
  }
  .country-flag-option-preview .country-flag-svg {
    display: block;
    border-radius: 3px;
    box-shadow: 0 0 0 1px color-mix(in srgb, #000 14%, transparent);
  }
  .country-flag-option-copy {
    display: flex;
    flex-direction: column;
    gap: 1px;
    min-width: 0;
    line-height: 1.2;
  }
  .country-flag-option-name {
    font-size: 13px;
    font-weight: 600;
  }
  .country-flag-option-code {
    font-size: 11px;
    color: var(--paper-dim);
    letter-spacing: 0.04em;
  }
  .compliance-marks-block {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .compliance-marks-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .compliance-marks-block > .button-ghost {
    align-self: flex-start;
  }
  .compliance-mark-row.media-row {
    align-items: stretch;
    padding: 14px;
    margin: 0;
    border: 1px solid var(--line);
    border-bottom-color: var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--bg-deep) 28%, var(--bg-panel));
    gap: 14px;
  }
  .compliance-mark-row--shared {
    background: color-mix(in srgb, var(--cool) 6%, var(--bg-panel));
    border-color: color-mix(in srgb, var(--cool) 22%, var(--line));
  }
  .compliance-mark-preview {
    width: 64px;
    height: 64px;
    border-radius: 12px;
    background: #fff;
    border-color: color-mix(in srgb, var(--line) 80%, transparent);
  }
  html[data-theme="night"] .compliance-mark-preview {
    background: #edf0f5;
  }
  .compliance-mark-preview img {
    object-fit: contain;
    padding: 8px;
  }
  .compliance-mark-actions {
    gap: 6px;
  }
  .compliance-mark-actions .button-ghost,
  .compliance-mark-actions .button-danger {
    min-height: 30px;
    padding: 5px 12px;
    border-radius: 8px;
    font-size: 12px;
    font-weight: 650;
  }

  .compliance-icon-line {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(148px, 180px);
    gap: 12px;
    align-items: end;
  }
  .compliance-icon-field,
  .compliance-visible-field {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: var(--admin-label-gap, 4px);
  }
  .compliance-visible-label {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
    line-height: inherit;
  }
  .compliance-visible-control {
    display: flex;
    align-items: center;
    gap: 10px;
    height: 42px;
    padding: 0 12px 0 10px;
    border: 1px solid var(--line);
    border-radius: 8px;
    background: var(--bg-input, var(--bg-panel));
    color: var(--admin-ink, var(--paper));
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
    transition: border-color 0.18s ease, background-color 0.18s ease;
  }
  .compliance-visible-field:hover .compliance-visible-control {
    border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
  }
  .compliance-visible-control.is-on {
    border-color: color-mix(in srgb, var(--amber) 45%, var(--line));
  }
  .compliance-visible-control input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
  }
  .compliance-visible-track {
    position: relative;
    flex: none;
    width: 34px;
    height: 20px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--paper-dim) 22%, var(--bg-deep));
    transition: background-color 0.18s ease;
  }
  .compliance-visible-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 16px;
    height: 16px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.22);
    transition: transform 0.18s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .compliance-visible-control.is-on .compliance-visible-track {
    background: var(--amber);
  }
  .compliance-visible-control.is-on .compliance-visible-thumb {
    transform: translateX(14px);
  }
  .compliance-visible-control input:focus-visible + .compliance-visible-track {
    outline: 2px solid var(--amber);
    outline-offset: 2px;
  }
  .compliance-visible-text {
    font-size: 13px;
    font-weight: 600;
    line-height: 1.2;
    color: var(--admin-ink-muted, var(--paper-dim));
    white-space: nowrap;
  }
  .compliance-visible-control.is-on .compliance-visible-text {
    color: var(--admin-ink, var(--paper));
  }
  html[data-theme="night"] .compliance-mark-row {
    background: color-mix(in srgb, var(--bg-panel-hover) 55%, transparent);
  }
  html[data-theme="night"] .compliance-mark-row--shared {
    background: color-mix(in srgb, var(--cool) 8%, transparent);
  }
  @media (max-width: 720px) {
    .compliance-icon-line {
      grid-template-columns: 1fr;
      align-items: stretch;
    }
    .compliance-visible-control {
      width: 100%;
    }
  }
  @media (max-width: 560px) {
    .compliance-mark-row.media-row {
      grid-template-columns: 56px minmax(0, 1fr);
    }
    .compliance-mark-preview {
      width: 56px;
      height: 56px;
    }
  }
  .liquidacao-admin-hint {
    min-width: 0;
  }
  .liquidacao-admin-details {
    margin-top: 12px;
    padding: 14px 16px 16px;
    border: 1px solid color-mix(in srgb, var(--line) 70%, var(--amber) 30%);
    border-radius: 14px;
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 94%, var(--amber) 6%);
    animation: liquidacao-admin-in 0.22s ease;
  }
  .liquidacao-admin-details[hidden] {
    display: none !important;
  }
  .liquidacao-admin-details > .hint {
    margin: 0 0 12px;
  }
  .liquidacao-admin-note-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .liquidacao-admin-note-hint {
    font-size: 12px;
    color: var(--admin-ink-muted, var(--paper-dim));
    font-weight: 400;
    letter-spacing: 0;
    text-transform: none;
  }
  @keyframes liquidacao-admin-in {
    from { opacity: 0; transform: translateY(-6px); }
    to { opacity: 1; transform: translateY(0); }
  }
  @media (max-width: 560px) {
    .liquidacao-admin-switch {
      align-items: flex-start;
      padding: 12px 14px;
    }
    .liquidacao-admin-switch-meta {
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
    }
  }

  /* SEO & Páginas — cards soltos (alinhado a product-section) */
  .admin form.admin-card:has(.seo-pages-list) {
    gap: 12px;
  }
  .admin form.admin-card:has(.seo-pages-list) > .pages-form-head {
    padding: 14px 16px;
    border-radius: 14px;
  }
  .admin form.admin-card > .seo-pages-list {
    padding: 0;
    margin: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
    overflow: visible;
  }
  html[data-theme="day"] .admin form.admin-card > .seo-pages-list {
    box-shadow: none;
  }
  .seo-pages-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .admin fieldset.seo-page-card,
  fieldset.seo-page-card,
  .seo-page-card {
    margin: 0;
    padding: 0 !important;
    border: 1px solid var(--line);
    border-radius: 14px !important;
    background: var(--bg-panel);
    overflow: hidden;
    min-width: 0;
    box-shadow: 0 1px 0 rgba(255, 255, 255, 0.03) inset;
    transition: border-color 0.18s ease, background-color 0.18s ease, box-shadow 0.18s ease;
  }
  html[data-theme="day"] .admin fieldset.seo-page-card,
  html[data-theme="day"] fieldset.seo-page-card,
  html[data-theme="day"] .seo-page-card {
    box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  }
  .seo-page-card:hover {
    border-color: color-mix(in srgb, var(--amber) 28%, var(--line));
  }
  .seo-page-card.is-open {
    border-color: color-mix(in srgb, var(--amber) 42%, var(--line));
    background: color-mix(in srgb, var(--amber) 4%, var(--bg-panel));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .seo-page-card.is-meta-only {
    background:
      linear-gradient(
        90deg,
        color-mix(in srgb, var(--admin-ink) 10%, transparent) 0,
        color-mix(in srgb, var(--admin-ink) 10%, transparent) 3px,
        var(--bg-panel) 3px
      );
  }
  html[data-theme="day"] .seo-page-card.is-meta-only {
    background:
      linear-gradient(
        90deg,
        color-mix(in srgb, var(--admin-ink) 12%, transparent) 0,
        color-mix(in srgb, var(--admin-ink) 12%, transparent) 3px,
        #fff 3px
      );
  }
  .seo-page-tab {
    appearance: none;
    width: 100%;
    min-width: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 0;
    padding: 13px 16px;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.18s ease;
  }
  .seo-page-tab:hover {
    background: color-mix(in srgb, var(--amber) 4%, transparent);
  }
  .seo-page-card.is-open > .seo-page-tab {
    background: color-mix(in srgb, var(--amber) 5%, transparent);
  }
  .seo-page-tab:focus-visible {
    outline: 2px solid var(--amber);
    outline-offset: -2px;
  }
  .seo-page-tab-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 6px;
    pointer-events: none;
  }
  .seo-page-tab-title {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-width: 0;
  }
  .seo-page-tab-title strong {
    font-size: 14.5px;
    font-weight: 650;
    letter-spacing: -0.02em;
    color: var(--admin-ink);
    line-height: 1.25;
    overflow-wrap: anywhere;
  }
  .seo-page-badge {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--admin-ink-muted);
    background: color-mix(in srgb, var(--admin-ink) 7%, transparent);
    border: 1px solid color-mix(in srgb, var(--line) 90%, transparent);
  }
  .seo-page-slug {
    display: inline-flex;
    align-items: center;
    width: fit-content;
    max-width: 100%;
    padding: 3px 9px;
    border-radius: 8px;
    font-size: 11.5px;
    line-height: 1.3;
    color: var(--admin-ink-muted, var(--paper-dim));
    background: color-mix(in srgb, var(--admin-ink) 5%, transparent);
    border: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .seo-page-tab-chevron {
    width: 0.55em;
    height: 0.55em;
    margin-right: 4px;
    border-right: 2px solid var(--admin-ink-muted, var(--paper-dim));
    border-bottom: 2px solid var(--admin-ink-muted, var(--paper-dim));
    transform: rotate(-45deg);
    transition: transform 0.18s ease;
    flex-shrink: 0;
    opacity: 0.7;
  }
  .seo-page-card.is-open .seo-page-tab-chevron {
    transform: rotate(45deg);
  }
  .seo-page-card-body {
    border-top: 1px solid var(--line);
    animation: seo-panel-in 0.22s ease;
  }
  .seo-page-card-body[hidden] {
    display: none;
  }
  @keyframes seo-panel-in {
    from {
      opacity: 0;
      transform: translateY(-4px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .seo-page-card-body-inner {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px 16px 16px;
  }
  .seo-page-fields {
    gap: 12px;
  }
  .seo-page-fields > label > .hint {
    margin: 6px 0 0;
    font-size: 12px;
  }
  .seo-page-foot {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-top: 2px;
  }
  .seo-page-foot .hint {
    margin: 0;
    font-size: 12px;
    line-height: 1.4;
  }
  .seo-slug-row {
    display: flex;
    align-items: stretch;
    gap: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--bg-deep, var(--bg)) 35%, var(--bg-panel));
    overflow: hidden;
  }
  html[data-theme="day"] .seo-slug-row {
    background: color-mix(in srgb, var(--admin-ink) 3%, #fff);
  }
  .seo-slug-prefix {
    display: inline-flex;
    align-items: center;
    padding: 0 10px;
    border-right: 1px solid var(--line);
    color: var(--admin-ink-muted);
    font-size: 12.5px;
    background: color-mix(in srgb, var(--admin-ink) 4%, transparent);
  }
  .seo-slug-row input {
    flex: 1;
    min-width: 0;
    margin: 0;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }
  .admin-tools { display: flex; flex-wrap: wrap; gap: 8px; }
  @media (max-width: 959px) {
    .admin .admin-tools {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 6px;
      width: 100%;
      max-width: 100%;
    }
    .admin .admin-tools .button,
    .admin .admin-tools .button-ghost {
      width: 100%;
      min-width: 0;
      min-height: 36px;
      padding: 8px 10px;
      font-size: 12px;
      border-radius: 10px;
    }
    .admin .admin-tools-hint {
      grid-column: 1 / -1;
    }
  }
  .notice { font-size: 13px; color: var(--admin-ink-muted); }
  /* Admin list search (Produtos / Categorias / Caracter�sticas) */
  .admin-list-panel,
  .products-admin {
    display: flex;
    flex-direction: column;
    gap: 14px;
  }
  .admin-list-toolbar,
  .products-admin-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 12px 16px;
  }
  .admin-list-search,
  .products-admin-search {
    display: flex;
    flex-direction: column;
    gap: 6px;
    flex: 1 1 240px;
    min-width: min(100%, 240px);
    max-width: 420px;
    margin: 0;
  }
  .admin-list-search-label,
  .products-admin-search-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-ink-muted);
  }
  .admin-list-search input,
  .products-admin-search input {
    width: 100%;
    min-height: 40px;
    margin: 0;
    box-sizing: border-box;
  }
  .admin-list-search-meta,
  .products-admin-search-meta {
    margin: -4px 0 0;
    font-size: 13px;
  }
  .products-admin-filters {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    flex: 1 1 auto;
  }
  .products-admin-filter {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 36px;
    padding: 0 14px;
    border: 1px solid var(--line);
    border-radius: 999px;
    background: var(--bg-panel);
    color: var(--admin-ink-muted);
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    cursor: pointer;
    transition: color 0.2s ease, border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .products-admin-filter span {
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 700;
    opacity: 0.85;
  }
  .products-admin-filter:hover {
    color: var(--admin-ink);
    border-color: var(--line-active);
  }
  .products-admin-filter.is-active {
    color: var(--amber-ink);
    background: var(--amber);
    border-color: transparent;
    box-shadow: 0 8px 20px -12px color-mix(in srgb, var(--amber) 80%, transparent);
  }
  .products-admin-filter--liq.is-active {
    color: #fff8f8;
    background: #e11d48;
    box-shadow: 0 8px 20px -12px rgba(225, 29, 72, 0.55);
  }
  .products-admin-bulk {
    position: sticky;
    top: 72px;
    z-index: 5;
    display: flex;
    flex-direction: column;
    gap: 0;
    padding: 0;
    border: 1px solid color-mix(in srgb, var(--line) 80%, var(--amber));
    border-radius: 14px;
    background:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--amber) 14%, var(--bg-panel)) 0%,
        var(--bg-panel) 100%
      );
    box-shadow:
      0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset,
      0 10px 28px -18px color-mix(in srgb, var(--amber) 55%, transparent);
    overflow: hidden;
    animation: products-bulk-in 0.22s ease;
  }
  @keyframes products-bulk-in {
    from {
      opacity: 0;
      transform: translateY(-6px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .products-admin-bulk-main {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 16px;
    padding: 12px 14px;
  }
  .products-admin-bulk-meta {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }
  .products-admin-bulk-badge {
    flex: 0 0 auto;
    display: inline-grid;
    place-items: center;
    min-width: 36px;
    height: 36px;
    padding: 0 8px;
    border-radius: 999px;
    background: var(--amber);
    color: var(--amber-ink, #1a1208);
    font-family: var(--font-mono);
    font-size: 14px;
    font-weight: 700;
    line-height: 1;
    box-shadow: 0 8px 18px -12px color-mix(in srgb, var(--amber) 90%, transparent);
  }
  .products-admin-bulk-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  .products-admin-bulk-count {
    margin: 0;
    font-size: 14px;
    font-weight: 650;
    color: var(--admin-ink);
    letter-spacing: 0.01em;
  }
  .products-admin-bulk-pagehint {
    margin: 0;
    font-size: 12px;
    color: var(--admin-ink-muted);
  }
  .products-admin-bulk-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }
  .products-admin-bulk-actions .button,
  .products-admin-bulk-actions .button-danger,
  .products-admin-bulk-actions .button-ghost {
    min-height: 34px;
  }
  .products-admin-bulk.is-editing .products-admin-bulk-main {
    border-bottom: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
  }
  .products-admin-bulk-edit {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 14px;
    background: color-mix(in srgb, var(--bg-panel) 92%, var(--amber));
  }
  .products-admin-bulk-edit-lead {
    margin: 0;
    font-size: 12px;
    line-height: 1.45;
    color: var(--admin-ink-muted);
  }
  .products-admin-bulk-edit-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .products-admin-bulk-field {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0;
    min-width: 0;
  }
  .products-admin-bulk-field > span {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-ink-muted);
  }
  .products-admin-bulk-field select,
  .products-admin-bulk-field input {
    width: 100%;
    min-height: 40px;
    margin: 0;
    box-sizing: border-box;
    border-radius: 10px;
    border: 1px solid var(--line);
    background: var(--bg-panel);
    color: var(--admin-ink);
    padding: 0 12px;
    font: inherit;
    font-size: 14px;
    transition: border-color 0.18s ease, box-shadow 0.18s ease;
  }
  .products-admin-bulk-field select:focus,
  .products-admin-bulk-field input:focus {
    outline: none;
    border-color: color-mix(in srgb, var(--amber) 70%, var(--line));
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--amber) 22%, transparent);
  }
  .products-admin-bulk-edit-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
  }
  @media (max-width: 720px) {
    .products-admin-bulk {
      top: 64px;
    }
    .products-admin-bulk-edit-grid {
      grid-template-columns: 1fr;
    }
    .products-admin-bulk-actions {
      width: 100%;
    }
    .products-admin-bulk-actions .button,
    .products-admin-bulk-actions .button-danger {
      flex: 1 1 auto;
    }
  }
  .products-admin-check {
    width: 42px;
    text-align: center;
    vertical-align: middle;
  }
  .products-admin-check-label {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin: 0;
    cursor: pointer;
  }
  .products-admin-check-label input {
    width: 16px;
    height: 16px;
    margin: 0;
    accent-color: var(--amber);
    cursor: pointer;
  }
  .products-admin-row.is-selected td {
    background: color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .products-admin-table-wrap {
    border-color: color-mix(in srgb, var(--line) 85%, transparent);
  }
  .products-admin-table {
    min-width: 800px;
    border-collapse: separate;
    border-spacing: 0;
  }
  .products-admin-table th,
  .products-admin-table td {
    border-bottom: 1px solid var(--line);
    background-clip: padding-box;
  }
  .products-admin-table tbody tr.products-admin-row td {
    transition: background 0.18s ease;
  }
  .products-admin-row.is-catalog td:first-child {
    box-shadow: inset 3px 0 0 color-mix(in srgb, var(--amber) 55%, transparent);
  }
  .products-admin-row.is-liquidacao td {
    background: color-mix(in srgb, #e11d48 7%, transparent);
  }
  .products-admin-row.is-liquidacao td:first-child {
    box-shadow: inset 3px 0 0 #e11d48;
  }
  .products-admin-row.is-liquidacao:hover td {
    background: color-mix(in srgb, #e11d48 11%, transparent);
  }
  .products-admin-row.is-soldout {
    opacity: 0.62;
  }
  html[data-theme="day"] .products-admin-row.is-liquidacao td {
    background: color-mix(in srgb, #be123c 6%, #fff);
  }
  html[data-theme="day"] .products-admin-row.is-liquidacao:hover td {
    background: color-mix(in srgb, #be123c 10%, #fff);
  }
  .products-admin-tipos {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
  }
  .products-admin-badge {
    display: inline-flex;
    align-items: center;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    white-space: nowrap;
  }
  .products-admin-badge--cat {
    color: color-mix(in srgb, var(--amber) 78%, #fff);
    background: color-mix(in srgb, var(--amber) 16%, transparent);
    border: 1px solid color-mix(in srgb, var(--amber) 42%, transparent);
  }
  html[data-theme="day"] .products-admin-badge--cat {
    color: #8a5a10;
    background: color-mix(in srgb, var(--amber) 16%, #fff);
    border-color: color-mix(in srgb, var(--amber) 40%, transparent);
  }
  .products-admin-badge--liq {
    color: #fff8f8;
    background: #e11d48;
    border: 1px solid transparent;
  }
  .products-admin-kind,
  .products-admin-stock {
    display: block;
    margin-top: 5px;
    font-size: 11.5px;
    line-height: 1.35;
  }
  .products-admin-kind {
    color: var(--admin-ink);
    font-weight: 600;
  }
  .products-admin-stock {
    font-family: var(--font-mono);
    font-size: 10.5px;
    letter-spacing: 0.04em;
    text-transform: uppercase;
  }
  .products-admin-stock.is-in { color: var(--stock-ok, #34d399); }
  .products-admin-stock.is-out { color: var(--danger, #f0a8a0); }
  .products-admin-price {
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
  }
  .products-admin-sale {
    font-weight: 700;
    color: var(--admin-ink);
  }
  .products-admin-row.is-liquidacao .products-admin-sale {
    color: #fb7185;
  }
  html[data-theme="day"] .products-admin-row.is-liquidacao .products-admin-sale {
    color: #be123c;
  }
  .products-admin-list {
    font-size: 12px;
    color: var(--admin-ink-muted);
    text-decoration: line-through;
  }
  .products-admin-pct {
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #e11d48;
  }
  .admin-sticky-toolbar {
    position: sticky;
    top: 0;
    z-index: 6;
    margin: 0 -2px;
    padding: 10px 2px 12px;
    background: var(--bg);
    border-bottom: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  }
  html[data-theme="day"] .admin-sticky-toolbar {
    background: var(--bg);
  }
  .products-admin-search-field {
    position: relative;
    display: block;
  }
  .products-admin-search-field input {
    padding-right: 36px;
  }
  .products-admin-search-field input[type="search"]::-webkit-search-cancel-button,
  .products-admin-search-field input[type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
    appearance: none;
  }
  .products-admin-search-clear {
    position: absolute;
    top: 50%;
    right: 6px;
    transform: translateY(-50%);
    width: 28px;
    height: 28px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 8px;
    background: transparent;
    color: var(--admin-ink-muted);
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
  }
  .products-admin-search-clear:hover {
    color: var(--admin-ink);
    background: color-mix(in srgb, var(--admin-ink) 8%, transparent);
  }
  .products-admin-pager {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 16px;
    margin-top: 4px;
    padding: 10px 2px 2px;
  }
  .products-admin-pager-meta {
    margin: 0;
    font-size: 13px;
  }

  .table-wrap {
    overflow-x: auto;
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl);
    background: var(--bg-panel);
  }
  .data-table { width: 100%; border-collapse: collapse; min-width: 680px; }
  .data-table th, .data-table td {
    padding: 12px 14px; border-bottom: 1px solid var(--line);
    text-align: left; vertical-align: middle; font-size: 13.5px;
    color: var(--admin-ink);
  }
  .data-table th {
    font-size: 11px; letter-spacing: 0.08em; text-transform: uppercase;
    font-weight: 700; color: var(--admin-ink-muted);
    background: color-mix(in srgb, var(--admin-ink) 3%, transparent);
  }
  .data-table td strong {
    font-weight: 650;
    color: var(--admin-ink);
  }
  .tree-item { margin-left: calc(var(--depth) * 16px); }
  .tree-row, .assoc-row, .lista-row, .repeat {
    display: flex; justify-content: space-between; gap: 10px; align-items: center;
    flex-wrap: wrap; padding: 10px 0; border-bottom: 1px solid var(--line);
  }
  .lista-block { padding: 8px 0 12px; border-bottom: 1px solid var(--line); }
  .lista-row {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; flex-wrap: wrap;
  }
  .lista-expand {
    display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; flex-wrap: wrap;
    background: transparent; border: 0; color: inherit; text-align: left;
    cursor: pointer; padding: 4px 0; font: inherit;
  }
  .lista-expand .amber { color: var(--amber); font-size: 11px; }
  .nested-products {
    margin: 10px 0 0 12px; padding-left: 12px; border-left: 2px solid var(--amber);
    display: flex; flex-direction: column; gap: 6px;
  }
  .assoc-row {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
    background: var(--bg-overlay); padding: 6px 10px; border-radius: var(--radius-sm); font-size: 12px;
  }
  /* Liquidação — atributo Visível (inline switch) */
  .liquidacao-kind-row {
    gap: 10px;
    padding: 8px 10px;
    flex-wrap: wrap;
  }
  .liquidacao-kind-row > input[name="kindLabel"] {
    flex: 1 1 12rem;
    min-width: 0;
  }
  .liquidacao-kind-row > input[name="kindId"] {
    flex: 0 1 9rem;
    min-width: 0;
  }
  .admin label.admin-flag-toggle.admin-flag-toggle--liq,
  .admin-flag-toggle.admin-flag-toggle--liq {
    flex: 0 0 auto;
    gap: 8px;
    padding: 5px 8px 5px 6px;
    min-height: 34px;
    border-radius: 999px;
    align-self: center;
    white-space: nowrap;
    background:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 92%, #fff 8%) 0%,
        var(--bg-overlay, var(--bg-panel)) 100%
      );
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  }
  html[data-theme="day"] .admin-flag-toggle.admin-flag-toggle--liq {
    background: color-mix(in srgb, #fff 86%, var(--line));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }
  .admin-flag-toggle--liq:hover {
    border-color: color-mix(in srgb, var(--line) 45%, var(--amber) 55%);
  }
  .admin-flag-toggle--liq:has(input:checked) {
    border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 82%, var(--amber) 18%);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.06),
      0 8px 18px -16px color-mix(in srgb, var(--amber) 75%, transparent);
  }
  .admin-flag-toggle--liq:not(:has(input:checked)) {
    opacity: 0.9;
  }
  .admin-flag-toggle--liq .admin-flag-toggle-track {
    width: 34px;
    height: 18px;
  }
  .admin-flag-toggle--liq .admin-flag-toggle-thumb {
    width: 12px;
    height: 12px;
    top: 2px;
    left: 2px;
  }
  .admin-flag-toggle--liq input:checked + .admin-flag-toggle-track .admin-flag-toggle-thumb {
    transform: translateX(16px);
  }
  .admin-flag-toggle--liq .admin-flag-toggle-title {
    flex: 0 0 auto;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
  }
  .admin-flag-toggle--liq .admin-flag-toggle-state {
    flex: 0 0 auto;
    min-width: 2rem;
    margin-left: 2px;
    padding: 3px 6px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 88%, var(--line));
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1;
    text-align: center;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .admin-flag-toggle--liq .admin-flag-toggle-state::before {
    content: "Off";
  }
  .admin-flag-toggle--liq:has(input:checked) .admin-flag-toggle-state {
    border-color: color-mix(in srgb, var(--amber) 45%, transparent);
    background: color-mix(in srgb, var(--amber) 22%, transparent);
    color: color-mix(in srgb, var(--amber) 70%, var(--admin-ink, #fff));
  }
  .admin-flag-toggle--liq:has(input:checked) .admin-flag-toggle-state::before {
    content: "On";
  }

  /* Tutoriais — Categorias de tutoriais */
  .tutorial-cats-editor {
    gap: 12px;
    margin-top: 4px;
  }
  .tutorial-cats-head {
    margin: 0;
    align-items: flex-start;
  }
  .tutorial-cats-head h3 {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.01em;
  }
  .tutorial-cats-head .hint {
    margin: 4px 0 0;
  }
  .tutorial-cats-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .tutorial-cat-row {
    display: grid;
    grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto;
    align-items: end;
    gap: 10px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
    border-radius: 12px;
    background:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 94%, #fff 6%) 0%,
        var(--bg-overlay, var(--bg-panel)) 100%
      );
  }
  html[data-theme="day"] .tutorial-cat-row {
    background: color-mix(in srgb, #fff 90%, var(--line));
  }
  .tutorial-cat-field {
    display: flex;
    flex-direction: column;
    gap: 5px;
    margin: 0;
    min-width: 0;
  }
  .tutorial-cat-field-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--admin-ink-muted, var(--paper-dim));
    line-height: 1;
  }
  .tutorial-cat-field input {
    width: 100%;
    min-width: 0;
    margin: 0;
  }
  .tutorial-cat-remove {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    align-self: end;
    min-height: 36px;
    padding: 0 12px;
    margin: 0;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--danger) 34%, var(--line));
    background: color-mix(in srgb, var(--danger) 8%, var(--bg-panel));
    color: var(--danger);
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.01em;
    line-height: 1;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.18s ease, background-color 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease;
  }
  .tutorial-cat-remove svg {
    flex: none;
    display: block;
    opacity: 0.9;
  }
  .tutorial-cat-remove:hover {
    background: color-mix(in srgb, var(--danger) 16%, var(--bg-panel));
    border-color: color-mix(in srgb, var(--danger) 58%, var(--line));
    box-shadow: 0 8px 18px -16px color-mix(in srgb, var(--danger) 70%, transparent);
  }
  .tutorial-cat-remove:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--danger) 55%, transparent);
    outline-offset: 2px;
  }
  html[data-theme="night"] .tutorial-cat-remove {
    background: color-mix(in srgb, var(--danger) 12%, transparent);
  }
  @media (max-width: 640px) {
    .tutorial-cat-row {
      grid-template-columns: 1fr;
      align-items: stretch;
    }
    .tutorial-cat-remove {
      width: 100%;
    }
  }
  @media (min-width: 641px) and (max-width: 820px) {
    .tutorial-cat-remove span {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }
    .tutorial-cat-remove {
      width: 36px;
      padding: 0;
    }
  }

  .nested-empty { margin-left: 12px; }
  .button, .button-ghost, .button-danger, a.button, a.button-ghost {
    border-radius: 999px; padding: 10px 14px; font: inherit; font-size: 13px; font-weight: 700;
    cursor: pointer; text-decoration: none; display: inline-flex; align-items: center;
    justify-content: center; border: 1px solid transparent;
  }
  .button, a.button { background: var(--amber); color: var(--amber-ink); }
  .button-ghost, a.button-ghost {
    background: transparent; color: var(--paper); border-color: var(--line);
  }
  .button-danger {
    background: transparent; color: var(--danger);
    border-color: color-mix(in srgb, var(--danger) 40%, transparent);
  }
  /* Must beat a.button-ghost / a.button (0,1,1) or links keep the large padding */
  .button-small,
  a.button-small,
  button.button-small {
    padding: 6px 10px;
    font-size: 12px;
  }
  .badge, .admin .badge { display: inline-flex; }
  .badge.quiet {
    border: 1px solid var(--line); border-radius: 999px;
    padding: 2px 8px; font-size: 11px; color: var(--paper-dim);
  }

  .gate-screen { min-height: 100vh; display: grid; place-items: center; padding: 24px 16px; }
  .gate-card {
    width: min(420px, 100%); background: var(--bg-panel);
    border: 1px solid var(--line); border-radius: var(--radius-2xl);
    padding: 28px 24px; display: flex; flex-direction: column; gap: 12px;
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.3), 0 0 40px rgba(255, 180, 84, 0.06);
  }
  .gate-card label {
    display: flex; flex-direction: column; gap: 4px;
    font-size: 13px; font-weight: 650; color: var(--admin-ink);
  }
  .gate-card p { color: var(--admin-ink-muted); font-weight: 500; }
  .gate-card a { color: var(--admin-ink-muted); font-size: 13px; }

  #toasts {
    position: fixed; right: 12px; bottom: 12px; z-index: 200;
    display: flex; flex-direction: column; gap: 8px;
    width: min(360px, calc(100% - 24px));
  }
  .toast {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 12px;
    background: var(--bg-toast); color: var(--paper);
    border: 1px solid var(--green-eco); border-radius: var(--radius);
    padding: 12px 14px; box-shadow: var(--room-shadow); font-size: 14px;
  }
  .toast-msg { flex: 1 1 auto; min-width: 0; }
  .toast-action {
    flex: 0 0 auto;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.02em;
    color: var(--amber);
    text-decoration: none;
    white-space: nowrap;
  }
  .toast-action:hover { color: var(--paper); text-decoration: underline; }
  .toast.is-error { border-color: var(--danger); color: var(--danger); }
  .toast.is-out { opacity: 0; transform: translateY(6px); transition: 0.2s ease; }
  @media (prefers-reduced-motion: reduce) {
    .toast.is-out { transition: none; }
  }

  img[data-fallback] {
    opacity: 0;
    transition: opacity 0.28s ease;
  }
  img[data-fallback].is-loaded {
    opacity: 1;
  }
  @media (prefers-reduced-motion: reduce) {
    img[data-fallback] { opacity: 1; transition: none; }
  }

  .site-footer {
    position: relative;
    margin-top: auto;
    padding: 18px 0 calc(18px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-deep) 40%, transparent);
    color: var(--paper-dim);
  }
  html[data-theme="day"] .site-footer {
    background: color-mix(in srgb, var(--bg-deep) 28%, transparent);
  }
  .site-footer-inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    column-gap: clamp(12px, 3vw, 28px);
    row-gap: 10px;
  }
  .site-footer-brand {
    min-width: 0;
  }
  .site-footer-copy {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.45;
    color: var(--paper-dim);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .site-footer-nav {
    --footer-link-accent: var(--amber);
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: 8px 16px;
    flex: 0 1 auto;
    min-width: 0;
  }
  .site-footer-link {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    max-width: none;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: var(--paper-dim);
    text-decoration: none;
    font: inherit;
    font-size: 12.5px;
    font-weight: 600;
    letter-spacing: 0.01em;
    white-space: nowrap;
    cursor: pointer;
    transition: color 0.2s ease;
  }
  .site-footer-link > span:last-child {
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .site-footer-link-ico {
    flex: 0 0 auto;
    font-size: 12px;
    line-height: 1;
    color: var(--footer-link-accent);
  }
  .site-footer-link:hover {
    color: var(--footer-link-accent);
    background: transparent;
    border-color: transparent;
  }
  .site-footer-cookie-btn:hover {
    color: var(--footer-link-accent);
  }
  @media (max-width: 720px) {
    .site-footer-inner {
      grid-template-columns: 1fr;
      justify-items: start;
    }
    .site-footer-nav {
      justify-content: flex-start;
      width: 100%;
    }
    .site-footer-copy {
      white-space: normal;
    }
  }
  @media (max-width: 520px) {
    .site-footer {
      padding: 16px 0 calc(16px + env(safe-area-inset-bottom, 0px));
    }
    .site-footer-copy,
    .site-footer-link {
      font-size: 12px;
    }
    .site-footer-link {
      min-height: 44px;
    }
  }

  /* ---------- Cookie Consent (GDPR / ePrivacy) ---------- */
  #cookie-consent-root {
    position: fixed;
    inset: auto 0 0 auto;
    z-index: 240;
    pointer-events: none;
  }
  #cookie-consent-root.is-visible {
    pointer-events: auto;
  }
  .cookie-consent {
    padding: 16px;
    padding-bottom: calc(16px + env(safe-area-inset-bottom, 0px));
  }
  .cookie-consent-card {
    width: min(420px, calc(100vw - 32px));
    margin-left: auto;
    padding: 18px 18px 14px;
    border: 1px solid color-mix(in srgb, var(--amber) 28%, var(--line));
    border-radius: 18px;
    background:
      linear-gradient(
        160deg,
        color-mix(in srgb, var(--bg-panel) 82%, transparent),
        color-mix(in srgb, var(--bg-deep, #0b0e13) 72%, transparent)
      );
    backdrop-filter: blur(18px) saturate(1.15);
    -webkit-backdrop-filter: blur(18px) saturate(1.15);
    box-shadow:
      0 24px 48px rgba(0, 0, 0, 0.45),
      0 0 0 1px color-mix(in srgb, var(--amber) 10%, transparent),
      0 0 28px var(--amber-glow),
      inset 0 1px 0 rgba(255, 255, 255, 0.04);
    color: var(--paper);
    transform: translateY(12px);
    opacity: 0;
    transition: transform 0.28s ease, opacity 0.28s ease;
  }
  html[data-theme="day"] .cookie-consent-card {
    background:
      linear-gradient(
        160deg,
        color-mix(in srgb, #fff 88%, transparent),
        color-mix(in srgb, #f3f6fa 78%, transparent)
      );
    box-shadow:
      0 18px 40px rgba(15, 23, 42, 0.14),
      0 0 0 1px color-mix(in srgb, var(--amber) 14%, transparent),
      0 0 22px var(--amber-glow);
  }
  #cookie-consent-root.is-ready .cookie-consent-card {
    transform: translateY(0);
    opacity: 1;
  }
  .cookie-consent-head {
    display: grid;
    gap: 8px;
    margin-bottom: 14px;
  }
  .cookie-consent-status {
    display: inline-flex;
    align-items: center;
    gap: 8px;
  }
  .cookie-consent-status-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--amber);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--amber) 22%, transparent), 0 0 12px var(--amber-glow);
  }
  .cookie-consent-status-label {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--amber);
  }
  .cookie-consent-title {
    margin: 0;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -0.03em;
    line-height: 1.25;
    color: var(--admin-ink, var(--paper));
  }
  .cookie-consent-lead {
    margin: 0;
    font-size: 13px;
    line-height: 1.45;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .cookie-consent-actions {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
  }
  .cookie-consent-btn {
    appearance: none;
    width: 100%;
    min-height: 42px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
    color: var(--admin-ink, var(--paper));
    font: inherit;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.01em;
    cursor: pointer;
    transition: border-color 0.18s ease, background-color 0.18s ease, color 0.18s ease;
  }
  .cookie-consent-btn:hover {
    border-color: color-mix(in srgb, var(--amber) 45%, var(--line));
    background: color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .cookie-consent-btn:focus-visible {
    outline: 2px solid var(--amber);
    outline-offset: 2px;
  }
  .cookie-consent-btn-save {
    margin-top: 4px;
    border-color: color-mix(in srgb, var(--amber) 50%, var(--line));
    color: var(--amber);
  }
  .cookie-consent-panel {
    margin-top: 12px;
    border-top: 1px solid var(--line);
    overflow: hidden;
  }
  .cookie-consent-panel[hidden] {
    display: none;
  }
  .cookie-consent-panel-inner {
    display: grid;
    gap: 8px;
    padding-top: 12px;
  }
  .cookie-consent-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
    padding: 10px 12px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: color-mix(in srgb, var(--admin-ink, #fff) 3%, transparent);
    cursor: pointer;
  }
  .cookie-consent-row.is-locked {
    cursor: default;
    opacity: 0.92;
  }
  .cookie-consent-row-copy {
    display: grid;
    gap: 2px;
    min-width: 0;
  }
  .cookie-consent-row-title {
    font-size: 13px;
    font-weight: 650;
    color: var(--admin-ink, var(--paper));
  }
  .cookie-consent-row-hint {
    font-size: 10.5px;
    letter-spacing: 0.04em;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .cookie-consent-row input {
    width: 16px;
    height: 16px;
    margin: 0;
    flex-shrink: 0;
    accent-color: var(--amber);
  }
  .cookie-consent-foot {
    margin: 12px 0 0;
    font-size: 10.5px;
    letter-spacing: 0.04em;
    line-height: 1.4;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  @media (max-width: 560px) {
    #cookie-consent-root {
      inset: auto 0 0 0;
    }
    .cookie-consent {
      padding: 12px;
      padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    }
    .cookie-consent-card {
      width: 100%;
      margin: 0;
      border-radius: 16px 16px 12px 12px;
    }
  }
  @media (prefers-reduced-motion: reduce) {
    .cookie-consent-card {
      transition: none;
    }
  }
  .footer-admin-block {
    margin-top: 4px;
  }
  .footer-admin-block textarea[name="footerText"] {
    min-height: 78px;
    font-size: 13.5px;
    line-height: 1.45;
  }
  .footer-link-admin-rows {
    gap: 10px;
  }
  .footer-link-admin-row .footer-link-visible,
  .admin label.admin-flag-toggle.admin-flag-toggle--footer {
    display: inline-flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
    align-self: end;
    min-height: 38px;
    margin: 0;
    padding: 6px 10px 6px 8px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--line) 85%, transparent);
    background:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 92%, #fff 8%) 0%,
        var(--bg-overlay, var(--bg-panel)) 100%
      );
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
    cursor: pointer;
    user-select: none;
    transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease, opacity 0.18s ease;
  }
  html[data-theme="day"] .footer-link-admin-row .footer-link-visible {
    background: color-mix(in srgb, #fff 88%, var(--line));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.75);
  }
  .footer-link-admin-row .footer-link-visible:hover {
    border-color: color-mix(in srgb, var(--line) 40%, var(--amber) 60%);
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 88%, var(--amber) 12%);
  }
  .footer-link-admin-row .footer-link-visible:has(input:checked) {
    border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 80%, var(--amber) 20%);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.06),
      0 8px 18px -16px color-mix(in srgb, var(--amber) 70%, transparent);
  }
  .footer-link-admin-row .footer-link-visible:not(:has(input:checked)) {
    opacity: 0.88;
  }
  .footer-link-admin-row .footer-link-visible input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    pointer-events: none;
  }
  .footer-link-admin-row .footer-link-visible .admin-flag-toggle-track {
    position: relative;
    flex: 0 0 auto;
    width: 36px;
    height: 20px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--bg-chip, var(--bg-panel)) 70%, #000 30%);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--line) 70%, transparent);
  }
  html[data-theme="day"] .footer-link-admin-row .footer-link-visible .admin-flag-toggle-track {
    background: color-mix(in srgb, var(--line) 35%, #fff);
  }
  .footer-link-admin-row .footer-link-visible .admin-flag-toggle-thumb {
    position: absolute;
    top: 3px;
    left: 3px;
    width: 14px;
    height: 14px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.35);
    transition: transform 0.18s ease;
  }
  .footer-link-admin-row .footer-link-visible input:checked + .admin-flag-toggle-track {
    background: color-mix(in srgb, var(--amber) 72%, #1a140c);
  }
  .footer-link-admin-row .footer-link-visible input:checked + .admin-flag-toggle-track .admin-flag-toggle-thumb {
    transform: translateX(16px);
  }
  .footer-link-admin-row .footer-link-visible input:focus-visible + .admin-flag-toggle-track {
    outline: 2px solid color-mix(in srgb, var(--amber) 70%, transparent);
    outline-offset: 2px;
  }
  .footer-link-admin-row .footer-link-visible .admin-flag-toggle-copy {
    flex: 0 0 auto;
  }
  .footer-link-admin-row .footer-link-visible .admin-flag-toggle-title {
    margin: 0;
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--admin-ink, var(--paper));
    white-space: nowrap;
  }
  .footer-link-admin-row .footer-link-visible .admin-flag-toggle-state {
    flex: 0 0 auto;
    min-width: 2.1rem;
    margin-left: 2px;
    padding: 3px 7px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 88%, var(--line));
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1.1;
    text-align: center;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .footer-link-admin-row .footer-link-visible .admin-flag-toggle-state::before {
    content: "Off";
  }
  .footer-link-admin-row .footer-link-visible:has(input:checked) .admin-flag-toggle-state {
    border-color: color-mix(in srgb, var(--amber) 45%, transparent);
    background: color-mix(in srgb, var(--amber) 22%, transparent);
    color: color-mix(in srgb, var(--amber) 72%, var(--admin-ink, #fff));
  }
  .footer-link-admin-row .footer-link-visible:has(input:checked) .admin-flag-toggle-state::before {
    content: "On";
  }
  @media (max-width: 719px) {
    .footer-link-admin-row .footer-link-visible {
      align-self: stretch;
      justify-content: flex-start;
      width: 100%;
    }
  }

  /* —— Informações / Legal (Architectural Gallery accordion) —— */
  .informacoes-page {
    --info-accent: var(--showroom-accent, var(--amber));
    --info-accent-glow: var(--showroom-accent-glow, var(--amber-glow));
    position: relative;
    isolation: isolate;
    background:
      radial-gradient(ellipse 80% 50% at 50% -10%, color-mix(in srgb, var(--info-accent) 14%, transparent), transparent 55%),
      linear-gradient(180deg, #090a0f 0%, var(--bg-deep) 42%, var(--bg) 100%);
    padding: clamp(40px, 7vw, 88px) 0 clamp(56px, 9vw, 112px);
    min-height: 60vh;
  }
  html[data-theme="day"] .informacoes-page {
    background:
      radial-gradient(ellipse 70% 45% at 50% -8%, color-mix(in srgb, var(--info-accent) 12%, transparent), transparent 50%),
      linear-gradient(180deg, #e8edf4 0%, var(--bg) 55%);
  }
  .informacoes-glow {
    pointer-events: none;
    position: absolute;
    inset: 12% 10% auto;
    height: 40%;
    background: radial-gradient(circle at 50% 40%, var(--info-accent-glow), transparent 70%);
    opacity: 0.55;
    filter: blur(8px);
    z-index: 0;
  }
  .informacoes-wrap {
    position: relative;
    z-index: 1;
    max-width: 860px;
  }
  .informacoes-hero {
    display: flex;
    flex-direction: column;
    gap: 12px;
    margin-bottom: clamp(28px, 4vw, 44px);
  }
  .informacoes-kicker {
    margin: 0;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--info-accent);
  }
  .informacoes-title {
    margin: 0;
    font-size: clamp(28px, 4.5vw, 42px);
    font-weight: 650;
    letter-spacing: -0.03em;
    line-height: 1.12;
    color: var(--paper);
  }
  .informacoes-lead {
    margin: 0;
    max-width: 54ch;
    font-size: 15px;
    line-height: 1.55;
    color: var(--paper-dim);
  }
  .info-acc {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .info-acc-item {
    border: 1px solid color-mix(in srgb, var(--paper) 8%, transparent);
    border-radius: 14px;
    background: color-mix(in srgb, #0c0e14 92%, transparent);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 0 0 1px color-mix(in srgb, #000 35%, transparent);
    transition: border-color 0.28s ease, box-shadow 0.28s ease, background 0.28s ease;
  }
  html[data-theme="day"] .info-acc-item {
    background: color-mix(in srgb, #ffffff 92%, transparent);
    border-color: color-mix(in srgb, var(--line) 90%, transparent);
    box-shadow: 0 10px 28px rgba(30, 45, 70, 0.06);
  }
  .info-acc-item.is-open {
    border-color: color-mix(in srgb, var(--info-accent) 55%, var(--line));
    box-shadow:
      0 0 0 1px color-mix(in srgb, var(--info-accent) 28%, transparent),
      0 0 28px color-mix(in srgb, var(--info-accent) 12%, transparent);
    background: color-mix(in srgb, var(--info-accent) 5%, #0c0e14);
  }
  html[data-theme="day"] .info-acc-item.is-open {
    background: color-mix(in srgb, var(--info-accent) 6%, #fff);
  }
  .info-acc-trigger {
    appearance: none;
    width: 100%;
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    align-items: center;
    gap: 14px 16px;
    padding: 18px 18px 18px 16px;
    margin: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    border-radius: 14px;
  }
  .info-acc-trigger:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--info-accent) 70%, transparent);
    outline-offset: 2px;
  }
  .info-acc-index {
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.08em;
    color: color-mix(in srgb, var(--paper-dim) 85%, transparent);
    min-width: 2ch;
    transition: color 0.25s ease;
  }
  .info-acc-item.is-open .info-acc-index {
    color: var(--info-accent);
  }
  .info-acc-titles {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
  }
  .info-acc-title {
    font-size: clamp(15px, 2.2vw, 17px);
    font-weight: 650;
    letter-spacing: -0.01em;
    color: var(--paper);
  }
  .info-acc-sub {
    font-size: 12px;
    color: var(--paper-dim);
    letter-spacing: 0.01em;
  }
  .info-acc-chevron {
    display: grid;
    place-items: center;
    width: 32px;
    height: 32px;
    border-radius: 999px;
    color: var(--paper-dim);
    border: 1px solid color-mix(in srgb, var(--paper) 10%, transparent);
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1), color 0.25s ease, border-color 0.25s ease;
  }
  .info-acc-item.is-open .info-acc-chevron {
    transform: rotate(180deg);
    color: var(--info-accent);
    border-color: color-mix(in srgb, var(--info-accent) 40%, transparent);
  }
  .info-acc-panel {
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows 0.38s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .info-acc-item.is-open .info-acc-panel {
    grid-template-rows: 1fr;
  }
  .info-acc-panel-inner {
    overflow: hidden;
    min-height: 0;
  }
  .info-acc-body {
    padding: 0 18px 20px 16px;
    padding-left: calc(16px + 2ch + 16px);
    display: flex;
    flex-direction: column;
    gap: 12px;
    color: var(--paper-dim);
    font-size: 14px;
    line-height: 1.6;
  }
  @media (max-width: 560px) {
    .info-acc-body {
      padding-left: 18px;
    }
  }
  .info-acc-body p { margin: 0; }
  .info-acc-heading {
    margin: 4px 0 0 !important;
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: color-mix(in srgb, var(--info-accent) 75%, var(--paper));
  }
  .info-acc-empty { margin: 0; font-size: 13px; }

  /* Admin · Informações / Legal */
  .informacoes-admin-form {
    gap: 18px;
  }
  .informacoes-admin-head {
    align-items: flex-start;
  }
  .informacoes-admin-eyebrow {
    margin: 0 0 6px;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--cool);
  }
  .informacoes-admin-meta {
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background:
      linear-gradient(
        165deg,
        color-mix(in srgb, var(--cool) 6%, var(--bg-panel)) 0%,
        var(--bg-panel) 55%
      );
  }
  .informacoes-admin-sections {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .informacoes-admin-sections-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 10px 16px;
  }
  .informacoes-admin-sections-head h3 {
    margin: 0;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--admin-ink, var(--paper));
  }
  .informacoes-admin-sections-head .hint {
    margin: 4px 0 0;
  }
  .informacoes-admin-list {
    display: flex;
    flex-direction: column;
    gap: 12px;
  }
  .informacoes-admin-card {
    border: 1px solid var(--line);
    border-radius: 14px;
    background: color-mix(in srgb, var(--bg-deep) 22%, var(--bg-panel));
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 0;
    overflow: hidden;
    transition: border-color 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease;
  }
  .informacoes-admin-card.is-visible {
    border-color: color-mix(in srgb, var(--cool) 22%, var(--line));
  }
  .informacoes-admin-card.is-section-open {
    border-color: color-mix(in srgb, var(--cool) 42%, var(--line));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--cool) 14%, transparent);
  }
  .informacoes-admin-card.is-hidden-section {
    opacity: 0.72;
    border-style: dashed;
  }
  .informacoes-admin-card-head {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 10px;
    padding: 4px 8px 4px 4px;
    background: color-mix(in srgb, var(--bg-deep) 35%, transparent);
  }
  .informacoes-admin-card.is-section-open .informacoes-admin-card-head {
    border-bottom: 1px solid var(--line);
  }
  .informacoes-admin-card-toggle {
    appearance: none;
    flex: 1 1 200px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-width: 0;
    margin: 0;
    padding: 8px 10px;
    border: 0;
    border-radius: 10px;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background 0.18s ease;
  }
  .informacoes-admin-card-toggle:hover {
    background: color-mix(in srgb, var(--cool) 8%, transparent);
  }
  .informacoes-admin-card-toggle:focus-visible {
    outline: 2px solid color-mix(in srgb, var(--cool) 65%, transparent);
    outline-offset: 1px;
  }
  .informacoes-admin-card-label {
    display: flex;
    align-items: center;
    gap: 12px;
    min-width: 0;
  }
  .informacoes-admin-card-chevron {
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    flex: 0 0 auto;
    border-radius: 999px;
    color: var(--paper-dim);
    border: 1px solid color-mix(in srgb, var(--paper) 10%, transparent);
    transition: transform 0.32s cubic-bezier(0.16, 1, 0.3, 1), color 0.2s ease, border-color 0.2s ease;
  }
  .informacoes-admin-card.is-section-open .informacoes-admin-card-chevron {
    transform: rotate(180deg);
    color: var(--cool);
    border-color: color-mix(in srgb, var(--cool) 40%, transparent);
  }
  .informacoes-admin-card-body {
    display: none;
  }
  .informacoes-admin-card.is-section-open > .informacoes-admin-card-body {
    display: block;
  }
  .informacoes-admin-card-index {
    display: grid;
    place-items: center;
    width: 36px;
    height: 36px;
    flex: 0 0 auto;
    border-radius: 10px;
    border: 1px solid color-mix(in srgb, var(--cool) 28%, var(--line));
    background: color-mix(in srgb, var(--cool) 10%, transparent);
    color: var(--cool);
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.06em;
  }
  .informacoes-admin-card.is-hidden-section .informacoes-admin-card-index {
    border-color: var(--line);
    background: transparent;
    color: var(--paper-dim);
  }
  .informacoes-admin-card-label-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  .informacoes-admin-card-label-copy strong {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--paper-dim);
  }
  .informacoes-admin-card-preview {
    font-size: 14px;
    font-weight: 650;
    color: var(--admin-ink, var(--paper));
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: min(42vw, 280px);
  }
  .informacoes-admin-card-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
  }
  .informacoes-admin-fields {
    padding: 14px;
    gap: 12px;
  }
  .informacoes-admin-fields textarea[name="sectionContent"] {
    min-height: 160px;
    font-size: 13.5px;
    line-height: 1.5;
  }

  /* Visível switch — cyan accent for Informações */
  .admin label.admin-flag-toggle.admin-flag-toggle--info,
  .admin-flag-toggle.admin-flag-toggle--info {
    gap: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    border: 1px solid var(--line);
    background:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--bg-deep) 18%, var(--bg-panel)) 0%,
        var(--bg-panel) 100%
      );
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .admin-flag-toggle--info:hover {
    border-color: color-mix(in srgb, var(--cool) 40%, var(--line));
  }
  .admin-flag-toggle--info:has(input:checked) {
    border-color: color-mix(in srgb, var(--cool) 48%, var(--line));
    background:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--cool) 12%, var(--bg-panel)) 0%,
        color-mix(in srgb, var(--cool) 5%, var(--bg-panel)) 100%
      );
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--cool) 16%, transparent);
  }
  .admin-flag-toggle--info:not(:has(input:checked)) {
    opacity: 0.9;
  }
  .admin-flag-toggle--info .admin-flag-toggle-track {
    width: 44px;
    height: 26px;
    background: color-mix(in srgb, var(--line) 75%, #64748b 25%);
  }
  .admin-flag-toggle--info .admin-flag-toggle-thumb {
    width: 20px;
    height: 20px;
    top: 2px;
    left: 2px;
  }
  .admin-flag-toggle--info input:checked + .admin-flag-toggle-track {
    background: var(--cool);
    border-color: transparent;
  }
  .admin-flag-toggle--info input:checked + .admin-flag-toggle-track .admin-flag-toggle-thumb {
    transform: translateX(18px);
  }
  .admin-flag-toggle--info input:focus-visible + .admin-flag-toggle-track {
    outline: 2px solid var(--cool);
    outline-offset: 3px;
  }
  .admin-flag-toggle--info .admin-flag-toggle-title {
    font-size: 13.5px;
  }
  .admin-flag-toggle--info .admin-flag-toggle-state {
    flex: 0 0 auto;
    min-width: 52px;
    padding: 4px 8px;
    border-radius: 999px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    text-align: center;
    color: var(--paper-dim);
    background: color-mix(in srgb, var(--line) 55%, transparent);
    border: 1px solid var(--line);
  }
  .admin-flag-toggle--info .admin-flag-toggle-state::before {
    content: "Oculto";
  }
  .admin-flag-toggle--info:has(input:checked) .admin-flag-toggle-state {
    color: color-mix(in srgb, var(--cool) 20%, #041018);
    background: color-mix(in srgb, var(--cool) 78%, #fff);
    border-color: transparent;
  }
  html[data-theme="day"] .admin-flag-toggle--info:has(input:checked) .admin-flag-toggle-state {
    color: #063344;
    background: color-mix(in srgb, var(--cool) 55%, #fff);
  }
  .admin-flag-toggle--info:has(input:checked) .admin-flag-toggle-state::before {
    content: "Visível";
  }
  fieldset { border: 1px solid var(--line); border-radius: var(--radius); padding: 12px; }
  legend { padding: 0 6px; color: var(--paper-dim); font-size: 12px; }

  .pages-layout {
    display: grid; grid-template-columns: 1fr; gap: 16px; align-items: start;
  }
  @media (min-width: 860px) {
    .pages-layout { grid-template-columns: 200px minmax(0, 1fr); gap: 20px; }
  }
  .pages-nav {
    display: flex;
    flex-direction: row;
    gap: 6px;
    overflow-x: auto;
    padding: 8px;
    margin: 0 -4px 4px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bg-panel);
    position: sticky;
    top: 0;
    z-index: 12;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }
  .pages-nav::-webkit-scrollbar { display: none; }
  @media (max-width: 859px) {
    .admin .pages-layout .pages-panel .admin-sticky-head,
    .admin .pages-layout .pages-panel .showroom-sticky-head,
    .admin .pages-layout .pages-panel .projeto-edit-sticky {
      top: 3.65rem;
    }
  }
  @media (min-width: 860px) {
    .pages-nav {
      flex-direction: column;
      position: sticky;
      top: 16px;
      margin: 0;
      padding: 10px;
      border-radius: var(--radius-2xl);
      overflow: visible;
    }
  }
  .pages-nav-link {
    color: var(--admin-ink-muted); text-decoration: none; font-size: 13.5px; font-weight: 650;
    padding: 9px 12px; border-radius: var(--radius-sm); white-space: nowrap;
    border: 1px solid transparent;
    flex: 0 0 auto;
  }
  .pages-nav-link:hover { color: var(--admin-ink); background: var(--bg-panel-hover); }
  .pages-nav-link.is-active {
    color: var(--amber); background: rgba(255, 180, 84, 0.12);
    border-color: rgba(255, 180, 84, 0.28);
  }
  .pages-panel {
    min-width: 0;
    display: flex; flex-direction: column; gap: 14px;
  }
  .pages-panel > .admin-card:not(form) {
    display: flex; flex-direction: column; gap: 14px;
  }
  .pages-panel > form.admin-card {
    gap: 14px;
  }
  .pages-panel > .admin-card > .pages-form-head {
    margin-bottom: 0;
  }
  /* Showroom (Tutoriais, Novidades, ?): cabe�alho + Guardar acompanham o scroll da lista */
  .showroom-admin-flow {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
  }
  .admin .showroom-admin-flow > .showroom-sticky-head,
  .admin form.admin-card > .pages-form-head.admin-sticky-head,
  .admin form.admin-card > .admin-sticky-head {
    position: sticky;
    top: 0;
    z-index: 8;
    align-self: stretch;
    width: 100%;
    box-sizing: border-box;
    margin: 0;
    padding: clamp(14px, 1.8vw, 20px);
    border: 1px solid var(--line);
    border-radius: var(--radius-2xl);
    /* Fundo sólido (dia = branco): evita o título sticky ficar transparente ao scroll. */
    background: var(--bg-panel);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.14);
  }
  html[data-theme="day"] .admin .showroom-admin-flow > .showroom-sticky-head,
  html[data-theme="day"] .admin form.admin-card > .pages-form-head.admin-sticky-head,
  html[data-theme="day"] .admin form.admin-card > .admin-sticky-head {
    background: var(--bg-panel);
    box-shadow: 0 6px 20px rgba(15, 23, 42, 0.1);
  }
  .admin form.admin-card > .pages-form-head.admin-sticky-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px 16px;
    overflow: visible;
  }
  .admin form.admin-card > .pages-form-head.admin-sticky-head .pages-save-bar {
    flex-shrink: 0;
    margin-left: auto;
  }
  .admin .showroom-admin-flow > .showroom-sticky-head .pages-save-bar {
    flex-shrink: 0;
    margin-left: auto;
  }
  .admin .showroom-admin-flow > .showroom-sticky-head .pages-save-bar .button {
    min-height: 40px;
    min-width: 7.5rem;
  }
  .pages-panel > .admin-card > fieldset {
    margin: 0;
  }
  .pages-panel > .admin-card > .form-actions {
    margin-top: 0; padding-top: 4px;
  }
  .color-field {
    display: flex; align-items: center; gap: 10px;
  }
  .color-field input[type="color"] {
    width: 44px; height: 38px; padding: 2px;
    border: 1px solid var(--line); border-radius: var(--radius-sm);
    background: var(--bg-overlay); cursor: pointer; flex-shrink: 0;
  }
  .color-field input[type="text"],
  .color-field input:not([type="color"]) {
    flex: 1; min-width: 0;
  }
  .hero-cta-admin {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg-overlay);
    padding: 12px 14px;
  }
  .hero-cta-admin-head {
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; flex-wrap: wrap; margin-bottom: 10px;
  }
  .hero-cta-admin-tools {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
    flex-wrap: wrap;
    margin-left: auto;
  }
  .hero-cta-admin-title {
    margin: 0;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: -0.01em;
    text-transform: none;
    color: var(--admin-ink);
  }
  .nav-admin-block {
    margin-top: 10px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg-soft);
    overflow: hidden;
  }
  .nav-admin-block.is-open {
    border-color: color-mix(in srgb, var(--line) 70%, var(--amber) 30%);
  }
  .nav-admin-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    width: 100%;
    margin: 0;
    padding: 14px 16px;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
  }
  .nav-admin-toggle:hover {
    background: color-mix(in srgb, var(--bg-overlay) 70%, transparent);
  }
  .nav-admin-toggle-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  .nav-admin-toggle-copy strong {
    font-size: 15px;
    font-weight: 650;
    letter-spacing: -0.01em;
  }
  .nav-admin-chevron {
    flex: none;
    width: 10px;
    height: 10px;
    border-right: 1.5px solid var(--admin-ink-muted);
    border-bottom: 1.5px solid var(--admin-ink-muted);
    transform: rotate(45deg);
    transition: transform 0.2s ease;
  }
  .nav-admin-block.is-open .nav-admin-chevron {
    transform: rotate(225deg);
  }
  .nav-admin-panel {
    padding: 0 16px 16px;
    border-top: 1px solid var(--line);
  }
  .nav-admin-panel[hidden] {
    display: none;
  }
  .nav-admin-panel-hint {
    margin: 12px 0 14px;
  }
  .nav-admin-list { display: flex; flex-direction: column; gap: 12px; }
  .nav-admin-item {
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg-overlay);
    overflow: hidden;
  }
  .nav-admin-row,
  .nav-admin-child {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr) auto;
    gap: 10px;
    align-items: start;
    padding: 12px;
  }
  .nav-admin-row {
    border-bottom: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  }
  .nav-admin-order {
    display: flex; flex-direction: column; gap: 4px;
  }
  .nav-admin-fields {
    margin: 0;
  }
  .nav-admin-fields.form-grid {
    grid-template-columns: 1fr 1fr auto;
    align-items: end;
  }
  .admin label.admin-flag-toggle.admin-flag-toggle--nav,
  .admin-flag-toggle.admin-flag-toggle--nav {
    gap: 10px;
    padding: 8px 12px;
    min-height: 42px;
    border-radius: 10px;
    align-self: end;
    white-space: nowrap;
  }
  .admin-flag-toggle--nav .admin-flag-toggle-track {
    width: 38px;
    height: 22px;
  }
  .admin-flag-toggle--nav .admin-flag-toggle-thumb {
    width: 16px;
    height: 16px;
  }
  .admin-flag-toggle--nav input:checked + .admin-flag-toggle-track .admin-flag-toggle-thumb {
    transform: translateX(16px);
  }
  .admin-flag-toggle--nav .admin-flag-toggle-title {
    font-size: 13px;
    flex: 0 0 auto;
  }
  .nav-admin-subs {
    padding: 10px 12px 12px;
    background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
  }
  .nav-admin-subs-head {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 8px;
  }
  .nav-admin-subs-label {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-ink-muted);
  }
  .nav-admin-subs-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-bottom: 8px;
  }
  .nav-admin-child {
    padding: 10px;
    border: 1px dashed color-mix(in srgb, var(--line) 80%, var(--amber) 20%);
    border-radius: var(--radius-sm);
    background: color-mix(in srgb, var(--bg-overlay) 88%, var(--amber) 4%);
  }
  .nav-admin-subs-empty {
    margin: 0 0 4px;
    font-size: 12.5px;
    color: var(--admin-ink-muted);
  }
  @media (max-width: 720px) {
    .nav-admin-row,
    .nav-admin-child {
      grid-template-columns: 1fr;
    }
    .nav-admin-order { flex-direction: row; }
    .nav-admin-fields.form-grid {
      grid-template-columns: 1fr;
    }
  }
  .subfiltro-list { display: flex; flex-direction: column; gap: 14px; margin: 12px 0 18px; }
  .subfiltro-card {
    border: 1px solid var(--line); border-radius: var(--radius);
    background: var(--bg-soft); padding: 14px 16px;
  }
  .subfiltro-card-head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 12px; flex-wrap: wrap;
  }
  .subfiltro-card-head .muted { display: block; margin-top: 2px; }
  .subfiltro-tipo-label { margin: 12px 0 8px; }
  .subfiltro-check-grid {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 8px 12px;
  }
  .subfiltro-check {
    display: flex; align-items: flex-start; gap: 8px; margin: 0;
    padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius-sm);
    background: var(--bg-overlay); color: inherit; font: inherit; text-align: left;
    cursor: pointer; width: 100%; transition: var(--transition);
  }
  button.subfiltro-check:hover {
    border-color: var(--line-active); background: var(--bg-panel-hover);
  }
  .subfiltro-check input { margin-top: 3px; flex-shrink: 0; }
  .subfiltro-check strong { display: block; font-size: 13px; }

  /* Editar categoria ? Categorias principais */
  .cat-group-check-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 10px;
    margin-top: 4px;
  }
  .admin label.cat-group-check,
  .cat-group-check {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg-overlay, var(--bg-panel));
    cursor: pointer;
    user-select: none;
    min-width: 0;
    width: 100%;
    box-sizing: border-box;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .cat-group-check:hover {
    border-color: color-mix(in srgb, var(--line) 55%, var(--amber) 45%);
  }
  .cat-group-check:has(input:checked) {
    border-color: color-mix(in srgb, var(--line) 35%, var(--amber) 65%);
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 86%, var(--amber) 14%);
    box-shadow: 0 8px 20px -18px color-mix(in srgb, var(--amber) 70%, transparent);
  }
  .cat-group-check input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
  }
  .cat-group-check-box {
    position: relative;
    flex: 0 0 auto;
    width: 20px;
    height: 20px;
    border-radius: 6px;
    border: 1.5px solid color-mix(in srgb, var(--line) 70%, #64748b 30%);
    background: color-mix(in srgb, var(--bg-panel) 80%, transparent);
    transition: border-color 0.2s ease, background 0.2s ease;
  }
  .cat-group-check-box::after {
    content: "";
    position: absolute;
    inset: 3px;
    border-radius: 3px;
    background: transparent;
    transform: scale(0.4);
    opacity: 0;
    transition: transform 0.18s ease, opacity 0.18s ease, background 0.18s ease;
  }
  .cat-group-check input:checked + .cat-group-check-box {
    border-color: transparent;
    background: var(--amber);
  }
  .cat-group-check input:checked + .cat-group-check-box::after {
    background: var(--amber-ink, #1a140c);
    clip-path: polygon(14% 44%, 0 65%, 40% 100%, 100% 18%, 82% 0, 38% 62%);
    transform: scale(1);
    opacity: 1;
    border-radius: 0;
    inset: 4px;
  }
  .cat-group-check input:focus-visible + .cat-group-check-box {
    outline: 2px solid var(--amber);
    outline-offset: 3px;
  }
  .cat-group-check-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
  }
  .cat-group-check-title {
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.25;
    color: var(--admin-ink, var(--paper));
    overflow-wrap: anywhere;
  }
  .cat-group-check-slug {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.3;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .pages-form-head {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px 16px;
    flex-wrap: wrap;
    margin-bottom: 4px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--line);
    background: var(--bg-panel);
    min-width: 0;
  }
  .pages-form-head--section {
    position: static;
  }
  .pages-form-copy,
  .pages-form-head > div:first-child:not(.pages-save-bar) {
    flex: 1 1 200px;
    min-width: 0;
  }
  .pages-form-head h2 { margin: 0 0 4px; }
  .pages-form-head .hint {
    margin: 0;
    max-width: 52ch;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.45;
    color: var(--admin-ink-muted);
    overflow-wrap: anywhere;
  }
  .pages-save-bar {
    flex: 0 1 auto;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    align-items: center;
    max-width: 100%;
  }
  .pages-save-bar .button,
  .pages-save-bar .button-ghost,
  .pages-save-bar a.button {
    white-space: normal;
    text-align: center;
    line-height: 1.25;
  }
  .admin .row-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    min-width: 0;
  }
  .colunas-cat-list {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .colunas-cat {
    padding: 0;
    overflow: hidden;
  }
  .colunas-cat.is-open {
    background: var(--bg-panel);
  }
  .colunas-cat-bar {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 8px;
    align-items: center;
    padding-right: 10px;
  }
  .colunas-cat-toggle {
    width: 100%;
    min-width: 0;
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr) 28px;
    gap: 10px 12px;
    align-items: center;
    padding: 12px 8px 12px 14px;
    margin: 0;
    border: 0;
    background: transparent;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
    transition: background 0.2s ease;
  }
  .colunas-cat-bar:hover .colunas-cat-toggle {
    background: color-mix(in srgb, var(--admin-ink) 4%, transparent);
  }
  .colunas-cat-view {
    flex-shrink: 0;
    white-space: nowrap;
  }
  @media (max-width: 559px) {
    .colunas-cat-bar {
      grid-template-columns: minmax(0, 1fr);
      padding-right: 0;
      gap: 0;
    }
    .colunas-cat-view {
      justify-self: end;
      margin: 0 12px 10px;
    }
  }
  .colunas-cat-index {
    flex-shrink: 0;
    width: 28px;
    height: 28px;
    border-radius: 8px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 12px;
    font-weight: 700;
    color: var(--amber);
    background: color-mix(in srgb, var(--amber) 14%, transparent);
    border: 1px solid color-mix(in srgb, var(--amber) 35%, var(--line));
  }
  .colunas-cat-copy {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
  }
  .colunas-cat-copy strong {
    font-size: 14px;
    font-weight: 650;
    color: var(--admin-ink);
    overflow-wrap: anywhere;
  }
  .colunas-cat-copy .mono {
    font-size: 11.5px;
  }
  .colunas-cat-chevron {
    width: 28px;
    height: 28px;
    border-radius: 8px;
    position: relative;
    flex-shrink: 0;
    background: color-mix(in srgb, var(--admin-ink) 4%, transparent);
    transition: transform 0.25s ease, background 0.2s ease;
  }
  .colunas-cat-chevron::before {
    content: "";
    position: absolute;
    inset: 0;
    margin: auto;
    width: 8px;
    height: 8px;
    border-right: 2px solid var(--admin-ink-muted);
    border-bottom: 2px solid var(--admin-ink-muted);
    transform: translateY(-2px) rotate(45deg);
  }
  .colunas-cat.is-open .colunas-cat-chevron {
    transform: rotate(180deg);
    background: color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .colunas-cat-panel {
    border-top: 1px solid var(--line);
    animation: colunas-panel-in 0.28s ease;
  }
  .colunas-cat-panel[hidden] {
    display: none;
  }
  @keyframes colunas-panel-in {
    from {
      opacity: 0;
      transform: translateY(-6px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  .colunas-cat-panel-inner {
    padding: 4px 14px 16px;
  }
  .coluna-order-list { display: flex; flex-direction: column; gap: 6px; margin: 0 0 14px; }
  .coluna-label-block {
    flex: 1;
    min-width: 160px;
    display: flex;
    flex-direction: column;
    gap: 6px;
  }
  .coluna-custom-name {
    display: flex;
    flex-direction: column;
    gap: 4px;
    font-size: 11px;
    font-weight: 650;
    color: var(--paper-dim);
  }
  .coluna-custom-name input {
    width: 100%;
    max-width: 280px;
    font-size: 13px;
    font-weight: 500;
    padding: 6px 9px;
  }
  .coluna-order-row {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius-sm);
    background: var(--bg-overlay);
  }
  .coluna-num {
    width: 28px; height: 28px; border-radius: 50%;
    display: inline-flex; align-items: center; justify-content: center;
    font-size: 12px; font-weight: 700; color: #1a140e; background: var(--amber);
    flex-shrink: 0; box-shadow: 0 0 10px rgba(255, 180, 84, 0.25);
  }
  .coluna-label { flex: 1; min-width: 140px; font-size: 13px; }
  .related-variant-row-main {
    flex: 1;
    min-width: 180px;
    display: grid;
    gap: 6px;
  }
  .related-variant-label-field {
    display: grid;
    gap: 4px;
    margin: 0;
    font-size: 11px;
    font-weight: 650;
    color: var(--paper-dim);
  }
  .related-variant-label-field input {
    font: inherit;
    font-size: 13px;
    font-weight: 500;
    color: var(--paper);
  }
  .related-variant-row.is-missing {
    border-color: color-mix(in srgb, var(--amber) 45%, var(--line));
    background: color-mix(in srgb, var(--amber) 6%, transparent);
  }
  .badge-warn {
    display: inline-block;
    margin-left: 6px;
    padding: 1px 7px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: var(--amber);
    border: 1px solid color-mix(in srgb, var(--amber) 40%, var(--line));
    background: color-mix(in srgb, var(--amber) 12%, transparent);
  }
  .media-row {
    display: grid; grid-template-columns: 72px minmax(0, 1fr); gap: 12px; align-items: start;
    padding: 10px 0; border-bottom: 1px solid var(--line);
  }
  .media-preview {
    width: 72px; height: 72px; border-radius: var(--radius-sm); border: 1px solid var(--line);
    background: var(--bg-overlay); overflow: hidden;
    display: flex; align-items: center; justify-content: center;
  }
  .media-preview img { width: 100%; height: 100%; object-fit: cover; display: block; }
  .media-preview-pdf { background: rgba(255, 180, 84, 0.08); }
  .media-placeholder {
    font-size: 11px; font-weight: 700; letter-spacing: 0.06em; color: var(--paper-dim);
  }

  /* Marca do site — plain vs accent name boxes */
  .marca-name-split {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }
  .marca-name-box {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: color-mix(in srgb, var(--bg-deep) 22%, var(--bg-panel));
    min-width: 0;
  }
  .marca-name-box--accent {
    border-color: color-mix(in srgb, var(--amber) 42%, var(--line));
    background: color-mix(in srgb, var(--amber) 8%, var(--bg-panel));
  }
  .marca-name-box-label {
    margin: 0;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .marca-name-box--accent .marca-name-box-label {
    color: var(--amber);
  }
  .marca-name-box label {
    margin: 0;
  }
  .marca-name-box .hint {
    margin: 0;
  }
  .marca-name-preview {
    margin: 0;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: -0.02em;
    line-height: 1.1;
    color: var(--admin-ink, var(--paper));
  }
  .marca-name-preview span {
    color: var(--amber);
  }
  @media (max-width: 640px) {
    .marca-name-split {
      grid-template-columns: 1fr;
    }
  }
  .media-fields { min-width: 0; }
  .media-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
  .upload-status { margin: 0; }
  .upload-status.is-error { color: #ffb4a8; }
  @media (max-width: 560px) { .media-row { grid-template-columns: 1fr; } }
  .admin-card code, .pages-panel code {
    font-family: var(--font-mono); font-size: 11px; color: var(--amber);
    background: var(--bg-overlay); padding: 1px 5px; border-radius: 4px;
  }
  @media (max-width: 700px) {
    .subfiltro-check-grid { grid-template-columns: 1fr; }
  }
  button:disabled { opacity: 0.5; cursor: not-allowed; }

  /* ---------- SHOWROOM TIMELINE (Novidades + Reposição) ---------- */
  .showroom-page,
  .novidades-page {
    --showroom-accent: var(--amber);
    --showroom-accent-ink: var(--amber-ink);
    --showroom-accent-soft: rgba(255, 180, 84, 0.08);
    --showroom-accent-mid: rgba(255, 180, 84, 0.16);
    --showroom-accent-glow: var(--amber-glow);
    --showroom-accent-glow-strong: rgba(255, 180, 84, 0.45);
    position: relative;
    background:
      radial-gradient(ellipse 70% 40% at 10% 0%, var(--showroom-accent-soft), transparent 55%),
      radial-gradient(ellipse 50% 35% at 100% 20%, color-mix(in srgb, var(--showroom-accent) 10%, transparent), transparent 50%);
  }
  .novidades-hero {
    max-width: 40rem;
    margin-bottom: clamp(36px, 6vw, 56px);
    padding-bottom: 28px;
    border-bottom: 1px solid var(--line);
  }
  .novidades-kicker {
    font-size: 10px; font-weight: 700; letter-spacing: 0.22em;
    text-transform: uppercase; color: var(--showroom-accent); margin-bottom: 12px;
  }
  .novidades-hero h1 {
    font-size: clamp(32px, 5vw, 48px); font-weight: 650;
    letter-spacing: -0.035em; margin-bottom: 12px;
  }
  .novidades-lead {
    font-size: 15px; color: var(--paper-dim); line-height: 1.65; max-width: 48ch;
  }

  .novidades-timeline {
    display: flex; flex-direction: column; gap: 0;
    position: relative;
  }
  .novidade-drop {
    display: grid;
    grid-template-columns: 28px minmax(0, 1fr);
    gap: 18px 22px;
    padding: 8px 0 36px;
  }
  .novidade-rail {
    position: relative;
    display: flex; justify-content: center;
  }
  .novidade-rail::before {
    content: "";
    position: absolute;
    top: 10px; bottom: -36px; left: 50%;
    width: 1px;
    transform: translateX(-50%);
    background: linear-gradient(180deg, color-mix(in srgb, var(--showroom-accent) 55%, transparent), var(--line) 40%, transparent);
  }
  .novidade-drop:last-child .novidade-rail::before { bottom: 12px; }
  .novidade-node {
    position: relative; z-index: 1;
    width: 12px; height: 12px; margin-top: 8px;
    border-radius: 50%;
    background: var(--bg);
    border: 2px solid var(--showroom-accent);
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--showroom-accent) 12%, transparent),
      0 0 18px var(--showroom-accent-glow);
  }
  .novidade-drop.is-latest .novidade-node {
    background: var(--showroom-accent);
    box-shadow: 0 0 0 5px color-mix(in srgb, var(--showroom-accent) 16%, transparent),
      0 0 28px var(--showroom-accent-glow-strong);
  }

  .novidade-panel {
    min-width: 0;
    padding: 22px 24px 24px;
    border-radius: var(--radius-md);
    border: 1px solid var(--line);
    background:
      linear-gradient(145deg, color-mix(in srgb, var(--bg-panel) 92%, var(--showroom-accent-soft)), var(--bg-panel));
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.22);
    transition: var(--transition);
  }
  .novidade-drop.is-latest .novidade-panel {
    border-color: color-mix(in srgb, var(--showroom-accent) 35%, var(--line));
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28), 0 0 32px var(--showroom-accent-soft);
  }
  .novidade-meta {
    display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    margin-bottom: 10px;
  }
  .novidade-date {
    font-family: var(--font-mono);
    font-size: 12px; font-weight: 600; letter-spacing: 0.04em;
    color: var(--showroom-accent);
  }
  .novidade-pill {
    font-size: 10px; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
    color: var(--showroom-accent-ink); background: var(--showroom-accent);
    padding: 3px 8px; border-radius: 999px;
  }
  .novidade-title {
    font-size: clamp(20px, 2.6vw, 26px); font-weight: 650;
    letter-spacing: -0.025em; margin: 0 0 8px; line-height: 1.2;
  }
  .novidade-note {
    margin: 0 0 18px; color: var(--paper-dim); font-size: 14px; line-height: 1.6;
    max-width: 62ch;
  }

  .novidade-gallery {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
    gap: 12px;
  }
  .novidade-product {
    display: flex; flex-direction: column; min-width: 0;
    text-decoration: none; color: inherit;
    border-radius: var(--radius);
    border: 1px solid var(--line);
    background: var(--bg-deep);
    overflow: hidden;
    transition: var(--transition);
  }
  .novidade-product:hover {
    border-color: var(--line-active);
    transform: translateY(-2px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28), 0 0 18px var(--showroom-accent-soft);
  }
  .novidade-product-photo {
    display: block; aspect-ratio: 1 / 1; background: var(--bg-deep); overflow: hidden;
  }
  .novidade-product-photo img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .novidade-product:hover .novidade-product-photo img { transform: scale(1.05); }
  .novidade-product-body {
    display: flex; flex-direction: column; gap: 3px;
    padding: 10px 11px 12px;
  }
  .novidade-product-cat {
    font-size: 10px; letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--paper-dim); font-weight: 600;
  }
  .novidade-product-body strong {
    font-size: 13px; font-weight: 600; line-height: 1.3;
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }
  .novidade-product-price {
    margin-top: 4px; font-size: 13px; font-weight: 700; color: var(--showroom-accent);
  }

  .novidades-more {
    display: flex; justify-content: center;
    padding: 12px 0 8px;
  }
  .novidades-more-btn {
    min-width: 200px;
    border-style: dashed;
  }
  .novidades-end {
    text-align: center; font-size: 12px; padding: 8px 0 16px;
  }

  @media (max-width: 640px) {
    .novidade-drop { grid-template-columns: 18px minmax(0, 1fr); gap: 12px 14px; padding-bottom: 28px; }
    .novidade-panel { padding: 16px 14px 18px; }
    .novidade-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  }

  /* Promocoes timeline (estilo Novidades + validade) */
  .promocoes-page {
    --showroom-accent: #e11d48;
    --showroom-accent-soft: rgba(225, 29, 72, 0.12);
    background:
      radial-gradient(ellipse 55% 40% at 10% -6%, var(--showroom-accent-soft), transparent 58%),
      radial-gradient(ellipse 40% 30% at 100% 0%, rgba(127, 29, 29, 0.08), transparent 55%),
      var(--bg);
  }
  html[data-theme="day"] .promocoes-page {
    --showroom-accent: #be123c;
    --showroom-accent-soft: rgba(190, 18, 60, 0.08);
  }
  /* N�o usar filter no .promocao-drop: corta o ::before do rail (linha da timeline). */
  .promocao-drop.is-expired .novidade-panel {
    opacity: 0.62;
    border-color: color-mix(in srgb, var(--line) 85%, #64748b 15%);
    filter: grayscale(0.9);
  }
  .promocao-drop.is-expired .novidade-node {
    background: #94a3b8;
    border-color: #94a3b8;
    box-shadow: none;
  }
  .promocao-drop.is-expired .novidade-rail::before {
    background: linear-gradient(180deg, #94a3b8, var(--line) 40%, transparent);
  }
  .promocao-drop.is-expired .novidade-date,
  .promocao-drop.is-expired .novidade-title,
  .promocao-drop.is-expired .novidade-note {
    color: #94a3b8;
  }
  .promocao-pill-expired {
    color: #64748b;
    background: color-mix(in srgb, var(--line) 70%, transparent);
  }
  .promocao-product.is-expired {
    pointer-events: auto;
  }
  .promocao-product.is-expired .novidade-product-photo img {
    filter: grayscale(1);
    opacity: 0.85;
  }
  .promocao-expired-tag {
    display: inline-block;
    margin-top: 4px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #64748b;
  }
  .promocao-product-prices {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 6px 10px;
  }
  .promocao-sale {
    font-weight: 700;
    color: var(--showroom-accent, #e11d48);
  }
  .promocao-list {
    font-size: 12px;
    text-decoration: line-through;
    color: var(--paper-dim, #94a3b8);
  }
  .promocao-product-admin-row {
    flex-wrap: wrap;
    gap: 8px;
  }
  .promocao-price-field {
    display: flex;
    flex-direction: column;
    gap: 2px;
    font-size: 11px;
    min-width: 72px;
  }
  .promocao-price-field input {
    width: 88px;
    min-width: 0;
  }

  /* ---------- PROJETOS (grid adaptativo + immersive hotspots) ---------- */
  .projetos-page {
    --showroom-accent: var(--amber);
    --projetos-cols: 2;
    --projetos-cols-md: 2;
    overflow-x: clip;
    background:
      radial-gradient(ellipse 50% 36% at 6% 0%, var(--showroom-accent-soft, rgba(196, 165, 116, 0.1)), transparent 58%),
      radial-gradient(ellipse 36% 28% at 100% 8%, rgba(110, 200, 232, 0.04), transparent 52%);
  }
  .projetos-hero {
    max-width: 34rem;
    margin: 0 0 clamp(18px, 2.8vw, 28px);
    padding-bottom: clamp(16px, 2.4vw, 22px);
    border-bottom: 1px solid color-mix(in srgb, var(--line) 85%, var(--showroom-accent, var(--amber)) 15%);
  }
  .projetos-kicker {
    font-size: 10px; font-weight: 700; letter-spacing: 0.22em;
    text-transform: uppercase; color: var(--showroom-accent, var(--amber));
    margin: 0 0 12px;
  }
  .projetos-hero h1 {
    font-size: clamp(30px, 5vw, 48px); font-weight: 650;
    letter-spacing: -0.04em; margin: 0 0 14px; line-height: 1.05;
  }
  .projetos-lead {
    margin: 0; font-size: 15px; line-height: 1.7; color: var(--paper-dim); max-width: 40ch;
  }

  .projetos-grid {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    gap: clamp(24px, 3.5vw, 40px) clamp(16px, 2.5vw, 28px);
    width: 100%;
    min-width: 0;
  }
  @media (min-width: 720px) {
    .projetos-grid {
      grid-template-columns: repeat(var(--projetos-cols-md, 2), minmax(0, 1fr));
    }
  }
  @media (min-width: 1024px) {
    .projetos-grid {
      grid-template-columns: repeat(var(--projetos-cols, 2), minmax(0, 1fr));
    }
  }

  .projeto-tile {
    display: flex; flex-direction: column;
    min-width: 0; max-width: 100%;
    text-decoration: none; color: inherit;
    transition: var(--transition);
  }
  .projeto-tile:hover { transform: translateY(-2px); }
  .projeto-tile-media {
    position: relative;
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    overflow: hidden;
    border-radius: 2px;
    background: var(--bg-deep);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.22);
  }
  .projeto-tile-media img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-width: none;
    display: block;
    object-fit: cover;
    object-position: center;
    transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .projeto-tile:hover .projeto-tile-media img { transform: scale(1.03); }
  .projeto-tile-caption {
    display: flex; flex-direction: column; gap: 6px;
    padding: clamp(14px, 2vw, 18px) 2px 0;
    min-width: 0;
  }
  .projeto-tile-meta {
    font-size: 10px; font-weight: 700; letter-spacing: 0.16em;
    text-transform: uppercase; color: var(--showroom-accent, var(--amber));
  }
  .projeto-tile-caption strong {
    font-size: clamp(17px, 1.8vw, 22px); font-weight: 650;
    letter-spacing: -0.02em; line-height: 1.25;
    overflow-wrap: anywhere;
  }
  .projeto-tile-note {
    font-size: 13px; line-height: 1.55; color: var(--paper-dim);
    display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  }

  .projeto-viewer {
    --showroom-accent: var(--amber);
    position: relative;
    min-height: calc(100vh - 120px);
    background:
      radial-gradient(ellipse 48% 34% at 0% 0%, var(--showroom-accent-soft, rgba(196, 165, 116, 0.12)), transparent 58%),
      radial-gradient(ellipse 40% 30% at 100% 8%, rgba(110, 200, 232, 0.05), transparent 55%),
      var(--bg);
    padding: clamp(12px, 2vw, 22px) 0 clamp(40px, 5vw, 64px);
    /* Não usar overflow/transform aqui: o drawer é position:fixed e precisa
       competir no stacking da viewport acima do topbar sticky (z-index: 100). */
    overflow: visible;
  }
  .projeto-viewer-inner { min-width: 0; }
  .projeto-viewer-bar {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: clamp(14px, 2vw, 18px);
    margin-bottom: clamp(18px, 2.6vw, 28px);
  }
  .projeto-viewer-header {
    min-width: 0;
    width: 100%;
    max-width: 46rem;
    display: flex;
    flex-direction: column;
  }
  .projeto-viewer-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 10px;
    margin-bottom: 10px;
  }
  .projeto-viewer-place,
  .projeto-viewer-year {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--showroom-accent, var(--amber));
  }
  .projeto-viewer-year {
    color: var(--paper-dim);
    font-weight: 600;
    letter-spacing: 0.1em;
  }
  .projeto-viewer-year::before {
    content: "\00b7"; /* · entre local e ano (escape evita corrupção ? ?) */
    margin-right: 10px;
    color: color-mix(in srgb, var(--showroom-accent, var(--amber)) 45%, var(--line-active));
    font-weight: 400;
  }
  .projeto-viewer-meta > .projeto-viewer-year:first-child::before { content: none; margin: 0; }
  .projeto-viewer-title {
    margin: 0;
    font-size: clamp(30px, 4.4vw, 48px);
    font-weight: 650;
    letter-spacing: -0.04em;
    line-height: 1.05;
    overflow-wrap: anywhere;
  }
  .projeto-viewer-desc {
    margin: 12px 0 0;
    color: var(--paper-dim);
    font-size: clamp(14px, 1.5vw, 15.5px);
    line-height: 1.7;
    max-width: 52ch;
  }
  .projeto-viewer-scene-label {
    margin: 8px 0 0;
    color: var(--showroom-accent, var(--amber));
    font-size: 13px;
    font-weight: 650;
    letter-spacing: 0.04em;
  }
  .projeto-scene-switcher {
    position: relative;
    z-index: 5;
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin: 0 0 14px;
  }
  .projeto-scene-thumb {
    appearance: none;
    position: relative;
    z-index: 1;
    width: 64px;
    height: 48px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--line);
    border-radius: 4px;
    overflow: hidden;
    background: var(--bg-deep);
    cursor: pointer;
    opacity: 0.72;
    transition: opacity 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
  }
  .projeto-scene-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    pointer-events: none;
  }
  .projeto-scene-thumb:hover { opacity: 1; }
  .projeto-scene-thumb.is-active {
    opacity: 1;
    border-color: var(--showroom-accent, var(--amber));
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--showroom-accent, var(--amber)) 45%, transparent);
  }
  .projeto-viewer-hint {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 16px 0 0;
    padding: 7px 12px 7px 10px;
    font-size: 12px;
    line-height: 1.35;
    color: var(--paper-dim);
    background: color-mix(in srgb, var(--bg-panel) 72%, transparent);
    border: 1px solid var(--line);
    border-radius: 999px;
  }
  .projeto-viewer-hint-dot {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    flex-shrink: 0;
    background: var(--showroom-accent, var(--amber));
    box-shadow: 0 0 0 3px var(--showroom-accent-soft, rgba(255, 180, 84, 0.16)),
      0 0 10px var(--showroom-accent-glow, var(--amber-glow));
    animation: projeto-glow 2.4s ease-in-out infinite;
  }

  .projeto-stage {
    width: 100%;
    min-width: 0;
  }
  .projeto-stage-frame {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    min-width: 0;
    min-height: min(52vh, 520px);
    padding: clamp(10px, 1.8vw, 18px);
    border-radius: 4px;
    background:
      radial-gradient(ellipse 70% 60% at 50% 45%, color-mix(in srgb, var(--showroom-accent, var(--amber)) 8%, transparent), transparent 70%),
      var(--bg-deep);
    border: 1px solid color-mix(in srgb, var(--line) 80%, var(--showroom-accent, var(--amber)) 20%);
    box-shadow:
      0 24px 56px rgba(0, 0, 0, 0.3),
      inset 0 1px 0 rgba(255, 255, 255, 0.03);
    overflow: hidden;
  }
  html[data-theme="day"] .projeto-stage-frame {
    box-shadow:
      0 18px 44px rgba(30, 45, 70, 0.1),
      inset 0 1px 0 rgba(255, 255, 255, 0.6);
  }
  .projeto-stage-fit {
    position: relative;
    display: inline-block;
    max-width: 100%;
    line-height: 0;
    vertical-align: top;
    border-radius: 2px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
  }
  .projeto-stage-image {
    display: block;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: min(78vh, 860px);
    object-fit: contain;
  }

  .projeto-hotspot {
    position: absolute;
    width: 36px; height: 36px;
    transform: translate(-50%, -50%);
    border: 0; padding: 0; background: transparent;
    cursor: pointer; z-index: 2;
  }
  .projeto-hotspot:focus-visible {
    outline: 2px solid var(--showroom-accent, var(--amber));
    outline-offset: 4px;
    border-radius: 50%;
  }
  .projeto-hotspot-ring {
    position: absolute; inset: 3px;
    border-radius: 50%;
    box-shadow: 0 0 16px var(--showroom-accent-glow, var(--amber-glow)),
      0 0 28px color-mix(in srgb, var(--showroom-accent, var(--amber)) 35%, transparent);
    animation: projeto-glow 2.6s ease-in-out infinite;
  }
  .projeto-hotspot-core {
    position: absolute; inset: 11px;
    border-radius: 50%;
    background: var(--showroom-accent, var(--amber));
    box-shadow: 0 0 0 2px color-mix(in srgb, var(--bg) 70%, transparent),
      0 0 12px var(--showroom-accent-glow, var(--amber-glow));
    transition: transform 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .projeto-hotspot:hover .projeto-hotspot-core { transform: scale(1.12); }
  .projeto-hotspot-pulse {
    position: absolute; inset: 1px;
    border-radius: 50%;
    border: 1.5px solid var(--showroom-accent, var(--amber));
    animation: projeto-breathe 2.4s ease-in-out infinite;
  }
  .projeto-hotspot.is-active .projeto-hotspot-core {
    background: var(--bg-panel);
    box-shadow: 0 0 0 2px var(--showroom-accent, var(--amber)),
      0 0 18px var(--showroom-accent-glow, var(--amber-glow));
  }
  .projeto-hotspot-label {
    position: absolute; left: 118%; top: 50%; transform: translateY(-50%);
    white-space: nowrap; font-size: 10px; font-weight: 700;
    letter-spacing: 0.08em; text-transform: uppercase;
    color: var(--paper);
    background: color-mix(in srgb, var(--bg-panel) 88%, transparent);
    backdrop-filter: blur(14px) saturate(1.15);
    padding: 6px 10px; border-radius: 4px;
    border: 1px solid var(--line);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
    pointer-events: none; opacity: 0;
    transition: opacity 0.2s ease;
    max-width: 160px; overflow: hidden; text-overflow: ellipsis;
  }
  html[data-theme="day"] .projeto-hotspot-label {
    background: rgba(255, 255, 255, 0.96);
    color: #12161d;
    border-color: rgba(30, 45, 70, 0.14);
    box-shadow: 0 10px 24px rgba(30, 45, 70, 0.12);
  }
  html[data-theme="night"] .projeto-hotspot-label {
    background: rgba(18, 22, 29, 0.94);
    color: #eef2f7;
    border-color: rgba(160, 190, 230, 0.16);
    box-shadow: 0 10px 24px rgba(0, 0, 0, 0.4);
  }
  .projeto-hotspot.is-edge-right .projeto-hotspot-label {
    left: auto; right: 118%;
  }
  .projeto-hotspot.is-edge-left .projeto-hotspot-label {
    left: 118%; right: auto;
  }
  .projeto-hotspot:hover .projeto-hotspot-label,
  .projeto-hotspot.is-active .projeto-hotspot-label { opacity: 1; }

  @keyframes projeto-breathe {
    0%, 100% { transform: scale(0.8); opacity: 0.9; }
    50% { transform: scale(1.55); opacity: 0; }
  }
  @keyframes projeto-glow {
    0%, 100% { opacity: 0.55; }
    50% { opacity: 1; }
  }

  .projeto-drawer-backdrop {
    position: fixed; inset: 0; z-index: 220;
    border: 0;
    background: rgba(6, 8, 12, 0.42);
    backdrop-filter: blur(2px);
    cursor: pointer;
    animation: projeto-fade-in 0.25s ease;
  }
  @keyframes projeto-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
  }
  .projeto-drawer {
    position: fixed; top: 0; right: 0; bottom: 0; z-index: 230;
    width: min(400px, 100vw);
    max-width: 100%;
    display: flex; flex-direction: column;
    background: var(--bg-panel);
    border-left: 1px solid var(--line);
    box-shadow: -18px 0 48px rgba(0, 0, 0, 0.24);
    transform: translateX(100%);
    transition: transform 0.38s cubic-bezier(0.16, 1, 0.3, 1);
    isolation: isolate;
  }
  .projeto-drawer.is-open { transform: translateX(0); }
  .projeto-drawer[aria-hidden="true"] { pointer-events: none; }
  .projeto-drawer-handle {
    display: none;
    width: 36px; height: 4px;
    margin: 8px auto 0;
    border-radius: 999px;
    background: color-mix(in srgb, var(--paper-dim) 45%, transparent);
  }
  .projeto-drawer-head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 12px; padding: 16px 16px 12px;
    border-bottom: 1px solid var(--line);
  }
  .projeto-drawer-head .projetos-kicker {
    margin: 0 0 3px;
    font-size: 11px;
    letter-spacing: 0.08em;
  }
  .projeto-drawer-head h2 {
    margin: 0; font-size: 18px; font-weight: 650; letter-spacing: -0.025em;
    line-height: 1.15;
    overflow-wrap: anywhere;
  }
  .projeto-drawer-head .icon-btn {
    flex: none;
    width: 34px;
    height: 34px;
  }
  .projeto-drawer-count {
    margin: 3px 0 0;
    font-size: 12px;
    color: var(--paper-dim);
  }
  .projeto-drawer-body {
    flex: 1 1 auto;
    overflow: auto;
    padding: 12px;
    min-width: 0;
  }
  .projeto-drawer-body > .notice {
    margin: 8px 6px;
  }
  .projeto-drawer-grid {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .projeto-product-card {
    display: grid;
    grid-template-columns: 72px minmax(0, 1fr);
    gap: 12px;
    align-items: start;
    padding: 10px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: color-mix(in srgb, var(--bg) 55%, var(--bg-panel));
  }
  .projeto-product-card:hover {
    border-color: color-mix(in srgb, var(--amber) 28%, var(--line));
    background: color-mix(in srgb, var(--bg) 35%, var(--bg-panel));
  }
  .projeto-product-photo {
    display: block;
    width: 72px;
    height: 72px;
    border-radius: 8px;
    overflow: hidden;
    background: var(--bg-deep);
    border: 1px solid var(--line);
  }
  .projeto-product-photo img {
    width: 100%; height: 100%; object-fit: cover; display: block;
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .projeto-product-card:hover .projeto-product-photo img {
    transform: scale(1.04);
  }
  .projeto-product-body {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 3px;
  }
  .projeto-product-body h3 {
    margin: 0;
    font-size: 13.5px;
    font-weight: 650;
    line-height: 1.25;
    letter-spacing: -0.015em;
  }
  .projeto-product-body h3 a {
    color: inherit;
    text-decoration: none;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    line-clamp: 2;
    overflow: hidden;
  }
  .projeto-product-body h3 a:hover { color: var(--amber); }
  .projeto-product-meta {
    margin: 0;
    display: flex;
    flex-wrap: nowrap;
    align-items: baseline;
    gap: 6px;
    min-width: 0;
    font-size: 11px;
    color: var(--paper-dim);
    line-height: 1.25;
    overflow: hidden;
  }
  .projeto-product-meta span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .projeto-product-meta span:first-child {
    flex: 0 1 auto;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
  }
  .projeto-product-meta .mono {
    flex: 1 1 auto;
    min-width: 0;
  }
  .projeto-product-foot {
    margin-top: 4px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
  }
  .projeto-product-price {
    font-size: 15px;
    font-weight: 700;
    color: var(--amber);
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
    line-height: 1;
  }
  .projeto-product-foot .amber-btn {
    min-height: 32px;
    padding: 0 12px;
    font-size: 12px;
    border-radius: 8px;
  }

  @media (max-width: 719px) {
    .projeto-viewer {
      min-height: 0;
      padding-bottom: 28px;
    }
    .projeto-drawer {
      top: auto;
      left: 0;
      right: 0;
      bottom: 0;
      width: 100%;
      height: auto;
      max-height: min(78vh, 640px);
      border-left: none;
      border-top: 1px solid var(--line);
      border-radius: 16px 16px 0 0;
      box-shadow: 0 -14px 36px rgba(0, 0, 0, 0.22);
      transform: translateY(100%);
      padding-bottom: env(safe-area-inset-bottom, 0px);
    }
    .projeto-drawer-body {
      flex: 0 1 auto;
      max-height: calc(min(78vh, 640px) - 72px);
      padding: 10px 12px 12px;
    }
    .projeto-drawer.is-open { transform: translateY(0); }
    .projeto-drawer-handle { display: block; }
    .projeto-drawer-handle {
      margin: 6px auto 0;
    }
    .projeto-drawer-head {
      padding: 2px 14px 8px;
      gap: 10px;
      align-items: center;
    }
    .projeto-drawer-head .projetos-kicker {
      margin-bottom: 1px;
    }
    .projeto-drawer-head h2 {
      font-size: 16px;
    }
    .projeto-drawer-count {
      margin-top: 1px;
      font-size: 11.5px;
    }
    .projeto-drawer-grid {
      gap: 8px;
    }
    .projeto-product-card {
      grid-template-columns: 64px minmax(0, 1fr);
      gap: 10px;
      padding: 8px;
      border-radius: 10px;
    }
    .projeto-product-photo {
      width: 64px;
      height: 64px;
      border-radius: 7px;
    }
    .projeto-product-body h3 {
      font-size: 13px;
    }
    .projeto-product-body h3 a {
      -webkit-line-clamp: 1;
      line-clamp: 1;
    }
    .projeto-product-price {
      font-size: 14px;
    }
    .projeto-product-foot .amber-btn {
      min-height: 30px;
      padding: 0 10px;
      font-size: 11.5px;
    }
    .projeto-stage-frame {
      min-height: 0;
      padding: 8px;
    }
    .projeto-stage-image {
      max-height: min(68vh, 640px);
    }
  }

  /* Admin mapper */
  .admin-thumb {
    width: 56px; height: 56px; object-fit: cover;
    border-radius: var(--radius-sm); border: 1px solid var(--line);
    display: block; background: var(--bg-deep);
  }
  .projeto-mapper {
    display: grid; gap: 14px;
    min-width: 0;
  }
  @media (min-width: 960px) {
    .projeto-mapper { grid-template-columns: minmax(0, 1.4fr) minmax(0, 0.9fr); align-items: start; }
  }
  .projeto-map {
    position: relative; border: 1px solid var(--line);
    border-radius: var(--radius); overflow: hidden;
    background: var(--bg-deep); cursor: crosshair; min-height: 200px;
    min-width: 0; max-width: 100%;
  }
  .projeto-map.is-empty {
    display: flex; align-items: center; justify-content: center;
    cursor: default; padding: 24px;
  }
  .projeto-map > img {
    width: 100%; height: auto; display: block;
    max-height: min(52vh, 480px); object-fit: contain;
    background: #000; pointer-events: none;
  }
  .projeto-map-pin {
    position: absolute; width: 18px; height: 18px;
    transform: translate(-50%, -50%);
    border-radius: 50%; border: 2px solid var(--bg);
    background: var(--amber); cursor: pointer; z-index: 2;
    box-shadow: 0 0 0 3px rgba(255, 180, 84, 0.25), 0 0 12px rgba(255, 180, 84, 0.35);
  }
  .projeto-map-pin.is-active {
    background: var(--cool);
    box-shadow: 0 0 0 4px rgba(110, 200, 232, 0.3), 0 0 14px rgba(110, 200, 232, 0.4);
  }
  .projeto-hotspot-panel {
    display: flex; flex-direction: column; gap: 10px;
    max-height: 520px; overflow: auto; min-width: 0;
  }
  .projeto-hotspot-card {
    border: 1px solid var(--line); border-radius: var(--radius-sm);
    padding: 10px 12px; background: var(--bg-overlay);
  }
  .projeto-hotspot-card.is-active {
    border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
    box-shadow: 0 0 0 1px rgba(255, 180, 84, 0.12);
  }
  .projeto-hotspot-card-head {
    display: flex; justify-content: space-between; gap: 8px;
    margin-bottom: 8px;
  }
  .projetos-admin-sub {
    margin: 0; font-size: 15px; font-weight: 650;
  }

  /* Admin · Projetos lista (cartões) */
  .projetos-admin-list-card {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
  }
  .projetos-admin-list-card > .pages-form-head {
    margin-bottom: 0;
  }
  .projetos-list-meta {
    margin: 0;
  }
  .projetos-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    min-width: 0;
  }
  .projetos-list-item {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 14px 16px;
    align-items: stretch;
    padding: 12px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background:
      linear-gradient(
        135deg,
        color-mix(in srgb, var(--amber) 4%, transparent),
        transparent 42%
      ),
      color-mix(in srgb, var(--bg-panel) 88%, transparent);
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  html[data-theme="day"] .projetos-list-item {
    background:
      linear-gradient(
        135deg,
        color-mix(in srgb, var(--amber) 5%, transparent),
        transparent 40%
      ),
      #fff;
  }
  .projetos-list-item:hover {
    border-color: color-mix(in srgb, var(--amber) 38%, var(--line));
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
  }
  html[data-theme="day"] .projetos-list-item:hover {
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
  }
  .projetos-list-item.is-hidden {
    opacity: 0.72;
    border-style: dashed;
  }
  .projetos-list-media {
    position: relative;
    display: block;
    flex: none;
    width: 132px;
    border-radius: 11px;
    overflow: hidden;
    isolation: isolate;
    text-decoration: none;
    background: var(--bg-deep);
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.18);
  }
  .projetos-list-thumb {
    display: block;
    width: 132px;
    height: 88px;
    object-fit: cover;
    object-position: center;
    border: 0;
    border-radius: 0;
    background: var(--bg-deep);
    transition: transform 0.28s ease;
  }
  .projetos-list-item:hover .projetos-list-thumb {
    transform: scale(1.04);
  }
  .projetos-list-index {
    position: absolute;
    left: 8px;
    bottom: 8px;
    z-index: 1;
    padding: 3px 7px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: #fff;
    background: rgba(8, 10, 14, 0.72);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
  }
  .projetos-list-body {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 12px 16px;
    min-width: 0;
  }
  .projetos-list-copy {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-width: 0;
    flex: 1 1 200px;
  }
  .projetos-list-title-row {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    min-width: 0;
  }
  .projetos-list-title {
    font-size: 15px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.25;
    color: var(--admin-ink);
  }
  .projetos-list-status-on {
    color: color-mix(in srgb, var(--green-eco, #34d399) 75%, var(--admin-ink-muted));
    border-color: color-mix(in srgb, var(--green-eco, #34d399) 35%, var(--line));
  }
  .projetos-list-sub {
    margin: 0;
    font-size: 12.5px;
    line-height: 1.4;
    color: var(--admin-ink-muted);
  }
  .projetos-list-stats {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }
  .projetos-list-stat {
    display: inline-flex;
    align-items: baseline;
    gap: 5px;
    padding: 4px 9px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--line) 90%, transparent);
    background: color-mix(in srgb, var(--bg-chip, var(--bg-deep)) 55%, transparent);
    font-size: 11px;
    font-weight: 600;
    color: var(--admin-ink-muted);
    letter-spacing: 0.01em;
  }
  .projetos-list-stat em {
    font-style: normal;
    font-family: var(--font-mono);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    color: var(--amber);
  }
  .projetos-list-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
  }
  .projetos-list-empty {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 12px;
    padding: 22px 18px;
    border-radius: 14px;
  }
  .projetos-list-empty p {
    margin: 0;
  }
  @media (max-width: 720px) {
    .projetos-list-item {
      grid-template-columns: 96px minmax(0, 1fr);
      gap: 12px;
      padding: 10px;
      border-radius: 12px;
    }
    .projetos-list-media,
    .projetos-list-thumb {
      width: 96px;
    }
    .projetos-list-thumb {
      height: 72px;
    }
    .projetos-list-body {
      flex-direction: column;
      align-items: stretch;
    }
    .projetos-list-actions {
      width: 100%;
    }
    .projetos-list-actions .button-ghost,
    .projetos-list-actions .button-danger {
      flex: 1 1 auto;
      justify-content: center;
      text-align: center;
    }
  }
  .projeto-scene-accordion {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .projeto-scene-panel {
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--bg-overlay);
    overflow: hidden;
  }
  .projeto-scene-panel.is-open {
    border-color: color-mix(in srgb, var(--amber) 40%, var(--line));
    box-shadow: 0 0 0 1px rgba(255, 180, 84, 0.12);
  }
  .projeto-scene-panel-body {
    padding: 12px 14px 14px;
    border-top: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-panel) 55%, transparent);
  }
  .projeto-scene-tabs {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .projeto-scene-tab {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 8px 12px;
    padding: 12px 14px;
    border: 0;
    border-radius: 0;
    background: transparent;
    cursor: pointer;
    user-select: none;
    transition: background-color 0.18s ease;
  }
  .projeto-scene-tab:hover {
    background: color-mix(in srgb, var(--amber) 5%, transparent);
  }
  .projeto-scene-tab:focus-visible {
    outline: 2px solid var(--amber);
    outline-offset: -2px;
  }
  .projeto-scene-tab.is-active {
    background: color-mix(in srgb, var(--amber) 7%, transparent);
  }
  .projeto-scene-tab-copy {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1 1 auto;
    pointer-events: none;
  }
  .projeto-scene-tab-chevron {
    width: 0.55em;
    height: 0.55em;
    border-right: 2px solid var(--paper-dim);
    border-bottom: 2px solid var(--paper-dim);
    transform: rotate(-45deg);
    transition: transform 0.18s ease;
    flex-shrink: 0;
  }
  .projeto-scene-tab.is-active .projeto-scene-tab-chevron {
    transform: rotate(45deg);
  }
  .projeto-scene-tab-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    min-width: 0;
  }
  .projeto-scene-tab-actions {
    display: inline-flex;
    flex-wrap: wrap;
    gap: 4px;
    align-items: center;
    position: relative;
    z-index: 1;
  }
  .projeto-scene-tab-actions > * {
    cursor: pointer;
  }

  /* Solar admin — mapa de hotspots (reusa projeto-mapper) */
  .solar-admin-form {
    display: flex;
    flex-direction: column;
    gap: 14px;
    min-width: 0;
  }
  .solar-admin-form > fieldset.stack {
    margin: 0;
  }
  .solar-map-pin {
    background: #3ecf8e;
    box-shadow: 0 0 0 3px rgba(62, 207, 142, 0.28), 0 0 12px rgba(62, 207, 142, 0.35);
  }
  .solar-map-pin.is-active {
    background: #6ec8e8;
    box-shadow: 0 0 0 4px rgba(110, 200, 232, 0.3), 0 0 14px rgba(110, 200, 232, 0.4);
  }
  .solar-hotspot-card.is-active {
    border-color: color-mix(in srgb, #3ecf8e 45%, var(--line));
    box-shadow: 0 0 0 1px rgba(62, 207, 142, 0.14);
  }
  .solar-hotspot-active-hint {
    margin: 4px 0 0;
  }
  .solar-admin .solar-hotspot-panel {
    max-height: min(64vh, 560px);
  }

  /* ---------- PESQUISA (grelha / lista) ---------- */
  .search-view .search-hero {
    margin-bottom: clamp(18px, 2.8vw, 26px);
    padding-bottom: clamp(14px, 2vw, 18px);
    align-items: flex-end;
  }
  .search-view .search-hero h1 {
    letter-spacing: -0.03em;
  }
  .search-view .search-hero p {
    margin: 0;
    max-width: 48ch;
  }
  .search-view .search-block {
    margin-top: clamp(22px, 3.2vw, 36px);
  }
  .search-view .search-block:first-of-type {
    margin-top: 0;
  }
  .search-view .search-block-head {
    margin-bottom: 14px;
    padding-bottom: 8px;
    border-bottom: 1px solid var(--line);
  }
  .search-view .search-block-head h2 {
    font-size: clamp(15px, 1.8vw, 17px);
    font-weight: 650;
    letter-spacing: -0.01em;
  }
  .search-view .search-block-head span {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.06em;
    color: var(--amber);
    background: rgba(255, 180, 84, 0.1);
    border: 1px solid rgba(255, 180, 84, 0.22);
    border-radius: 999px;
    padding: 3px 9px;
  }

  .search-view .search-catalog--grelha .product-grid {
    gap: 12px;
  }
  @media (min-width: 640px) {
    .search-view .search-catalog--grelha .product-grid { gap: 14px; }
  }
  .search-view .search-catalog--grelha .sku-card {
    background: color-mix(in srgb, var(--bg-panel) 92%, transparent);
  }
  .search-view .search-catalog--grelha .sku-body {
    padding: 12px;
    gap: 6px;
  }
  .search-view .search-catalog--grelha .sku-meta {
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
  }

  .search-view .search-catalog--lista .spec-table-container {
    border-radius: var(--radius);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
  }
  .search-view .search-catalog--lista .spec-header {
    padding-top: 13px;
    padding-bottom: 13px;
  }
  .search-view .search-catalog--lista .spec-row {
    padding-top: 2px;
    padding-bottom: 2px;
  }
  .search-view .search-catalog--lista .spec-row:hover {
    background: color-mix(in srgb, var(--bg-panel-hover) 80%, rgba(255, 180, 84, 0.04));
  }
  .search-view .search-catalog--lista .cell-thumb-link {
    width: 44px;
    height: 44px;
  }
  .search-view[data-view= "produtos"] .search-hero,
  .search-view[data-view="grelha"] .search-hero {
    gap: 12px 16px;
  }
  @media (max-width: 639px) {
    .search-view .search-hero {
      align-items: flex-start;
      flex-direction: column;
    }
    .search-view .cat-header-right-tools {
      width: 100%;
      justify-content: flex-start;
    }
  }

  /* ---------- TUTORIAIS (hero alinhado a Projetos + grelha em cartões) ---------- */
  .tutoriais-page {
    --showroom-accent: var(--amber);
    --tutorial-feature-h: clamp(280px, 48vw, 520px);
    --tutorial-radius: 14px;
    overflow-x: clip;
    background:
      radial-gradient(ellipse 50% 36% at 6% 0%, var(--showroom-accent-soft, rgba(196, 165, 116, 0.1)), transparent 58%),
      radial-gradient(ellipse 36% 28% at 100% 8%, rgba(110, 200, 232, 0.04), transparent 52%);
  }
  .tutoriais-shell {
    display: flex;
    flex-direction: column;
    /* Sem gap global: o espaço breadcrumb ? título vem só de .breadcrumb-nav (como Projetos / Lista) */
    gap: 0;
  }
  .tutoriais-shell > .tutorial-feature,
  .tutoriais-shell > .tutorial-grid,
  .tutoriais-shell > .empty {
    margin-top: clamp(18px, 2.8vw, 28px);
  }
  .tutoriais-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px 28px;
    margin: 0;
    padding-bottom: clamp(16px, 2.4vw, 22px);
    border-bottom: 1px solid color-mix(in srgb, var(--line) 85%, var(--showroom-accent, var(--amber)) 15%);
  }
  .tutoriais-hero-copy {
    flex: 1 1 220px;
    min-width: 0;
    max-width: 34rem;
  }
  .tutoriais-kicker {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.22em;
    text-transform: uppercase;
    color: var(--showroom-accent, var(--amber));
    margin: 0 0 12px;
  }
  .tutoriais-hero h1 {
    font-size: clamp(30px, 5vw, 48px);
    font-weight: 650;
    letter-spacing: -0.04em;
    line-height: 1.05;
    margin: 0 0 14px;
  }
  .tutoriais-lead,
  .tutorial-detail-lead {
    margin: 0;
    font-size: 15px;
    line-height: 1.7;
    color: var(--paper-dim);
    max-width: 40ch;
  }
  .tutoriais-hero-tools {
    display: flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: flex-end;
    gap: 8px;
    flex: 0 1 auto;
    min-width: 0;
    max-width: min(100%, 34rem);
  }
  .tutorial-filter-bar {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: stretch;
    justify-content: flex-end;
    gap: 8px;
    min-width: 0;
    max-width: 100%;
  }

  /* Tipo: segmented control suave (como view-btn do cat�logo) */
  .tutorial-filters {
    display: inline-flex;
    align-items: center;
    gap: 2px;
    margin: 0;
    padding: 3px;
    min-width: 0;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--bg-panel) 88%, var(--bg));
  }
  .tutorial-filter {
    appearance: none;
    position: relative;
    border: 0;
    background: transparent;
    color: var(--paper-dim);
    border-radius: 8px;
    padding: 8px 12px;
    margin: 0;
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.02em;
    cursor: pointer;
    white-space: nowrap;
    transition: color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
  }
  .tutorial-filter::after {
    content: none;
  }
  .tutorial-filter:hover {
    color: var(--paper);
  }
  .tutorial-filter.is-active {
    color: var(--paper);
    background: var(--bg-panel);
    box-shadow:
      0 1px 2px rgba(0, 0, 0, 0.08),
      inset 0 0 0 1px color-mix(in srgb, var(--line) 70%, transparent);
  }
  html[data-theme="day"] .tutorial-filter.is-active {
    box-shadow:
      0 1px 2px rgba(15, 23, 42, 0.06),
      inset 0 0 0 1px color-mix(in srgb, var(--line) 85%, transparent);
  }

  /* Desktop: select. Mobile: chips (abaixo no media). */
  .tutorial-cat-chips {
    display: none;
  }
  .tutorial-cat-select {
    position: relative;
    flex: 0 1 auto;
    min-width: 0;
    max-width: 100%;
  }
  .tutorial-cat-select-trigger {
    list-style: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 100%;
    min-height: 38px;
    max-width: 100%;
    margin: 0;
    padding: 0 12px;
    border: 1px solid var(--line);
    border-radius: 10px;
    background: color-mix(in srgb, var(--bg-panel) 88%, var(--bg));
    color: var(--paper);
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.01em;
    cursor: pointer;
    user-select: none;
    box-sizing: border-box;
    transition: border-color 0.18s ease, background 0.18s ease, box-shadow 0.18s ease;
  }
  .tutorial-cat-select-trigger::-webkit-details-marker {
    display: none;
  }
  .tutorial-cat-select-trigger::marker {
    content: "";
  }
  .tutorial-cat-select-trigger:hover {
    border-color: var(--line-active);
  }
  .tutorial-cat-select[open] .tutorial-cat-select-trigger {
    border-color: color-mix(in srgb, var(--line) 40%, var(--showroom-accent, var(--amber)) 60%);
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--showroom-accent, var(--amber)) 18%, transparent);
  }
  .tutorial-cat-select.has-value .tutorial-cat-select-trigger {
    background: var(--bg-panel);
  }
  .tutorial-cat-select-meta {
    color: var(--paper-dim);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    flex: none;
  }
  .tutorial-cat-select-value {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 9.5rem;
  }
  .tutorial-cat-select-chevron {
    width: 0.4em;
    height: 0.4em;
    margin-left: 2px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translateY(-1px);
    opacity: 0.5;
    flex: none;
    transition: transform 0.2s ease, opacity 0.2s ease;
  }
  .tutorial-cat-select[open] .tutorial-cat-select-chevron {
    transform: rotate(225deg) translateY(-1px);
    opacity: 0.85;
  }
  .tutorial-cat-select-menu {
    position: absolute;
    top: calc(100% + 6px);
    right: 0;
    z-index: 40;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: max(100%, 12rem);
    max-width: min(18rem, 88vw);
    max-height: min(18rem, 55vh);
    overflow: auto;
    padding: 6px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg-panel);
    box-shadow: 0 16px 36px rgba(0, 0, 0, 0.18);
    overscroll-behavior: contain;
  }
  html[data-theme="day"] .tutorial-cat-select-menu {
    box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);
  }
  .tutorial-cat-option {
    appearance: none;
    border: 0;
    background: transparent;
    color: var(--paper-dim);
    text-align: left;
    font: inherit;
    font-size: 13px;
    font-weight: 600;
    padding: 9px 11px;
    border-radius: 8px;
    cursor: pointer;
    transition: color 0.15s ease, background 0.15s ease;
  }
  .tutorial-cat-option:hover {
    color: var(--paper);
    background: color-mix(in srgb, var(--bg) 70%, transparent);
  }
  .tutorial-cat-option.is-active {
    color: var(--paper);
    background: color-mix(in srgb, var(--showroom-accent, var(--amber)) 14%, var(--bg-panel));
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--showroom-accent, var(--amber)) 28%, transparent);
  }

  @media (max-width: 719px) {
    .tutoriais-hero {
      align-items: stretch;
      gap: 14px;
      padding-bottom: 14px;
    }
    .tutoriais-hero-copy {
      max-width: none;
    }
    .tutoriais-hero-tools {
      width: 100%;
      max-width: none;
    }
    .tutorial-filter-bar {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      width: 100%;
      gap: 10px;
    }
    .tutorial-filters {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      width: 100%;
    }
    .tutorial-filter {
      text-align: center;
      padding: 9px 6px;
    }
    /* Mobile: esconde select, mostra chips desliz�veis */
    .tutorial-cat-select--desktop {
      display: none;
    }
    .tutorial-cat-chips {
      display: flex;
      flex-wrap: nowrap;
      gap: 8px;
      width: 100%;
      overflow-x: auto;
      overflow-y: hidden;
      -webkit-overflow-scrolling: touch;
      overscroll-behavior-x: contain;
      scrollbar-width: none;
      padding: 1px 2px 2px;
      touch-action: pan-x;
    }
    .tutorial-cat-chips.is-scrollable {
      mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 18px), transparent 100%);
      -webkit-mask-image: linear-gradient(90deg, #000 0%, #000 calc(100% - 18px), transparent 100%);
    }
    .tutorial-cat-chips::-webkit-scrollbar {
      display: none;
    }
    .tutorial-cat-chip {
      flex: 0 0 auto;
      appearance: none;
      border: 1px solid var(--line);
      background: var(--bg-panel);
      color: var(--paper-dim);
      border-radius: 999px;
      padding: 8px 14px;
      font: inherit;
      font-size: 12px;
      font-weight: 650;
      letter-spacing: 0.01em;
      white-space: nowrap;
      cursor: pointer;
      transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease;
    }
    .tutorial-cat-chip.is-active {
      color: var(--paper);
      background: color-mix(in srgb, var(--showroom-accent, var(--amber)) 14%, var(--bg-panel));
      border-color: color-mix(in srgb, var(--showroom-accent, var(--amber)) 40%, var(--line));
    }
  }

  /* Featured hero */
  .tutorial-feature {
    position: relative;
    display: grid;
    grid-template-columns: 1fr;
    min-height: var(--tutorial-feature-h);
    overflow: hidden;
    text-decoration: none;
    color: #f4f1ea;
    background: #0a0c10;
    isolation: isolate;
    border-radius: var(--tutorial-radius);
    box-shadow: 0 18px 40px rgba(0, 0, 0, 0.28);
  }
  @media (min-width: 900px) {
    .tutorial-feature {
      grid-template-columns: 1.35fr 1fr;
      min-height: clamp(360px, 42vw, 480px);
    }
  }
  .tutorial-feature-media {
    position: relative;
    display: block;
    min-height: 220px;
    overflow: hidden;
  }
  @media (min-width: 900px) {
    .tutorial-feature-media {
      min-height: 100%;
    }
  }
  .tutorial-feature-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    position: absolute;
    inset: 0;
    transition: transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .tutorial-feature-shade {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgba(8, 10, 14, 0.12) 0%, rgba(8, 10, 14, 0.45) 48%, rgba(8, 10, 14, 0.88) 100%);
    pointer-events: none;
  }
  @media (min-width: 900px) {
    .tutorial-feature-shade {
      background:
        linear-gradient(90deg, rgba(8, 10, 14, 0.05) 0%, rgba(8, 10, 14, 0.35) 45%, rgba(8, 10, 14, 0.96) 78%);
    }
  }
  .tutorial-feature.is-video .tutorial-feature-shade {
    background:
      radial-gradient(ellipse 55% 50% at 50% 45%, rgba(0, 0, 0, 0.15), transparent 70%),
      linear-gradient(180deg, rgba(6, 8, 12, 0.2) 0%, rgba(6, 8, 12, 0.55) 55%, rgba(6, 8, 12, 0.9) 100%);
  }
  @media (min-width: 900px) {
    .tutorial-feature.is-video .tutorial-feature-shade {
      background:
        radial-gradient(ellipse 42% 48% at 38% 50%, rgba(0, 0, 0, 0.28), transparent 68%),
        linear-gradient(90deg, rgba(8, 10, 14, 0.08) 0%, rgba(8, 10, 14, 0.4) 48%, rgba(8, 10, 14, 0.96) 78%);
    }
  }
  .tutorial-feature-content {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    gap: 12px;
    padding: clamp(20px, 3.5vw, 40px);
    background: #0a0c10;
  }
  @media (max-width: 899px) {
    .tutorial-feature-content {
      margin-top: -72px;
      background: transparent;
    }
  }
  @media (min-width: 900px) {
    .tutorial-feature-content {
      justify-content: center;
      padding-left: clamp(24px, 3vw, 48px);
      padding-right: clamp(28px, 4vw, 56px);
    }
  }
  .tutorial-feature-eyebrow {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
    font-size: 11px;
    font-weight: 600;
    color: rgba(244, 241, 234, 0.72);
  }
  .tutorial-feature-eyebrow .tutorial-type-badge {
    position: static;
  }
  .tutorial-feature-eyebrow .tutorial-card-cat {
    color: color-mix(in srgb, var(--amber) 85%, #fff);
  }
  .tutorial-feature-title {
    font-size: clamp(24px, 4.2vw, 40px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.12;
    max-width: 18ch;
  }
  .tutorial-feature-excerpt {
    font-size: clamp(14px, 1.6vw, 16px);
    line-height: 1.5;
    color: rgba(244, 241, 234, 0.72);
    max-width: 36ch;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .tutorial-feature-cta {
    margin-top: 6px;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: #fff;
    align-self: flex-start;
    padding-bottom: 4px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.45);
    transition: border-color 0.25s ease, letter-spacing 0.25s ease;
  }
  .tutorial-feature:hover .tutorial-feature-media img {
    transform: scale(1.045);
  }
  .tutorial-feature:hover .tutorial-feature-cta {
    border-color: #fff;
    letter-spacing: 0.18em;
  }
  .tutorial-feature:focus-visible {
    outline: 2px solid var(--amber);
    outline-offset: 3px;
  }

  /* Grelha de cartões */
  .tutorial-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(18px, 2.8vw, 28px);
  }
  @media (min-width: 640px) {
    .tutorial-grid {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }
  }
  @media (min-width: 1024px) {
    .tutorial-grid {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 28px;
    }
  }
  .tutorial-card {
    display: flex;
    flex-direction: column;
    min-width: 0;
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    background: var(--bg-panel);
    border: 1px solid var(--line);
    border-radius: var(--tutorial-radius);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
    transition:
      transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
      border-color 0.25s ease,
      box-shadow 0.35s ease;
  }
  html[data-theme="day"] .tutorial-card {
    box-shadow: 0 8px 22px rgba(15, 23, 42, 0.08);
  }
  .tutorial-card:hover {
    transform: translateY(-4px);
    border-color: color-mix(in srgb, var(--line) 55%, var(--showroom-accent, var(--amber)) 45%);
    box-shadow: 0 18px 36px rgba(0, 0, 0, 0.22);
  }
  .tutorial-card:focus-visible {
    outline: 2px solid var(--amber);
    outline-offset: 4px;
  }
  .tutorial-card-media {
    position: relative;
    display: block;
    aspect-ratio: 16 / 10;
    background: var(--bg-deep);
    overflow: hidden;
  }
  .tutorial-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.7s cubic-bezier(0.16, 1, 0.3, 1), filter 0.4s ease;
  }
  .tutorial-card-shade {
    position: absolute;
    inset: 0;
    pointer-events: none;
    opacity: 0;
    transition: opacity 0.3s ease;
  }
  .tutorial-card.is-video .tutorial-card-shade {
    opacity: 1;
    background:
      radial-gradient(ellipse 60% 55% at 50% 48%, rgba(0, 0, 0, 0.28), transparent 70%),
      linear-gradient(180deg, rgba(6, 8, 12, 0.2) 0%, rgba(6, 8, 12, 0.42) 45%, rgba(6, 8, 12, 0.82) 100%);
  }
  .tutorial-card:hover .tutorial-card-media img {
    transform: scale(1.05);
    filter: brightness(1.04);
  }
  html[data-theme="day"] .tutorial-card:hover .tutorial-card-media img {
    filter: brightness(1.02);
  }

  /* Play button SVG (vídeos) */
  .tutorial-play {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: grid;
    place-items: center;
    pointer-events: none;
    color: #fff;
  }
  .tutorial-play-svg {
    width: clamp(52px, 8vw, 72px);
    height: clamp(52px, 8vw, 72px);
    filter: drop-shadow(0 10px 24px rgba(0, 0, 0, 0.45));
    transition: transform 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .tutorial-play-disc {
    fill: rgba(255, 255, 255, 0.94);
  }
  .tutorial-play-ring {
    stroke: rgba(255, 255, 255, 0.55);
  }
  .tutorial-card:hover .tutorial-play-svg,
  .tutorial-feature:hover .tutorial-play-svg {
    transform: scale(1.08);
  }
  .tutorial-feature .tutorial-play {
    /* No featured desktop, o play fica sobre a área da imagem */
    inset: auto;
    top: 50%;
    left: 38%;
    transform: translate(-50%, -50%);
    width: auto;
    height: auto;
  }
  @media (max-width: 899px) {
    .tutorial-feature .tutorial-play {
      inset: 0;
      top: auto;
      left: auto;
      transform: none;
      place-items: center;
      padding-bottom: 18%;
    }
  }

  .tutorial-duration-chip {
    position: absolute;
    right: 12px;
    bottom: 12px;
    z-index: 3;
    font-size: 11px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.04em;
    padding: 5px 9px;
    border-radius: 6px;
    color: #fff;
    background: rgba(8, 10, 14, 0.82);
    border: 1px solid rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.28);
  }

  .tutorial-type-badge {
    position: absolute;
    top: 12px;
    left: 12px;
    z-index: 3;
    font-size: 9px;
    font-weight: 750;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    padding: 5px 9px;
    border-radius: 6px;
    background: rgba(10, 12, 16, 0.78);
    color: #fff;
    backdrop-filter: blur(10px);
  }
  .tutorial-type-badge--video {
    background: color-mix(in srgb, var(--cool) 78%, #0a0c10);
  }
  .tutorial-type-badge--article {
    background: color-mix(in srgb, var(--amber) 82%, #0a0c10);
    color: var(--amber-ink);
  }
  .tutorial-card-body {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 16px 16px 18px;
    min-width: 0;
  }
  .tutorial-card-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 12px;
    font-size: 11px;
    color: var(--paper-dim);
    font-weight: 600;
  }
  .tutorial-card-cat {
    color: var(--showroom-accent, var(--amber));
    letter-spacing: 0.08em;
    text-transform: uppercase;
    font-size: 10px;
  }
  .tutorial-card-duration {
    font-variant-numeric: tabular-nums;
  }
  .tutorial-card-title {
    font-size: clamp(16px, 1.7vw, 19px);
    font-weight: 650;
    letter-spacing: -0.025em;
    line-height: 1.28;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    transition: color 0.2s ease;
  }
  .tutorial-card:hover .tutorial-card-title {
    color: var(--showroom-accent, var(--amber));
  }
  .tutorial-card-excerpt {
    color: var(--paper-dim);
    font-size: 13px;
    line-height: 1.5;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  /* Detail — leitura centrada (magazine) */
  .tutorial-detail-page {
    --showroom-accent: var(--amber);
    background:
      radial-gradient(ellipse 42% 28% at 50% 0%, var(--showroom-accent-soft, rgba(196, 165, 116, 0.08)), transparent 60%);
  }
  .tutorial-detail-shell {
    max-width: 52rem;
    margin: 0 auto;
  }
  .tutorial-detail-reading {
    max-width: 42rem;
    margin: 0 auto;
    min-width: 0;
  }
  @media (min-width: 900px) {
    .tutorial-detail-shell {
      max-width: 56rem;
      padding-inline: clamp(24px, 6vw, 72px);
    }
    .tutorial-detail-reading {
      max-width: 44rem;
    }
  }
  .tutorial-detail-hero {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    margin: clamp(8px, 1.5vw, 16px) 0 clamp(26px, 4vw, 40px);
    padding-bottom: clamp(18px, 2.8vw, 26px);
    border-bottom: 1px solid color-mix(in srgb, var(--line) 85%, var(--showroom-accent, var(--amber)) 15%);
    text-align: left;
  }
  .tutorial-detail-hero h1 {
    font-size: clamp(24px, 3.8vw, 34px);
    font-weight: 650;
    letter-spacing: -0.035em;
    line-height: 1.12;
    margin: 0 0 10px;
  }
  .tutorial-detail-hero .tutorial-detail-lead {
    margin: 0 0 12px;
    max-width: 42ch;
    font-size: 14px;
    line-height: 1.6;
  }
  .tutorial-detail-byline {
    display: inline-flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 8px;
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.01em;
    line-height: 1.3;
    color: var(--paper-dim);
    font-variant-numeric: tabular-nums;
  }
  .tutorial-detail-kind,
  .tutorial-detail-cat,
  .tutorial-detail-read,
  .tutorial-detail-byline time {
    font-size: inherit;
    font-weight: inherit;
    letter-spacing: inherit;
    line-height: inherit;
  }
  .tutorial-detail-kind {
    color: var(--showroom-accent, var(--amber));
    text-transform: uppercase;
    letter-spacing: 0.06em;
  }
  .tutorial-detail-kind--video {
    color: var(--cool, #3d8fb5);
  }
  .tutorial-detail-cat {
    color: var(--paper-dim);
  }
  .tutorial-detail-dot {
    width: 3px;
    height: 3px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--paper-dim) 65%, transparent);
    flex: none;
  }
  .tutorial-detail-byline time {
    font-variant-numeric: tabular-nums;
  }
  .tutorial-cover {
    margin: 0 0 clamp(22px, 3.5vw, 32px);
    overflow: hidden;
    background: var(--bg-deep);
    border-radius: var(--radius-2xl);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
  }
  html[data-theme="day"] .tutorial-cover {
    box-shadow: 0 14px 32px rgba(15, 23, 42, 0.1);
  }
  .tutorial-cover img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
  }
  .tutorial-player {
    margin: 0 0 clamp(22px, 3.5vw, 32px);
    overflow: hidden;
    background: #000;
    border-radius: var(--radius-2xl);
  }
  .tutorial-player video,
  .tutorial-player iframe {
    width: 100%;
    aspect-ratio: 16 / 9;
    display: block;
    border: 0;
  }
  .tutorial-prose {
    max-width: none;
    font-size: clamp(14.5px, 1.45vw, 16px);
    line-height: 1.7;
    color: var(--paper);
    letter-spacing: -0.005em;
  }
  .tutorial-prose p {
    margin: 0 0 1.1em;
  }
  .tutorial-prose p:last-child { margin-bottom: 0; }
  .tutorial-embed-missing {
    margin: 1.4em 0;
    padding: 12px 14px;
    border: 1px dashed var(--line);
    border-radius: var(--radius);
    font-size: 14px;
  }

  /* Cart�o de produto citado no tutorial */
  .tutorial-embed-product {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
    margin: clamp(20px, 3.5vw, 36px) 0;
    overflow: hidden;
    background: color-mix(in srgb, var(--bg-panel) 92%, var(--showroom-accent, var(--amber)) 8%);
    border: 1px solid color-mix(in srgb, var(--line) 82%, var(--showroom-accent, var(--amber)) 18%);
    border-radius: clamp(12px, 2.5vw, 16px);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12);
    transition:
      border-color 0.25s ease,
      box-shadow 0.3s ease,
      transform 0.3s cubic-bezier(0.16, 1, 0.3, 1);
  }
  html[data-theme="day"] .tutorial-embed-product {
    background: color-mix(in srgb, #fff 88%, var(--showroom-accent, var(--amber)) 12%);
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.07);
  }
  .tutorial-embed-product:hover {
    border-color: color-mix(in srgb, var(--showroom-accent, var(--amber)) 45%, var(--line));
    box-shadow: 0 14px 36px rgba(0, 0, 0, 0.18);
    transform: translateY(-2px);
  }
  html[data-theme="day"] .tutorial-embed-product:hover {
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.11);
  }
  .tutorial-embed-photo {
    --embed-thumb: clamp(92px, 24vw, 112px);
    position: relative;
    box-sizing: border-box;
    flex: 0 0 var(--embed-thumb);
    width: var(--embed-thumb);
    align-self: stretch;
    min-height: var(--embed-thumb);
    margin: 0;
    padding: 0;
    background: var(--bg-deep);
    overflow: hidden;
  }
  .tutorial-embed-photo img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: transform 0.65s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .tutorial-embed-product:hover .tutorial-embed-photo img {
    transform: scale(1.04);
  }
  .tutorial-embed-body {
    flex: 1 1 auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 4px;
    padding: 12px 14px;
    min-width: 0;
    overflow: hidden;
  }
  .tutorial-embed-cat {
    margin: 0;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--showroom-accent, var(--amber));
  }
  .tutorial-embed-title {
    margin: 0;
    min-width: 0;
    font-size: clamp(14px, 2.2vw, 17px);
    font-weight: 650;
    letter-spacing: -0.025em;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .tutorial-embed-title a {
    color: inherit;
    text-decoration: none;
  }
  .tutorial-embed-title a:hover {
    color: var(--showroom-accent, var(--amber));
  }
  .tutorial-embed-sku {
    margin: 0;
    font-size: 12px;
  }
  .tutorial-embed-foot {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 10px 14px;
    margin-top: 4px;
    padding-top: 8px;
    border-top: 1px solid color-mix(in srgb, var(--line) 88%, transparent);
  }
  .tutorial-embed-price {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    font-size: clamp(15px, 2vw, 18px);
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--showroom-accent, var(--amber));
    font-variant-numeric: tabular-nums;
  }
  .tutorial-embed-price::after {
    content: "P.V.P";
    font-size: 10px;
    font-weight: 650;
    letter-spacing: 0.06em;
    color: var(--paper-dim);
  }
  .tutorial-embed-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
  }
  @media (max-width: 559px) {
    .tutorial-embed-sku {
      display: none;
    }
    .tutorial-embed-actions .ghost-btn,
    .tutorial-embed-actions .amber-btn {
      min-height: 30px;
      padding: 0 10px;
      font-size: 11.5px;
    }
  }
  @media (min-width: 900px) {
    .tutorial-embed-product {
      margin: 28px 0 32px;
      min-height: 0;
      border-radius: 16px;
    }
    .tutorial-embed-photo {
      --embed-thumb: 128px;
      flex-basis: 128px;
      width: 128px;
    }
    .tutorial-embed-body {
      gap: 3px;
      padding: 14px 20px 12px;
    }
    .tutorial-embed-title {
      font-size: 17px;
      letter-spacing: -0.03em;
    }
    .tutorial-embed-sku {
      font-size: 12.5px;
      opacity: 0.9;
    }
    .tutorial-embed-foot {
      margin-top: 4px;
      padding-top: 8px;
      gap: 12px 18px;
    }
    .tutorial-embed-price {
      font-size: 20px;
    }
    .tutorial-embed-price::after {
      font-size: 11px;
    }
    .tutorial-embed-actions .ghost-btn,
    .tutorial-embed-actions .amber-btn {
      min-height: 36px;
      padding: 0 14px;
      font-size: 13px;
    }
  }

  /* Admin: editor de artigo + inserir produto */
  .tutorial-editor-panel {
    border: 1px solid color-mix(in srgb, var(--amber) 28%, var(--line));
    border-radius: var(--radius-2xl);
    padding: 16px 16px 18px;
    background: color-mix(in srgb, var(--amber) 5%, var(--bg-panel));
  }
  .tutorial-editor-toolbar {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px 14px;
    margin: 0 0 12px;
  }
  .tutorial-format-color-field {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    flex-wrap: wrap;
  }
  .tutorial-color-swatches {
    display: inline-flex;
    align-items: center;
    gap: 6px;
  }
  .tutorial-color-swatch {
    width: 28px;
    height: 28px;
    padding: 0;
    border-radius: 50%;
    border: 2px solid var(--line);
    background: var(--swatch, var(--amber));
    box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
    cursor: pointer;
    transition: transform 0.15s ease, border-color 0.15s ease;
  }
  .tutorial-color-swatch:hover {
    transform: scale(1.08);
    border-color: var(--line-active);
  }
  .tutorial-format-color-field input[type="color"] {
    width: 36px;
    height: 32px;
    padding: 2px;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    background: var(--bg-panel);
    cursor: pointer;
  }
  .tutorial-prose .tutorial-inline-color {
    font-weight: inherit;
  }
  .tutorial-prose strong {
    font-weight: 700;
    color: inherit;
  }
  .tutorial-editor-split {
    display: grid;
    grid-template-columns: 1fr;
    gap: 14px;
  }
  @media (min-width: 960px) {
    .tutorial-editor-split {
      grid-template-columns: 1fr 1fr;
      align-items: stretch;
      min-height: 320px;
    }
  }
  .tutorial-editor-write,
  .tutorial-editor-preview-wrap {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
    min-height: 0;
  }
  .tutorial-editor-write > span,
  .tutorial-editor-preview-wrap > span {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: var(--paper-dim);
  }
  .tutorial-editor-write textarea {
    flex: 1;
    min-height: 280px;
    font-family: var(--font-mono, "JetBrains Mono", ui-monospace, monospace);
    font-size: 13px;
    line-height: 1.55;
  }
  .tutorial-editor-preview {
    flex: 1;
    min-height: 280px;
    max-height: 480px;
    overflow: auto;
    padding: 16px 18px;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    background: var(--bg-deep);
  }
  .tutorial-embed-product--preview {
    pointer-events: none;
    margin: 1em 0;
  }
  .quote-system-table input[type="text"],
  .quote-system-table select {
    width: 100%;
    min-width: 8rem;
    box-sizing: border-box;
  }
  .quote-system-table td .check {
    flex-direction: row;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
  }
  .quote-system-table .row-actions {
    justify-content: flex-end;
  }

  .tutorial-list-search-label {
    display: block;
    margin: 0 0 8px;
  }
  /* Tutorial / not�cia: Vis�vel + Destaque Hero */
  .tutorial-flags {
    display: grid;
    grid-template-columns: 1fr;
    gap: 10px;
    margin: 0;
    min-width: 0;
  }
  @media (min-width: 800px) {
    .tutorial-flags {
      grid-template-columns: 1fr 1fr;
    }
  }
  .admin label.admin-flag-toggle,
  .admin-flag-toggle {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 12px;
    margin: 0;
    padding: 12px 14px;
    border: 1px solid var(--line);
    border-radius: 12px;
    background: var(--bg-overlay, var(--bg-panel));
    cursor: pointer;
    user-select: none;
    min-width: 0;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .admin-flag-toggle:hover {
    border-color: color-mix(in srgb, var(--line) 55%, var(--amber) 45%);
  }
  .admin-flag-toggle:has(input:checked) {
    border-color: color-mix(in srgb, var(--line) 40%, var(--amber) 60%);
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 88%, var(--amber) 12%);
    box-shadow: 0 8px 20px -18px color-mix(in srgb, var(--amber) 70%, transparent);
  }
  .admin-flag-toggle input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
  }
  .admin-flag-toggle-track {
    position: relative;
    flex: 0 0 auto;
    width: 42px;
    height: 24px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--line) 70%, #64748b 30%);
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    transition: background 0.2s ease, border-color 0.2s ease;
  }
  .admin-flag-toggle-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.22);
    transition: transform 0.2s ease;
  }
  .admin-flag-toggle input:checked + .admin-flag-toggle-track {
    background: var(--amber);
    border-color: transparent;
  }
  .admin-flag-toggle input:checked + .admin-flag-toggle-track .admin-flag-toggle-thumb {
    transform: translateX(18px);
  }
  .admin-flag-toggle input:focus-visible + .admin-flag-toggle-track {
    outline: 2px solid var(--amber);
    outline-offset: 3px;
  }
  .admin-flag-toggle-copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
    flex: 1;
  }
  .admin-flag-toggle-title {
    font-size: 13.5px;
    font-weight: 700;
    letter-spacing: -0.01em;
    line-height: 1.25;
    color: var(--admin-ink, var(--paper));
  }
  .admin-flag-toggle-hint {
    font-size: 12px;
    font-weight: 500;
    line-height: 1.35;
    color: var(--admin-ink-muted, var(--paper-dim));
  }

  /* Hero homepage faixas ? Vis�vel switch */
  .home-faixas-admin .admin-flag-toggle--home {
    gap: 12px;
    padding: 10px 12px;
    border-radius: 12px;
    background:
      linear-gradient(
        180deg,
        color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 92%, #fff 8%) 0%,
        var(--bg-overlay, var(--bg-panel)) 100%
      );
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.04);
  }
  html[data-theme="day"] .home-faixas-admin .admin-flag-toggle--home {
    background: color-mix(in srgb, #fff 86%, var(--line));
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7);
  }
  .home-faixas-admin .admin-flag-toggle--home:hover {
    border-color: color-mix(in srgb, var(--line) 45%, var(--amber) 55%);
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 90%, var(--amber) 10%);
  }
  .home-faixas-admin .admin-flag-toggle--home:has(input:checked) {
    border-color: color-mix(in srgb, var(--amber) 55%, var(--line));
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 82%, var(--amber) 18%);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.06),
      0 8px 18px -16px color-mix(in srgb, var(--amber) 75%, transparent);
  }
  .home-faixas-admin .admin-flag-toggle--home:not(:has(input:checked)) {
    opacity: 0.92;
  }
  .home-faixas-admin .admin-flag-toggle--home .admin-flag-toggle-track {
    width: 40px;
    height: 22px;
  }
  .home-faixas-admin .admin-flag-toggle--home .admin-flag-toggle-thumb {
    width: 16px;
    height: 16px;
  }
  .home-faixas-admin .admin-flag-toggle--home input:checked + .admin-flag-toggle-track .admin-flag-toggle-thumb {
    transform: translateX(18px);
  }
  .home-faixas-admin .admin-flag-toggle--home .admin-flag-toggle-title {
    font-size: 13px;
  }
  .home-faixas-admin .admin-flag-toggle--home .admin-flag-toggle-hint {
    font-size: 11.5px;
  }
  .home-faixas-admin .admin-flag-toggle-state {
    flex: 0 0 auto;
    min-width: 2.4rem;
    margin-left: auto;
    padding: 4px 8px;
    border-radius: 999px;
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    background: color-mix(in srgb, var(--bg-panel) 88%, var(--line));
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    line-height: 1;
    text-align: center;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .home-faixas-admin .admin-flag-toggle-state::before {
    content: "Off";
  }
  .home-faixas-admin .admin-flag-toggle--home:has(input:checked) .admin-flag-toggle-state {
    border-color: color-mix(in srgb, var(--amber) 45%, transparent);
    background: color-mix(in srgb, var(--amber) 22%, transparent);
    color: color-mix(in srgb, var(--amber) 70%, var(--admin-ink, #fff));
  }
  .home-faixas-admin .admin-flag-toggle--home:has(input:checked) .admin-flag-toggle-state::before {
    content: "On";
  }
  .home-faixas-admin .hero-cta-admin .admin-flag-toggle--home.full {
    grid-column: 1 / -1;
  }
  .home-faixas-admin .admin-flag-toggle--home-inline {
    flex: 0 0 auto;
    gap: 8px;
    padding: 5px 8px 5px 6px;
    border-radius: 999px;
    min-height: 34px;
  }
  .home-faixas-admin .admin-flag-toggle--home-inline .admin-flag-toggle-copy {
    flex: 0 0 auto;
  }
  .home-faixas-admin .admin-flag-toggle--home-inline .admin-flag-toggle-title {
    font-size: 11.5px;
    font-weight: 700;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    white-space: nowrap;
  }
  .home-faixas-admin .admin-flag-toggle--home-inline .admin-flag-toggle-track {
    width: 34px;
    height: 18px;
  }
  .home-faixas-admin .admin-flag-toggle--home-inline .admin-flag-toggle-thumb {
    width: 12px;
    height: 12px;
    top: 2px;
    left: 2px;
  }
  .home-faixas-admin .admin-flag-toggle--home-inline input:checked + .admin-flag-toggle-track .admin-flag-toggle-thumb {
    transform: translateX(16px);
  }
  .home-faixas-admin .admin-flag-toggle--home-inline .admin-flag-toggle-state {
    min-width: 2rem;
    padding: 3px 6px;
    font-size: 9px;
  }
  @media (max-width: 719px) {
    .home-faixas-admin .hero-cta-admin-tools {
      width: 100%;
      justify-content: space-between;
    }
  }

  /* Promo��es / Liquida��o: show sale prices toggle */
  .admin label.showroom-price-switch,
  .showroom-price-switch {
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 14px;
    margin: 2px 0 0;
    padding: 14px 16px;
    border: 1px solid var(--line);
    border-radius: 14px;
    background: var(--bg-overlay, var(--bg-panel));
    cursor: pointer;
    user-select: none;
    font-weight: 650;
    transition: border-color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease;
  }
  .showroom-price-switch:hover {
    border-color: color-mix(in srgb, var(--line) 55%, var(--amber) 45%);
  }
  .showroom-price-switch:has(input:checked) {
    border-color: color-mix(in srgb, var(--line) 40%, var(--amber) 60%);
    background: color-mix(in srgb, var(--bg-overlay, var(--bg-panel)) 88%, var(--amber) 12%);
    box-shadow: 0 10px 24px -20px color-mix(in srgb, var(--amber) 70%, transparent);
  }
  .showroom-price-switch input {
    position: absolute;
    opacity: 0;
    width: 1px;
    height: 1px;
    margin: 0;
    pointer-events: none;
  }
  .showroom-price-switch-track {
    position: relative;
    flex: 0 0 auto;
    width: 48px;
    height: 28px;
    border-radius: 999px;
    background: color-mix(in srgb, var(--line) 70%, #64748b 30%);
    border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
    transition: background 0.2s ease, border-color 0.2s ease;
  }
  .showroom-price-switch-thumb {
    position: absolute;
    top: 2px;
    left: 2px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: #fff;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.22);
    transition: transform 0.2s ease;
  }
  .showroom-price-switch input:checked + .showroom-price-switch-track {
    background: var(--amber);
    border-color: transparent;
  }
  .showroom-price-switch input:checked + .showroom-price-switch-track .showroom-price-switch-thumb {
    transform: translateX(20px);
  }
  .showroom-price-switch input:focus-visible + .showroom-price-switch-track {
    outline: 2px solid var(--amber);
    outline-offset: 3px;
  }
  .showroom-price-switch-copy {
    display: flex;
    flex-direction: column;
    gap: 4px;
    min-width: 0;
    flex: 1;
  }
  .showroom-price-switch-title {
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--admin-ink, var(--paper));
  }
  .showroom-price-switch-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px 10px;
    font-size: 12px;
    line-height: 1.4;
    font-weight: 500;
    color: var(--admin-ink-muted, var(--paper-dim));
  }
  .showroom-price-switch-status {
    display: inline-flex;
    align-items: center;
    padding: 2px 8px;
    border-radius: 999px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    border: 1px solid var(--line);
    color: var(--admin-ink-muted, var(--paper-dim));
    background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
  }
  .showroom-price-switch-hint {
    min-width: 0;
  }
  .showroom-price-switch-on { display: none; }
  .showroom-price-switch.is-page-inactive {
    border-color: color-mix(in srgb, #e11d48 35%, var(--line, #262626));
    background: color-mix(in srgb, #e11d48 6%, transparent);
  }
  .showroom-price-switch:has(input:checked) .showroom-price-switch-off { display: none; }
  .showroom-price-switch:has(input:checked) .showroom-price-switch-on { display: inline; }
  .showroom-price-switch:has(input:checked) .showroom-price-switch-status {
    border-color: color-mix(in srgb, var(--amber) 45%, var(--line));
    color: color-mix(in srgb, var(--amber) 35%, var(--admin-ink, var(--paper)));
    background: color-mix(in srgb, var(--amber) 14%, transparent);
  }
  /* Showroom admin lists: A��es column hugs content, buttons stay on one row */
  .tutorial-list-table,
  .showroom-entries-table {
    min-width: 720px;
  }
  .tutorial-list-table th:first-child,
  .tutorial-list-table td.showroom-list-date,
  .showroom-entries-table th:first-child,
  .showroom-entries-table td.showroom-list-date {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
    padding-right: 8px;
  }
  .showroom-list-date time {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    line-height: 1.1;
  }
  .showroom-list-date-day {
    font-family: var(--font-mono, ui-monospace, monospace);
    font-size: 16px;
    font-weight: 700;
    letter-spacing: -0.03em;
    font-variant-numeric: tabular-nums;
    color: var(--admin-ink);
  }
  .showroom-list-date-rest {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--admin-ink-muted);
  }

  .tutorial-list-table th:last-child,
  .tutorial-list-table td.tutorial-list-actions,
  .showroom-entries-table th:last-child,
  .showroom-entries-table td.showroom-entries-actions {
    width: 1%;
    white-space: nowrap;
    text-align: left;
    vertical-align: middle;
  }
  .tutorial-list-table td.tutorial-list-actions .row-actions,
  .showroom-entries-table td.showroom-entries-actions .row-actions {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    width: max-content;
    min-width: 0;
  }
  .tutorial-list-table td.tutorial-list-actions .row-actions > a,
  .tutorial-list-table td.tutorial-list-actions .row-actions > button,
  .showroom-entries-table td.showroom-entries-actions .row-actions > a,
  .showroom-entries-table td.showroom-entries-actions .row-actions > button {
    flex: 0 0 auto;
    margin: 0;
  }
  .showroom-list-meta,
  .tutorial-list-meta {
    margin: 0 0 10px;
  }
  .showroom-list-more,
  .tutorial-list-more {
    display: flex;
    justify-content: center;
    margin: 14px 0 4px;
  }
  .tutorial-product-insert {
    margin-top: 14px;
  }
  .tutorial-product-insert-title {
    margin: 0 0 6px;
    font-size: 15px;
    font-weight: 700;
  }
  .list-pick-hit.tutorial-insert-hit {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: nowrap;
    cursor: default;
  }
  .tutorial-insert-hit-main {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 2px;
    color: inherit;
    text-align: left;
    padding: 0;
  }

  .tutorial-related {
    display: flex;
    flex-direction: column;
    gap: 10px;
  }
  .tutorial-related .novidade-product {
    display: grid;
    grid-template-columns: 56px 1fr;
    gap: 10px;
    align-items: center;
    text-decoration: none;
    color: inherit;
    padding: 8px;
    border-radius: var(--radius-sm);
    border: 1px solid transparent;
    transition: var(--transition);
  }
  .tutorial-related .novidade-product:hover {
    border-color: var(--line);
    background: var(--bg-panel-hover);
  }
  .tutorial-related .novidade-product-photo {
    width: 56px;
    height: 56px;
    border-radius: var(--radius-sm);
    overflow: hidden;
    background: var(--bg-deep);
  }
  .tutorial-related .novidade-product-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
  }
  .tutorial-related .novidade-product-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  .tutorial-related .novidade-product-body strong {
    font-size: 12.5px;
    line-height: 1.25;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* ---------- Liquidacao (lista) ---------- */
  .liquidacao-page {
    --liq-bg: #090a0f;
    --liq-panel: #121014;
    --liq-red: #e11d48;
    --liq-red-soft: rgba(225, 29, 72, 0.12);
    --liq-paper: #f2ecec;
    --liq-dim: #95888b;
    --liq-line: rgba(225, 29, 72, 0.2);
    --liq-radius: 12px;
    --liq-radius-sm: 8px;
    --lista-jump-h: 44px;
    --showroom-accent: var(--liq-red);
    overflow: visible;
    color: var(--liq-paper);
    background:
      radial-gradient(ellipse 50% 36% at 8% -4%, var(--liq-red-soft), transparent 58%),
      var(--liq-bg);
  }
  html[data-theme="day"] .liquidacao-page {
    --liq-bg: #f4f0f1;
    --liq-panel: #ffffff;
    --liq-red: #be123c;
    --liq-red-soft: rgba(190, 18, 60, 0.08);
    --liq-paper: #1a1214;
    --liq-dim: #6b5a5e;
    --liq-line: rgba(190, 18, 60, 0.16);
  }

  .liquidacao-shell { display: flex; flex-direction: column; }
  .liquidacao-shell > .liquidacao-banner,
  .liquidacao-shell > .lista-jump,
  .liquidacao-shell > .liq-cat-groups,
  .liquidacao-shell > .liquidacao-empty {
    margin-top: 20px;
  }

  .liquidacao-crumb .back-btn,
  .liquidacao-crumb .breadcrumb,
  .liquidacao-crumb .breadcrumb a { color: var(--liq-dim); }
  .liquidacao-crumb .breadcrumb span,
  .liquidacao-crumb .back-btn:hover { color: var(--liq-paper); }

  .liquidacao-hero {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px 24px;
    padding-bottom: 18px;
    border-bottom: 1px solid var(--liq-line);
  }
  .liquidacao-hero-copy { flex: 1 1 220px; min-width: 0; max-width: 34rem; }
  .liquidacao-kicker {
    margin: 0 0 10px;
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: var(--liq-red);
  }
  .liquidacao-hero h1 {
    margin: 0 0 10px;
    font-size: clamp(28px, 4.5vw, 44px);
    font-weight: 650;
    letter-spacing: -0.035em;
    line-height: 1.08;
    color: var(--liq-paper);
  }
  .liquidacao-lead {
    margin: 0;
    font-size: 14.5px;
    line-height: 1.65;
    color: var(--liq-dim);
    max-width: 42ch;
  }
  .liquidacao-hero-tools { flex: 0 1 auto; min-width: 0; }
  .liquidacao-filters { display: flex; flex-wrap: wrap; gap: 6px; justify-content: flex-end; }
  .liquidacao-filter {
    padding: 7px 12px;
    border: 1px solid var(--liq-line);
    border-radius: 999px;
    background: transparent;
    color: var(--liq-dim);
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 650;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    cursor: pointer;
  }
  .liquidacao-filter:hover { color: var(--liq-paper); border-color: color-mix(in srgb, var(--liq-red) 45%, var(--liq-line)); }
  .liquidacao-filter.is-active {
    color: #fff;
    background: var(--liq-red);
    border-color: transparent;
  }

  .liquidacao-banner {
    display: grid;
    grid-template-columns: 3px minmax(0, 1fr);
    gap: 0 16px;
    align-items: center;
    padding: 14px 16px;
    border: 1px solid var(--liq-line);
    background: var(--liq-panel);
    border-radius: var(--liq-radius);
    overflow: hidden;
  }
  .liquidacao-banner-mark {
    align-self: stretch;
    background: var(--liq-red);
    border-radius: 999px;
  }
  .liquidacao-banner-title {
    margin: 0 0 4px;
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--liq-red);
  }
  .liquidacao-banner-lead {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--liq-dim);
  }

  /* Jump bar � must beat html[data-theme=day] .lista-jump-btn.is-active (amber wash) */
  .liquidacao-page .lista-jump {
    background: color-mix(in srgb, var(--liq-bg) 92%, transparent);
    border-bottom-color: var(--liq-line);
  }
  html[data-theme="day"] .liquidacao-page .lista-jump {
    background: color-mix(in srgb, var(--liq-bg) 96%, #fff 4%);
  }
  .liquidacao-page .lista-jump-btn,
  html[data-theme="day"] .liquidacao-page .lista-jump-btn {
    border: 1px solid var(--liq-line);
    background: var(--liq-panel);
    color: var(--liq-paper);
    border-radius: 999px;
    font-family: var(--font-mono);
    letter-spacing: 0.06em;
    max-width: 22ch;
    opacity: 0.88;
  }
  .liquidacao-page .lista-jump-btn:hover,
  html[data-theme="day"] .liquidacao-page .lista-jump-btn:hover {
    color: var(--liq-paper);
    opacity: 1;
    border-color: color-mix(in srgb, var(--liq-red) 40%, var(--liq-line));
    background: color-mix(in srgb, var(--liq-panel) 88%, var(--liq-red) 12%);
  }
  .liquidacao-page .lista-jump-btn.is-active,
  html[data-theme="day"] .liquidacao-page .lista-jump-btn.is-active {
    color: #fff;
    opacity: 1;
    background: var(--liq-red);
    border-color: transparent;
    box-shadow: 0 1px 0 color-mix(in srgb, var(--liq-red) 35%, transparent);
  }
  .liquidacao-page .lista-jump-arrow,
  html[data-theme="day"] .liquidacao-page .lista-jump-arrow {
    border-color: var(--liq-line);
    background: var(--liq-panel);
    color: var(--liq-paper);
    border-radius: 999px;
  }
  .liquidacao-page .lista-jump-arrow:hover:not(:disabled),
  html[data-theme="day"] .liquidacao-page .lista-jump-arrow:hover:not(:disabled) {
    border-color: color-mix(in srgb, var(--liq-red) 45%, var(--liq-line));
    background: color-mix(in srgb, var(--liq-panel) 85%, var(--liq-red) 15%);
    color: var(--liq-paper);
  }

  .liq-cat-groups {
    display: flex;
    flex-direction: column;
    gap: 36px;
    padding-bottom: 32px;
  }
  .liq-cat-group {
    min-width: 0;
    scroll-margin-top: calc(var(--topbar-h, 72px) + var(--lista-jump-h, 44px) + 12px);
  }
  .liq-cat-head {
    display: grid;
    grid-template-columns: 3px minmax(0, 1fr) auto;
    gap: 0 12px;
    align-items: center;
    margin-bottom: 14px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--liq-line);
  }
  .liq-cat-accent {
    align-self: stretch;
    min-height: 2.5rem;
    background: var(--liq-red);
    border-radius: 999px;
  }
  .liq-cat-kicker {
    margin: 0 0 2px;
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: var(--liq-red);
  }
  .liq-cat-title {
    margin: 0;
    font-size: clamp(20px, 2.8vw, 26px);
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--liq-paper);
  }
  .liq-cat-lead {
    margin: 4px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--liq-dim);
  }
  .liq-cat-meta {
    font-family: var(--font-mono);
    font-size: 12px;
    font-weight: 700;
    color: var(--liq-dim);
    font-variant-numeric: tabular-nums;
  }
  .liq-cat-meta-shown { color: var(--liq-red); }
  .liq-cat-meta-sep { margin: 0 2px; opacity: 0.5; }

  .liquidacao-rows {
    display: flex;
    flex-direction: column;
    gap: 8px;
  }
  .liquidacao-row {
    display: grid;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    gap: 0 12px;
    align-items: center;
    padding: 8px 12px;
    border: 1px solid var(--liq-line);
    background: var(--liq-panel);
    border-radius: var(--liq-radius);
  }
  .liquidacao-row:hover { border-color: color-mix(in srgb, var(--liq-red) 45%, var(--liq-line)); }
  .liquidacao-row.is-soldout { opacity: 0.5; }
  .liquidacao-row-media {
    display: block;
    width: 48px;
    height: 48px;
    overflow: hidden;
    background: var(--liq-bg);
    border: 1px solid var(--liq-line);
    border-radius: 50%;
  }
  .liquidacao-row-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 50%;
  }
  .liquidacao-row-main {
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
  }
  .liquidacao-row-tags {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 6px;
  }
  .liquidacao-row-spec {
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    color: #fff;
    background: var(--liq-red);
    padding: 2px 8px;
    border-radius: 999px;
  }
  .liquidacao-row-kind,
  .liquidacao-row-ref,
  .liquidacao-row-cat {
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.04em;
    color: var(--liq-dim);
  }
  .liquidacao-row-kind {
    text-transform: uppercase;
    padding: 2px 8px;
    border: 1px solid var(--liq-line);
    border-radius: 999px;
  }
  .liquidacao-row-cat {
    max-width: 18ch;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .liquidacao-row-cat::before {
    content: "\00b7";
    margin-right: 6px;
    opacity: 0.55;
  }
  .liquidacao-row-title {
    margin: 0;
    font-size: 14px;
    font-weight: 650;
    letter-spacing: -0.02em;
    line-height: 1.3;
    color: var(--liq-paper);
  }
  .liquidacao-row-title a {
    color: inherit;
    text-decoration: none;
  }
  .liquidacao-row-side {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    gap: 4px;
    min-width: 6.5rem;
    padding-left: 14px;
    border-left: 1px solid var(--liq-line);
    align-self: stretch;
  }
  .liquidacao-prices {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: flex-end;
    gap: 6px 8px;
    margin: 0;
    font-family: var(--font-mono);
  }
  .liquidacao-sale {
    font-size: 15px;
    font-weight: 700;
    color: var(--liq-red);
    font-variant-numeric: tabular-nums;
  }
  .liquidacao-list {
    font-size: 12px;
    color: var(--liq-dim);
    text-decoration: line-through;
    font-variant-numeric: tabular-nums;
  }
  .liquidacao-soldout {
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--liq-dim);
    border-radius: 999px;
  }

  .liquidacao-more { display: flex; justify-content: center; margin-top: 12px; }
  .liquidacao-more-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 38px;
    padding: 0 16px;
    border: 1px solid var(--liq-line);
    border-radius: 999px;
    background: transparent;
    color: var(--liq-paper);
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    cursor: pointer;
  }
  .liquidacao-more-btn:hover {
    border-color: var(--liq-red);
    color: var(--liq-red);
  }
  .liquidacao-more-count { color: var(--liq-red); }

  .liquidacao-empty {
    padding: 24px 16px;
    border: 1px dashed var(--liq-line);
    border-radius: var(--liq-radius);
    color: var(--liq-dim);
    font-size: 13px;
  }
  .liquidacao-empty a { color: var(--liq-red); }

  @media (max-width: 719px) {
    .liquidacao-hero { align-items: stretch; }
    .liquidacao-hero-copy { max-width: none; }
    .liquidacao-filters {
      width: 100%;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
    }
    .liquidacao-filter { width: 100%; text-align: center; }
    .liq-cat-head { grid-template-columns: 3px minmax(0, 1fr); }
    .liq-cat-meta { grid-column: 2; justify-self: start; margin-top: 4px; }
    .liquidacao-row {
      grid-template-columns: 44px minmax(0, 1fr);
      gap: 8px 10px;
    }
    .liquidacao-row-media { width: 44px; height: 44px; }
    .liquidacao-row-cat { max-width: 14ch; }
    .liquidacao-row-side {
      grid-column: 1 / -1;
      flex-direction: row;
      align-items: center;
      justify-content: space-between;
      min-width: 0;
      width: 100%;
      padding: 8px 0 0;
      border-left: 0;
      border-top: 1px solid var(--liq-line);
    }
    .liquidacao-prices { justify-content: flex-start; }
  }

  .pdp-liq-banner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    margin: 0;
  }
  /* Atributo (ex. Fim de S�rie) mais perto do pre�o */
  .pdp-buybox > .pdp-liq-banner + .pdp-price-row {
    margin-top: -8px;
  }
  .pdp-liq-kind,
  .pdp-liq-off {
    display: inline-flex;
    align-items: center;
    padding: 5px 8px;
    border-radius: 2px;
    font-family: var(--font-mono);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    border: 1px solid var(--line);
    background: transparent;
    color: var(--paper-dim);
  }
  .pdp-liq-kind {
    color: var(--liq-red, #e11d48);
    border-color: color-mix(in srgb, var(--liq-red, #e11d48) 45%, var(--line));
  }
  .pdp-liq-notes {
    display: flex;
    flex-direction: column;
    gap: 6px;
    margin: 0 0 14px;
    padding: 12px 14px;
    border-radius: 2px;
    border: 1px solid var(--line);
    background: transparent;
  }
  .pdp-liq-reason,
  .pdp-liq-warranty {
    margin: 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--paper-dim);
  }
  .pdp-liq-reason strong,
  .pdp-liq-warranty strong {
    color: var(--paper);
    font-weight: 650;
    margin-right: 6px;
  }

  /* ——— Iluminação Solar · luminárias autónomas (Emerald + Gallery dusk) ——— */
  .solar-page {
    /* Alinha ao ritmo do .topbar-inner (18 / 28 / 40), não ao .wrap genérico (12 / 24 / 40). */
    --solar-gutter: 18px;
    --solar-emerald: #3ecf8e;
    --solar-emerald-dim: rgba(62, 207, 142, 0.5);
    --solar-emerald-glow: rgba(62, 207, 142, 0.22);
    --solar-warm: rgba(255, 180, 84, 0.35);
    --solar-ink: #eef2f0;
    --solar-muted: rgba(210, 220, 214, 0.62);
    --solar-panel: rgba(12, 14, 12, 0.78);
    --solar-line: rgba(62, 207, 142, 0.2);
    --solar-card: rgba(14, 16, 14, 0.7);
    color: var(--solar-ink);
    max-width: 100%;
    overflow-x: clip;
  }
  @media (min-width: 640px) {
    .solar-page { --solar-gutter: 28px; }
  }
  @media (min-width: 1024px) {
    .solar-page { --solar-gutter: 40px; }
  }
  .solar-page .wrap {
    padding-left: var(--solar-gutter);
    padding-right: var(--solar-gutter);
  }
  html[data-theme="day"] .solar-page {
    --solar-emerald: #0d9488;
    --solar-emerald-dim: rgba(13, 148, 136, 0.45);
    --solar-emerald-glow: rgba(13, 148, 136, 0.16);
    --solar-warm: rgba(196, 126, 18, 0.2);
    --solar-ink: #121816;
    --solar-muted: rgba(40, 55, 48, 0.62);
    --solar-panel: rgba(255, 255, 255, 0.94);
    --solar-line: rgba(13, 148, 136, 0.24);
    --solar-card: rgba(255, 255, 255, 0.96);
  }
  .solar-kicker {
    margin: 0 0 10px;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: var(--solar-emerald);
  }
  .solar-section-head {
    margin: 0 0 28px;
    max-width: 52ch;
  }
  .solar-section-head h2 {
    margin: 0 0 10px;
    font-size: clamp(26px, 3.4vw, 36px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.15;
    color: var(--paper);
  }
  .solar-section-lead {
    margin: 0;
    font-size: 15px;
    line-height: 1.55;
    color: var(--paper-dim);
  }

  .solar-hero {
    position: relative;
    margin: 0 0 var(--space-section);
  }
  .solar-hero-media {
    position: relative;
    min-height: min(78vh, 720px);
    overflow: hidden;
    background: #050807;
  }
  .solar-hero-layer {
    position: absolute;
    inset: 0;
  }
  .solar-hero-layer--mobile {
    display: none;
  }
  @media (max-width: 767px) {
    .solar-hero-layer--desktop {
      display: none;
    }
    .solar-hero-layer--mobile {
      display: block;
    }
  }
  .solar-hero-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: saturate(0.92) contrast(1.02);
    transform: scale(1.02);
  }
  .solar-hero-shade {
    position: absolute;
    inset: 0;
    background:
      linear-gradient(180deg, rgba(8, 10, 9, 0.28) 0%, rgba(8, 10, 9, 0.08) 38%, rgba(8, 10, 9, 0.9) 100%),
      radial-gradient(ellipse 55% 45% at 38% 42%, rgba(255, 180, 84, 0.14), transparent 55%),
      radial-gradient(ellipse 50% 40% at 78% 18%, rgba(62, 207, 142, 0.12), transparent 60%);
    pointer-events: none;
  }
  html[data-theme="day"] .solar-hero-shade {
    background:
      linear-gradient(180deg, rgba(20, 28, 24, 0.2) 0%, rgba(20, 28, 24, 0.06) 40%, rgba(238, 241, 245, 0.94) 100%),
      radial-gradient(ellipse 55% 45% at 38% 42%, rgba(196, 126, 18, 0.1), transparent 55%),
      radial-gradient(ellipse 50% 40% at 78% 18%, rgba(13, 148, 136, 0.1), transparent 60%);
  }
  .solar-hero-grid {
    position: absolute;
    inset: 0;
    background:
      radial-gradient(circle at 40% 45%, rgba(255, 200, 120, 0.08), transparent 28%),
      linear-gradient(180deg, transparent 55%, rgba(0, 0, 0, 0.15) 100%);
    pointer-events: none;
    opacity: 0.9;
  }
  .solar-hero-copy {
    position: absolute;
    left: 0;
    right: 0;
    top: auto;
    bottom: 0;
    z-index: 2;
    pointer-events: none;
    max-width: 100%;
    overflow-wrap: anywhere;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    text-align: right;
    padding-top: clamp(48px, 10vh, 120px);
    padding-bottom: clamp(28px, 5vh, 48px);
    background: linear-gradient(
      0deg,
      rgba(4, 8, 6, 0.88) 0%,
      rgba(4, 8, 6, 0.55) 42%,
      rgba(4, 8, 6, 0.12) 78%,
      rgba(4, 8, 6, 0) 100%
    );
  }
  html[data-theme="day"] .solar-hero-copy {
    background: linear-gradient(
      0deg,
      rgba(238, 241, 245, 0.94) 0%,
      rgba(238, 241, 245, 0.55) 45%,
      rgba(238, 241, 245, 0) 100%
    );
  }
  .solar-hero-copy .solar-kicker {
    margin-bottom: 8px;
  }
  .solar-hero-title {
    margin: 0 0 10px;
    max-width: 12ch;
    font-size: clamp(36px, 7.5vw, 68px);
    font-weight: 700;
    letter-spacing: -0.045em;
    line-height: 0.98;
    color: #f4fbf7;
    text-shadow: 0 8px 28px rgba(0, 0, 0, 0.55);
  }
  html[data-theme="day"] .solar-hero-title {
    color: #071410;
    text-shadow: none;
  }
  .solar-hero-lead {
    margin: 0;
    max-width: min(36ch, 100%);
    margin-left: auto;
    font-size: clamp(14px, 1.55vw, 17px);
    line-height: 1.45;
    color: rgba(230, 245, 236, 0.88);
  }
  html[data-theme="day"] .solar-hero-lead {
    color: rgba(15, 35, 28, 0.78);
  }

  .solar-hotspot {
    position: absolute;
    z-index: 3;
    transform: translate(-50%, -50%);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 0;
    border: 0;
    background: transparent;
    color: #eafff5;
    cursor: pointer;
    touch-action: manipulation;
  }
  .solar-hotspot-pulse {
    position: absolute;
    left: 14px;
    top: 50%;
    width: 28px;
    height: 28px;
    margin: -14px 0 0 -14px;
    border-radius: 999px;
    border: 1px solid var(--solar-emerald-dim);
    box-shadow: 0 0 0 0 var(--solar-emerald-glow);
    animation: solar-pulse 2.4s ease-out infinite;
    pointer-events: none;
  }
  .solar-hotspot.is-active .solar-hotspot-pulse {
    animation-duration: 1.4s;
    border-color: var(--solar-emerald);
  }
  @keyframes solar-pulse {
    0% { transform: scale(0.65); opacity: 0.85; box-shadow: 0 0 0 0 var(--solar-emerald-glow); }
    70% { transform: scale(1.55); opacity: 0; box-shadow: 0 0 0 14px transparent; }
    100% { transform: scale(1.55); opacity: 0; }
  }
  .solar-hotspot-core {
    position: relative;
    z-index: 1;
    display: grid;
    place-items: center;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    border: 1px solid var(--solar-emerald);
    background: rgba(4, 12, 10, 0.78);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.04em;
    box-shadow: 0 0 18px var(--solar-emerald-glow);
    transition: var(--transition);
  }
  .solar-hotspot.is-active .solar-hotspot-core,
  .solar-hotspot:hover .solar-hotspot-core {
    background: var(--solar-emerald);
    color: #04120e;
  }
  .solar-hotspot-label {
    position: relative;
    z-index: 1;
    padding: 4px 10px;
    border-radius: 999px;
    border: 1px solid var(--solar-line);
    background: rgba(4, 12, 10, 0.72);
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.04em;
    white-space: nowrap;
    backdrop-filter: blur(8px);
  }
  html[data-theme="day"] .solar-hotspot-label,
  html[data-theme="day"] .solar-hotspot-core {
    background: rgba(255, 255, 255, 0.9);
    color: #0f1a16;
  }

  .solar-hud-wrap {
    margin-top: -56px;
    position: relative;
    z-index: 4;
  }
  .solar-hud {
    max-width: 420px;
    margin: 0;
    padding: 18px 18px 16px;
    border: 1px solid var(--solar-line);
    border-radius: var(--radius-md);
    background: var(--solar-panel);
    box-shadow: 0 20px 48px rgba(0, 0, 0, 0.28), 0 0 0 1px rgba(52, 211, 153, 0.08);
    backdrop-filter: blur(14px);
  }
  .solar-hud-kicker {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 8px;
    font-size: 11px;
    font-weight: 650;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--solar-emerald);
  }
  .solar-hud-index {
    display: inline-grid;
    place-items: center;
    min-width: 28px;
    height: 22px;
    padding: 0 6px;
    border-radius: 4px;
    border: 1px solid var(--solar-line);
    font-family: var(--font-mono);
    font-size: 10px;
  }
  .solar-hud-title {
    margin: 0 0 8px;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: var(--paper);
  }
  .solar-hud-lead {
    margin: 0 0 14px;
    font-size: 14px;
    line-height: 1.5;
    color: var(--paper-dim);
  }
  .solar-telemetry {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: 0;
  }
  .solar-telemetry-row {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 10px;
    border: 1px solid var(--solar-line);
    border-radius: 4px;
    background: rgba(52, 211, 153, 0.04);
  }
  .solar-telemetry-row dt {
    font-size: 10px;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--paper-dim);
  }
  .solar-telemetry-row dd {
    margin: 0;
    font-size: 13px;
    font-weight: 650;
    color: var(--solar-emerald);
  }

  /* Architectural Gallery · Click-to-Illuminate Night Preview */
  .solar-lamp {
    padding-top: 8px;
  }
  @media (min-width: 980px) {
    .solar-lamp.section {
      padding-bottom: 40px;
      min-height: 0;
    }
    .solar-grelha.section {
      padding-top: 40px;
      min-height: 0;
    }
  }
  .solar-lamp-intro {
    max-width: min(52ch, 100%);
  }
  .solar-lamp-shell {
    min-width: 0;
  }
  .solar-lamp-scene {
    --solar-lamp-rgb: 255, 180, 84;
    position: relative;
    min-height: min(68vh, 620px);
    overflow: hidden;
    border: 1px solid #262626;
    border-radius: 4px;
    background: #05070b;
    color: rgba(255, 220, 160, 0.22);
    isolation: isolate;
  }
  html[data-theme="day"] .solar-lamp-scene {
    border-color: rgba(30, 45, 70, 0.14);
    background: #0b1016;
  }
  .solar-lamp-sky {
    position: absolute;
    inset: 0;
    background:
      radial-gradient(ellipse 55% 36% at 18% 12%, rgba(62, 207, 142, 0.07), transparent 58%),
      radial-gradient(ellipse 48% 30% at 78% 8%, rgba(110, 160, 220, 0.08), transparent 55%),
      linear-gradient(180deg, #0d1420 0%, #080b11 48%, #05070b 100%);
    transition: background 0.55s ease, filter 0.55s ease;
  }
  .solar-lamp-scene.is-on .solar-lamp-sky {
    background:
      radial-gradient(ellipse 50% 38% at 60% 30%, rgba(var(--solar-lamp-rgb), 0.22), transparent 64%),
      radial-gradient(ellipse 40% 28% at 72% 18%, rgba(16, 185, 129, 0.1), transparent 60%),
      linear-gradient(180deg, #121a28 0%, #0a1018 52%, #07090d 100%);
  }
  .solar-lamp-stars {
    position: absolute;
    inset: 0;
    opacity: 0.62;
    background-image:
      radial-gradient(1px 1px at 10% 16%, rgba(255,255,255,0.65), transparent),
      radial-gradient(1px 1px at 22% 10%, rgba(255,255,255,0.4), transparent),
      radial-gradient(1.5px 1.5px at 38% 20%, rgba(255,255,255,0.55), transparent),
      radial-gradient(1px 1px at 54% 8%, rgba(255,255,255,0.35), transparent),
      radial-gradient(1px 1px at 68% 14%, rgba(255,255,255,0.5), transparent),
      radial-gradient(1.5px 1.5px at 81% 22%, rgba(255,255,255,0.42), transparent),
      radial-gradient(1px 1px at 92% 12%, rgba(255,255,255,0.32), transparent),
      radial-gradient(1px 1px at 15% 28%, rgba(255,255,255,0.28), transparent);
    pointer-events: none;
    transition: opacity 0.55s ease;
  }
  .solar-lamp-scene.is-on .solar-lamp-stars {
    opacity: 0.18;
  }
  .solar-lamp-haze {
    position: absolute;
    inset: auto 0 18% 0;
    height: 28%;
    background: linear-gradient(180deg, transparent, rgba(8, 12, 18, 0.55));
    pointer-events: none;
  }
  .solar-lamp-skyline {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 17%;
    width: 100%;
    height: min(46%, 250px);
    color: inherit;
    opacity: 1;
    pointer-events: none;
    filter: drop-shadow(0 -8px 18px rgba(0, 0, 0, 0.35));
  }
  .solar-lamp-skyline-mass {
    fill: #0a0e14;
  }
  .solar-lamp-skyline-windows {
    color: rgba(255, 210, 140, 0.08);
    transition: color 0.55s ease, opacity 0.55s ease;
  }
  .solar-lamp-scene.is-on .solar-lamp-skyline-windows {
    color: rgba(var(--solar-lamp-rgb), 0.42);
  }
  .solar-lamp-ground {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 24%;
    background:
      linear-gradient(180deg, rgba(5, 7, 11, 0) 0%, #080a0e 28%, #040507 100%),
      repeating-linear-gradient(
        90deg,
        rgba(255, 255, 255, 0.015) 0 1px,
        transparent 1px 28px
      );
    pointer-events: none;
  }
  .solar-lamp-path {
    position: absolute;
    left: 18%;
    right: 8%;
    bottom: 6%;
    height: 12%;
    border-radius: 999px;
    background:
      linear-gradient(90deg, transparent, rgba(120, 140, 160, 0.08) 20%, rgba(120, 140, 160, 0.12) 50%, rgba(120, 140, 160, 0.06) 80%, transparent);
    transform: perspective(240px) rotateX(58deg);
    transform-origin: center bottom;
    pointer-events: none;
    opacity: 0.55;
  }
  .solar-lamp-wash {
    position: absolute;
    left: 48%;
    bottom: 5%;
    width: min(54%, 420px);
    height: 22%;
    transform: translateX(-28%);
    border-radius: 50%;
    background:
      radial-gradient(ellipse at center, rgba(var(--solar-lamp-rgb), 0.4) 0%, rgba(var(--solar-lamp-rgb), 0.14) 38%, transparent 72%);
    opacity: 0;
    filter: blur(3px);
    pointer-events: none;
    transition: opacity 0.55s ease, background 0.4s ease, transform 0.55s ease;
  }
  .solar-lamp-scene.is-on .solar-lamp-wash {
    opacity: 1;
    transform: translateX(-28%) scale(1.04);
  }
  .solar-lamp-glow {
    position: absolute;
    left: 58%;
    top: 36%;
    width: 220px;
    height: 220px;
    transform: translate(-50%, -28%);
    border-radius: 50%;
    background: radial-gradient(circle, rgba(var(--solar-lamp-rgb), 0.58) 0%, rgba(var(--solar-lamp-rgb), 0.18) 42%, transparent 70%);
    opacity: 0;
    box-shadow: 0 0 50px rgba(16, 185, 129, 0.28);
    pointer-events: none;
    transition: opacity 0.55s ease, background 0.4s ease, box-shadow 0.55s ease, transform 0.55s ease;
  }
  .solar-lamp-glow--soft {
    width: 340px;
    height: 340px;
    top: 28%;
    filter: blur(8px);
    background: radial-gradient(circle, rgba(var(--solar-lamp-rgb), 0.22), transparent 68%);
  }
  .solar-lamp-scene.is-on .solar-lamp-glow {
    opacity: 1;
    transform: translate(-50%, -28%) scale(1.05);
    box-shadow:
      0 0 50px rgba(var(--solar-lamp-rgb), 0.48),
      0 0 100px rgba(16, 185, 129, 0.28);
  }
  .solar-lamp-scene.is-on .solar-lamp-glow--soft {
    opacity: 0.85;
  }

  .solar-lamp-fixture {
    appearance: none;
    position: absolute;
    left: 58%;
    top: 26%;
    z-index: 3;
    width: 120px;
    height: 250px;
    margin: 0;
    padding: 0;
    border: 0;
    background: transparent;
    transform: translateX(-50%);
    cursor: pointer;
    touch-action: manipulation;
  }
  .solar-lamp-fixture:focus-visible {
    outline: 2px solid var(--solar-emerald);
    outline-offset: 6px;
  }
  .solar-lamp-fixture:hover .solar-lamp-hint {
    opacity: 0.9;
    transform: translateX(-50%) translateY(0);
  }
  .solar-lamp-base {
    position: absolute;
    left: 50%;
    bottom: 2%;
    width: 34px;
    height: 10px;
    transform: translateX(-50%);
    border-radius: 3px;
    background:
      linear-gradient(180deg, #3a4452 0%, #1a2028 55%, #0f1318 100%);
    box-shadow:
      0 4px 10px rgba(0, 0, 0, 0.45),
      inset 0 1px 0 rgba(255, 255, 255, 0.12);
  }
  .solar-lamp-base::after {
    content: "";
    position: absolute;
    left: 50%;
    top: -4px;
    width: 18px;
    height: 6px;
    transform: translateX(-50%);
    border-radius: 2px;
    background: linear-gradient(180deg, #2c3440, #151a21);
  }
  .solar-lamp-pole {
    position: absolute;
    left: 50%;
    bottom: 6%;
    width: 7px;
    height: 62%;
    transform: translateX(-50%);
    border-radius: 3px;
    background:
      linear-gradient(90deg, #151a21 0%, #3a4554 28%, #9aa6b6 48%, #2b3340 72%, #12161d 100%);
    box-shadow:
      0 0 0 1px rgba(0, 0, 0, 0.35),
      4px 0 12px rgba(0, 0, 0, 0.28);
  }
  .solar-lamp-collar {
    position: absolute;
    left: 50%;
    top: 34%;
    width: 16px;
    height: 10px;
    transform: translateX(-50%);
    border-radius: 2px;
    background: linear-gradient(180deg, #4a5564, #1c222b);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.18);
  }
  .solar-lamp-arm {
    position: absolute;
    left: calc(50% - 2px);
    top: 28%;
    width: 28px;
    height: 5px;
    border-radius: 2px;
    background: linear-gradient(90deg, #2a323c, #6a7686 55%, #1c222b);
    transform: rotate(-18deg);
    transform-origin: left center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.35);
  }
  .solar-lamp-fixture .solar-lamp-head {
    position: absolute;
    left: 50%;
    top: 22%;
    width: 58px;
    height: 28px;
    max-width: none;
    transform: translateX(-50%);
    border-radius: 8px 8px 5px 5px;
    background:
      linear-gradient(180deg, #2a323d 0%, #151a22 42%, #0d1117 100%);
    border: 1px solid rgba(180, 200, 220, 0.22);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.14),
      inset 0 -10px 14px rgba(0, 0, 0, 0.45),
      0 8px 18px rgba(0, 0, 0, 0.35);
    transition: background 0.45s ease, box-shadow 0.55s ease, border-color 0.4s ease;
  }
  .solar-lamp-optic {
    position: absolute;
    left: 8px;
    right: 8px;
    top: 5px;
    height: 7px;
    border-radius: 999px;
    background: linear-gradient(90deg, #10141a, #3a4452 50%, #10141a);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.55);
  }
  .solar-lamp-lens {
    position: absolute;
    left: 10px;
    right: 10px;
    bottom: 4px;
    height: 8px;
    border-radius: 2px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.08), rgba(120, 140, 160, 0.18));
    box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12);
    transition: background 0.45s ease, box-shadow 0.55s ease;
  }
  .solar-lamp-scene.is-on .solar-lamp-fixture .solar-lamp-head {
    border-color: rgba(var(--solar-lamp-rgb), 0.7);
    box-shadow:
      inset 0 1px 0 rgba(255, 255, 255, 0.2),
      0 0 18px rgba(var(--solar-lamp-rgb), 0.55),
      0 0 42px rgba(16, 185, 129, 0.28),
      0 10px 22px rgba(0, 0, 0, 0.35);
  }
  .solar-lamp-scene.is-on .solar-lamp-lens {
    background: linear-gradient(180deg, rgba(var(--solar-lamp-rgb), 0.95), rgba(var(--solar-lamp-rgb), 0.45));
    box-shadow:
      0 0 16px rgba(var(--solar-lamp-rgb), 0.75),
      inset 0 0 8px rgba(255, 255, 255, 0.35);
  }
  .solar-lamp-beam {
    position: absolute;
    left: 50%;
    top: 32%;
    width: 110px;
    height: 150px;
    transform: translateX(-50%);
    background: linear-gradient(180deg, rgba(var(--solar-lamp-rgb), 0.42), rgba(var(--solar-lamp-rgb), 0.08) 55%, transparent 85%);
    clip-path: polygon(42% 0, 58% 0, 100% 100%, 0 100%);
    opacity: 0;
    pointer-events: none;
    filter: blur(0.4px);
    transition: opacity 0.55s ease, background 0.4s ease, transform 0.55s ease;
  }
  .solar-lamp-beam--core {
    width: 56px;
    height: 120px;
    top: 33%;
    background: linear-gradient(180deg, rgba(var(--solar-lamp-rgb), 0.72), rgba(var(--solar-lamp-rgb), 0.12) 60%, transparent 88%);
    clip-path: polygon(44% 0, 56% 0, 100% 100%, 0 100%);
    filter: blur(0.2px);
  }
  .solar-lamp-scene.is-on .solar-lamp-beam {
    opacity: 1;
  }
  .solar-lamp-scene.is-on .solar-lamp-beam--core {
    opacity: 0.95;
  }
  .solar-lamp-hint {
    position: absolute;
    left: 50%;
    top: -4px;
    transform: translateX(-50%) translateY(4px);
    padding: 3px 7px;
    border: 1px solid rgba(62, 207, 142, 0.35);
    border-radius: 4px;
    background: rgba(10, 12, 16, 0.82);
    color: var(--solar-emerald);
    font-size: 9px;
    letter-spacing: 0.14em;
    opacity: 0;
    transition: opacity 0.25s ease, transform 0.25s ease;
    pointer-events: none;
  }
  .solar-lamp-scene.is-off .solar-lamp-fixture:hover .solar-lamp-hint {
    opacity: 0.95;
  }

  .solar-lamp-telemetry {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 4;
    display: grid;
    gap: 4px;
    min-width: 156px;
    padding: 12px;
    border: 1px solid #262626;
    border-radius: 4px;
    background: rgba(10, 12, 16, 0.9);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.28);
  }
  html[data-theme="day"] .solar-lamp-telemetry {
    border-color: rgba(30, 45, 70, 0.14);
    background: rgba(255, 255, 255, 0.92);
  }
  .solar-lamp-telemetry p {
    display: flex;
    justify-content: space-between;
    gap: 12px;
    margin: 0;
    font-size: 11px;
    letter-spacing: 0.04em;
  }
  .solar-lamp-telemetry span {
    color: var(--paper-dim);
  }
  .solar-lamp-telemetry strong {
    color: var(--solar-emerald);
    font-weight: 700;
  }
  .solar-lamp-dock {
    position: absolute;
    left: 12px;
    right: 12px;
    bottom: 12px;
    z-index: 4;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px;
    padding: 4px;
    border: 1px solid #262626;
    border-radius: 4px;
    background: rgba(10, 12, 16, 0.88);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
  }
  html[data-theme="day"] .solar-lamp-dock {
    border-color: rgba(30, 45, 70, 0.14);
    background: rgba(255, 255, 255, 0.92);
  }
  .solar-lamp-power {
    appearance: none;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    min-height: 42px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid color-mix(in srgb, var(--solar-emerald) 40%, #262626);
    border-radius: 4px;
    background: rgba(52, 211, 153, 0.06);
    color: var(--paper-dim);
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.08em;
    cursor: pointer;
    transition: color 0.25s ease, background-color 0.25s ease, border-color 0.25s ease, box-shadow 0.3s ease;
  }
  .solar-lamp-power.is-on {
    color: var(--solar-emerald);
    background: rgba(52, 211, 153, 0.12);
    box-shadow: 0 0 22px rgba(16, 185, 129, 0.22);
  }
  .solar-lamp-power-dot {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--paper-dim);
    transition: background-color 0.25s ease, box-shadow 0.3s ease;
  }
  .solar-lamp-power.is-on .solar-lamp-power-dot {
    background: var(--solar-emerald);
    box-shadow: 0 0 12px rgba(16, 185, 129, 0.55);
  }
  .solar-lamp-ccts {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    margin-left: auto;
  }
  .solar-lamp-cct {
    appearance: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 42px;
    margin: 0;
    padding: 0 12px;
    border: 1px solid transparent;
    border-radius: 4px;
    background: transparent;
    color: var(--paper-dim);
    font: inherit;
    font-size: 12px;
    font-weight: 650;
    letter-spacing: 0.04em;
    cursor: pointer;
    transition: color 0.2s ease, background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.25s ease;
  }
  .solar-lamp-cct:hover {
    color: var(--paper);
    background: rgba(52, 211, 153, 0.05);
  }
  .solar-lamp-cct.is-active {
    color: var(--paper);
    border-color: color-mix(in srgb, var(--solar-emerald) 50%, transparent);
    background: rgba(52, 211, 153, 0.08);
    box-shadow: 0 0 0 1px rgba(62, 207, 142, 0.1);
  }
  .solar-lamp-power:focus-visible,
  .solar-lamp-cct:focus-visible {
    outline: 2px solid var(--solar-emerald);
    outline-offset: 2px;
  }

  .solar-grelha {
    padding-bottom: var(--space-section);
    max-width: 100%;
    overflow-x: clip;
  }
  .solar-grelha > .wrap {
    overflow-x: clip;
  }
  .solar-grelha-groups {
    display: flex;
    flex-direction: column;
    gap: clamp(36px, 5vw, 56px);
    counter-reset: solar-grelha-group;
    min-width: 0;
    max-width: 100%;
  }
  .solar-grelha-group {
    position: relative;
    min-width: 0;
    max-width: 100%;
    padding-top: clamp(8px, 1.2vw, 14px);
  }
  .solar-grelha-group + .solar-grelha-group {
    border-top: 1px solid color-mix(in srgb, var(--solar-line) 70%, transparent);
    padding-top: clamp(28px, 4vw, 40px);
  }
  .solar-grelha-group-head {
    display: grid;
    grid-template-columns: auto minmax(0, 1fr);
    gap: 12px 14px;
    align-items: start;
    margin: 0 0 clamp(16px, 2.2vw, 22px);
    max-width: min(56ch, 100%);
  }
  .solar-grelha-group-head.has-more {
    grid-template-columns: auto minmax(0, 1fr) auto;
    max-width: none;
    width: 100%;
  }
  .solar-grelha-group-index {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 2rem;
    height: 2rem;
    margin-top: 2px;
    padding: 0 8px;
    border: 1px solid var(--solar-line);
    border-radius: 4px;
    background: color-mix(in srgb, var(--solar-panel) 70%, transparent);
    color: var(--solar-emerald);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.08em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }
  .solar-grelha-group-copy {
    min-width: 0;
    max-width: min(56ch, 100%);
  }
  .solar-grelha-group-title {
    margin: 0;
    font-size: clamp(20px, 2.4vw, 26px);
    font-weight: 700;
    letter-spacing: -0.035em;
    line-height: 1.2;
    color: var(--paper);
  }
  .solar-grelha-group-lead {
    margin: 8px 0 0;
    max-width: 48ch;
    font-size: 14.5px;
    line-height: 1.55;
    color: var(--paper-dim);
  }
  .solar-grelha-group-more {
    display: inline-flex;
    align-items: center;
    align-self: start;
    margin-top: 6px;
    padding: 0;
    border: 0;
    background: none;
    color: var(--solar-emerald);
    font-size: 12.5px;
    font-weight: 650;
    letter-spacing: 0.04em;
    line-height: 1.2;
    text-decoration: none;
    white-space: nowrap;
    transition: color 0.2s ease, opacity 0.2s ease, text-shadow 0.2s ease;
  }
  .solar-grelha-group-more:hover {
    color: var(--paper);
    text-shadow: 0 0 14px var(--solar-emerald-glow);
  }
  .solar-grelha-group-more:focus-visible {
    outline: 2px solid var(--solar-emerald);
    outline-offset: 3px;
  }
  @media (max-width: 640px) {
    .solar-grelha-group-head {
      gap: 10px 12px;
      margin-bottom: 14px;
    }
    .solar-grelha-group-head.has-more {
      grid-template-columns: auto minmax(0, 1fr);
    }
    .solar-grelha-group-more {
      grid-column: 2;
      margin-top: 2px;
      font-size: 12px;
    }
    .solar-grelha-group-index {
      min-width: 1.75rem;
      height: 1.75rem;
      font-size: 10px;
    }
    .solar-grelha-group-lead {
      font-size: 14px;
    }
  }
  .solar-carousel {
    position: relative;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
  }
  .solar-carousel-track {
    display: flex;
    gap: 14px;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    overflow-x: auto;
    overflow-y: hidden;
    overscroll-behavior-x: contain;
    touch-action: pan-x;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding: 4px 0 10px;
  }
  .solar-carousel-track::-webkit-scrollbar {
    display: none;
  }
  .solar-slide {
    box-sizing: border-box;
    flex: 0 0 auto;
    width: calc((100% - 14px) / 2);
    max-width: calc((100% - 14px) / 2);
    min-width: 0;
    scroll-snap-align: start;
  }
  @media (min-width: 700px) {
    .solar-slide {
      width: calc((100% - 28px) / 3);
      max-width: calc((100% - 28px) / 3);
    }
  }
  @media (min-width: 980px) {
    .solar-slide {
      width: calc((100% - 42px) / 4);
      max-width: calc((100% - 42px) / 4);
    }
  }
  @media (min-width: 1200px) {
    .solar-carousel-track {
      gap: 16px;
    }
    .solar-slide {
      width: calc((100% - 64px) / 5);
      max-width: calc((100% - 64px) / 5);
    }
  }
  .solar-carousel-nav {
    appearance: none;
    position: absolute;
    top: 42%;
    z-index: 3;
    width: 40px;
    height: 40px;
    margin: 0;
    padding: 0;
    border-radius: 999px;
    border: 1px solid var(--solar-line);
    background: color-mix(in srgb, var(--solar-panel) 92%, transparent);
    color: var(--solar-emerald);
    font-size: 22px;
    line-height: 1;
    cursor: pointer;
    transform: translateY(-50%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.18);
    transition:
      opacity 0.2s ease,
      visibility 0.2s ease,
      border-color 0.2s ease,
      box-shadow 0.2s ease,
      background-color 0.2s ease;
  }
  .solar-carousel-nav--prev {
    left: 6px;
  }
  .solar-carousel-nav--next {
    right: 6px;
  }
  .solar-carousel-nav:hover:not(:disabled) {
    border-color: var(--solar-emerald);
    background: var(--solar-panel);
    box-shadow: 0 0 0 1px rgba(62, 207, 142, 0.18), 0 0 18px var(--solar-emerald-glow);
  }
  .solar-carousel-nav:disabled {
    opacity: 0.28;
    cursor: default;
  }
  .solar-carousel-nav:focus-visible {
    outline: 2px solid var(--solar-emerald);
    outline-offset: 2px;
  }
  .solar-carousel:not(.is-scrollable) .solar-carousel-nav {
    display: none;
  }
  /* Desktop: setas só no hover / foco do teclado */
  @media (hover: hover) and (pointer: fine) {
    .solar-carousel-nav {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
    }
    .solar-carousel:hover .solar-carousel-nav:not(:disabled),
    .solar-carousel:focus-within .solar-carousel-nav:not(:disabled) {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }
    .solar-carousel:hover .solar-carousel-nav:disabled,
    .solar-carousel:focus-within .solar-carousel-nav:disabled {
      opacity: 0.28;
      visibility: visible;
      pointer-events: none;
    }
  }
  @media (max-width: 640px) {
    .solar-carousel-nav {
      width: 34px;
      height: 34px;
      font-size: 18px;
      left: 4px;
    }
    .solar-carousel-nav--next {
      left: auto;
      right: 4px;
    }
  }
  /* Admin · Categorias da grelha (accordion) */
  .solar-grelha-admin .solar-grelha-group-card.is-active,
  .solar-grelha-admin .solar-grelha-group-card.is-open {
    border-color: color-mix(in srgb, #3ecf8e 45%, var(--line));
    box-shadow: 0 0 0 1px rgba(62, 207, 142, 0.14);
  }
  .solar-grelha-admin .solar-grelha-group-head {
    display: flex;
    align-items: center;
    gap: 10px;
    margin: 0;
  }
  .solar-grelha-admin .solar-grelha-group-card.is-open .solar-grelha-group-head {
    margin-bottom: 12px;
  }
  .solar-grelha-admin .solar-grelha-accordion-toggle {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-width: 0;
    flex: 1 1 auto;
    justify-content: flex-start;
    text-align: left;
    padding: 4px 6px;
    border: 0;
    background: transparent;
    cursor: pointer;
  }
  .solar-grelha-admin .solar-grelha-accordion-title {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
  }
  .solar-grelha-admin .solar-grelha-accordion-title strong {
    font-size: 14px;
    font-weight: 650;
  }
  .solar-grelha-admin .solar-grelha-chevron {
    flex: 0 0 auto;
    width: 0.55em;
    height: 0.55em;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(-45deg);
    opacity: 0.7;
    transition: transform 0.18s ease;
  }
  .solar-grelha-admin .solar-grelha-group-card.is-open .solar-grelha-chevron {
    transform: rotate(45deg);
  }
  .solar-grelha-admin .solar-grelha-group-card.is-collapsed .solar-grelha-group-body {
    display: none;
  }
  .solar-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    border: 1px solid var(--solar-line);
    border-radius: var(--radius-md);
    background: var(--solar-card);
    overflow: hidden;
    transition:
      border-color 0.28s ease,
      transform 0.35s cubic-bezier(0.16, 1, 0.3, 1),
      box-shadow 0.35s cubic-bezier(0.16, 1, 0.3, 1);
  }
  @media (hover: hover) and (pointer: fine) {
    .solar-card:hover {
      border-color: color-mix(in srgb, var(--solar-emerald) 48%, var(--solar-line));
      transform: translateY(-3px);
      box-shadow:
        0 10px 22px color-mix(in srgb, var(--solar-emerald) 14%, transparent),
        0 0 0 1px color-mix(in srgb, var(--solar-emerald) 20%, transparent);
    }
    html[data-theme="day"] .solar-card:hover {
      box-shadow:
        0 10px 20px rgba(13, 148, 136, 0.1),
        0 0 0 1px color-mix(in srgb, var(--solar-emerald) 22%, transparent);
    }
    .solar-card:hover .solar-card-media img {
      transform: scale(1.035);
    }
  }
  .solar-card-media {
    position: relative;
    display: block;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    background: #0a100e;
  }
  .solar-card-media img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.45s cubic-bezier(0.16, 1, 0.3, 1);
  }
  .solar-card-tag,
  .solar-card-ref {
    position: absolute;
    z-index: 1;
    padding: 4px 6px;
    border-radius: 3px;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.05em;
    line-height: 1;
  }
  .solar-card-tag {
    top: 8px;
    left: 8px;
    color: #04120e;
    background: var(--solar-emerald);
    box-shadow: 0 0 16px var(--solar-emerald-glow);
  }
  .solar-card-ref {
    top: 8px;
    right: 8px;
    color: #eafff5;
    border: 1px solid rgba(52, 211, 153, 0.35);
    background: rgba(4, 12, 10, 0.72);
    backdrop-filter: blur(8px);
  }
  html[data-theme="day"] .solar-card-ref {
    color: #0f1a16;
    background: rgba(255, 255, 255, 0.88);
  }
  .solar-card-body {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 10px 10px 12px;
    flex: 1;
  }
  .solar-card-meta {
    margin: 0;
    font-size: 9.5px;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--solar-emerald);
  }
  .solar-card-title {
    margin: 0;
    font-size: 13px;
    font-weight: 650;
    letter-spacing: -0.015em;
    line-height: 1.28;
  }
  .solar-card-title a {
    color: var(--paper);
    text-decoration: none;
  }
  .solar-card-title a:hover {
    color: var(--solar-emerald);
  }
  .solar-card-sku {
    margin: 0 0 6px;
    font-size: 10px;
    color: var(--paper-dim);
  }
  .solar-card-foot {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: auto;
  }
  .solar-card-price {
    margin: 0;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.02em;
    font-variant-numeric: tabular-nums;
    color: var(--amber);
  }
  .solar-card-cta {
    appearance: none;
    width: 100%;
    min-height: 34px;
    padding: 0 10px;
    border-radius: 4px;
    border: 1px solid var(--solar-emerald);
    background: rgba(52, 211, 153, 0.1);
    color: var(--solar-emerald);
    font: inherit;
    font-size: 11.5px;
    font-weight: 650;
    letter-spacing: 0.02em;
    cursor: pointer;
    transition: var(--transition);
  }
  .solar-card-cta:hover {
    background: var(--solar-emerald);
    color: #04120e;
    box-shadow: 0 0 20px var(--solar-emerald-glow);
  }

  @media (max-width: 980px) {
    .solar-lamp-scene {
      min-height: min(58vh, 500px);
    }
    .solar-lamp-fixture {
      left: 50%;
      top: 22%;
      width: 112px;
      height: 228px;
    }
    .solar-lamp-glow {
      left: 50%;
      width: 180px;
      height: 180px;
    }
    .solar-lamp-glow--soft {
      width: 280px;
      height: 280px;
    }
    .solar-lamp-wash {
      left: 50%;
      width: min(72%, 340px);
      transform: translateX(-50%);
    }
    .solar-lamp-scene.is-on .solar-lamp-wash {
      transform: translateX(-50%) scale(1.04);
    }
    .solar-lamp-telemetry {
      top: 10px;
      right: 10px;
      left: auto;
      min-width: 0;
      width: auto;
      max-width: min(46vw, 168px);
      padding: 9px 10px;
      gap: 3px;
    }
    .solar-lamp-telemetry p {
      font-size: 10px;
      gap: 8px;
    }
    .solar-lamp-dock {
      left: 8px;
      right: 8px;
      bottom: 8px;
      gap: 6px;
      padding: 6px;
    }
    .solar-lamp-power,
    .solar-lamp-cct {
      min-height: 44px;
    }
  }
  @media (max-width: 899px) {
    .solar-hero-media {
      min-height: min(70vh, 560px);
    }
    .solar-hotspot-label {
      display: none;
    }
    .solar-hero-copy {
      padding-bottom: clamp(56px, 12vh, 88px);
    }
    .solar-hero-lead {
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      line-clamp: 2;
      overflow: hidden;
    }
    .solar-hud-wrap {
      margin-top: -40px;
    }
    .solar-hud {
      max-width: none;
      padding: 16px;
    }
  }
  @media (max-width: 560px) {
    .solar-telemetry {
      grid-template-columns: 1fr;
    }
    .solar-hero-copy {
      padding-top: 64px;
      padding-bottom: 72px;
    }
    .solar-hero-title {
      max-width: 10ch;
      font-size: clamp(34px, 10.5vw, 44px);
    }
    .solar-hero-lead {
      display: none;
    }
    .solar-card-body {
      padding: 9px 9px 11px;
    }
    .solar-card-title {
      font-size: 12.5px;
    }
    .solar-card-price {
      font-size: 13.5px;
    }
    .solar-lamp-scene {
      min-height: min(64vh, 440px);
      border-radius: 3px;
    }
    .solar-lamp-skyline {
      bottom: 22%;
      height: min(40%, 180px);
    }
    .solar-lamp-ground {
      height: 28%;
    }
    .solar-lamp-fixture {
      left: 50%;
      top: 18%;
      width: 92px;
      height: 188px;
    }
    .solar-lamp-fixture .solar-lamp-head {
      width: 48px;
      height: 22px;
    }
    .solar-lamp-beam {
      width: 88px;
      height: 120px;
    }
    .solar-lamp-beam--core {
      width: 44px;
      height: 96px;
    }
    .solar-lamp-glow {
      left: 50%;
      top: 34%;
      width: 140px;
      height: 140px;
    }
    .solar-lamp-glow--soft {
      width: 220px;
      height: 220px;
      top: 26%;
    }
    .solar-lamp-wash {
      bottom: 18%;
      width: min(78%, 280px);
      height: 16%;
    }
    .solar-lamp-hint {
      top: -10px;
      font-size: 8px;
      letter-spacing: 0.1em;
    }
    /* No hover on phones — show hint when lamp is off */
    .solar-lamp-scene.is-off .solar-lamp-hint {
      opacity: 0.85;
      transform: translateX(-50%) translateY(0);
    }
    .solar-lamp-telemetry {
      top: 8px;
      left: 8px;
      right: 8px;
      max-width: none;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: center;
      gap: 6px 12px;
      padding: 8px 10px;
      box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
    }
    .solar-lamp-telemetry p {
      flex: 1 1 auto;
      justify-content: flex-start;
      gap: 6px;
      font-size: 10px;
      white-space: nowrap;
    }
    .solar-lamp-dock {
      left: 8px;
      right: 8px;
      bottom: max(8px, env(safe-area-inset-bottom, 0px));
      flex-direction: column;
      align-items: stretch;
      gap: 6px;
      padding: 6px;
    }
    .solar-lamp-ccts {
      margin-left: 0;
      width: 100%;
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 4px;
    }
    .solar-lamp-power {
      width: 100%;
      justify-content: center;
      min-height: 46px;
      font-size: 11px;
      letter-spacing: 0.06em;
    }
    .solar-lamp-cct {
      flex: none;
      width: 100%;
      min-height: 42px;
      padding: 0 6px;
      font-size: 11px;
      justify-content: center;
    }
  }

  .products-admin-cat-filters {
    margin-top: 8px;
  }
  .products-admin-cat-head td {
    padding: 10px 12px 6px;
    border-bottom: 1px solid var(--line);
    background: color-mix(in srgb, var(--bg-panel) 70%, transparent);
  }
  .products-admin-cat-head span {
    display: inline-block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--amber);
  }
  .lixeira-admin .admin-page-head {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 16px;
  }
  .lixeira-admin .admin-page-head h1 {
    margin: 0 0 4px;
  }
  .lixeira-admin-table td .product-edit-link {
    display: flex;
    align-items: center;
    gap: 10px;
  }