@font-face {
      font-family: 'Bifur';
      src: url('Bifur-Regular.ttf') format('truetype');
      font-weight: normal;
      font-style: normal;
    }
    :root {
      --cream: #fefeed;
      --cream-dark: #f4f2e8;
      --black: #000000;
      --charcoal: #1a1a1a;
      --warm-gray: #6b6560;
      --brown: #39100f;
      --brown-border: #5a1e1d;
      --blue-accent: #7f97d1;
      --hot-orange: #f1562e;
      --red: #c0392b;
      --green: #2d6a4f;
      --blue: #1a3a5c;
      --border: #ddd9cc;
      --shadow: rgba(10,10,10,0.12);
      --sat: env(safe-area-inset-top);
      --sab: env(safe-area-inset-bottom);
      --sal: env(safe-area-inset-left);
      --sar: env(safe-area-inset-right);
    }
    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html { font-size: 16px; scroll-behavior: smooth; }
    body {
      font-family: 'DM Sans', sans-serif;
      background: var(--cream);
      color: var(--charcoal);
      min-height: 100vh;
      -webkit-font-smoothing: antialiased;
    }
    /* ── MOBILE / PWA TOUCH GLOBALS ── */
    * {
      -webkit-tap-highlight-color: transparent;
    }
    html, body {
      overscroll-behavior: none;
    }
    html {
      -webkit-overflow-scrolling: touch;
    }
    img, svg, button, a, label, [role="button"] {
      -webkit-touch-callout: none;
      -webkit-user-select: none;
      user-select: none;
    }
    a, button, input, select, textarea, label, [role="button"], [role="tab"] {
      touch-action: manipulation;
    }
    /* ── HEADER ── */
    header {
      background: var(--brown);
      padding: 0 24px;
      padding-top: var(--sat);
      padding-left: max(24px, var(--sal));
      padding-right: max(24px, var(--sar));
      position: sticky;
      top: 0;
      z-index: 100;
      border-bottom: 1px solid var(--brown-border);
    }
    .header-inner {
      max-width: 900px;
      margin: 0 auto;
      display: grid;
      grid-template-columns: auto 1fr auto;
      align-items: center;
      min-height: 60px;
      padding: 8px 0;
    }
    .header-counter-slot {
      display: flex;
      justify-content: center;
      padding-right: 40px;
    }
    .header-logo-wrap {
      display: flex;
      align-items: center;
    }
    /* ── HEADER MENU ── */
    .header-menu-wrap {
      position: relative;
      display: flex;
      justify-content: flex-end;
    }
    .header-menu-btn {
      background: none;
      border: none;
      padding: 6px;
      margin: 0;
      cursor: pointer;
      color: #ffffff;
      display: flex;
      align-items: center;
      opacity: 0.85;
    }
    .header-menu-btn:hover { opacity: 1; }
    .header-menu-wrap { align-items: center; gap: 10px; }
    .header-upgrade-btn {
      background: var(--hot-orange);
      color: #ffffff;
      border: none;
      border-radius: 999px;
      padding: 6px 14px;
      font-family: 'DM Mono', monospace;
      font-size: 0.68rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      cursor: pointer;
      white-space: nowrap;
    }
    .header-upgrade-btn:hover { filter: brightness(1.08); }
    .header-upgrade-btn:disabled { opacity: 0.6; cursor: default; }
    .header-login-btn {
      background: none;
      color: var(--cream);
      border: 1.5px solid var(--cream);
      border-radius: 999px;
      padding: 5px 14px;
      font-family: 'DM Mono', monospace;
      font-size: 0.68rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      cursor: pointer;
      white-space: nowrap;
    }
    .header-login-btn:hover { background: rgba(254,254,237,0.1); }
    /* Guest mode: the auth screen opens over the app and can be dismissed */
    .auth-close-btn {
      position: fixed;
      top: calc(16px + var(--sat));
      right: max(16px, var(--sar));
      background: none;
      border: none;
      color: var(--cream);
      opacity: 0.75;
      padding: 8px;
      cursor: pointer;
      z-index: 201;
    }
    .auth-close-btn:hover { opacity: 1; }
    /* Guest login pop-up — reuses the feedback/Field Guide modal styles.
       Sits above Rate a spot (10000) since guests get prompted from inside it. */
    #login-modal-overlay { z-index: 10002; }
    .login-modal-code-input { letter-spacing: 0.3em; text-align: center; font-size: 1.1rem; }
    .login-modal-note { font-size: 0.78rem; color: var(--warm-gray); line-height: 1.4; margin: 0; }
    .login-modal-note a { color: var(--hot-orange); }
    .login-modal-error {
      display: none;
      font-size: 0.8rem;
      color: var(--red);
      margin-top: 10px;
    }
    .saved-guest-prompt { text-align: center; padding: 60px 24px; }
    .saved-guest-prompt .saved-empty { padding: 0 0 20px; }
    .saved-guest-prompt .btn-primary { max-width: 260px; margin: 0 auto; }
    .header-menu-dropdown {
      display: none;
      position: absolute;
      top: calc(100% + 10px);
      right: 0;
      min-width: 220px;
      background: var(--cream);
      border-radius: 12px;
      box-shadow: 0 12px 32px rgba(0,0,0,0.28);
      overflow: hidden;
      z-index: 200;
    }
    .header-menu-dropdown.open { display: block; }
    .header-menu-item {
      width: 100%;
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 12px 16px;
      background: none;
      border: none;
      border-bottom: 1px solid var(--border);
      color: var(--charcoal);
      font-family: 'DM Sans', sans-serif;
      font-size: 0.88rem;
      text-align: left;
      cursor: pointer;
    }
    .header-menu-item:last-child { border-bottom: none; }
    .header-menu-item:hover { background: var(--cream-dark); }
    .header-menu-item svg { flex-shrink: 0; color: var(--warm-gray); }
    .header-logo-lockup {
      display: block;
      height: 34px;
      width: auto;
    }
    .logo-lockup-stacked { display: none; }
    .tagline-hero {
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      color: var(--brown);
      letter-spacing: 0.12em;
      text-transform: uppercase;
      text-align: center;
      margin-bottom: 8px;
    }
    #search-counter {
      display: none;
      flex-direction: column;
      align-items: stretch;
      gap: 2px;
    }
    .counter-text {
      text-align: center;
    }
    .counter-track-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
    }
    .counter-text {
      font-family: 'DM Mono', monospace;
      font-size: 0.62rem;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: rgba(254,254,237,0.5);
      white-space: nowrap;
      line-height: 1.1;
    }
    #search-counter.low .counter-text { color: #e0a877; }
    #search-counter.exhausted .counter-text { color: #e08877; }
    .counter-fraction {
      font-family: 'Cormorant Garamond', serif;
      font-size: 0.95rem;
      font-weight: 600;
      color: var(--cream);
      letter-spacing: 0;
      white-space: nowrap;
      line-height: 1.1;
    }
    #search-counter.low .counter-fraction { color: #e0a877; }
    #search-counter.exhausted .counter-fraction { color: #e08877; }
    /* ── AUTH SCREEN ── */
    #auth-screen {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      padding: 40px 24px 80px;
      background: var(--brown);
      position: fixed;
      inset: 0;
      z-index: 10001; /* above modals like Rate a spot (10000) — guests get prompted from inside them */
      overflow-y: auto;
      transition: opacity 0.5s ease, visibility 0.5s ease;
    }
    .auth-screen-inner {
      width: 100%;
      max-width: 420px;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding-top: 48px;
    }
    .auth-sample-label {
      font-family: 'DM Mono', monospace;
      font-size: 0.62rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: rgba(254,254,237,0.4);
      text-align: center;
      margin-top: 56px;
      margin-bottom: 20px;
      display: flex;
      align-items: center;
      gap: 12px;
      width: 100%;
    }
    .auth-sample-label::before,
    .auth-sample-label::after {
      content: '';
      flex: 1;
      height: 1px;
      background: var(--brown-border);
    }
    .auth-sample-verdict {
      width: 100%;
      background: var(--cream);
      border-radius: 12px;
      overflow: hidden;
      border: 1.5px solid var(--cream);
    }
    .auth-sample-verdict-header {
      background: var(--brown-border);
      border-bottom: 1px solid rgba(254,254,237,0.15);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      transition: background 0.2s;
    }
    .auth-sample-verdict-header:hover {
      background: #6b2423;
    }
    .auth-sample-item-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: 0.88rem;
      font-style: italic;
      color: var(--cream);
      line-height: 1.4;
      letter-spacing: 0.01em;
      text-align: center;
    }
    .auth-sample-verdict .result-card {
      border-left: none;
      border-right: none;
      border-radius: 0;
    }
    .auth-sample-verdict .result-card:first-of-type {
      border-top: none;
    }
    .auth-sample-verdict .result-card:last-of-type {
      border-bottom: none;
      margin-bottom: 0;
    }
    .auth-sample-toggle {
      display: grid;
      grid-template-columns: 1fr auto 1fr;
      align-items: center;
      gap: 12px;
      width: 100%;
      background: none;
      border: none;
      cursor: pointer;
      padding: 18px 28px;
      text-align: left;
    }
    .auth-sample-toggle-chevron {
      font-size: 0.55rem;
      color: #444;
      transition: transform 0.25s ease;
      flex-shrink: 0;
      margin-left: 8px;
      letter-spacing: 0;
    }
    .auth-sample-toggle-chevron.open {
      transform: rotate(180deg);
    }
    .auth-sample-body {
      overflow: hidden;
      max-height: 0;
      transition: max-height 0.35s ease;
    }
    .auth-sample-body.open {
      max-height: 2000px;
    }
    #auth-screen.hidden {
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
    }
    .auth-logo-row {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 16px;
      margin-bottom: 8px;
    }
    .auth-logo-img {
      height: clamp(3.3rem, 9.9vw, 5.28rem);
      width: clamp(3.3rem, 9.9vw, 5.28rem);
      object-fit: contain;
      flex-shrink: 0;
    }
    .auth-logo {
      font-family: 'Bifur', sans-serif;
      font-size: clamp(1.5rem, 4.5vw, 2.4rem);
      font-weight: normal;
      color: var(--cream);
      text-align: left;
      letter-spacing: 0.04em;
      line-height: 1.1;
    }
    .auth-tagline {
      font-family: 'DM Mono', monospace;
      font-size: 0.7rem;
      color: #ffffff;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      text-align: center;
      margin-bottom: 56px;
    }
    .auth-card {
      background: transparent;
      border: 1.5px solid var(--cream);
      border-radius: 12px;
      padding: 40px 36px;
      width: 100%;
      max-width: 420px;
    }
    .auth-card h2 {
      font-family: 'Bifur', sans-serif;
      font-size: 1.35rem;
      font-weight: normal;
      color: #ffffff;
      margin-bottom: 8px;
      text-align: center;
    }
    .auth-card p {
      font-size: 0.85rem;
      color: #ffffff;
      line-height: 1.6;
      margin-bottom: 28px;
      text-align: center;
    }
    .auth-card p a {
      color: var(--hot-orange);
      text-decoration: none;
    }
    .input-group {
      margin-bottom: 16px;
    }
    .input-group label {
      display: block;
      font-size: 0.72rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: #ffffff;
      margin-bottom: 8px;
      font-family: 'DM Mono', monospace;
      text-align: center;
    }
    .input-group input {
      width: 100%;
      background: rgba(0,0,0,0.25);
      border: 1px solid rgba(254,254,237,0.4);
      color: var(--cream);
      font-family: 'DM Sans', sans-serif;
      font-size: 0.95rem;
      padding: 13px 16px;
      border-radius: 8px;
      outline: none;
      transition: border-color 0.2s;
      text-align: center;
    }
    .input-group input:focus {
      border-color: var(--cream);
    }
    .input-group input::placeholder {
      color: rgba(254,254,237,0.35);
    }
    .btn-primary {
      width: 100%;
      background: var(--blue-accent);
      color: var(--black);
      font-family: 'DM Sans', sans-serif;
      font-weight: 500;
      font-size: 0.85rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      padding: 14px 24px;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      transition: background 0.2s, transform 0.1s;
      margin-top: 8px;
      white-space: nowrap;
    }
    .btn-primary:hover { background: #9aadd8; }
    .btn-primary:active { transform: scale(0.99); }
    .btn-primary:disabled { opacity: 0.5; cursor: not-allowed; }
    .auth-error {
      font-size: 0.8rem;
      color: #f08080;
      margin-top: 12px;
      display: none;
      font-family: 'DM Mono', monospace;
      text-align: center;
    }
    .auth-note {
      margin-top: 20px;
      font-size: 0.75rem;
      color: rgba(254,254,237,0.6);
      text-align: center;
      line-height: 1.5;
    }
    .auth-note a {
      color: var(--hot-orange);
      text-decoration: none;
    }
    /* ── MAIN APP ── */
    #app-screen {
      max-width: 900px;
      margin: 0 auto;
      padding: 48px 24px calc(80px + var(--footer-h, 110px));
    }
    /* ── HERO ── */
    .hero {
      text-align: center;
      padding-bottom: 48px;
      border-bottom: 1px solid var(--border);
    }
    .hero-eyebrow {
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--brown);
      margin-bottom: 16px;
    }
    .hero h1 {
      font-family: 'Bifur', sans-serif;
      font-size: clamp(2rem, 5vw, 3.2rem);
      font-weight: normal;
      color: var(--black);
      line-height: 1.15;
      margin-bottom: 16px;
    }
    .hero h1 em {
      font-style: normal;
      color: var(--blue-accent);
    }
    .hero p {
      font-size: 1rem;
      color: var(--warm-gray);
      max-width: 520px;
      margin: 0 auto;
      line-height: 1.7;
    }
    /* ── BSH LEGEND ── */
    .bsh-legend {
      display: flex;
      gap: 16px;
      justify-content: center;
      margin-top: 28px;
      flex-wrap: wrap;
    }
    .bsh-badge {
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      padding: 5px 12px;
      border-radius: 8px;
      font-weight: 400;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 7px;
      width: 92px;
    }
    .bsh-badge svg { width: 18px; height: 18px; flex-shrink: 0; }
    .bsh-buy { background: #e8f5ee; color: var(--green); border: 1px solid #b8ddc8; }
    .bsh-sell { background: #fdece4; color: var(--hot-orange); border: 1px solid #f5c1a3; }
    .bsh-hold { background: #eef3fa; color: var(--blue); border: 1px solid #b8cde8; }
    .bsh-pass { background: #707070; color: var(--cream); border: 1px solid #808080; }
    /* ── INPUT TABS ── */
    .input-section {
      background: white;
      border: 1px solid var(--border);
      border-radius: 12px;
      overflow: hidden;
      box-shadow: 0 2px 16px var(--shadow);
      margin-bottom: 40px;
    }
    .tab-bar {
      display: flex;
      border-bottom: 1px solid var(--border);
      background: var(--cream-dark);
    }
    .tab-btn {
      flex: 1;
      padding: 14px 20px;
      font-family: 'DM Mono', monospace;
      font-size: 0.68rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--warm-gray);
      background: none;
      border: none;
      cursor: pointer;
      transition: all 0.2s;
      border-bottom: 2px solid transparent;
    }
    .tab-btn.active {
      color: var(--black);
      background: white;
      border-bottom-color: var(--blue-accent);
    }
    .tab-icon {
      display: inline-flex;
      vertical-align: -3px;
      margin-right: 6px;
      color: var(--brown);
      transition: color 0.2s;
    }
    .tab-icon svg { width: 15px; height: 15px; display: block; }
    .tab-content {
      padding: 32px;
      display: none;
    }
    .tab-content.active { display: block; }
    .mode-content { display: none; }
    .mode-content.active { display: block; }
    #mode-sell { padding: 32px; }
    .tab-content label, #mode-sell label {
      display: block;
      font-family: 'DM Mono', monospace;
      font-size: 0.68rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--warm-gray);
      margin-bottom: 10px;
    }
    .url-input-wrap {
      display: flex;
      gap: 12px;
      align-items: flex-start;
      flex-wrap: wrap;
    }
    .url-input-wrap input {
      background: var(--cream);
      border: 1px solid var(--border);
      color: var(--charcoal);
      font-family: 'DM Sans', sans-serif;
      font-size: 0.9rem;
      padding: 13px 16px;
      border-radius: 8px;
      outline: none;
      transition: border-color 0.2s;
    }
    .url-input-wrap input[type="url"] { flex: 1; min-width: 180px; }
    .url-input-wrap input[type="text"] { flex: 0 0 auto; }
    .url-input-wrap input:focus { border-color: var(--blue-accent); }
    .url-input-wrap input::placeholder { color: #aaa; }
    .price-field-wrap input::placeholder { color: #aaa; }
    .comfort-check .comfort-check-label {
      font-family: 'DM Sans', sans-serif;
      font-size: 0.92rem;
      font-weight: 400;
      text-transform: none;
      letter-spacing: 0;
      color: var(--charcoal);
      margin-bottom: 10px;
    }
    .comfort-chip-row { display: flex; gap: 8px; flex-wrap: nowrap; }
    .comfort-chip {
      flex: 1 1 0;
      padding: 10px 14px;
      font-family: 'DM Sans', sans-serif;
      font-weight: 400;
      font-size: 0.8rem;
      color: var(--charcoal);
      background: var(--cream);
      border: 1.5px solid var(--border);
      border-radius: 24px;
      cursor: pointer;
      transition: all 0.15s;
      text-align: center;
      white-space: nowrap;
    }
    .comfort-chip:hover { border-color: var(--blue-accent); transform: translateY(-1px); box-shadow: 0 2px 6px rgba(0,0,0,0.08); }
    .comfort-chip.active {
      background: var(--blue-accent);
      border-color: var(--blue-accent);
      color: var(--black);
      font-weight: 700;
      box-shadow: 0 3px 10px rgba(127,151,209,0.4);
    }
    .btn-analyze {
      background: var(--black);
      color: var(--cream);
      font-family: 'DM Sans', sans-serif;
      font-weight: 500;
      font-size: 0.82rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding: 13px 24px;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      white-space: nowrap;
      transition: background 0.2s;
      flex-shrink: 0;
    }
    .btn-analyze:hover { background: var(--charcoal); }
    .btn-analyze:disabled { opacity: 0.4; cursor: not-allowed; }
    .platform-chips {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-top: 12px;
    }
    .chip {
      font-family: 'DM Mono', monospace;
      font-size: 0.6rem;
      letter-spacing: 0.08em;
      padding: 3px 8px;
      background: var(--cream-dark);
      border: 1px solid var(--border);
      color: var(--warm-gray);
      border-radius: 1px;
    }
    /* text mode */
    .text-input-area {
      width: 100%;
      background: var(--cream);
      border: 1px solid var(--border);
      color: var(--charcoal);
      font-family: 'DM Sans', sans-serif;
      font-size: 0.9rem;
      line-height: 1.6;
      padding: 16px;
      border-radius: 8px;
      outline: none;
      resize: vertical;
      min-height: 140px;
      transition: border-color 0.2s;
    }
    .text-input-area:focus { border-color: var(--blue-accent); }
    .text-input-area::placeholder { color: #aaa; }
    /* photo mode */
    .upload-zone {
      border: 2px dashed var(--border);
      border-radius: 2px;
      padding: 40px 24px;
      text-align: center;
      cursor: pointer;
      transition: all 0.2s;
      background: var(--cream);
      position: relative;
    }
    .upload-zone:hover { border-color: var(--blue-accent); background: #faf6ef; }
    .upload-zone.drag-over { border-color: var(--blue-accent); background: #faf6ef; }
    .upload-zone input[type="file"] {
      position: absolute;
      inset: 0;
      opacity: 0;
      cursor: pointer;
      width: 100%;
      height: 100%;
    }
    .upload-icon {
      display: inline-block;
      width: 32px;
      height: 32px;
      margin-bottom: 12px;
      color: var(--brown);
      transition: color 0.2s;
    }
    .upload-icon svg { width: 100%; height: 100%; display: block; }
    .upload-zone p {
      font-size: 0.85rem;
      color: var(--warm-gray);
      margin-bottom: 4px;
    }
    .upload-zone small {
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      color: #aaa;
      letter-spacing: 0.06em;
    }
    .preview-img {
      max-width: 100%;
      max-height: 200px;
      object-fit: contain;
      margin: 16px auto 0;
      display: block;
      border: 1px solid var(--border);
    }
    .btn-row {
      display: flex;
      justify-content: flex-end;
      margin-top: 16px;
    }
    /* ── LOADING ── */
    #loading-state {
      display: none;
      text-align: center;
      padding: 56px 24px;
      background: white;
      border: 1px solid var(--border);
      margin-bottom: 40px;
    }
    .loading-logo {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.1rem;
      font-style: italic;
      color: var(--warm-gray);
      margin-bottom: 24px;
    }
    .loading-bar-wrap {
      width: 200px;
      height: 2px;
      background: var(--cream-dark);
      margin: 0 auto 20px;
      overflow: hidden;
    }
    .loading-bar {
      height: 100%;
      background: var(--blue-accent);
      animation: loading-sweep 1.8s ease-in-out infinite;
    }
    @keyframes loading-sweep {
      0% { width: 0%; margin-left: 0%; }
      50% { width: 60%; margin-left: 20%; }
      100% { width: 0%; margin-left: 100%; }
    }
    .loading-status {
      font-family: 'DM Mono', monospace;
      font-size: 0.68rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--warm-gray);
      line-height: 1.5;
      height: 3em; /* fixed: room for 2 lines so wrapping never resizes the box */
      overflow: hidden;
    }
    /* ── RESULT ── */
    #result-section {
      display: none;
    }
    @keyframes fadeUp {
      from { opacity: 0; transform: translateY(12px); }
      to { opacity: 1; transform: translateY(0); }
    }
    .panel-enter {
      animation: fadeUp 0.35s ease both;
    }
    .result-header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 16px;
      margin-bottom: 28px;
      flex-wrap: wrap;
    }
    .result-item-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.6rem;
      font-weight: 600;
      color: var(--black);
      line-height: 1.2;
    }
    .result-verdict-badge {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.4rem;
      font-weight: 600;
      font-style: italic;
      padding: 10px 24px;
      border-radius: 8px;
      white-space: nowrap;
      flex-shrink: 0;
    }
    .verdict-BUY { background: var(--green); color: white; }
    .verdict-SELL { background: var(--hot-orange); color: white; }
    .verdict-HOLD { background: var(--blue); color: white; }
    .verdict-PASS { background: #707070; color: var(--cream); }
    .verdict-INCONCLUSIVE { background: #b8860b; color: var(--cream); }
    .result-card {
      background: white;
      border: 1px solid var(--border);
      border-radius: 12px;
      margin-bottom: 16px;
      overflow: hidden;
    }
    .result-card-header {
      padding: 16px 24px;
      border-bottom: 1px solid var(--cream-dark);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      background: var(--cream);
    }
    .result-card-header.collapsible {
      cursor: pointer;
      width: 100%;
      border-left: none;
      border-right: none;
      border-top: none;
      outline: none;
      font: inherit;
      color: inherit;
      text-align: left;
      transition: background 0.15s;
    }
    .result-card-header.collapsible:hover { background: var(--cream-dark); }
    .result-card-header.collapsible:focus-visible { outline: 2px solid var(--blue-accent); outline-offset: -2px; }
    .result-card-header-group {
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .result-card-chevron {
      font-size: 0.55rem;
      color: var(--warm-gray);
      transition: transform 0.25s ease;
      flex-shrink: 0;
    }
    .result-card-chevron.open {
      transform: rotate(180deg);
    }
    .collapsible-body {
      display: grid;
      grid-template-rows: 0fr;
      transition: grid-template-rows 0.4s cubic-bezier(0.4, 0, 0.2, 1);
    }
    .collapsible-body.open {
      grid-template-rows: 1fr;
    }
    .collapsible-inner {
      overflow: hidden;
      min-height: 0;
    }
    .result-card-icon {
      display: inline-flex;
      align-items: center;
      color: var(--brown);
      transition: color 0.2s;
    }
    .result-card-icon svg { width: 16px; height: 16px; display: block; }
    .result-card-label {
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--warm-gray);
    }
    .result-card-body {
      padding: 24px;
      font-size: 0.95rem;
      line-height: 1.75;
      color: var(--charcoal);
    }
    .result-card-body strong {
      color: var(--black);
      font-weight: 500;
    }
    .price-grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
      gap: 16px;
      padding: 24px;
    }
    .price-item {
      text-align: center;
    }
    .price-label {
      font-family: 'DM Mono', monospace;
      font-size: 0.6rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--warm-gray);
      margin-bottom: 4px;
    }
    .price-value {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.4rem;
      font-weight: 600;
      color: var(--black);
    }
    .price-value.highlight { color: var(--black); }
    .sourcing-list {
      list-style: none;
      padding: 0;
    }
    .sourcing-list li {
      padding: 10px 0;
      border-bottom: 1px solid var(--cream-dark);
      font-size: 0.9rem;
      display: flex;
      align-items: flex-start;
      gap: 10px;
    }
    .sourcing-list li:last-child { border-bottom: none; }
    .sourcing-list li::before {
      content: '→';
      color: var(--blue-accent);
      flex-shrink: 0;
      font-family: 'DM Mono', monospace;
    }
    .btn-new {
      background: none;
      border: 1px solid var(--border);
      color: var(--charcoal);
      font-family: 'DM Mono', monospace;
      font-size: 0.68rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      padding: 12px 24px;
      cursor: pointer;
      transition: all 0.2s;
      border-radius: 8px;
    }
    .btn-new:hover {
      border-color: var(--black);
      background: var(--black);
      color: var(--cream);
    }
    /* ── FOOTER ── */
    footer {
      background: var(--brown);
      border-top: 3px solid var(--brown-border);
      padding: 14px 24px;
      padding-bottom: max(10px, var(--sab));
      padding-left: max(24px, var(--sal));
      padding-right: max(24px, var(--sar));
      text-align: center;
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 90;
      transition: transform 0.55s ease;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
    }
    footer.footer-hidden {
      transform: translateY(100%);
    }
    .footer-logo {
      font-family: 'Bifur', sans-serif;
      font-size: 0.9rem;
      font-weight: normal;
      color: var(--cream);
      letter-spacing: 0.06em;
    }
    .footer-social {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 16px;
    }
    .footer-social a {
      color: var(--cream);
      opacity: 0.85;
      display: inline-flex;
      transition: opacity 0.2s, color 0.2s;
    }
    .footer-social a:hover { color: var(--hot-orange); opacity: 1; }
    .footer-social svg { width: 19px; height: 19px; }
    /* ── SHARE BUTTON ── */
    .btn-share {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      background: var(--blue-accent);
      color: var(--black);
      font-family: 'DM Mono', monospace;
      font-size: 0.68rem;
      font-weight: 400;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      padding: 12px 22px;
      border: none;
      border-radius: 8px;
      cursor: pointer;
      transition: background 0.2s, transform 0.1s;
    }
    .btn-share:hover   { background: #9aadd8; }
    .btn-share:active  { transform: scale(0.98); }
    .btn-share:disabled { opacity: 0.55; cursor: not-allowed; }
    .btn-share svg { width: 14px; height: 14px; flex-shrink: 0; }
    /* ── SHARE ACQUISITION CARD (injected only during capture) ── */
    .share-acq-card {
      margin-top: 0;
      background: var(--brown);
      border-top: 3px solid var(--brown-border);
      padding: 28px 28px 24px;
      font-family: 'DM Sans', sans-serif;
    }
    .sac-top {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      margin-bottom: 18px;
    }
    .sac-wordmark {
      font-family: 'Bifur', sans-serif;
      font-size: 1.05rem;
      font-weight: normal;
      color: var(--cream);
      letter-spacing: 0.04em;
      text-transform: uppercase;
      line-height: 1.2;
    }
    .sac-wordmark em { color: var(--blue-accent); font-style: normal; }
    .sac-tagline-sm {
      font-family: 'DM Mono', monospace;
      font-size: 0.55rem;
      color: #6b6560;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      margin-top: 3px;
    }
    .sac-verdict-stamp {
      font-family: 'Cormorant Garamond', serif;
      font-size: 0.72rem;
      font-weight: 600;
      font-style: italic;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      padding: 5px 14px 6px;
      border-radius: 8px;
      white-space: nowrap;
      flex-shrink: 0;
    }
    .sac-verdict-stamp.BUY  { background: #2d6a4f; color: #fff; }
    .sac-verdict-stamp.SELL { background: #c0392b; color: #fff; }
    .sac-verdict-stamp.HOLD { background: #1a3a5c; color: #fff; }
    .sac-verdict-stamp.PASS { background: #707070; color: var(--cream); }
    .sac-rule { border: none; border-top: 1px solid var(--brown-border); margin: 0 0 18px; }
    .sac-hook {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.0rem;
      font-weight: 600;
      font-style: italic;
      color: var(--cream);
      line-height: 1.35;
      margin-bottom: 10px;
    }
    .sac-hook em { color: var(--blue-accent); font-style: normal; }
    .sac-body {
      font-size: 0.78rem;
      color: #9a928a;
      line-height: 1.6;
      margin-bottom: 20px;
      max-width: 520px;
    }
    .sac-cta-row { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; }
    .sac-cta-pill {
      display: inline-block;
      background: var(--blue-accent);
      color: var(--black);
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      font-weight: 400;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      padding: 9px 18px;
      border-radius: 8px;
      white-space: nowrap;
    }
    .sac-substack-url {
      font-family: 'DM Mono', monospace;
      font-size: 0.62rem;
      color: rgba(254,254,237,0.5);
      letter-spacing: 0.1em;
      text-transform: uppercase;
    }
    .sac-substack-url span { color: var(--hot-orange); }
    /* ── SHARE TOAST ── */
    .share-toast {
      position: fixed;
      bottom: 32px;
      left: 50%;
      transform: translateX(-50%) translateY(12px);
      background: var(--black);
      color: var(--cream);
      font-family: 'DM Mono', monospace;
      font-size: 0.7rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      padding: 12px 24px;
      border: 1px solid var(--blue-accent);
      border-radius: 8px;
      pointer-events: none;
      opacity: 0;
      transition: opacity 0.25s ease, transform 0.25s ease;
      z-index: 9999;
      white-space: nowrap;
    }
    .share-toast.visible {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }
    /* ── FEEDBACK MODAL ── */
    .feedback-modal-overlay {
      position: fixed;
      inset: 0;
      background: rgba(0,0,0,0.55);
      z-index: 10000;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 20px;
    }
    .feedback-modal {
      position: relative;
      width: 100%;
      max-width: 420px;
      max-height: 85vh;
      overflow-y: auto;
      background: var(--cream);
      border-radius: 14px;
      padding: 28px 24px 24px;
      box-shadow: 0 12px 40px rgba(0,0,0,0.35);
    }
    .feedback-modal-close {
      position: absolute;
      top: 12px;
      right: 14px;
      background: none;
      border: none;
      font-size: 1.4rem;
      line-height: 1;
      color: var(--warm-gray);
      cursor: pointer;
      padding: 4px;
    }
    .feedback-modal-title {
      font-family: 'Bifur', serif;
      font-size: 1.5rem;
      margin: 0 0 8px;
      color: var(--brown);
    }
    .feedback-modal-subtitle {
      font-size: 0.88rem;
      color: var(--warm-gray);
      line-height: 1.4;
      margin: 0 0 18px;
    }
    .feedback-toggle {
      display: flex;
      background: var(--cream-dark);
      border-radius: 999px;
      padding: 4px;
      margin-bottom: 16px;
    }
    .feedback-cat-btn {
      flex: 1;
      padding: 10px 0;
      border: none;
      border-radius: 999px;
      background: transparent;
      color: var(--warm-gray);
      font-family: 'DM Sans', sans-serif;
      font-size: 0.88rem;
      font-weight: 500;
      cursor: pointer;
    }
    .feedback-cat-btn.active {
      background: #fff;
      color: var(--charcoal);
      box-shadow: 0 1px 4px rgba(0,0,0,0.12);
    }
    .feedback-textarea, .feedback-email-input {
      width: 100%;
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 12px 14px;
      font-family: 'DM Sans', sans-serif;
      font-size: 0.9rem;
      color: var(--charcoal);
      background: var(--cream-dark);
      box-sizing: border-box;
      margin-bottom: 12px;
    }
    .feedback-textarea {
      min-height: 110px;
      resize: vertical;
    }
    .feedback-attach-btn {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 12px 0;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--cream-dark);
      color: var(--charcoal);
      font-family: 'DM Sans', sans-serif;
      font-size: 0.88rem;
      font-weight: 500;
      cursor: pointer;
    }
    .feedback-attach-hint {
      font-size: 0.75rem;
      color: var(--warm-gray);
      margin: 8px 0 0;
    }
    .feedback-attachments {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      margin-top: 10px;
    }
    .feedback-attachment-chip {
      display: flex;
      align-items: center;
      gap: 6px;
      background: var(--cream-dark);
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 5px 8px;
      font-size: 0.72rem;
      color: var(--charcoal);
      max-width: 160px;
    }
    .feedback-attachment-chip img {
      width: 22px;
      height: 22px;
      object-fit: cover;
      border-radius: 4px;
      flex-shrink: 0;
    }
    .feedback-attachment-chip span {
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }
    .feedback-attachment-remove {
      background: none;
      border: none;
      color: var(--warm-gray);
      cursor: pointer;
      font-size: 0.9rem;
      line-height: 1;
      padding: 0 2px;
      flex-shrink: 0;
    }
    .feedback-submit-btn {
      width: 100%;
      padding: 14px 0;
      border: none;
      border-radius: 999px;
      background: var(--blue-accent);
      color: var(--black);
      font-family: 'DM Sans', sans-serif;
      font-size: 0.95rem;
      font-weight: 600;
      cursor: pointer;
      margin-top: 18px;
    }
    .feedback-submit-btn:disabled {
      opacity: 0.6;
      cursor: default;
    }
    /* ── RATE A SPOT MODAL ── */
    .venue-log-label {
      display: block;
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--warm-gray);
      margin: 14px 0 6px;
    }
    .venue-log-suggestions {
      position: absolute;
      left: 0; right: 0; top: 100%;
      background: var(--cream);
      border: 1px solid var(--border);
      border-radius: 6px;
      margin-top: 4px;
      max-height: 160px;
      overflow-y: auto;
      z-index: 5;
      box-shadow: 0 6px 18px rgba(0,0,0,0.12);
    }
    .venue-log-suggestion {
      padding: 9px 14px;
      font-family: 'DM Sans', sans-serif;
      font-size: 0.85rem;
      cursor: pointer;
    }
    .venue-log-suggestion:hover { background: var(--cream-dark); }
    .venue-log-more {
      margin-top: 16px;
      border-top: 1px solid var(--border);
      padding-top: 4px;
    }
    .venue-log-more summary {
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--blue-accent);
      cursor: pointer;
      padding: 10px 0;
    }
    .venue-log-star-row { display: flex; gap: 4px; }
    .venue-log-star {
      background: none;
      border: none;
      font-size: 1.5rem;
      line-height: 1;
      color: var(--border);
      cursor: pointer;
      padding: 2px;
    }
    .venue-log-star.active { color: var(--hot-orange); }
    .venue-log-slider {
      width: 100%;
      -webkit-appearance: none;
      appearance: none;
      height: 4px;
      border-radius: 999px;
      background: var(--border);
      outline: none;
      margin: 6px 0;
    }
    .venue-log-slider::-webkit-slider-runnable-track {
      height: 4px;
      border-radius: 999px;
      background: transparent;
    }
    .venue-log-slider::-webkit-slider-thumb {
      -webkit-appearance: none;
      appearance: none;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: var(--blue-accent);
      border: none;
      margin-top: -7px;
      cursor: pointer;
    }
    .venue-log-slider::-moz-range-track {
      height: 4px;
      border-radius: 999px;
      background: var(--border);
    }
    .venue-log-slider::-moz-range-progress {
      height: 4px;
      border-radius: 999px;
      background: var(--blue-accent);
    }
    .venue-log-slider::-moz-range-thumb {
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: var(--blue-accent);
      border: none;
      cursor: pointer;
    }
    .venue-log-checkbox-row { display: flex; flex-wrap: wrap; gap: 14px; }
    .venue-log-checkbox {
      display: flex; align-items: center; gap: 6px;
      font-family: 'DM Sans', sans-serif;
      font-size: 0.85rem;
      cursor: pointer;
    }
    .fb-toggle-label {
      display: flex; align-items: center; gap: 7px;
      font-family: 'DM Mono', monospace;
      font-size: 0.62rem;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--warm-gray);
      margin-top: 10px;
      cursor: pointer;
    }
    .tab-content .fb-toggle-switch-label {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      gap: 8px;
    }
    .fb-toggle-switch {
      position: relative;
      display: inline-block;
      width: 34px;
      height: 20px;
      flex-shrink: 0;
    }
    .fb-toggle-switch input {
      position: absolute;
      opacity: 0;
      width: 100%;
      height: 100%;
      margin: 0;
      cursor: pointer;
      z-index: 1;
    }
    .fb-toggle-switch-track {
      position: absolute;
      inset: 0;
      background: var(--border);
      border-radius: 999px;
      transition: background-color 0.15s;
    }
    .fb-toggle-switch-thumb {
      position: absolute;
      top: 2px;
      left: 2px;
      width: 16px;
      height: 16px;
      background: #fff;
      border-radius: 50%;
      box-shadow: 0 1px 2px rgba(0,0,0,0.25);
      transition: transform 0.15s;
    }
    .fb-toggle-switch input:checked ~ .fb-toggle-switch-track {
      background: var(--blue-accent);
    }
    .fb-toggle-switch input:checked ~ .fb-toggle-switch-track .fb-toggle-switch-thumb {
      transform: translateX(14px);
    }
    .venue-log-nudge {
      display: none;
      position: fixed;
      left: 50%;
      bottom: 90px;
      transform: translateX(-50%);
      z-index: 95;
      align-items: center;
      gap: 12px;
      background: var(--charcoal);
      color: var(--cream);
      padding: 12px 14px;
      border-radius: 10px;
      box-shadow: 0 8px 24px rgba(0,0,0,0.3);
      font-family: 'DM Sans', sans-serif;
      font-size: 0.85rem;
      max-width: calc(100vw - 32px);
    }
    .venue-log-nudge button {
      background: var(--blue-accent);
      border: none;
      color: var(--black);
      font-family: 'DM Mono', monospace;
      font-size: 0.6rem;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      padding: 6px 12px;
      border-radius: 6px;
      cursor: pointer;
      flex-shrink: 0;
    }
    .venue-log-nudge-dismiss {
      background: none !important;
      color: var(--cream) !important;
      padding: 0 !important;
      font-size: 1rem !important;
    }
    /* ── SOURCING GUIDE MODAL ── */
    .sourcing-guide-modal {
      position: relative;
      width: 100%;
      max-width: 560px;
      max-height: 85vh;
      background: var(--cream);
      border-radius: 14px;
      padding: 28px 24px 24px;
      box-shadow: 0 12px 40px rgba(0,0,0,0.35);
      display: flex;
      flex-direction: column;
    }
    .sourcing-guide-modal .feedback-modal-title {
      font-size: 1.15rem;
      white-space: nowrap;
      padding-right: 26px;
    }
    @media (max-width: 420px) {
      .sourcing-guide-modal .feedback-modal-title { font-size: 0.92rem; }
    }
    .sourcing-guide-tabs {
      display: flex;
      flex-wrap: nowrap;
      gap: 4px;
      background: var(--brown);
      border-radius: 12px;
      padding: 4px;
      margin-bottom: 16px;
      flex-shrink: 0;
    }
    .sourcing-guide-tab-btn {
      flex: 1 1 0;
      min-width: 0;
      padding: 9px 4px;
      border: none;
      border-radius: 9px;
      background: transparent;
      color: #fff;
      font-family: 'DM Sans', sans-serif;
      font-size: 0.78rem;
      font-weight: 500;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      cursor: pointer;
      text-align: center;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .sourcing-guide-tab-btn.active {
      background: #fff;
      color: var(--brown);
    }
    @media (max-width: 420px) {
      .sourcing-guide-tab-btn { font-size: 0.65rem; padding: 8px 2px; }
    }
    .sourcing-guide-body {
      overflow-y: auto;
      flex: 1 1 auto;
    }
    .sourcing-guide-panel { display: none; }
    .sourcing-guide-panel.active { display: block; }
    .sourcing-guide-qa {
      border-bottom: 1px solid var(--border);
      padding: 12px 0;
    }
    .sourcing-guide-qa:first-child { padding-top: 0; }
    .sourcing-guide-qa:last-child { border-bottom: none; padding-bottom: 0; }
    .sourcing-guide-qa summary {
      font-family: 'DM Sans', sans-serif;
      font-size: 0.9rem;
      font-weight: 600;
      color: var(--brown);
      cursor: pointer;
      list-style: none;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
    }
    .sourcing-guide-qa summary::-webkit-details-marker { display: none; }
    .sourcing-guide-qa summary::after {
      content: '+';
      color: var(--warm-gray);
      font-size: 1.1rem;
      flex-shrink: 0;
    }
    .sourcing-guide-qa[open] summary::after { content: '\2212'; }
    .sourcing-guide-qa p {
      font-size: 0.85rem;
      color: var(--charcoal);
      line-height: 1.55;
      margin: 10px 0 0;
    }
    /* ── ASK YOURSELF ── */
    .ask-yourself {
      margin-top: 20px;
      padding-top: 18px;
      border-top: 1px solid var(--cream-dark);
    }
    .ask-yourself-label {
      display: block;
      font-family: 'DM Mono', monospace;
      font-size: 0.6rem;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--warm-gray);
      margin-bottom: 6px;
    }
    .ask-yourself-text {
      font-family: 'Cormorant Garamond', serif;
      font-size: 1.05rem;
      font-style: italic;
      color: var(--black);
      line-height: 1.45;
    }
    /* ── PRODUCT IMAGE ── */
    .result-product-image {
      margin-bottom: 20px;
      border: 1px solid var(--border);
      background: white;
      border-radius: 2px;
      overflow: hidden;
      max-height: 340px;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    .result-product-image img {
      width: 100%;
      max-height: 340px;
      object-fit: contain;
      display: block;
    }
    /* ── MAIN NAV (Analyze / Saved) ── */
    .main-nav {
      display: flex;
      justify-content: center;
      gap: 0;
      border-bottom: 2px solid var(--cream-dark);
      margin: 32px 0 0;
    }
    .main-nav-btn {
      font-family: 'DM Mono', monospace;
      font-size: 0.72rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--warm-gray);
      background: none;
      border: none;
      border-bottom: 2px solid transparent;
      margin-bottom: -2px;
      padding: 12px 20px;
      cursor: pointer;
      transition: color 0.2s, border-color 0.2s;
    }
    .main-nav-btn.active {
      color: var(--black);
      border-bottom-color: var(--blue-accent);
    }
    /* ── SAVED PANEL ── */
    #panel-saved { display: none; margin-top: 32px; }
    /* ── PRICING PANEL ── */
    .pricing-modal-body { overflow-y: auto; overflow-x: hidden; margin-top: 16px; }
    .pricing-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 16px; }
    .pricing-card {
      background: var(--cream-dark);
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 24px 20px;
      display: flex;
      flex-direction: column;
      gap: 12px;
    }
    .pricing-card-featured { border-color: var(--blue-accent); }
    .pricing-card-name {
      font-family: 'DM Mono', monospace;
      font-size: 0.72rem;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--warm-gray);
    }
    .pricing-card-reads { font-size: 1.4rem; font-weight: 600; color: var(--black); }
    .pricing-card-per { font-size: 0.9rem; font-weight: 400; color: var(--warm-gray); }
    .pricing-card-list { margin: 0 0 8px; padding-left: 18px; line-height: 1.6; flex: 1; }
    /* ── PICKS PANEL ── */
    #panel-picks { display: none; margin-top: 32px; }
    #picks-content {
      background: var(--cream-dark);
      border: 1px solid var(--border);
      border-radius: 8px;
      padding: 14px;
    }
    .picks-bar {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 12px;
      margin-bottom: 10px;
    }
    .picks-hint {
      font-family: 'DM Mono', monospace;
      font-size: 0.65rem;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: var(--brown);
    }
    /* The arrows say it all on desktop; the hint is for touch. */
    @media (hover: hover) and (pointer: fine) {
      .picks-hint { display: none; }
    }
    .picks-nav { display: flex; gap: 8px; }
    .picks-bar.no-nav .picks-nav { display: none; }
    .picks-arrow {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 36px;
      height: 36px;
      padding: 0;
      border-radius: 50%;
      border: 1px solid var(--brown);
      background: var(--cream);
      color: var(--brown);
      cursor: pointer;
      transition: background 0.15s, color 0.15s, opacity 0.15s;
    }
    .picks-arrow svg { width: 18px; height: 18px; }
    .picks-arrow:hover:not(:disabled) { background: var(--brown); color: var(--cream); }
    .picks-arrow:focus-visible { outline: 2px solid var(--blue-accent); outline-offset: 2px; }
    .picks-arrow:disabled { opacity: 0.3; cursor: default; }
    .picks-strip {
      overflow-x: auto;
      overscroll-behavior-x: contain;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: none;
      border-radius: 4px;
    }
    .picks-strip::-webkit-scrollbar { display: none; }
    #picks-content iframe {
      display: block;
      width: 100%;
      border-radius: 4px;
      background: var(--cream-dark);
    }
    .saved-empty {
      text-align: center;
      padding: 60px 24px;
      color: var(--warm-gray);
      font-family: 'DM Mono', monospace;
      font-size: 0.75rem;
      letter-spacing: 0.08em;
      text-transform: uppercase;
    }
    .saved-list { display: flex; flex-direction: column; gap: 2px; }
    .saved-item {
      display: flex;
      align-items: center;
      gap: 16px;
      background: white;
      border: 1px solid var(--border);
      padding: 16px 18px;
      cursor: pointer;
      transition: background 0.15s;
    }
    .saved-item:hover { background: var(--cream); }
    .saved-item-name {
      flex: 1;
      font-family: 'DM Sans', sans-serif;
      font-size: 0.92rem;
      font-weight: 500;
      color: var(--black);
      min-width: 0;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .saved-item-price {
      font-family: 'DM Mono', monospace;
      font-size: 0.72rem;
      color: var(--warm-gray);
      white-space: nowrap;
    }
    .saved-verdict-badge {
      font-family: 'DM Mono', monospace;
      font-size: 0.62rem;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding: 4px 10px;
      border-radius: 8px;
      white-space: nowrap;
    }
    .saved-verdict-BUY  { background: var(--green); color: white; }
    .saved-verdict-SELL { background: var(--hot-orange); color: white; }
    .saved-verdict-HOLD { background: var(--blue);  color: white; }
    .saved-verdict-PASS { background: #707070;      color: var(--cream); }
    .saved-delete-btn {
      background: none;
      border: none;
      color: var(--warm-gray);
      font-size: 1.1rem;
      cursor: pointer;
      padding: 4px 6px;
      line-height: 1;
      opacity: 0.5;
      transition: opacity 0.15s;
      flex-shrink: 0;
    }
    .saved-delete-btn:hover { opacity: 1; color: var(--red); }
    /* ── RESPONSIVE ── */
    @media (max-width: 600px) {
      .header-counter-slot { padding-right: 0; }
      .header-menu-wrap { gap: 4px; }
      .header-upgrade-btn { padding: 5px 9px; font-size: 0.6rem; letter-spacing: 0.04em; }
      .logo-lockup-wide { display: none; }
      .logo-lockup-stacked { display: block; height: 44px; width: auto; }
      #search-counter { max-width: 113px; }
      .counter-text { white-space: nowrap; font-size: 0.42rem !important; letter-spacing: 0.03em !important; }
      .footer-legal { font-size: 0.6rem !important; letter-spacing: 0.03em !important; }
      .btn-primary { font-size: 0.72rem; letter-spacing: 0.05em; padding: 14px 10px; }
      .comfort-check .comfort-check-label { font-size: 0.66rem; white-space: nowrap; }
      .comfort-chip-row { gap: 6px; }
      .comfort-chip { padding: 8px 6px; font-size: 0.66rem; }
      .bsh-legend { gap: 6px; }
      .bsh-badge { padding: 5px 7px; gap: 4px; font-size: 0.58rem; width: 62px; }
      .bsh-badge svg { width: 14px; height: 14px; }
      .url-input-wrap { flex-direction: column; }
      .url-input-wrap input { width: 100%; flex: 1 1 auto; }
      .btn-analyze { width: 100%; text-align: center; }
      .tab-content { padding: 20px; }
      .auth-card { padding: 28px 20px; }
      .result-header { flex-direction: column; }
      .result-verdict-badge { align-self: flex-start; }
      .price-grid { grid-template-columns: repeat(2, 1fr); }
      .share-action-row { flex-direction: column; align-items: stretch; }
      .share-action-row .btn-share,
      .share-action-row .btn-new { width: 100%; justify-content: center; text-align: center; }
    }
    /* ── INSTALL BANNER ── */
    #install-banner, #install-banner-ios {
      display: none;
      position: fixed;
      bottom: 24px;
      left: 50%;
      transform: translateX(-50%);
      width: calc(100% - 32px);
      max-width: 480px;
      background: #1a1a1a;
      border: 1px solid #333;
      border-radius: 12px;
      padding: 14px 16px;
      align-items: center;
      gap: 12px;
      z-index: 9999;
      box-shadow: 0 8px 32px rgba(0,0,0,0.6);
    }
    #install-banner img, #install-banner-ios img {
      width: 40px;
      height: 40px;
      border-radius: 8px;
      flex-shrink: 0;
    }
    #install-banner-text {
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 2px;
    }
    #install-banner-text strong { color: #f0e6d3; font-size: 13px; }
    #install-banner-text span   { color: #999; font-size: 12px; }
    #install-btn {
      background: #c8a96e;
      color: #0a0a0a;
      border: none;
      border-radius: 8px;
      padding: 8px 14px;
      font-family: 'DM Mono', monospace;
      font-size: 12px;
      font-weight: 600;
      cursor: pointer;
      white-space: nowrap;
      flex-shrink: 0;
    }
    #install-dismiss, #install-dismiss-ios {
      background: none;
      border: none;
      color: #666;
      font-size: 16px;
      cursor: pointer;
      padding: 4px;
      flex-shrink: 0;
      line-height: 1;
    }

    /* ── INSTAGRAM PULL-UP SHEET ── */
    #ig-sheet {
      position: fixed; left: 0; right: 0; bottom: 0; z-index: 9999;
      background: var(--brown); color: var(--cream);
      border-radius: 22px 22px 0 0;
      padding: 12px 24px calc(22px + var(--sab));
      text-align: center;
      transform: translateY(110%);
      transition: transform 0.4s ease;
      display: none;
    }
    #ig-sheet.show { display: block; }
    #ig-sheet.open { transform: translateY(0); }
    #ig-sheet .ig-handle {
      width: 44px; height: 4px; border-radius: 2px;
      background: rgba(254,254,237,0.35); margin: 0 auto 16px;
    }
    #ig-sheet .ig-title {
      font-family: 'Bifur', serif; font-size: 1.35rem; line-height: 1.25; margin-bottom: 14px;
    }
    #ig-sheet .ig-cta {
      display: inline-block; background: var(--hot-orange); color: #fff;
      border: 0; border-radius: 999px; padding: 12px 28px;
      font-family: 'DM Sans', sans-serif; font-weight: 700; font-size: 1rem; cursor: pointer;
    }
    #ig-sheet .ig-close {
      display: block; margin: 12px auto 0; background: none; border: 0;
      color: var(--cream); opacity: 0.7; font-size: 0.85rem; cursor: pointer;
    }

    /* ── HOW-TO CAROUSEL (hero strip + full-screen viewer) ── */
    .hero--carousel { padding-bottom: 28px; }
    .hero [hidden] { display: none !important; } /* keeps the empty legacy stand-ins in index.html invisible */
    .cr-strip { margin: 22px -24px 0; text-align: left; }
    .cr-head { display: flex; justify-content: center; text-align: center; padding: 0 24px 8px; font-family: 'DM Mono', monospace; font-size: 0.6rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--warm-gray); }
    .cr-head #cr-count { display: none; } /* the dots below already show which card is featured */
    .cr-track { --cw: min(calc(100vw - 48px), 320px); display: flex; gap: 14px; overflow-x: auto; scroll-snap-type: x mandatory; padding: 2px calc(50% - var(--cw) / 2) 8px; scrollbar-width: none; -webkit-overflow-scrolling: touch; }
    .cr-track::-webkit-scrollbar { display: none; }
    .cr-tile { position: relative; flex: 0 0 var(--cw); height: calc(var(--cw) * 1.05); scroll-snap-align: center; scroll-snap-stop: always; padding: 0; overflow: hidden; text-align: left; background: var(--brown); border: 1px solid var(--border); border-radius: 12px; box-shadow: 0 4px 18px rgba(10,10,10,0.16); cursor: pointer; font: inherit; color: inherit; }
    /* desktop: all three cards fit side by side, so no strip scrolling or dots (the enlarged viewer still swipes) */
    @media (min-width: 1000px) {
      .cr-track { --cw: 288px; justify-content: center; overflow-x: visible; scroll-snap-type: none; padding: 2px 0 8px; }
      .cr-dots { display: none !important; }
      .cr-tile-title { font-size: 0.88rem !important; }
    }
    .cr-tile:focus-visible { outline: 2px solid var(--blue-accent); outline-offset: 2px; }
    .cr-thumb { position: absolute; inset: 0; background: var(--brown); }
    .cr-thumb img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: top; }
    .cr-thumb img + .cr-play { display: none; } /* covers draw their own play button */
    .cr-play { position: absolute; top: 40%; left: 50%; width: 56px; height: 56px; margin: -28px 0 0 -28px; border-radius: 50%; background: var(--cream); box-shadow: 0 2px 10px rgba(0,0,0,0.4); display: flex; align-items: center; justify-content: center; }
    .cr-play::after { content: ''; border-left: 16px solid var(--brown); border-top: 10px solid transparent; border-bottom: 10px solid transparent; margin-left: 4px; }
    .cr-tile-text { display: none; } /* covers carry their own text: no label band */
    .cr-tile-text { position: absolute; left: 0; right: 0; bottom: 0; padding: 16px 14px 18px; background: var(--brown); }
    .cr-tile-meta { font-family: 'DM Mono', monospace; font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; color: rgba(254,254,237,0.75); margin-bottom: 6px; }
    .cr-tile-title { font-weight: 500; font-size: clamp(0.78rem, 4.3vw, 1rem); line-height: 1.22; color: var(--cream); white-space: nowrap; overflow: hidden; } /* one line; scales with the phone so the longest title always fits */
    .cr-dots { display: flex; justify-content: center; gap: 8px; margin-top: 6px; }
    .cr-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--border); border: 0; padding: 0; cursor: pointer; }
    .cr-dot[aria-current="true"] { background: var(--brown); }
    body.cr-locked { overflow: hidden; }
    .cr-viewer { position: fixed; inset: 0; z-index: 9000; background: #220807; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 56px 0 20px; opacity: 0; visibility: hidden; transition: opacity 0.25s ease, visibility 0.25s; }
    .cr-viewer.open { opacity: 1; visibility: visible; }
    .cr-close { z-index: 2; position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(254,254,237,0.35); background: transparent; color: var(--cream); font-size: 1.1rem; cursor: pointer; }
    .cr-vcount { position: absolute; top: 22px; left: 16px; font-family: 'DM Mono', monospace; font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(254,254,237,0.6); }
    .cr-media { position: relative; width: min(100%, 330px); height: min(calc(100vh - 168px), 700px); height: min(calc(100dvh - 168px), 700px); border-radius: 10px; overflow: hidden; background: var(--brown); box-shadow: 0 8px 40px rgba(0,0,0,0.5); } /* every enlarged slide shares this one size */
    .cr-vtrack { display: flex; width: 100%; flex: 1; min-height: 0; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
    .cr-vtrack::-webkit-scrollbar { display: none; }
    .cr-pane { flex: 0 0 100%; min-width: 0; scroll-snap-align: center; scroll-snap-stop: always; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 0 16px; }
    .cr-vplay { position: absolute; top: 50%; left: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; border: 0; background: var(--cream); box-shadow: 0 2px 14px rgba(0,0,0,0.45); cursor: pointer; }
    .cr-vplay::after { content: ''; position: absolute; top: 50%; left: 50%; margin: -11px 0 0 -7px; border-left: 18px solid var(--brown); border-top: 11px solid transparent; border-bottom: 11px solid transparent; }
    .cr-media.playing .cr-vplay { display: none; }
    .cr-media.video { background: #000; }
    .cr-media video { width: 100%; height: 100%; object-fit: contain; display: block; background: #000; }
    .cr-about { position: absolute; inset: 0; display: flex; flex-direction: column; align-items: stretch; padding: 26px 20px 22px; background: var(--cream); color: var(--charcoal); text-align: left; }
    .cr-about p { margin: 0; font-size: 1rem; line-height: 1.4; color: var(--charcoal); max-width: none; }
    .cr-photo { flex: 1 1 36%; min-height: 84px; width: 100%; margin: 14px 0; border-radius: 8px; overflow: hidden; background: #fffff0; border: 1px solid var(--border); }
    .cr-photo img { width: 100%; height: 100%; object-fit: contain; object-position: 50% 50%; display: block; }
    .cr-list { list-style: none; margin: 0; padding: 0; width: 100%; text-align: left; font-size: 1rem; line-height: 1.4; color: var(--charcoal); }
    .cr-list li { position: relative; padding-left: 16px; }
    .cr-list li + li { margin-top: 5px; }
    .cr-list li::before { content: ''; position: absolute; left: 2px; top: 0.52em; width: 6px; height: 6px; border-radius: 50%; background: var(--blue-accent); }
    .cr-list li.lead, .cr-list li.plain { padding-left: 0; }
    .cr-list li.lead::before, .cr-list li.plain::before { display: none; }
    .cr-list li.lead { margin-top: 12px; font-weight: 500; }
    /* sample read: one line on the first slide, full screen when tapped */
    .cr-sample-row { flex-shrink: 0; width: 100%; margin-top: 10px; display: flex; align-items: center; justify-content: space-between; padding: 11px 14px; background: #fff; border: 1px solid var(--border); border-radius: 8px; cursor: pointer; font: inherit; color: inherit; text-align: left; }
    .cr-sample-row:focus-visible { outline: 2px solid var(--blue-accent); outline-offset: 2px; }
    .cr-sample-tag { font-family: 'DM Mono', monospace; font-size: 0.66rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--blue-accent); }
    .cr-sample-cta { display: inline-flex; align-items: center; gap: 8px; font-family: 'DM Mono', monospace; font-size: 0.66rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--brown); }
    .cr-chev { width: 7px; height: 7px; border-top: 2px solid currentColor; border-right: 2px solid currentColor; transform: rotate(45deg); }
    .cr-sview { position: fixed; inset: 0; z-index: 9100; background: var(--cream); overflow-y: auto; overscroll-behavior: contain; padding: 70px 24px 48px; opacity: 0; visibility: hidden; transition: opacity 0.25s ease, visibility 0.25s; }
    .cr-sview.open { opacity: 1; visibility: visible; }
    .cr-sclose { position: fixed; top: 12px; right: 12px; z-index: 2; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--brown); background: var(--cream); color: var(--brown); font-size: 1.1rem; cursor: pointer; }
    .cr-sinner { max-width: 520px; margin: 0 auto; text-align: left; color: var(--charcoal); }
    .cr-stag { font-family: 'DM Mono', monospace; font-size: 0.66rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--blue-accent); margin-bottom: 8px; }
    .cr-end { position: absolute; inset: 0; background: var(--cream) url('carousel/end-card.jpg') center / cover no-repeat; opacity: 0; pointer-events: none; transition: opacity 0.5s ease; display: flex; align-items: flex-end; justify-content: center; padding-bottom: 28px; }
    .cr-media.ended .cr-end { opacity: 1; pointer-events: auto; }
    .cr-replay { font-family: 'DM Mono', monospace; font-size: 0.65rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--brown); background: none; border: 1px solid var(--brown); border-radius: 20px; padding: 8px 16px; cursor: pointer; }
    .cr-caption { color: var(--cream); text-align: center; max-width: min(100%, 420px); min-height: 40px; margin-bottom: 12px; display: flex; flex-direction: column; justify-content: flex-end; }
    .cr-caption .cr-heading { display: block; height: 37px; width: auto; max-width: 100%; margin: 0 auto; }
    .cr-caption h3 { font-family: 'Bifur', sans-serif; font-weight: normal; font-size: 1.05rem; margin: 0 0 4px; color: var(--cream); }
    .cr-caption p { margin: 0; font-size: 0.8rem; line-height: 1.45; color: rgba(254,254,237,0.78); }
    .cr-arrow { z-index: 2; position: absolute; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(254,254,237,0.35); background: transparent; color: var(--cream); font-size: 1.2rem; cursor: pointer; display: none; }
    .cr-arrow.prev { left: 16px; } .cr-arrow.next { right: 16px; }
    @media (min-width: 700px) { .cr-arrow { display: block; } }
    .cr-vdots { display: flex; gap: 7px; margin-top: 12px; }
    .cr-vdots i { width: 6px; height: 6px; border-radius: 50%; background: rgba(254,254,237,0.3); }
    .cr-vdots i.on { background: var(--cream); }
    @media (max-height: 740px) {
      .cr-about { padding: 18px 16px 14px; }
      .cr-about p { font-size: 0.84rem; }
      .cr-photo { margin: 10px 0; min-height: 64px; }
      .cr-list { font-size: 0.84rem; }
      .cr-list li.lead { margin-top: 7px; }
    }
    @media (prefers-reduced-motion: reduce) { .cr-viewer, .cr-sview, .cr-end { transition: none; } .cr-vtrack { scroll-behavior: auto; } }