:root {
      --bg:         #0a0a0a;
      --surface:    #111111;
      --card:       #141414;
      --card-hover: #191919;
      --border:     #212121;
      --border-dim: #181818;
      --text:       #f5f1eb;
      --text-dim:   #b0a69b;
      --text-muted: #8a8279;
      --hover-bg:   rgba(128,128,128,.08);
      --tkt-main:   #1c1916;
      --tkt-stub:   #131110;

      --amber:      #e89a0c;
      --amber-bg:   rgba(232,154,12,.10);
      --amber-bd:   rgba(232,154,12,.25);
      --red:        #c94040;
      --red-bg:     rgba(201,64,64,.10);
      --red-bd:     rgba(201,64,64,.25);
      --teal:       #0f8a72;
      --teal-bg:    rgba(15,138,114,.10);
      --teal-bd:    rgba(15,138,114,.25);
      --slate:      #556070;
      --slate-bg:   rgba(85,96,112,.12);
      --slate-bd:   rgba(85,96,112,.28);
      --violet:     #7c3aed;
      --violet-bg:  rgba(124,58,237,.12);
      --violet-bd:  rgba(124,58,237,.28);
      --violet-txt: #a78bfa;
      --gold:       #d4a017;
      --lbxd:       #00c030;
      --hero-overlay-mid: rgba(10,10,10,.15);
      --hero-overlay-edge: rgba(10,10,10,.45);
      --float-shadow: 0 4px 14px rgba(0,0,0,.35);
      --float-highlight: 0 1px 0 rgba(255,255,255,.06) inset;
      --mobile-chrome-offset: 12px;
      --mobile-history-size: 48px;
      --mobile-dock-gap: 12px;
    }

    /* ── CREAM MODE ──────────────────────────────────────────── */
    [data-theme="cream"] {
      --bg:         #f6f2ed;
      --surface:    #ede8e2;
      --card:       #ffffff;
      --card-hover: #f9f6f3;
      --border:     #d8d2cb;
      --border-dim: #e6e1db;
      --text:       #151310;
      --text-dim:   #5c554e;
      --text-muted: #8a8279;
      --hover-bg:   rgba(0,0,0,.06);

      --amber:      #a86500;
      --amber-bg:   rgba(168,101,0,.08);
      --amber-bd:   rgba(168,101,0,.22);
      --red:        #aa2828;
      --red-bg:     rgba(170,40,40,.08);
      --red-bd:     rgba(170,40,40,.22);
      --teal:       #0a7060;
      --teal-bg:    rgba(10,112,96,.08);
      --teal-bd:    rgba(10,112,96,.22);
      --slate:      #44566a;
      --slate-bg:   rgba(68,86,106,.08);
      --slate-bd:   rgba(68,86,106,.22);
      --violet:     #5c28c8;
      --violet-bg:  rgba(92,40,200,.08);
      --violet-bd:  rgba(92,40,200,.22);
      --violet-txt: #5c28c8;
      --gold:       #b8860b;
      --lbxd:       #007a20;
      --tkt-main:   #fffdf8;
      --tkt-stub:   #f0ece4;
      --hero-overlay-mid: rgba(246,242,237,.15);
      --hero-overlay-edge: rgba(246,242,237,.5);
      --float-shadow: 0 4px 10px rgba(0,0,0,.12);
      --float-highlight: 0 0 0 transparent;
    }

    /* ── LIGHT MODE ─────────────────────────────────────────── */
    [data-theme="light"] {
      --bg:         #ffffff;
      --surface:    #f9fafb;
      --card:       #ffffff;
      --card-hover: #f0fdf4;
      --border:     #e5e7eb;
      --border-dim: #f3f4f6;
      --text:       #1f2937;
      --text-dim:   #5b6c5b;
      --text-muted: #a1a8a1;
      --hover-bg:   rgba(0,0,0,.06);

      --tkt-main:   #ffffff;
      --tkt-stub:   #f9fafb;

      --amber:      #8f6b1d;
      --amber-bg:   rgba(143,107,29,.08);
      --amber-bd:   rgba(143,107,29,.22);
      --red:        #ef4444;
      --red-bg:     rgba(239,68,68,.08);
      --red-bd:     rgba(239,68,68,.22);
      --teal:       #58b45a;
      --teal-bg:    #dcfce7;
      --teal-bd:    #c8e6c9;
      --slate:      #5b6c5b;
      --slate-bg:   rgba(91,108,91,.08);
      --slate-bd:   rgba(91,108,91,.20);
      --violet:     #3b82f6;
      --violet-bg:  rgba(59,130,246,.08);
      --violet-bd:  rgba(59,130,246,.22);
      --violet-txt: #3b82f6;
      --gold:       #b8860b;
      --lbxd:       #007a20;
      --hero-overlay-mid: rgba(255,255,255,.15);
      --hero-overlay-edge: rgba(255,255,255,.5);
      --float-shadow: 0 4px 10px rgba(0,0,0,.12);
      --float-highlight: 0 0 0 transparent;
    }

    /* ── LYNCH MODE ─────────────────────────────────────────── */
    [data-theme="lynch"] {
      --bg:         #060404;
      --surface:    #0f0b0b;
      --card:       #120d0d;
      --card-hover: #1c1313;
      --border:     #2a1d1d;
      --border-dim: #1a1212;
      --text:       #f5eded;
      --text-dim:   #c4a8a8;
      --text-muted: #7d5f5f;

      --tkt-main:   #1a1010;
      --tkt-stub:   #0f0909;

      --amber:      #e8a541;
      --amber-bg:   rgba(232,165,65,.10);
      --amber-bd:   rgba(232,165,65,.25);
      --red:        #ef4444;
      --red-bg:     rgba(239,68,68,.10);
      --red-bd:     rgba(239,68,68,.25);
      --teal:       #b83a3a;
      --teal-bg:    rgba(184,58,58,.12);
      --teal-bd:    rgba(184,58,58,.30);
      --slate:      #6b4c4c;
      --slate-bg:   rgba(107,76,76,.12);
      --slate-bd:   rgba(107,76,76,.28);
      --violet:     #d4af37;
      --violet-bg:  rgba(212,175,55,.10);
      --violet-bd:  rgba(212,175,55,.25);
      --violet-txt: #d4af37;
      --gold:       #e8c547;
      --lbxd:       #ff6b6b;
      --hero-overlay-mid: rgba(6,4,4,.15);
      --hero-overlay-edge: rgba(6,4,4,.5);
      --float-shadow: 0 4px 14px rgba(0,0,0,.4);
      --float-highlight: 0 1px 0 rgba(255,255,255,.06) inset;
    }

    [data-theme="cream"] .filters::before,
    [data-theme="cream"] .day-tabs {
      background: rgba(246,242,237,.96);
    }
    [data-theme="light"] .filters::before,
    [data-theme="light"] .day-tabs {
      background: rgba(255,255,255,.96);
    }

    [data-theme="cream"] body::after,
    [data-theme="light"] body::after {
      opacity: .018;
      filter: invert(1);
    }

    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
    html, body { width: 100%; max-width: 100vw; touch-action: pan-y; overscroll-behavior-x: none; }
    body { overflow-x: hidden; overflow-x: clip; }
    html { scroll-behavior: smooth; background: var(--bg); }

    body {
      position: relative;
      background: var(--bg);
      color: var(--text);
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 13px;
      line-height: 1.5;
      min-height: 100vh;
      padding-top: env(safe-area-inset-top);
      overscroll-behavior-x: none;
    }

    body::after {
      content: '';
      position: fixed;
      inset: 0;
      pointer-events: none;
      z-index: 150;
      opacity: .03;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='256' height='256' filter='url(%23g)'/%3E%3C/svg%3E");
    }

    a { color: inherit; text-decoration: none; }

    /* ── LETTERBOXD INTEGRATION ──────────────────────────────── */

    /* ── HEADER ───────────────────────────────────────────── */
    #stickyBlock {
      position: sticky;
      top: 0;
      z-index: 200;
      background: var(--bg);
      margin-top: calc(-1 * env(safe-area-inset-top));
      padding-top: env(safe-area-inset-top);
    }
    header {
      background: var(--bg);
      border-bottom: 1px solid var(--border);
    }
    .header-inner {
      max-width: 960px;
      margin: 0 auto;
      padding: 18px 24px 14px;
      display: flex;
      align-items: center;
      gap: 20px;
      flex-wrap: wrap;
    }

    .site-title-wrap {
      display: flex;
      flex-direction: column;
      gap: 3px;
      cursor: pointer;
      user-select: none;
    }
    .site-title-wrap:hover .site-title  { color: var(--text-dim); }
    .site-title-wrap:hover .site-brand  { color: var(--text-muted); }

    .site-title {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 16px;
      font-weight: 400;
      letter-spacing: .14em;
      text-transform: uppercase;
      line-height: 1;
      color: var(--text);
      transition: color .1s;
    }
    .site-brand {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      font-weight: 400;
      letter-spacing: .22em;
      text-transform: uppercase;
      color: var(--text-dim);
      transition: color .1s;
    }

    .site-tagline { font-size: 9px; color: var(--text-dim); letter-spacing: .18em; text-transform: uppercase; display: inline-block; transform: scaleX(1.12); transform-origin: left center; }
    .about-link { text-decoration: none; border-radius: 2px; }
    .account-area { display: flex; align-items: center; gap: 8px; }
    .account-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      padding: 4px 12px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text-dim);
      border-radius: 2px;
      cursor: pointer;
      letter-spacing: .1em;
      text-transform: uppercase;
      transition: all .1s;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    .account-btn:hover { color: var(--text); border-color: var(--text); }
    .account-btn.open { border-color: var(--text); }
    .account-btn.active { background: var(--text); color: var(--bg); border-color: var(--text); }
    .account-btn { position: relative; }
    .account-dropdown { position: relative; }
    .account-dropdown-menu { position: absolute; right: 0; top: calc(100% + 6px); background: var(--bg); border: 1px solid var(--border); border-radius: 4px; padding: 6px 0; min-width: 160px; box-shadow: 0 4px 12px rgba(0,0,0,.15); z-index: 100; }
    .account-dropdown-menu a, .account-dropdown-menu button, .account-dropdown-item {
      display: block; width: 100%; text-align: left; background: none; border: none;
      color: var(--text-dim); padding: 8px 14px; cursor: pointer; text-decoration: none;
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; font-size: 9px; letter-spacing: .1em; text-transform: uppercase;
    }
    .account-dropdown-menu a:hover, .account-dropdown-menu button:hover, .account-dropdown-item:hover { background: var(--hover-bg); color: var(--text); }
    .account-dropdown-menu > button.active,
    .account-dropdown-menu > a.active,
    .account-dropdown-item.active { background: var(--text); color: var(--bg); }
    .account-dropdown-group { position: relative; }
    .account-dropdown-item { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
    .account-dropdown-arrow { font-size: 8px; opacity: .7; }
    .account-dropdown-sep { height: 1px; background: var(--border); margin: 6px 10px; }
    .account-submenu { position: absolute; left: calc(100% + 2px); top: 0; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; padding: 6px 0; min-width: 120px; display: none; box-shadow: 0 4px 12px rgba(0,0,0,.15); z-index: 101; }
    .account-submenu.open { display: block; }
    .account-submenu button { display: block; width: 100%; text-align: left; background: none; border: none; color: var(--text-dim); padding: 8px 14px; cursor: pointer; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; font-size: 9px; letter-spacing: .1em; text-transform: uppercase; }
    .account-submenu button:hover { background: var(--hover-bg); color: var(--text); }
    .account-submenu button.active { color: var(--text); }
    .mobile-account { display: none; flex-wrap: wrap; gap: 6px; }
    .mobile-about { display: none; }

    .auth-modal { position: fixed; inset: 0; z-index: 200; display: flex; align-items: center; justify-content: center; }
    .auth-modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
    .auth-modal-panel { position: relative; background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 24px; width: 100%; max-width: 360px; box-shadow: 0 8px 24px rgba(0,0,0,.2); }
    .auth-modal-close { position: absolute; top: 8px; right: 12px; background: none; border: none; font-size: 22px; color: var(--text-dim); cursor: pointer; }
    .auth-tabs { display: flex; gap: 8px; margin-bottom: 16px; border-bottom: 1px solid var(--border); }
    .auth-tab { flex: 1; background: none; border: none; color: var(--text-dim); padding: 8px 0; font-size: 13px; cursor: pointer; border-bottom: 2px solid transparent; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }
    .auth-tab.active { color: var(--text); border-bottom-color: var(--text); }
    .auth-label { display: block; font-size: 11px; color: var(--text-dim); margin: 12px 0 4px; text-transform: uppercase; letter-spacing: .06em; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }
    .auth-input { width: 100%; background: var(--panel-bg); border: 1px solid var(--border); color: var(--text); padding: 8px 10px; border-radius: 3px; font-size: 16px; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }
    .auth-password-wrap { position: relative; }
    .auth-password-wrap .auth-input { padding-right: 52px; }
    .auth-toggle-btn { position: absolute; right: 10px; top: 50%; transform: translateY(-50%); background: none; border: none; color: var(--text-dim); font-size: 11px; cursor: pointer; font-family: inherit; text-transform: uppercase; letter-spacing: .04em; padding: 0; }
    .auth-toggle-btn:hover { color: var(--text); }
    @media (max-width: 600px) { .auth-modal-panel { margin: 16px; width: calc(100% - 32px); max-width: none; } }
    .auth-input:focus { outline: none; border-color: var(--text); }
    .auth-error { color: #ff6b6b; font-size: 12px; min-height: 18px; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }

    /* Invite modal — styled like the format filter dropdown popup */
    .invite-modal { position: fixed; inset: 0; z-index: 210; display: flex; align-items: center; justify-content: center; }
    .invite-modal-backdrop { position: absolute; inset: 0; background: rgba(0,0,0,.5); }
    .invite-modal-panel { position: relative; background: var(--bg); border: 1px solid var(--border); border-radius: 6px; padding: 14px; width: 100%; max-width: 320px; max-height: 80vh; display: flex; flex-direction: column; box-shadow: 0 8px 24px rgba(0,0,0,.2); }
    .invite-modal-close { position: absolute; top: 6px; right: 10px; background: none; border: none; font-size: 20px; color: var(--text-dim); cursor: pointer; }
    .invite-modal-title { font-size: 14px; margin-bottom: 4px; }
    .invite-modal-note { font-size: 11px; color: var(--text-dim); margin-bottom: 10px; }
    .invite-list { overflow-y: auto; flex: 1; min-height: 120px; max-height: 360px; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; padding: 6px 0; box-shadow: 0 4px 12px rgba(0,0,0,.15); }
    .invite-row { display: flex; align-items: center; gap: 8px; width: 100%; text-align: left; background: none; border: none; color: var(--text-dim); padding: 7px 14px; cursor: pointer; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; font-size: 13px; }
    .invite-row:hover { background: var(--hover-bg); color: var(--text); }
    .invite-row.active { color: var(--text); }
    .invite-row-check { width: 10px; flex: none; }
    .invite-row-check::before { content: ''; }
    .invite-row.active .invite-row-check::before { content: '✓'; }
    .invite-row .profile-avatar { width: 24px; height: 24px; font-size: 10px; flex-shrink: 0; }
    .invite-row-name { font-size: 13px; }
    .invite-row-handle { font-size: 11px; color: var(--text-muted); margin-left: auto; }
    .invite-modal-actions { display: flex; gap: 10px; justify-content: flex-end; margin-top: 12px; }
    .invite-modal-status { font-size: 11px; min-height: 16px; margin-top: 8px; color: var(--text-dim); }
    .invite-link-row { display: flex; gap: 8px; margin-bottom: 12px; }
    .invite-link-row input { flex: 1; min-width: 0; font-size: 12px; }
    .invite-banner { position: fixed; bottom: 0; left: 0; right: 0; z-index: 180; background: var(--surface); border-top: 1px solid var(--border); padding: 12px 16px; display: flex; align-items: center; justify-content: center; gap: 12px; }
    .invite-banner-text { font-size: 13px; }
    .invite-banner-actions { display: flex; gap: 8px; }
    @media (max-width: 600px) { .invite-modal-panel { margin: 16px; width: calc(100% - 32px); max-width: none; } .invite-banner { flex-direction: column; align-items: stretch; text-align: center; } }
    /* Activity badge */
    .activity-btn { position: relative; }
    .activity-badge { position: absolute; top: -4px; right: -6px; background: var(--red); color: #fff; font-size: 9px; min-width: 14px; height: 14px; border-radius: 7px; display: flex; align-items: center; justify-content: center; padding: 0 3px; }
    .account-dropdown-item .activity-badge { position: static; display: inline-flex; margin-left: 6px; }
    .mobile-icon-btn { position: relative; }
    .mobile-icon-btn .activity-badge { top: 2px; right: 2px; min-width: 16px; height: 16px; border-radius: 8px; font-size: 10px; }
    .auth-submit { width: 100%; margin-top: 16px; padding: 10px; background: var(--text); color: var(--bg); border: none; border-radius: 3px; font-size: 13px; cursor: pointer; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }
    .auth-forgot { font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }
    .auth-submit:hover { opacity: .9; }

    .view-toggle {
      display: flex;
      margin-left: auto;
      align-self: flex-end;
      padding-bottom: 3px;
    }

    .header-search-group {
      margin-left: auto;
      display: flex;
      align-items: center;
      gap: 8px;
      flex-shrink: 0;
      align-self: flex-end;
      margin-bottom: 3px;
    }
    .header-search-group .search-input {
      width: 180px;
      padding: 5px 10px;
      font-size: 10px;
    }
    .header-search-group .search-input:focus,
    .header-search-group .search-input.has-value { width: 240px; }

    .view-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      padding: 4px 12px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text-dim);
      cursor: pointer;
      letter-spacing: .1em;
      text-transform: uppercase;
      transition: all .1s;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }
    .view-btn:first-child { border-radius: 2px 0 0 2px; }
    .view-btn:last-child  { border-radius: 0 2px 2px 0; margin-left: -1px; }
    .view-btn:hover       { color: var(--text); }
    .view-btn.active      { background: var(--text); color: var(--bg); border-color: var(--text); }
    .view-btn.secondary   { border-color: transparent; color: var(--text-dim); }
    .view-btn.secondary:hover { color: var(--text); }
    .view-btn.danger      { border-color: var(--border); color: #d66; }
    .view-btn.danger:hover { color: #ff6b6b; border-color: #ff6b6b; }

    /* ── FILTER BAR ───────────────────────────────────────── */
    .filters {
      position: relative;
      /* Low z-index: only needs a stacking context so the ::before background
         sits behind the bar's content. Must stay below header dropdowns
         (account-dropdown-menu, z-index 100). */
      z-index: 1;
      border-bottom: 1px solid var(--border);
      /* clip (not hidden): hidden forces overflow-y to auto, which would clip
         the filter dropdown menus that overflow the bar vertically. */
      overflow-x: clip;
    }
    /* Background + blur live on a pseudo-element: backdrop-filter directly on
       .filters flattens descendant stacking (dropdown menus show through). */
    .filters::before {
      content: '';
      position: absolute;
      inset: 0;
      z-index: -1;
      background: rgba(10,10,10,.95);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
      pointer-events: none;
    }

    .filters-inner {
      max-width: 960px;
      margin: 0 auto;
      padding: 7px 24px;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .filter-row {
      display: flex;
      align-items: center;
      gap: 4px;
      flex-wrap: wrap;
    }

    .filter-row-right {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      margin-left: auto;
    }

    .chip.c-follows.active { background: var(--gold); border-color: var(--gold); color: #000; }

    .filter-sep { width: 1px; height: 12px; background: var(--border); margin: 0 3px; flex-shrink: 0; }

    .chip {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      padding: 2px 8px;
      border-radius: 2px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text-dim);
      cursor: pointer;
      letter-spacing: .08em;
      text-transform: uppercase;
      transition: color .1s, border-color .1s, background .1s;
      white-space: nowrap;
      user-select: none;
    }
    /* hover only on pointer devices — prevents iOS sticky-hover ghost border */
    @media (hover: hover) {
      .chip:hover { color: var(--text); border-color: #404040; }
    }
    .chip.active             { color: var(--bg); background: var(--text); border-color: var(--text); }
    .chip.c-35mm.active      { background: var(--amber); border-color: var(--amber); color: #000; }
    .chip.c-70mm.active      { background: var(--red);   border-color: var(--red);   color: #fff; }
    .chip.c-16mm.active      { background: var(--teal);  border-color: var(--teal);  color: #fff; }
    .chip.c-dcp.active       { background: var(--slate); border-color: var(--slate); color: #fff; }
    .chip.c-theater.active   { color: var(--bg); background: var(--text); border-color: var(--text); }
    .chip.c-special.active   { background: var(--violet); border-color: var(--violet); color: #fff; }
    .chip.c-notify-toggle    { min-width: 52px; }
    .chip.c-notify-toggle.active { color: var(--bg); background: var(--text); border-color: var(--text); }
    .chip.c-notify-toggle[disabled] { opacity: .35; cursor: not-allowed; color: var(--text-muted); }
    .chip.c-defaults { color: var(--text-muted); }
    .chip.c-defaults:hover { color: var(--text); border-color: var(--text-muted); }
    #defaultTheatersEditor .chip.c-theater { min-width: 120px; text-align: center; white-space: nowrap; min-height: 28px; }

    /* Theater strip: stronger contrast — active = filled, inactive = very dim */
    #theaterStrip .chip.c-theater,
    .theater-strip .chip.c-theater         { border-color: transparent; color: var(--text-muted); }
    #theaterStrip .chip.c-theater.active,
    .theater-strip .chip.c-theater.active  { background: var(--text); color: var(--bg); border-color: var(--text); }

    .search-group {
      margin-left: auto;
      display: flex;
      align-items: center;
      gap: 8px;
      flex-shrink: 0;
    }

    .search-input {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 10px;
      letter-spacing: .06em;
      padding: 5px 10px;
      border: 1px solid var(--border);
      border-radius: 3px;
      background: rgba(255,255,255,0.04);
      color: var(--text);
      width: 160px;
      outline: none;
      transition: border-color .15s, width .2s, background .15s;
    }
    .search-input::placeholder { color: var(--text-muted); }
    .search-input:focus         { border-color: var(--text-dim); width: 210px; background: rgba(255,255,255,0.07); }
    .search-input.has-value     { border-color: var(--text-dim); width: 210px; background: rgba(255,255,255,0.07); }
    .search-clear {
      display: none;
      background: none;
      border: none;
      padding: 0 2px;
      cursor: pointer;
      color: var(--text-muted);
      font-size: 13px;
      line-height: 1;
    }
    .search-clear:hover { color: var(--text); }
    .search-input.has-value ~ .search-clear { display: block; }

    /* Dim chips when search is active — they're bypassed */
    .filters[data-searching] .chip,
    .filters[data-searching] .filter-sep,
    .filters[data-searching] #theaterChips { opacity: .3; pointer-events: none; }

    /* Hide special/format row on entity pages; those filters don't apply to panels */
    .filters[data-entity] .filter-row-formats { display: none; }
    /* Follow pages only need theater chips */
    .curate-tab-inactive-filters .filter-row-formats { display: none; }

    /* ── attribute filter dropdowns (genres / regions / format) ── */
    .filter-drop { position: relative; display: inline-block; }
    .filter-drop-btn.active { background: var(--text); color: var(--bg); border-color: var(--text); }
    .filter-drop-btn.open { border-color: var(--text); }
    .filter-drop-menu {
      position: absolute; left: 0; top: calc(100% + 6px); z-index: 210;
      background: var(--bg); border: 1px solid var(--border); border-radius: 4px;
      padding: 6px 0; min-width: 150px;
      box-shadow: 0 4px 12px rgba(0,0,0,.15);
    }
    .filter-drop-item {
      display: flex; align-items: center; gap: 8px; width: 100%; text-align: left;
      background: none; border: none; color: var(--text-dim); padding: 7px 14px;
      cursor: pointer; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px; letter-spacing: .1em; text-transform: uppercase;
    }
    .filter-drop-item:hover { background: var(--hover-bg); color: var(--text); }
    .filter-drop-check { width: 10px; flex: none; }
    .filter-drop-check::before { content: ''; }
    .filter-drop-item.active { color: var(--text); }
    .filter-drop-item.active .filter-drop-check::before { content: '✓'; }
    .filter-drop-clear { border-top: 1px solid var(--border); margin-top: 4px; padding-top: 10px; opacity: .7; }
    .filter-drop-clear .filter-drop-check { display: none; }

    /* ── DAY TABS ─────────────────────────────────────────── */
    /* Lives inside .filters so it sticks with the filter bar — no offset math needed */
    .day-tabs {
      overflow-x: auto;
      scrollbar-width: none;
      border-top: 1px solid var(--border-dim);
      max-width: 960px;
      margin: 0 auto;
    }
    .day-tabs::-webkit-scrollbar { display: none; }

    .day-tabs-inner {
      display: flex;
      align-items: stretch;
      gap: 3px;
      scroll-behavior: smooth;
      padding: 5px 24px;
      min-width: max-content;
      width: 100%;
    }

    .day-tab {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      letter-spacing: .1em;
      padding: 4px 10px;
      border: 1px solid var(--border);
      border-radius: 2px;
      background: transparent;
      color: var(--text-dim);
      cursor: pointer;
      white-space: nowrap;
      transition: all .1s;
      min-width: 44px;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 1px;
    }
    .day-tab:hover           { color: var(--text); border-color: #404040; }
    .day-tab.active          { background: var(--text); color: var(--bg); border-color: var(--text); }
    .day-tab.is-today        { color: var(--amber); border-color: var(--amber-bd); }
    .day-tab.is-today.active { background: var(--amber); border-color: var(--amber); color: #000; }

    .day-tab-label { font-size: 7px; opacity: .7; letter-spacing: .14em; text-transform: uppercase; line-height: 1; }
    .day-tab-num   { font-size: 14px; font-weight: 700; line-height: 1; letter-spacing: 0; }


    /* ── HOMEPAGE SECTIONS ────────────────────────────────── */
    #homeSections {
      max-width: 960px;
      margin: 0 auto;
      padding: 0 24px;
    }
    .hs-section {
      margin-top: 28px;
    }
    .hs-section:first-child { margin-top: 0; }
    .hs-empty-msg {
      font-size: 13px;
      line-height: 1.6;
      color: var(--text-dim);
      margin: 8px 0 4px;
      min-height: 171px;
      display: flex;
      align-items: center;
    }
    .hs-empty-msg a { color: var(--text-main); }
    /* Two-column grid for homepage sections */
    .hs-grid {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 0 32px;
      margin-top: 28px;
    }
    .hs-col { min-width: 0; padding-bottom: 28px; }
    .hs-col .hs-section:first-child { margin-top: 0; }
    /* Editorial hero */
    .hs-hero {
      position: relative;
      text-align: center;
      padding: 300px 20px 50px;
      overflow: hidden;
      border-radius: 4px;
    }
    .hs-hero-bg-wrap {
      position: absolute;
      inset: 0;
      z-index: 0;
      background-color: var(--bg);
      -webkit-mask-image: linear-gradient(to bottom, black 0%, black 50%, transparent 100%),
                          linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
      -webkit-mask-composite: source-in;
      mask-image: linear-gradient(to bottom, black 0%, black 50%, transparent 100%),
                  linear-gradient(to right, transparent 0%, black 8%, black 92%, transparent 100%);
      mask-composite: intersect;
    }
    .hs-hero-bg {
      position: absolute;
      inset: 0;
      background-size: cover;
      background-position: center 25%;
      opacity: .75;
    }
    .hs-hero-overlay {
      position: absolute;
      inset: 0;
      z-index: 1;
      background: radial-gradient(ellipse at center, var(--hero-overlay-mid) 30%, var(--hero-overlay-edge) 100%);
    }
    .hs-hero-content {
      position: relative;
      z-index: 2;
      padding-top: 100px;
    }
    .hs-hero-title {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: clamp(24px, 4vw, 34px);
      font-weight: 700;
      letter-spacing: .14em;
      text-transform: uppercase;
      display: inline-block;
      transform: scaleX(1.12);
      transform-origin: center center;
      text-decoration: none;
      color: var(--text);
      margin: 0;
    }
    .hs-hero-tagline {
      font-family: 'Lora', Georgia, 'Times New Roman', serif;
      font-size: 14px;
      font-style: italic;
      letter-spacing: .02em;
      color: var(--text);
      margin: 8px 0 0;
    }
    .hs-hero-actions {
      display: flex;
      justify-content: center;
      gap: 10px;
      flex-wrap: wrap;
      margin-top: 64px;
    }
    .hs-hero-actions + .hs-hero-actions { margin-top: 12px; }
    @media (max-width: 600px) {
      .hs-hero { padding: 180px 16px 36px; }
      .hs-hero-bg { background-position: center center; }
      .hs-hero-bg-wrap {
        -webkit-mask-image: linear-gradient(to bottom, black 0%, black 65%, transparent 100%);
        mask-image: linear-gradient(to bottom, black 0%, black 65%, transparent 100%);
      }
    }
    .hs-act-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 13px;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--text);
      background: var(--card);
      border: 1px solid var(--border);
      padding: 12px 24px;
      border-radius: 3px;
      cursor: pointer;
      text-decoration: none;
      display: inline-flex;
      align-items: center;
      transition: border-color .15s ease, background .15s ease;
    }
    .hs-act-btn:hover {
      border-color: var(--text-dim);
      background: var(--card-hover);
    }
    .hs-act-btn.active {
      color: var(--amber);
      border-color: var(--amber);
    }
    .hs-header {
      display: flex;
      align-items: baseline;
      gap: 8px;
      padding-bottom: 6px;
      border-bottom: 1px solid var(--border);
      margin-bottom: 12px;
      flex-wrap: wrap;
    }
    .hs-label {
      font-family: 'Outfit', 'Inter', 'Helvetica Neue', Arial, sans-serif;
      font-size: clamp(13px, 2vw, 18px);
      font-weight: 600;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--text);
    }
    .hs-sub {
      font-size: 10px;
      color: var(--text-dim);
      letter-spacing: .08em;
    }
    .hs-link {
      margin-left: auto;
      text-decoration: none;
      color: var(--text-dim);
    }
    .hs-link:hover { text-decoration: underline; color: var(--text); }
    .hs-count {
      margin-left: auto;
      font-size: 9px;
      color: var(--text-muted);
      letter-spacing: .08em;
    }
    .hs-poster-strip {
      overflow-x: auto;
      overflow-y: hidden;
      scrollbar-width: none;
      -webkit-overflow-scrolling: touch;
    }
    .hs-poster-strip::-webkit-scrollbar { display: none; }
    .hs-poster-track {
      display: flex;
      gap: 10px;
      width: max-content;
    }
    @media (prefers-reduced-motion: reduce) {
      .hs-poster-strip { overflow-x: auto; }
    }
    .hs-poster {
      flex: 0 0 auto;
      width: 92px;
      text-decoration: none;
      color: var(--text);
      transition: transform .15s ease, opacity .15s ease;
    }
    .hs-poster:hover { transform: translateY(-3px); opacity: .9; }
    .hs-poster img {
      width: 100%;
      aspect-ratio: 2/3;
      object-fit: cover;
      border-radius: 3px;
      background: rgba(255,255,255,.06);
      display: block;
    }
    .hs-poster-name {
      font-size: 11px;
      line-height: 1.25;
      margin-top: 5px;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .hs-poster-strip.muted img { filter: grayscale(100%); opacity: 0.45; }
    .hs-poster-strip.muted .hs-poster-name { opacity: 0.55; }
    /* Playing films inside a muted strip (e.g. directors tab) stay in color */
    .hs-poster-strip.muted .hs-poster-playing img { filter: none; opacity: 1; }
    .hs-poster-strip.muted .hs-poster-playing .hs-poster-name { opacity: 1; }
    .hs-poster-strip.muted .hs-poster { width: 64px; }
    .hs-poster-strip.muted .hs-poster-playing { width: 92px; }
    .hs-poster-strip.muted .hs-poster-track { align-items: flex-end; }
    .hs-poster-placeholder-inner {
      width: 100%;
      aspect-ratio: 2/3;
      background: var(--surface);
      border-radius: 3px;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 8px;
      font-size: 11px;
      line-height: 1.25;
      color: var(--text-dim);
    }
    .hs-list-row {
      margin-bottom: 14px;
      padding: 8px;
      margin-left: -8px;
      margin-right: -8px;
      border-radius: 4px;
      cursor: pointer;
      transition: background .1s;
    }
    .hs-list-row:last-child { margin-bottom: 0; }
    .hs-list-row.is-selectable:hover { background: var(--surface); }
    .hs-list-row.is-selectable:active { background: var(--card-hover); }
    .hs-list-row-muted {
      opacity: 0.55;
    }
    .hs-list-row-muted .hs-list-name {
      color: var(--text-dim);
    }
    .film-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
      gap: 16px;
      margin-top: 16px;
    }
    .film-grid-cell {
      position: relative;
    }
    .film-grid-poster-wrap {
      position: relative;
    }
    .film-grid-poster {
      display: block;
      text-decoration: none;
      color: var(--text);
      transition: transform .15s ease, opacity .15s ease;
    }
    .film-grid-poster:hover {
      transform: translateY(-3px);
      opacity: .9;
    }
    .film-grid-poster img {
      width: 100%;
      aspect-ratio: 2/3;
      object-fit: cover;
      border-radius: 3px;
      background: rgba(255,255,255,.06);
      display: block;
    }
    .film-grid-follow-btn {
      position: absolute;
      top: 6px;
      right: 6px;
      background: rgba(18,18,18,0.85);
      border-color: rgba(255,255,255,0.25);
    }
    .film-grid-follow-btn:hover {
      border-color: var(--text);
      color: var(--text);
    }
    .film-grid-title {
      display: block;
      font-size: 11px;
      line-height: 1.3;
      margin-top: 6px;
      color: var(--text);
      text-decoration: none;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .film-grid-title:hover {
      text-decoration: underline;
    }
    .film-grid-meta {
      font-size: 10px;
      line-height: 1.3;
      margin-top: 3px;
      color: var(--text-dim);
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .film-grid-cell-muted {
      opacity: 0.5;
    }
    .slate-showtimes {
      margin-top: 16px;
    }
    .curate-tab-inactive-filters .filters .chip.c-fmt,
    .curate-tab-inactive-filters .filters .chip.c-special,
    .curate-tab-inactive-filters .filters .filter-drop-btn {
      opacity: 0.35;
      pointer-events: none;
      cursor: default;
    }
    .curate-tab-inactive-filters .day-tabs,
    .curate-tab-inactive-filters .day-tabs-inner {
      opacity: 0.35;
      pointer-events: none;
    }
    .curate-slate-tab #listsView {
      padding-bottom: 50vh;
    }
    .hs-list-title-row {
      display: flex;
      align-items: baseline;
      gap: 8px;
      flex-wrap: wrap;
    }
    .hs-list-name {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 12px;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text);
      text-decoration: none;
    }
    .hs-list-name:hover { text-decoration: underline; }
    .hs-list-count {
      font-size: 10px;
      color: var(--text-dim);
      margin-left: 8px;
    }
    .hs-director-country {
      font-size: 9px;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--text-muted);
      border: 1px solid var(--border-dim);
      border-radius: 2px;
      padding: 2px 6px;
      margin-left: 2px;
    }
    .hs-series-theaters {
      margin-top: 2px;
      font-size: 11px;
      color: var(--text-dim);
    }
    .hs-series-theater {
      color: var(--text-dim);
      text-decoration: none;
    }
    .hs-series-theater:hover { text-decoration: underline; color: var(--text); }
    .hs-list-row .hs-poster-strip { margin-top: 8px; }
    .hs-act-primary {
      color: var(--bg);
      background: var(--text);
      border-color: var(--text);
    }
    .hs-act-primary:hover {
      opacity: .9;
      background: var(--text);
    }
    .hs-browse {
      text-align: center;
      margin-top: 36px;
      padding-bottom: 20px;
    }
    .hs-browse-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 12px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text);
      background: transparent;
      border: 1px solid var(--border);
      padding: 14px 32px;
      border-radius: 3px;
      cursor: pointer;
      transition: border-color .15s ease, background .15s ease;
    }
    .hs-browse-btn:hover {
      border-color: var(--text-dim);
      background: var(--card);
    }
    @media (max-width: 600px) {
      #homeSections { padding: 0 16px; }
      .hs-grid { display: flex; flex-direction: column; gap: 28px; padding-bottom: 28px; }
      .hs-col { display: contents; }
      .hs-section { margin-top: 0; }
      .hs-col .hs-section:first-child { margin-top: 0; }
      .hs-section-new { order: 1; }
      .hs-section-trending { order: 2; }
      .hs-section-saved { order: 3; }
      .hs-section-qna { order: 4; }
      .hs-section-lists { order: 5; }
      .hs-section-series { order: 6; }
      .hs-poster { width: 78px; }
      .hs-poster-strip.muted .hs-poster { width: 54px; }
      .hs-poster-strip.muted .hs-poster-playing { width: 78px; }
      .hs-list-row { margin-bottom: 24px; }
      .hs-list-row:last-child { margin-bottom: 0; }
    }

    /* ── MAIN ─────────────────────────────────────────────── */
    main { max-width: 960px; margin: 0 auto; padding: 0 24px 50vh; }

    .state-msg { padding: 60px 0; text-align: center; }
    .state-msg-title { font-family: 'Outfit', 'Inter', 'Helvetica Neue', Arial, sans-serif; font-size: 32px; color: var(--text-muted); letter-spacing: .06em; margin-bottom: 8px; }
    .state-msg-sub   { font-size: 10px; color: var(--text-muted); letter-spacing: .1em; }

    /* ── DATE SECTION ─────────────────────────────────────── */
    .date-section { margin-top: 16px; }

    .date-header {
      display: flex;
      align-items: baseline;
      gap: 8px;
      padding-bottom: 6px;
      border-bottom: 1px solid var(--border);
      margin-bottom: 6px;
      flex-wrap: wrap;
    }

    .date-weekday { font-family: 'Outfit', 'Inter', 'Helvetica Neue', Arial, sans-serif; font-size: clamp(13px, 2vw, 18px); font-weight: 600; letter-spacing: .1em; line-height: 1; color: var(--text); text-transform: uppercase; }
    .date-weekday.is-today { color: var(--amber); }
    .date-divider { font-size: 12px; color: var(--text-muted); }
    .date-full    { font-size: 10px; color: var(--text-dim); letter-spacing: .12em; text-transform: uppercase; }
    .date-count   { margin-left: auto; font-size: 9px; color: var(--text-muted); letter-spacing: .08em; }

    /* ── FILM CARDS ───────────────────────────────────────── */
    /* Film panel */
    #filmPanel {
      max-width: 960px;
      margin: 0 auto;
      padding: 20px 24px 0;
    }
    #filmPanelInner { position: relative; margin-bottom: 24px; }

    /* ── TICKET ─────────────────────────────── */
    .tkt {
      background: var(--tkt-main);
      background-image: repeating-linear-gradient(
        -45deg,
        transparent 0, transparent 18px,
        rgba(255,255,255,.013) 18px, rgba(255,255,255,.013) 19px
      );
      border-radius: 4px;
      overflow: visible;
      position: relative;
      display: flex;
      flex-direction: column;
      box-shadow: 0 6px 22px rgba(0,0,0,.5);
    }
    [data-theme="cream"] .tkt,
    [data-theme="light"] .tkt {
      background-image: repeating-linear-gradient(
        -45deg,
        transparent 0, transparent 18px,
        rgba(0,0,0,.025) 18px, rgba(0,0,0,.025) 19px
      );
      box-shadow: 0 6px 22px rgba(0,0,0,.18);
    }
    .tkt-main {
      display: grid;
      grid-template-columns: 150px 1fr auto;
      gap: 22px;
      padding: 22px 22px 18px;
      align-items: start;
    }
    .fp-poster {
      width: 150px;
      aspect-ratio: 2/3;
      background: rgba(255,255,255,.06);
      border-radius: 2px;
      overflow: hidden;
      flex-shrink: 0;
    }
    .fp-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .fp-poster.empty { border: 1px solid rgba(255,255,255,.08); }

    .fp-info { min-width: 0; }
    .fp-title {
      font-family: 'Lora', Georgia, 'Times New Roman', serif;
      font-size: 26px;
      font-weight: normal;
      line-height: 1.2;
      margin-bottom: 6px;
      letter-spacing: -.02em;
    }
    .fp-lbxd-link { color: var(--text-muted); text-decoration: none; white-space: nowrap; transition: color .1s; }
    .fp-lbxd-link:hover { color: var(--lbxd); }
    .fp-meta {
      font-size: 11px;
      color: var(--text-dim);
      margin-bottom: 12px;
      letter-spacing: .02em;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
    }
    .fp-meta span, .fp-meta a { white-space: nowrap; }
    .fp-meta span:not(:last-child)::after, .fp-meta a:not(:last-child)::after { content: '·'; margin: 0 4px; }
    .fp-meta a.fp-attr-chip { color: inherit; text-decoration: none; }
    .fp-meta a.fp-attr-chip:hover { color: var(--text); text-decoration: underline; }
    .fp-genres { display: flex; flex-wrap: wrap; gap: 4px; margin-bottom: 10px; }
    .fp-genre { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; padding: 2px 6px; border-radius: 2px; background: transparent; border: 1px solid rgba(255,255,255,.08); color: var(--text-muted); }
    a.fp-genre-link { text-decoration: none; }
    a.fp-genre-link:hover { color: var(--text); border-color: var(--text-muted); }
    [data-theme="cream"] .fp-genre,
    [data-theme="light"] .fp-genre { border-color: var(--border-dim); }
    .fp-overview { font-size: 13px; line-height: 1.65; color: var(--text-dim); }
    .fp-double-feature-badge {
      font-size: 10px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-bottom: 8px;
      border: 1px solid rgba(255,255,255,.12);
      display: inline-block;
      padding: 2px 8px;
      border-radius: 2px;
    }
    [data-theme="cream"] .fp-double-feature-badge,
    [data-theme="light"] .fp-double-feature-badge { border-color: var(--border-dim); }
    .fp-films-list { display: flex; flex-direction: column; gap: 16px; margin-top: 16px; }
    .fp-film-part { display: grid; grid-template-columns: 60px 1fr; gap: 12px; align-items: start; }
    .fp-film-part-poster { width: 60px; aspect-ratio: 2/3; background: rgba(255,255,255,.06); border-radius: 2px; overflow: hidden; }
    .fp-film-part-poster img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .fp-film-part-title { font-family: 'Lora', Georgia, 'Times New Roman', serif; font-size: 15px; margin-bottom: 4px; }
    .fp-film-part-info .fp-meta { margin-bottom: 8px; }
    .fp-film-part-info .fp-overview { font-size: 12px; line-height: 1.55; }
    .fp-film-part-info .fp-genres { margin-bottom: 6px; }

    /* Perforation */
    .tkt-perf {
      position: relative;
      border-top: 1.5px dashed rgba(255,255,255,.14);
      margin: 0;
      margin-top: auto;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    [data-theme="cream"] .tkt-perf,
    [data-theme="light"] .tkt-perf { border-top-color: rgba(0,0,0,.15); }

    /* Stub */
    .tkt-stub {
      background: var(--tkt-stub);
      border-radius: 0 0 4px 4px;
      padding: 16px 22px 18px;
    }
    .tkt-stub-row {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 20px;
      align-items: start;
    }
    .tkt-theater {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 13px; letter-spacing: .12em; text-transform: uppercase;
      color: var(--text); margin-bottom: 3px;
    }
    .tkt-addr {
      font-size: 13px; color: var(--text-muted);
      display: flex; align-items: center; gap: 6px;
    }
    .fp-copy-btn { background: none; border: none; cursor: pointer; padding: 0; color: var(--text-muted); line-height: 1; flex-shrink: 0; }
    .fp-copy-btn:hover { color: var(--text-dim); }
    .fp-copy-btn.copied { color: var(--teal); }
    .tkt-badges { display: flex; gap: 5px; flex-wrap: wrap; margin-top: 8px; }
    .fp-badge {
      font-size: 9px; letter-spacing: .1em; text-transform: uppercase;
      padding: 2px 6px; border-radius: 2px;
      background: transparent; border: 1px solid rgba(255,255,255,.12);
      color: var(--text-dim);
    }
    [data-theme="cream"] .fp-badge,
    [data-theme="light"] .fp-badge { border-color: var(--border); }
    .fp-badge-series { color: var(--violet-txt, #a78bfa); border-color: currentColor; }
    .fp-badge-series.series-link { cursor: pointer; }
    .fp-badge-series.series-link:hover { opacity: .75; }
    .tkt-datetime { text-align: right; }
    .tkt-time {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 36px; line-height: 1;
      letter-spacing: -.02em;
      color: var(--text);
    }
    .tkt-time.sold-out { text-decoration: line-through; text-decoration-thickness: 2px; opacity: .5; }
    .tkt-date {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 10px; letter-spacing: .12em; text-transform: uppercase;
      color: var(--text-dim); margin-top: 5px;
    }
    .tkt-tba-note { font-size: 9px; color: var(--text-muted); letter-spacing: .03em; margin-top: 4px; text-align: right; }
    .fp-special {
      font-size: 11px; color: var(--violet-txt);
      padding: 6px 10px;
      background: var(--violet-bg);
      border-left: 2px solid var(--violet-bd); border-radius: 1px;
      font-style: italic;
    }
    .tkt-actions {
      display: flex; gap: 8px; flex-wrap: wrap; align-items: center;
      margin-top: 16px;
    }
    .tkt-admit {
      margin-left: auto;
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
      color: var(--text-muted);
    }
    .tkt-going { margin-top: 14px; padding-top: 12px; border-top: 1px dashed var(--border-dim); }
    .tkt-going-label {
      font-size: 9px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-dim);
      margin-bottom: 8px;
    }
    .tkt-going-people { display: flex; flex-wrap: wrap; gap: 10px; }
    .tkt-going-person {
      display: inline-flex; align-items: center; gap: 7px;
      text-decoration: none; color: var(--text-main);
      padding: 3px 8px 3px 3px; border: 1px solid var(--border); border-radius: 20px;
    }
    .tkt-going-person:hover { border-color: var(--text-dim); }
    .tkt-going-person .profile-avatar { width: 24px; height: 24px; font-size: 10px; }
    .tkt-going-name { font-size: 12px; white-space: nowrap; }
    .fp-btn {
      display: inline-flex; align-items: center;
      padding: 8px 14px; font-size: 12px; letter-spacing: .03em;
      border-radius: 2px; cursor: pointer; text-decoration: none;
      border: 1px solid rgba(255,255,255,.14);
      font-family: inherit;
      transition: opacity .15s;
    }
    [data-theme="cream"] .fp-btn,
    [data-theme="light"] .fp-btn { border-color: var(--border); }
    .fp-btn:hover { opacity: .75; }
    .fp-btn-primary { background: var(--text); color: var(--bg); border-color: var(--text); }
    .fp-btn-secondary { background: transparent; color: var(--text-dim); }
    .fp-btn-disabled { background: transparent; color: var(--text-muted); cursor: default; }
    .fp-btn-disabled:hover { opacity: 1; }
    .fp-btn.copied { color: var(--teal); border-color: var(--teal); }

    /* Bookmarks & Lists */
    #bookmarksView, #listsView, #profileView { max-width: 960px; margin: 0 auto; padding: 20px 24px 40px; display: none; }
    .bm-header { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
    .bm-empty { font-size: 13px; color: var(--text-muted); }
    .bm-header-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 24px; }
    .bm-header-actions { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
    .bm-header-actions .view-btn { border-radius: 2px; margin-left: 0; }
    .bm-mode-group { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
    .bm-view-toggle-wrap { display: flex; align-items: center; gap: 6px; order: -1; }
    .bm-view-toggle { width: 30px; height: 26px; padding: 0; display: inline-flex; align-items: center; justify-content: center; font-size: 13px; }
    @media (max-width: 600px) { .bm-view-toggle-wrap { order: 1; } }
    .bm-feed-url { display: flex; flex-direction: column; gap: 8px; margin: -8px 0 20px; }
    .bm-feed-instructions { font-size: 12px; color: var(--text-dim); line-height: 1.5; }
    .bm-feed-row { display: flex; gap: 6px; }
    .bm-feed-row input { flex: 1; background: var(--surface); border: 1px solid var(--border); color: var(--text); padding: 6px 8px; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; font-size: 10px; border-radius: 2px; outline: none; }
    .bm-feed-row input::selection { background: var(--text-muted); color: var(--bg); }
    .bm-feed-row.compact input { padding: 5px 6px; font-size: 9px; }
    .bm-feed-row.compact .view-btn { padding: 4px 8px; font-size: 8px; }
    @media (max-width: 600px) { .bm-header-row { flex-direction: column; align-items: flex-start; } }
    .bm-stack { display: flex; flex-direction: column; gap: 28px; }
    .tag-dropdown-menu { position: fixed; background: var(--bg); border: 1px solid var(--border); border-radius: 4px; padding: 4px 0; min-width: 140px; box-shadow: 0 4px 12px rgba(0,0,0,.15); z-index: 200; }
    .tag-dropdown-item { display: block; width: 100%; text-align: left; background: none; border: none; color: var(--text-dim); padding: 7px 12px; cursor: pointer; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; font-size: 10px; letter-spacing: .06em; white-space: nowrap; }
    .tag-dropdown-item:hover { background: var(--hover-bg); color: var(--text); }
    .tag-dropdown-item.active { color: var(--text); }
    .bm-tags-view { display: flex; flex-direction: column; gap: 20px; }
    .bm-calendar-page { display: flex; flex-direction: column; gap: 24px; }
    .bm-feed-help { margin-top: 12px; padding: 10px 12px; background: rgba(59,130,246,.14); border: 1px solid rgba(59,130,246,.32); border-radius: 3px; }
    .bm-feed-help summary { font-size: 11px; color: var(--text-main); cursor: pointer; }
    .bm-feed-help > div { font-size: 11px; color: var(--text-main); line-height: 1.7; margin-top: 8px; }
    .bm-list-section { margin-top: 32px; padding-top: 28px; border-top: 1px solid var(--border-dim); }
    .bm-list-section-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
    .bm-tags-intro { font-size: 12px; color: var(--text-dim); line-height: 1.5; }
    .bm-tag-create { display: flex; gap: 6px; }
    .bm-tag-create input { flex: 1; background: var(--surface); border: 1px solid var(--border); color: var(--text); padding: 7px 9px; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; font-size: 11px; border-radius: 2px; outline: none; }
    .bm-tag-list { display: flex; flex-direction: column; gap: 14px; }
    .bm-tag-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 14px; background: var(--surface); border: 1px solid var(--border); border-radius: 2px; }
    .bm-tag-row.private-tag { background: rgba(255,255,255,.04); }
    [data-theme="cream"] .bm-tag-row.private-tag,
    [data-theme="light"] .bm-tag-row.private-tag { background: rgba(0,0,0,.03); }
    .bm-tag-info { display: flex; flex-direction: column; gap: 6px; min-width: 140px; }
    .bm-tag-name { font-size: 13px; color: var(--text); font-weight: 500; }
    .bm-tag-edit { display: none; align-items: center; gap: 6px; }
    .bm-tag-edit input { background: var(--bg); border: 1px solid var(--border); color: var(--text); padding: 4px 6px; font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; font-size: 11px; border-radius: 2px; outline: none; }
    .bm-tag-count { font-size: 10px; color: var(--text-muted); }
    .bm-tag-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 8px; flex: 1; min-width: 220px; }
    .bm-tag-buttons { display: flex; gap: 6px; }
    @media (max-width: 600px) {
      .bm-tag-row { flex-direction: column; gap: 12px; }
      .bm-tag-actions { align-items: flex-start; min-width: 0; width: 100%; }
      .bm-tag-edit input { flex: 1; }
    }
    .bm-card { position: relative; }
    .bm-remove { position: absolute; top: 10px; right: 12px; z-index: 10; background: none; border: none; cursor: pointer; font-size: 13px; color: rgba(255,255,255,.22); padding: 2px 4px; line-height: 1; }
    .bm-remove:hover { color: rgba(255,255,255,.55); }
    [data-theme="cream"] .bm-remove,
    [data-theme="light"] .bm-remove { color: rgba(0,0,0,.22); }
    [data-theme="cream"] .bm-remove:hover,
    [data-theme="light"] .bm-remove:hover { color: rgba(0,0,0,.55); }
    .bm-btn.bm-active { color: var(--amber); border-color: currentColor; }
    .bm-btn-group { display: inline-flex; align-items: stretch; }
    .bm-btn-group .bm-btn { border-top-right-radius: 0; border-bottom-right-radius: 0; border-right: none; }
    .bm-tag-toggle {
      font-family: inherit; font-size: 12px; color: var(--text-dim);
      background: var(--surface); border: 1px solid var(--border);
      border-left: none; border-top-left-radius: 0; border-bottom-left-radius: 0;
      padding: 0 8px; cursor: pointer; line-height: 1;
    }
    .bm-tag-toggle:hover { color: var(--text); border-color: var(--text-dim); }
    .bm-tag-toggle:disabled { opacity: .4; cursor: default; }
    .bm-section { margin-bottom: 40px; }
    .bm-section-label { font-size: 10px; letter-spacing: .12em; text-transform: uppercase; color: var(--text-dim); margin-bottom: 14px; }
    .bm-section .bm-empty { margin-bottom: 18px; }
    .bm-past { margin-top: 24px; }
    .bm-past summary { cursor: pointer; list-style: none; }
    .bm-past summary::-webkit-details-marker { display: none; }
    .bm-archived { opacity: .75; }
    .bm-note { font-size: 12px; color: var(--text-dim); line-height: 1.5; margin: -12px 0 20px; padding: 10px 12px; border-left: 2px solid var(--amber); background: var(--surface); }
    @media (max-width: 600px) { #bookmarksView, #listsView, #profileView { padding: 12px 12px 32px; } .bm-note { margin: -8px 0 16px; } }

    /* Compact tickets */
    .bm-compact-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
      gap: 16px;
      align-items: start;
    }
    .bm-compact-grid .bm-card { min-width: 0; }
    .tkt-compact .tkt-main {
      display: flex;
      flex-direction: row;
      align-items: stretch;
      text-align: left;
      gap: 12px;
      padding: 12px;
    }
    .tkt-compact .fp-poster {
      width: 100px;
      aspect-ratio: 2/3;
      border-radius: 2px;
      flex-shrink: 0;
      align-self: flex-start;
    }
    .tkt-compact .fp-info {
      min-width: 0;
      flex: 1;
      display: flex;
      flex-direction: column;
    }
    .tkt-compact .fp-title {
      font-family: 'Lora', Georgia, 'Times New Roman', serif;
      font-size: 15px;
      line-height: 1.25;
      margin-bottom: 6px;
    }
    .tkt-compact .tkt-venue { min-width: 0; }
    .tkt-compact .tkt-theater {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 10px;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-dim);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      margin-bottom: 4px;
    }
    .tkt-compact .tkt-datetime { text-align: left; margin-bottom: auto; }
    .tkt-compact .tkt-time {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 20px;
      line-height: 1;
      color: var(--text);
    }
    .tkt-compact .tkt-date {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      letter-spacing: .08em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-top: 3px;
    }
    .tkt-compact .tkt-actions {
      margin-top: auto;
      padding-top: 10px;
      justify-content: flex-start;
      gap: 8px;
    }
    .tkt-compact .tkt-actions .fp-btn,
    .tkt-compact .tkt-actions .bm-tag-toggle {
      padding: 0;
      width: 32px;
      height: 32px;
      font-size: 14px;
      justify-content: center;
    }
    .tkt-compact .tkt-actions .bm-tag-toggle {
      line-height: 1;
      border-left: 1px solid var(--border);
      border-top-left-radius: 2px;
      border-bottom-left-radius: 2px;
    }
    .tkt-compact .tkt-actions .fp-btn-icon { width: 32px; height: 32px; padding: 0; }
    .tkt-compact .tkt-perf,
    .tkt-compact .tkt-stub,
    .tkt-compact .tkt-admit { display: none; }
    .bm-compact-grid .tkt-wrap {
      transition: transform .15s ease;
    }
    .bm-compact-grid .tkt {
      transition: box-shadow .15s ease;
    }
    .bm-compact-grid .bm-card:hover .tkt-wrap {
      transform: translateY(-4px);
    }
    .bm-compact-grid .bm-card:hover .tkt {
      box-shadow: 0 14px 36px rgba(0,0,0,.55);
    }
    [data-theme="cream"] .bm-compact-grid .bm-card:hover .tkt,
    [data-theme="light"] .bm-compact-grid .bm-card:hover .tkt {
      box-shadow: 0 12px 30px rgba(0,0,0,.2);
    }
    @media (max-width: 600px) {
      .bm-compact-grid { grid-template-columns: 1fr; gap: 10px; }
      .tkt.tkt-compact { min-height: auto; }
      .tkt-compact .tkt-main { padding: 10px; gap: 10px; min-height: auto; align-items: flex-start; }
      .tkt-compact .fp-poster { width: 64px; }
      .tkt-compact .fp-title { font-size: 15px; margin-bottom: 2px; }
      .tkt-compact .tkt-theater { font-size: 9px; margin-bottom: 2px; }
      .tkt-compact .tkt-time { font-size: 18px; }
      .tkt-compact .tkt-date { font-size: 9px; margin-top: 2px; }
      .tkt-compact .tkt-datetime { margin-bottom: 0; }
      .tkt-compact .tkt-actions { margin-top: 0; padding-top: 6px; gap: 6px; }
      .tkt-compact .tkt-actions .fp-btn,
      .tkt-compact .tkt-actions .bm-tag-toggle { width: 28px; height: 28px; font-size: 13px; }
      .tkt-compact .tkt-actions .fp-btn-icon { width: 28px; height: 28px; }
    }

    /* Profile */
    .profile-page { max-width: 980px; margin: 0 auto; padding: 0 24px 20px; }
    .profile-header-wrap { position: relative; margin-bottom: 24px; }
    .profile-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; margin-bottom: 0; }
    @media (max-width: 600px) { .profile-header { flex-direction: column; } }
    .profile-header-actions { display: flex; flex-direction: column; align-items: flex-end; gap: 12px; min-width: 120px; }
    @media (max-width: 600px) { .profile-header-actions { align-items: flex-start; width: 100%; } }
    .profile-actions-row { position: relative; display: flex; gap: 8px; }
    .profile-action-btn { width: 32px; height: 32px; border-radius: 2px; border: 1px solid var(--border); background: var(--surface); color: var(--text-muted); font-size: 16px; line-height: 1; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
    .profile-action-btn:hover { color: var(--text); border-color: var(--text-dim); }
    .profile-follow-wrap { margin-top: 4px; }
    .profile-hero { position: relative; width: 100%; aspect-ratio: 16 / 9; margin-bottom: 16px; border-radius: 0 0 6px 6px; overflow: hidden; }
    .profile-hero-img { width: 100%; height: 100%; object-fit: cover; object-position: top center; display: block; mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 5%, rgba(0,0,0,1) 95%, rgba(0,0,0,0) 100%), linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 5%, rgba(0,0,0,1) 95%, rgba(0,0,0,0) 100%); -webkit-mask-image: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 5%, rgba(0,0,0,1) 95%, rgba(0,0,0,0) 100%), linear-gradient(to right, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 5%, rgba(0,0,0,1) 95%, rgba(0,0,0,0) 100%); mask-composite: intersect; -webkit-mask-composite: source-in; }
    .profile-hero-overlay { position: absolute; inset: 0; background: rgba(0,0,0,0.15); pointer-events: none; }
    .profile-backdrop-dropdown { position: absolute; top: 40px; right: 0; z-index: 6; min-width: 220px; max-width: min(320px, calc(100vw - 48px)); max-height: 320px; overflow-y: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 4px; box-shadow: 0 8px 24px rgba(0,0,0,.25); }
    .profile-backdrop-menu { display: flex; flex-direction: column; padding: 6px; }
    .profile-backdrop-item { width: 100%; text-align: left; padding: 8px 10px; font-size: 12px; color: var(--text); background: none; border: none; border-radius: 2px; cursor: pointer; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .profile-backdrop-item:hover { background: var(--surface-hover, rgba(255,255,255,.06)); }
    .profile-backdrop-item.active { color: var(--amber); }
    .profile-backdrop-empty { padding: 10px; font-size: 12px; color: var(--text-dim); }
    .profile-content { display: flex; flex-direction: column; gap: 24px; }
    /* Profile screening strip */
    .profile-strip {
      display: flex;
      gap: 12px;
      justify-content: safe center;
      overflow-x: auto;
      scroll-snap-type: x mandatory;
      -webkit-overflow-scrolling: touch;
      padding: 8px 0 12px;
      scrollbar-width: thin;
      scrollbar-color: var(--border-dim) transparent;
    }
    .profile-strip::-webkit-scrollbar { height: 6px; }
    .profile-strip::-webkit-scrollbar-track { background: transparent; }
    .profile-strip::-webkit-scrollbar-thumb { background: var(--border-dim); border-radius: 3px; }
    .profile-strip-item {
      position: relative;
      flex: 0 0 auto;
      width: 110px;
      scroll-snap-align: center;
      text-decoration: none;
      color: inherit;
      transition: transform .15s ease;
    }
    .profile-strip-poster {
      width: 110px;
      height: 165px;
      object-fit: cover;
      border-radius: 3px;
      background: var(--card);
      border: 1px solid var(--border-dim);
      display: block;
    }
    .profile-strip-info { margin-top: 6px; min-width: 0; transition: opacity .15s ease; }
    .profile-strip-title {
      font-size: 11px; line-height: 1.25; color: var(--text-main);
      display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    }
    .profile-strip-meta { font-size: 10px; color: var(--text-dim); margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .profile-strip-item.is-past .profile-strip-info { opacity: .5; }
    .profile-strip-item.is-anchor .profile-strip-poster { box-shadow: 0 0 0 2px var(--text); border-color: var(--text); }
    .profile-strip-item:hover { transform: translateY(-3px); }
    .profile-strip-item:hover .profile-strip-poster { border-color: var(--text-dim); }
    .profile-strip-item:hover .profile-strip-info { opacity: 1; }
    .profile-empty-small { font-size: 12px; color: var(--text-dim); }
    .profile-header-main { display: flex; align-items: center; gap: 16px; margin-bottom: 16px; }
    .profile-avatar { width: 64px; height: 64px; border-radius: 50%; background: var(--teal); color: var(--bg); display: flex; align-items: center; justify-content: center; font-size: 22px; font-weight: 600; flex-shrink: 0; overflow: hidden; }
    .profile-avatar img { width: 100%; height: 100%; object-fit: cover; display: block; }
    .profile-header-text { min-width: 0; }
    .profile-name { font-size: 22px; font-weight: 600; margin-bottom: 4px; }
    .profile-handle-line { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .profile-handle { font-size: 12px; color: var(--text-muted); }
    .profile-city { font-size: 10px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .08em; border: 1px solid var(--border); padding: 2px 6px; border-radius: 2px; }
    .profile-bio { font-size: 13px; color: var(--text-main); line-height: 1.5; margin-top: 10px; white-space: pre-wrap; }
    .profile-empty { font-size: 13px; color: var(--text-muted); margin-top: 12px; }
    .profile-wrap { max-width: 980px; margin: 0 auto; padding: 20px 24px; column-count: 2; column-gap: 24px; }
    .profile-stats { display: flex; gap: 16px; margin-top: 8px; font-size: 13px; color: var(--text-dim); }
    .profile-stats-bar { display: flex; gap: 20px; flex-wrap: wrap; }
    .profile-stat-item { display: flex; flex-direction: column; align-items: center; min-width: 50px; text-decoration: none; color: inherit; }
    .profile-stat-item:hover .profile-stat-num { color: var(--text); }
    .profile-stat-num { font-size: 18px; font-weight: 600; color: var(--text-main); line-height: 1; }
    .profile-stat-label { font-size: 10px; color: var(--text-dim); text-transform: uppercase; letter-spacing: .06em; margin-top: 4px; }
    .profile-tab-header { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
    .profile-tab-back { background: none; border: none; color: var(--text-muted); font-size: 12px; cursor: pointer; padding: 0; }
    .profile-tab-back:hover { color: var(--text); }
    .profile-tab-header .profile-section-title { margin-bottom: 0; }
    .profile-people-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
    @media (max-width: 600px) { .profile-people-cols { grid-template-columns: 1fr; } }
    .profile-people-cols .profile-empty-small { padding: 4px 0; }
    .profile-section { margin-top: 0; margin-bottom: 24px; break-inside: avoid; }
    .profile-section-title {
      font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
      color: var(--text-dim); margin-bottom: 10px;
    }
    .profile-slate { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px 24px; align-items: start; padding-top: 16px; margin-bottom: 32px; }
    @media (max-width: 600px) { .profile-slate { grid-template-columns: 1fr; } }
    .profile-bookmarks-section { padding-top: 8px; }
    .profile-bookmarks-section .bm-header { margin-bottom: 16px; }
    .profile-list-card { background: var(--surface); border: 1px solid var(--border); border-radius: 2px; padding: 14px; }
    .profile-list-header { display: flex; align-items: baseline; gap: 8px; margin-bottom: 10px; }
    .profile-list-name { font-size: 13px; color: var(--text); font-weight: 500; }
    .profile-list-meta { margin-top: 10px; }
    .profile-list-slate { display: inline-block; font-size: 10px; color: var(--text-dim); letter-spacing: .06em; text-transform: uppercase; padding: 3px 6px; border: 1px solid var(--border); border-radius: 2px; text-decoration: none; }
    .profile-list-slate:hover { color: var(--text); border-color: var(--text-dim); }
    .profile-list-source { font-size: 10px; color: var(--text-muted); text-decoration: none; }
    .profile-list-source:hover { color: var(--text); text-decoration: underline; }
    .profile-user-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border-dim); }
    .profile-user-row:last-child { border-bottom: none; }
    .profile-user-info { display: flex; align-items: center; gap: 12px; text-decoration: none; flex: 1; min-width: 0; }
    .profile-user-info .profile-avatar { width: 36px; height: 36px; font-size: 12px; flex-shrink: 0; }
    .profile-user-name { font-size: 14px; font-weight: 500; color: var(--text-main); }
    .profile-user-handle { font-size: 12px; color: var(--text-muted); }
    .profile-collection-row { padding: 10px 0; border-bottom: 1px solid var(--border-dim); }
    .profile-collection-row:last-child { border-bottom: none; }
    .profile-collection-info { display: flex; align-items: baseline; gap: 12px; }
    .profile-collection-type { font-size: 10px; color: var(--text-dim); letter-spacing: .06em; text-transform: uppercase; min-width: 70px; }
    .profile-collection-name { font-size: 14px; font-weight: 500; color: var(--text-main); }
    a.profile-collection-name { text-decoration: none; }
    a.profile-collection-name:hover { text-decoration: underline; }
    .profile-collection-posters { display: flex; gap: 6px; margin-top: 10px; }
    .profile-collection-posters img { height: 80px; width: 53px; object-fit: cover; border-radius: 2px; background: var(--card); }
    .profile-fav-theater { padding: 10px 0; border-bottom: 1px solid var(--border-dim); }
    .profile-fav-theater:last-child { border-bottom: none; }
    .profile-fav-theater-info { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 6px; }
    .profile-fav-theater-name { font-size: 14px; font-weight: 500; color: var(--text-main); }
    .profile-fav-theater-count { font-size: 12px; color: var(--text-dim); }
    .profile-fav-theater-bar { height: 4px; background: var(--border-dim); border-radius: 2px; overflow: hidden; }
    .profile-fav-theater-fill { height: 100%; background: var(--teal); border-radius: 2px; }
    .profile-activity-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
    .profile-activity-item { display: flex; flex-direction: column; align-items: center; padding: 14px 8px; background: var(--surface); border: 1px solid var(--border-dim); border-radius: 4px; }
    .profile-activity-num { font-size: 20px; font-weight: 600; color: var(--text-main); line-height: 1; }
    .profile-activity-label { font-size: 10px; color: var(--text-dim); text-transform: uppercase; letter-spacing: .06em; margin-top: 6px; }
    .profile-badges { display: flex; flex-wrap: wrap; gap: 8px; }
    .profile-badge {
      display: inline-flex; align-items: center; gap: 6px;
      padding: 5px 9px 5px 7px;
      background: var(--surface); border: 1px solid var(--border); border-radius: 3px;
    }
    .profile-badge-icon { display: inline-flex; width: 15px; height: 15px; color: var(--text); }
    .profile-badge-icon svg { width: 15px; height: 15px; display: block; }
    .profile-badge-label { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--text-dim); }
    .profile-badges-ref { display: flex; flex-direction: column; gap: 8px; }
    .profile-badge-ref {
      display: flex; align-items: center; gap: 12px;
      padding: 10px 12px; border: 1px solid var(--border); border-radius: 3px; background: var(--surface);
      opacity: .55;
    }
    .profile-badge-ref.is-earned { opacity: 1; border-color: var(--gold); }
    .profile-badge-ref-text { flex: 1; min-width: 0; }
    .profile-badge-ref-label { font-size: 13px; font-weight: 500; color: var(--text-main); }
    .profile-badge-ref-desc { font-size: 11px; color: var(--text-dim); margin-top: 2px; }
    .profile-badge-ref-state { font-size: 10px; letter-spacing: .06em; text-transform: uppercase; color: var(--text-dim); flex-shrink: 0; }
    .profile-badge-ref.is-earned .profile-badge-ref-state { color: var(--gold); }
    .profile-stat-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--border-dim); }
    .profile-stat-row:last-child { border-bottom: none; }
    .profile-stat-name { font-size: 14px; font-weight: 500; color: var(--text-main); }
    .profile-stat-count { font-size: 12px; color: var(--text-dim); }
    @media (max-width: 760px) { .profile-content { column-count: 1; } .profile-page { max-width: 600px; } }
    /* People (merged Find People + Lobby) */
    #findPeopleView { max-width: 980px; margin: 0 auto; padding: 24px 24px 80px; display: none; }
    .people-wrap { width: 100%; }
    .people-title { font-size: 22px; font-weight: 600; margin-bottom: 4px; }
    .people-empty { font-size: 13px; color: var(--text-dim); }
    .people-wrap .search-group { margin-left: 0; }
    .people-wrap .search-input { width: 100%; max-width: 460px; }
    .people-wrap .search-input:focus { width: 100%; }
    .people-section { margin-top: 32px; }
    .people-section-title {
      font-size: 11px;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-bottom: 14px;
    }
    .lobby-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
    .lobby-card { display: flex; align-items: center; gap: 12px; padding: 12px; border: 1px solid var(--border); border-radius: 4px; background: var(--surface); text-decoration: none; color: inherit; transition: border-color .15s ease; }
    .lobby-card:hover { border-color: var(--text-dim); }
    .lobby-card .profile-avatar { width: 40px; height: 40px; font-size: 14px; flex-shrink: 0; }
    .lobby-card-text { min-width: 0; }
    .lobby-card-name { font-size: 14px; font-weight: 500; color: var(--text-main); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
    .lobby-card-handle { font-size: 11px; color: var(--text-muted); }
    .lobby-card-stat { font-size: 11px; color: var(--teal); margin-top: 4px; }
    .lobby-loading, .lobby-empty { font-size: 13px; color: var(--text-dim); }
    .lobby-coming-soon { grid-column: 1 / -1; display: flex; align-items: center; justify-content: center; min-height: 70vh; }
    .lobby-coming-soon-card { text-align: center; padding: 32px; border: 1px solid var(--border); border-radius: 6px; background: var(--surface); max-width: 360px; }
    .lobby-coming-soon-title { font-size: 18px; font-weight: 600; margin-bottom: 8px; color: var(--text-main); }
    .lobby-coming-soon-sub { font-size: 13px; color: var(--text-dim); margin-bottom: 18px; }
    .find-people-result { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border-dim); }
    .find-people-result:last-child { border-bottom: none; }
    .find-people-info { display: flex; align-items: center; gap: 12px; text-decoration: none; flex: 1; min-width: 0; }
    .find-people-info .profile-avatar { width: 40px; height: 40px; font-size: 14px; flex-shrink: 0; }
    .find-people-name { font-size: 14px; font-weight: 500; color: var(--text-main); }
    .find-people-handle { font-size: 12px; color: var(--text-muted); }
    .find-people-empty { font-size: 13px; color: var(--text-dim); margin-top: 12px; }
    @media (max-width: 600px) {
      #findPeopleView { padding: 16px 12px 60px; }
      .lobby-grid { grid-template-columns: 1fr; }
    }
    /* Activity */
    #activityView { max-width: 1100px; margin: 0 auto; padding: 24px 24px 80px; display: none; }
    .activity-page { width: 100%; }
    .activity-header { margin-bottom: 24px; }
    .activity-header h1 { font-size: 22px; font-weight: 600; margin: 0; }
    .activity-install-prompt { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; margin-bottom: 24px; background: var(--surface); border: 1px solid var(--border); border-radius: 4px; }
    .activity-install-body { flex: 1; min-width: 0; }
    .activity-install-title { font-weight: 500; color: var(--text-main); margin-bottom: 4px; }
    .activity-install-text { font-size: 13px; color: var(--text-muted); line-height: 1.45; }
    .activity-install-close { flex-shrink: 0; width: 28px; height: 28px; display: flex; align-items: center; justify-content: center; background: transparent; border: none; color: var(--text-muted); font-size: 20px; cursor: pointer; }
    .activity-install-close:hover { color: var(--text-main); }
    .activity-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
    .activity-column { min-width: 0; }
    .activity-section { margin-bottom: 40px; }
    .activity-section:last-child { margin-bottom: 0; }
    .activity-section h2 { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); margin: 0 0 14px; display: flex; align-items: center; gap: 8px; }
    .activity-count { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: var(--amber); color: #000; font-size: 10px; font-weight: 600; letter-spacing: 0; }
    .activity-list { display: flex; flex-direction: column; gap: 10px; }
    .activity-row { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 4px; }
    .activity-avatar-link { display: block; flex-shrink: 0; text-decoration: none; }
    .activity-row .profile-avatar { width: 40px; height: 40px; font-size: 14px; }
    .activity-avatar-system { background: var(--text-muted); }
    .activity-row-content { flex: 1; min-width: 0; display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
    .activity-row-main { min-width: 0; }
    .activity-user { font-weight: 500; color: var(--text-main); text-decoration: none; }
    .activity-user:hover { text-decoration: underline; }
    .activity-verb { color: var(--text-dim); }
    .activity-film { font-weight: 500; color: var(--text-main); text-decoration: none; }
    .activity-film:hover { text-decoration: underline; }
    .activity-meta { font-size: 12px; color: var(--text-muted); margin-top: 4px; }
    .activity-row-actions { display: flex; gap: 8px; flex-shrink: 0; }
    .activity-empty { font-size: 13px; color: var(--text-dim); }
    .activity-link { color: var(--text-main); text-decoration: underline; text-underline-offset: 2px; }
    .activity-loading, .activity-error { font-size: 13px; color: var(--text-dim); }
    @media (max-width: 900px) {
      .activity-grid { grid-template-columns: 1fr; }
    }
    @media (max-width: 600px) {
      #activityView { padding: 16px 12px 60px; }
      .activity-row-content { flex-direction: column; gap: 12px; }
      .activity-row-actions { width: auto; align-self: flex-start; }
      .activity-row-actions .fp-btn { flex: 0 0 auto; min-width: auto; }
    }
    /* About */
    #aboutView { max-width: 640px; margin: 0 auto; padding: 150px 24px 400px; display: none; }
    .about-page { font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }
    .about-page h1 { font-size: 18px; font-weight: normal; line-height: 1.6; margin-bottom: 12px; letter-spacing: -.01em; font-style: italic; }
    .about-page p { font-size: 13px; line-height: 1.75; color: var(--text-dim); margin-bottom: 16px; }
    .about-page p strong { color: var(--text); font-weight: normal; }
    .about-page section { margin-bottom: 48px; }
    .about-page h2 { font-size: 11px; font-family: system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; color: var(--text-dim); margin-bottom: 16px; font-weight: normal; }
    .form-field { margin-bottom: 16px; }
    .form-field label { display: block; font-size: 11px; font-family: system-ui, sans-serif; letter-spacing: .1em; text-transform: uppercase; color: var(--text-dim); margin-bottom: 6px; }
    .form-field input, .form-field textarea { width: 100%; background: var(--surface); border: 1px solid var(--border); color: var(--text); font-size: 14px; font-family: system-ui, sans-serif; padding: 10px 12px; border-radius: 2px; outline: none; resize: vertical; }
    .form-field input:focus, .form-field textarea:focus { border-color: var(--text-dim); }
    .form-field textarea { min-height: 120px; }
    .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
    .form-submit { background: var(--surface); color: var(--text-dim); border: 1px solid var(--border); padding: 10px 20px; font-size: 13px; font-family: system-ui, sans-serif; cursor: pointer; border-radius: 2px; letter-spacing: .03em; }
    .form-submit:hover { background: var(--border); color: var(--text); }
    .form-submit:disabled { opacity: .4; cursor: default; }
    .form-status { margin-top: 12px; font-size: 13px; font-family: system-ui, sans-serif; color: var(--text-dim); display: none; }
    .form-status.ok { color: var(--teal); display: block; }
    .form-status.err { color: var(--red); display: block; }
    .about-chevron { font-size: 9px; transition: transform .2s; display: inline-block; }
    .about-chevron.open { transform: rotate(90deg); }
    @media (max-width: 600px) { #aboutView { padding: 100px 12px 250px; } .form-row { grid-template-columns: 1fr; } }
    /* Contact */
    #contactView { max-width: 640px; margin: 0 auto; padding: 150px 24px 80px; display: none; }
    .contact-page { font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }
    .contact-page h1 { font-size: 18px; font-weight: normal; line-height: 1.6; margin-bottom: 12px; }
    .contact-page p { font-size: 13px; line-height: 1.75; color: var(--text-dim); margin-bottom: 24px; }
    @media (max-width: 600px) { #contactView { padding: 100px 12px 60px; } }
    /* Settings page — left-aligned, tabular, in the app's native mono language.
       One label style (9px mono-caps), one value size (13px), the shared
       .view-btn for every button. Scoped under .profile-edit so it never
       collides with the #settingsPanel dropdown. */
    /* Match the app content container (header/main: max-width 960, centered,
       24px gutter) so the left edge lines up with the logo and film list,
       then keep the settings content in a narrow left-aligned column. */
     .profile-edit { font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace; }
     .profile-edit-bar { display: flex; align-items: center; justify-content: space-between; margin-bottom: 16px; }
     .profile-edit-done { background: none; border: none; color: var(--text-muted); font-size: 12px; cursor: pointer; padding: 0; font-family: inherit; }
     .profile-edit-done:hover { color: var(--text); }
     .profile-edit-private { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-dim); }
    .profile-backdrop-picker { margin-top: 10px; max-height: 240px; overflow-y: auto; }
    .profile-edit .settings-page-inner { width: 100%; max-width: 900px; }
    .profile-edit-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 32px; align-items: start; }
    @media (max-width: 760px) { .profile-edit-cols { grid-template-columns: 1fr; } }
    .profile-edit .set-title { font-size: 9px; letter-spacing: .22em; text-transform: uppercase; color: var(--text-dim); margin: 0 0 28px; }
    .profile-edit .set-group { padding: 16px; margin: 0 0 16px; background: var(--surface); border: 1px solid var(--border); border-radius: 4px; }
    .profile-edit .set-group:last-child { margin-bottom: 0; }
    .profile-edit .set-group-title { font-size: 9px; letter-spacing: .14em; text-transform: uppercase; color: var(--text-muted); margin: 0 0 14px; }
    .profile-edit .set-row { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: baseline; gap: 12px; min-height: 34px; }
    .profile-edit .set-key { font-size: 9px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
    .profile-edit .set-val { font-size: 13px; color: var(--text); word-break: break-word; }
    .profile-edit .set-control { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
    .profile-edit .set-row { margin-bottom: 14px; }
    .profile-edit .set-row:last-child { margin-bottom: 0; }
    .profile-edit .set-save { margin-left: auto; }
    .avatar-edit-preview .profile-avatar { width: 72px; height: 72px; }
    .avatar-edit-actions { display: flex; gap: 8px; flex-wrap: wrap; }
    .set-dropdown { position: relative; }
    .set-dropdown-trigger {
      display: inline-flex; align-items: center; gap: 4px;
      background: var(--surface); border: 1px solid var(--border); border-radius: 3px;
      color: var(--text); font-size: 12px; font-family: inherit;
      padding: 7px 12px; cursor: pointer; min-width: 140px; justify-content: space-between;
    }
    .set-dropdown-trigger:hover { border-color: var(--text-dim); }
    .set-dropdown-trigger::after { content: '▾'; margin-left: 6px; color: var(--text-muted); font-size: 10px; }
    .set-dropdown-menu {
      position: absolute; top: calc(100% + 2px); left: 0; z-index: 10;
      min-width: 100%; background: var(--surface); border: 1px solid var(--border); border-radius: 3px;
      box-shadow: 0 8px 24px rgba(0,0,0,.25); display: flex; flex-direction: column; padding: 4px;
    }
    .set-dropdown-item {
      display: flex; justify-content: space-between; align-items: baseline; gap: 8px;
      width: 100%; text-align: left; padding: 7px 8px; font-size: 12px; color: var(--text);
      background: none; border: none; border-radius: 2px; cursor: pointer; font-family: inherit;
    }
    .set-dropdown-item span { font-size: 10px; color: var(--text-dim); }
    .set-dropdown-item:hover { background: var(--surface-hover, rgba(255,255,255,.06)); }
    .set-dropdown-item.active { color: var(--teal); }
    .set-dropdown-item.active span { color: var(--teal); opacity: .8; }
    .audience-select { max-width: none; width: 100%; cursor: pointer; }
    .profile-stats-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
    @media (max-width: 600px) { .profile-stats-cols { grid-template-columns: 1fr; } }
    .profile-edit .set-input { flex: 1; min-width: 0; max-width: 220px; background: var(--surface); border: 1px solid var(--border); color: var(--text); padding: 7px 10px; border-radius: 3px; font-size: 13px; font-family: inherit; }
    .profile-edit .set-input:focus { outline: none; border-color: var(--text-muted); }
    .profile-edit .set-note { font-size: 11px; color: var(--text-dim); line-height: 1.5; margin: 10px 0 0; }
    .profile-edit .settings-stats { margin-top: 10px; }
    .profile-edit .settings-stats .profile-section { margin-bottom: 16px; }
    .profile-edit .settings-stats .profile-section:last-child { margin-bottom: 0; }
    .profile-edit .settings-error { color: var(--red); font-size: 11px; letter-spacing: .04em; min-height: 16px; margin-top: 14px; }
    /* Buttons reuse the app-wide .view-btn; just give them tap room + a danger variant. */
    .profile-edit .set-danger-toggle { background: none; border: none; padding: 0; cursor: pointer; font-family: inherit; display: inline-flex; align-items: center; gap: 6px; }
    .profile-edit .set-danger-toggle:hover { color: var(--text-dim); }
    .profile-edit .set-danger-toggle #dangerCaret { font-size: 8px; }
    .profile-edit .view-btn { min-height: 34px; min-width: 90px; padding: 0 14px; border-radius: 3px; justify-content: center; }
    .profile-edit .view-btn:disabled { opacity: .4; cursor: default; }
    .profile-edit .view-btn.is-danger { border-color: var(--red-bd); color: var(--red); }
    .profile-edit .view-btn.is-danger:hover { background: var(--red-bg); color: var(--red); }
    /* Reminder category list (rendered by settings.js) */
    .profile-edit .settings-empty { font-size: 12px; color: var(--text-dim); }
    .profile-edit .settings-category { margin-bottom: 10px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 3px; background: var(--surface); }
    .profile-edit .settings-category-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
    .profile-edit .settings-category-title { font-size: 13px; color: var(--text); }
    .profile-edit .settings-category-channels { display: flex; align-items: center; gap: 14px; }
    .profile-edit .settings-toggle { display: flex; align-items: center; gap: 6px; cursor: pointer; font-size: 9px; letter-spacing: .08em; text-transform: uppercase; color: var(--text-muted); }
    .profile-edit .settings-toggle input { accent-color: var(--text); cursor: pointer; }
    .profile-edit .settings-toggle-label { user-select: none; }
    .profile-edit .settings-lead-wrap { display: flex; align-items: center; gap: 8px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border-dim); }
    .profile-edit .settings-lead-wrap.settings-no-lead { border-top: none; margin-top: 8px; padding-top: 0; }
    .profile-edit .settings-lead-label { font-size: 9px; color: var(--text-muted); text-transform: uppercase; letter-spacing: .1em; }
    .profile-edit .settings-lead-select { background: var(--card); color: var(--text); border: 1px solid var(--border); border-radius: 3px; padding: 5px 8px; font-family: inherit; font-size: 12px; cursor: pointer; }
    .profile-edit .settings-lead-suffix { font-size: 11px; color: var(--text-dim); }
    .profile-edit .settings-note { font-size: 11px; color: var(--text-dim); margin: 10px 0 0; line-height: 1.5; }
    .profile-edit .settings-pref-row { display: flex; align-items: center; gap: 16px; margin-top: 10px; flex-wrap: wrap; }
    .profile-edit .settings-pref-row label { display: flex; align-items: center; gap: 6px; font-size: 11px; color: var(--text-dim); cursor: pointer; }
    .profile-edit .settings-pref-row select,
    .profile-edit .settings-pref-row .set-dropdown { margin-left: auto; }
    @media (max-width: 600px) { .profile-edit .settings-page-inner { max-width: 100%; } }
    /* Lists */
    .sub-section { margin-bottom: 48px; }
    .sub-section-header { display: flex; align-items: baseline; gap: 10px; margin-bottom: 20px; flex-wrap: wrap; }
    .sub-section-name { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); }
    .sub-section-link { font-size: 10px; color: var(--text-muted); opacity: .45; text-decoration: none; }
    .sub-section-link:hover { opacity: 1; }
    .sub-section-remove { background: none; border: none; cursor: pointer; font-size: 10px; color: var(--text-muted); opacity: .35; margin-left: auto; padding: 0; letter-spacing: .06em; text-transform: uppercase; }
    .sub-section-remove:hover { opacity: 1; }
    .sub-section-featured { border-left: 2px solid var(--amber); padding-left: 14px; margin-left: -16px; }
    .sub-section-curated { border-left: 2px solid var(--slate); padding-left: 14px; margin-left: -16px; }
    .sub-featured-badge { font-size: 9px; letter-spacing: .08em; text-transform: uppercase; color: var(--amber); border: 1px solid var(--amber); padding: 2px 5px; border-radius: 2px; }
    .sub-section-curated .sub-featured-badge { color: var(--slate); border-color: var(--slate); }
    .sub-section-count { font-size: 10px; color: var(--text-muted); opacity: .7; }
    .sub-section-desc { font-size: 12px; color: var(--text-dim); margin-top: 6px; line-height: 1.4; }
    .sub-posters { display: flex; gap: 6px; margin-top: 14px; overflow-x: auto; padding-bottom: 4px; }
    .sub-posters img { height: 90px; width: 60px; object-fit: cover; border-radius: 2px; background: var(--card); }
    @media (max-width: 600px) { .sub-posters img { height: 72px; width: 48px; } }
    .sub-slate-toggle { background: none; border: 1px solid var(--text-muted); color: var(--text-muted); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; padding: 4px 8px; border-radius: 2px; cursor: pointer; margin-left: auto; }
    .sub-slate-toggle:hover { border-color: var(--text); color: var(--text); }
    .sub-slate-toggle.active { border-color: var(--teal); color: var(--teal); }
    .curate-beta-banner { font-size: 13px; color: var(--text-dim); padding: 4px 0 16px; line-height: 1.55; border-bottom: 1px solid var(--border); margin-bottom: 28px; }
    .curate-beta-banner strong { color: var(--text); font-weight: 600; }
    .slate-panel { position: relative; background: var(--card); border: 1px solid var(--border); border-radius: 4px; padding: 20px 24px; margin: 20px 24px 28px; max-width: 960px; }
    .slate-panel-title { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 10px; }
    .slate-panel-body { font-size: 13px; color: var(--text-dim); line-height: 1.55; margin-bottom: 14px; }
    .slate-panel-body p { margin: 0 0 6px; }
    .slate-panel-body p:last-child { margin-bottom: 0; }
    .slate-panel-close { position: absolute; top: 12px; right: 16px; background: none; border: none; color: var(--text-muted); font-size: 18px; line-height: 1; cursor: pointer; padding: 4px; }
    .slate-panel-close:hover { color: var(--text); }
    .slate-panel-toggle { margin: 12px 24px 0; max-width: 960px; }
    .slate-show-info { background: none; border: none; color: var(--text-muted); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; padding: 0; }
    .slate-show-info:hover { color: var(--text); }
    @media (max-width: 600px) { .slate-panel { padding: 16px; margin: 12px 16px 20px; } .slate-panel-toggle { margin: 8px 16px 0; } }

    .marquee-panel { position: relative; background: var(--card); border: 1px solid var(--border); border-radius: 4px; padding: 20px 24px; margin: 20px 24px 28px; max-width: 960px; min-height: 180px; }
    html.marquee-hidden #marqueePanel { display: none !important; }
    html.marquee-hidden #marqueePanelToggle { display: block; }
    html.route-not-home #marqueePanelContainer { display: none !important; }
    /* Marquee panel removed — welcome content now lives on the sectioned homepage */
    #marqueePanelContainer { display: none !important; }
    .marquee-panel-inner { padding: 0; }
    .marquee-panel-img { display: none; }
    .marquee-panel-title { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--amber); margin-bottom: 10px; }
    .marquee-panel-body { font-size: 13px; color: var(--text-dim); line-height: 1.55; margin-bottom: 14px; }
    .marquee-panel-body p { margin: 0 0 8px; }
    .marquee-panel-body p:last-child { margin-bottom: 0; }
    .marquee-panel-body ul { margin: 8px 0 0 18px; padding: 0; }
    .marquee-panel-body li { margin-bottom: 6px; }
    .marquee-panel-close { position: absolute; top: 12px; right: 16px; background: rgba(10,10,10,.6); border: none; color: var(--text-muted); font-size: 18px; line-height: 1; cursor: pointer; padding: 4px 6px; border-radius: 2px; }
    .marquee-panel-close:hover { color: var(--text); }
    .marquee-panel-toggle { margin: 12px 24px 0; max-width: 960px; text-align: right; }
    .marquee-show-info { background: none; border: none; color: var(--text-muted); font-size: 11px; letter-spacing: .06em; text-transform: uppercase; cursor: pointer; padding: 0; }
    .marquee-show-info:hover { color: var(--text); }
    .marquee-panel, .marquee-panel-toggle,
    .slate-panel, .slate-panel-toggle { margin-left: auto; margin-right: auto; }
    @media (max-width: 600px) { .marquee-panel { margin: 12px 16px 20px; flex-direction: column; } .marquee-panel-inner { padding: 16px; } .marquee-panel-img { width: 100%; height: auto; border-right: none; border-bottom: 1px solid var(--border); } .marquee-panel-toggle { margin: 8px 16px 0; } }

    /* Mobile-only scrolling ticker — replaces the full marquee-panel box to save vertical space. */
    .marquee-ticker { display: none; }
    @media (max-width: 600px) {
      html.marquee-hidden #marqueeTicker { display: none !important; }
      #marqueePanel { display: none !important; }
      .marquee-ticker {
        display: flex; align-items: center; position: relative;
        height: 30px; margin: 10px 16px; max-width: 960px;
        background: var(--amber-bg); border: 1px solid var(--amber-bd); border-radius: 4px;
        overflow: hidden;
      }
      .marquee-ticker-track { display: flex; white-space: nowrap; animation: marquee-ticker-scroll 22s linear infinite; }
      .marquee-ticker-text { flex: 0 0 auto; padding-right: 56px; font-size: 12px; color: var(--text); }
      .marquee-ticker-close {
        position: absolute; top: 50%; right: 4px; transform: translateY(-50%); z-index: 1;
        background: linear-gradient(to right, transparent, var(--amber-bg) 40%);
        border: none; color: var(--text-muted); font-size: 15px; line-height: 1;
        cursor: pointer; padding: 4px 6px 4px 20px;
      }
      .marquee-ticker-close:hover { color: var(--text); }
    }
    @media (prefers-reduced-motion: reduce) {
      .marquee-ticker-track { animation: none; }
    }
    @keyframes marquee-ticker-scroll {
      from { transform: translateX(0); }
      to   { transform: translateX(-50%); }
    }

    .curate-beta-banner p { margin: 0 0 8px; }
    .curate-beta-banner p:last-child { margin-bottom: 0; }
    .sub-add-section { margin: 36px 0; padding-top: 24px; border-top: 1px solid var(--border); }
    .sub-add-heading { font-size: 11px; letter-spacing: .1em; text-transform: uppercase; color: var(--text-muted); margin-bottom: 8px; }
    .sub-add-desc { font-size: 12px; color: var(--text-dim); margin-bottom: 12px; line-height: 1.4; }
    .curate-grid { display: flex; gap: 24px; align-items: flex-start; justify-content: center; }
    .curate-col { flex: 1; display: flex; flex-direction: column; gap: 20px; max-width: 400px; align-items: center; }
    .curate-grid .sub-section { margin-bottom: 0; }
    .curate-grid .sub-section-curated,
    .curate-grid .sub-section-featured { margin-left: 0; }

    /* Fixed-size curated list modules */
    .sub-section-curated {
      width: 360px;
      height: 180px;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      box-sizing: border-box;
      padding: 12px 12px 4px;
      transition: height .25s ease, background .15s ease;
      cursor: pointer;
    }
    .sub-section-curated:hover { background: var(--card-hover); }
    .sub-section-curated .curated-details-body { cursor: auto; }
    .sub-section-curated.expanded { height: 480px; }

    .curated-title-row {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      margin-bottom: 0;
      min-height: 36px;
    }
    .curated-title-text {
      flex: 1 1 auto;
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 13px;
      line-height: 1.3;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--text);
      word-break: break-word;
      white-space: normal;
      text-decoration: none;
    }
    .curated-title-text:hover { text-decoration: underline; }
    .curated-view-page {
      color: var(--text-dim);
      text-decoration: none;
      font-size: 11px;
      white-space: nowrap;
    }
    .curated-view-page:hover { text-decoration: underline; }

    .curated-slate-btn {
      width: 20px;
      height: 20px;
      padding: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      line-height: 1;
      flex: 0 0 auto;
    }

    .sub-section-curated .sub-posters {
      flex: 0 0 auto;
      height: 100px;
      overflow: hidden;
      margin-bottom: 12px;
    }
    .sub-section-curated .sub-posters img { height: 100px; width: 67px; object-fit: cover; }

    .sub-section-curated .curated-details {
      flex: 0 0 auto;
      display: flex;
      flex-direction: column;
    }
    .sub-section-curated.expanded .curated-details {
      flex: 1 1 0%;
      overflow: hidden;
      min-height: 0;
    }
    .curated-details-body {
      display: none;
      flex: 1 1 0%;
      flex-direction: column;
      overflow: hidden;
      min-height: 0;
    }
    .sub-section-curated.expanded .curated-details-body { display: flex; }
    .sub-section-curated .curated-desc-inside {
      flex: 0 0 auto;
      margin: 0 0 10px;
    }
    .curated-desc-inside .sub-featured-badge {
      margin-left: 6px;
      vertical-align: middle;
      white-space: nowrap;
    }
    .sub-section-curated .curated-film-list {
      flex: 1 1 0%;
      overflow-y: auto;
      padding-right: 6px;
      padding-bottom: 4px;
      scrollbar-width: thin;
      scrollbar-color: var(--text-muted) transparent;
      min-height: 0;
    }
    .sub-section-curated .curated-film-list::-webkit-scrollbar { width: 8px; }
    .sub-section-curated .curated-film-list::-webkit-scrollbar-track { background: transparent; }
    .sub-section-curated .curated-film-list::-webkit-scrollbar-thumb { background: var(--text-muted); border-radius: 4px; }
    .curated-film-list { display: grid; grid-template-columns: 1fr; gap: 4px; margin-top: 10px; }
    .curated-desc-inside { font-size: 12px; color: var(--text-dim); line-height: 1.45; margin: 10px 0 12px; }
    .curated-label-inside { margin-bottom: 10px; }
    @media (max-width: 900px) {
      .curate-grid { flex-direction: column; align-items: center; }
      .sub-section-curated { width: 340px; height: 190px; }
      .sub-section-curated.expanded { height: 440px; }
      .sub-section-curated .sub-posters { height: 90px; }
      .sub-section-curated .sub-posters img { height: 90px; width: 60px; }
    }
    @media (max-width: 600px) {
      .curate-col { max-width: none; width: 100%; align-items: stretch; }
      .sub-section-curated { width: 100%; height: 160px; padding: 10px 10px 4px; }
      .sub-section-curated.expanded { height: 340px; }
      .curated-title-row { min-height: auto; }
      .curated-title-text { font-size: 12px; }
      .curated-slate-btn { width: 18px; height: 18px; font-size: 12px; }
      .sub-section-curated .sub-posters { height: 70px; margin-bottom: 8px; }
      .sub-section-curated .sub-posters img { height: 70px; width: 47px; }
    }
    .curated-film-link { display: flex; align-items: baseline; gap: 6px; font-size: 12px; color: var(--text-dim); text-decoration: none; line-height: 1.5; }
    .curated-film-link:hover { color: var(--text); text-decoration: underline; }
    .curated-film-rank { color: var(--text-muted); min-width: 22px; text-align: right; }
    .curated-film-title { color: inherit; }
    .curated-film-year { color: var(--text-muted); font-size: 11px; }

    .fp-close {
      position: absolute;
      top: 10px; right: 12px;
      font-size: 13px;
      color: rgba(255,255,255,.2);
      cursor: pointer;
      background: none;
      border: none;
      line-height: 1;
      padding: 2px 4px;
      z-index: 3;
    }
    .fp-close:hover { color: rgba(255,255,255,.5); }
    [data-theme="cream"] .fp-close,
    [data-theme="light"] .fp-close { color: rgba(0,0,0,.2); }
    [data-theme="cream"] .fp-close:hover,
    [data-theme="light"] .fp-close:hover { color: rgba(0,0,0,.5); }

    @media (max-width: 600px) {
      #filmPanel { padding: 10px 12px 0; }
      .tkt { min-height: 500px; }
      .tkt-main { grid-template-columns: 100px 1fr; gap: 14px; padding: 16px 16px 14px; }
      .fp-poster { width: 100px; }
      .fp-title { font-size: 20px; }
      .tkt-stub { padding: 14px 16px 16px; }
      .tkt-stub-row { grid-template-columns: 1fr; gap: 10px; }
      .tkt-datetime { text-align: left; }
      .tkt-time { font-size: 28px; }
    }

    /* Theater panel */
    #theaterPanel {
      max-width: 960px;
      margin: 0 auto;
      padding: 20px 24px 0;
    }
    #theaterPanelInner { position: relative; margin-bottom: 24px; }
    .tp-theater .tkt-main { grid-template-columns: 1fr auto; }
    .tp-theater .fp-meta { font-size: 13px; line-height: 1.6; display: block; }
    .tp-theater .tkt-actions { gap: 10px; }
    .tp-series { margin-top: 14px; margin-bottom: 22px; font-size: 15px; line-height: 1.55; color: var(--text-main); }
    .tp-series-label {
      display: block; font-size: 11px; letter-spacing: .12em; text-transform: uppercase;
      color: var(--text-dim); margin-bottom: 8px;
    }
    .tp-series-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 12px; }
    .tp-series-card { cursor: pointer; transition: transform .15s ease, opacity .15s ease; }
    .tp-series-card:hover { transform: translateY(-3px); opacity: .9; }
    .tp-series-card img { width: 100%; aspect-ratio: 2/3; object-fit: cover; border-radius: 3px; display: block; background: rgba(255,255,255,.06); }
    .tp-series-card-name { font-size: 11px; line-height: 1.25; margin-top: 6px; color: var(--text-main); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

    .tp-highlights-desktop { display: flex; gap: 16px; margin-top: 14px; }
    .tp-highlights-desktop .tp-highlights-section { flex: 1; min-width: 0; }
    .tp-highlights-sep { width: 1px; background: var(--border); flex-shrink: 0; }
    .tp-highlights-mobile { display: none; margin-top: 14px; }

    /* ── SERIES CARDS ─────────────────────────────────────── */
    #seriesPanel {
      max-width: 960px;
      margin: 0 auto;
      padding: 20px 24px 0;
    }
    #seriesPanelInner { position: relative; margin-bottom: 24px; }
    .sp-series .tkt-main {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 22px;
      padding: 22px 22px 18px;
      align-items: start;
    }
    .sp-main { min-width: 0; }
    .sp-headline {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 8px;
      flex-wrap: wrap;
    }
    .sp-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 9px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text-dim);
      background: transparent;
      border: 1px solid var(--text-dim);
      padding: 2px 6px;
      border-radius: 3px;
    }
    .sp-city-badge {
      color: var(--text-main);
      background: rgba(0,0,0,0.04);
      border-color: var(--border);
    }
    .sp-title { font-size: 24px; line-height: 1.2; margin: 0; }
    .sp-films { margin: 18px 0 0; }
    .sp-films-title {
      font-size: 11px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text-dim);
      margin: 0 0 10px;
    }
    .sp-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
      gap: 12px;
    }
    .sp-film {
      cursor: pointer;
      transition: transform .15s ease, opacity .15s ease;
    }
    .sp-film:hover { transform: translateY(-3px); opacity: .9; }
    .sp-film-poster {
      position: relative;
      aspect-ratio: 2/3;
      border-radius: 3px;
      overflow: hidden;
      background: rgba(255,255,255,.06);
    }
    .sp-film-skeleton {
      position: absolute;
      inset: 0;
      z-index: 1;
    }
    .sp-film.is-loaded .sp-film-skeleton { display: none; }
    .sp-film img {
      position: relative;
      z-index: 2;
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      opacity: 0;
      transition: opacity .25s ease;
    }
    .sp-film.is-loaded img { opacity: 1; }
    .sp-film-name {
      font-size: 11px;
      line-height: 1.25;
      margin-top: 6px;
      color: var(--text-main);
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .sp-theaters {
      margin-top: 12px;
      font-size: 13px;
      line-height: 1.5;
      color: var(--text-main);
    }
    .sp-theaters-label {
      display: block;
      font-size: 10px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text-dim);
      margin-bottom: 3px;
    }
    @media (max-width: 600px) {
      #seriesPanel { padding: 10px 12px 0; }
      .sp-title { font-size: 20px; }
      .sp-grid { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
      .tp-series-grid { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
      .tp-highlights-desktop { display: none; }
      .tp-highlights-mobile { display: block; }
    }

    /* ── LIST PANEL ─────────────────────────────────────── */
    #listPanel {
      max-width: 960px;
      margin: 0 auto;
      padding: 20px 24px 0;
    }
    #listPanelInner { position: relative; margin-bottom: 24px; }
    .lp-wrap .tkt-main {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 22px;
      padding: 22px 22px 18px;
      align-items: start;
    }
    .lp-main { min-width: 0; }
    .lp-film-count {
      font-size: 11px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text-dim);
      margin-top: 4px;
    }
    .lp-playing {
      margin: 0 0 18px;
      padding: 14px 16px;
      border: 1px solid var(--border);
      border-radius: 6px;
      background: rgba(0,0,0,0.02);
    }
    .lp-playing-title {
      font-size: 11px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text-dim);
      margin-bottom: 10px;
    }
    .lp-playing-film {
      display: flex;
      align-items: baseline;
      gap: 8px;
      padding: 4px 0;
      font-size: 13px;
      line-height: 1.4;
    }
    .lp-playing-link {
      color: var(--text-main);
      text-decoration: none;
      font-weight: 500;
    }
    .lp-playing-link:hover { text-decoration: underline; }
    .lp-playing-meta {
      color: var(--text-dim);
      font-size: 12px;
    }
    .lp-films { margin: 18px 0 0; }
    .lp-films-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
      gap: 12px;
    }
    .lp-film {
      display: block;
      text-decoration: none;
      color: var(--text-main);
      position: relative;
      transition: transform .15s ease, opacity .15s ease;
    }
    .lp-film:hover { transform: translateY(-3px); opacity: .9; }
    .lp-film img {
      width: 100%;
      aspect-ratio: 2/3;
      object-fit: cover;
      border-radius: 3px;
      background: rgba(255,255,255,.06);
      display: block;
    }
    .lp-film-name {
      font-size: 11px;
      line-height: 1.25;
      margin-top: 6px;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }
    .lp-film-year {
      font-size: 10px;
      color: var(--text-dim);
    }
    .lp-film-badge {
      position: absolute;
      top: 4px;
      right: 4px;
      font-size: 8px;
      letter-spacing: .1em;
      text-transform: uppercase;
      background: var(--accent, #c00);
      color: #fff;
      padding: 2px 5px;
      border-radius: 3px;
    }
    .lp-film-playing img {
      outline: 2px solid var(--accent, #c00);
      outline-offset: -2px;
    }
    .lp-all-films {
      margin-top: 0;
    }
    .lp-all-films summary {
      font-size: 12px;
      color: var(--text-dim);
      cursor: pointer;
      padding: 6px 0;
    }
    .lp-all-films .lp-films-grid {
      padding-top: 12px;
    }
    .lp-empty {
      font-size: 13px;
      color: var(--text-dim);
      margin: 0 0 14px;
    }
    .lp-section-title {
      font-size: 11px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text-dim);
      margin: 0 0 10px;
    }
    .lp-playing-list {
      margin: 0 0 14px;
    }
    .lp-film-list-text {
      display: flex;
      flex-direction: column;
      gap: 2px;
      padding: 10px 0;
    }
    .lp-film-text {
      display: flex;
      align-items: baseline;
      gap: 6px;
      text-decoration: none;
      color: var(--text-main);
      font-size: 13px;
      line-height: 1.5;
      padding: 2px 0;
    }
    .lp-film-text:hover { text-decoration: underline; }
    @media (max-width: 600px) {
      #listPanel { padding: 10px 12px 0; }
      .lp-films-grid { grid-template-columns: repeat(auto-fill, minmax(90px, 1fr)); }
    }

    /* Poster lightbox */
    #posterLightbox {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 200;
      background: rgba(0,0,0,.92);
      align-items: center;
      justify-content: center;
      padding: 20px;
    }
    #posterLightbox.active { display: flex; }
    #posterLightbox img {
      max-width: 90vw;
      max-height: 90vh;
      object-fit: contain;
      border-radius: 4px;
      box-shadow: 0 20px 60px rgba(0,0,0,.5);
    }
    #posterLightbox .lb-close {
      position: absolute;
      top: 12px;
      right: 16px;
      font-size: 36px;
      color: #fff;
      background: transparent;
      border: none;
      cursor: pointer;
      line-height: 1;
      padding: 4px 8px;
    }
    .card-poster[src] { cursor: pointer; }
    .fp-poster img { cursor: pointer; }

    .film-cards { display: flex; flex-direction: column; gap: 1px; }

    .theater-result {
      background: var(--card);
      border-left: 3px solid var(--teal);
      padding: 14px 16px;
      margin-bottom: 12px;
      display: flex;
      align-items: center;
      gap: 12px;
      cursor: pointer;
      transition: background .1s;
    }
    .theater-result:hover { background: var(--card-hover); }
    .theater-result-icon { color: var(--teal); flex-shrink: 0; }
    .theater-result-info { flex: 1; min-width: 0; }
    .theater-result-name { font-family: 'Outfit', 'Inter', 'Helvetica Neue', Arial, sans-serif; font-size: 16px; color: var(--text-main); }
    .theater-result-addr { font-size: 11px; color: var(--text-muted); margin-top: 2px; }
    .theater-result-arrow { color: var(--text-dim); font-size: 18px; }

    .film-card {
      background: var(--card);
      border-left: 3px solid var(--border-dim);
      padding: 12px 16px 12px 14px;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 12px;
      align-items: start;
      transition: background .1s;
      cursor: pointer;
    }
    .film-card:hover           { background: var(--card-hover); }
    .film-card.fmt-35mm        { border-left-color: var(--amber); }
    .film-card.fmt-70mm        { border-left-color: var(--red); }
    .film-card.fmt-16mm        { border-left-color: var(--teal); }
    .film-card.fmt-dcp,
    .film-card.fmt-4k-dcp      { border-left-color: var(--slate); }

    /* poster + info layout */
    .card-left {
      display: flex;
      gap: 10px;
      align-items: flex-start;
      min-width: 0;
    }

    .card-poster {
      width: 56px;
      flex-shrink: 0;
      aspect-ratio: 2/3;
      object-fit: cover;
      border-radius: 2px;
      background: var(--border);
      display: block;
    }

    .card-info { flex: 1; min-width: 0; }

    .card-badges { display: flex; gap: 4px; flex-wrap: wrap; margin-bottom: 5px; }

    .badge {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: .12em;
      text-transform: uppercase;
      padding: 2px 6px;
      border-radius: 2px;
      border: 1px solid;
    }
    .badge-35mm   { background: var(--amber-bg); color: var(--amber); border-color: var(--amber-bd); }
    .badge-70mm   { background: var(--red-bg);   color: var(--red);   border-color: var(--red-bd); }
    .badge-16mm   { background: var(--teal-bg);  color: var(--teal);  border-color: var(--teal-bd); }
    .badge-dcp,
    .badge-4k-dcp { background: var(--slate-bg); color: #7a8899;      border-color: var(--slate-bd); }
    .badge-series { background: rgba(255,255,255,.04); color: var(--text-dim); border-color: rgba(255,255,255,.08); }
    .series-link  { cursor: pointer; }
    .series-link:hover { color: var(--text); border-color: rgba(255,255,255,.2); }
    .badge-special{ background: var(--violet-bg); color: var(--violet-txt); border-color: var(--violet-bd); }
    .badge-sub    { background: var(--amber-bg); color: var(--amber); border-color: var(--amber-bd); cursor: default; }
    .badge-list   { background: var(--slate-bg); color: var(--slate); border-color: var(--slate-bd); text-decoration: none; }
    .badge-list:hover { opacity: .85; }

    .film-title {
      font-family: 'Lora', Georgia, 'Times New Roman', serif;
      font-style: normal;
      font-size: clamp(15px, 1.6vw, 17px);
      font-weight: 400;
      color: var(--text);
      line-height: 1.3;
      margin-bottom: 3px;
    }
    .time-chip-wrap.linked {
      background: var(--amber-bg);
      border-radius: 4px;
      box-shadow: inset 0 0 0 1px var(--amber-bd);
      padding: 2px 4px;
      margin: -2px -4px;
    }
    .time-chip-wrap.linked .time-chip {
      color: var(--amber);
      border-color: transparent;
      background: transparent;
    }

    .film-meta    { font-size: 11px; color: var(--text-dim); letter-spacing: .06em; margin-bottom: 1px; display: flex; flex-wrap: wrap; align-items: center; }
    .film-meta span { white-space: normal; overflow-wrap: break-word; min-width: 0; }
    .film-meta span:not(:last-child)::after { content: '·'; margin: 0 4px; }
    .film-theater { font-size: 11px; color: var(--text-dim); letter-spacing: .08em; text-transform: uppercase; margin-top: 3px; }
    .film-theater a { color: inherit; text-decoration: none; transition: color .1s; }
    .film-theater a:hover { color: var(--text); }
    .film-overview { font-size: 11px; color: var(--text-muted); line-height: 1.5; margin-top: 5px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

    .film-title-link { color: inherit; text-decoration: none; }
    .film-title-link:hover { color: var(--lbxd); transition: color .1s; }

    .special-note { font-size: 10px; color: var(--violet-txt); font-style: italic; margin-top: 4px; }

    /* time chips */
    .card-right { display: flex; flex-direction: column; gap: 3px; align-items: flex-end; padding-top: 1px; flex-shrink: 0; }

    .time-chip {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 11px;
      padding: 4px 11px;
      border: 1px solid var(--border);
      border-radius: 2px;
      color: var(--text-dim);
      display: block;
      transition: all .1s;
      white-space: nowrap;
      letter-spacing: .04em;
    }
    .time-chip:hover      { color: var(--text); border-color: #484848; background: rgba(255,255,255,.04); }
    .time-chip.no-ticket  { opacity: .4; pointer-events: none; }
    .time-chip.special    { color: var(--violet-txt); border-color: var(--violet-bd); }
    .time-chip.special:hover { color: var(--violet-txt); border-color: var(--violet); background: var(--violet-bg); }
    .time-chip.sold-out   { text-decoration: line-through; text-decoration-thickness: 2px; opacity: .6; }
    .time-chip.standby    { color: var(--yellow); border-color: var(--yellow); opacity: .7; }

    .time-chip-wrap { display: inline-flex; align-items: center; }
    .net-savers-chip {
      display: inline-flex; align-items: center; gap: 3px;
      margin-right: 4px; padding: 1px 5px;
      font-size: 10px; line-height: 1.4; color: var(--teal);
      background: rgba(var(--teal-rgb, 78 158 157) ,.10);
      border: 1px solid transparent; border-radius: 8px;
    }
    .net-savers-chip svg { opacity: .85; }

    /* ── CALENDAR (month-grid) view ─────────────────────── */
    .cal-month-nav {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin: 16px 0 10px;
    }
    .cal-month-title {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 11px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--text);
    }
    .cal-nav-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      letter-spacing: .08em;
      padding: 3px 10px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text-dim);
      cursor: pointer;
      border-radius: 2px;
      transition: color .1s, border-color .1s;
    }
    .cal-nav-btn:hover { color: var(--text); border-color: #444; }
    .cal-month-hd {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      gap: 1px;
      margin-bottom: 1px;
    }
    .cal-month-hd-cell {
      font-size: 7px;
      letter-spacing: .12em;
      text-transform: uppercase;
      color: var(--text-muted);
      text-align: center;
      padding: 4px 0;
    }
    .cal-month-body { display: flex; flex-direction: column; gap: 1px; }
    .cal-week-row {
      display: grid;
      grid-template-columns: repeat(7, 1fr);
      gap: 1px;
    }
    .cal-day {
      background: var(--card);
      padding: 7px 8px 6px;
      min-height: 62px;
      cursor: pointer;
      transition: background .1s;
      user-select: none;
    }
    .cal-day.other-month { background: var(--surface); opacity: .35; pointer-events: none; }
    .cal-day.no-shows    { cursor: default; }
    .cal-day:not(.other-month):not(.no-shows):hover { background: var(--card-hover); }
    .cal-day.cal-day-gated { cursor: pointer; }
    .cal-day.cal-day-gated:hover { background: var(--card-hover); }
    .cal-day.selected    { background: var(--surface); box-shadow: inset 0 0 0 1px var(--border); }
    .cal-day-num {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 11px;
      letter-spacing: .04em;
      color: var(--text-dim);
      line-height: 1;
      margin-bottom: 5px;
    }
    .cal-day.is-today .cal-day-num { color: var(--amber); }
    .cal-day-dots { display: flex; flex-wrap: wrap; gap: 2px; margin-bottom: 4px; }
    .cal-day-dot  { width: 5px; height: 5px; border-radius: 50%; }
    .cal-day-count { font-size: 8px; color: var(--text-muted); letter-spacing: .06em; }
    /* expand panel */
    .cal-expand {
      background: var(--surface);
      border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border);
      padding: 10px 14px 12px;
    }
    .cal-expand-hd {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 8px;
    }
    .cal-expand-date {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--text-dim);
    }
    .cal-expand-list-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 8px;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--text-muted);
      background: none;
      border: 1px solid var(--border);
      border-radius: 2px;
      padding: 2px 8px;
      cursor: pointer;
      transition: color .1s, border-color .1s;
    }
    .cal-expand-list-btn:hover { color: var(--text); border-color: var(--text-dim); }
    .cal-expand-film {
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: baseline;
      gap: 16px;
      padding: 5px 0;
      border-bottom: 1px solid var(--border-dim);
      cursor: pointer;
      transition: background .1s;
    }
    .cal-expand-film:last-child { border-bottom: none; }
    .cal-expand-film:hover { background: var(--card-hover); margin: 0 -14px; padding: 5px 14px; }
    .cal-expand-title {
      font-family: 'Lora', Georgia, 'Times New Roman', serif;
      font-size: 12px;
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .cal-expand-right {
      display: flex;
      flex-direction: column;
      align-items: flex-end;
      gap: 3px;
      flex-shrink: 0;
    }
    .cal-expand-theater-row {
      display: flex;
      align-items: center;
      gap: 4px;
      flex-wrap: wrap;
      justify-content: flex-end;
    }
    .cal-expand-theater {
      font-size: 8px;
      color: var(--text-muted);
      letter-spacing: .08em;
      text-transform: uppercase;
    }
    .cal-expand-chip {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      color: var(--text-dim);
      letter-spacing: .04em;
      padding: 1px 5px;
      border: 1px solid var(--border);
      border-radius: 2px;
      white-space: nowrap;
      transition: color .1s, border-color .1s;
    }
    .cal-expand-chip:hover { color: var(--text); border-color: #484848; }

    /* ── MOBILE NAV ─────────────────────────────────────────── */
    .mobile-nav {
      display: none;
      margin-left: auto;
      align-items: center;
      gap: 2px;
    }
    .mobile-icon-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 16px;
      min-width: 44px;
      min-height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
      border: none;
      background: transparent;
      color: var(--text-dim);
      cursor: pointer;
      transition: color .1s;
      letter-spacing: 0;
    }
    .mobile-icon-btn svg {
      width: 20px;
      height: 20px;
      display: block;
    }
    #mobileSearchBtn svg { transform: rotate(45deg); }
    .mobile-icon-btn:hover,
    .mobile-icon-btn.active { color: var(--text); }

    .mobile-view-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      letter-spacing: .06em;
      text-transform: uppercase;
      padding: 5px 7px;
      border: 1px solid var(--border);
      border-radius: 2px;
      background: transparent;
      color: var(--text-dim);
      cursor: pointer;
      line-height: 1;
      transition: color .1s, border-color .1s, background .1s;
    }
    .mobile-view-btn:hover { color: var(--text); border-color: #404040; }
    .mobile-view-btn.active { background: var(--text); color: var(--bg); border-color: var(--text); }

    /* ── MOBILE SEARCH BAR ───────────────────────────────── */
    .mobile-search-bar {
      display: none;
      padding: 0 16px 10px;
      gap: 8px;
      align-items: center;
      background: var(--bg);
    }
    .mobile-search-bar.open { display: flex; }
    .mobile-search-input {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 16px;
      letter-spacing: .06em;
      padding: 0 12px;
      min-height: 44px;
      border: 1px solid var(--border);
      border-radius: 2px;
      background: transparent;
      color: var(--text);
      flex: 1;
      outline: none;
    }
    .mobile-search-input::placeholder { color: var(--text-muted); }
    .mobile-search-input:focus { border-color: var(--text-dim); }
    .mobile-search-clear {
      background: none;
      border: none;
      color: var(--text-muted);
      font-size: 18px;
      min-width: 36px;
      min-height: 44px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
    }
    .mobile-search-clear:hover { color: var(--text); }

    /* ── SETTINGS PANEL ─────────────────────────────────── */
    #settingsPanel {
      max-height: 0;
      overflow: hidden;
      transition: max-height 0.25s ease;
      background: var(--bg);
      border-bottom: 1px solid var(--border);
    }
    #settingsPanel.open { max-height: 700px; }
    .settings-inner { max-width: 960px; margin: 0 auto; padding: 12px 24px 16px; }
    .settings-section { margin-bottom: 10px; }
    .settings-label {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 8px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--text-muted);
      margin-bottom: 6px;
    }
    .settings-divider { height: 1px; background: var(--border); margin: 12px 0; }
    .settings-row {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 8px;
    }
    .settings-row .settings-label { margin-bottom: 0; min-width: 48px; flex-shrink: 0; }
    .settings-row .view-btn { border-radius: 0; margin-left: 0; }
    #settingsPanel .chip,
    #settingsPanel .view-btn {
      border-width: 0.5px;
      min-height: 32px;
      padding: 0 10px;
      font-size: 9px;
    }

    /* ── THEATER STRIP ───────────────────────────────────── */
    #theaterStrip,
    .theater-strip {
      overflow-x: auto;
      scrollbar-width: none;
      border-bottom: 1px solid var(--border-dim);
      transition: max-height 0.22s ease, opacity 0.22s ease;
      max-height: 60px;
    }
    @media (max-width: 600px) {
      /* On mobile the series page uses the existing sticky #theaterStrip,
         which already has hide-on-scroll behavior. Hide the inline strip. */
      .series-view-wrap .theater-strip { display: none; }
    }
    #theaterStrip::-webkit-scrollbar,
    .theater-strip::-webkit-scrollbar { display: none; }
    #theaterStripInner,
    .theater-strip-inner {
      display: flex;
      gap: 4px;
      padding: 8px 16px;
      min-width: max-content;
    }
    #theaterStrip .chip,
    .theater-strip .chip {
      min-height: 32px;
      padding: 0 10px;
      display: inline-flex;
      align-items: center;
      font-size: 9px;
    }

    /* ── HIDE THEATER STRIP ON SCROLL (mobile) ──────────── */
    .filters-hidden #theaterStrip,
    .filters-hidden .series-view-wrap .theater-strip { max-height: 0; opacity: 0; }

    /* ── DAY TABS: centered on desktop when outside filtersBar */
    .day-tabs-inner { max-width: 960px; margin: 0 auto; }

    /* ── DESKTOP: hide mobile-only elements ─────────────── */
    @media (min-width: 601px) {
      .mobile-nav         { display: none !important; }
      .mobile-search-bar  { display: none !important; }
      #mobileFilterDock   { display: none !important; }
      #theaterStrip       { display: none !important; }
      .mobile-about       { display: none !important; }
      .mobile-history-pill { display: none !important; }

      /* Series/Curate page: mirror the marquee filter bar layout */
      .series-view-wrap .theater-strip {
        background: var(--bg);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        border-bottom: 1px solid var(--border);
        overflow-x: hidden;
        max-height: none;
      }
      .series-view-wrap .theater-strip-inner {
        max-width: 960px;
        margin: 0 auto;
        padding: 7px 24px;
        flex-wrap: wrap;
      }
      /* Desktop: reset chips to standard filter-bar size (not mobile strip size) */
      .series-view-wrap .theater-strip .chip {
        min-height: auto;
        padding: 2px 8px;
        font-size: 9px;
      }
      .series-view-wrap .hs-section {
        max-width: 960px;
        margin: 16px auto 0;
        padding: 0 24px;
      }
      .series-view-wrap .hs-grid {
        margin-top: 0;
      }
    }

    /* ── CURATE TABS ──────────────────────────────────────── */
    .curate-tabs {
      display: flex;
      gap: 0;
      max-width: 960px;
      margin: 0 auto;
      padding: 0 24px;
      border-bottom: 1px solid var(--border-dim);
    }
    @media (max-width: 600px) {
      .curate-tabs { padding: 0 16px; }
    }
    .curate-tab-btn {
      background: none;
      border: none;
      border-bottom: 2px solid transparent;
      padding: 10px 16px;
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 10px;
      letter-spacing: .1em;
      text-transform: uppercase;
      color: var(--text-muted);
      cursor: pointer;
      transition: color .1s, border-color .1s;
    }
    .curate-tab-btn:hover { color: var(--text); }
    .curate-tab-btn.active {
      color: var(--text);
      border-bottom-color: var(--text);
    }

    /* ── RESPONSIVE ───────────────────────────────────────── */
    @media (max-width: 600px) {
      body { font-size: 14px; }

      /* Header — compact one-liner */
      .header-inner { padding: 14px 16px 12px; gap: 8px; }
      .site-title   { font-size: 17px; }
      .site-tagline { font-size: 11px; }
      .mobile-icon-btn { font-size: 20px; }
      .header-search-group { display: none; }
      .view-toggle  { display: none; }
      .account-area { display: none; }
      .mobile-account { display: flex; }
      .mobile-nav   { display: flex; gap: 6px; }

      /* Mobile history pill: thumb-accessible back/forward */
      :root { --mobile-history-offset: 0px; }
      .mobile-history-pill {
        position: fixed;
        right: var(--mobile-chrome-offset);
        bottom: calc(var(--mobile-chrome-offset) + var(--mobile-history-offset));
        z-index: 1100;
        display: flex;
        gap: 2px;
        background: var(--card);
        border: 1px solid var(--border);
        border-radius: 26px;
        box-shadow: var(--float-shadow), var(--float-highlight);
        overflow: hidden;
      }
      .mobile-history-btn {
        width: 48px;
        height: 48px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: transparent;
        border: none;
        color: var(--text);
        font-size: 20px;
        line-height: 1;
        cursor: pointer;
        padding: 0;
      }
      .mobile-history-btn:disabled {
        color: var(--text-muted);
        opacity: .4;
        cursor: default;
      }

      /* Mobile filter dock: continuous vertical rectangle above the history pill */
      #mobileFilterDock {
        position: fixed;
        right: var(--mobile-chrome-offset);
        bottom: calc(var(--mobile-chrome-offset) + var(--mobile-history-offset) + var(--mobile-history-size) + var(--mobile-dock-gap) + env(safe-area-inset-bottom));
        z-index: 1200;
        display: flex;
        flex-direction: column;
        background: var(--card);
        border: 1px solid var(--border);
        border-radius: 24px;
        padding: 4px;
        box-shadow: var(--float-shadow), var(--float-highlight);
        gap: 0;
      }
      .mobile-dock-item { position: relative; }
      .mobile-dock-btn {
        width: 40px;
        height: 40px;
        border: none;
        border-radius: 0;
        background: transparent;
        color: var(--text-dim);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        cursor: pointer;
        transition: color .1s, background .1s;
        padding: 0;
      }
      .mobile-dock-btn svg { width: 18px; height: 18px; }
      #mobileDockStar { font-size: 18px; line-height: 1; }
      #mobileDockPower svg { width: 15px; height: 15px; }
      #mobileFilterDock > .mobile-dock-btn:not(:last-child),
      #mobileFilterDock > .mobile-dock-item:not(:last-child) {
        border-bottom: 1px solid var(--border-dim);
      }
      .mobile-dock-btn.active,
      .mobile-dock-btn[aria-expanded="true"] {
        color: var(--text);
        background: var(--hover-bg, rgba(128,128,128,.08));
      }
      .mobile-dock-btn.is-gold   { color: #000; background: var(--gold); }
      .mobile-dock-btn.is-violet { color: #fff; background: var(--violet); }
      .mobile-dock-btn.is-amber  { color: #000; background: var(--amber); }
      .mobile-dock-btn.is-red    { color: #fff; background: var(--red); }
      .mobile-dock-btn.is-teal   { color: #fff; background: var(--teal); }
      .mobile-dock-btn.is-slate  { color: #fff; background: var(--slate); }
      /* Filter popup: anchored dropdown card opening upward, scrollable list */
      .mobile-dock-popup {
        position: absolute;
        right: calc(100% + 8px);
        bottom: 0;
        display: flex;
        flex-direction: column;
        background: var(--card);
        border: 1px solid var(--border);
        border-radius: 8px;
        box-shadow: var(--float-shadow), var(--float-highlight);
        padding: 0;
        width: 210px;
        max-width: calc(100vw - 80px);
        max-height: 60vh;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
      }
      .mobile-dock-popup-section {
        position: sticky;
        top: 0;
        z-index: 1;
        font-size: 8px;
        letter-spacing: .12em;
        text-transform: uppercase;
        color: var(--text-muted);
        padding: 10px 14px 4px;
        background: var(--card);
      }
      .mobile-dock-popup [id$="Items"] {
        display: flex;
        flex-direction: column;
      }
      .mobile-dock-popup .chip {
        display: flex;
        width: 100%;
        min-height: 44px;
        padding: 0 14px;
        font-size: 11px;
        border: none;
        border-bottom: 1px solid var(--border-dim);
        border-radius: 0;
        background: transparent;
      }
      .mobile-dock-popup .chip:last-child { border-bottom: none; }
      .mobile-dock-popup .chip.active { background: var(--text); color: var(--bg); }

      /* Filter bar: hidden on mobile (dock replaces it) */
      #filtersBar   { display: none; }

      /* Chips in settings panel — 44px tap target */
      .chip {
        min-height: 44px;
        padding: 0 12px;
        display: inline-flex;
        align-items: center;
        font-size: 10px;
      }

      /* Day tabs */
      .day-tabs       { margin: 0; max-width: none; }
      .day-tabs-inner { padding: 6px 16px; }
      .day-tab        { min-height: 44px; min-width: 54px; padding: 6px 14px; }
      .day-tab-num    { font-size: 18px; }
      .day-tab-label  { font-size: 8px; }

      /* Main */
      main { padding: 0 16px 80px; }

      /* Film cards */
      .film-card  { grid-template-columns: 1fr; padding: 12px 16px 12px 14px; }
      .card-right {
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        padding-top: 12px;
        border-top: 1px solid var(--border-dim);
        gap: 8px;
      }
      .card-poster { width: 58px; }
      .film-title  { font-size: 15px; }
      .film-meta   { font-size: 11px; }
      .film-theater { font-size: 11px; }
      .badge       { font-size: 9px; padding: 2px 6px; }
      .special-note { font-size: 10px; }

      /* Time chips — 38px target (secondary action) */
      .time-chip {
        min-height: 38px;
        padding: 0 14px;
        display: inline-flex;
        align-items: center;
        font-size: 12px;
      }

      /* Calendar */
      .cal-day { min-height: 48px; padding: 5px 6px 4px; }
      .cal-day-num { font-size: 10px; }
      .cal-expand-film { grid-template-columns: 1fr; gap: 4px; }
      .cal-expand-right { align-items: flex-start; }
    }

    /* ── FOOTER ──────────────────────────────────────────────── */
    .city-footer {
      max-width: 960px;
      margin: 0 auto;
      padding: 20px 24px 32px;
      text-align: center;
      border-top: 1px solid var(--border-dim);
    }

    .updated-at-footer { font-size: 10px; color: var(--text-muted); letter-spacing: .1em; }
    .footer-disclaimers {
      margin-top: 10px;
      font-size: 10px;
      color: var(--text-muted);
      line-height: 1.6;
    }
    .footer-disclaimers a { color: var(--text-muted); text-decoration: underline; }

    @media (max-width: 600px) {
      .page-bottom-pad { padding-bottom: 120px !important; }
    }

    .city-select-wrap {
      position: relative;
      display: inline-block;
      margin-right: 6px;
    }
    .city-dropdown-btn {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      padding: 4px 10px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text-dim);
      cursor: pointer;
      letter-spacing: .1em;
      text-transform: uppercase;
      transition: all .1s;
      border-radius: 2px;
      display: flex;
      align-items: center;
      gap: 6px;
    }
    .city-dropdown-btn:hover { color: var(--text); }
    .city-dropdown-btn .city-caret { font-size: 7px; color: var(--text-muted); }
    .city-dropdown-menu {
      display: none;
      position: absolute;
      top: calc(100% + 3px);
      left: 0;
      min-width: 100%;
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 2px;
      z-index: 500;
      overflow: hidden;
    }
    .city-select-wrap.open .city-dropdown-menu { display: block; }
    .city-dropdown-option {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      letter-spacing: .1em;
      text-transform: uppercase;
      padding: 5px 10px;
      cursor: pointer;
      color: var(--text-dim);
      white-space: nowrap;
    }
    .city-dropdown-option:hover { color: var(--text); background: var(--hover-bg, rgba(128,128,128,.08)); }
    .city-dropdown-option.active { color: var(--text); }

    .city-link {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 9px;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: var(--text-muted);
      text-decoration: none;
      padding: 3px 8px;
      border: 1px solid transparent;
      border-radius: 2px;
      transition: all .1s;
    }
    .city-link:hover  { color: var(--text-dim); border-color: var(--border); }
    .city-link.active { color: var(--text); border-color: var(--border); }

    .city-sep { font-size: 9px; color: var(--text-muted); letter-spacing: .1em; }

    /* Adaptive banner (install / sign-up / notifications) */
    #adaptiveBanner {
      position: fixed;
      left: 0;
      right: 0;
      bottom: 0;
      z-index: 1000;
      background: var(--card);
      border-top: 1px solid var(--border);
      padding: 12px 16px;
      display: none;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      font-size: 13px;
      color: var(--text);
      box-shadow: 0 -4px 20px rgba(0,0,0,0.15);
    }
    #adaptiveBanner.visible { display: flex; }
    #adaptiveBanner .install-banner-text { flex: 1; line-height: 1.4; }
    #adaptiveBanner .install-banner-text small {
      display: block;
      color: var(--text-dim);
      font-size: 11px;
      margin-top: 2px;
    }
    #adaptiveBanner .install-banner-actions {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-shrink: 0;
    }
    #adaptiveBanner button {
      font-family: 'DM Mono', 'SF Mono', 'Monaco', 'Inconsolata', monospace;
      font-size: 12px;
      padding: 8px 12px;
      border-radius: 3px;
      cursor: pointer;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text);
    }
    #adaptiveBanner button.install-banner-primary {
      background: var(--text);
      color: var(--bg);
      border-color: var(--text);
    }
    @media (max-width: 600px) {
      #adaptiveBanner { flex-wrap: wrap; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
      #adaptiveBanner .install-banner-text { width: 100%; }
      #adaptiveBanner .install-banner-actions { margin-left: auto; }
    }
    @media (min-width: 601px) {
      #adaptiveBanner {
        left: auto;
        right: 24px;
        width: 300px;
        bottom: 24px;
        border-top: none;
        border: 1px solid var(--border);
        border-radius: 12px;
        flex-direction: column;
        align-items: stretch;
        box-shadow: 0 8px 30px rgba(0,0,0,0.2);
      }
      #adaptiveBanner .install-banner-text { flex: none; }
      #adaptiveBanner .install-banner-actions { margin-top: 12px; justify-content: flex-end; }
    }

    /* ── Invite-aware header on showtime page ───────────────── */
    .invite-header {
      background: var(--card);
      border: 1px solid var(--border);
      border-left: 4px solid var(--text);
      border-radius: 12px;
      padding: 18px;
      margin: 16px 16px 0;
      display: flex;
      flex-direction: column;
      gap: 14px;
      box-shadow: 0 2px 10px rgba(0,0,0,.08);
    }
    .invite-header-top {
      display: flex;
      flex-wrap: wrap;
      align-items: flex-start;
      gap: 16px;
      justify-content: space-between;
    }
    .invite-header-text {
      flex: 1;
      min-width: 200px;
    }
    .invite-header-who {
      font-size: 13px;
      color: var(--text-muted);
      margin-bottom: 4px;
    }
    .invite-header-film {
      font-size: 22px;
      font-weight: 700;
      color: var(--text);
      line-height: 1.15;
    }
    .invite-header-when {
      font-size: 14px;
      color: var(--text-dim);
      margin-top: 6px;
    }
    .invite-header-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }
    @media (max-width: 600px) {
      .invite-header { margin: 12px 12px 0; padding: 14px; }
      .invite-header-film { font-size: 20px; }
      .invite-header-actions { width: auto; }
      .invite-header-actions .fp-btn { flex: 0 0 auto; min-width: auto; }
    }

/* ── ACTION FEEDBACK TOASTS ────────────────────────────────── */
/* Desktop: stacked stream, top-right. Mobile: single toast above the dock. */
.action-toast-container {
  position: fixed;
  top: 12px;
  right: 12px;
  z-index: 2100;
  display: flex;
  flex-direction: column;
  gap: 8px;
  pointer-events: none;
}
.action-toast {
  display: flex;
  align-items: center;
  gap: 12px;
  background: var(--surface);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 10px 14px;
  font-size: 13px;
  box-shadow: var(--float-shadow);
  cursor: pointer;
  pointer-events: auto;
  opacity: 0;
  transform: translateX(12px);
  transition: opacity .2s ease, transform .2s ease;
  max-width: 340px;
}
.action-toast.action-toast-in { opacity: 1; transform: translateX(0); }
.action-toast.action-toast-out { opacity: 0; transform: translateX(12px); }
.action-toast-msg { flex: 1 1 auto; min-width: 0; }
.action-toast-link {
  flex: 0 0 auto;
  color: var(--amber);
  border: 1px solid var(--amber-bd);
  background: var(--amber-bg);
  border-radius: 4px;
  padding: 4px 10px;
  font-size: 12px;
  text-decoration: none;
  white-space: nowrap;
}
.action-toast-link:hover { text-decoration: underline; }
.action-toast-mobile {
  position: fixed;
  left: 50%;
  right: auto;
  bottom: 76px; /* clears .mobile-dock */
  transform: translate(-50%, 8px);
  z-index: 2100;
  width: max-content;
  max-width: calc(100vw - 32px);
}
.action-toast-mobile.action-toast-in { transform: translate(-50%, 0); }
.action-toast-mobile.action-toast-out { transform: translate(-50%, 8px); }

/* ── ACTION TOAST VARIANTS ────────────────────────────────── */
.action-toast-neutral { border-color: var(--border); }
.action-toast-error { border-color: var(--red-bd); background: var(--red-bg); }


/* ── LOADING SKELETONS ────────────────────────────────────── */
.sk-wrap { padding: 8px 0; }
.sk-line {
  height: 14px;
  width: 88%;
  margin: 12px 0;
  border-radius: 4px;
}
.sk-line.sk-short { width: 55%; }
.sk-line.sk-title { height: 26px; width: 42%; margin-top: 4px; }
.sk-posters { display: flex; gap: 10px; margin-top: 14px; }
.sk-poster { width: 64px; height: 96px; border-radius: 4px; }
.sk-shimmer {
  position: relative;
  overflow: hidden;
  background: var(--text-muted);
  opacity: 0.16;
}
.sk-shimmer::after {
  content: '';
  position: absolute;
  inset: 0;
  transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(128, 128, 128, 0.35), transparent);
  animation: sk-shimmer 1.4s infinite;
}
@keyframes sk-shimmer {
  to { transform: translateX(100%); }
}
@media (prefers-reduced-motion: reduce) {
  .sk-shimmer::after { animation: none; }
}
