/* Hermes semantic theme tokens. A single root state switches every
   component palette without a component-tree redraw. */
:root {
  color-scheme: dark;
  --theme-rgb: 255,255,255;
  --chrome-rgb: 9,9,11;
  --surface-rgb: 20,20,24;
  --app-background: #09090B;
  --app-background-gradient: linear-gradient(180deg,#050507 0%,#08070F 38%,#0B0714 68%,#10091C 100%) fixed;
  --app-surface: #111113;
  --app-raised: #1C1C20;
  --text-primary: #F5F5F7;
  --text-secondary: #9A9AA4;
  --text-secondary-strong: #D8D8DE;
  --text-tertiary: #6E6E78;
  --border: rgba(255,255,255,.12);
  --accent: #3B82F6;
  --accent-rgb: 59,130,246;
  --accent-contrast: #FFFFFF;
  --accent-pressed: #2563EB;
  --chart-grid: rgba(255,255,255,0.06);
  --accent-ink:var(--accent); --danger:#FF8585; --warning:#F5C453; --success:#3DDC84; --status-active:#55D98B; --status-draft:#E6C46D;
  --photo-viewer-backdrop:rgba(0,0,0,.94);
  /* Glass material sampled from ContentStudioGlassBackdrop.darkSurface.
     Keep component geometry independent; these tokens define material only. */
  --hermes-glass-fill: rgba(19,17,23,.8);
  --hermes-glass-highlight: rgba(255,255,255,.018);
  --hermes-glass-accent-wash: rgba(var(--accent-rgb),.025);
  --hermes-glass-border-a: rgba(255,255,255,.07);
  --hermes-glass-border-b: rgba(var(--accent-rgb),.07);
  --hermes-glass-border-c: rgba(var(--theme-rgb),.025);
  --hermes-glass-background:
    linear-gradient(135deg,var(--hermes-glass-highlight),var(--hermes-glass-accent-wash) 48%,transparent 100%) padding-box,
    linear-gradient(var(--hermes-glass-fill),var(--hermes-glass-fill)) padding-box,
    linear-gradient(135deg,var(--hermes-glass-border-a),var(--hermes-glass-border-b) 52%,var(--hermes-glass-border-c)) border-box;
  --hermes-glass-blur: none;
  --hermes-glass-shadow: none;
  /* Dense persistent chrome surface, shared by the app header, tab bar,
     and the fixed Etsy draft action rail. */
  --hermes-chrome-background: linear-gradient(180deg,rgba(var(--chrome-rgb),.95),rgba(var(--chrome-rgb),.92)),var(--hermes-glass-background);
  --hermes-chrome-backdrop: blur(12px) saturate(1.04);
  /* Used only by an upper glass surface nested over another surface. */
  --hermes-glass-elevated-shadow: 0 2px 8px rgba(0,0,0,.16);
}
:root[data-effective-theme="light"],:root[data-theme="light"] {
  color-scheme:light; --theme-rgb:20,22,28; --chrome-rgb:255,255,255; --surface-rgb:255,255,255;
  --app-background:#F3F4F7; --app-background-gradient:linear-gradient(180deg,#F7F8FA 0%,#F1F2F5 100%) fixed;
  --app-surface:#FFFFFF; --app-raised:#F8F9FB;
  --text-primary:#17191F; --text-secondary:#626773; --text-secondary-strong:#30343C; --text-tertiary:#626773;
  --border:rgba(25,30,40,.15); --chart-grid:rgba(25,30,40,.12);
  --hermes-glass-fill:rgba(255,255,255,.76); --hermes-glass-highlight:rgba(255,255,255,.15);
  --hermes-glass-accent-wash:rgba(var(--accent-rgb),.018);
  --hermes-glass-border-a:rgba(25,30,40,.15); --hermes-glass-border-b:rgba(var(--accent-rgb),.16); --hermes-glass-border-c:rgba(25,30,40,.08);
  --hermes-glass-elevated-shadow:0 2px 8px rgba(25,30,40,.08);
  --danger:#B42332; --warning:#855900; --success:#167146; --status-active:#167146; --status-draft:#805900;
  --photo-viewer-backdrop:rgba(243,244,247,.97);
}

* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { height: 100%; overflow-x: hidden; }
/* Polish pass (2026-09-23, item 9): scrolling itself is untouched -
   only the visible OS-drawn scrollbar track/thumb is hidden, on every
   scrollable element in the app (WebKit's ::-webkit-scrollbar can't be
   set once at :root and inherited - each real scroll container, e.g.
   .sheet/.chip-row/the page body, needs the rule to actually apply to
   IT). scrollbar-width:none is the equivalent for Firefox/non-WebKit
   engines. */
* {
  scrollbar-width: none;
  -ms-overflow-style: none;
}
*::-webkit-scrollbar { display: none; width: 0; height: 0; }
body {
  margin: 0;
  /* Polish pass (2026-09-23, item 11): near-black at the top, easing
     into a very restrained deep-purple lower in the page - "black
     first, purple second," never a bright/neon gradient. Fixed
     attachment (not scroll-with-content) so the gradient reads as one
     continuous atmosphere behind the whole app, not a repeating tile
     per screen-height of scroll. */
  background: var(--app-background);
  background: var(--app-background-gradient);
  color: var(--text-primary);
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased;
  overscroll-behavior-y: none;
}
button, input { font-family: inherit; }
button:not(:disabled) { transition: transform 150ms cubic-bezier(.2,.75,.25,1), opacity 150ms ease, filter 150ms ease; }
button:not(:disabled):active { transform: scale(.985); opacity: .9; }
@media (prefers-reduced-motion: reduce) { button:not(:disabled) { transition: opacity 100ms linear; } button:not(:disabled):active { transform:none; } }
img { max-width: 100%; display: block; }

.btn-primary, .btn-secondary {
  min-height: 44px;
  border-radius: 12px;
  font-size: 15px;
  font-weight: 650;
  border: none;
  cursor: pointer;
  padding: 0 18px;
  /* Shared component fix (item 6): neither rule ever set a display
     mode, so a <button> got whatever the browser's default internal
     text alignment happened to be, and an <a> (e.g. "Open Etsy
     Draft", display:inline by default) ignored min-height/centering
     entirely - text sat top-left instead of centered. Flex-centering
     here fixes every real button AND link using these classes at
     once, not just one call site. */
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  text-align: center;
  text-decoration: none;
  box-sizing: border-box;
}
.btn-primary { background: var(--accent); color: var(--accent-contrast); }
.btn-primary:active { background: var(--accent-pressed); }
.btn-primary:disabled { opacity: 0.6; }
.btn-primary.is-success { background: #3DDC84; color: #062012; opacity: 1; }
.btn-secondary { background: rgba(var(--theme-rgb),0.06); color: var(--text-primary); border: 1px solid rgba(var(--theme-rgb),0.10); }
.btn-secondary:disabled { opacity: 0.45; }

/* ---------------- LOGIN ---------------- */
.login-screen {
  min-height: 100vh;
  /* Item 13: 100dvh tracks Safari's real, current visual viewport as
     its address bar/toolbar shows or hides, instead of 100vh's fixed
     (historically largest-viewport) value that can leave content
     clipped or a gap at the bottom as the toolbar animates. Declared
     after the 100vh fallback (never replacing it) for browsers/
     WebViews that don't support dvh yet. */
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 32px 24px calc(32px + env(safe-area-inset-bottom));
  text-align: center;
}
.login-mark { margin-bottom: 18px; }
.login-mark img { border-radius: 16px; }
.login-title { font-size: 22px; font-weight: 700; margin: 0 0 6px; letter-spacing: -0.01em; }
.login-sub { font-size: 14px; color: var(--text-secondary); margin: 0 0 28px; max-width: 280px; }
.login-form { width: 100%; max-width: 320px; display: flex; flex-direction: column; gap: 12px; }
.login-input {
  min-height: 48px;
  border-radius: 12px;
  border: 1px solid rgba(var(--theme-rgb),0.12);
  background: rgba(var(--theme-rgb),0.05);
  color: var(--text-primary);
  font-size: 16px;
  padding: 0 14px;
  text-align: center;
  letter-spacing: 0.02em;
}
.login-input:focus { outline: none; border-color: var(--accent); }
.login-submit { width: 100%; }
.login-error { color:var(--danger); font-size: 13px; margin: 0; }
.login-hint { font-size: 11.5px; color: var(--text-tertiary); max-width: 300px; margin-top: 28px; line-height: 1.5; }

/* ---------------- APP SHELL ---------------- */
.app { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; }
.app-header {
  position: sticky;
  top: 0;
  z-index: 20;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: calc(6px + env(safe-area-inset-top)) 16px 8px;
  background: rgba(var(--chrome-rgb),0.86);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid rgba(var(--theme-rgb),0.06);
}
.app-header-title { font-size: 14px; font-weight: 750; letter-spacing: 0.08em; color: var(--text-primary); }
.avatar-btn {
  width: 40px; height: 40px; border-radius: 999px;
  background: rgba(var(--theme-rgb),0.08); border: 1px solid rgba(var(--theme-rgb),0.12);
  color: var(--text-primary); font-size: 12px; font-weight: 700; letter-spacing: 0.02em;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  position: relative; overflow: visible; padding: 0; isolation: isolate;
}
.avatar-btn::after { content:none; }
.avatar-btn.is-opening-settings { animation: profile-settings-tap 150ms ease-out; }
@keyframes profile-settings-tap { 0% { transform:scale(1); } 38% { transform:scale(.96); } 100% { transform:scale(1); } }
.hermes-avatar-image { position: absolute; inset: 0; width: 100%; height: 100%; display: block; object-fit: cover; object-position: center; border-radius: inherit; }

.app-main {
  flex: 1;
  /* 56pt tab bar + device safe area + a modest content tail. */
  padding: 16px 18px calc(84px + env(safe-area-inset-bottom));
  max-width: 560px;
  width: 100%;
  margin: 0 auto;
}
.view { display: none; }
.view.is-active { display: block; }
.view.is-active.is-entering { animation: hermes-view-enter 210ms cubic-bezier(.2,.75,.25,1) both; }
.view.is-active.is-entering.enter-from-forward { --hermes-enter-x: 7px; }
.view.is-active.is-entering.enter-from-back { --hermes-enter-x: -7px; }
@keyframes hermes-view-enter { from { opacity: .82; transform: translate3d(var(--hermes-enter-x,0),0,0); } to { opacity: 1; transform: translate3d(0,0,0); } }
@media (prefers-reduced-motion:reduce) { .view.is-active.is-entering { animation:none !important; } }
body.animations-disabled .view.is-active.is-entering { animation:none !important; }

.section-block { margin-bottom: 32px; }
.home-insights-block { margin-top: 22px; margin-bottom: 27px; }
.home-insights-block .section-label-row { margin-bottom: 9px; }
.insights-view-link { border:0; padding:4px 0 4px 8px; background:transparent; color:var(--accent-ink); font:inherit; font-size:12px; font-weight:650; }
.home-insights-card { display:flex; flex-direction:column; gap:8px; }
.home-insights-count { color:var(--text-secondary); font-size:12px; font-weight:600; margin:0 1px 1px; }
.home-insights-card .insight-card { padding:11px 12px; }
.home-insights-card .insight-card-head { gap:9px; }
.home-insights-card .insight-thumb { width:36px; height:44px; border-radius:7px; }
.home-insights-card .insight-confidence { display:none; }
.home-insights-card .insight-metrics { margin:5px 0 0 45px; }
.home-insights-card .insight-compact-reason { margin:4px 0 0 45px; }
.home-insights-card .insight-action { margin:7px 0 0 45px; }
.insights-home-empty,.insights-group-empty { margin:4px 0; color:var(--text-secondary); font-size:13px; line-height:1.45; }
.insights-keep-running-count { color:var(--text-secondary); font-size:12px; padding:3px 2px 0; }
.insights-title-row { display:flex; align-items:center; justify-content:space-between; margin:2px 0 18px; }
.insights-title-row .view-header-plain { margin:2px 0 0; }
.insights-refresh-btn { width:40px; height:40px; border-radius:50%; border:1px solid var(--border); background:rgba(var(--theme-rgb),.045); color:var(--text-primary); font-size:22px; }
.insights-section { margin:0 0 25px; }
.insights-section > .section-label { display:block; margin:0 1px 9px; }
.insights-list { display:flex; flex-direction:column; gap:9px; }
.insight-card { min-width:0; padding:14px; border:1px solid rgba(var(--theme-rgb),.085); border-radius:15px; background:rgba(var(--theme-rgb),.035); transition:transform .16s cubic-bezier(.2,.75,.25,1),border-color .18s ease,background-color .18s ease; }
.insight-card:active { transform:scale(.99); border-color:rgba(var(--accent-rgb),.22); }
.insight-card-head { display:flex; align-items:center; gap:11px; min-width:0; }
.insight-thumb { width:46px; height:56px; border-radius:9px; object-fit:cover; background:rgba(var(--theme-rgb),.07); flex:0 0 auto; }
.insight-card-title { min-width:0; flex:1; display:flex; flex-direction:column; gap:3px; }
.insight-card-title { padding:0; border:0; background:none; color:inherit; font:inherit; text-align:left; cursor:pointer; }
.insight-card-title strong { color:var(--text-primary); font-size:14px; font-weight:680; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.insight-diagnosis { color:var(--accent-ink); font-size:10px; font-weight:750; letter-spacing:.08em; }
.insight-confidence { color:var(--text-tertiary); font-size:9px; font-weight:650; letter-spacing:.035em; text-align:right; flex:0 0 auto; }
.insight-metrics { color:var(--text-secondary-strong); font-size:11.5px; line-height:1.45; margin:9px 0 0; }
.insight-compact-reason { color:var(--text-secondary); font-size:12px; line-height:1.45; margin:6px 0 0; }
.insight-detail { border-top:1px solid rgba(var(--theme-rgb),.07); margin-top:10px; padding-top:9px; color:var(--text-secondary); font-size:12px; line-height:1.5; }
.insight-detail summary { color:var(--text-secondary-strong); cursor:pointer; font-weight:600; }
.insight-detail p { margin:8px 0 0; }
.insight-recommendation strong { color:var(--text-primary); font-size:10px; letter-spacing:.07em; text-transform:uppercase; }
.insight-baseline { color:var(--text-tertiary); font-size:10.5px; }
.insight-action { display:inline-flex; align-items:center; gap:5px; margin-top:10px; padding:0; border:0; background:none; color:var(--accent-ink); font:inherit; font-size:12px; font-weight:700; }
.insight-action span { font-size:17px; line-height:12px; }
.insight-track-row { margin-top:12px; padding-top:10px; border-top:1px solid rgba(var(--theme-rgb),.07); }
.insight-track-row > label { display:block; margin-bottom:6px; color:var(--text-secondary-strong); font-size:11px; font-weight:650; }
.insight-track-row > div { display:flex; gap:7px; }
.insight-track-input { min-width:0; flex:1; height:36px; padding:0 9px; border:1px solid var(--border); border-radius:9px; background:rgba(var(--theme-rgb),.035); color:var(--text-primary); font:inherit; font-size:12px; }
.insight-track-button { height:36px; padding:0 12px; border:0; border-radius:9px; background:var(--accent); color:var(--accent-contrast); font:inherit; font-size:12px; font-weight:700; }
.insight-track-status { display:block; margin-top:5px; color:var(--text-secondary); font-size:10px; }
.insight-result { padding:12px 13px; border:1px solid rgba(var(--theme-rgb),.08); border-radius:13px; background:rgba(var(--theme-rgb),.03); display:flex; flex-direction:column; gap:4px; }
.insight-result strong { color:var(--text-primary); font-size:13px; }
.insight-result span { color:var(--text-secondary); font-size:11px; }
.insight-result p { margin:3px 0 0; color:var(--text-tertiary); font-size:11px; line-height:1.4; }
.insights-data-note { margin:0 1px 24px; color:var(--text-tertiary); font-size:11px; line-height:1.45; }
.insights-empty { display:flex; flex-direction:column; align-items:flex-start; gap:8px; padding:16px; border:1px solid var(--border); border-radius:15px; background:rgba(var(--theme-rgb),.035); color:var(--text-secondary); font-size:13px; }
.insights-empty strong { color:var(--text-primary); }
.insights-loading { min-height:84px; display:flex; align-items:center; justify-content:center; gap:9px; color:var(--text-secondary); font-size:12px; }
.insights-spinner { width:15px; height:15px; border:2px solid rgba(var(--theme-rgb),.14); border-top-color:var(--accent); border-radius:50%; animation:insights-spin .8s linear infinite; }
@keyframes insights-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .insights-spinner { animation:none; border-color:var(--accent); } }
.insights-refresh-btn.is-refreshing { animation:insights-spin .8s linear infinite; color:var(--accent-ink); }

/* Small Analytics entry and read-only Opportunity Engine views. These use
   Hermes' existing surfaces, type scale, borders and dynamic accent token. */
.opportunity-entry { width:100%; min-height:58px; display:flex; align-items:center; justify-content:space-between; gap:12px; margin:1px 0 17px; padding:10px 13px; border:1px solid rgba(var(--theme-rgb),.085); border-radius:14px; background:rgba(var(--theme-rgb),.035); color:var(--text-primary); text-align:left; font:inherit; transition:background-color .18s ease,border-color .18s ease,transform .16s ease; }
.opportunity-entry:active { transform:scale(.99); border-color:rgba(var(--accent-rgb),.25); }
.opportunity-entry-copy { min-width:0; display:flex; flex-direction:column; gap:4px; }
.opportunity-entry-summary { overflow:hidden; color:var(--text-secondary); font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
.opportunity-entry-chevron { color:var(--accent-ink); font-size:24px; line-height:1; }
.opportunity-page-title { margin:9px 0 3px; }
.opportunity-page-note { margin:0 0 18px; color:var(--text-secondary); font-size:12px; line-height:1.4; }
.opportunity-summary { display:flex; align-items:baseline; gap:16px; margin:0 1px 18px; padding:8px 0; border-top:1px solid rgba(var(--theme-rgb),.07); border-bottom:1px solid rgba(var(--theme-rgb),.07); color:var(--text-tertiary); font-size:9px; font-weight:700; letter-spacing:.055em; }
.opportunity-summary span { white-space:nowrap; }
.opportunity-summary strong { margin-right:3px; color:var(--text-secondary); font-size:14px; font-weight:680; letter-spacing:0; }
.opportunity-summary-actionable { color:var(--accent-ink); }
.opportunity-summary-actionable strong { color:var(--accent-ink); font-size:16px; }
.opportunity-summary-muted { color:var(--text-tertiary); }
.opportunity-summary-muted strong { color:var(--text-secondary); }
.opportunity-section { margin:0 0 21px; }
.opportunity-section > .section-label { display:block; margin:0 1px 9px; }
.opportunity-list { display:flex; flex-direction:column; gap:8px; }
.opportunity-item { width:100%; min-width:0; display:flex; align-items:center; gap:11px; padding:11px 12px; border:1px solid rgba(var(--theme-rgb),.085); border-radius:15px; background:rgba(var(--theme-rgb),.035); color:var(--text-primary); text-align:left; font:inherit; transition:transform .16s ease,border-color .18s ease; }
.opportunity-item:active { transform:scale(.992); border-color:rgba(var(--accent-rgb),.25); }
.opportunity-thumb { width:46px; height:56px; flex:0 0 auto; border-radius:8px; object-fit:cover; background:rgba(var(--theme-rgb),.07); }
.opportunity-thumb-empty { border:1px solid rgba(var(--theme-rgb),.08); }
.opportunity-item-copy { min-width:0; flex:1; display:flex; flex-direction:column; align-items:flex-start; gap:3px; }
.opportunity-item-title { width:100%; display:-webkit-box; overflow:hidden; color:var(--text-primary); font-size:13px; font-weight:680; line-height:1.3; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.opportunity-status { color:var(--accent-ink); font-size:9px; font-weight:750; letter-spacing:.075em; }
.opportunity-status.is-actionable { color:var(--accent-ink); }
.opportunity-item-status-row { width:100%; display:flex; align-items:baseline; justify-content:space-between; gap:8px; }
.opportunity-confidence { color:var(--text-tertiary); font-size:9px; font-weight:550; letter-spacing:0; text-transform:lowercase; white-space:nowrap; }
.opportunity-item-metrics { color:var(--text-secondary-strong); font-size:10px; line-height:1.4; }
.opportunity-item-what { margin-top:2px; color:var(--text-tertiary); font-size:8px; font-weight:750; letter-spacing:.07em; }
.opportunity-item-action { width:100%; display:flex; align-items:center; justify-content:space-between; gap:7px; color:var(--accent-ink); font-size:11px; font-weight:680; line-height:1.3; }
.opportunity-item-action i { flex:0 0 auto; font-size:18px; font-style:normal; line-height:13px; }
.opportunity-learning-row { width:100%; min-height:44px; display:flex; align-items:center; justify-content:space-between; margin:1px 0 0; padding:8px 2px; border:0; border-top:1px solid rgba(var(--theme-rgb),.07); background:none; color:var(--text-secondary); text-align:left; font:inherit; font-size:12px; }
.opportunity-learning-row span:last-child { color:var(--accent-ink); font-size:21px; }
.opportunity-updated { margin:12px 1px 0; color:var(--text-tertiary); font-size:10px; }
.opportunity-detail { min-width:0; padding-bottom:12px; }
.opportunity-detail-status { margin:6px 1px 6px; color:var(--accent-ink); font-size:10px; font-weight:750; letter-spacing:.08em; }
.opportunity-detail-identity { display:flex; align-items:center; gap:12px; margin-bottom:13px; }
.opportunity-detail-identity .opportunity-thumb { width:57px; height:68px; border-radius:9px; }
.opportunity-detail-heading { min-width:0; display:flex; flex-direction:column; align-items:flex-start; gap:5px; }
.opportunity-detail-heading h1 { max-width:100%; display:-webkit-box; overflow:hidden; margin:0; color:var(--text-primary); font-size:17px; font-weight:700; line-height:1.25; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.opportunity-detail-age { color:var(--text-tertiary); font-size:11px; }
.opportunity-detail-section { margin:0 0 17px; }
.opportunity-detail-section > .section-label { display:block; margin-bottom:8px; }
.opportunity-detail-section p { margin:0; color:var(--text-secondary); font-size:12px; line-height:1.5; }
.opportunity-economy-row { min-height:34px; display:flex; align-items:center; justify-content:space-between; gap:12px; border-bottom:1px solid rgba(var(--theme-rgb),.055); color:var(--text-secondary); font-size:11px; }
.opportunity-economy-row strong { flex:0 0 auto; color:var(--text-primary); font-size:11px; font-weight:650; }
.opportunity-estimate-note { margin-top:7px !important; color:var(--text-tertiary) !important; font-size:10px !important; }
.opportunity-do { padding:14px; border:1px solid rgba(var(--accent-rgb),.16); border-radius:13px; background:rgba(var(--accent-rgb),.045); }
.opportunity-do p { color:var(--text-primary); }
.opportunity-action-title { display:block; margin:0 0 4px; color:var(--text-primary); font-size:15px; font-weight:700; line-height:1.35; }
.opportunity-action-limit { display:flex; flex-direction:column; align-items:flex-start; gap:2px; margin-top:10px; padding-top:9px; border-top:1px solid rgba(var(--accent-rgb),.13); color:var(--text-secondary); font-size:9px; font-weight:720; letter-spacing:.055em; }
.opportunity-action-limit strong { color:var(--accent-ink); font-size:27px; font-weight:760; letter-spacing:-.025em; line-height:1.1; white-space:nowrap; }
.opportunity-action-footnote { display:block; margin-top:7px; color:var(--text-tertiary); font-size:10px; line-height:1.4; }
.opportunity-key-numbers { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); overflow:hidden; border:1px solid rgba(var(--theme-rgb),.07); border-radius:12px; background:rgba(var(--theme-rgb),.025); }
.opportunity-key-number { min-width:0; min-height:48px; display:flex; flex-direction:column; justify-content:center; gap:3px; padding:7px 10px; border-bottom:1px solid rgba(var(--theme-rgb),.055); color:var(--text-tertiary); font-size:9px; }
.opportunity-key-number:nth-child(odd) { border-right:1px solid rgba(var(--theme-rgb),.055); }
.opportunity-key-number:nth-last-child(-n+2) { border-bottom:0; }
.opportunity-key-number strong { overflow:hidden; color:var(--text-primary); font-size:12px; font-weight:680; text-overflow:ellipsis; white-space:nowrap; }
.opportunity-key-number.is-emphasized strong { color:var(--accent-ink); }
.opportunity-estimate-note { margin-top:7px !important; }
.opportunity-detail-signal { display:flex; flex-wrap:wrap; gap:6px 13px; margin-top:9px; color:var(--text-tertiary); font-size:10px; }
.opportunity-detail-signal strong { color:var(--text-secondary-strong); font-weight:650; }
.opportunity-calculation { overflow:hidden; border-top:1px solid rgba(var(--theme-rgb),.07); border-bottom:1px solid rgba(var(--theme-rgb),.07); }
.opportunity-calculation-toggle { width:100%; min-height:43px; display:flex; align-items:center; justify-content:space-between; padding:0 1px; border:0; background:none; color:var(--text-secondary-strong); text-align:left; font:inherit; font-size:10px; font-weight:720; letter-spacing:.07em; }
.opportunity-calculation-chevron { color:var(--accent-ink); font-size:19px; transition:transform .2s ease; }
.opportunity-calculation-toggle[aria-expanded="true"] .opportunity-calculation-chevron { transform:rotate(90deg); }
.opportunity-calculation-panel { display:grid; grid-template-rows:0fr; opacity:0; transition:grid-template-rows .22s ease,opacity .18s ease; }
.opportunity-calculation-panel.is-open { grid-template-rows:1fr; opacity:1; }
.opportunity-calculation-inner { min-height:0; overflow:hidden; }
.opportunity-calculation-inner > .opportunity-economy-row:first-child { border-top:1px solid rgba(var(--theme-rgb),.05); }
@media (prefers-reduced-motion: reduce) {
  .opportunity-calculation-panel, .opportunity-calculation-chevron { transition:none; }
}
@media (max-width:360px) {
  .opportunity-summary { gap:8px; font-size:8px; }
  .opportunity-summary strong { font-size:13px; }
  .opportunity-summary-actionable strong { font-size:15px; }
  .opportunity-item { padding:10px; gap:9px; }
  .opportunity-do { padding:12px; }
  .opportunity-action-limit strong { font-size:25px; }
}

.insights-ticker-shell { margin:-7px 0 23px; overflow:hidden; -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%); mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%); }
.insights-ticker-viewport { overflow:hidden; touch-action:pan-y; user-select:none; }
.insights-ticker-track { display:flex; width:max-content; transform:translate3d(0,0,0); will-change:transform; }
.insights-ticker-item { position:relative; flex:0 0 auto; width:min(73vw,278px); min-height:55px; display:flex; align-items:center; gap:9px; padding:7px 15px 7px 7px; border:0; background:transparent; color:var(--text-primary); text-align:left; font:inherit; }
.insights-ticker-item img { width:34px; height:40px; flex:0 0 auto; border-radius:6px; object-fit:cover; background:rgba(var(--theme-rgb),.08); }
.insights-ticker-copy { min-width:0; display:flex; flex:1; flex-direction:column; gap:3px; }
.insights-ticker-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-primary); font-size:11px; font-weight:700; letter-spacing:.015em; }
.insights-ticker-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-secondary); font-size:10px; font-weight:550; }
.insights-ticker-copy small.is-positive { color:var(--accent-ink); }
.insights-ticker-copy small.is-negative { color:var(--text-secondary-strong); }
.insights-ticker-item i { position:absolute; right:1px; top:50%; width:1px; height:27px; transform:translateY(-50%); background:rgba(var(--theme-rgb),.12); }
.home-insights-card { position:relative; }
.home-insight-preview { width:100%; min-height:72px; display:flex; align-items:center; gap:11px; padding:10px 12px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:15px; background:rgba(var(--theme-rgb),.035); color:var(--text-primary); text-align:left; font:inherit; animation:home-insight-arrive .28s ease-out both; touch-action:pan-y; }
.home-insight-preview:active { transform:scale(.99); }
.home-insight-preview-thumb { width:42px; height:52px; flex:0 0 auto; border-radius:8px; object-fit:cover; background:rgba(var(--theme-rgb),.08); }
.home-insight-preview-content { min-width:0; display:flex; flex:1; flex-direction:column; gap:3px; }
.home-insight-preview-diagnosis { color:var(--accent-ink); font-size:9px; font-weight:750; letter-spacing:.08em; }
.home-insight-preview-content strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:13px; font-weight:700; }
.home-insight-preview-observation { display:none; }
.home-insight-preview-metrics { color:var(--text-secondary-strong); font-size:10px; }
.home-insight-preview-action { display:flex; align-items:center; gap:4px; margin-top:2px; color:var(--accent-ink); font-size:10px; font-weight:700; }
.home-insight-preview-action b { font-size:15px; line-height:10px; }
.home-insight-pagination { display:flex; justify-content:center; align-items:center; gap:6px; height:16px; margin-top:5px; }
.home-insight-page-dot { width:5px; height:5px; padding:0; border:0; border-radius:50%; background:rgba(var(--theme-rgb),.24); }
.home-insight-page-dot.is-active { width:14px; border-radius:999px; background:var(--accent); transition:width .22s ease,background-color .22s ease; }
.home-insights-card .insights-home-empty { margin:0; }
@keyframes home-insight-arrive { from { opacity:.62; transform:translateX(5px); } to { opacity:1; transform:translateX(0); } }
@media (prefers-reduced-motion:reduce) { .home-insight-preview { animation:none; } .home-insight-page-dot.is-active { transition:none; } }
.poster-insight-page { position:fixed; inset:0; z-index:1200; display:none; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; background:var(--app-background); color:var(--text-primary); opacity:0; transform:translateX(8px); transition:opacity .19s ease,transform .19s ease; }
.poster-insight-page.is-open { opacity:1; transform:translateX(0); }
.poster-insight-page.is-closing { opacity:0; transform:translateX(8px); }
.poster-insight-sheet { width:min(100%,560px); min-height:100%; box-sizing:border-box; margin:0 auto; padding:calc(env(safe-area-inset-top) + 10px) 20px calc(env(safe-area-inset-bottom) + 30px); background:var(--app-background); color:var(--text-primary); }
.poster-insight-back { display:flex; align-items:center; gap:5px; min-height:42px; margin:0 0 7px -8px; padding:0 8px; border:0; background:none; color:var(--accent-ink); font:600 14px/1 var(--font-family); }
.poster-insight-eyebrow { display:block; margin:2px 0 13px; color:var(--text-secondary); font-size:10px; font-weight:750; letter-spacing:.12em; }
.poster-insight-heading { display:flex; align-items:center; gap:13px; min-width:0; margin-bottom:15px; }
.poster-insight-heading img { width:62px; height:72px; flex:0 0 auto; border-radius:10px; object-fit:cover; background:var(--surface-secondary); }
.poster-insight-heading-copy { display:block; min-width:0; flex:1; }
.poster-insight-heading h1 { display:-webkit-box; margin:4px 0 4px; overflow:hidden; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow-wrap:anywhere; font-size:19px; line-height:1.2; }
.poster-insight-meta { color:var(--text-secondary); font-size:10px; }
.poster-insight-metrics { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0 0 16px; }
.poster-insight-metrics > div { display:flex; min-height:60px; min-width:0; flex-direction:column; justify-content:center; gap:5px; padding:9px 10px; border:1px solid rgba(var(--theme-rgb),.08); border-radius:12px; background:var(--surface-raised); }
.poster-insight-metrics small,.poster-insight-section>small { color:var(--text-secondary); font-size:9px; font-weight:750; letter-spacing:.09em; text-transform:uppercase; }
.poster-insight-metrics strong { overflow-wrap:anywhere; font-size:clamp(12px,4vw,15px); font-variant-numeric:tabular-nums; }
.poster-insight-section { margin:11px 0; padding:13px 14px; border:1px solid rgba(var(--theme-rgb),.08); border-radius:14px; background:var(--surface-raised); }
.poster-insight-section p { margin:7px 0 0; color:var(--text-primary); font-size:13px; line-height:1.45; }
.poster-insight-why { margin:12px 2px 0; color:var(--text-secondary); font-size:12px; }
.poster-insight-why summary { min-height:38px; display:flex; align-items:center; color:var(--text-secondary-strong); cursor:pointer; }
.poster-insight-why p { line-height:1.45; }
@media (prefers-reduced-motion:reduce) { .poster-insight-page,.insight-card,.editor-section-toggle,.file-card,.create-orientation-choice button { transition:none; } }
.section-label { font-size: 11.5px; font-weight: 750; letter-spacing: 0.09em; color: var(--text-secondary); }
.section-label-row { display: flex; align-items: center; justify-content: space-between; margin-bottom: 4px; }

/* ---------------- TODAY ---------------- */
.today-content { margin-top: 10px; }
.today-revenue { font-size: 40px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.05; }
.today-revenue-label { font-size: 12.5px; color: var(--text-secondary); margin-top: 2px; }
.today-secondary-row {
  display: flex; align-items: center; gap: 16px;
  margin-top: 14px; font-size: 14px; font-weight: 600; color: var(--text-secondary-strong);
}
.today-favorites { color:var(--success); }
.today-skeleton {
  height: 54px; border-radius: 12px; margin-top: 10px;
  background: linear-gradient(90deg, rgba(var(--theme-rgb),0.04) 25%, rgba(var(--theme-rgb),0.08) 37%, rgba(var(--theme-rgb),0.04) 63%);
  background-size: 400% 100%;
  animation: hermesShimmer 1.4s ease infinite;
}
@keyframes hermesShimmer { 0% { background-position: 100% 0; } 100% { background-position: 0 0; } }
.listings-loading-skeleton { display:flex; flex-direction:column; gap:0; margin-top:8px; }
.listing-loading-row { position:relative; overflow:hidden; display:flex; align-items:center; gap:12px; box-sizing:border-box; width:100%; height:66px; min-height:66px; margin:0 0 11px; padding:10px 12px; border:1px solid rgba(var(--theme-rgb),.035); border-top-color:rgba(var(--theme-rgb),.075); border-radius:14px; background:var(--hermes-glass-background); }
.listing-loading-row::before { content:""; position:absolute; z-index:1; top:-28%; bottom:-28%; left:-24%; width:20%; opacity:0; transform:translateX(-180%) skewX(-18deg); background:linear-gradient(90deg,transparent,rgba(245,241,255,.075),rgba(255,255,255,.105),rgba(210,196,255,.045),transparent); pointer-events:none; }
.listing-loading-row::after { content:""; position:absolute; inset:0; z-index:0; border-radius:inherit; background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(var(--accent-rgb),.008) 48%,transparent 100%); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); pointer-events:none; }
.listing-loading-row > * { position:relative; z-index:2; }
.listings-loading-skeleton.is-reflecting .listing-loading-row::before { animation:listingGlassReflection 1.8s ease-in-out infinite; }
@keyframes listingGlassReflection { 0% { opacity:0; transform:translateX(-180%) skewX(-18deg); } 14% { opacity:.62; } 78% { opacity:.48; } 100% { opacity:0; transform:translateX(680%) skewX(-18deg); } }
@media (prefers-reduced-motion:reduce) { .listings-loading-skeleton.is-reflecting .listing-loading-row::before { animation:none; opacity:0; } }
body.animations-disabled .listings-loading-skeleton.is-reflecting .listing-loading-row::before { animation:none; opacity:0; }
.listing-loading-thumb,.listing-loading-copy i { display:block; background:rgba(var(--theme-rgb),.055); }
.listing-loading-thumb { width:44px; height:44px; flex:0 0 44px; border-radius:10px; }
.listing-loading-copy { display:flex; flex:1; min-width:0; min-height:33px; flex-direction:column; justify-content:center; gap:4px; }
.listing-loading-copy i { width:72%; height:9px; border-radius:5px; }
.listing-loading-copy i:last-child { width:43%; height:7px; opacity:.7; }
.listing-loading-pill { display:block; position:relative; width:86px; height:19px; flex:0 0 86px; background:transparent; }
.listing-loading-pill::after { content:""; display:block; width:47px; height:19px; margin-left:auto; border-radius:10px; background:rgba(var(--theme-rgb),.055); }
.listing-loading-chevron { width:10px; flex:0 0 10px; height:18px; border-radius:4px; background:rgba(var(--theme-rgb),.055); }
.updated-pill { font-size: 11.5px; color: var(--text-tertiary); margin-top: 10px; }

/* ---------------- ACTIVITY FEED ---------------- */
.activity-progress-track { height: 4px; border-radius: 999px; background: rgba(var(--theme-rgb),0.08); margin-top: 6px; overflow: hidden; }
.activity-progress-fill { height: 100%; background: var(--accent); border-radius: 999px; transition: width 0.2s ease; }

.empty-hint { font-size: 13px; color: var(--text-tertiary); margin-top: 10px; }
.analytics-error-state { text-align: center; padding: 40px 20px; }
.analytics-error-state .empty-hint { margin-bottom: 14px; }
.analytics-error-state .btn-secondary { display: inline-flex; min-width: 120px; }

/* ---------------- COMING SOON STUBS ---------------- */
.coming-soon-card {
  margin-top: 12px;
  padding: 28px 20px;
  border-radius: 16px;
  border: 1px dashed rgba(var(--theme-rgb),0.14);
  text-align: center;
}
.coming-soon-icon {
  width: 40px; height: 40px; border-radius: 999px;
  background: rgba(var(--accent-rgb),0.15); color:var(--accent-ink);
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; font-weight: 700; margin: 0 auto 12px;
}
.coming-soon-title { font-size: 15px; font-weight: 700; margin: 0 0 6px; }
.coming-soon-body { font-size: 13px; color: var(--text-secondary); line-height: 1.5; margin: 0; }

/* ---------------- BOTTOM NAV ----------------
   A real 5-column grid spanning the full viewport width - not flex,
   deliberately: with flex, an unlabeled center item can end up visually
   off-center relative to its four labeled siblings once font-rendering
   width differs. A 5-column grid guarantees column 3 (Create) sits at
   EXACTLY 50% of the viewport, regardless of label text width. */
.bottom-nav {
  position: fixed;
  left: 0; right: 0; bottom: 0;
  z-index: 30;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  background: rgba(var(--chrome-rgb),0.92);
  backdrop-filter: blur(20px);
  -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid rgba(var(--theme-rgb),0.07);
  padding-bottom: env(safe-area-inset-bottom);
}
.nav-item {
  min-height: 56px;
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
  background: none; border: none; color: var(--text-secondary); cursor: pointer;
}
.nav-item.is-active { color: var(--text-primary); }
.nav-item .nav-icon { transition: transform 210ms cubic-bezier(.2,.8,.2,1), color 180ms ease; }
.nav-item.is-active .nav-icon { transform: scale(1.08); }
.nav-item:active .nav-icon { transform: scale(.92); }
.nav-icon { width: 22px; height: 22px; }
.nav-icon svg { width: 100%; height: 100%; }
.nav-label { font-size: 10.5px; font-weight: 650; letter-spacing: 0.01em; }
.nav-item-create { position: relative; }
.nav-item-create .nav-icon-create {
  width: 44px; height: 44px; border-radius: 999px;
  background:var(--accent); color:var(--accent-contrast);
  display: flex; align-items: center; justify-content: center;
  position:relative; box-shadow: 0 4px 14px rgba(var(--accent-rgb),0.45);
}
.nav-item-create .nav-icon-create { transition: transform 210ms cubic-bezier(.2,.8,.2,1), box-shadow 210ms ease; }
.nav-item-create:active .nav-icon-create { transform: scale(.94); box-shadow: 0 0 0 5px rgba(var(--accent-rgb),.14), 0 4px 14px rgba(var(--accent-rgb),.42); }
.nav-item-create.is-tapping .nav-icon-create { animation: create-nav-tap 410ms cubic-bezier(.22,1,.36,1); }
@keyframes create-nav-tap { 0% { transform:scale(1) rotate(0); } 22% { transform:scale(.9) rotate(0); box-shadow:0 0 0 4px rgba(var(--accent-rgb),.18),0 3px 12px rgba(var(--accent-rgb),.32); } 58% { transform:scale(1.07) rotate(45deg); box-shadow:0 0 0 11px rgba(var(--accent-rgb),.13),0 0 22px rgba(var(--accent-rgb),.38); } 100% { transform:scale(1) rotate(0); } }
.nav-item-create .nav-icon-create::after { content:""; position:absolute; inset:-5px; border:1px solid rgba(var(--accent-rgb),.42); border-radius:50%; opacity:0; pointer-events:none; }
.nav-item-create.is-tapping .nav-icon-create::after { animation:create-halo 420ms cubic-bezier(.22,1,.36,1); }
@keyframes create-halo { 10% { transform:scale(.75); opacity:.7; } 100% { transform:scale(1.55); opacity:0; } }
.settings-avatar-btn,.avatar-btn { view-transition-name:hermes-profile-avatar; }
.view.is-active.is-entering#view-settings { animation:settings-enter 410ms cubic-bezier(.22,1,.36,1) both; }
body.is-opening-settings-view .app-header > :not(#avatarBtn) { animation:settings-header-dim 380ms ease-out both; }
@keyframes settings-header-dim { to { opacity:.42; transform:scale(.99); } }
@keyframes settings-enter { from { opacity:.72; transform:translateY(10px) scale(.985); } to { opacity:1; transform:translateY(0) scale(1); } }
::view-transition-old(hermes-profile-avatar),::view-transition-new(hermes-profile-avatar) { animation-duration:420ms; animation-timing-function:cubic-bezier(.22,1,.36,1); }
@media (prefers-reduced-motion:reduce) { .avatar-btn.is-opening-settings,.avatar-btn.is-opening-settings::after,.nav-item-create.is-tapping .nav-icon-create,.nav-item-create.is-tapping .nav-icon-create::after { animation:none; } }
.nav-item-create .nav-icon-create svg { width: 20px; height: 20px; }
.nav-item-create.is-active .nav-icon-create,
.nav-item-create .nav-icon-create { color:var(--accent-contrast) !important; }

/* Connection state belongs to Home's document flow. This keeps the
   recovery notice visible without covering Messages, Create New or the
   bottom navigation, and uses the app's active Hermes glass/accent tokens. */
.connection-toast {
  position: relative;
  left: auto; bottom: auto; transform: none;
  z-index: 60;
  width: calc(100% - 32px); max-width: 520px;
  margin: 0 auto 12px; padding: 9px 10px 9px 12px;
  border: 1px solid rgba(var(--accent-rgb),.16);
  border-radius: 14px;
  display: flex; align-items: center; justify-content: flex-start; gap: 9px;
  color: var(--text-secondary-strong); font-size: 12px; line-height: 1.35;
  white-space: normal;
}
.connection-status-mark {
  width: 7px; height: 7px; flex: 0 0 7px; border-radius: 50%;
  background: var(--accent); box-shadow: 0 0 8px rgba(var(--accent-rgb),.34);
}
#connectionRetryBtn {
  margin-left: auto; background: rgba(var(--accent-rgb),.08); border: 1px solid rgba(var(--accent-rgb),.18);
  color:var(--accent-ink); font: inherit; font-size: 11.5px; font-weight: 700; border-radius: 999px;
  min-width:60px; min-height:32px; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  padding: 4px 11px; cursor: pointer; flex-shrink: 0;
}
#connectionRetryBtn:disabled { opacity:.72; cursor:default; }

/* ---------------- BOTTOM SHEETS ---------------- */
.sheet-overlay {
  position: fixed; inset: 0; z-index: 50;
  background: rgba(0,0,0,0.55);
  display: flex; align-items: flex-end;
}
.sheet {
  width: 100%;
  background: var(--app-surface);
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;
  border: 1px solid rgba(var(--theme-rgb),0.08);
  border-bottom: none;
  padding: 10px 20px calc(24px + env(safe-area-inset-bottom));
  max-height: 80vh;
  overflow-y: auto;
}
.sheet-handle { width: 36px; height: 4px; border-radius: 999px; background: rgba(var(--theme-rgb),0.18); margin: 4px auto 18px; }
.library-delete-confirm-overlay { z-index:2700; background:rgba(0,0,0,.68); backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); opacity:0; transition:opacity .2s ease; }
.library-delete-confirm-overlay.is-open { opacity:1; }
.library-delete-confirm-sheet { width:min(100%,440px); margin:0 auto; padding:10px 20px calc(18px + env(safe-area-inset-bottom)); border:1px solid rgba(var(--theme-rgb),.1); border-bottom:0; border-radius:22px 22px 0 0; background:var(--app-surface); box-shadow:0 -12px 44px rgba(0,0,0,.24); text-align:center; transform:translateY(28px); transition:transform .24s cubic-bezier(.2,.8,.2,1); }
.library-delete-confirm-overlay.is-open .library-delete-confirm-sheet { transform:translateY(0); }
.library-delete-confirm-sheet .sheet-handle { margin:3px auto 18px; }
.library-delete-title { margin:0 0 9px; color:var(--text-primary); font-size:15px; letter-spacing:.07em; font-weight:760; }
.library-delete-confirm-sheet p { margin:0 auto 18px; max-width:330px; color:var(--text-secondary); font-size:13px; line-height:1.45; }
.library-delete-confirm-sheet .library-delete-error:not([hidden]) { margin:-8px auto 12px; color:var(--danger,#C43F49); font-size:12px; }
.library-delete-confirm-sheet #libraryDeleteConfirmBtn,.library-delete-confirm-sheet #libraryDeleteCancelBtn { width:100%; min-height:46px; margin:0; border-radius:13px; }
.library-delete-confirm-sheet #libraryDeleteConfirmBtn { margin-bottom:8px; font-size:14px; font-weight:740; }

.detail-header { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.detail-thumb { width: 56px; height: 56px; border-radius: 12px; object-fit: cover; background: rgba(var(--theme-rgb),0.06); }
.detail-name { font-size: 16px; font-weight: 750; text-transform: uppercase; letter-spacing: 0.01em; }
.detail-status { font-size: 13px; color: var(--text-secondary); margin-top: 2px; }
.detail-action-btn { width: 100%; margin-top: 4px; }

/* S16/17/18 (2026-09-23 stabilization pass): a real Settings page -
   replaces the old decorative "Settings - coming soon" sheet. Grouped
   sections, each a real card; every value shown is real data
   (settings.js's loadSettings()), never a placeholder. */
.settings-group {
  background: rgba(var(--theme-rgb),0.035); border: 1px solid rgba(var(--theme-rgb),0.07);
  border-radius: 14px; padding: 14px 16px; margin-bottom: 14px;
}
.settings-group-label {
  font-size: 11px; font-weight: 750; letter-spacing: 0.08em; color: var(--text-secondary);
  margin-bottom: 10px;
}
.settings-row {
  display: flex; align-items: center; justify-content: space-between;
  min-height: 38px; gap: 12px;
  border-top: 1px solid rgba(var(--theme-rgb),0.05);
}
.settings-navigation-row { width:100%; padding:7px 0; border:0; background:transparent; color:inherit; text-align:left; cursor:pointer; }
.settings-navigation-copy { display:flex; min-width:0; flex-direction:column; align-items:flex-start; gap:4px; }
.settings-navigation-row:active { opacity:.78; }
.settings-row:first-of-type { border-top: none; }
.settings-row-label { font-size: 13.5px; color: var(--text-secondary-strong); }
.settings-row-value { font-size: 13px; font-weight: 650; color: var(--text-secondary); text-align: right; }
.settings-select {
  background: rgba(var(--theme-rgb),0.06); border: 1px solid rgba(var(--theme-rgb),0.12);
  color: var(--text-primary); font-size: 13px; border-radius: 8px; padding: 5px 8px;
}

.settings-profile-row { display: flex; align-items: center; gap: 14px; }
.settings-avatar-btn {
  width: 56px; height: 56px; border-radius: 999px; flex-shrink: 0;
  background: rgba(var(--theme-rgb),0.08); border: 1px solid rgba(var(--theme-rgb),0.14);
  color: var(--text-primary); font-size: 17px; font-weight: 700;
  display: flex; align-items: center; justify-content: center; cursor: pointer;
  position: relative; overflow: hidden; padding: 0; isolation: isolate;
}
.settings-profile-info { flex: 1; min-width:0; display:flex; flex-direction:column; gap:5px; }
.settings-profile-name-label { display:block; margin:0; color:var(--text-secondary); font-size:11px; line-height:1.15; }
.settings-profile-name-edit { display:flex; align-items:center; gap:8px; }
.settings-profile-name { width:100%; min-width:0; height:38px; padding:7px 9px; border:1px solid rgba(var(--theme-rgb),.11); border-radius:9px; background:rgba(var(--theme-rgb),.045); color:var(--text-primary); font:inherit; font-size:15px; font-weight:700; outline:none; box-shadow:none; }
.settings-profile-name:focus { border-color:var(--accent); box-shadow:0 0 0 1px rgba(var(--accent-rgb),.28); }
.settings-profile-name-save { min-height:36px; padding:0 12px; border:1px solid rgba(var(--accent-rgb),.55); border-radius:9px; background:var(--accent); color:var(--accent-contrast); font:inherit; font-size:12px; font-weight:700; }
.settings-profile-name-save:disabled { opacity:.72; color:var(--accent-contrast); }
.settings-profile-actions { display: flex; gap: 18px; margin-top: 10px; }
.settings-danger-link { color:var(--danger); }

/* S5/S6: generic silhouette fallback - a real vector icon (not an
   emoji, not "DM" initials), centered, neutral gray/white, minimal.
   Shown whenever no photo is persisted, everywhere the shared avatar
   appears (header, Settings). */
.avatar-silhouette { width: 58%; height: 58%; color: var(--text-secondary); }
.avatar-silhouette svg { width: 100%; height: 100%; display: block; }

/* S5: real pinch/drag crop editor - a full-screen overlay, opened
   BEFORE any photo is persisted (never an immediate silent save). The
   circular viewport IS the crop mask (border-radius:50% + overflow:
   hidden directly on the pannable container - no separate box-shadow
   mask trick needed). touch-action:none on the viewport is safe and
   correct here (unlike the media-reorder case) since this overlay owns
   the entire screen - there's no sibling content a browser could
   mistake this gesture for wanting to scroll instead. */
.crop-overlay {
  position: fixed; inset: 0; z-index: 300;
  background:var(--app-background);
  display: flex; flex-direction: column;
  padding-top: env(safe-area-inset-top); padding-bottom: env(safe-area-inset-bottom);
}
.crop-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 18px; flex-shrink: 0;
}
/* Polish pass (2026-09-23, item 6): brightened from var(--text-secondary-strong) - against
   the overlay's pure-black background that shade read as noticeably
   dim/low-contrast once seen live, not the "clearly readable" primary
   label the spec calls for. */
.crop-title { font-size: 13px; font-weight: 600; color: rgba(var(--theme-rgb),0.90); }
.crop-save-btn { font-weight: 600; }
/* Cancel/Save reuse .text-link-btn's var(--accent), which read as a dim,
   muted navy against pure black once seen live (the same hex looks
   fine on the app's usual rgba(var(--theme-rgb),0.03-0.06) card
   backgrounds, but not on flat #000) - a lighter, higher-contrast blue
   scoped to just this overlay fixes it without touching the shared
   .text-link-btn elsewhere in the app. */
/* Real root-cause fix (2026-09-24, second pass): the single-class
   selector below used to lose to .text-link-btn's OWN color rule
   (also single-class specificity) purely because .text-link-btn
   happens to be defined LATER in this file - source order breaks the
   tie when specificity is equal, so Save (which carries both classes)
   silently rendered at .text-link-btn's dimmer blue no matter what
   color was written here. Scoping through the real parent
   (.crop-header) raises specificity above ANY single-class rule
   anywhere else in this file, so this can never be silently
   overridden by future unrelated CSS again. */
.crop-header #avatarCropCancelBtn, .crop-header .crop-save-btn { color:var(--accent-ink); font-weight: 600; opacity: 1; }
.crop-header #avatarCropCancelBtn:active, .crop-header .crop-save-btn:active { color: var(--accent-pressed); }
.crop-body {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px;
}
.crop-viewport {
  width: min(78vw, 320px); height: min(78vw, 320px);
  border-radius: 999px; overflow: hidden; position: relative;
  background: var(--app-surface);
  touch-action: none;
  isolation: isolate;
}
.crop-viewport img {
  position: absolute; left: 0; top: 0;
  transform-origin: 0 0;
  max-width: none; max-height: none;
  user-select: none; -webkit-user-drag: none; -webkit-touch-callout: none;
}
/* Polish pass (2026-09-23, item 6): brightened from var(--text-tertiary) - on this
   screen's flat black background that read as barely legible, not the
   "visible secondary gray, NOT near-black" the spec calls for. */
.crop-hint { font-size: 12.5px; color: rgba(var(--theme-rgb),0.55); }
/* Real, visible failure state (2026-09-24) - Save used to silently
   swallow a render/localStorage failure and close as if it worked. */
.crop-error {
  font-size: 12.5px; font-weight: 600; color:var(--danger); text-align: center;
  max-width: 280px; padding: 0 16px;
}

/* A restrained iOS-style toggle switch, built from scratch - no prior
   art elsewhere in this app. Real checkbox underneath for a11y/native
   keyboard support; the track/knob are pure CSS, no image assets. */
.settings-switch { position: relative; display: inline-block; width: 44px; height: 26px; flex-shrink: 0; }
.settings-switch input { opacity: 0; width: 0; height: 0; position: absolute; }
.settings-switch-track {
  --settings-switch-border: 0px;
  position: absolute; inset: 0; border-radius: 999px; cursor: pointer;
  background: rgba(var(--theme-rgb),0.14); transition: background 0.15s ease;
}
.settings-switch-track::before {
  content: ""; position: absolute; left: calc(3px - var(--settings-switch-border)); top: 50%;
  width: 20px; height: 20px; border-radius: 999px; background: #fff;
  transform: translateY(-50%); transition: transform 0.15s ease;
}
.settings-switch input:checked + .settings-switch-track { background: var(--accent); }
.settings-switch input:checked + .settings-switch-track::before { transform: translate(18px, -50%); }

.back-btn {
  background: none; border: none; color: var(--text-secondary); font-size: 14px; font-weight: 650;
  padding: 4px 0 16px; cursor: pointer; min-height: 32px;
}

/* ---------------- CHIPS (filters / ranges) ---------------- */
.chip-row { display: flex; gap: 8px; margin-bottom: 20px; overflow-x: auto; -ms-overflow-style: none; scrollbar-width: none; }
.chip-row::-webkit-scrollbar { display: none; }
.chip {
  flex-shrink: 0;
  min-height: 34px;
  padding: 0 16px;
  border-radius: 999px;
  border: 1px solid rgba(var(--theme-rgb),0.12);
  background: rgba(var(--theme-rgb),0.04);
  color: var(--text-secondary);
  font-size: 13px; font-weight: 650;
  cursor: pointer;
}
.chip.is-active { background: var(--accent); border-color: var(--accent); color: var(--accent-contrast); }

/* Item 8 (2026-09-24 pass): ONE reusable search-field shape - the input
   plus an inside-the-field clear X, used identically by Library and
   Listings (and any future search screen). The X is absolutely
   positioned over the input's own right-padding, shown/hidden purely
   by wireSearchClear() (app.js) toggling display:flex/none - no CSS
   :placeholder-shown trick, since that can't distinguish "has text" from
   "browser autofill mid-flight" reliably across WebKit versions. */
.search-field { position: relative; display: flex; align-items: center; }
.search-field .listings-search { padding-right: 40px; }
.search-clear-btn {
  position: absolute; right: 2px; top: 50%; transform: translateY(-50%);
  width: 32px; height: 32px; border-radius: 999px;
  display: flex; align-items: center; justify-content: center;
  background: none; border: none; color: var(--text-tertiary); cursor: pointer;
}
.search-clear-btn svg { width: 14px; height: 14px; }
.search-clear-btn:active { color: var(--text-secondary-strong); }

/* ---------------- LISTING ROWS (shared: Listings, Top Posters) ---------------- */
.listings-search-row { margin-bottom: 14px; }
.listings-search {
  width: 100%; min-height: 42px; border-radius: 12px;
  border: 1px solid rgba(var(--theme-rgb),0.1); background: rgba(var(--theme-rgb),0.04);
  color: var(--text-primary); font-size: 15px; padding: 0 14px;
}
.library-search-field { width:100%; padding:0 8px; border-radius:13px; background:rgba(var(--theme-rgb),.045); border:1px solid rgba(var(--theme-rgb),.09); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.library-search-field .listings-search { border:0; background:transparent; min-height:44px; padding-left:8px; }
.listings-search:focus { outline: none; border-color: var(--accent); }
.listings-list, .top-posters-list { display: flex; flex-direction: column; gap: 6px; }
.listings-list { gap:11px; }
.listing-row, .top-poster-row {
  display: flex; align-items: center; gap: 12px;
  padding: 10px 4px; min-height: 44px; cursor: pointer;
  border-bottom: 1px solid rgba(var(--theme-rgb),0.06);
}
.listings-list .listing-row { padding-left:12px; padding-right:12px; }
.listing-row:active, .top-poster-row:active { background: rgba(var(--theme-rgb),0.03); }
.listing-thumb {
  width: 44px; height: 44px; border-radius: 10px; object-fit: cover; flex-shrink: 0;
  background: rgba(var(--theme-rgb),0.06);
}
.listing-thumb-frame { position:relative; display:grid; place-items:center; width:44px; height:44px; flex:0 0 44px; overflow:hidden; border-radius:10px; background:var(--app-surface); }
.listing-thumb-fallback { position:absolute; inset:0; display:grid; place-items:center; color:var(--text-secondary); font-size:17px; font-weight:600; line-height:1; }
.listing-thumb-frame.has-image .listing-thumb-fallback { display:none; }
.listing-thumb-frame .listing-thumb-loading-overlay { position:absolute; z-index:2; inset:0; border-radius:inherit; pointer-events:none; background:rgba(0,0,0,.60); opacity:0; transition:opacity .18s ease; }
.listing-thumb-frame.is-loading-preview .listing-thumb-loading-overlay { opacity:1; }
.listing-thumb-frame .listing-thumb { position:absolute; z-index:1; inset:0; width:100%; height:100%; border-radius:inherit; object-fit:cover; transition:opacity .16s ease; }
.listing-thumb-frame .listing-thumb.is-image-failed { display:none; }
.library-card-thumb.is-image-failed { background-color:var(--app-surface); }
.analytics-row-thumb-empty { display:grid; place-items:center; color:var(--text-secondary); background:var(--app-surface); }
.analytics-row-thumb-empty::after { content:"?"; font-size:17px; font-weight:600; line-height:1; }
.listing-row-body { flex: 1; min-width: 0; }
.listing-row-name { font-size: 14px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.listing-row-sub { font-size: 12px; color: var(--text-secondary); margin-top: 1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.listing-status-pill {
  font-size: 10.5px; font-weight: 750; letter-spacing: 0.04em;
  padding: 3px 8px; border-radius: 999px; flex-shrink: 0; white-space: nowrap;
}
.listing-status-slot { width:86px; flex:0 0 86px; display:flex; justify-content:flex-end; }
.is-status-active { background: rgba(33,116,71,.24); color:var(--status-active); }
.is-status-draft { background: rgba(204,154,35,.15); color:var(--status-draft); }
.is-status-inactive { background: rgba(var(--theme-rgb),.07); color: var(--text-secondary); }
.is-status-syncing { background: rgba(var(--theme-rgb),.045); color: var(--text-secondary); }
.is-status-needs { background: rgba(var(--accent-rgb),0.16); color:var(--accent-ink); }
.is-status-unlinked { background: rgba(var(--theme-rgb),0.06); color: var(--text-secondary); }
.listing-chevron { color:var(--text-secondary); font-size: 18px; flex-shrink: 0; }
.top-poster-revenue { font-size: 14px; font-weight: 750; flex-shrink: 0; white-space: nowrap; }

:root[data-theme="light"] .is-status-active { background:rgba(30,120,65,.12); color:#17643A; }
:root[data-theme="light"] .is-status-draft { background:rgba(168,120,0,.12); color:#755400; }
:root[data-theme="light"] .is-status-needs { background:rgba(var(--accent-rgb),.12); color:var(--accent-contrast); }
:root[data-theme="light"] .is-status-inactive,
:root[data-theme="light"] .is-status-syncing,
:root[data-theme="light"] .is-status-unlinked { color:#59616D; }
@media (prefers-color-scheme:light) {
  :root[data-theme="system"] .is-status-active { background:rgba(30,120,65,.12); color:#17643A; }
  :root[data-theme="system"] .is-status-draft { background:rgba(168,120,0,.12); color:#755400; }
  :root[data-theme="system"] .is-status-needs { background:rgba(var(--accent-rgb),.12); color:var(--accent-contrast); }
  :root[data-theme="system"] .is-status-inactive,
  :root[data-theme="system"] .is-status-syncing,
  :root[data-theme="system"] .is-status-unlinked { color:#59616D; }
}

/* ---------------- LISTING EDITOR ---------------- */
.editor-header { display: flex; align-items: center; gap: 12px; margin-bottom: 24px; }
.editor-header-thumb { width: 52px; height: 52px; border-radius: 12px; object-fit: cover; background: rgba(var(--theme-rgb),0.06); flex-shrink: 0; }
.editor-header-body { flex: 1; min-width: 0; }
.editor-header-name { font-size: 16px; font-weight: 750; text-transform: uppercase; letter-spacing: 0.01em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.editor-header-status { font-size: 12.5px; color: var(--text-secondary); margin-top: 2px; }

.editor-section { border-bottom: 1px solid rgba(var(--theme-rgb),0.07); margin-bottom: 4px; }
.editor-section-toggle {
  width: 100%; min-height: 48px; display: flex; align-items: center; justify-content: space-between;
  background: none; border: none; color: var(--text-primary);
  font-size: 12px; font-weight: 750; letter-spacing: 0.08em; cursor: pointer; padding: 0 2px;
}
.editor-section-chevron { color: var(--text-tertiary); transition: transform 0.2s ease; }
.editor-section-toggle { transition: color .18s ease,background-color .18s ease; }
.editor-section.is-open .editor-section-chevron { transform: rotate(90deg); }
/* S9 fix (2026-09-23 stabilization pass): the previous 0fr/1fr
   grid-template-rows trick forces the browser to recompute real layout
   on every animation frame for the section's full content (images,
   drag tiles, inputs) - a real, live-measured cause of the reported
   toggle lag/freeze, worse on repeated/rapid taps since each new
   transition restarts mid-layout-recalc. Height itself now snaps
   instantly (display:none <-> grid, zero interpolation, zero forced
   layout per frame) - all of the perceived motion comes from a cheap
   opacity+transform fade on the inner content, which is GPU-composited
   and never triggers layout. */
.editor-section-body { display: grid; min-width: 0; }
.editor-section-body-inner {
  min-width: 0; min-height: min-content; padding: 4px 2px 20px;
  opacity: 0; transform: translateY(-4px);
  transition: opacity 0.16s ease, transform 0.16s ease;
}
.editor-section.is-open .editor-section-body-inner { opacity: 1; transform: translateY(0); }
#view-listing-editor input, #view-listing-editor textarea, #view-listing-editor select, #editorFilesList { scroll-margin-block: 16px 180px; }

.field-label { display: block; font-size: 11.5px; font-weight: 700; color: var(--text-secondary); letter-spacing: 0.03em; margin: 14px 0 6px; }
.field-label:first-child { margin-top: 0; }
.field-input {
  width: 100%; max-width: 100%; box-sizing: border-box;
  min-height: 44px; border-radius: 10px;
  border: 1px solid rgba(var(--theme-rgb),0.1); background: rgba(var(--theme-rgb),0.04);
  color: var(--text-primary); font-size: 15px; padding: 10px 12px;
}
.field-input:focus, .field-input:focus-visible { outline: none !important; border-color: var(--accent) !important; box-shadow:none !important; }
.field-input { box-shadow:none; }
.field-input:not(select) { appearance:none; -webkit-appearance:none; }
.field-input:not(:focus) { box-shadow:none; }
.field-textarea { min-height: 140px; resize: vertical; line-height: 1.5; font-family: inherit; }
.editor-short-description { min-height:108px; padding:15px 16px; border-radius:10px; line-height:1.45; }
#editorSection-content .editor-section-body-inner > .field-label:first-child { margin:0 0 10px; }
#editorSection-content #editorTitleCounter { margin-top:8px; }
.editor-description-heading { display:flex; flex-direction:column; gap:5px; margin-top:30px; margin-bottom:9px; }
.editor-smart-import-row{display:flex;align-items:center;margin:0 0 5px;padding:0}.editor-smart-import-pill{width:100%;min-height:40px;padding:0 14px;display:inline-flex;align-items:center;justify-content:center;gap:7px;border:1px solid rgba(var(--accent-rgb),.22);border-radius:14px;background:var(--hermes-glass-background);-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);color:var(--accent-ink);font:600 12px/1 -apple-system,BlinkMacSystemFont,sans-serif;box-shadow:inset 0 1px 0 rgba(255,255,255,.045);transition:transform .16s ease,background-color .18s ease,border-color .18s ease,opacity .16s ease}.editor-smart-import-icon,.editor-smart-import-label{transition:opacity .14s ease,transform .14s ease}.editor-smart-import-icon{font-size:14px;line-height:1}.editor-smart-import-pill.is-changing .editor-smart-import-icon,.editor-smart-import-pill.is-changing .editor-smart-import-label{opacity:.15;transform:translateY(1px)}.editor-smart-import-pill:active{transform:scale(.985);background:rgba(var(--accent-rgb),.14)}.editor-smart-import-pill:disabled{opacity:.62}.editor-smart-import-status{box-sizing:border-box;display:flex;align-items:center;gap:7px;min-height:31px;margin:0 0 9px;padding:6px 10px;border:1px solid rgba(var(--accent-rgb),.16);border-radius:11px;background:rgba(var(--accent-rgb),.075);-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);color:var(--text-secondary);font:500 11px/1.35 -apple-system,BlinkMacSystemFont,sans-serif;opacity:1;transform:translateY(0);transition:opacity .16s ease,transform .16s ease}.editor-smart-import-status[hidden]{display:none}.editor-smart-import-status.is-success{border-color:rgba(var(--accent-rgb),.18);background:rgba(var(--accent-rgb),.085);color:var(--accent-ink)}.editor-smart-import-status.is-neutral{border-color:rgba(255,255,255,.10);background:rgba(255,255,255,.045);color:var(--text-secondary)}.editor-smart-import-status.is-partial{border-color:rgba(220,160,65,.22);background:rgba(175,112,24,.10);color:#e9c985}.editor-smart-import-status.is-error{border-color:rgba(205,83,98,.22);background:rgba(120,30,43,.14);color:#e3a0a7}.editor-smart-import-status .status-icon{flex:none;font-size:12px;line-height:1}.editor-smart-import-status.is-entering{opacity:0;transform:translateY(-3px)}
@media(prefers-reduced-motion:reduce){.editor-smart-import-pill,.editor-smart-import-status{transition:none!important}.editor-smart-import-pill:active{transform:none}}
.editor-smart-import-icon svg{display:block;width:16px;height:16px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}.editor-smart-import-icon .clipboard-checkmark{stroke:var(--accent);stroke-width:1.8}
.editor-smart-import-status{box-sizing:border-box;min-height:0;max-height:0;margin:0;padding-block:0;overflow:hidden;border-color:transparent;opacity:0;transform:translateY(-3px);transition:max-height .18s ease,min-height .18s ease,margin .18s ease,padding .18s ease,border-color .18s ease,opacity .16s ease,transform .16s ease}.editor-smart-import-status.is-visible{min-height:31px;max-height:56px;margin:0 0 9px;padding:6px 10px;border-color:rgba(var(--accent-rgb),.16);opacity:1;transform:translateY(0)}.editor-smart-import-status.is-entering{opacity:0;transform:translateY(-3px)}
@media(prefers-reduced-motion:reduce){.editor-smart-import-status{transition:none!important}.editor-smart-import-status.is-visible{opacity:1;transform:none}}
.editor-smart-import-status.is-visible.is-error{border-color:rgba(205,83,98,.22)}.editor-smart-import-status.is-visible.is-partial{border-color:rgba(220,160,65,.22)}.editor-smart-import-status.is-visible.is-neutral{border-color:rgba(255,255,255,.10)}
body.animations-disabled .editor-smart-import-pill,body.animations-disabled .editor-smart-import-status{transition:none!important}body.animations-disabled .editor-smart-import-status.is-visible{opacity:1;transform:none}
.smart-import-sheet{max-height:min(78dvh,660px);overflow:auto;padding-bottom:max(18px,env(safe-area-inset-bottom))}.smart-import-fields{display:grid;gap:8px;margin-top:14px}.smart-import-field{padding:10px 11px;border:1px solid rgba(var(--theme-rgb),.09);border-radius:13px;background:rgba(var(--theme-rgb),.035)}.smart-import-field-head{display:flex;align-items:center;gap:8px;color:var(--text-primary);font-size:12px;font-weight:650}.smart-import-field-head input{accent-color:var(--accent);width:16px;height:16px;margin:0}.smart-import-field-head small{margin-left:auto;color:var(--text-secondary);font-size:10px;font-weight:550}.smart-import-field-preview{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;margin:7px 0 0 24px;color:var(--text-secondary-strong);font-size:11px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}.smart-import-field.is-conflict{border-color:rgba(var(--accent-rgb),.2)}.smart-import-fields:empty{display:none}.smart-import-modal .editor-description-error{white-space:pre-line;line-height:1.45}
.smart-import-tag-correction{display:block;box-sizing:border-box;width:calc(100% - 24px);min-height:66px;resize:vertical;padding:8px 9px;border:1px solid rgba(var(--accent-rgb),.2);border-radius:10px;background:rgba(var(--theme-rgb),.045);color:var(--text-primary);font:inherit;font-size:11px;line-height:1.45;white-space:pre-wrap;overflow-wrap:anywhere}
.editor-description-heading .field-label { margin:0; }
.editor-tags-field { margin-top:24px; }
.editor-tags-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px; }
.editor-tags-heading .field-label { margin:0; }
.editor-tags-counter { color:var(--text-tertiary); font-size:11px; font-variant-numeric:tabular-nums; }
.editor-tags-editor { box-sizing:border-box; display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; align-content:center; gap:6px; width:100%; min-height:48px; padding:6px 10px; border:1px solid rgba(var(--theme-rgb),.1); border-radius:10px; background:rgba(var(--theme-rgb),.04); }
.editor-tags-chips { display:contents; }
.editor-tag-chip { display:inline-flex; align-items:center; gap:5px; max-width:100%; padding:5px 6px 5px 10px; border:1px solid rgba(var(--accent-rgb),.2); border-radius:999px; background:rgba(var(--accent-rgb),.08); color:var(--text-primary); font-size:12px; line-height:1.2; overflow-wrap:anywhere; }
.editor-tag-remove { display:inline-flex; align-items:center; justify-content:center; flex:0 0 20px; width:20px; height:20px; padding:0; border:0; border-radius:50%; background:transparent; color:var(--text-secondary); font-size:17px; line-height:1; cursor:pointer; }
.editor-tag-remove:active { color:var(--accent-ink); background:rgba(var(--accent-rgb),.12); }
.editor-tags-input { display:block; box-sizing:border-box; flex:1 1 180px; width:auto; min-width:min(100%,180px); height:34px; min-height:34px; padding:0 2px; border:0; outline:0; appearance:none; -webkit-appearance:none; background:transparent; color:var(--text-primary); font:inherit; font-size:14px; line-height:34px; }
.editor-tags-input::placeholder { color:var(--text-tertiary); }
.editor-tags-hint,.editor-tags-error { margin-top:6px; color:var(--text-tertiary); font-size:11px; line-height:1.4; }
.editor-tags-error:not([hidden]) { color:var(--accent-ink); }
.editor-description-note { display:block; color:var(--text-tertiary); font-size:10.5px; line-height:1.4; }
.editor-base-description-row { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-top:30px; }
.editor-base-description-row > div { min-width:0; }
.editor-base-description-row .field-label { margin:0 0 3px; }
.editor-base-description-row > button { flex:0 0 auto; align-self:flex-start; margin-top:-2px; }
.editor-base-description-preview { display:-webkit-box; overflow:hidden; margin-top:6px; color:var(--text-tertiary); font-size:11px; line-height:1.45; overflow-wrap:anywhere; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.editor-base-description-preview.is-error,.editor-description-error { color:var(--text-secondary); font-size:11px; line-height:1.4; }
.editor-description-error { margin:10px 0 0; }
.editor-base-description-modal { position:fixed; inset:0; z-index:80; display:flex; align-items:flex-end; justify-content:center; padding-bottom:env(safe-area-inset-bottom); opacity:0; transition:opacity .18s ease; }
.editor-base-description-modal.is-open { opacity:1; }
.editor-base-description-scrim { position:absolute; inset:0; background:rgba(0,0,0,.58); }
.editor-base-description-sheet { position:relative; z-index:1; width:min(100%,560px); padding:18px 18px 20px; border:1px solid rgba(var(--theme-rgb),.09); border-bottom:0; border-radius:20px 20px 0 0; background:var(--app-raised); transform:translateY(14px); transition:transform .18s ease; }
.editor-base-description-modal.is-open .editor-base-description-sheet { transform:translateY(0); }
.editor-base-description-sheet-header { display:flex; align-items:center; justify-content:space-between; color:var(--text-primary); font-size:15px; }
.editor-base-description-sheet > .editor-description-note { margin-top:5px; }
.editor-base-description-sheet textarea { margin-top:13px; min-height:190px; }
.editor-base-description-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:13px; }
.editor-base-description-actions button { min-width:92px; }
.editor-base-description-actions .is-saving::before { content:""; display:inline-block; width:12px; height:12px; margin-right:7px; vertical-align:-2px; border:1.5px solid currentColor; border-right-color:transparent; border-radius:50%; animation:editor-base-spin .65s linear infinite; }
@keyframes editor-base-spin { to { transform:rotate(360deg); } }
.editor-base-description-modal:not(.is-open) { pointer-events:none; }
@media (prefers-reduced-motion:reduce) { .editor-base-description-modal,.editor-base-description-sheet { transition:none; } }
.field-counter { font-size: 11px; color: var(--text-tertiary); text-align: right; margin-top: 4px; }
.field-static { min-height: 44px; display: flex; align-items: center; font-size: 14.5px; color: var(--text-secondary-strong); }

.editor-content-actions { display: flex; align-items: center; gap: 12px; margin-top: 16px; flex-wrap: wrap; }
.editor-generate-status { flex: 1; min-width: 0; font-size: 12.5px; color: var(--text-secondary); }
.btn-small { min-height: 36px; padding: 0 14px; font-size: 13px; }

.editor-media-preview { display:block; box-sizing:border-box; width:100%; max-width:100%; height:auto; border-radius:14px; object-fit:contain; max-height:320px; margin-bottom:15px; background:rgba(var(--theme-rgb),0.04); transition:opacity .12s ease; cursor:zoom-in; }

/* Real card-based media manager (item 3, 2026-09-23 pass) - replaces
   the old small-square horizontal thumbnail strip as the PRIMARY
   editing interface. Each .editor-media-tile is now a full-width
   row card (handle + thumb + COVER/rank badge + "..." menu) stacked
   vertically, so order is legible at a glance without horizontal
   scrolling - the exact "cards with COVER/01/02 labels" shape asked
   for. The drag engine itself (_mediaDragState, hold-then-drag,
   pointer capture, FLIP reflow) is unchanged from the prior pass -
   only its axis flips from X to Y, see updateMediaDrag() in editor.js. */
.editor-media-manager { display: flex; flex-direction: row; min-width:0; max-width:100%; box-sizing:border-box; overflow-x: auto; gap: 10px; padding: 4px 4px 8px; touch-action: auto; overscroll-behavior-x: contain; -webkit-overflow-scrolling: touch; }
.editor-media-tile {
  position: relative; display: flex; align-items: center; gap: 10px; width: 164px; flex: 0 0 164px;
  border-radius: 10px; padding: 8px 10px;
  background: linear-gradient(145deg, rgba(var(--theme-rgb),0.065), rgba(var(--theme-rgb),0.025)); border: 1px solid rgba(var(--theme-rgb),0.09);
  box-shadow: 0 3px 10px rgba(0,0,0,0.16);
  transition: transform 0.12s ease, opacity 0.12s ease, border-color 0.12s ease, box-shadow 0.12s ease;
  touch-action: auto;
  /* Real iOS Safari bug (item 7): a hold on a plain <img> triggers the
     OS-level Save/Copy/Share callout and a native drag-ghost BEFORE any
     JS pointer handler runs, hijacking the custom hold-then-drag
     gesture below. These suppress both without disabling pointer
     events - the callout/native-drag are separate iOS behaviors from
     the CSS user-select/touch-action properties. */
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}
.editor-media-thumb {
  position:relative; flex-shrink: 0; width: 52px; height: 52px; border-radius: 8px; overflow: hidden; background: rgba(var(--theme-rgb),0.06);
}
.editor-media-tile.is-preview-loading .editor-media-thumb { background:linear-gradient(110deg,rgba(var(--theme-rgb),.045) 8%,rgba(var(--theme-rgb),.11) 18%,rgba(var(--theme-rgb),.045) 33%); background-size:220% 100%; animation:editorMockupSkeleton 1.25s ease-in-out infinite; }
@keyframes editorMockupSkeleton { to { background-position-x:-220%; } }
@media (prefers-reduced-motion:reduce) { .editor-media-tile.is-preview-loading .editor-media-thumb { animation:none; } }
.editor-media-thumb img {
  width: 100%; height: 100%; object-fit: cover; display: block;
  -webkit-user-drag: none; -webkit-touch-callout: none; pointer-events: none;
}
.editor-media-rank-badge {
  font-size: 11.5px; font-weight: 750; letter-spacing: 0.04em; color: var(--text-secondary); flex-shrink: 0;
}
.editor-media-rank-badge.is-cover { color:var(--success); }
.editor-media-tile.is-selected { border-color: rgba(var(--theme-rgb),0.09); }
/* "card lifts slightly" (item 3 spec) - a subtle raise + shadow, not
   the old small-tile scale-up, matches a full-width row card better. */
.editor-media-tile.is-armed { transform: translateY(-2px); box-shadow: 0 6px 16px rgba(0,0,0,0.3); transition: transform 0.15s ease, box-shadow 0.15s ease; }
/* Real rewrite (2026-09-24, bug-fix pass): the dedicated drag handle
   is removed entirely - the whole row is draggable by long-press (see
   wireMediaTileGestures in editor.js, same non-passive-touchmove +
   preventDefault-once-armed technique as the mockup grid). The dragged
   row is promoted to position:fixed at drag start, so it is NEVER
   clipped by any ancestor's overflow and stays exactly where JS's
   live translate() puts it every frame - always visibly attached to
   the finger, never a static lift-and-forget. */
.editor-media-tile.is-dragging {
  z-index: 500; opacity: 1; transform: scale(1.04);
  background: rgba(var(--surface-rgb), 0.98);
  -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px);
  isolation: isolate;
  border: 1px solid rgba(76, 139, 255, 0.95);
  box-shadow: 0 0 0 1px rgba(var(--accent-rgb),.32), 0 12px 28px rgba(0,0,0,.55);
  transition: box-shadow 0.15s ease, border-color 0.15s ease;
}
.app-main.is-horizontal-reordering { overflow-y: hidden; touch-action: none; }
.is-button-spinner { animation: analyticsRefreshSpin 0.7s linear infinite; margin: 0 auto; }
.editor-media-drag-placeholder { visibility: hidden; pointer-events: none; }
.editor-media-more-btn {
  flex-shrink: 0; margin-left: auto; width: 30px; height: 30px; border-radius: 999px;
  background: rgba(var(--theme-rgb),0.06); border: none; color: var(--text-secondary-strong); display: flex; align-items: center; justify-content: center;
  font-size: 15px; line-height: 1; cursor: pointer; padding: 0;
}
/* The COVER menu shares the same card geometry; a small inset correction
   applies only to its control and leaves every other row untouched. */
.editor-media-tile:has(.editor-media-rank-badge.is-cover) .editor-media-more-btn { transform: translateX(-4px); }
.editor-crop-open { margin:0 0 14px; }
.editor-media-add-btn { width: 100%; margin-top: 7px; }

/* "+ Add Mockup" sheet (item 3) - reuses .file-card's established
   look as a real <button>, stacked vertically. */
#addMockupSheetBody { display: flex; flex-direction: column; gap: 8px; }
.addable-mockup-row { width: 100%; min-height:68px; display:flex; align-items:center; gap:12px; position:relative; overflow:hidden; text-align:left; font:inherit; color:inherit; }
.addable-mockup-preview { position:relative; display:block; flex:0 0 52px; width:52px; height:52px; overflow:hidden; border-radius:10px; background:rgba(var(--theme-rgb),.07); }
.addable-mockup-preview img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; border-radius:inherit; transition:opacity .16s ease; }
.addable-mockup-preview.is-loading::before { content:""; position:absolute; inset:0; background:rgba(var(--theme-rgb),.08); animation:previewPulse 1.2s ease-in-out infinite alternate; }
@keyframes previewPulse { from { opacity:.42; } to { opacity:.9; } }
.addable-mockup-preview.is-loading img { opacity:.72; }
.addable-mockup-preview.is-unavailable img { opacity:.18; }
@media (prefers-reduced-motion:reduce) { .addable-mockup-preview.is-loading::before { animation:none; } }
.addable-mockup-preview.is-unavailable::after { content:"Preview unavailable"; position:absolute; inset:0; display:grid; place-items:center; padding:4px; color:var(--text-secondary); font-size:8px; text-align:center; background:var(--surface-secondary); }
.addable-mockup-row .file-card-title { flex:1; align-self:center; }
.editor-media-context-menu {
  position: fixed; z-index: 40; min-width: 150px; border-radius: 12px; overflow: hidden;
  background: var(--app-raised); border: 1px solid rgba(var(--theme-rgb),0.1); box-shadow: 0 10px 30px rgba(0,0,0,0.5);
}
.editor-media-context-item {
  display: block; width: 100%; text-align: left; min-height: 44px; padding: 0 16px;
  background: none; border: none; color: var(--text-primary); font-size: 14px; cursor: pointer;
  border-bottom: 1px solid rgba(var(--theme-rgb),0.06);
}
.editor-media-context-item:last-child { border-bottom: none; }
.editor-media-context-item.is-danger { color:var(--danger); }
.editor-media-context-overlay { position: fixed; inset: 0; z-index: 39; background: transparent; }

.editor-files-actions { display: flex; gap: 10px; margin-bottom: 16px; }
.editor-files-list { display: flex; flex-direction: column; gap: 8px; }
.file-card {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px;
  border: 1px solid rgba(var(--theme-rgb),0.08); background: rgba(var(--theme-rgb),0.03); cursor: pointer; min-height: 44px;
}
.file-card.is-selected { border-color: rgba(var(--accent-rgb),0.5); background: rgba(var(--accent-rgb),0.08); }
.file-card { transition: border-color .18s ease,background-color .18s ease,transform .16s cubic-bezier(.2,.75,.25,1); }
.file-card:active { transform:scale(.99); }
.file-card-check {
  width: 20px; height: 20px; border-radius: 6px; border: 1px solid rgba(var(--theme-rgb),0.18);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  font-size: 13px; color:var(--accent-ink); font-weight: 750;
}
.file-card.is-selected .file-card-check { border-color: var(--accent); background: rgba(var(--accent-rgb),0.18); }
.file-card-title { font-size: 14px; font-weight: 650; }
.file-card-sub { font-size: 12px; color: var(--text-secondary); margin-top: 1px; }
.file-card-size { font-size: 11.5px; color: var(--text-tertiary); margin-top: 1px; }

.tag-editor { border-radius: 10px; border: 1px solid rgba(var(--theme-rgb),0.1); background: rgba(var(--theme-rgb),0.04); padding: 10px 10px 4px; }
.tag-chip-row { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 6px; }
.tag-chip {
  display: inline-flex; align-items: center; gap: 5px;
  background: rgba(var(--theme-rgb),0.08); border-radius: 999px; padding: 5px 6px 5px 11px;
  font-size: 12.5px; font-weight: 600;
}
.tag-chip-remove { background: none; border: none; color: var(--text-secondary); font-size: 14px; cursor: pointer; line-height: 1; padding: 2px; }
.tag-input { width: 100%; border: none; background: none; color: var(--text-primary); font-size: 14px; min-height: 36px; padding: 0 4px 6px; }
.tag-input:focus { outline: none; }

.editor-sticky-footer {
  /* Real, reported regression fix: this used to sit at bottom:0 with a
     LOWER z-index than .bottom-nav (also bottom:0) - the nav bar
     rendered directly on top of it, making the Add/Update Etsy Draft
     button exist in the DOM but be completely invisible. Now anchored
     just above the real nav bar height, matching the same established
     pattern .create-sticky-footer already uses. */
  position: fixed; left: 0; right: 0; bottom: calc(56px + env(safe-area-inset-bottom)); z-index: 25;
  padding: 12px 18px;
  background: var(--hermes-chrome-background);
  backdrop-filter: var(--hermes-chrome-backdrop); -webkit-backdrop-filter: var(--hermes-chrome-backdrop);
  border-top: 1px solid rgba(var(--theme-rgb),0.08);
}
.sticky-btn { width: 100%; }
.sticky-review-btn { color:var(--warning); border-color: rgba(245,196,83,0.3); }
.sticky-progress-text, .sticky-partial-text, .sticky-success-text {
  font-size: 13px; text-align: center; padding: 6px 0; color: var(--text-secondary-strong);
}
.sticky-success, .sticky-partial { display: flex; flex-direction: column; gap: 8px; animation: statusFadeIn 260ms ease-out; }
.sticky-success-text { color:var(--success); font-weight: 650; }

/* S8 fix (2026-09-23 stabilization pass): a premium, real-progress
   Etsy upload card - replaces the earlier single-line pill. Every
   number here is real (computeSubmitProgress(), editor.js), never a
   fake timer. The fill's width TRANSITIONS because updateProgressCard()
   updates this SAME element's style.width across poll ticks rather
   than recreating it - a freshly-created element's initial width never
   animates. */
.etsy-progress-card {
  border-radius: 16px;
  background: rgba(var(--theme-rgb),0.045); border: 1px solid rgba(var(--theme-rgb),0.09);
  padding: 14px 16px; animation: statusFadeIn 200ms ease-out;
}
.etsy-progress-row { display: flex; align-items: center; justify-content: space-between; }
.etsy-progress-title { font-size: 13.5px; font-weight: 700; color: var(--text-primary); }
.etsy-progress-pct { font-size: 12.5px; font-weight: 700; color:var(--accent-ink); }
.etsy-progress-sub { font-size: 12px; color: var(--text-secondary); margin-top: 3px; }
.etsy-progress-track {
  margin-top: 10px; height: 5px; border-radius: 999px; overflow: hidden;
  background: rgba(var(--theme-rgb),0.08);
}
.etsy-progress-fill {
  height: 100%; border-radius: 999px;
  background: var(--accent); box-shadow: 0 0 8px rgba(var(--accent-rgb),0.45);
  transition: width 0.3s ease;
}
.etsy-progress-card.is-failed { border-color: rgba(255,94,94,0.35); }
.etsy-progress-card.is-failed .etsy-progress-title { color:var(--danger); }
.etsy-progress-card.is-success {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  min-height: 40px; animation: statusFadeIn 200ms ease-out;
}
.etsy-progress-check {
  width: 20px; height: 20px; border-radius: 999px; flex-shrink: 0;
  background: #3DDC84; color: #06210F; font-size: 12px; font-weight: 800;
  display: flex; align-items: center; justify-content: center;
}
.etsy-progress-card.is-success .etsy-progress-title { color:var(--success); }
@keyframes statusFadeIn { from { opacity: 0; transform: translateY(3px); } to { opacity: 1; transform: translateY(0); } }

/* Item 5 (2026-09-23 pass): brief highlight applied to the exact
   invalid field when "N items need attention" is tapped - a real,
   visible pulse rather than just a silent scroll/open. */
.field-needs-attention { border-radius:10px; animation:none; box-shadow:none !important; }
.field-input.field-needs-attention:not(:focus) { border-color:#B9872D; }
@keyframes fieldAttentionPulse { 0%,100% { opacity:1; } 50% { opacity:.72; } }

/* Real rewrite (2026-09-24, bug-fix pass): explicit reversal of the
   prior pass's #editorFilesList border-the-whole-list treatment, which
   produced real, reported corner/radius artifacts against the plain
   file cards inside it. A small amber header badge now carries the
   whole "needs attention" signal for Digital Files - the cards stay
   completely normal HERMES cards, no border/pulse/pseudo-element
   anywhere on the group itself. */
.editor-section-title-group { display: inline-flex; align-items: center; gap: 8px; }
.editor-section-warning-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10.5px; font-weight: 700; letter-spacing: 0.02em;
  color:var(--warning); background: rgba(245,196,83,0.12);
  border: 1px solid rgba(245,196,83,0.3);
  border-radius: 999px; padding: 3px 8px;
}
.editor-section-warning-badge.field-needs-attention-badge { animation: fieldAttentionPulse 1.6s ease-out; }

/* ---------------- ANALYTICS ---------------- */
.analytics-hero { margin: 6px 0 20px; }
.analytics-hero-value { font-size: 40px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.05; }
.analytics-hero-label { font-size: 12.5px; color: var(--text-secondary); margin-top: 2px; }
.analytics-secondary-row { display: flex; gap: 10px; margin-bottom: 12px; flex-wrap: wrap; }
.analytics-secondary-item { flex: 1; min-width: 64px; }
.analytics-secondary-value { font-size: 19px; font-weight: 750; }
.analytics-secondary-label { font-size: 11.5px; color: var(--text-secondary); margin-top: 2px; }

.poster-perf-header { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; }
.poster-perf-status { font-size: 12.5px; font-weight: 700; letter-spacing: 0.05em; color: var(--text-secondary); margin: 6px 0 18px; }
.poster-perf-open-btn { width: 100%; text-align: center; text-decoration: none; display: flex; align-items: center; justify-content: center; }

/* ---------------- PROCESSING ---------------- */
/* S7 (2026-09-23 stabilization pass): a real premium production-
   pipeline card, replacing the old stack of disconnected elements (a
   giant isolated percentage, a generic thin activity-track bar, a
   huge centered poster preview) with one cohesive component - a small
   poster thumbnail beside the name, stage+percent integrated into a
   single row directly above the bar (never floating alone), and a
   subtle blue glow riding the bar's own leading edge rather than a
   flat fill. Deliberately restrained: no gradients beyond the one
   glow, no neon, no bounce - Apple-level restraint, not gamer chrome. */
.processing-card {
  text-align: left; padding: 18px 16px 8px;
  background: rgba(var(--theme-rgb),0.035); border: 1px solid rgba(var(--theme-rgb),0.08);
  border-radius: 16px;
}
.processing-header-row { display: flex; align-items: center; gap: 12px; margin-bottom: 20px; }
.processing-poster-thumb {
  width: 74px; height: 94px; border-radius: 11px; object-fit: cover; flex-shrink: 0;
  background: rgba(var(--theme-rgb),0.06);
  box-shadow: 0 6px 16px -6px rgba(0,0,0,0.5);
}
.processing-header-info { min-width: 0; flex:1; }
.processing-cancel-job { appearance:none; -webkit-appearance:none; position:relative; width:44px; height:44px; flex:0 0 44px; padding:0; border:1px solid rgba(var(--theme-rgb),.09); border-radius:50%; background:rgba(var(--theme-rgb),.045); color:transparent; font-size:0; line-height:1; display:none; align-items:center; justify-content:center; text-align:center; }
.processing-cancel-job::before,.processing-cancel-job::after { content:""; position:absolute; left:50%; top:50%; width:13px; height:1.5px; border-radius:2px; background:var(--text-secondary); transform:translate(-50%,-50%) rotate(45deg); }
.processing-cancel-job::after { transform:translate(-50%,-50%) rotate(-45deg); }
.processing-cancel-job:active { background:rgba(180,35,50,.18); color:#F2B7BC; }
.processing-cancel-job:active::before,.processing-cancel-job:active::after { background:#F2B7BC; }
.processing-eyebrow { font-size: 10.5px; font-weight: 750; letter-spacing: 0.1em; color: var(--text-tertiary); text-transform: uppercase; }
.processing-name {
  font-size: 14.5px; font-weight: 700; letter-spacing: 0.005em; margin-top: 2px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.processing-progress-row { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 8px; }
.processing-stage {
  font-size: 13px; color: var(--text-secondary-strong); font-weight: 600;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.processing-percent { font-size: 13px; font-weight: 750; color:var(--accent-ink); flex-shrink: 0; font-variant-numeric: tabular-nums; }
.processing-progress-track {
  height: 6px; border-radius: 999px; background: rgba(var(--theme-rgb),0.07); overflow: hidden;
  margin-bottom: 24px; position: relative;
}
.processing-progress-fill {
  height: 100%; border-radius: 999px; background: var(--accent);
  transition: width 0.3s linear; position: relative;
}
/* The glow rides only the fill's own leading edge, not the whole bar -
   a small radial highlight, not a full-length neon strip. */
.processing-progress-fill::after {
  content: ""; position: absolute; right: -1px; top: 50%; transform: translateY(-50%);
  width: 14px; height: 14px; border-radius: 999px;
  background: radial-gradient(circle, rgba(var(--accent-rgb),0.55) 0%, rgba(var(--accent-rgb),0) 70%);
}
.processing-checklist { display: flex; flex-direction: column; gap: 10px; text-align: left; padding:2px 0 6px; }
.processing-step { position:relative; display: flex; align-items: center; gap: 10px; min-height:20px; font-size: 13px; color:var(--text-secondary); transition: color 0.2s ease; }
.processing-step:not(:last-child)::after { content:""; position:absolute; left:8px; top:19px; bottom:-11px; width:1px; background:rgba(var(--theme-rgb),.08); }
.processing-step.is-active { color: var(--text-primary); font-weight: 650; }
.processing-step.is-done { color:var(--success); }
.processing-step.is-failed { color:var(--danger); }
.processing-step-icon { position:relative; z-index:1; width:17px; height:17px; flex:0 0 17px; box-sizing:border-box; border:1px solid rgba(var(--theme-rgb),.20); border-radius:50%; background:var(--app-surface); text-align:center; font-size:10px; display:flex; align-items:center; justify-content:center; }
.processing-step.is-done .processing-step-icon { border-color:rgba(61,220,132,.58); background:rgba(31,112,70,.55); color:#E9FFF1; font-size:10px; }
.processing-step.is-active .processing-step-icon { border-color:transparent; }
.processing-step.is-active .processing-step-icon::before { content:""; position:absolute; inset:0; border:1.7px solid rgba(var(--accent-rgb),.28); border-top-color:var(--accent); border-radius:50%; animation:processingStepSpin .9s linear infinite; }
@keyframes processingStepSpin { to { transform:rotate(360deg); } }
.processing-done-text, .processing-failed-text { font-size: 14px; margin: 28px 0 14px; }
.processing-failed-text { color:var(--danger); }
.processing-review-btn { width: 100%; max-width: 320px; }
.processing-progress-fill { transition:width 420ms cubic-bezier(.22,.7,.24,1); }
.processing-done-title { color:var(--text-primary); font-size:16px; font-weight:750; letter-spacing:.01em; }
.processing-done-actions .btn-primary { min-height:48px; font-size:14px; font-weight:700; }
#processingResult { text-align: center; }
.processing-done-title span { display:inline-grid; place-items:center; width:19px; height:19px; margin-right:6px; border-radius:50%; color:#eafff0; background:rgba(47,150,91,.32); font-size:12px; }
.processing-done-actions .processing-review-btn { max-width:320px; }
.processing-add-etsy-link { display:block; margin:8px auto 0; min-height:36px; padding:6px 14px; border:0; background:transparent; color:var(--text-secondary-strong); font:inherit; font-size:12px; font-weight:650; }
.processing-add-etsy-link:disabled { color:#37A96B; }
.view-processing-inline.is-completed { margin-top:20px; }
.view-processing-inline.is-completed .processing-card { padding:14px; display:flex; flex-direction:column; align-items:stretch; gap:10px; }
.view-processing-inline.is-completed .processing-header-row { gap:10px; margin:0; min-width:0; }
.view-processing-inline.is-completed .processing-poster-thumb { width:42px; height:54px; border-radius:8px; }
.view-processing-inline.is-completed .processing-eyebrow { color:var(--accent-ink); font-size:10px; letter-spacing:.06em; }
.view-processing-inline.is-completed .processing-progress-row,
.view-processing-inline.is-completed .processing-progress-track,
.view-processing-inline.is-completed .processing-checklist,
.view-processing-inline.is-completed #processingAddPostersBtn { display:none !important; }
.view-processing-inline.is-completed #processingResult { display:flex !important; flex-direction:column; align-items:stretch; gap:8px; text-align:left; }
.view-processing-inline.is-completed .processing-done-title { display:block; margin:0; font-size:15px; }
.view-processing-inline.is-completed .processing-done-actions { display:block; }
.view-processing-inline.is-completed .processing-review-btn { width:100%; min-height:42px; padding:0 12px; white-space:nowrap; }
.view-processing-inline.is-completed .processing-completed-secondary { display:flex; align-items:center; justify-content:center; margin-top:0; }
.view-processing-inline.is-completed .processing-add-etsy-link { min-height:32px; margin:0; padding:3px 8px; background:transparent; border:0; color:var(--text-secondary-strong); font:inherit; font-size:12px; font-weight:650; }
#view-analytics .section-block:has(#analyticsTopPosters) { margin-top:23px; }
#view-analytics .section-block:has(#analyticsTopPosters) > .section-label { display:block; margin-bottom:9px; }

@media (min-width: 480px) {
  .app-main { padding-left: 20px; padding-right: 20px; }
}

/* ================================================================
   Splash - original Hermes composition: the glyph and full wordmark
   appear over the animated LED orb, then dissolve into the app.
   ================================================================ */
.splash-screen {
  position: fixed; inset: 0; z-index: 200;
  background:var(--app-background);
  display: flex; align-items: center; justify-content: center;
  overflow: hidden;
  transition: opacity 0.2s ease;
}
.splash-screen.is-dissolving { opacity: 0; pointer-events: none; }
.splash-content {
  display: flex; flex-direction: column; align-items: center;
}
/* Restore the original Hermes soft LED orb and its exact dark lavender-blue
   tint, blur, scale, and reveal timing. The native LaunchScreen is now only
   black, so the first logo the user sees belongs to this full composition. */
.splash-mark-wrap {
  position: relative;
  width: 72px; height: 72px;
  display: flex; align-items: center; justify-content: center;
}
.splash-orb {
  position: absolute; left: 50%; top: 50%;
  width: 220px; height: 220px;
  transform: translate(-50%, -50%) scale(0.85);
  border-radius: 999px;
  background: radial-gradient(circle, rgba(76,110,245,0.22) 0%, rgba(45,58,92,0.10) 45%, rgba(0,0,0,0) 72%);
  opacity: 0;
  filter: blur(2px);
  animation: splashOrbReveal 500ms ease-out 100ms forwards;
  pointer-events: none;
}
@keyframes splashOrbReveal {
  0%   { opacity: 0;   transform: translate(-50%, -50%) scale(0.85); }
  60%  { opacity: 1;   transform: translate(-50%, -50%) scale(1.02); }
  100% { opacity: 0.85; transform: translate(-50%, -50%) scale(1); }
}
.splash-mark {
  position: relative; z-index: 1;
  width: 68px; height: 68px; object-fit: contain;
  opacity: 0;
  transform: scale(0.96);
  animation: splashSymbolReveal 260ms ease-out 120ms forwards;
}
@keyframes splashSymbolReveal {
  0%   { opacity: 0; transform: scale(0.96); filter: brightness(0.6); }
  100% { opacity: 1; transform: scale(1);    filter: brightness(1) drop-shadow(0 0 10px rgba(var(--theme-rgb),0.22)); }
}
.splash-wordmark {
  margin-top: 16px; height: 13px; width: auto; object-fit: contain;
  opacity: 0;
  /* Reveal the wordmark with the glyph so the stylized H is never shown
     alone during the handoff from the black native launch screen. */
  animation: splashWordmarkReveal 200ms ease-out 120ms forwards;
}
@keyframes splashWordmarkReveal {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@media (prefers-reduced-motion: reduce) {
  .splash-orb, .splash-mark, .splash-wordmark { animation: none !important; opacity: 1 !important; filter: none !important; transform: none !important; }
  .splash-orb { opacity: 0.6 !important; }
}
.splash-screen.is-reduced-motion .splash-orb,
.splash-screen.is-reduced-motion .splash-mark,
.splash-screen.is-reduced-motion .splash-wordmark {
  animation: none !important; opacity: 1 !important; filter: none !important; transform: none !important;
}
.splash-screen.is-reduced-motion .splash-orb { opacity: 0.6 !important; }

/* ================================================================
   HOME
   ================================================================ */
/* Real, shared Hermes brand mark (item 14) - original glyph and wordmark
   image assets, never a typed-text approximation. The app icon remains
   an independent asset from the animated launch composition. */
.hermes-brand { display: inline-flex; align-items: center; gap: 7px; }
.hermes-home-button { border: 0; padding: 8px; margin: -8px; background: transparent; cursor: pointer; }
.app-header-glyph { width: 16px; height: 16px; display: block; }
.hermes-brand-wordmark-crop { display:block; width:78px; height:10px; overflow:hidden; flex:0 0 78px; }
.hermes-brand-wordmark { height:10px; width:auto; max-width:none; display:block; transform:translateX(-15.6px); }
.home-greeting-block { margin: 0 0 16px; }
.home-greeting { font-size: clamp(18px, 5.4vw, 22px); font-weight: 750; letter-spacing: -0.02em; line-height: 1.25; white-space: nowrap; }
/* S15: the hand alone animates - the surrounding text never moves.
   transform-origin near the wrist (bottom-left of the glyph) so the
   rotation reads as a natural wave, not a spin around the hand's
   center. ~3 waves in ~1s, plays once (no infinite loop). */
.wave-hand { display: inline-block; transform-origin: 70% 70%; }
.wave-hand.is-waving { animation: waveHand 1s ease-in-out 1; }
@keyframes waveHand {
  0% { transform: rotate(0deg); }
  15% { transform: rotate(18deg); }
  30% { transform: rotate(-8deg); }
  45% { transform: rotate(18deg); }
  60% { transform: rotate(-8deg); }
  75% { transform: rotate(14deg); }
  100% { transform: rotate(0deg); }
}
@media (prefers-reduced-motion: reduce) {
  .wave-hand.is-waving { animation: none !important; }
}
.home-tagline { font-size: 13px; color: var(--text-secondary); margin-top: 6px; }

/* Home revenue and current-month Store Goals share the primary card;
   range-bound Orders/Listings/Profit remain in their own compact card. */
.home-perf-skeleton {
  height: 150px; border-radius: 16px; margin-bottom: 18px; padding: 18px; box-sizing: border-box;
  background: linear-gradient(90deg, rgba(var(--theme-rgb),0.04) 25%, rgba(var(--theme-rgb),0.08) 37%, rgba(var(--theme-rgb),0.04) 63%);
  background-size: 400% 100%; animation: hermesShimmer 1.4s ease infinite;
}
.home-perf-skeleton span, .home-perf-skeleton i, .home-perf-skeleton b { display:block; height:10px; border-radius:8px; background:rgba(0,0,0,.26); margin-bottom:12px; }
.home-perf-skeleton span { width:74px; height:24px; }
.home-perf-skeleton i { width:46%; }
.home-perf-skeleton b { width:100%; height:48px; margin-top:24px; }
.home-metrics-error { min-height:56px; padding:0 14px; margin-bottom:18px; display:flex; align-items:center; justify-content:space-between; border:1px solid rgba(var(--theme-rgb),.08); border-radius:14px; background:rgba(var(--theme-rgb),.035); color:var(--text-secondary); font-size:13px; }
.home-metrics-error button { border:0; background:transparent; color:var(--accent-ink); font:inherit; font-weight:650; padding:8px; }
/* Polish pass (2026-09-23, item 12): dark frosted glass, not bright
   Apple-style "liquid glass" - a low-opacity white fill + backdrop
   blur so the page's own deep-purple gradient reads faintly through
   the card, a thin low-opacity border, and a soft outer shadow for
   depth. Home's information architecture/content is untouched - this
   only changes the card surface treatment. */
.home-perf-card {
  background: rgba(var(--theme-rgb),0.045); border: 1px solid rgba(var(--theme-rgb),0.1);
  border-radius: 16px; padding: 16px 16px 14px; margin-bottom: 10px;
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  box-shadow: inset 0 1px 0 rgba(var(--theme-rgb),0.05), 0 10px 30px -12px rgba(0,0,0,0.5);
}
.home-perf-range-chips { margin-bottom: 12px; }
.range-request-status { display:flex; align-items:center; justify-content:center; gap:7px; width:max-content; margin:-5px auto 8px; color:var(--text-secondary); font-size:10px; line-height:16px; }
.range-request-status[hidden] { display:none; }
.range-request-status .pull-refresh-spinner { width:13px; height:13px; border-width:1.7px; }
.range-request-status .is-button-spinner { margin:0; }
.is-range-loading .home-perf-primary,
.is-range-loading .home-perf-chart-block,
.is-range-loading .home-perf-secondary-row,
.is-range-loading .analytics-hero-card,
.is-range-loading .analytics-chart-block,
.is-range-loading .analytics-metrics-grid,
.is-range-loading .analytics-top-posters { opacity:.64; transition:opacity 140ms ease-out; }
.range-request-status:not([hidden]) + * { transition:opacity 140ms ease-out; }
.home-perf-primary-value { font-size: 34px; font-weight: 750; letter-spacing: -0.02em; line-height: 1.05; transition: opacity 0.15s ease; font-variant-numeric:tabular-nums; white-space:nowrap; }
.rolling-number { display:inline-flex; align-items:flex-start; height:1.05em; white-space:nowrap; vertical-align:top; font-variant-numeric:tabular-nums; }
.rolling-digit { display:inline-block; width:.62em; flex:none; overflow:hidden; vertical-align:top; contain:layout paint; }
.rolling-digit-track { display:flex; flex-direction:column; transform:translate3d(0,0,0); filter:blur(0px); }
.rolling-digit-face { display:block; width:100%; flex:none; text-align:center; }
.rolling-static { display:inline-block; flex:none; white-space:pre; vertical-align:top; }
.analytics-hero-value,.analytics-chart-tooltip-value { white-space:nowrap; }
@media (prefers-reduced-motion:reduce) { .rolling-digit-track { transition:none !important; } }
.home-perf-primary-label { font-size: 12.5px; color: var(--text-secondary); margin-top: 2px; }
/* Keep the same clipped reel and compositing layer at rest and in motion.
   Per-frame blur follows the reel's sampled easing velocity and returns to
   blur(0px); no mask/filter toggle is performed at animation completion. */
.rolling-digit { -webkit-mask-image:none; mask-image:none; }
.rolling-number { isolation:isolate; }
.rolling-digit-track { backface-visibility:hidden; }
.rolling-number-static { display:inline-block; height:1.05em; line-height:1.05; white-space:nowrap; vertical-align:top; font-variant-numeric:tabular-nums; }

/* A dragged Mockup is moved to body to escape grid clipping. Keep its outer
   preview transparent; the image frame owns the exact rounded clipping for
   artwork, bottom title treatment, and favorite control. */
.library-card.is-mockup.is-dragging {
  overflow:visible;
  border-radius:18px;
  background:transparent;
  box-shadow:none;
  filter:none;
  transform-origin:center;
}
.library-card.is-mockup.is-dragging .library-card-content {
  overflow:visible;
  border-radius:18px;
  background:transparent;
}
.library-card.is-mockup.is-dragging .library-card-image {
  overflow:hidden;
  border-radius:18px;
  outline:1px solid rgba(var(--accent-rgb),.66);
  outline-offset:0;
  box-shadow:0 10px 24px rgba(0,0,0,.30),0 0 0 1px rgba(var(--accent-rgb),.16);
}
.library-card.is-mockup.is-dragging .library-card-thumb,
.library-card.is-mockup.is-dragging .library-card-image::after { border-radius:inherit; }
.home-perf-chart-block.analytics-chart-block { margin: 12px 0 16px; }
.home-chart { height: 64px; }
.home-performance-card { box-sizing:border-box; min-height:80px; margin:0; padding:7px 15px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:18px; background:rgba(var(--theme-rgb),.045); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.04),0 8px 24px -14px rgba(0,0,0,.42); }
.home-perf-secondary-row { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.home-perf-secondary-item { display:flex; min-width:0; min-height:64px; flex-direction:column; align-items:center; justify-content:center; text-align:center; }
.home-perf-secondary-icon { display: block; width: 16px; height: 16px; color: var(--text-secondary); margin-bottom: 6px; }
.home-perf-secondary-icon svg { width: 100%; height: 100%; }
.home-perf-secondary-value { max-width:100%; overflow:hidden; font-size: 15px; font-weight: 700; letter-spacing: -0.01em; text-overflow:ellipsis; white-space:nowrap; }
.home-perf-secondary-label { max-width:100%; overflow:hidden; font-size: 10.5px; color: var(--text-secondary); margin-top: 2px; text-overflow:ellipsis; white-space:nowrap; }
/* Est. Profit stays visually secondary even within the secondary row -
   a real, deliberate one-notch de-emphasis vs. Orders/Listings, since
   it's a derived estimate rather than a hard Etsy number. */
.home-perf-secondary-item.is-profit .home-perf-secondary-value { color: var(--text-secondary-strong); font-weight: 650; }
.home-perf-secondary-item.is-profit .home-perf-secondary-icon { color: var(--text-tertiary); }
.home-performance-card.is-range-loading .home-perf-secondary-row { opacity:.64; transition:opacity 140ms ease-out; }

/* Home dashboard uses one shared gap between its primary cards. */
#view-home { --home-card-gap:13px; }
#view-home #homeMetricsRow { margin-bottom:0; padding:14px 16px 12px; }
#view-home #homePerformanceMetricsCard { margin:var(--home-card-gap) 0 0; }
#view-home #homeFollowupSection { margin:var(--home-card-gap) 0 0; }

/* Store Goals replaces only the former Ads preview slot inside the Home
   performance card. It inherits Hermes type, surfaces, and theme accent. */
.store-goals-preview {
  display:flex; width:100%; min-width:0; flex-direction:column; gap:7px;
  margin:15px 0 0; padding:10px 11px; text-align:left; color:var(--text-primary);
  border:1px solid rgba(var(--theme-rgb),.09); border-radius:16px;
  background:linear-gradient(145deg,rgba(var(--accent-rgb),.055),rgba(var(--theme-rgb),.025) 55%);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.04); cursor:pointer; font:inherit;
  transition:border-color .18s ease, background .18s ease, transform .16s ease;
}
.store-goals-preview:active { transform:scale(.992); }
.store-goals-preview-heading,.store-goals-preview-title,.store-goals-month,.store-goals-progress-heading { display:flex; align-items:center; }
.store-goals-preview-heading { justify-content:space-between; gap:10px; }
.store-goals-preview-title { min-width:0; gap:8px; }
.store-goals-preview-title strong { font-size:13.5px; font-weight:700; }
.store-goals-target-icon { display:flex; width:20px; height:20px; flex:0 0 20px; color:var(--accent-ink); align-items:center; justify-content:center; }
.store-goals-target-icon svg { width:19px; height:19px; stroke:currentColor; stroke-width:1.5; }
.store-goals-month { box-sizing:border-box; display:inline-flex; min-height:24px; flex:0 0 auto; align-items:center; justify-content:center; gap:0; padding:0 9px; border:1px solid rgba(var(--accent-rgb),.17); border-radius:999px; background:rgba(var(--accent-rgb),.085); color:var(--accent-ink); font-size:9px; font-weight:700; letter-spacing:.07em; line-height:1; white-space:nowrap; }
.store-goals-month > span { display:block; line-height:1; text-align:center; }
.store-goals-details-link i { color:var(--accent-ink); font-style:normal; font-size:16px; line-height:1; }
.store-goals-progress-heading { justify-content:space-between; gap:12px; margin-top:1px; }
.store-goals-progress-copy { display:flex; min-width:0; flex:1 1 auto; align-items:baseline; gap:8px; flex-wrap:wrap; }
.store-goals-progress-copy > strong { min-width:0; overflow:hidden; color:var(--accent); font-size:18px; line-height:1.2; font-weight:720; letter-spacing:-.02em; text-overflow:ellipsis; white-space:nowrap; }
.store-goals-progress-copy > small { color:var(--text-secondary); font-size:11px; line-height:1.2; white-space:nowrap; }
.store-goals-progress-copy.has-goal > small::before { content:"/"; margin-right:8px; color:var(--text-tertiary); }
.store-goals-progress-heading > span:last-child { flex:0 0 auto; color:var(--accent-ink); font-size:13px; font-weight:650; }
.store-goals-visually-hidden { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.store-goals-progress-track { display:block; height:5px; overflow:hidden; border-radius:999px; background:rgba(var(--theme-rgb),.09); }
.store-goals-progress-track i { display:block; width:0; height:100%; border-radius:inherit; background:var(--accent); box-shadow:0 0 9px rgba(var(--accent-rgb),.42); transition:width .45s cubic-bezier(.2,.7,.2,1); }
.store-goals-metrics { display:grid; width:100%; min-width:0; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-flow:column; gap:0; padding-top:2px; }
.store-goals-metrics > span { position:relative; display:flex; min-width:0; flex-direction:column; align-items:center; gap:2px; padding:0 5px; text-align:center; }
.store-goals-metrics > span + span { border-left:1px solid rgba(var(--theme-rgb),.08); }
.store-goals-metric-icon { display:flex; width:13px; height:13px; flex:0 0 13px; align-items:center; justify-content:center; margin-bottom:1px; color:var(--accent); }
.store-goals-metric-icon svg { width:100%; height:100%; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.store-goals-metrics strong { max-width:100%; overflow:hidden; color:var(--text-primary); font-size:clamp(10px,3.4vw,13px); font-weight:680; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.store-goals-metrics small { color:var(--text-secondary); font-size:10px; line-height:1.2; }
.store-goals-metrics em { min-height:12px; overflow:hidden; color:var(--text-tertiary); font-size:9px; font-style:normal; line-height:1.2; text-overflow:ellipsis; white-space:nowrap; }
.store-goals-view-row { display:grid; min-height:34px; grid-template-columns:16px 1fr 12px; align-items:center; gap:8px; margin-top:2px; padding:0 10px; border:1px solid rgba(var(--theme-rgb),.075); border-radius:11px; background:rgba(var(--theme-rgb),.035); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.035),0 4px 12px -9px rgba(0,0,0,.45); }
.store-goals-view-row > i { display:flex; width:15px; height:15px; align-items:center; justify-content:center; color:var(--accent-ink); }
.store-goals-view-row > i svg { width:100%; height:100%; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.store-goals-view-row > strong { color:var(--text-secondary-strong); font-size:10px; font-weight:600; text-align:center; }
.store-goals-view-row > span { color:var(--accent-ink); font-size:16px; line-height:1; text-align:right; }
.store-goals-view { padding-bottom:calc(env(safe-area-inset-bottom) + 18px); }
.store-goals-detail-header { display:grid; grid-template-columns:42px 1fr 42px; align-items:center; min-height:48px; margin-bottom:14px; }
.store-goals-detail-header > .back-btn { justify-self:start; width:40px; height:40px; padding:0; font-size:25px; line-height:1; }
.store-goals-detail-header > div { text-align:center; }
.store-goals-detail-header h1 { margin:0; font-size:20px; font-weight:750; letter-spacing:-.02em; }
.store-goals-detail-header span { display:block; margin-top:3px; color:var(--text-secondary); font-size:10px; font-weight:650; letter-spacing:.06em; }
.store-goals-detail-card { padding:17px 16px 15px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:22px; background:linear-gradient(145deg,rgba(var(--accent-rgb),.06),rgba(var(--theme-rgb),.035) 58%); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.045); }
.store-goals-detail-kicker { color:var(--text-secondary); font-size:10px; font-weight:700; letter-spacing:.11em; }
.store-goals-detail-amount { display:flex; min-height:38px; align-items:baseline; gap:7px; margin-top:9px; }
.store-goals-detail-amount strong { min-width:0; color:var(--text-primary); font-size:29px; line-height:1.15; font-weight:750; letter-spacing:-.035em; }
.store-goals-detail-amount > span { color:var(--text-secondary); font-size:21px; line-height:1.15; }
.store-goals-detail-amount b { color:var(--text-primary); font-weight:650; }
.store-goals-detail-amount.is-unset { min-height:30px; align-items:center; }
.store-goals-detail-amount.is-unset strong { font-size:18px; font-weight:650; letter-spacing:-.01em; }
.store-goals-detail-actual { margin:3px 0 0; color:var(--text-secondary); font-size:12px; line-height:1.4; }
.store-goals-detail-actual[hidden] { display:none; }
.store-goals-detail-percent { margin:5px 0 9px; color:var(--accent-ink); font-size:13px; font-weight:650; }
.store-goals-detail-status { margin-top:9px; color:var(--text-secondary); font-size:12px; }
.store-goals-detail-metrics { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; overflow:hidden; margin-top:12px; border:1px solid rgba(var(--theme-rgb),.07); border-radius:17px; background:rgba(var(--theme-rgb),.06); }
.store-goals-detail-metrics > div { display:flex; min-height:76px; min-width:0; flex-direction:column; justify-content:center; gap:4px; padding:12px; background:rgba(var(--surface-rgb),.72); }
.store-goals-detail-metrics strong { overflow:hidden; font-size:16px; font-weight:700; text-overflow:ellipsis; white-space:nowrap; }
.store-goals-detail-metrics span { color:var(--text-secondary); font-size:11px; }
.store-goals-edit-button { display:flex; min-height:46px; justify-content:center; align-items:center; width:100%; margin-top:13px; border:1px solid rgba(var(--accent-rgb),.22); border-radius:15px; background:rgba(var(--accent-rgb),.13); color:var(--accent-ink); font:inherit; font-size:13px; font-weight:700; }
.store-goals-sync-note { margin:8px 2px 0; text-align:center; color:var(--text-tertiary); font-size:10px; }
.store-goals-error { margin:0 2px 8px; padding:0; border:0; border-radius:0; background:none; color:var(--text-secondary); font-size:11px; line-height:1.35; }
@media (prefers-reduced-motion:reduce) { .store-goals-preview,.store-goals-progress-track i { transition:none; } }
body.animations-disabled .store-goals-preview,body.animations-disabled .store-goals-progress-track i { transition:none; }

.store-goal-modal-backdrop { position:fixed; z-index:2701; inset:auto; left:var(--store-goal-viewport-left,0px); top:var(--store-goal-viewport-top,0px); right:auto; bottom:auto; display:flex; width:var(--store-goal-viewport-width,100%); height:var(--store-goal-viewport-height,100dvh); justify-content:center; align-items:center; overflow-y:auto; box-sizing:border-box; padding:max(16px,env(safe-area-inset-top)) max(20px,env(safe-area-inset-left),env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(20px,env(safe-area-inset-left),env(safe-area-inset-right)); background:rgba(0,0,0,.62); backdrop-filter:blur(9px); -webkit-backdrop-filter:blur(9px); }
.store-goal-modal-backdrop[hidden] { display:none !important; }
.store-goal-modal { position:relative; box-sizing:border-box; width:min(100%,390px); max-height:calc(var(--store-goal-viewport-height,100dvh) - 32px); margin-inline:auto; overflow-y:auto; overscroll-behavior:contain; padding:25px 20px 18px; border:1px solid rgba(var(--theme-rgb),.12); border-radius:24px; background:rgba(var(--surface-rgb),.96); box-shadow:0 22px 70px rgba(0,0,0,.42),inset 0 1px 0 rgba(var(--theme-rgb),.06); }
.store-goal-modal-close { position:absolute; top:10px; right:13px; width:36px; height:36px; border:0; border-radius:50%; background:transparent; color:var(--text-secondary); font-size:25px; }
.store-goal-modal h2 { margin:5px 40px 7px 0; color:var(--text-primary); font-size:19px; line-height:1.2; font-weight:740; letter-spacing:-.02em; }
.store-goal-modal > p:not(.store-goal-modal-error) { margin:0 0 17px; color:var(--text-secondary); font-size:13px; line-height:1.45; }
.store-goal-input-wrap { display:grid; box-sizing:border-box; width:100%; min-height:52px; grid-template-columns:max-content minmax(0,1fr); align-items:center; column-gap:8px; padding-inline:16px; border:1px solid rgba(var(--accent-rgb),.2); border-radius:15px; background:rgba(var(--theme-rgb),.055); color:var(--accent-ink); }
.store-goal-input-wrap > span { font-size:17px; font-weight:650; }
.store-goal-input-wrap input { box-sizing:border-box; display:block; width:100%; min-width:0; min-height:50px; margin:0; padding:12px 0; border:0; outline:0; -webkit-appearance:textfield; appearance:textfield; background:transparent; color:var(--text-primary); font:inherit; font-size:17px; font-weight:650; text-align:left; }
.store-goal-input-wrap input::-webkit-inner-spin-button,.store-goal-input-wrap input::-webkit-outer-spin-button { margin:0; -webkit-appearance:none; }
.store-goal-input-wrap input::placeholder { color:var(--text-tertiary); font-size:14px; font-weight:450; }
.store-goal-modal-error { margin:9px 1px 0; color:#ff9b9b; font-size:11px; }
.store-goal-modal-error[hidden] { display:none; }
.store-goal-modal-actions { display:flex; gap:10px; margin-top:19px; }
.store-goal-modal-actions button { min-height:46px; flex:1; border-radius:14px; font:inherit; font-size:13px; font-weight:680; }
.store-goal-not-now { border:1px solid rgba(var(--theme-rgb),.09); background:rgba(var(--theme-rgb),.045); color:var(--text-secondary); }
.store-goal-submit { border:1px solid rgba(var(--accent-rgb),.32); background:var(--accent); color:var(--accent-contrast); box-shadow:0 5px 16px rgba(var(--accent-rgb),.16); }
.store-goal-submit:disabled { opacity:.62; }
.store-goal-keypad[hidden] { display:none !important; }
.store-goal-keypad { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; width:100%; margin-top:14px; touch-action:manipulation; }
.store-goal-key { display:flex; box-sizing:border-box; min-width:0; min-height:48px; align-items:center; justify-content:center; border:1px solid rgba(var(--theme-rgb),.105); border-radius:13px; background:rgba(var(--theme-rgb),.07); color:var(--text-primary); font:inherit; font-size:18px; font-weight:620; line-height:1; -webkit-tap-highlight-color:transparent; transition:transform .12s ease,background-color .12s ease,border-color .12s ease; }
.store-goal-key:active { transform:scale(.97); border-color:rgba(var(--accent-rgb),.34); background:rgba(var(--accent-rgb),.13); }
.store-goal-key:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.store-goal-key-delete { color:var(--accent-ink); font-size:21px; }
.store-goal-modal.has-native-keypad .store-goal-input-wrap input { caret-color:var(--accent); }
.store-goal-modal.has-native-keypad .store-goal-modal-actions { display:flex; flex-direction:column; gap:8px; margin-top:12px; }
.store-goal-modal.has-native-keypad .store-goal-modal-actions button { width:100%; min-height:48px; flex:none; }
.store-goal-modal.has-native-keypad .store-goal-submit { order:0; }
.store-goal-modal.has-native-keypad .store-goal-not-now { order:1; }
@media (prefers-reduced-motion:reduce) { .store-goal-key { transition:none; } }
body.animations-disabled .store-goal-key { transition:none; }

/* Etsy Ads Intelligence uses the existing Hermes page, glass, and button
   tokens. Empty reporting stays calm and informative; no ad data is inferred. */
.etsy-ads-view { padding-bottom:calc(env(safe-area-inset-bottom) + 16px); }
.etsy-ads-header { position:relative; display:grid; grid-template-columns:40px 1fr 40px; align-items:center; min-height:52px; margin:0 0 20px; }
.etsy-ads-back { justify-self:start; width:40px; height:40px; padding:0; font-size:25px; line-height:1; }
.etsy-ads-title { text-align:center; }
.etsy-ads-title h1 { margin:0; font-size:20px; font-weight:750; letter-spacing:-.02em; }
.etsy-ads-title span { display:block; margin-top:3px; color:var(--text-secondary); font-size:9px; font-weight:700; letter-spacing:.14em; }
.etsy-ads-section-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:0 1px 10px; }
.etsy-ads-section-heading h2 { margin:0; font-size:16px; font-weight:700; letter-spacing:-.01em; }
.etsy-ads-section-heading > span { color:var(--text-secondary); font-size:11px; }
.etsy-ads-overview { margin-bottom:25px; padding:14px; border:1px solid rgba(var(--theme-rgb),.085); border-radius:20px; background:rgba(var(--theme-rgb),.04); backdrop-filter:blur(16px); -webkit-backdrop-filter:blur(16px); }
.etsy-ads-metrics-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1px; overflow:hidden; border:1px solid rgba(var(--theme-rgb),.065); border-radius:14px; background:rgba(var(--theme-rgb),.065); }
.etsy-ads-metrics-grid > div { display:flex; min-width:0; min-height:78px; flex-direction:column; justify-content:center; gap:4px; padding:11px 12px; background:rgba(var(--surface-rgb),.72); }
.etsy-ads-metrics-grid strong { font-size:20px; font-weight:700; letter-spacing:-.02em; }
.etsy-ads-metrics-grid span { color:var(--text-secondary); font-size:11px; }
.etsy-ads-sync { display:flex; justify-content:space-between; gap:10px; margin:10px 1px 0; color:var(--text-tertiary); font-size:10.5px; }
.etsy-ads-sync span { color:var(--text-secondary); }
.etsy-ads-recommendations { margin-bottom:24px; }
.etsy-ads-unavailable { display:flex; flex-direction:column; gap:6px; padding:15px; border:1px solid rgba(var(--theme-rgb),.08); border-radius:16px; background:rgba(var(--theme-rgb),.035); }
.etsy-ads-unavailable[hidden],.etsy-ads-recommendation-list[hidden] { display:none !important; }
.etsy-ads-unavailable strong { color:var(--text-primary); font-size:13px; font-weight:650; }
.etsy-ads-unavailable p { margin:0; color:var(--text-secondary); font-size:12px; line-height:1.5; }
.etsy-ads-recommendation-list { display:flex; flex-direction:column; gap:8px; }
@media (max-width:360px) {
  .store-goals-preview { gap:8px; padding:11px; }
  .store-goals-progress-heading strong { font-size:16px; }
  .etsy-ads-overview { padding:11px; }
}

.home-create-cta {
  width: 100%; min-height: 50px; border-radius: 14px;
  background: var(--text-primary); color: var(--app-background); border: none;
  font-size: 14.5px; font-weight: 750;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  margin-bottom: 14px; cursor: pointer;
}
.home-create-cta-icon { font-size: 17px; line-height: 1; }
.home-create-cta-arrow { width: 16px; height: 16px; }

.home-active-job-card {
  display: block; width: 100%; text-align: left; background: rgba(var(--accent-rgb),0.10);
  border: 1px solid rgba(var(--accent-rgb),0.25); border-radius: 12px; padding: 11px 14px;
  margin-bottom: 20px; cursor: pointer; font-family: inherit; -webkit-tap-highlight-color: transparent;
}
.home-active-job-title-row { display: flex; align-items: center; gap: 7px; margin-bottom: 5px; }
.home-active-job-dot { width: 7px; height: 7px; border-radius: 999px; background: var(--accent); flex-shrink: 0; animation: processingPulse 1.1s ease-in-out infinite; }
/* flex:1 + min-width:0 is required for the ellipsis below to actually
   engage - without it a flex item won't shrink past its content size
   and long text pushes the whole card wider than the viewport. */
.home-active-job-title { flex: 1; min-width: 0; font-size: 13px; font-weight: 650; color: var(--text-primary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-active-job-stage-row { display: flex; align-items: baseline; justify-content: space-between; gap: 8px; margin-bottom: 6px; }
.home-active-job-stage { flex: 1; min-width: 0; font-size: 12px; color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.home-active-job-percent { font-size: 12px; font-weight: 700; color:var(--accent-ink); flex-shrink: 0; }

.home-tools-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 10px; }
.home-tool-card {
  min-height: 68px; border-radius: 14px;
  background: rgba(var(--theme-rgb),0.045); border: 1px solid rgba(var(--theme-rgb),0.1);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  box-shadow: inset 0 1px 0 rgba(var(--theme-rgb),0.05);
  display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 8px;
  padding: 0 16px; font-size: 13.5px; font-weight: 650; color: var(--text-primary); cursor: pointer;
}
.home-tool-icon { width: 18px; height: 18px; color: var(--text-secondary); }
.home-tool-icon svg { width: 100%; height: 100%; }

/* ================================================================
   CREATE
   ================================================================ */
#view-create { padding-bottom: 90px; }
#view-listing-editor { padding-bottom: calc(150px + env(safe-area-inset-bottom)); scroll-padding-block: 20px calc(150px + env(safe-area-inset-bottom)); }
.view-header-centered { text-align: center; font-size: 17px; font-weight: 750; margin: 2px 0 16px; }
.create-type-tabs { margin-bottom: 16px; }
.create-drop-card {
  padding: 34px 20px; border-radius: 18px;
  border: 1.5px dashed rgba(var(--theme-rgb),0.14); text-align: center;
}
.create-drop-icon { width: 40px; height: 40px; margin: 0 auto 16px; color: var(--text-tertiary); transition: color 0.18s ease; }
.create-drop-icon svg { width: 100%; height: 100%; }
/* Item 9: the custom poster-outline + upload-arrow glyph animates
   toward Hermes blue on the real interactions mobile actually has for
   "selecting a file" (there's no native drag-and-drop on a phone) -
   an active tap/press on the drop card, or keyboard/VoiceOver focus
   landing on its file-picker control. */
.create-drop-card:active .create-drop-icon,
.create-drop-card:focus-within .create-drop-icon,
.create-drop-card.is-drag-active .create-drop-icon { color:var(--accent-ink); }
.create-drop-title { font-size: 15px; font-weight: 700; margin: 0 0 4px; }
.create-drop-body { font-size: 12.5px; color: var(--text-tertiary); margin: 0 0 20px; }
.create-upload-error {
  font-size: 13px; color:var(--danger); text-align: center;
  background: rgba(255,94,94,0.1); border: 1px solid rgba(255,94,94,0.25);
  border-radius: 10px; padding: 10px 14px; margin: 12px 0 0;
}
.create-picker-row { display: flex; gap: 8px; justify-content: center; }
.create-picker-btn { min-width: 160px; text-align: center; display: flex; align-items: center; justify-content: center; cursor: pointer; }
.create-picker-row-secondary { margin-top: 14px; gap: 18px; }
.create-picker-link { font-size: 13px; font-weight: 650; color:var(--accent-ink); cursor: pointer; }

.create-preview-card { margin-top: 14px; text-align: center; }
.create-preview-metadata { margin:8px 0 12px; color:var(--text-secondary); font-size:11px; font-variant-numeric:tabular-nums; }
.create-preview-img { width: 100%; max-height: 260px; object-fit: cover; border-radius: 16px; margin-bottom: 8px; }
.create-preview-name { font-size: 13px; color: var(--text-secondary); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.create-capability-list { margin-top: 18px; display: flex; flex-direction: column; }
.create-capability-row {
  display: flex; align-items: center; gap: 12px;
  padding: 13px 2px; border-bottom: 1px solid rgba(var(--theme-rgb),0.07); cursor: pointer;
}
.create-capability-row:last-child { border-bottom: none; }
.create-capability-icon { width: 19px; height: 19px; color: var(--text-secondary); flex-shrink: 0; }
.create-capability-icon svg { width: 100%; height: 100%; }
.create-capability-text { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.create-capability-title { font-size: 14px; font-weight: 650; }
.create-capability-sub { font-size: 12px; color: var(--text-secondary); margin-top: 1px; }

.ios-toggle { position: relative; display: inline-block; flex-shrink: 0; }
.ios-toggle input { opacity: 0; width: 0; height: 0; position: absolute; }
.ios-toggle-track {
  display: block; width: 44px; height: 26px; border-radius: 999px;
  background: rgba(var(--theme-rgb),0.14); transition: background-color 0.15s ease; position: relative;
}
.ios-toggle-thumb {
  position: absolute; top: 2px; left: 2px; width: 22px; height: 22px; border-radius: 999px;
  background: #fff; transition: transform 0.15s ease; box-shadow: 0 1px 3px rgba(0,0,0,0.3);
}
.ios-toggle input:checked + .ios-toggle-track { background: var(--accent); }
.ios-toggle input:checked + .ios-toggle-track .ios-toggle-thumb { transform: translateX(18px); }

.create-uploading-card { margin-top: 40px; text-align: center; }
.create-uploading-text { font-size: 14px; color: var(--text-secondary); }
.create-selection-count { min-height:17px; margin:6px 0 0; color:var(--text-secondary); font-size:11px; }
.create-job-queue { margin:14px 0 24px; padding:13px 14px 5px; border:1px solid rgba(var(--theme-rgb),.075); border-radius:15px; background:rgba(var(--theme-rgb),.025); }
.create-queue-title { margin:0 0 8px; color:var(--text-secondary); font-size:10px; font-weight:750; letter-spacing:.13em; }
.create-queue-row { display:flex; align-items:center; gap:8px; min-height:50px; border-top:1px solid rgba(var(--theme-rgb),.055); }
.create-queue-copy { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.create-queue-copy span { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; color:var(--text-primary); font-size:12.5px; font-weight:600; }
.create-queue-copy small { color:var(--text-secondary); font-size:9px; letter-spacing:.07em; }
.create-queue-actions { display:flex; gap:8px; }
.create-queue-actions button { border:0; background:transparent; color:var(--accent-ink); font:inherit; font-size:11px; font-weight:650; padding:7px 2px; }

.create-sticky-footer {
  position: fixed; left: 0; right: 0; bottom: calc(56px + env(safe-area-inset-bottom));
  z-index: 25; padding: 12px 18px;
  background: rgba(var(--chrome-rgb),0.94);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-top: 1px solid rgba(var(--theme-rgb),0.08);
}
.create-start-btn { width: 100%; margin-bottom: 8px; display: flex; align-items: center; justify-content: center; gap: 6px; }
.create-cancel-btn { width: 100%; }

.processing-done-title { font-size: 17px; font-weight: 750; margin: 20px 0 14px; }
.processing-done-actions { display: flex; flex-direction: column; gap: 8px; max-width: 280px; margin: 0 auto; }
.processing-done-actions > button { width: 100%; }
.processing-failed-title { font-size: 15px; font-weight: 700; color:var(--danger); margin: 20px 0 8px; }
.processing-add-another-btn { width: 100%; max-width: 280px; margin: 18px auto 0; display: block; }

/* ================================================================
   LIBRARY
   ================================================================ */
.library-header-row { display: flex; align-items: center; justify-content: space-between; margin: 2px 0 16px; }
.library-title { font-size: 24px; font-weight: 750; letter-spacing: -0.01em; margin: 0; }
.library-header-actions { display: flex; align-items: center; gap: 8px; }
.icon-only-btn { background: none; border: none; color: var(--text-primary); width: 24px; height: 24px; cursor: pointer; }
.icon-only-btn svg { width: 100%; height: 100%; }
.text-link-btn { background: none; border: none; color:var(--accent-ink); font-size: 14px; font-weight: 650; cursor: pointer; padding: 0; }
.library-action-pill { position:relative; display:inline-flex; align-items:center; justify-content:center; min-height:34px; padding:0 13px; border:1px solid rgba(var(--accent-rgb),.12); border-radius:999px; color:var(--accent-ink); font-size:12px; line-height:1; white-space:nowrap; -webkit-backdrop-filter:var(--hermes-glass-blur); backdrop-filter:var(--hermes-glass-blur); }

.library-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; margin-top: 4px; max-width: 100%; overflow-x: hidden; }
.library-grid-skeleton { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
/* min-width:0 is required on a grid item for its own nowrap/ellipsis
   children to actually shrink - without it, a long unbroken card name
   can force the 1fr column (and the whole grid) wider than the
   viewport. */
.library-card { cursor: pointer; min-width: 0; position: relative; }
/* S5: real Select mode - a subtle blue ring + check indicator on the
   selected card, nothing on unselected/non-selectable cards beyond a
   slight dim (so it's obvious at a glance which items are eligible). */
.library-card.is-selectable { opacity: 1; }
.library-grid:has(.library-card.is-selectable) .library-card:not(.is-selectable) { opacity: 0.4; }
/* The image owns the selection geometry; title/metadata remain outside. */
.library-card-image { position: relative; aspect-ratio: 3/4; border-radius: 12px; overflow: hidden; margin-bottom: 8px; }
.library-card-image::before { content:""; position:absolute; z-index:0; inset:0; background:linear-gradient(105deg,rgba(var(--theme-rgb),.025) 24%,rgba(var(--theme-rgb),.075) 42%,rgba(var(--theme-rgb),.025) 62%); background-size:220% 100%; opacity:0; transition:opacity .2s ease; }
.library-card-image.is-loading::before { opacity:1; animation:library-thumb-shimmer 1.25s ease-in-out infinite; }
.library-card-image.is-failed::before { opacity:1; animation:none; background:rgba(var(--theme-rgb),.035); }
@keyframes library-thumb-shimmer { to { background-position-x:-220%; } }
.library-card.is-selected .library-card-image::after { content: ''; position: absolute; inset: 0; border: 2px solid var(--accent); border-radius: inherit; pointer-events: none; }
.library-card-content { position: relative; background: var(--app-background); transition: transform .18s ease-out; }
.library-card { overflow: hidden; touch-action: pan-y; }
.library-card img { display: block; -webkit-user-drag: none; -webkit-touch-callout: none; pointer-events: none; }
.library-card, .library-card * { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
.library-card .library-card-thumb { height: 100%; margin: 0; border-radius: inherit; }
.library-card-image .library-card-thumb { position:relative; z-index:1; opacity:0; transition:opacity .2s ease; }
.library-card-image.has-image .library-card-thumb { opacity:1; }
.library-swipe-delete { position: absolute; right: 0; top: 0; width: 72px; height: 100%; border: 0; border-radius: 12px; background: #B42332; color: white; font: inherit; font-size: 13px; font-weight: 650; }
.library-swipe-delete:disabled { visibility: hidden; }
.listing-swipe-delete { width: 76px; z-index: 0; border-radius: 0 12px 12px 0; }
.listings-list .listing-swipe-delete { opacity:var(--swipe-progress,0); pointer-events:none; transition:none; }
.listings-list [data-key].is-swiping .listing-swipe-delete,
.listings-list [data-key].is-swiped .listing-swipe-delete { pointer-events:auto; }
.listings-list [data-key].is-settling .listing-swipe-delete { transition:opacity 180ms ease-out; }
.listing-thumb-fallback { color:var(--text-secondary); font-size:17px; font-weight:600; line-height:1; }
.listing-row-body { flex:1; min-width:0; }
.listing-row > .listing-status-pill { margin-left:auto; }
.library-card.is-dragging { overflow: visible; }
.library-card-check { display: none; }
.library-card.is-selectable .library-card-check {
  display: flex; align-items: center; justify-content: center;
  position: absolute; top: 4px; left: 4px; z-index: 2;
  width: 40px; height: 40px;
}
.library-card-check-circle {
  display: flex; align-items: center; justify-content: center;
  width: 26px; height: 26px; border-radius: 999px;
  background: rgba(var(--chrome-rgb),0.6); border: 1.5px solid rgba(var(--theme-rgb),0.5);
  box-shadow: 0 1px 4px rgba(0,0,0,0.35);
}
.library-card-check-icon { width: 14px; height: 14px; color: transparent; }
.library-card.is-selected .library-card-check-circle { background: var(--accent); border-color: var(--accent); }
.library-card.is-selected .library-card-check-icon { color:var(--accent-contrast); }
.library-selection-bar {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 14px; font-size: 13px; color: var(--text-secondary-strong);
}
.library-selection-actions { display: flex; align-items: center; gap: 16px; }
.btn-danger-small {
  background: rgba(255,94,94,0.12); border: 1px solid rgba(255,94,94,0.35);
  color:var(--danger); font-size: 13px; font-weight: 700; border-radius: 999px;
  padding: 7px 16px; cursor: pointer; min-height: 32px;
}
.btn-danger-small:disabled { opacity: 0.4; cursor: default; }
/* S6: restrained - small, dark, translucent chip in the corner, never
   a giant/yellow star. Filled + accent color only once favorited. */
/* S20: the visible chip stays small/restrained (28px), but the real
   tap target is grown via padding (not a visual size change) - a
   corner control on a compact grid card can't reach the full 44pt
   guideline without overlapping the neighboring card's own hit area
   (14px grid gap), so this is the practical maximum comfortable size
   in this exact layout. */
/* Real root-cause fix (2026-09-24, bug-fix pass): this is a raw
   <button> with no browser-default reset anywhere in this stylesheet
   (only `button,input{font-family:inherit}` exists globally) - the
   browser's own default white/gray button chrome was rendering BEHIND
   the intentional circular ::before, which is exactly the reported
   "white square with a circle inside it" artifact. One simple floating
   glass circle now, equal inset from top/right, no nested shapes. The
   six-dot drag handle (opposite corner) is removed entirely per
   explicit instruction - the whole card is draggable by long-press
   (see wireMockupCardDrag in library.js). */
.mockup-favorite-star {
  all: unset; box-sizing: border-box; cursor: pointer;
  position: absolute; top: 8px; right: 8px; z-index: 3;
  width: 36px; height: 36px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(var(--chrome-rgb),0.55); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px);
  border: 1px solid rgba(var(--theme-rgb),0.14); border-radius: 999px;
  box-shadow: 0 1px 4px rgba(0,0,0,0.3);
}
.mockup-favorite-star svg { width: 16px; height: 16px; color: rgba(var(--theme-rgb),0.6); }
.mockup-favorite-star.is-favorite svg { color: #F5B93B; }
.mockup-favorite-star.is-favorite { border-color: rgba(245,185,59,0.4); }
/* Real iOS Safari bug (same as editor.js's media tiles): a hold on a
   plain image triggers the native Save/Copy/Share callout before any
   JS handler runs - suppressed on the whole card, not just the handle,
   since the callout can be triggered by holding anywhere on the image
   even though only the handle can actually START a drag. */
.library-card.is-mockup { -webkit-touch-callout: none; -webkit-user-select: none; user-select: none; }
/* Real rewrite (2026-09-24, bug-fix pass): the dragged card is
   promoted to position:fixed at drag start (see startMockupDrag in
   library.js), completely decoupled from the grid's own layout/
   overflow-clipping - so a fixed-position element is NEVER clipped by
   .library-grid's overflow-x:hidden, which is what used to clip the
   old (non-fixed) .is-dragging outline on edge-column cards. The
   pointer-following transform is applied inline by JS on every move;
   this class only supplies the static lift/scale/outline/shadow look. */
.library-card.is-dragging {
  z-index: 500;
  box-sizing: border-box;
  max-width: none;
  background: rgba(var(--surface-rgb), 0.98);
  box-shadow: 0 0 0 2px var(--accent), 0 16px 32px rgba(0,0,0,0.5), 0 0 18px rgba(var(--accent-rgb),0.35);
  border-radius: 12px;
  transition: box-shadow 0.15s ease;
}
.mockup-drag-placeholder { aspect-ratio: 3/4; border-radius: 12px; visibility: hidden; pointer-events: none; }
.library-card.is-mockup:not(.is-dragging) { transition: transform 0.2s cubic-bezier(0.2, 0.8, 0.2, 1); }
.library-card-thumb {
  width: 100%; aspect-ratio: 3/4; object-fit: cover; border-radius: 12px;
  background: rgba(var(--theme-rgb),0.05); margin-bottom: 8px;
}
/* Polish pass (2026-09-23, item 3): reverted from object-fit:contain -
   a poster whose aspect ratio didn't exactly match the 3/4 card slot
   left visible black letterbox bars above/below or beside the artwork,
   the exact reported "black strips/gaps around posters" bug. Every
   thumbnail in the grid now shares the same cover behavior and fills
   its rounded rect edge-to-edge with zero exposed background, matching
   every other card type - the full uncropped image remains one tap
   away in Library detail. */
.library-card-name { font-size: 13px; font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.library-card-meta { font-size: 11.5px; color: var(--text-tertiary); margin-top: 1px; }
/* Item 9: Mockups is a real image-first visual asset manager - no
   name/meta text renders for a mockup card at all (see library.js),
   so its thumbnail loses the bottom margin that made room for that
   text on Posters/Listings cards. Posters (item 8) are completely
   unaffected - this rule only ever matches .is-mockup. */
.library-card.is-mockup .library-card-thumb { margin-bottom: 0; }

.library-detail-preview { width: 100%; max-height: 340px; object-fit: cover; border-radius: 16px; margin-bottom: 16px; }
.library-detail-title { font-size: 19px; font-weight: 750; margin: 0 0 4px; }
.library-detail-meta { font-size: 13px; color: var(--text-secondary); margin-bottom: 18px; }
.library-detail-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; margin-bottom:22px; }
.library-detail-actions>.library-detail-action-btn:nth-child(3) { grid-column:1 / -1; }
.library-detail-action-btn {
  position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; align-items:center; justify-content:center;
  width:100%; min-width:0; height:60px; min-height:60px; gap:4px; padding:5px 10px;
  border:1px solid transparent; border-radius:14px; background:var(--hermes-glass-background); color:var(--text-primary);
  -webkit-backdrop-filter:var(--hermes-glass-blur); backdrop-filter:var(--hermes-glass-blur); box-shadow:var(--hermes-glass-shadow);
  font-size:11.5px; font-weight:650; line-height:1.15; -webkit-tap-highlight-color:transparent; transition:box-shadow 140ms ease,border-color 140ms ease;
}
.library-detail-action-btn::after { content:""; position:absolute; z-index:0; inset:0; border:1px solid rgba(var(--theme-rgb),.035); border-top-color:rgba(var(--theme-rgb),.075); border-radius:inherit; background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(var(--accent-rgb),.008) 48%,transparent 100%); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); pointer-events:none; }
.library-detail-action-btn > * { position:relative; z-index:1; }
.library-detail-action-btn svg { display:block; width:18px; height:18px; flex:0 0 18px; color:var(--accent-ink); }
.library-detail-action-btn:focus-visible { outline:2px solid rgba(var(--accent-rgb),.68); outline-offset:2px; }
.library-detail-action-btn.is-led-pressed::after { border-color:rgba(var(--accent-rgb),.25); border-top-color:rgba(var(--accent-rgb),.4); box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 0 6px rgba(var(--accent-rgb),.12); }
.library-detail-action-btn.is-led-held::after { border-color:rgba(var(--accent-rgb),.34); border-top-color:rgba(var(--accent-rgb),.53); box-shadow:inset 0 1px 0 rgba(255,255,255,.07),0 0 8px rgba(var(--accent-rgb),.17); }
@media (prefers-reduced-motion:reduce) { .library-detail-action-btn { transition:none; } }
/* ================================================================
   ANALYTICS (chart + redesigned metrics)
   ================================================================ */
.view-header-plain { font-size: 24px; font-weight: 750; letter-spacing: -0.01em; margin: 2px 0 16px; }
.analytics-title-row { display: flex; align-items: center; justify-content: space-between; }
.analytics-title-row .view-header-plain { margin-bottom: 16px; }

/* Item 10 (2026-09-23 polish pass): native pull-to-refresh - replaces
   the old visible refresh button entirely. The indicator sits hidden
   above #analyticsPullContent (translateY(-56px), its own resting
   height) and both elements are driven purely from JS transforms tied
   to a real drag distance (analytics.js: applyPullTransform) - no CSS
   animation drives the pull itself, only the spinner's continuous
   rotation once genuinely refreshing. */
#view-analytics, #view-home { position: relative; overflow: hidden; }
.pull-refresh-indicator {
  position: absolute; top: 0; left: 0; right: 0; height: 56px;
  display: flex; align-items: center; justify-content: center; gap: 8px;
  transform: translateY(-56px);
  color: var(--text-secondary); font-size: 12.5px; font-weight: 650;
  pointer-events: none; z-index: 1;
}
.pull-refresh-indicator.is-ready { color: var(--text-primary); }
.pull-refresh-indicator.is-done { color:var(--success); }
.pull-refresh-indicator.is-error { color:var(--danger); }
.pull-refresh-spinner {
  width: 16px; height: 16px; box-sizing: border-box; border-radius: 999px; flex-shrink: 0;
  border: 2px solid rgba(var(--theme-rgb),0.15); border-top-color: var(--accent);
  display: flex; align-items: center; justify-content: center;
}
.pull-refresh-indicator.is-ready .pull-refresh-spinner { border-top-color: var(--text-primary); }
.pull-refresh-indicator.is-refreshing .pull-refresh-spinner { animation: analyticsRefreshSpin 0.7s linear infinite; }
/* Real fix (2026-09-24, bug-fix pass): this was a plain solid green
   dot with no checkmark - explicit reversal per spec: "a GREEN CIRCLE
   containing a SMALL WHITE CHECKMARK, NOT a plain green dot." */
.pull-refresh-indicator.is-done .pull-refresh-spinner { border: none; background: #3DDC84; transform: none !important; animation: none; }
.pull-refresh-indicator.is-error .pull-refresh-spinner { border-color: rgba(255,94,94,0.3); border-top-color: #FF8A8A; }
.pull-refresh-check { display: none; width: 10px; height: 10px; }
.pull-refresh-indicator.is-done .pull-refresh-check { display: block; }
.page-refresh-slot { height:0; overflow:hidden; display:flex; align-items:center; justify-content:center; transition:height .18s ease; color:var(--accent-ink); pointer-events:none; }
.page-refresh-slot .pull-refresh-spinner { flex:0 0 16px; width:16px; height:16px; opacity:0; transform:scale(.85); transition:opacity .14s ease,transform .14s ease; }
.page-refresh-slot.is-visible .pull-refresh-spinner { opacity:1; transform:scale(1); }
.page-refresh-slot.is-refreshing .pull-refresh-spinner { animation:analyticsRefreshSpin .7s linear infinite; }
@keyframes analyticsRefreshSpin { from { transform: rotate(0deg); } to { transform: rotate(360deg); } }
.analytics-hero-card { margin-bottom: 4px; }
.analytics-hero-label-row { display: flex; align-items: center; gap: 8px; margin-top: 2px; }
.analytics-hero-delta { font-size: 13px; font-weight: 700; color:var(--success); }
.analytics-chart-block { position: relative; margin: 14px 0 20px; }
.analytics-chart { display: block; width: 100%; touch-action: pan-y; }
.analytics-chart-tooltip { box-sizing:border-box; width:max-content; max-width:calc(100% - 20px); white-space:nowrap; }
.analytics-chart-tooltip-date { color:var(--text-secondary); font-size:9px; font-weight:620; }
.analytics-chart-tooltip-value { color:var(--text-primary); font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; }
.analytics-chart-tooltip-orders { color:var(--text-tertiary); font-size:9px; }
.analytics-chart-neon-overlay { position:absolute; z-index:3; overflow:visible; pointer-events:none; touch-action:pan-y; }
.analytics-chart-neon-overlay.is-fading .store-goals-chart-interaction { opacity:0; transition:opacity .16s ease; }
/* Real fix (2026-09-24, bug-fix pass): the 8 metrics used to float as
   plain text with no unifying container - wrapped in one restrained
   glass panel per exact spec values, not 8 separate card backgrounds. */
.analytics-metrics-grid {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 8px;
  margin: 4px 0 12px; padding: 16px 14px;
  background: rgba(var(--theme-rgb),0.045);
  border: 1px solid rgba(var(--theme-rgb),0.08);
  border-radius: 22px;
  backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.18);
}
.analytics-metric-cell { text-align: left; }
.analytics-metric-value { font-size: 17px; font-weight: 750; }
.analytics-metric-label { font-size: 11px; color: var(--text-secondary); margin-top: 1px; }

/* ---------------- misc shared status colors ---------------- */
.is-status-other { background: rgba(var(--theme-rgb),0.06); color: var(--text-secondary); }

/* Subtle fade for an image's FIRST successful load only (setStableImageSrc
   in app.js adds this class once per element, never again on later swaps -
   that's what keeps polling/refresh from re-triggering it). */
@keyframes imgFadeIn { from { opacity: 0; } to { opacity: 1; } }
.img-fade-in { animation: imgFadeIn 220ms ease-out; }

/* Non-destructive, source-coordinate poster framing editor. */
.poster-crop-overlay {
  position: fixed; inset: 0; z-index: 1200; display: none; align-items: stretch; justify-content: center;
  padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom);
  background: var(--app-background); touch-action: pan-y; user-select: none; -webkit-user-select: none;
}
.poster-crop-source-state { min-height:190px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; color:var(--text-primary); text-align:center; }
.poster-crop-source-state strong { color:var(--text-primary); font-size:16px; }
.poster-crop-source-state > span:not(.pull-refresh-spinner) { color:var(--text-secondary); font-size:13px; }
.poster-crop-source-actions { display:flex; width:100%; gap:9px; margin-top:8px; }
.poster-crop-source-actions button { flex:1; min-height:44px; }
.poster-crop-source-actions [data-crop-error-retry] .crop-error-retry-content { display:inline-flex; width:100%; align-items:center; justify-content:center; gap:6px; }
.poster-crop-source-actions [data-crop-error-retry] .crop-error-retry-content .is-button-spinner { margin:0; }
.poster-crop-error-cancel { margin-top:1px; padding:7px 18px; color:var(--text-tertiary); }
.poster-crop-sheet {
  width: min(100%, 620px); height: 100%; max-height: 100%; overflow-y: auto; overscroll-behavior: contain;
  border: 0; border-radius: 0; background: var(--app-background); padding: 10px 16px 0; color: var(--text-primary);
}
.poster-crop-header { display:flex; align-items:center; justify-content:space-between; min-height:42px; margin-bottom:4px; }
.poster-crop-header strong { font-size:16px; font-weight:700; }
.poster-crop-header-spacer { width:44px; height:44px; }
.poster-crop-ratios { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; width:100%; overflow:visible; padding:1px 0 8px; box-sizing:border-box; }
.poster-crop-ratios .chip { display:flex; align-items:center; justify-content:center; min-width:0; width:100%; height:34px; box-sizing:border-box; padding:0 2px; white-space:nowrap; font-size:clamp(9px,2.7vw,11px); }
.ratio-pill-content { display:inline-flex; align-items:center; justify-content:center; min-width:0; line-height:1; }
.ratio-pill-content.is-configured { gap:4px; }
.ratio-pill-content.is-unconfigured { gap:0; }
.ratio-status-dot { display:block; width:4px; height:4px; flex:0 0 4px; border-radius:50%; background:var(--accent); }
.poster-crop-stage { position:relative; height:min(42vh,470px); min-height:230px; max-width:100%; margin:0 auto; overflow:hidden; border:1px solid rgba(var(--theme-rgb),.10); border-radius:12px; background:var(--app-surface); touch-action:none; }
.poster-crop-stage img,.poster-crop-stage svg { position:absolute; display:block; }
.poster-crop-stage img { max-width:none; max-height:none; object-fit:fill; pointer-events:none; }
.poster-crop-stage svg { inset:0; width:100%; height:100%; z-index:2; pointer-events:none; }
.poster-crop-safe-area { position:absolute; z-index:2; box-sizing:border-box; border:1px dashed rgba(255,255,255,.48); pointer-events:none; }
.poster-crop-status { display:block; width:100%; min-height:16px; margin-top:3px; padding:0; border:0; background:transparent; color:var(--text-secondary); font:inherit; font-size:10.5px; line-height:1.3; text-align:center; }
.poster-crop-status.is-warning { color:#F0BD62; }
.poster-crop-hint { display:none; }
.poster-crop-zoom { display:flex; align-items:center; gap:12px; min-height:42px; }
.poster-crop-zoom button { display:grid; place-items:center; padding:0; line-height:1; border:0; color:var(--text-primary); background:var(--app-raised); border-radius:10px; width:34px; height:32px; font-size:20px; }
.poster-crop-zoom input { flex:1; min-width:40px; accent-color:var(--accent); }
.poster-crop-zoom span { min-width:48px; align-self:center; text-align:right; color:var(--text-secondary-strong); font-size:12px; }
.poster-crop-safe-toggle { display:flex; justify-content:center; align-items:center; gap:8px; padding:5px; color:var(--text-secondary-strong); font-size:12px; }
.poster-crop-safe-toggle input { accent-color:var(--accent); }
.poster-crop-actions { display:flex; gap:8px; margin:3px 0 0; }
.poster-crop-actions button { flex:1; min-height:38px; padding:7px 8px; }
.poster-crop-actions .crop-utility-secondary { flex:.82; min-height:34px; font-size:11px; }
.poster-crop-actions .crop-fit-primary { flex:1.2; min-height:38px; }
.poster-crop-nav { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:12px; margin:14px 0; }
.poster-crop-nav button { width:112px; min-width:112px; min-height:34px; border:1px solid rgba(var(--accent-rgb),.2); border-radius:11px; background:rgba(var(--accent-rgb),.08); color:var(--accent-ink); padding:6px 11px; font:inherit; font-size:11px; font-weight:650; }
.poster-crop-nav button:first-child { justify-self:start; }
.poster-crop-nav button:last-child { justify-self:end; }
.poster-crop-nav button:disabled { opacity:.36; }
.crop-wide-action { width:100%; min-height:36px; margin:0 0 12px; }
.poster-crop-sticky-actions { position:sticky; bottom:0; display:flex; gap:8px; padding:8px 0 max(10px,env(safe-area-inset-bottom)); margin:0; background:linear-gradient(180deg,rgba(var(--chrome-rgb),.90),var(--app-background) 24%); }
.crop-confirm-btn.is-continuing { display:flex; align-items:center; justify-content:center; }
.crop-continuing-content { display:inline-flex; align-items:center; justify-content:center; gap:8px; width:100%; margin:0; line-height:1; }
.crop-confirm-btn.is-continuing .is-button-spinner { width:14px; height:14px; flex:0 0 14px; margin:0; border-color:rgba(255,255,255,.42); border-top-color:#fff; animation:analyticsRefreshSpin .7s linear infinite; }

/* Listing art remains visible beneath a restrained decode veil; there is
   deliberately no gray loading skeleton for real thumbnail URLs. */
.listing-thumb-frame.is-loading-preview .listing-thumb-loading-overlay { opacity:.6; }
.listing-thumb-frame.has-image .listing-thumb-fallback { display:none; }
@media (prefers-reduced-motion:reduce) { .listing-thumb-frame .listing-thumb-loading-overlay { transition:none; } }

/* Compact image-only Review Draft selector; the positional COVER label is
   the only tile overlay, and drag reorder remains the ordering control. */
.editor-media-manager { gap:12px; padding:10px 8px 7px; }
.editor-media-tile {
  display:block; position:relative; width:76px; height:76px; flex:0 0 76px;
  padding:0; overflow:visible; border:1px solid transparent; border-radius:11px;
  background:rgba(var(--theme-rgb),.025); box-shadow:none;
  transition:transform .14s ease,border-color .14s ease,opacity .14s ease;
}
.editor-media-tile:active { transform:scale(.97); }
.editor-media-tile.is-selected { border-color:var(--accent); box-shadow:0 0 0 1px rgba(var(--accent-rgb),.22); }
.editor-media-thumb { position:absolute; inset:0; width:100%; height:100%; border-radius:inherit; background:transparent; }
.editor-media-thumb img { object-fit:cover; }
.editor-media-rank-badge {
  position:absolute; z-index:2; left:5px; bottom:5px; display:grid; place-items:center;
  min-width:0; height:19px; padding:0 7px; border-radius:999px;
  background:rgba(16,16,18,.66); color:#fff; font-size:10px; font-weight:700;
  line-height:1; letter-spacing:0; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.editor-media-rank-badge.is-cover { font-size:8.5px; letter-spacing:.045em; }
.editor-media-rank-badge[hidden] { display:none !important; }
.editor-media-more-btn { display:none !important; }
.editor-media-failed { display:none; position:absolute; inset:0; place-items:center; padding:5px; background:rgba(var(--surface-rgb),.94); color:var(--text-secondary); font-size:9px; line-height:1.2; text-align:center; }
.editor-media-tile.is-image-failed .editor-media-failed { display:grid; }
.editor-media-tile.is-dragging { border-color:var(--accent); box-shadow:0 0 0 1px rgba(var(--accent-rgb),.22),0 12px 28px rgba(0,0,0,.35); }

.sticky-success-badge {
  display:inline-flex; align-items:center; justify-content:center; gap:6px; align-self:center;
  min-height:28px; padding:0 10px; border:1px solid rgba(46,160,100,.2); border-radius:999px;
  background:rgba(46,160,100,.09); color:var(--text-primary); font-size:11.5px; font-weight:650; line-height:1;
}
.sticky-success-badge > span:first-child { color:#24945a; font-size:12px; font-weight:800; }
.sticky-success-badge.is-incomplete { border-color:rgba(var(--accent-rgb),.2); background:rgba(var(--accent-rgb),.07); }
.sticky-success-badge.is-incomplete > span:first-child { color:var(--accent-ink); }
.library-delete-description { display:flex; flex-direction:column; gap:2px; white-space:nowrap; font-size:11.5px; line-height:1.35; letter-spacing:-.015em; }

@media (prefers-reduced-motion:reduce) { .editor-media-tile { transition:none; } }

.create-source-overlay { position:fixed; inset:0; z-index:2500; display:none; align-items:flex-end; justify-content:center; padding:16px 16px max(16px,env(safe-area-inset-bottom)); background:rgba(0,0,0,.68); opacity:0; pointer-events:none; transition:opacity .22s ease; isolation:isolate; }
.create-source-overlay.is-open { opacity:1; pointer-events:auto; }
.create-source-sheet { width:min(100%,420px); display:flex; flex-direction:column; gap:7px; padding:14px; border:1px solid rgba(var(--theme-rgb),.1); border-radius:20px; background:var(--app-surface); color:var(--text-primary); box-shadow:0 18px 52px rgba(0,0,0,.28); transform:translateY(calc(100% + 20px)); transition:transform .28s cubic-bezier(.22,.8,.25,1); will-change:transform; }
.create-source-overlay.is-open .create-source-sheet { transform:translateY(0); }
.create-source-sheet strong { padding:3px 8px 7px; text-align:center; font-size:13px; }
.create-source-sheet button { min-height:46px; border:1px solid rgba(var(--theme-rgb),.08); border-radius:12px; background:rgba(var(--theme-rgb),.035); color:var(--text-primary); font:inherit; font-size:14px; font-weight:600; }
.create-source-sheet button { box-sizing:border-box; width:100%; padding:0 14px; text-align:center; white-space:nowrap; }
.draft-artwork-preview { position:fixed; inset:0; z-index:2600; display:none; align-items:center; justify-content:center; padding:24px; background:var(--photo-viewer-backdrop); opacity:0; touch-action:pan-y; transition:opacity .22s ease; }
.draft-artwork-preview.is-open { opacity:1; }
.draft-artwork-preview .preview-image-stack { position:relative; display:grid; place-items:center; max-width:100%; max-height:100%; opacity:0; transform:scale(.975); transition:opacity .24s ease,transform .28s cubic-bezier(.2,.8,.2,1); }
.draft-artwork-preview.is-open .preview-image-stack { opacity:1; transform:scale(1); }
.draft-artwork-preview .preview-image-stack img { grid-area:1/1; display:block; max-width:100%; max-height:calc(100dvh - 48px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); width:auto; height:auto; object-fit:contain; border-radius:5px; }
.draft-artwork-preview .preview-image-hd { opacity:0; transition:opacity .28s ease; }
.draft-artwork-preview .preview-image-hd.is-ready { opacity:1; }
.draft-artwork-preview-close { position:absolute; top:max(12px,env(safe-area-inset-top)); right:16px; z-index:2; display:grid; place-items:center; width:44px; height:44px; padding:0; border:1px solid rgba(255,255,255,.2); border-radius:50%; background:rgba(54,54,58,.58); color:#fff; font:400 17px/1 -apple-system,BlinkMacSystemFont,sans-serif; backdrop-filter:blur(18px); -webkit-backdrop-filter:blur(18px); transition:transform .15s ease,background .15s ease; }
.draft-artwork-preview-close:active { transform:scale(.94); background:rgba(80,80,84,.72); }
.draft-artwork-preview-close svg { display:block; width:14px; height:14px; }
.draft-artwork-preview-close svg path { fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; }
.draft-artwork-preview-loading { display:none; place-items:center; width:42px; height:42px; }
@keyframes draftPreviewEnter { from { opacity:0; transform:scale(.985); } to { opacity:1; transform:scale(1); } }
@media (prefers-reduced-motion:reduce) { .draft-artwork-preview,.draft-artwork-preview .preview-image-stack,.draft-artwork-preview .preview-image-hd { transition:none; } }
@media (prefers-reduced-motion:reduce) { .create-source-overlay,.create-source-sheet,.library-delete-confirm-overlay,.library-delete-confirm-sheet { transition:none; } }

.hermes-delete-modal { position:fixed; inset:0; z-index:1400; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(0,0,0,.62); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.hermes-delete-sheet { width:min(100%,340px); padding:23px 20px 16px; border:1px solid rgba(var(--theme-rgb),.11); border-radius:19px; background:rgba(var(--surface-rgb),.98); box-shadow:0 22px 70px rgba(0,0,0,.55); text-align:center; }
.hermes-delete-eyebrow { margin-bottom:9px; color:var(--text-secondary); font-size:9px; font-weight:750; letter-spacing:.2em; }
.hermes-delete-sheet h2 { margin:0; color:var(--text-primary); font-size:16px; font-weight:750; letter-spacing:.02em; }
.hermes-delete-sheet p { margin:9px 0 19px; color:var(--text-secondary); font-size:13px; line-height:1.4; }
.hermes-delete-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.hermes-delete-actions button { min-height:43px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:11px; background:rgba(var(--theme-rgb),.05); color:var(--text-primary); font:inherit; font-size:12px; font-weight:700; letter-spacing:.035em; }
.hermes-delete-actions [data-delete-confirm] { border-color:rgba(179,55,65,.32); background:rgba(130,34,43,.72); color:#FFF1F2; }
.hermes-delete-actions [data-delete-confirm] { min-height:48px; background:#A72C38; border-color:#C4434F; color:#FFF; font-size:14px; font-weight:750; }
.listing-swipe-delete .is-button-spinner { border-top-color:#FFF; border-color:rgba(var(--theme-rgb),.35); }
.hermes-delete-actions .is-destructive { border-color:rgba(179,55,65,.42); background:rgba(130,34,43,.78); color:#FFF1F2; }
.hermes-delete-actions button:active { transform:scale(.98); }
.poster-crop-sticky-actions button { flex:1; min-width:0; min-height:46px; padding:8px; }
.poster-crop-sticky-actions [data-crop="generate"],.poster-crop-sticky-actions .crop-confirm-btn { flex:1; }
.poster-crop-error-row { display:flex; align-items:center; gap:8px; margin:4px 0 6px; }
.poster-crop-error { display:flex; align-items:center; gap:7px; min-width:0; min-height:0; margin:0; padding:0; border:0; background:transparent; color:var(--danger,#FF8585); font-size:11px; line-height:1.3; }
.poster-crop-error:empty { display:none; }
.poster-crop-error:not(:empty)::before { content:"!"; display:grid; place-items:center; width:15px; height:15px; flex:0 0 15px; border:1px solid currentColor; border-radius:50%; font-size:9px; font-weight:750; }
.poster-crop-error-row:has(.poster-crop-error:empty) { display:none; }
.poster-crop-retry-btn { flex:0 0 auto; min-height:32px; padding:5px 10px; }
.poster-crop-retry-btn[hidden] { display:none; }
:root[data-theme="light"] .poster-crop-error { color:#A52B32; background:rgba(165,49,45,.06); }
@media (prefers-color-scheme:light) { :root[data-theme="system"] .poster-crop-error { color:#A52B32; background:rgba(165,49,45,.06); } }
.poster-crop-header [data-crop="cancel"] { box-sizing:border-box; width:44px; height:44px; min-width:44px; min-height:44px; padding:0; display:grid; place-items:center; line-height:1; font-size:22px; }
.accent-picker-header button { box-sizing:border-box; width:44px; height:44px; min-width:44px; min-height:44px; padding:0; display:grid; place-items:center; line-height:1; font-size:21px; }

/* Appearance controls, compact Queue surface and selected-pill loading. */
.home-tool-card { flex-direction:row; align-items:center; justify-content:flex-start; min-height:72px; gap:11px; padding:11px 13px; }
.home-tool-copy { min-width:0; display:flex; flex-direction:column; gap:4px; text-align:left; }
.home-tool-copy strong { color:var(--text-primary); font-size:13px; font-weight:700; }
.home-tool-copy small { color:var(--text-secondary); font-size:10.5px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.home-tool-card:active { transform:scale(.98); border-color:rgba(var(--accent-rgb),.36); }
.chip { display:inline-flex; align-items:center; justify-content:center; min-height:34px; }
.range-pill-spinner { width:12px; height:12px; flex:0 0 12px; margin-left:5px; border:1.5px solid rgba(var(--theme-rgb),.25); border-top-color:currentColor; border-radius:50%; animation:analyticsRefreshSpin .68s linear infinite; }
.range-pill-spinner[hidden] { display:none; }
.chip.is-loading { color:var(--accent-contrast); }
.home-perf-card.is-range-loading .home-perf-primary,.analytics-content.is-range-loading .analytics-metrics-grid { opacity:.78; }
.app-main.has-create-footer { padding-bottom:calc(224px + env(safe-area-inset-bottom)); }
.settings-appearance-block { padding:14px 15px 16px; }
.appearance-segment { display:grid; grid-template-columns:repeat(3,1fr); padding:3px; margin-top:9px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:12px; background:rgba(var(--theme-rgb),.045); }
.appearance-segment button { border:0; background:transparent; color:var(--text-secondary); border-radius:9px; min-height:36px; font-size:12px; font-weight:650; }
.appearance-segment button.is-selected { background:var(--app-surface); color:var(--text-primary); box-shadow:0 1px 4px rgba(0,0,0,.12); }
.settings-accent-heading { display:flex; align-items:center; justify-content:space-between; margin-top:16px; }
.accent-wheel-wrap { width:34px; height:34px; padding:3px; border:1px solid rgba(var(--theme-rgb),.15); border-radius:50%; overflow:hidden; }
.accent-wheel-wrap input { width:100%; height:100%; padding:0; border:0; border-radius:50%; background:none; }
.accent-wheel-wrap input::-webkit-color-swatch-wrapper { padding:0; }
.accent-wheel-wrap input::-webkit-color-swatch { border:0; border-radius:50%; }
.accent-presets { display:flex; justify-content:space-between; gap:9px; margin-top:12px; }
.accent-presets button { width:24px; height:24px; flex:0 0 24px; border-radius:50%; border:2px solid transparent; background:var(--preset-accent); box-shadow:0 0 0 1px rgba(var(--theme-rgb),.15); }
.accent-presets button.is-selected { outline:2px solid var(--text-primary); outline-offset:2px; }
.queue-tool-content { display:flex; flex-direction:column; gap:12px; }
.queue-section-title { margin:0 0 6px; color:var(--text-secondary); font-size:10px; font-weight:750; letter-spacing:.13em; }
.queue-tool-row { position:relative; display:flex; align-items:center; gap:12px; min-height:78px; padding:10px; border:1px solid rgba(var(--theme-rgb),.08); border-radius:14px; background:rgba(var(--theme-rgb),.035); }
.queue-tool-thumb { display:block; width:54px; height:54px; flex:0 0 54px; aspect-ratio:1/1; border-radius:9px; object-fit:cover; background:rgba(var(--theme-rgb),.07); overflow:hidden; }
.queue-tool-thumb-fallback { position:absolute; left:10px; top:10px; display:none; place-items:center; width:54px; height:54px; border-radius:9px; color:var(--text-secondary); background:var(--app-raised); pointer-events:none; }
.queue-tool-thumb-fallback.is-visible { display:grid; }
.queue-tool-copy { flex:1; min-width:0; display:flex; flex-direction:column; gap:4px; }
.queue-tool-copy strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:var(--text-primary); font-size:13px; }
.queue-tool-copy small { color:var(--text-secondary); font-size:11px; }
.queue-tool-progress { height:3px; border-radius:5px; background:rgba(var(--theme-rgb),.1); overflow:hidden; margin-top:3px; }
.queue-tool-progress i { display:block; height:100%; background:var(--accent); border-radius:inherit; transition:width .25s linear; }
.queue-tool-empty { display:flex; align-items:center; flex-direction:column; gap:6px; position:relative; overflow:hidden; color:var(--text-secondary); text-align:center; padding:27px 16px 25px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:15px; background:linear-gradient(145deg,rgba(var(--accent-rgb),.045),rgba(var(--theme-rgb),.025)); }
.queue-tool-empty strong { color:var(--text-primary); font-size:14px; font-weight:680; }
.queue-tool-empty > span:last-child { font-size:11px; }
.queue-job-cancel { display:grid; place-items:center; align-self:flex-start; width:44px; height:44px; flex:0 0 44px; margin:-5px -5px 0 0; padding:0; border:1px solid rgba(var(--theme-rgb),.1); border-radius:50%; color:var(--text-secondary-strong); background:rgba(var(--theme-rgb),.06); font-size:13px; font-weight:500; line-height:1; }
.queue-action-error { margin:0 0 12px; color:var(--danger,#B52F38); font-size:12px; }
.queue-job-detail-overlay { position:fixed; inset:0; z-index:1450; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(0,0,0,.62); backdrop-filter:blur(10px); }
.queue-job-detail { position:relative; width:min(100%,390px); max-height:min(80vh,680px); overflow:auto; padding:22px 18px 18px; border:1px solid rgba(var(--theme-rgb),.11); border-radius:20px; background:var(--app-surface); color:var(--text-primary); box-shadow:0 20px 70px rgba(0,0,0,.36); }
.queue-job-detail-close { position:absolute; top:10px; right:10px; display:grid; place-items:center; width:40px; height:40px; padding:0; border:1px solid rgba(var(--theme-rgb),.1); border-radius:50%; color:var(--text-primary); background:rgba(var(--theme-rgb),.05); font-size:21px; line-height:1; }
.queue-job-detail h2 { margin:0 42px 6px 0; font-size:17px; }
.queue-job-detail-heading { display:flex; align-items:center; gap:12px; padding-right:36px; }
.queue-job-detail-heading h2 { margin-right:0; }
.queue-job-detail-thumb { display:block; width:62px; height:62px; flex:0 0 62px; aspect-ratio:1/1; border-radius:10px; object-fit:cover; background:var(--app-raised); }
.queue-job-detail-stage { margin:0 0 10px; color:var(--text-secondary-strong); font-size:12px; }
.queue-job-detail-steps { display:flex; flex-direction:column; gap:8px; margin:17px 0; padding:0; list-style:none; }
.queue-job-detail .queue-job-review { min-height:44px; width:100%; margin:5px 0 2px; }
.queue-job-detail .processing-step:not(:last-child)::after { bottom:-8px; }
.queue-job-detail-error { color:var(--danger,#B52F38); font-size:12px; }
.queue-job-detail-cancel { min-height:42px; width:100%; border:1px solid rgba(180,45,55,.26); border-radius:11px; color:#fff; background:#A72C38; font:inherit; font-size:13px; font-weight:700; }
.queue-job-detail-loading { display:flex; align-items:center; justify-content:center; gap:9px; min-height:72px; color:var(--text-secondary); font-size:12px; }
.create-add-posters-btn { width:100%; min-height:40px; margin:12px 0 0; }
.queue-idle-pulse { display:flex; align-items:center; justify-content:center; gap:3px; width:39px; height:27px; margin:0 0 2px; color:var(--accent-ink); }
.queue-idle-pulse i { display:block; width:2px; height:7px; border-radius:4px; background:currentColor; opacity:.4; animation:queue-idle-wave 1.8s ease-in-out infinite; }
.queue-idle-pulse i:nth-child(2) { height:14px; animation-delay:.18s; opacity:.65; }
.queue-idle-pulse i:nth-child(3) { animation-delay:.36s; }
@keyframes queue-idle-wave { 50% { transform:scaleY(1.5); opacity:.8; } }
.home-perf-chart-block,.analytics-chart-block { clip-path:none; transform:none; border-radius:10px; background:transparent; }
.analytics-chart { overflow:visible; }
:root[data-theme="light"] .poster-crop-safe-area { border-color:rgba(20,24,31,.45); }
:root[data-theme="light"] .queue-tool-empty { background:linear-gradient(145deg,rgba(var(--accent-rgb),.055),rgba(20,24,31,.018)); }
@media (prefers-reduced-motion:reduce) { .queue-idle-pulse i { animation:none; opacity:.55; } }
body.animations-disabled .queue-idle-pulse i { animation:none; opacity:.55; }
.home-perf-chart-block,.analytics-chart-block { clip-path:none; transform:none; border-radius:10px; background:transparent; }
.analytics-chart { overflow:visible; }
:root[data-theme="light"] .poster-crop-safe-area { border-color:rgba(20,24,31,.45); }
:root[data-theme="light"] .queue-tool-empty { background:linear-gradient(145deg,rgba(var(--accent-rgb),.055),rgba(20,24,31,.018)); }
:root[data-theme="light"] .poster-crop-zoom button { color:var(--text-primary); background:var(--app-raised); }
:root[data-theme="light"] .hermes-delete-sheet { background:var(--app-surface); }
:root[data-theme="system"] .hermes-delete-sheet { background:var(--app-surface); }
:root[data-theme="light"] .settings-profile-name { color:var(--text-primary); background:var(--app-raised); }
:root[data-theme="system"] .settings-profile-name { color:var(--text-primary); background:var(--app-raised); }
:root[data-theme="system"] .poster-crop-zoom button { color:var(--text-primary); background:var(--app-raised); }

/* A single moving selection surface keeps period switching compact and
   stable; the existing buttons and inline spinner stay in place. */
.segmented-range-control {
  position:relative; display:grid; grid-template-columns:repeat(4,minmax(0,1fr));
  gap:2px; width:min(100%,360px); padding:3px; overflow:hidden;
  border:1px solid rgba(var(--theme-rgb),.12); border-radius:13px;
  background:rgba(var(--theme-rgb),.055); isolation:isolate;
}
.segmented-range-control::before {
  content:""; position:absolute; z-index:-1; top:3px; bottom:3px; left:3px;
  width:calc((100% - 6px - 6px)/4); border-radius:10px;
  background:var(--accent); transform:translateX(calc(var(--range-index,1) * (100% + 2px)));
  transition:transform 220ms cubic-bezier(.22,1,.36,1);
}
.segmented-range-control .chip {
  display:grid; place-items:center; min-width:0; justify-content:center; gap:0; margin:0; padding:0 5px;
  min-height:34px; border:0; border-radius:10px; background:transparent;
  color:var(--text-secondary); white-space:nowrap; font-size:11px; position:relative; z-index:1; overflow:hidden;
}
.segmented-range-control .range-pill-label { transition:opacity 130ms ease; }
.segmented-range-control .range-pill-label.is-label-replaced { opacity:0; }
.segmented-range-control .chip.is-active { background:transparent; color:var(--accent-contrast); }
.segmented-range-control .chip.is-loading { color:var(--accent-contrast); }
.segmented-range-control .range-pill-spinner { position:absolute; inset:0; margin:auto; transform:none; width:11px; height:11px; border-color:rgba(var(--accent-rgb),.28); border-top-color:currentColor; }
.home-perf-range-chips { margin-bottom:12px; }

/* The source logo artwork is white; CSS masks its tone only for the
   adaptive app header, leaving the dark splash artwork untouched. */
:root[data-theme="light"] .hermes-brand-wordmark,
:root[data-theme="light"] .hermes-brand-glyph { filter:brightness(0); }
@media (prefers-color-scheme:light) {
  :root[data-theme="system"] .hermes-brand-wordmark,
  :root[data-theme="system"] .hermes-brand-glyph { filter:brightness(0); }
}

.accent-presets { display:grid; grid-template-columns:repeat(9,24px); justify-content:space-between; align-items:center; gap:6px; }
.accent-presets button { position:relative; width:24px; height:24px; min-width:24px; min-height:24px; padding:0; }
.accent-presets button.is-selected { outline:2px solid var(--text-primary); outline-offset:2px; transform:scale(1.05); }
.accent-custom-button { background:conic-gradient(#ef4444,#f97316,#eab308,#22a06b,#14b8a6,#3b82f6,#8b5cf6,#ec4899,#ef4444); }
.accent-custom-button.has-custom { background:var(--custom-accent); }
.accent-custom-button { border:1px solid var(--border); box-shadow:0 0 0 1px rgba(var(--theme-rgb),.12),inset 0 0 0 1px rgba(255,255,255,.28); }
.accent-custom-button::after { content:""; position:absolute; inset:7px; border:1.5px solid #fff; border-radius:50%; box-shadow:0 1px 2px rgba(0,0,0,.45); pointer-events:none; }
.accent-custom-input { position:absolute; width:1px; height:1px; opacity:0; pointer-events:none; }
.accent-picker-modal[hidden] { display:none; }
.accent-picker-modal { position:fixed; inset:0; z-index:1500; display:flex; align-items:flex-end; justify-content:center; padding:16px 14px max(16px,env(safe-area-inset-bottom)); background:rgba(0,0,0,.48); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.accent-picker-sheet { width:min(100%,430px); padding:17px; border:1px solid var(--border); border-radius:20px; background:var(--app-surface); color:var(--text-primary); box-shadow:0 18px 50px rgba(0,0,0,.24); }
.accent-picker-header { display:flex; align-items:center; justify-content:space-between; margin-bottom:14px; font-size:15px; }
.accent-picker-header button { box-sizing:border-box; display:grid; place-items:center; width:44px; height:44px; min-width:44px; min-height:44px; padding:0; border:0; border-radius:50%; background:var(--app-raised); color:var(--text-primary); font-size:22px; line-height:1; }
.accent-picker-preview-row { display:flex; align-items:center; gap:8px; margin:0 0 9px; color:var(--text-secondary); font-size:11px; }
.accent-picker-preview-row > span:first-child { width:18px; height:18px; border-radius:50%; border:1px solid rgba(var(--theme-rgb),.2); background:var(--picker-preview,var(--accent)); }
.accent-color-spectrum { --picker-hue:#3b82f6; position:relative; height:166px; overflow:hidden; border-radius:12px; touch-action:none; background-color:var(--picker-hue); background-image:linear-gradient(to top,#000,transparent),linear-gradient(to right,#fff,transparent); }
.accent-color-spectrum > span { position:absolute; width:17px; height:17px; border:2px solid #fff; border-radius:50%; transform:translate(-50%,-50%); box-shadow:0 1px 5px rgba(0,0,0,.5); pointer-events:none; }
.accent-picker-label,.accent-picker-sb label { display:block; margin:13px 0 5px; color:var(--text-secondary-strong); font-size:11px; font-weight:650; }
.accent-picker-hue { display:block; width:100%; height:24px; margin:0; appearance:none; -webkit-appearance:none; background:linear-gradient(90deg,#f00,#ff0,#0f0,#0ff,#00f,#f0f,#f00); border-radius:999px; }
.accent-picker-hue::-webkit-slider-thumb { appearance:none; -webkit-appearance:none; width:17px; height:17px; border:2px solid #fff; border-radius:50%; background:var(--picker-preview,var(--accent)); box-shadow:0 1px 4px rgba(0,0,0,.4); }
.accent-picker-sb { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.accent-picker-sb label { margin-top:8px; }
.accent-picker-sb input { display:block; width:100%; accent-color:var(--accent); }
.accent-picker-values { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:14px; color:var(--text-secondary); font-size:11px; }
.accent-picker-values label { display:flex; align-items:center; gap:8px; }
.accent-hex-input { display:flex; align-items:center; height:34px; box-sizing:border-box; border:1px solid var(--border); border-radius:9px; padding:0 9px; color:var(--text-primary); background:var(--app-raised); font:600 12px ui-monospace,monospace; }
.accent-hex-input > span { color:var(--text-secondary); }
.accent-picker-values input { width:72px; height:32px; box-sizing:border-box; border:0; outline:0; padding:0 0 0 1px; color:var(--text-primary); background:transparent; font:600 12px ui-monospace,monospace; }
.accent-picker-actions { display:flex; justify-content:flex-end; gap:9px; margin-top:17px; }
.accent-picker-actions button { min-width:86px; min-height:40px; border:1px solid var(--border); border-radius:10px; background:var(--app-raised); color:var(--text-primary); font:inherit; font-size:12px; font-weight:650; }
.accent-picker-actions .btn-primary { color:var(--accent-contrast); background:var(--accent); border:0; }
@media (max-height: 740px) {
  .poster-crop-stage { height:34vh; min-height:190px; }
  .poster-crop-status { min-height:22px; }
}

/* Final consistency overrides (kept last so shared base rules cannot
   reintroduce unequal crop controls or oversized queue rows). */
.poster-crop-ratios .chip { position:relative; }
.ratio-pill-content { width:100%; }
.ratio-pill-content.is-configured { display:inline-flex; align-items:center; justify-content:center; gap:4px; width:auto; }
.ratio-pill-content.is-configured .ratio-status-dot { width:4px; height:4px; flex:0 0 4px; }
.ratio-pill-content.is-unconfigured { display:flex; width:100%; justify-content:center; }
.poster-crop-actions { display:flex; gap:8px; align-items:stretch; }
.poster-crop-actions button,
.poster-crop-actions .crop-utility-secondary,
.poster-crop-actions .crop-fit-primary { box-sizing:border-box; display:flex; flex:1 1 0; align-items:center; justify-content:center; width:0; min-width:0; height:38px; min-height:38px; max-height:38px; padding:0 8px; border-radius:11px; font:inherit; font-size:11px; font-weight:650; line-height:1; }
.editor-media-tile.is-selected { border-color:var(--accent); box-shadow:0 0 0 1px rgba(var(--accent-rgb),.22); }
.range-pill-spinner { margin-left:0; border-color:rgba(var(--accent-rgb),.25); border-top-color:var(--accent); }
.queue-tool-row { min-height:64px; gap:9px; padding:7px 8px; border-radius:13px; }
.queue-tool-thumb { width:46px; height:46px; flex-basis:46px; border-radius:8px; }
.queue-tool-thumb-fallback { left:8px; top:8px; width:46px; height:46px; border-radius:8px; }
.queue-tool-copy { gap:3px; }
.queue-tool-copy strong { font-size:12px; }
.queue-tool-copy small { font-size:10.5px; }
.queue-tool-progress { margin-top:2px; }
.queue-job-cancel { position:relative; z-index:1; align-self:center; width:44px; height:44px; flex-basis:44px; margin:0 -3px 0 0; border:0; background:transparent; font-size:12px; }
.queue-job-cancel::before { content:""; position:absolute; z-index:-1; inset:5px; border:1px solid rgba(var(--theme-rgb),.1); border-radius:50%; background:rgba(var(--theme-rgb),.045); }
.listings-sync-status { box-sizing:border-box; display:flex; align-items:center; justify-content:flex-end; gap:6px; width:100%; min-height:20px; margin:0 0 5px; color:var(--text-secondary); font-size:10px; line-height:1; }
.listings-sync-status:empty { display:none; }
.listings-request-state { display:flex; align-items:center; justify-content:flex-end; gap:8px; min-height:20px; margin:0 0 5px; color:var(--text-secondary); font-size:10px; line-height:1; }
.listings-request-state[hidden] { display:none !important; }
.listings-retry-btn { min-height:32px; margin-left:4px; padding:0 7px; border:0; border-radius:8px; color:var(--accent-ink); background:transparent; font:inherit; font-size:10px; font-weight:650; cursor:pointer; }
.listings-retry-btn:active { background:rgba(var(--accent-rgb),.08); }
.crop-confirm-btn.is-continuing { opacity:1; color:var(--accent-contrast); }
.crop-confirm-btn.is-continuing .is-button-spinner { border-color:rgba(255,255,255,.58); border-top-color:#fff; }

/* Insights: priority and action first, with the supporting evidence kept
   behind the action disclosure. */
.insights-priority-summary { margin:0 0 19px; padding:13px 14px; border:1px solid rgba(var(--theme-rgb),.085); border-radius:15px; background:rgba(var(--theme-rgb),.035); }
.insights-priority-summary>strong { display:block; margin-bottom:10px; color:var(--text-primary); font-size:14px; font-weight:700; }
.insights-priority-summary>div { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:7px; }
.insights-priority-summary>div>button { min-width:0; min-height:42px; padding:6px 7px; border:1px solid transparent; border-radius:10px; background:transparent; color:var(--text-secondary); text-align:left; font:inherit; font-size:9px; line-height:1.25; transition:background-color .2s ease,border-color .2s ease,transform .16s ease; }
.insights-priority-summary>div>button:active { transform:scale(.98); }
.insights-priority-summary>div>button { -webkit-tap-highlight-color:transparent; }
.insights-priority-summary>div>button[aria-pressed="true"] { border-color:rgba(var(--accent-rgb),.22); background:rgba(var(--accent-rgb),.08); color:var(--text-primary); }
.insights-category-back { min-height:30px; margin:0 0 7px -5px; padding:0 5px; border:0; background:transparent; color:var(--accent-ink); font:600 11px/1 var(--font-family); }
.insights-priority-summary b { display:block; margin-bottom:2px; color:var(--accent-ink); font-size:14px; font-variant-numeric:tabular-nums; }
.insight-card { overflow:hidden; }
.insight-card-head { gap:10px; }
.insight-thumb-button { width:46px; height:56px; flex:0 0 46px; padding:0; border:0; border-radius:9px; overflow:hidden; background:transparent; }
.insight-thumb-button:active,.insight-detail-image:active { transform:scale(.97); opacity:.9; }
.insight-thumb { display:block; width:100%; height:100%; object-fit:cover; }
.insight-card-title { align-self:stretch; justify-content:center; }
.insight-card-title strong { max-width:100%; }
.insight-confidence { max-width:96px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:8px; }
.insight-metrics { margin:6px 0 0 56px; }
.insight-action-row { display:flex; align-items:center; gap:8px; width:100%; min-height:36px; margin-top:9px; padding:5px 1px; border:0; border-top:1px solid rgba(var(--theme-rgb),.07); background:transparent; color:var(--accent-ink); text-align:left; font:inherit; transition:color .18s ease,opacity .15s ease; }
.insight-action-row>span:first-child { display:grid; place-items:center; width:17px; height:17px; flex:0 0 17px; border:1px solid rgba(var(--accent-rgb),.42); border-radius:50%; font-size:10px; font-weight:800; }
.insight-action-row>strong { min-width:0; flex:1; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11.5px; font-weight:720; }
.insight-action-row>b { font-size:18px; font-weight:400; line-height:1; transition:transform .2s ease; }
.insight-action-row.is-expanded>b { transform:rotate(90deg); }
.insight-confidence-inline { color:var(--text-tertiary); font-size:8px; font-weight:550; white-space:nowrap; }
.insight-action-details { display:grid; grid-template-rows:0fr; overflow:hidden; contain:layout style; border-top:1px solid transparent; color:var(--text-secondary); opacity:0; transition:grid-template-rows .2s cubic-bezier(.2,.75,.25,1),opacity .16s ease,border-color .16s ease; }
.insight-action-details.is-expanded { grid-template-rows:1fr; border-top-color:rgba(var(--theme-rgb),.07); opacity:1; }
.insight-action-details-inner { min-height:0; overflow:hidden; padding:10px 0 2px; }
.insight-action-details:not(.is-expanded) .insight-action-details-inner { padding-top:0; padding-bottom:0; }
.poster-insight-hero { position:relative; width:100%; height:min(34vh,330px); min-height:205px; margin:0 0 15px; overflow:hidden; border:1px solid rgba(var(--theme-rgb),.1); border-radius:16px; background:var(--surface-raised); }
.insight-detail-image { display:block; width:100%; height:100%; padding:0; border:0; background:transparent; transition:transform .16s ease,opacity .16s ease; }
.insight-detail-image img { display:block; width:100%; height:100%; object-fit:contain; transition:opacity .22s ease; }
.insight-detail-image img.is-upgrading { opacity:.76; }
.insight-detail-image img.is-hq-ready { opacity:1; }
.poster-insight-hero>.insight-visual-marker { position:absolute; }
.poster-insight-hero .insight-marker-callout { position:absolute; z-index:3; left:12px; right:12px; bottom:12px; padding:10px 12px; border:1px solid rgba(var(--accent-rgb),.3); border-radius:11px; background:rgba(12,12,15,.88); color:#fff; font-size:11px; line-height:1.4; backdrop-filter:blur(14px); animation:insight-detail-enter .18s ease-out both; }
.poster-insight-hero .insight-marker-callout[hidden] { display:none; }
.insight-change-heading { margin:0 0 7px; color:var(--text-tertiary); font-size:9px; font-weight:750; letter-spacing:.1em; }
.insight-change { display:flex; align-items:flex-start; gap:10px; width:100%; margin:0; padding:8px 7px; border:0; border-radius:9px; background:transparent; color:var(--text-secondary-strong); text-align:left; font:inherit; }
.insight-change>span:first-child { padding-top:1px; color:var(--accent-ink); font-size:9px; font-variant-numeric:tabular-nums; }
.insight-change>span:last-child { display:flex; min-width:0; flex-direction:column; gap:2px; }
.insight-change strong { color:var(--text-primary); font-size:11px; font-weight:680; }
.insight-change small { color:var(--text-secondary); font-size:10.5px; line-height:1.4; }
.insight-change:active,.insight-change.is-highlighted { background:rgba(var(--accent-rgb),.09); }
.insight-baseline { margin:7px 6px; color:var(--text-tertiary); font-size:9px; line-height:1.4; }
.insight-detail-confidence { margin:7px 6px; color:var(--text-tertiary); font-size:9px; }
.insight-open-listing { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:34px; padding:0 7px; border:0; background:transparent; color:var(--accent-ink); font:inherit; font-size:11px; font-weight:650; }
.insight-visual-page { z-index:1210; }
.insight-visual-title { margin:0 0 13px; color:var(--text-primary); font-size:22px; line-height:1.2; }
.insight-visual-cover { position:relative; display:flex; justify-content:center; width:100%; max-height:46vh; min-height:210px; overflow:hidden; border:1px solid var(--border); border-radius:16px; background:var(--surface-raised); }
.insight-visual-cover img { display:block; width:100%; height:100%; max-height:46vh; object-fit:contain; }
.insight-visual-marker { position:absolute; z-index:2; display:grid; place-items:center; width:25px; height:25px; padding:0; border:1px solid var(--accent); border-radius:50%; background:rgba(var(--theme-rgb),.82); color:var(--accent-ink); font:750 12px/1 var(--font-family); box-shadow:0 3px 12px rgba(0,0,0,.22); transition:transform .18s ease,background-color .18s ease; }
.insight-visual-marker.marker-cover { left:12px; bottom:12px; }
.insight-visual-marker.marker-mockups { right:12px; bottom:12px; }
.insight-visual-marker.is-highlighted { transform:scale(1.08); background:var(--accent); color:var(--accent-contrast); }
.insight-visual-note { margin:8px 2px 17px; color:var(--text-tertiary); font-size:10px; line-height:1.4; }
.insight-visual-recommendations { padding-top:12px; border-top:1px solid var(--border); }
.insight-visual-recommendations .insight-action-details { border:0; opacity:1; }
.insight-visual-recommendations .insight-action-details-inner { padding-top:0; }
.insight-visual-recommendations .insight-change { transition:background-color .18s ease; }
.insight-visual-signal { margin-top:14px; padding:12px; border:1px solid var(--border); border-radius:12px; background:var(--surface-raised); }
.insight-visual-signal small { color:var(--text-tertiary); font-size:9px; font-weight:750; letter-spacing:.1em; }
.insight-visual-signal p { margin:6px 0; color:var(--text-primary); font-size:11px; line-height:1.4; }
.insight-visual-signal span { color:var(--text-tertiary); font-size:9px; }
@keyframes insight-detail-enter { from { opacity:.5; transform:translateY(-3px); } to { opacity:1; transform:none; } }

/* The queue's job-detail activity panel stays compact and is driven only
   by the canonical backend status poll. */
.queue-job-detail { width:min(100%,430px); max-height:min(72vh,560px); padding:18px 17px 15px; border-radius:18px; }
.queue-job-detail-heading { gap:10px; padding-right:32px; }
.queue-job-detail-thumb { width:52px; height:52px; flex-basis:52px; border-radius:9px; }
.queue-job-detail h2 { font-size:14px; }
.queue-job-detail-stage { display:block; margin:4px 0 0; min-height:16px; color:var(--text-secondary-strong); font-size:11px; animation:insight-detail-enter .2s ease-out; }
.queue-job-detail-progress { height:4px; margin:14px 0 13px; }
.queue-job-detail-progress i { transition:width .24s cubic-bezier(.22,.7,.24,1); }
.queue-job-detail-steps { display:flex; flex-direction:row; align-items:center; gap:3px; margin:0 0 11px; padding:0; list-style:none; }
.queue-job-detail .processing-step { position:relative; display:flex; flex:1 1 0; min-width:0; min-height:24px; align-items:center; justify-content:center; padding:0 2px; color:var(--text-tertiary); text-align:center; font-size:8px; line-height:1.15; font-weight:550; transition:color .2s ease,opacity .2s ease; }
.queue-job-detail .processing-step::after { display:none; }
.queue-job-detail .processing-step.is-active { color:var(--accent-ink); font-weight:750; }
.queue-job-detail .processing-step.is-done { color:var(--text-secondary); font-weight:600; }
.queue-job-detail .processing-step-icon { display:none; }
.queue-job-detail-cancel { display:inline-flex; width:auto; min-height:31px; align-items:center; justify-content:center; margin-top:5px; padding:0 10px; border:1px solid rgba(180,45,55,.2); border-radius:9px; color:var(--danger,#d76b73); background:rgba(180,45,55,.06); font-size:10px; font-weight:600; }
.queue-job-detail-close { width:38px; height:38px; font-size:17px; }

/* Processing is a compact presentation of the existing QueueManager state.
   Its observer, real progress values and action handlers remain unchanged. */
.queue-job-detail-overlay { align-items:center; justify-content:center; padding:24px; background:rgba(0,0,0,.48); backdrop-filter:none; -webkit-backdrop-filter:none; }
.queue-job-detail { position:relative; display:block; width:min(100%,390px); min-height:0; max-height:min(82vh,540px); overflow:auto; padding:24px 20px 18px; border:1px solid rgba(var(--theme-rgb),.1); border-radius:18px; background:var(--app-surface); color:var(--text-primary); box-shadow:0 18px 50px rgba(0,0,0,.28); text-align:left; }
.queue-job-detail-close { position:absolute; top:10px; right:10px; width:34px; height:34px; border-color:transparent; background:transparent; color:var(--text-tertiary); }
.queue-job-detail-body { display:grid; grid-template-columns:minmax(0,1fr) 42px; align-items:center; width:100%; margin:0; }
.queue-job-detail-identity { grid-column:1 / -1; grid-row:1; display:grid; grid-template-columns:48px minmax(0,1fr); grid-template-rows:auto auto; align-items:center; column-gap:12px; row-gap:3px; min-width:0; padding-right:32px; }
.queue-job-detail-identity:not(.has-thumb) { grid-template-columns:minmax(0,1fr); }
.queue-job-detail-thumb { grid-column:1; grid-row:1 / 3; width:48px; height:48px; flex-basis:48px; margin:0; border-radius:9px; background:var(--app-raised); }
.queue-job-detail h2 { grid-column:2; grid-row:1; min-width:0; max-width:100%; overflow:hidden; margin:0; color:var(--text-primary); font-size:14px; font-weight:650; letter-spacing:.01em; text-overflow:ellipsis; white-space:nowrap; }
.queue-job-detail-stage { grid-column:2; grid-row:2; min-height:0; margin:0; overflow:hidden; color:var(--text-secondary); font-size:11px; text-overflow:ellipsis; white-space:nowrap; animation:insight-detail-enter .18s ease-out; }
.queue-job-detail-identity:not(.has-thumb) h2,.queue-job-detail-identity:not(.has-thumb) .queue-job-detail-stage { grid-column:1; }
.queue-job-detail-percent { grid-column:2; grid-row:2; justify-self:end; margin:0; color:var(--text-secondary-strong); font-size:11px; font-weight:650; font-variant-numeric:tabular-nums; }
.queue-job-detail-progress { grid-column:1; grid-row:2; align-self:center; width:calc(100% - 10px); height:3px; margin:0; background:rgba(var(--theme-rgb),.12); }
.queue-job-detail-progress i { background:var(--accent); }
.queue-job-detail-steps { grid-column:1 / -1; grid-row:3; display:flex; flex-direction:row; align-items:center; gap:3px; width:100%; margin:17px 0 2px; padding:0; list-style:none; }
.queue-job-detail .processing-step { position:relative; display:flex; flex:1 1 0; min-width:0; min-height:22px; align-items:center; justify-content:center; padding:0 1px; color:var(--text-tertiary); text-align:center; font-size:8px; line-height:1.15; font-weight:550; transition:color .18s ease,opacity .18s ease; }
.queue-job-detail .processing-step::after,.queue-job-detail .processing-step-icon { display:none; }
.queue-job-detail .processing-step.is-active { color:var(--accent-ink); font-weight:700; }
.queue-job-detail .processing-step.is-done { color:var(--text-secondary); font-weight:550; }
.queue-job-detail .queue-job-review,.queue-job-detail [data-detail-retry],.queue-job-detail [data-detail-remove],.queue-job-detail .processing-add-etsy-link,.queue-job-detail-error { grid-column:1 / -1; }
.queue-job-detail-cancel { grid-column:1 / -1; justify-self:center; width:auto; min-height:30px; margin:9px 0 0; padding:0 8px; border:0; color:var(--text-tertiary); background:transparent; font-size:10px; font-weight:550; }
.queue-job-detail-cancel:active { color:var(--text-primary); }
body.animations-disabled .queue-job-detail-stage,body.animations-disabled .queue-job-detail-progress i,body.animations-disabled .queue-job-detail .processing-step { animation:none; transition:none; }

/* A single, recognizable processing surface in Queue. It uses the
   QueueManager's existing preview and real progress checkpoint data. */
.queue-tool-row.is-active { min-height:108px; align-items:center; gap:12px; padding:11px 12px; border-color:rgba(var(--accent-rgb),.13); background:rgba(var(--theme-rgb),.04); }
.queue-tool-preview { position:relative; display:grid; place-items:center; width:72px; height:92px; flex:0 0 72px; overflow:hidden; border:1px solid rgba(var(--theme-rgb),.08); border-radius:9px; background:var(--app-raised); }
.queue-tool-row.is-active .queue-tool-thumb { display:block; width:auto; height:auto; max-width:100%; max-height:100%; flex:0 1 auto; border-radius:8px; object-fit:contain; background:transparent; }
.queue-tool-thumb { opacity:0; transition:opacity .2s ease; }
.queue-tool-thumb.is-loaded { opacity:1; }
.queue-tool-thumb-fallback { inset:0; left:auto; top:auto; width:auto; height:auto; border-radius:8px; background:rgba(var(--theme-rgb),.045); pointer-events:none; }
.queue-tool-thumb-fallback::after { content:""; position:absolute; inset:0; background:linear-gradient(105deg,transparent 24%,rgba(var(--theme-rgb),.055) 48%,transparent 72%); transform:translateX(-100%); animation:queuePreviewShimmer 1.45s ease-in-out infinite; }
@keyframes queuePreviewShimmer { to { transform:translateX(100%); } }
.queue-tool-row.is-active .queue-tool-copy { min-width:0; gap:7px; }
.queue-tool-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; min-width:0; }
.queue-tool-row.is-active .queue-tool-heading strong { min-width:0; color:var(--text-primary); font-size:13px; font-weight:680; }
.queue-tool-percent { flex:0 0 auto; color:var(--accent-ink); font-size:12px; font-variant-numeric:tabular-nums; font-weight:680; }
.queue-tool-row.is-active .queue-tool-stage { overflow:hidden; color:var(--text-secondary); font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.queue-tool-row.is-active .queue-tool-progress { height:3px; margin-top:1px; background:rgba(var(--theme-rgb),.11); }
.queue-tool-row.is-active .queue-tool-progress i { transition:width .24s cubic-bezier(.22,.7,.24,1); }
.queue-tool-row.is-active .queue-job-cancel { align-self:center; width:34px; height:34px; flex:0 0 34px; margin:0; }
.queue-tool-row.is-active .queue-job-cancel::before { inset:4px; }
.queue-job-detail-identity { grid-template-columns:58px minmax(0,1fr) 34px; grid-template-rows:auto; align-items:center; }
.queue-job-detail-thumb { grid-column:1; grid-row:1; width:54px; height:72px; aspect-ratio:3/4; object-fit:contain; }
.queue-job-detail-thumb { opacity:0; transition:opacity .2s ease; }
.queue-job-detail-thumb.is-loaded { opacity:1; }
.queue-job-detail-copy { grid-column:2; grid-row:1; min-width:0; }
.queue-job-detail-copy h2 { min-width:0; max-width:100%; overflow:hidden; margin:0; font-size:13px; text-overflow:ellipsis; white-space:nowrap; }
.queue-job-detail-copy .queue-job-detail-stage { margin-top:4px; }
.queue-job-detail-percent { grid-column:3; grid-row:1; }
.queue-job-detail-progress { grid-column:1 / -1; grid-row:2; width:100%; margin:14px 0 0; }
.queue-job-detail-steps { grid-row:3; }

/* The reusable text editor keeps Save visible while long content scrolls
   inside the textarea, including when the iOS keyboard reduces the viewport. */
.editor-base-description-modal { align-items:flex-end; overflow-y:auto; padding:12px 0 0; }
.editor-base-description-sheet { display:flex; flex-direction:column; width:min(100%,560px); max-height:min(82dvh,660px); overflow:hidden; padding:18px 18px max(16px,env(safe-area-inset-bottom)); }
.editor-base-description-sheet > .editor-description-note { margin:5px 0 0; }
.editor-base-description-sheet textarea { box-sizing:border-box; width:100%; height:min(40dvh,360px); min-height:130px; max-height:44dvh; flex:0 1 auto; overflow-y:auto; overscroll-behavior:contain; resize:none; padding:15px 16px; line-height:1.45; }
.editor-description-error { flex:0 0 auto; margin:10px 0 0; }
.editor-base-description-actions { flex:0 0 auto; margin-top:14px; padding-top:2px; }
.editor-short-description { min-height:96px; height:104px; padding:15px 16px; line-height:1.45; }
@media (max-height:560px) {
  .editor-base-description-modal { padding-top:max(8px,env(safe-area-inset-top)); }
  .editor-base-description-sheet { max-height:calc(100dvh - 16px - env(safe-area-inset-top)); padding:14px 16px 12px; }
  .editor-base-description-sheet textarea { height:28dvh; min-height:86px; max-height:32dvh; }
  .editor-base-description-actions { margin-top:9px; }
}
body.animations-disabled .queue-tool-thumb-fallback::after { animation:none; }
body.animations-disabled .queue-tool-row.is-active .queue-tool-progress i,body.animations-disabled .queue-tool-thumb,body.animations-disabled .queue-job-detail-thumb { transition:none; }
@media (prefers-reduced-motion:reduce) { .queue-tool-thumb-fallback::after { animation:none; } .queue-tool-row.is-active .queue-tool-progress i,.queue-tool-thumb,.queue-job-detail-thumb { transition:none; } }

/* Stable search clear target: global button press transforms may not replace
   its centering transform or nudge it down while it appears. */
.search-clear-btn { top:0; bottom:0; right:2px; margin:auto; transform:none; opacity:0; visibility:hidden; pointer-events:none; transition:opacity .14s ease,color .14s ease,transform .14s ease; }
.search-clear-btn.is-visible { opacity:1; visibility:visible; pointer-events:auto; }
.search-clear-btn:active { transform:scale(.97); }
.search-clear-btn svg { display:block; flex:0 0 auto; }

@media (prefers-reduced-motion:reduce) {
  .poster-insight-page,.insight-action-details,.poster-insight-hero .insight-marker-callout,.queue-job-detail-stage,.queue-job-detail-progress i { animation:none; transition:none; }
  .insight-action-row>b,.insight-visual-marker,.queue-job-detail .processing-step,.search-clear-btn { transition:none; }
  .insights-priority-summary>div>button { transition:none; }
}
body.animations-disabled .poster-insight-page,body.animations-disabled .insight-action-details,body.animations-disabled .poster-insight-hero .insight-marker-callout { animation:none; transition:none; }
body.animations-disabled .insight-action-row>b,body.animations-disabled .insight-visual-marker,body.animations-disabled .insights-priority-summary>div>button { transition:none; }

/* One shared close-control treatment for Hermes sheets and Queue dialogs.
   Queue cancellation keeps its existing handler; this aligns presentation. */
.hermes-glass-close { display:grid; place-items:center; width:40px; height:40px; flex:0 0 40px; padding:0; border:1px solid rgba(var(--theme-rgb),.12); border-radius:50%; color:var(--text-secondary-strong); background:rgba(var(--theme-rgb),.065); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.035); font-size:17px; font-weight:450; line-height:1; transition:transform .16s ease,background-color .16s ease,border-color .16s ease,color .16s ease; }
.hermes-glass-close:active { transform:scale(.96); color:var(--text-primary); border-color:rgba(var(--accent-rgb),.22); background:rgba(var(--accent-rgb),.08); }
.queue-tool-row.is-active .queue-job-cancel.hermes-glass-close { align-self:center; width:40px; height:40px; flex-basis:40px; margin:0; border:1px solid rgba(var(--theme-rgb),.12); border-radius:50%; background:rgba(var(--theme-rgb),.065); font-size:17px; }
.queue-tool-row.is-active .queue-job-cancel.hermes-glass-close::before { display:none; }
.library-detail-preview-frame { position:relative; display:grid; place-items:center; width:100%; height:min(340px,48vh); min-height:180px; overflow:hidden; margin:0 0 18px; border-radius:16px; background:rgba(var(--theme-rgb),.035); }
.library-detail-preview { position:absolute; inset:0; display:block; width:100%; height:100%; max-height:none; margin:0; border-radius:inherit; object-fit:contain; }
.library-detail-preview-hq { opacity:0; transition:opacity .2s ease; }
.library-detail-preview-hq.is-loaded { opacity:1; }
.library-detail-title { margin:0 0 7px; }
.library-detail-meta { margin:0 0 20px; line-height:1.45; }
.editor-base-description-sheet { gap:0; }
.editor-base-description-sheet-header { min-height:40px; }
.editor-base-description-sheet > .editor-description-note { margin-top:6px; line-height:1.45; }
.editor-base-description-sheet textarea { margin-top:14px; }
.editor-base-description-actions { gap:10px; margin-top:14px; }
.queue-tool-row.is-active { padding:12px; gap:12px; }
.queue-tool-copy { gap:5px; }
.queue-tool-row.is-active .queue-tool-progress { margin-top:4px; }
body.animations-disabled .hermes-glass-close,body.animations-disabled .library-detail-preview-hq { transition:none; }
@media (prefers-reduced-motion:reduce) { .hermes-glass-close,.library-detail-preview-hq { transition:none; } }

/* Etsy Activity — compact additions use the same semantic theme tokens and
   dark glass surfaces as the existing Hermes cards. */
.app-header-actions { display:flex; align-items:center; gap:9px; }
.activity-header-button { position:relative; display:grid; place-items:center; width:40px; height:40px; flex:0 0 40px; padding:0; border:1px solid rgba(var(--theme-rgb),.11); border-radius:50%; background:rgba(var(--theme-rgb),.055); color:var(--accent-ink); transition:background .16s ease,border-color .16s ease,box-shadow .16s ease; }
.activity-header-button[hidden],.activity-unread-badge[hidden] { display:none; }
.activity-header-button svg { display:block; width:20px; height:20px; margin:0; position:relative; top:-.35px; overflow:visible; }
.activity-header-button.is-active { border-color:rgba(var(--accent-rgb),.25); background:rgba(var(--accent-rgb),.105); box-shadow:0 0 13px rgba(var(--accent-rgb),.12),inset 0 1px 0 rgba(var(--theme-rgb),.045); }
.activity-header-button:active { background:rgba(var(--accent-rgb),.15); }
.activity-unread-badge { position:absolute; top:-2px; right:-3px; display:grid; place-items:center; min-width:16px; height:16px; padding:0 4px; border:1.5px solid var(--chrome-rgb); border-radius:999px; background:var(--accent); color:var(--accent-contrast); font-size:9px; font-weight:750; line-height:1; }
.activity-view { position:relative; min-height:calc(100dvh - 142px); padding-bottom:16px; }
.activity-sale-view { position:fixed; z-index:21; top:var(--activity-sale-top,calc(env(safe-area-inset-top) + 55px)); right:0; bottom:var(--activity-sale-bottom,calc(56px + env(safe-area-inset-bottom))); left:0; width:100%; max-width:560px; min-height:0; margin:0 auto; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; padding:16px 18px 24px; background:var(--app-background); }
.activity-page-header { display:flex; align-items:center; justify-content:flex-start; gap:14px; margin:1px 0 19px; }
.activity-page-header h1 { margin:0; font-size:26px; font-weight:720; letter-spacing:-.035em; }
.activity-page-header p { margin:5px 0 0; color:var(--text-secondary); font-size:12px; line-height:1.45; }
.activity-feed-sync-status { display:flex; align-items:center; gap:7px; min-height:16px; margin:-5px 2px 9px; color:var(--text-tertiary); font-size:10px; }
.activity-feed-sync-status[hidden] { display:none; }
.activity-inline-spinner { width:10px; height:10px; flex:0 0 10px; border:1.5px solid rgba(var(--accent-rgb),.24); border-top-color:var(--accent); border-radius:50%; animation:activity-inline-spin .8s linear infinite; }
@keyframes activity-inline-spin { to { transform:rotate(360deg); } }
.activity-feed-error { margin:8px 0 14px; color:var(--text-secondary); font-size:12px; }
.activity-feed-error button { border:0; padding:0 0 0 5px; background:transparent; color:var(--accent-ink); font:inherit; font-weight:650; }
.activity-feed-list { display:flex; flex-direction:column; gap:9px; }
.activity-feed-group-label { margin:12px 2px 0; color:var(--text-tertiary); font-size:10px; font-weight:700; letter-spacing:.105em; text-transform:uppercase; }
.activity-sale-event { display:grid; grid-template-columns:42px minmax(0,1fr) auto; align-items:center; gap:11px; width:100%; min-height:78px; padding:11px 12px; border:1px solid rgba(var(--theme-rgb),.085); border-radius:17px; background:linear-gradient(145deg,rgba(var(--accent-rgb),.055),rgba(var(--surface-rgb),.37) 60%,rgba(var(--theme-rgb),.035)); color:var(--text-primary); text-align:left; box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); }
.activity-event-thumb,.activity-event-icon { display:grid; place-items:center; width:42px; height:48px; overflow:hidden; border:1px solid rgba(var(--accent-rgb),.13); border-radius:11px; background:rgba(var(--accent-rgb),.075); color:var(--accent-ink); }
.activity-event-thumb img { width:100%; height:100%; object-fit:cover; }
.activity-event-icon svg { width:19px; height:19px; }
.activity-event-copy { display:flex; min-width:0; flex-direction:column; gap:3px; }
.activity-event-title { display:flex; align-items:center; gap:6px; font-size:12px; font-weight:700; }
.activity-event-listing { overflow:hidden; color:var(--text-secondary-strong); font-size:11px; line-height:1.35; text-overflow:ellipsis; white-space:nowrap; }
.activity-event-meta { display:flex; align-items:center; gap:6px; min-width:0; color:var(--text-tertiary); font-size:10px; }
.activity-event-meta b { color:var(--text-secondary-strong); font-size:10px; font-weight:650; }
.activity-event-end { display:flex; align-items:center; gap:7px; color:var(--text-tertiary); }
.activity-unread-dot { width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 9px rgba(var(--accent-rgb),.36); }
.activity-event-chevron { color:var(--text-tertiary); font-size:18px; line-height:1; }
.activity-feed-empty[hidden],.activity-feed-loading[hidden] { display:none; }
.activity-feed-empty strong { display:block; color:var(--text-secondary-strong); font-size:12px; font-weight:650; }
.activity-feed-empty { display:flex; align-items:center; justify-content:center; padding:48px 20px 34px; color:var(--text-secondary); text-align:center; }
.activity-feed-empty strong { color:var(--text-secondary-strong); font-size:13px; font-weight:650; }
.activity-feed-loading { display:grid; gap:9px; }
.activity-feed-loading span,.activity-feed-loading i { display:block; height:67px; border-radius:16px; background:rgba(var(--theme-rgb),.045); }
.activity-back-button { display:flex; align-items:center; gap:6px; min-height:38px; margin:0 0 7px -7px; padding:0 7px; border:0; background:transparent; color:var(--accent-ink); font:500 23px/1 var(--font-family); }
.activity-back-button span { font-size:12px; font-weight:600; }
.activity-sale-hero { display:flex; align-items:center; flex-direction:column; padding:8px 12px 21px; text-align:center; }
.activity-sale-orb { display:grid; place-items:center; width:72px; height:72px; flex:0 0 72px; margin-bottom:13px; border:1px solid rgba(var(--accent-rgb),.28); border-radius:50%; background:radial-gradient(circle at 35% 25%,rgba(var(--accent-rgb),.16),rgba(var(--surface-rgb),.11) 72%); color:var(--accent-ink); box-shadow:0 0 28px rgba(var(--accent-rgb),.12),inset 0 1px 0 rgba(255,255,255,.08); }
.activity-sale-cart-icon { position:relative; z-index:1; display:block; width:30px; height:30px; flex:0 0 30px; margin:0; transform:translateX(-2px); background-color:currentColor; -webkit-mask:url("/icons/activity-cart-mask.png") center/contain no-repeat; mask:url("/icons/activity-cart-mask.png") center/contain no-repeat; }
.activity-sale-hero h1 { margin:0; color:var(--text-primary); font-size:22px; font-weight:720; letter-spacing:-.025em; }
.activity-sale-hero h1 span { font-size:17px; }
.activity-sale-amount { display:block; width:100%; margin-top:7px; color:var(--accent-ink); font-size:34px; font-weight:760; letter-spacing:-.02em; white-space:nowrap; word-break:keep-all; font-variant-numeric:tabular-nums; text-align:center; }
.activity-sale-title { display:block; width:100%; max-width:340px; margin:6px auto 3px; padding-inline:8px; color:var(--text-secondary-strong); font-size:13px; font-weight:550; line-height:1.35; text-align:center; text-wrap:balance; }
.activity-sale-when { color:var(--text-tertiary); font-size:10px; }
.activity-sale-card { margin:0 0 10px; padding:14px; border:1px solid rgba(var(--theme-rgb),.085); border-radius:17px; background:linear-gradient(145deg,rgba(var(--accent-rgb),.045),rgba(var(--surface-rgb),.34) 60%,rgba(var(--theme-rgb),.025)); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); }
.activity-sale-card h2 { margin:0 0 11px; color:var(--text-secondary); font-size:10px; font-weight:700; letter-spacing:.09em; text-transform:uppercase; }
.activity-sale-product { display:flex; align-items:center; gap:11px; }
.activity-sale-product img { width:54px; height:58px; border-radius:10px; object-fit:cover; }
.activity-sale-product-copy { display:flex; min-width:0; flex:1; flex-direction:column; gap:5px; }
.activity-sale-product-copy strong { color:var(--text-primary); font-size:12px; line-height:1.4; }
.activity-sale-product-copy span { color:var(--accent-ink); font-size:12px; font-weight:650; }
.activity-sale-detail-row { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:31px; color:var(--text-secondary); font-size:11px; }
.activity-sale-detail-row + .activity-sale-detail-row { border-top:1px solid rgba(var(--theme-rgb),.055); }
.activity-sale-detail-row > strong,.activity-sale-detail-row > div strong { color:var(--text-primary); font-size:11px; font-weight:600; text-align:right; }
.activity-sale-detail-row > div { display:flex; align-items:center; gap:10px; }
.activity-sale-detail-row > .activity-order-id-actions { position:relative; }
.activity-copy-control { position:relative; display:grid; place-items:center; width:40px; height:44px; flex:0 0 40px; }
.activity-copy-button { display:grid; place-items:center; width:40px; height:44px; flex:0 0 40px; margin:0; padding:0; border:0; border-radius:12px; background:transparent; color:var(--accent-ink); -webkit-tap-highlight-color:transparent; }
.activity-copy-button:active { background:rgba(var(--accent-rgb),.10); }
.activity-copy-button svg { display:block; width:19px; height:19px; }
.activity-open-etsy-button { width:100%; min-height:46px; margin-top:2px; border:1px solid rgba(var(--accent-rgb),.24); border-radius:14px; background:rgba(var(--accent-rgb),.11); color:var(--accent-ink); font:650 12px/1 var(--font-family); }
.activity-etsy-action-wrap { position:relative; margin-top:2px; }
.activity-etsy-action-wrap .activity-open-etsy-button { margin-top:0; }
.activity-floating-toast { position:absolute; z-index:5; right:0; bottom:calc(100% + 7px); display:block; width:max-content; max-width:min(250px,75vw); padding:7px 10px; border:1px solid rgba(var(--accent-rgb),.22); border-radius:999px; background:rgba(24,20,33,.9); color:var(--text-primary); box-shadow:0 5px 17px rgba(0,0,0,.28),inset 0 1px 0 rgba(255,255,255,.05); -webkit-backdrop-filter:blur(14px); backdrop-filter:blur(14px); font:600 10px/1.2 var(--font-family); opacity:0; pointer-events:none; transform:translateY(3px) scale(.98); transition:opacity .16s ease,transform .16s ease; }
.activity-floating-toast[hidden] { display:none; }
.activity-floating-toast.is-visible { opacity:1; transform:translateY(0) scale(1); }
.activity-floating-toast.is-error { border-color:rgba(220,111,129,.3); color:#f3c1c9; }
.activity-copy-control .activity-floating-toast { right:-7px; bottom:auto; top:-27px; }
.activity-floating-toast-centered { right:0; bottom:calc(100% + 7px); }
.activity-order-navigation-note { margin:7px 8px 0; color:var(--text-tertiary); font-size:10px; line-height:1.4; text-align:center; }
.activity-confetti-canvas { position:absolute; z-index:3; inset:0 0 auto; width:100%; height:270px; pointer-events:none; }
.activity-sale-view.is-celebrating .activity-sale-orb { animation:activity-orb-enter .38s cubic-bezier(.2,.8,.25,1) .2s both; }
@keyframes activity-orb-enter { from { opacity:.72; transform:scale(.9); } to { opacity:1; transform:scale(1); } }
@media (prefers-reduced-motion:reduce) { .activity-inline-spinner { animation:none; } .activity-floating-toast { transition:none; } }
@media (max-width:380px) { .activity-sale-event { grid-template-columns:38px minmax(0,1fr) auto; gap:9px; padding:10px; } .activity-event-thumb,.activity-event-icon { width:38px; } }

/* Insights disclosures use one isolated Web Animation owned by the panel;
   disable the older keyframe/transition pair to prevent two animations and
   forced parent-list layout work from competing during collapse. */
.insight-action-details { contain:layout style; will-change:auto; }
.home-insight-preview { animation:none; will-change:transform,opacity; }
.home-insight-viewport { width:100%; overflow:hidden; border-radius:15px; touch-action:pan-y; }
.home-insight-track { display:flex; width:200%; transform:translate3d(0,0,0); will-change:transform; }
.home-insight-track>.home-insight-preview { width:50%; min-width:50%; flex:0 0 50%; animation:none; }
@media (prefers-reduced-motion:reduce) { .home-insight-preview { animation:none; } }

/* Focused follow-up reminder UI, aligned with Hermes card and form tokens. */
.followup-home-section { margin-top:2px; margin-bottom:20px; }
.followup-home-card { padding:15px 16px 14px; border:1px solid rgba(var(--theme-rgb),.1); border-radius:16px; background:rgba(var(--theme-rgb),.045); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.05),0 10px 30px -12px rgba(0,0,0,.5); cursor:pointer; transition:transform .16s ease,border-color .16s ease; }
.followup-home-card:active { transform:scale(.992); border-color:rgba(var(--accent-rgb),.24); }
.followup-home-main { display:grid; grid-template-columns:38px minmax(0,1fr); align-items:center; gap:12px; }
.followup-home-icon { display:grid; place-items:center; width:36px; height:36px; border:1px solid rgba(var(--accent-rgb),.42); border-radius:11px; background:rgba(var(--accent-rgb),.055); color:var(--accent-ink); box-shadow:0 0 14px rgba(var(--accent-rgb),.12); }
.followup-home-icon svg { width:19px; height:19px; }
.followup-eyebrow { color:var(--text-secondary-strong); font-size:11.5px; font-weight:750; line-height:1.2; letter-spacing:.09em; }
.followup-home-copy { display:flex; min-width:0; flex-direction:column; gap:4px; }
.followup-home-copy strong { color:var(--text-primary); font:700 15px/1.2 var(--font-family); letter-spacing:-.01em; }
.followup-home-copy small { margin-top:1px; color:var(--text-secondary); font:400 10.5px/1.3 var(--font-family); }
.followup-home-footer { display:flex; align-items:center; min-height:42px; gap:9px; margin-top:13px; }
.followup-home-thumbs { display:flex; align-items:center; gap:4px; min-width:0; min-height:28px; flex:0 0 auto; }
.followup-home-thumb { width:24px; height:24px; flex:0 0 auto; object-fit:cover; border:1px solid rgba(var(--theme-rgb),.12); border-radius:6px; background:var(--app-raised); }
.followup-home-context { display:block; min-width:0; flex:1 1 auto; overflow:hidden; padding:6px 8px; border:1px solid rgba(var(--theme-rgb),.065); border-radius:9px; background:rgba(var(--theme-rgb),.035); color:var(--text-secondary); font:400 10.5px/1.3 var(--font-family); text-overflow:ellipsis; white-space:nowrap; }
.followup-home-context[hidden] { display:none; }
.followup-home-cta { display:inline-flex; align-items:center; justify-content:center; gap:7px; flex:0 0 auto; min-width:124px; height:40px; padding:0 11px; border:1px solid rgba(255,255,255,.56); border-radius:12px; background:#f8f6f7; color:#21171d; font:650 12px/1 var(--font-family); }
.followup-home-cta span { color:#645b61; font-size:17px; line-height:1; }
.followup-home-cta:active { transform:scale(.98); }
.today-action-view { overflow-y:auto; }
.today-page { width:calc(100% + 36px); min-height:100%; box-sizing:border-box; margin:-16px -18px 0; padding:12px 18px calc(env(safe-area-inset-bottom) + 28px); }
.today-back-btn { min-height:40px; margin:0 0 18px -7px; padding:0 7px; border:0; background:transparent; color:var(--accent-ink); font:600 13px/1.2 var(--font-family); }
.today-page h1 { margin:0 0 7px; color:var(--text-primary); font-size:20px; font-weight:700; line-height:1.2; letter-spacing:-.025em; }
.today-page-subtitle { margin:0 0 22px; color:var(--text-secondary); font-size:12px; line-height:1.45; }
.today-filters { display:flex; gap:4px; margin:0 0 18px; padding:4px; border:1px solid rgba(var(--theme-rgb),.075); border-radius:12px; background:rgba(var(--theme-rgb),.03); }
.today-filters button { display:flex; justify-content:center; align-items:center; gap:5px; flex:1 1 0; min-width:0; min-height:40px; padding:0 5px; border:0; border-radius:9px; background:transparent; color:var(--text-secondary); font:600 10px/1.15 var(--font-family); white-space:nowrap; }
.today-filters button strong { color:var(--text-tertiary); font-size:10px; font-weight:650; line-height:1; font-variant-numeric:tabular-nums; }
.today-filters button span { color:inherit; font-size:10px; font-weight:600; line-height:1.2; }
.today-filters button.is-active { background:rgba(var(--accent-rgb),.14); color:var(--text-primary); }
.today-filters button.is-active strong { color:var(--accent-ink); }
.today-rows { display:flex; flex-direction:column; border-top:1px solid rgba(var(--theme-rgb),.065); }
.followup-customer-card { display:grid; grid-template-columns:44px minmax(0,1fr) auto 16px; grid-template-rows:auto auto auto; align-items:center; column-gap:11px; row-gap:3px; min-height:78px; padding:13px 2px; border-bottom:1px solid rgba(var(--theme-rgb),.065); animation:followup-row-in .18s ease both; animation-delay:calc(var(--row-index,0) * 12ms); cursor:pointer; }
.followup-customer-identity { display:contents; }
.followup-avatar { display:grid; place-items:center; width:42px; height:42px; flex:0 0 42px; border:1px solid rgba(var(--accent-rgb),.22); border-radius:50%; background:rgba(var(--accent-rgb),.075); color:var(--accent-ink); font:650 12px/1 var(--font-family); }
.followup-identity-copy { display:flex; min-width:0; flex-direction:column; gap:5px; }
.followup-identity-copy strong { overflow:hidden; color:var(--text-primary); font:650 13px/1.25 var(--font-family); text-overflow:ellipsis; white-space:nowrap; }
.followup-identity-copy small { color:var(--text-secondary); font:400 10px/1.3 var(--font-family); }
.followup-card-chevron { grid-column:4; grid-row:1 / span 3; color:var(--text-tertiary); font-size:20px; line-height:1; text-align:right; }
.followup-row-avatar { grid-column:1; grid-row:1 / span 3; }
.followup-identity-copy { grid-column:2; grid-row:1; }
.followup-row-status { grid-column:2 / span 2; grid-row:2; overflow:hidden; color:var(--text-secondary); font:400 10px/1.3 var(--font-family); text-overflow:ellipsis; white-space:nowrap; }
.followup-row-product { grid-column:2 / span 2; grid-row:3; overflow:hidden; color:var(--text-tertiary); font:400 10px/1.3 var(--font-family); text-overflow:ellipsis; white-space:nowrap; }
.followup-row-time { grid-column:3; grid-row:1; color:var(--text-tertiary); font:400 9px/1.2 var(--font-family); white-space:nowrap; }
.followup-detail-status { margin:0 0 17px; padding:12px 13px; border:1px solid rgba(var(--accent-rgb),.15); border-radius:12px; background:rgba(var(--accent-rgb),.045); color:var(--text-secondary-strong); font:400 11px/1.5 var(--font-family); }
.followup-detail-status[hidden] { display:none; }
.followup-message-record { margin:0 0 16px; padding:14px 15px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:14px; background:rgba(var(--theme-rgb),.045); }
.followup-message-record[hidden] { display:none; }
.followup-message-record>span { color:var(--text-secondary); font-size:10px; font-weight:750; letter-spacing:.09em; }
.followup-message-record p { margin:9px 0 12px; color:var(--text-primary); font:400 13px/1.55 var(--font-family); white-space:pre-wrap; overflow-wrap:anywhere; }
.followup-message-record small { color:var(--text-tertiary); font:400 10px/1.35 var(--font-family); }
.today-empty { display:flex; min-height:120px; flex-direction:column; justify-content:center; align-items:center; gap:6px; margin:0; color:var(--text-secondary); font-size:12px; text-align:center; }
.today-empty[hidden] { display:none; }
.today-empty strong { color:var(--text-primary); font-size:13px; font-weight:620; }
.today-empty span { color:var(--text-secondary); font-size:11px; }
.today-capability-note { margin:17px 0 0; color:var(--text-tertiary); font-size:10px; line-height:1.5; }
.today-freshness { margin:16px 0 0; color:var(--text-tertiary); font-size:9px; text-align:center; }
.followup-composer-page { padding-bottom:calc(env(safe-area-inset-bottom) + 24px); }
.followup-composer-identity { display:flex; align-items:center; gap:12px; margin:2px 0 17px; }
.followup-composer-identity .followup-avatar { width:46px; height:46px; }
.followup-composer-identity h1 { margin:0 0 4px; }
.followup-composer-identity .today-page-subtitle { margin:0; font-size:11px; }
.today-purchase-context { display:flex; align-items:center; gap:12px; min-height:64px; margin:0 0 20px; padding:10px 12px; border:1px solid rgba(var(--theme-rgb),.08); border-radius:13px; background:rgba(var(--theme-rgb),.035); }
.today-purchase-context img { width:44px; height:48px; flex:0 0 44px; border-radius:8px; object-fit:cover; }
.today-purchase-context img[hidden] { display:none; }
.today-purchase-context strong { min-width:0; color:var(--text-primary); font-size:11px; font-weight:620; line-height:1.4; }
.today-message-label { display:block; margin:0 0 8px; color:var(--text-secondary-strong); font-size:9px; font-weight:650; letter-spacing:.09em; }
.today-message-input { box-sizing:border-box; width:100%; min-height:178px; padding:14px 15px; border:1px solid var(--border); border-radius:14px; outline:none; background:rgba(var(--theme-rgb),.04); color:var(--text-primary); font:400 13px/1.55 var(--font-family); resize:vertical; }
.today-message-input:focus { border-color:rgba(var(--accent-rgb),.45); }
.followup-composer-note { margin-top:10px; }
.today-inline-error { margin:10px 0 0; color:#e48a9a; font-size:11px; line-height:1.4; }
.today-inline-error[hidden] { display:none; }
.followup-composer-tools { display:flex; align-items:center; gap:8px; margin:14px 0 12px; }
.followup-composer-tools button { min-height:32px; padding:0 10px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:9px; background:rgba(var(--theme-rgb),.035); color:var(--text-secondary-strong); font:550 10px/1 var(--font-family); }
.followup-handoff-bar { display:grid; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); gap:9px; }
.today-primary-action,.today-secondary-action { display:flex; justify-content:center; align-items:center; min-width:0; min-height:44px; padding:0 12px; border-radius:11px; font:650 11px/1.2 var(--font-family); }
.today-primary-action { gap:7px; border:1px solid rgba(var(--accent-rgb),.28); background:var(--accent); color:var(--accent-contrast); }
.today-primary-action:disabled { opacity:.48; }
.today-secondary-action { border:1px solid rgba(var(--theme-rgb),.12); background:rgba(var(--theme-rgb),.06); color:var(--text-primary); }
.followup-restore { display:block; width:100%; min-height:42px; margin:0 0 10px; border:1px solid rgba(var(--accent-rgb),.2); border-radius:11px; background:rgba(var(--accent-rgb),.07); color:var(--accent-ink); font:600 11px/1.2 var(--font-family); }
.followup-restore[hidden] { display:none; }
.followup-sheet-backdrop { position:fixed; z-index:1600; inset:0; display:flex; align-items:flex-end; justify-content:center; padding:0; background:rgba(0,0,0,.48); backdrop-filter:blur(4px); -webkit-backdrop-filter:blur(4px); }
.followup-sheet-backdrop[hidden] { display:none; }
.followup-message-sheet { position:relative; width:min(100%,540px); max-height:min(86dvh,700px); overflow:auto; box-sizing:border-box; padding:9px 20px calc(env(safe-area-inset-bottom) + 20px); border:1px solid rgba(var(--theme-rgb),.12); border-bottom:0; border-radius:22px 22px 0 0; background:var(--app-surface); box-shadow:0 -12px 42px rgba(0,0,0,.28); animation:followup-sheet-in .2s cubic-bezier(.2,.75,.25,1) both; overscroll-behavior:contain; }
.followup-sheet-close { position:absolute; top:12px; right:16px; z-index:1; }
.followup-confirm-grabber { width:34px; height:4px; margin:0 auto 18px; border-radius:4px; background:rgba(var(--theme-rgb),.22); }
.followup-sheet-heading { min-width:0; margin:0 38px 18px 0; }
.followup-sheet-heading h2 { overflow:hidden; margin:0 0 5px; color:var(--text-primary); font:650 17px/1.25 var(--font-family); text-overflow:ellipsis; white-space:nowrap; }
.followup-sheet-heading p { margin:0; color:var(--text-secondary); font:400 11px/1.4 var(--font-family); }
.followup-sheet-input { min-height:150px; max-height:40dvh; padding:12px 13px; border-color:rgba(var(--theme-rgb),.1); border-radius:13px; background:rgba(var(--theme-rgb),.045); resize:vertical; }
.followup-sheet-note { margin:9px 0 0; color:var(--text-tertiary); font:400 10px/1.4 var(--font-family); }
.followup-sheet-primary { width:100%; min-height:46px; margin-top:16px; border-radius:12px; font-size:12px; }
.followup-confirm-question { margin:8px 0 20px; color:var(--text-primary); font:550 13px/1.35 var(--font-family); }
.followup-confirm-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; }
.followup-confirm-primary,.followup-confirm-secondary { display:flex; justify-content:center; align-items:center; width:100%; min-height:44px; border-radius:12px; font:650 12px/1.2 var(--font-family); }
.followup-confirm-primary { border:1px solid rgba(var(--accent-rgb),.3); background:var(--accent); color:var(--accent-contrast); box-shadow:0 4px 16px rgba(var(--accent-rgb),.13); }
.followup-confirm-secondary { border:1px solid rgba(var(--theme-rgb),.1); background:rgba(var(--theme-rgb),.045); color:var(--text-secondary-strong); }
@keyframes followup-sheet-in { from { opacity:.85; transform:translateY(18px); } to { opacity:1; transform:translateY(0); } }
@keyframes followup-row-in { from { opacity:0; transform:translateY(3px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:360px) {
  .followup-home-card { padding:14px; }
  .followup-home-footer { gap:10px; }
  .followup-home-cta { min-width:118px; padding:0 10px; }
  .followup-home-thumbs { gap:3px; }
  .followup-home-thumb { width:21px; height:21px; }
  .followup-home-cta { min-width:108px; padding:0 8px; font-size:10.5px; }
  .followup-customer-card { column-gap:9px; }
  .today-filters button { gap:3px; font-size:9px; }
}
@media (prefers-reduced-motion:reduce) { .followup-home-card,.followup-row-action,.followup-customer-card { transition:none; animation:none; } }
body.animations-disabled .followup-home-card,body.animations-disabled .followup-row-action,body.animations-disabled .followup-customer-card { transition:none; animation:none; }
@media (prefers-reduced-motion:reduce) { .followup-message-sheet { animation:none; } }
body.animations-disabled .followup-message-sheet { animation:none; }

/* Follow-ups: a compact, cache-first action list with one mounted screen. */
.followup-root { width:100%; min-width:0; overflow-x:hidden; overflow-y:auto; background:transparent; }
.followup-root.is-active.is-entering { animation:hermes-view-enter 300ms cubic-bezier(.2,.75,.25,1) both; }
.view.is-active.is-entering.followup-route-transition { animation:hermes-view-enter 300ms cubic-bezier(.2,.75,.25,1) both; }
.followup-root .today-page { width:100%; min-width:0; min-height:100%; margin:0; padding:12px 0 calc(env(safe-area-inset-bottom) + 28px); }
.followup-page[hidden],.followup-root [hidden] { display:none !important; }
.followup-root .today-back-btn { margin:0 0 19px; }
.followup-root .today-page h1 { margin-bottom:6px; font-size:20px; font-weight:700; letter-spacing:-.025em; }
.followup-root .today-page-subtitle { margin:0 0 21px; font-size:12px; line-height:1.45; }
.today-rows { display:flex; flex-direction:column; border-top:1px solid rgba(var(--theme-rgb),.065); }
.followup-customer-row { display:grid; grid-template-columns:44px minmax(0,1fr) auto 14px; align-items:center; gap:13px; width:100%; min-height:72px; padding:12px 2px; border:0; border-bottom:1px solid rgba(var(--theme-rgb),.065); background:transparent; color:inherit; text-align:left; cursor:pointer; animation:followup-row-in .16s ease both; }
.followup-customer-row:active { background:rgba(var(--theme-rgb),.025); }
.followup-customer-row.is-removing { animation:followup-row-out .14s ease forwards; pointer-events:none; }
.followup-avatar { display:grid; place-items:center; box-sizing:border-box; width:44px; min-width:44px; max-width:44px; height:44px; min-height:44px; max-height:44px; flex:0 0 44px; aspect-ratio:1 / 1; overflow:hidden; border:1px solid rgba(var(--accent-rgb),.22); border-radius:50%; background:rgba(var(--accent-rgb),.075); color:var(--accent-ink); font:650 12px/1 var(--font-family); white-space:nowrap; }
.followup-row-avatar { grid-column:1; grid-row:1; }
.followup-row-copy { display:flex; min-width:0; flex-direction:column; gap:4px; }
.followup-row-copy strong,.followup-row-copy span,.followup-row-copy small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.followup-row-copy strong { color:var(--text-primary); font:650 13px/1.25 var(--font-family); }
.followup-row-copy span { color:var(--text-secondary-strong); font:450 11px/1.25 var(--font-family); }
.followup-row-copy small { color:var(--text-tertiary); font:400 10px/1.25 var(--font-family); }
.followup-row-send { display:inline-flex; min-width:48px; height:30px; box-sizing:border-box; align-items:center; justify-content:center; padding:0 9px; border:1px solid rgba(var(--accent-rgb),.2); border-radius:10px; background:rgba(var(--accent-rgb),.09); color:var(--accent-ink); font:600 10px/1 var(--font-family); }
.followup-card-chevron { color:var(--text-tertiary); font-size:20px; line-height:1; text-align:right; }
.followup-list-sentinel { height:1px; }
.followup-empty { display:flex; min-height:190px; flex-direction:column; align-items:center; justify-content:center; gap:7px; color:var(--text-secondary); text-align:center; }
.followup-empty[hidden] { display:none !important; }
.followup-empty-check { display:grid; place-items:center; width:34px; height:34px; margin-bottom:4px; border:1px solid rgba(var(--accent-rgb),.24); border-radius:50%; background:rgba(var(--accent-rgb),.07); color:var(--accent-ink); font-size:17px; }
.followup-empty strong { color:var(--text-primary); font:650 14px/1.25 var(--font-family); }
.followup-empty small { color:var(--text-secondary); font:400 11px/1.4 var(--font-family); }
.followup-loading { display:flex; min-height:174px; flex-direction:column; justify-content:center; gap:13px; }
.followup-loading span,.followup-loading i { display:block; border-radius:8px; background:rgba(var(--theme-rgb),.065); }
.followup-loading span { width:44px; height:44px; border-radius:50%; }
.followup-loading i { width:min(74%,280px); height:9px; }
.followup-loading i:nth-child(3) { width:min(54%,210px); }
.followup-loading i:nth-child(4) { width:min(37%,145px); }
.followup-unavailable { display:flex; min-height:110px; align-items:center; justify-content:center; gap:10px; color:var(--text-secondary); }
.followup-unavailable small { font:400 12px/1.4 var(--font-family); }
.followup-unavailable button { min-height:36px; padding:0 13px; border:1px solid rgba(var(--accent-rgb),.2); border-radius:10px; background:rgba(var(--accent-rgb),.07); color:var(--accent-ink); font:600 12px/1 var(--font-family); }
.followup-detail-page { padding-bottom:calc(env(safe-area-inset-bottom) + 26px) !important; }
.followup-customer-heading { display:flex; align-items:center; gap:13px; margin:0 0 22px; }
.followup-customer-heading .followup-avatar { width:48px; min-width:48px; max-width:48px; height:48px; min-height:48px; max-height:48px; flex-basis:48px; font-size:13px; }
.followup-customer-copy { min-width:0; }
.followup-customer-copy h1 { overflow:hidden; margin:0 0 5px !important; text-overflow:ellipsis; white-space:nowrap; }
.followup-customer-copy .today-page-subtitle { margin:0 !important; }
.followup-product-card { min-height:68px; margin:0 0 25px; padding:11px 13px; border-color:rgba(var(--theme-rgb),.09); border-radius:14px; background:rgba(var(--theme-rgb),.045); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); }
.followup-product-card img { width:46px; height:48px; flex:0 0 46px; aspect-ratio:auto; object-fit:cover; border-radius:8px; background:var(--app-raised); }
.followup-product-card strong { display:-webkit-box; overflow:hidden; font-size:12px; line-height:1.4; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.today-message-label { margin-bottom:9px; font-size:10px; }
.followup-message-shell { min-height:155px; padding:14px 15px; border:1px solid rgba(var(--theme-rgb),.09); border-radius:14px; background:rgba(var(--theme-rgb),.045); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); }
.followup-message-preview { margin:0; color:var(--text-primary); font:400 13px/1.55 var(--font-family); white-space:pre-wrap; overflow-wrap:anywhere; }
.followup-message-preview[hidden] { display:none !important; }
.followup-message-shell .today-message-input { display:block; width:100%; min-height:155px; margin:0; padding:0; border:0; border-radius:0; outline:0; background:transparent; resize:vertical; }
.followup-message-shell .today-message-input[hidden] { display:none !important; }
.followup-truth-note { margin:9px 0 0; color:var(--text-tertiary); font:400 10px/1.4 var(--font-family); }
.followup-detail-actions { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:11px; margin-top:24px; padding-bottom:2px; }
.followup-detail-actions button { width:100%; min-height:46px; height:46px; border-radius:12px; font:650 12px/1.2 var(--font-family); }
.followup-detail-actions .today-primary-action { box-shadow:0 5px 18px rgba(var(--accent-rgb),.12); }
.today-inline-error { color:var(--text-secondary-strong); }
.followup-home-card { transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease; }
.followup-home-section.has-pending-followups .followup-home-card { border-color:rgba(var(--accent-rgb),.15); }
.followup-home-cta[hidden] { display:none !important; }
.followup-home-footer[hidden] { display:none !important; }
.followup-home-footer:has(.followup-home-cta[hidden]) { justify-content:flex-start; }
.followup-home-icon { box-shadow:none; }
.followup-home-section.has-pending-followups .followup-home-icon { box-shadow:0 0 12px rgba(var(--accent-rgb),.09); }
.followup-home-context { max-width:128px; }
@media (max-width:370px) {
  .followup-customer-row { grid-template-columns:44px minmax(0,1fr) auto 12px; gap:9px; }
  .followup-detail-actions { gap:8px; }
  .followup-detail-actions button { padding:0 7px; font-size:11px; }
  .followup-home-context { max-width:104px; }
}
@media (prefers-reduced-motion:reduce) { .followup-root.is-active.is-entering,.followup-customer-row,.followup-home-led { animation:none !important; } }
body.animations-disabled .followup-root.is-active.is-entering,body.animations-disabled .followup-customer-row,body.animations-disabled .followup-home-led { animation:none !important; }
@keyframes followup-row-out { to { opacity:0; transform:translateX(7px); } }

/* Follow-ups Home entry: one quiet, whole-card action using the shared
   Hermes surface, text and user-selected accent tokens. */
.followup-home-card { display:flex; align-items:center; min-height:82px; padding:15px 17px; border-color:rgba(var(--theme-rgb),.085); background:rgba(var(--theme-rgb),.035); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.035),0 8px 24px -16px rgba(0,0,0,.42); outline:none; }
.followup-home-card:focus-visible { border-color:rgba(var(--accent-rgb),.34); box-shadow:0 0 0 2px rgba(var(--accent-rgb),.1); }
.followup-home-main { display:grid; width:100%; grid-template-columns:24px minmax(0,1fr) auto 12px; align-items:center; column-gap:12px; }
.followup-home-icon { display:grid; place-items:center; width:24px; height:24px; flex:0 0 24px; border:0; border-radius:0; background:transparent; color:var(--accent-ink); box-shadow:none; }
.followup-home-icon svg { display:block; width:22px; height:22px; }
.followup-home-copy { min-width:0; gap:4px; }
.followup-home-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; color:var(--text-primary); font:620 13px/1.25 var(--font-family); }
.followup-home-title { display:inline-flex; min-width:0; align-items:center; gap:7px; }
.followup-home-led { position:relative; display:inline-block; width:6px; height:6px; flex:0 0 6px; border-radius:50%; background:var(--accent); box-shadow:0 0 5px rgba(var(--accent-rgb),.3); opacity:1; }
.followup-home-led::after { position:absolute; inset:-3px; border-radius:50%; background:rgba(var(--accent-rgb),.25); content:""; filter:blur(3px); }
.followup-home-section.has-pending-followups .followup-home-led:not([hidden]) { animation:followup-status-led 2s ease-in-out infinite alternate; }
@keyframes followup-status-led { from { opacity:.45; } to { opacity:1; } }
.followup-home-led[hidden] { display:none !important; }
.followup-home-status-badge { display:inline-flex; box-sizing:border-box; min-width:32px; height:32px; align-items:center; justify-content:center; padding:0 8px; border:1px solid rgba(var(--accent-rgb),.16); border-radius:11px; background:rgba(var(--accent-rgb),.055); box-shadow:0 0 10px rgba(var(--accent-rgb),.045),inset 0 1px 0 rgba(var(--theme-rgb),.045); color:var(--text-secondary-strong); font:550 11px/1 var(--font-family); font-variant-numeric:tabular-nums; backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); }
.followup-home-chevron { justify-self:end; }
.followup-home-chevron { color:var(--text-tertiary); font:400 20px/1 var(--font-family); }
.followup-home-copy small { display:block; overflow:hidden; margin:0; font:400 11px/1.35 var(--font-family); text-overflow:ellipsis; white-space:nowrap; }
.followup-home-section.has-pending-followups .followup-home-icon { box-shadow:none; }

/* Messages: compact action rows and theme-token glass for the handoff sheet. */
.followup-customer-row {
  grid-template-columns:44px minmax(0,1fr) auto;
  gap:13px;
  min-height:76px;
  padding:12px 0;
  border-bottom-color:rgba(var(--theme-rgb),.075);
}
.followup-row-copy { gap:4px; }
.followup-row-copy strong {
  display:block;
  overflow:visible;
  white-space:normal;
  overflow-wrap:anywhere;
  line-height:1.3;
}
.followup-row-copy small {
  overflow:visible;
  white-space:normal;
  line-height:1.35;
  color:var(--text-secondary);
}
.followup-row-send {
  min-width:70px;
  height:44px;
  padding:0 12px;
  border-color:rgba(var(--accent-rgb),.19);
  border-radius:12px;
  background:rgba(var(--accent-rgb),.075);
  color:var(--accent-ink);
  font-size:11px;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.followup-customer-row:focus-visible .followup-row-send,
.followup-row-send:active {
  border-color:rgba(var(--accent-rgb),.3);
  background:rgba(var(--accent-rgb),.12);
}
.followup-message-sheet {
  max-height:min(88dvh,700px);
  padding:9px 20px calc(env(safe-area-inset-bottom) + 14px);
  border-color:rgba(var(--theme-rgb),.13);
  background:rgba(var(--surface-rgb),.92);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.07),0 -12px 42px rgba(0,0,0,.24);
  backdrop-filter:blur(18px) saturate(1.08);
  -webkit-backdrop-filter:blur(18px) saturate(1.08);
}
#followupOrderPanel,#followupMessagePanel,#followupConfirmPanel { min-width:0; }
.followup-sheet-heading { margin-bottom:14px; }
.followup-sheet-heading h2 {
  overflow:visible;
  white-space:normal;
  overflow-wrap:anywhere;
  font-size:16px;
}
.followup-sheet-heading p { line-height:1.45; }
.followup-sheet-input {
  min-height:120px;
  max-height:min(32dvh,250px);
  overflow-y:auto;
  resize:none;
  border-color:rgba(var(--theme-rgb),.12);
  background:rgba(var(--theme-rgb),.045);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025);
  scroll-padding-block:12px;
}
.followup-sheet-input:focus {
  border-color:rgba(var(--accent-rgb),.34);
  box-shadow:0 0 0 2px rgba(var(--accent-rgb),.065),inset 0 1px 0 rgba(var(--theme-rgb),.025);
}
.followup-sheet-utility { display:flex; min-height:36px; align-items:center; gap:9px; margin-top:8px; }
.followup-copy-order {
  min-height:36px;
  padding:0 10px;
  border:1px solid rgba(var(--theme-rgb),.1);
  border-radius:10px;
  background:rgba(var(--theme-rgb),.045);
  color:var(--text-secondary-strong);
  font:550 10px/1.2 var(--font-family);
}
.followup-copy-order:disabled { opacity:.65; }
.followup-sheet-utility span { color:var(--text-secondary); font:400 10px/1.3 var(--font-family); }
.followup-sheet-note { margin-top:7px; color:var(--text-secondary); }
.followup-sheet-primary { position:sticky; bottom:0; margin-top:12px; box-shadow:0 4px 14px rgba(var(--accent-rgb),.1); }
.followup-confirm-primary { box-shadow:0 4px 14px rgba(var(--accent-rgb),.1); }
@media (max-width:370px) {
  .followup-customer-row { grid-template-columns:42px minmax(0,1fr) auto; gap:10px; }
  .followup-row-avatar { width:42px; min-width:42px; max-width:42px; height:42px; min-height:42px; max-height:42px; }
  .followup-row-send { min-width:64px; padding:0 9px; }
  .followup-message-sheet { padding-inline:16px; }
}
@media (prefers-reduced-motion:reduce) { .followup-row-send { backdrop-filter:none; -webkit-backdrop-filter:none; } }
body.animations-disabled .followup-row-send { transition:none; }
@media (max-width:370px) { .followup-home-card { padding-inline:14px; } .followup-home-main { grid-template-columns:24px minmax(0,1fr) auto 10px; column-gap:9px; } }
@media (prefers-reduced-motion:reduce) { .followup-home-card { transition:none; } }
body.animations-disabled .followup-home-card { transition:none; }

/* Compact Home Photo Vault entry; its geometry is shared with Content Studio below. */
.home-photo-vault-section { margin:12px 0; }
.home-photo-vault-error { display:flex; justify-content:space-between; align-items:center; padding:7px 5px 0; color:var(--text-secondary); font-size:11px; }
.home-photo-vault-error[hidden] { display:none !important; }
.home-photo-vault-error button { border:0; background:transparent; color:var(--accent-ink); font:600 11px/1.2 var(--font-family); }

/* Compact Home entry point for the native, Photo Vault-backed Content Studio. */
.home-content-studio-section { margin:12px 0; }
.home-content-studio-card {
  display:flex; align-items:center; width:100%; min-height:66px; gap:12px; padding:11px 15px;
  border:1px solid rgba(var(--theme-rgb),.09); border-radius:20px; color:var(--text-primary);
  background:rgba(var(--theme-rgb),.035); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.035),0 8px 24px -16px rgba(0,0,0,.42);
  text-align:left; cursor:pointer; transition:transform .16s ease,border-color .16s ease;
}
.home-content-studio-card:active { transform:scale(.992); border-color:rgba(var(--accent-rgb),.25); }
.home-content-studio-icon { display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; border:1px solid rgba(var(--accent-rgb),.2); border-radius:14px; color:var(--accent-ink); background:rgba(var(--accent-rgb),.065); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.075),0 5px 16px -12px rgba(var(--accent-rgb),.42); font-size:20px; }
.home-content-studio-icon svg { width:21px; height:21px; }
.home-content-studio-copy { display:flex; flex:1 1 auto; min-width:0; flex-direction:column; gap:4px; }
.home-content-studio-copy strong { color:var(--text-primary); font-size:14px; font-weight:600; line-height:1.15; }
.home-content-studio-copy small { color:var(--text-secondary); font-size:11px; font-weight:500; line-height:1.2; }
.home-content-studio-chevron { flex:0 0 auto; color:var(--text-secondary); font-size:23px; line-height:1; }
@media (prefers-reduced-motion:reduce) { .home-content-studio-card { transition:none; } }
body.animations-disabled .home-content-studio-card { transition:none; }

/* Messages composer order lookup controls: reuse Hermes theme, glass and CTA tokens. */
.followup-order-id-row {
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-height:38px;
  margin:-5px 0 14px;
  padding:5px 8px 5px 10px;
  border:1px solid rgba(var(--theme-rgb),.09);
  border-radius:11px;
  background:rgba(var(--theme-rgb),.035);
}
.followup-order-id-row > span { color:var(--text-secondary); font:500 10px/1.2 var(--font-family); }
.followup-order-id-row > strong {
  min-width:0;
  color:var(--text-primary);
  font:550 11px/1.25 var(--font-family);
  font-variant-numeric:tabular-nums;
  overflow-wrap:anywhere;
  user-select:all;
}
.followup-order-id-row .followup-copy-order { min-height:30px; padding-inline:10px; }
.followup-sheet-actions {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1.3fr);
  align-items:stretch;
  gap:9px;
  margin-top:12px;
}
.followup-sheet-actions > button {
  min-height:46px;
  padding-inline:9px;
  font-size:10px;
  line-height:1.15;
  text-align:center;
  white-space:normal;
}
.followup-sheet-actions .followup-sheet-primary { position:static; width:auto; margin:0; }
.followup-copy-message {
  border:1px solid rgba(var(--theme-rgb),.1);
  background:rgba(var(--theme-rgb),.045);
  color:var(--text-secondary-strong);
}
.followup-copy-message:disabled,.followup-sheet-actions > button:disabled { opacity:.65; }
.followup-sheet-feedback { margin:8px 0 0; color:var(--text-secondary); font:400 10px/1.35 var(--font-family); }

/* Messages polish: circular count/actions and the compact single-action composer. */
.followup-home-main { grid-template-columns:24px minmax(0,1fr) 34px 12px; }
.followup-home-heading { justify-content:flex-start; }
.followup-home-subline { display:flex !important; min-width:0; align-items:center; gap:6px; }
.followup-home-subline > span:last-child { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.followup-home-led { background:var(--text-primary); box-shadow:0 0 6px rgba(var(--theme-rgb),.24); }
.followup-home-led::after { background:rgba(var(--theme-rgb),.16); }
.followup-home-status-badge {
  width:34px;
  min-width:34px;
  height:34px;
  padding:0;
  border-radius:50%;
  font-size:11px;
}
.followup-avatar svg { display:block; width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.followup-customer-row { grid-template-columns:44px minmax(0,1fr) 44px; }
.followup-row-copy { min-width:0; overflow:hidden; }
.followup-row-copy strong,
.followup-row-copy small { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.followup-row-send {
  width:44px;
  min-width:44px;
  height:44px;
  padding:0;
  border-radius:50%;
  transition:transform .14s ease,background-color .14s ease,border-color .14s ease;
}
.followup-row-send svg { display:block; width:19px; height:19px; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.followup-order-id-row { display:flex; min-height:0; flex-direction:column; align-items:stretch; gap:5px; padding:9px 11px; }
.followup-order-id-row label { color:var(--text-secondary); font:500 10px/1.2 var(--font-family); }
.followup-order-id-row input {
  width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:0;
  border:0;
  outline:0;
  background:transparent;
  color:var(--text-primary);
  font:550 12px/1.35 var(--font-family);
  font-variant-numeric:tabular-nums;
  user-select:all;
}
.followup-sheet-primary {
  width:100%;
  min-height:48px;
  margin-top:12px;
  padding:0 16px;
  border-radius:12px;
  font-size:12px;
  line-height:1.25;
  text-align:center;
  white-space:normal;
  transition:transform .14s ease,filter .14s ease,background-color .14s ease;
}
.followup-sheet-primary:active,.followup-row-send:active { transform:scale(.985); }
@media (prefers-reduced-motion:reduce) {
  .followup-home-led { animation:none !important; opacity:1; }
  .followup-sheet-primary,.followup-row-send { transition:none; }
}
body.animations-disabled .followup-home-led,
body.animations-disabled .followup-sheet-primary,
body.animations-disabled .followup-row-send { animation:none !important; transition:none; }
.followup-sheet-feedback[hidden] { display:none; }
@media (max-width:370px) {
  .followup-sheet-actions { grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr); gap:7px; }
  .followup-sheet-actions > button { padding-inline:7px; font-size:9.5px; }
}
@media (prefers-reduced-motion:reduce) { .followup-home-led { opacity:1; } }
body.animations-disabled .followup-home-led { opacity:1; }

/* Final Messages polish: the subtitle sits in a small theme-tinted glass
   capsule, while the circular count and person avatars keep their geometry. */
.followup-home-card { border-radius:22px; }
.followup-home-copy { align-items:flex-start; gap:7px; }
.followup-home-heading { display:flex; align-items:center; gap:7px; }
.followup-home-subline {
  display:inline-flex !important;
  box-sizing:border-box;
  width:fit-content;
  max-width:100%;
  min-height:24px;
  align-items:center;
  overflow:visible !important;
  padding:4px 8px;
  border:1px solid rgba(var(--accent-rgb),.17);
  border-radius:9px;
  background:rgba(var(--accent-rgb),.075);
  color:var(--text-secondary-strong);
  font:400 10px/1.25 var(--font-family);
  text-overflow:clip;
  white-space:normal;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}
.followup-home-subline[hidden] { display:none !important; }
.followup-home-led { position:relative; }
.followup-home-led::after { pointer-events:none; }
.followup-avatar svg { width:26px; height:26px; }
.followup-composer-copy-row { display:flex; min-height:34px; align-items:center; gap:10px; margin:-3px 0 12px; }
.followup-copy-message {
  display:inline-flex;
  min-width:44px;
  min-height:34px;
  align-items:center;
  justify-content:center;
  padding:0 12px;
  border:1px solid rgba(var(--accent-rgb),.2);
  border-radius:999px;
  background:rgba(var(--accent-rgb),.09);
  color:var(--accent-ink);
  font:550 10px/1 var(--font-family);
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
  transition:transform .14s ease,background-color .14s ease,border-color .14s ease;
}
.followup-copy-message:active { transform:scale(.98); background:rgba(var(--accent-rgb),.14); }
.followup-copy-message:disabled { opacity:.75; }
.followup-confirm-copy { margin:0 0 10px; }
.followup-sheet-feedback { min-width:0; margin:0; color:var(--text-secondary); font:400 10px/1.35 var(--font-family); }
.followup-sheet-feedback[hidden] { display:none !important; }
.followup-confirm-actions { margin-top:8px; }
.followup-confirm-grabber {
  position:relative;
  width:100%;
  height:30px;
  box-sizing:border-box;
  margin:-2px auto 12px;
  padding-top:13px;
  touch-action:none;
  cursor:grab;
}
.followup-confirm-grabber::before {
  display:block;
  width:34px;
  height:4px;
  margin:0 auto;
  border-radius:4px;
  background:rgba(var(--theme-rgb),.24);
  content:"";
}
.followup-message-sheet { touch-action:pan-y; }
#followupMessageSheet .followup-message-sheet {
  border:1px solid rgba(var(--theme-rgb),.035);
  border-top-color:rgba(var(--theme-rgb),.075);
  border-bottom-color:rgba(var(--theme-rgb),.025);
  box-shadow:var(--hermes-glass-elevated-shadow);
}
#followupMessageSheet .followup-message-sheet button { transition:box-shadow 140ms ease,border-color 140ms ease; }
#followupMessageSheet .followup-message-sheet button.is-led-pressed,
#followupMessageSheet .followup-message-sheet button.is-led-held {
  border-color:rgba(var(--accent-rgb),.28);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 0 7px rgba(var(--accent-rgb),.13);
}
#followupMessageSheet .followup-message-sheet button.is-led-held { border-color:rgba(var(--accent-rgb),.38); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.075),0 0 9px rgba(var(--accent-rgb),.18); }
@media (prefers-reduced-motion:reduce) { #followupMessageSheet .followup-message-sheet button { transition:none; } }
body.animations-disabled #followupMessageSheet .followup-message-sheet button { transition:none; }
@media (max-width:370px) {
  .followup-home-main { column-gap:9px; }
  .followup-home-subline { font-size:9.5px; padding-inline:7px; }
}
@media (prefers-reduced-motion:reduce) { .followup-copy-message { transition:none; } }
body.animations-disabled .followup-copy-message { transition:none; }

/* Messages hotfix: a single compact Home capsule and a transparent sheet
   drag target with only the native-style grip visible. */
.followup-home-card {
  box-sizing:border-box;
  height:68px;
  min-height:68px;
  padding:0 15px;
  border-radius:34px;
  border-color:rgba(var(--accent-rgb),.13);
  background:rgba(var(--surface-rgb),.62);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.045),0 8px 24px -17px rgba(0,0,0,.48),0 0 22px -17px rgba(var(--accent-rgb),.3);
  backdrop-filter:blur(16px) saturate(1.04);
  -webkit-backdrop-filter:blur(16px) saturate(1.04);
}
.followup-home-section.has-pending-followups .followup-home-card {
  border-color:rgba(var(--accent-rgb),.18);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.05),0 8px 24px -17px rgba(0,0,0,.48),0 0 24px -17px rgba(var(--accent-rgb),.36);
}
.followup-home-main {
  display:grid;
  width:100%;
  grid-template-columns:24px minmax(0,1fr) 32px 10px;
  align-items:center;
  column-gap:12px;
}
.followup-home-icon { width:24px; height:24px; flex:0 0 24px; }
.followup-home-icon svg { width:22px; height:22px; }
.followup-home-copy { min-width:0; gap:0; }
.followup-home-heading {
  justify-content:flex-start;
  color:var(--text-primary);
  font:620 13px/1.25 var(--font-family);
}
.followup-home-status-badge {
  width:32px;
  min-width:32px;
  height:32px;
  padding:0;
  border-color:rgba(var(--accent-rgb),.2);
  border-radius:50%;
  background:rgba(var(--accent-rgb),.075);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.06),0 0 12px rgba(var(--accent-rgb),.07);
  color:var(--accent-ink);
  font:550 11px/1 var(--font-family);
  font-variant-numeric:tabular-nums;
}
.followup-home-chevron { color:var(--text-tertiary); font:400 19px/1 var(--font-family); }
.followup-home-subline,.followup-home-led { display:none !important; }
.followup-confirm-grabber {
  position:relative;
  display:block;
  box-sizing:border-box;
  width:100%;
  height:14px;
  margin:0 auto 10px;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent !important;
  box-shadow:none !important;
  touch-action:none;
  cursor:grab;
}
.followup-confirm-grabber::before {
  position:absolute;
  top:3px;
  left:50%;
  display:block;
  width:34px;
  height:4px;
  margin:0;
  transform:translateX(-50%);
  border:0;
  border-radius:999px;
  background:rgba(var(--theme-rgb),.25);
  content:"";
}
.followup-confirm-question { margin:8px 0 16px; }
.followup-confirm-actions { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:10px; margin-top:12px; }
.followup-confirm-error { margin-top:0; }
.followup-composer-copy-row { min-height:34px; margin:-2px 0 11px; }
.followup-copy-message { min-height:34px; }
/* Stable circular count: a fixed square grid centers every digit count on
   the same optical center. Only a nonzero queue gets the restrained pulse. */
.followup-home-status-badge {
  display:grid;
  box-sizing:border-box;
  place-items:center;
  width:34px;
  min-width:34px;
  height:34px;
  padding:0;
  border:1px solid rgba(var(--theme-rgb),.12);
  border-radius:50%;
  background:rgba(var(--theme-rgb),.055);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.055);
  color:var(--text-secondary-strong);
  font:550 10px/1 var(--font-family);
  font-variant-numeric:tabular-nums;
  letter-spacing:-.02em;
  text-align:center;
}
.followup-home-main { grid-template-columns:24px minmax(0,1fr) 34px 10px; }
.followup-home-section.has-pending-followups .followup-home-status-badge {
  border-color:rgba(var(--accent-rgb),.22);
  background:rgba(var(--accent-rgb),.085);
  color:var(--accent-ink);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.07),0 0 7px rgba(var(--accent-rgb),.13),0 0 16px rgba(var(--accent-rgb),.09);
  animation:followup-count-breathe 2.2s ease-in-out infinite;
}
@keyframes followup-count-breathe {
  0%,100% { box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.06),0 0 5px rgba(var(--accent-rgb),.08),0 0 12px rgba(var(--accent-rgb),.05); }
  50% { box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.08),0 0 8px rgba(var(--accent-rgb),.16),0 0 18px rgba(var(--accent-rgb),.11); }
}
@media (prefers-reduced-motion:reduce) {
  .followup-home-section.has-pending-followups .followup-home-status-badge { animation:none; }
}
body.animations-disabled .followup-home-section.has-pending-followups .followup-home-status-badge { animation:none; }
@media (max-width:370px) {
  .followup-home-card { padding-inline:13px; }
  .followup-home-main { grid-template-columns:24px minmax(0,1fr) 32px 9px; column-gap:9px; }
}

/* Messages count: keep the live number unboxed and aligned with the card's
   trailing chevron. The theme accent supplies the restrained numeral glow. */
.followup-home-main { grid-template-columns:24px minmax(0,1fr) auto 10px; }
.followup-home-status-badge {
  display:flex;
  width:auto;
  min-width:0;
  height:auto;
  align-items:center;
  justify-content:center;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  color:var(--accent-ink);
  font:600 13px/1.2 var(--font-family);
  font-variant-numeric:tabular-nums;
  text-align:center;
  text-shadow:0 0 7px rgba(var(--accent-rgb),.28);
}
.followup-home-section:not(.has-pending-followups) .followup-home-status-badge {
  color:var(--text-secondary-strong);
  text-shadow:none;
}
.followup-home-section.has-pending-followups .followup-home-status-badge {
  color:var(--accent-ink);
  text-shadow:0 0 8px rgba(var(--accent-rgb),.32);
  animation:none;
}
@media (max-width:370px) {
  .followup-home-main { grid-template-columns:24px minmax(0,1fr) auto 9px; }
}

/* Messages composer: Copy Message and Mark as Sent are explicit actions from
   the same customer sheet; app activation never creates a confirmation. */
#followupMessagePanel .followup-copy-message {
  display:inline-flex;
  min-height:40px;
  align-items:center;
  justify-content:center;
  margin:0 0 12px;
  padding:0 13px;
  border:1px solid rgba(var(--accent-rgb),.2);
  border-radius:999px;
  background:rgba(var(--accent-rgb),.075);
  color:var(--accent-ink);
  font:550 10px/1 var(--font-family);
  transition:transform .14s ease,background-color .14s ease;
}
#followupMessagePanel .followup-copy-message:active { transform:scale(.98); background:rgba(var(--accent-rgb),.12); }
#followupOrderPanel .followup-mark-sent-link,
#followupMessagePanel .followup-mark-sent-link {
  display:flex;
  width:100%;
  min-height:44px;
  align-items:center;
  justify-content:center;
  margin-top:10px;
  border:1px solid rgba(var(--theme-rgb),.1);
  border-radius:12px;
  background:rgba(var(--theme-rgb),.035);
  color:var(--text-secondary-strong);
  font:550 11px/1.2 var(--font-family);
}
#followupOrderPanel .followup-mark-sent-link:active,
#followupMessagePanel .followup-mark-sent-link:active { background:rgba(var(--accent-rgb),.07); }
#followupOrderPanel .followup-sheet-primary { margin-top:4px; }
#followupMessagePanel .today-message-label { margin:0 0 8px; }
#followupMessagePanel .followup-sheet-input { display:block; width:100%; min-height:clamp(130px,26dvh,230px); }
#followupMessagePanel .followup-sheet-primary { margin-top:14px; }
#followupMessageError { margin-top:8px; }
#followupOrderPanel .today-inline-error[hidden],#followupMessagePanel .today-inline-error[hidden] { display:none; }
#followupConfirmPanel .followup-sheet-heading { margin-bottom:14px; }
#followupConfirmPanel .followup-sheet-heading h2 { margin-bottom:5px; }
#followupConfirmPanel .followup-confirm-support { margin:0 0 20px; color:var(--text-secondary); font:400 12px/1.5 var(--font-family); }
#followupConfirmPanel .followup-confirm-actions { margin-top:0; }
#followupOrderPanel .followup-mark-sent-link { margin-top:10px; }
#followupMessagePanel .followup-mark-sent-link { margin-top:10px; }
.followup-sent-toast { position:fixed; z-index:1650; left:50%; bottom:calc(env(safe-area-inset-bottom) + 22px); width:max-content; max-width:calc(100vw - 40px); padding:11px 15px; transform:translateX(-50%); border:1px solid rgba(var(--accent-rgb),.18); border-radius:999px; background:rgba(var(--surface-rgb,12,12,16),.94); color:var(--text-primary); box-shadow:0 8px 26px rgba(0,0,0,.28); font:550 11px/1.3 var(--font-family); text-align:center; }
.followup-sent-toast[hidden] { display:none !important; }
@media (prefers-reduced-motion:reduce) { #followupMessagePanel .followup-copy-message { transition:none; } }
body.animations-disabled #followupMessagePanel .followup-copy-message { transition:none; }

/* One shared web material matching Content Studio's native darkSurface:
   tinted translucent fill, restrained top-leading reflection, fine gradient
   edge and no extra blur or shadow layer. Geometry remains component-owned. */
.app-header,.bottom-nav,.connection-toast,
.home-perf-card,.home-performance-card,.home-tool-card,.etsy-ads-overview,.analytics-metrics-grid,
.store-goals-preview,.store-goals-detail-card,.activity-sale-event,.activity-sale-card,.activity-sale-orb,
.library-search-field,.mockup-favorite-star,.draft-artwork-preview-close,.editor-sticky-footer,.create-sticky-footer,
.editor-media-rank-badge,.poster-insight-hero .insight-marker-callout,
.activity-header-button,.activity-floating-toast,.followup-home-card,.followup-home-status-badge,.followup-home-subline,
.followup-row-send,.followup-message-sheet,.followup-copy-message,.followup-copy-order,.followup-mark-sent-link,.followup-sent-toast,
.home-photo-vault-card,.home-content-studio-card,.home-content-studio-icon,.hermes-glass-close,.hermes-home-glass {
  background:var(--hermes-glass-background);
  border-color:transparent;
  -webkit-backdrop-filter:var(--hermes-glass-blur);
  backdrop-filter:var(--hermes-glass-blur);
  box-shadow:var(--hermes-glass-shadow);
}
.library-header-actions .library-action-pill.hermes-home-glass {
  border-color:rgba(var(--accent-rgb),.16);
  color:var(--accent-ink);
}
.connection-toast { border-color:rgba(var(--accent-rgb),.16); }

/* Shared elevation for nested glass controls only; base glass remains flat. */
.glass-surface--elevated { box-shadow:var(--hermes-glass-elevated-shadow); }
.activity-sale-orb { position:relative; isolation:isolate; }
.activity-sale-orb::after { content:""; position:absolute; z-index:0; inset:0; border:1px solid rgba(var(--theme-rgb),.035); border-top-color:rgba(255,255,255,.085); border-radius:inherit; background:linear-gradient(145deg,rgba(var(--theme-rgb),.025),rgba(var(--accent-rgb),.012) 45%,transparent 78%); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.035); pointer-events:none; }
.analytics-insights-section { margin-top:24px; padding-top:18px; border-top:1px solid rgba(var(--theme-rgb),.07); }
.analytics-insights-heading { display:flex; align-items:center; justify-content:space-between; margin:0 0 12px; }
.analytics-insights-heading h2 { margin:3px 0 0; color:var(--text-primary); font-size:21px; font-weight:700; letter-spacing:-.025em; }
.analytics-insights-subtitle { margin:3px 0 0; color:var(--text-secondary); font-size:11.5px; line-height:1.35; }
.analytics-opportunities-block { margin-top:18px; }
.analytics-opportunities-block > .section-label { margin-bottom:9px; }

/* A Home-only highlight layer sits above, but never replaces, the shared
   Build 21 glass surface. Its softly tinted wash and fine brighter top rim
   restore material depth while keeping the edge secondary to the card. */
#view-home .home-perf-card,
#view-home .home-performance-card,
#view-home .home-tool-card,
#view-home .store-goals-preview,
#view-home .home-photo-vault-card,
#view-home .home-content-studio-card,
#view-analytics .analytics-metrics-grid,
.listings-list > [data-key],
.hermes-home-glass {
  position:relative;
}
#view-home .home-perf-card::after,
#view-home .home-performance-card::after,
#view-home .home-tool-card::after,
#view-home .store-goals-preview::after,
#view-home .home-photo-vault-card::after,
#view-home .home-content-studio-card::after,
#view-analytics .analytics-metrics-grid::after,
.listings-list > [data-key]::after,
.hermes-home-glass::after {
  content:"";
  position:absolute;
  z-index:3;
  inset:0;
  border:1px solid rgba(var(--theme-rgb),.035);
  border-top-color:rgba(var(--theme-rgb),.075);
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(var(--accent-rgb),.008) 48%,transparent 100%);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025);
  pointer-events:none;
  transition:border-color .32s ease,box-shadow .32s ease,background .32s ease;
}

/* Touch-reactive perimeter illumination is only activated during an
   intentional press on an interactive Home glass card. The material and
   base Build 23 edge remain present beneath this restrained highlight. */
#view-home .home-tool-card { --home-led-rgb:188,150,95; }
#view-home .home-tool-card,#view-home .store-goals-preview,#view-home .home-photo-vault-card button,#view-home .home-content-studio-card {
  -webkit-touch-callout:none;
  user-select:none;
  -webkit-user-select:none;
}
#view-home .home-perf-card.is-led-pressed::after,
#view-home .home-performance-card.is-led-pressed::after,
#view-home .home-tool-card.is-led-pressed::after,
#view-home .store-goals-preview.is-led-pressed::after,
#view-home .home-photo-vault-card.is-led-pressed::after,
#view-home .home-content-studio-card.is-led-pressed::after,
.hermes-home-glass.is-led-pressed::after {
  border-color:rgba(var(--home-led-rgb,var(--accent-rgb)),.24);
  border-top-color:rgba(var(--home-led-rgb,var(--accent-rgb)),.42);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 5px rgba(var(--home-led-rgb,var(--accent-rgb)),.12);
  transition:border-color 120ms ease,box-shadow 120ms ease;
}
#view-home .home-tool-card.is-led-held::after,
#view-home .store-goals-preview.is-led-held::after,
#view-home .home-photo-vault-card.is-led-held::after,
#view-home .home-content-studio-card.is-led-held::after,
.hermes-home-glass.is-led-held::after {
  border-color:rgba(var(--home-led-rgb,var(--accent-rgb)),.34);
  border-top-color:rgba(var(--home-led-rgb,var(--accent-rgb)),.56);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 0 8px rgba(var(--home-led-rgb,var(--accent-rgb)),.19);
}
#view-home .home-tool-card.is-led-pressed::after,
#view-home .store-goals-preview.is-led-pressed::after,
#view-home .home-photo-vault-card.is-led-pressed::after,
#view-home .home-content-studio-card.is-led-pressed::after { transition:border-color 100ms ease,box-shadow 100ms ease; }
#view-home .home-tool-card:focus-visible,
#view-home .store-goals-preview:focus-visible,
#view-home .home-content-studio-card:focus-visible,
#view-home .home-photo-vault-card:focus-visible { outline:2px solid rgba(var(--accent-rgb),.72); outline-offset:3px; }
@media (prefers-reduced-motion:reduce) {
  #view-home .home-tool-card::after,#view-home .store-goals-preview::after,#view-home .home-photo-vault-card::after,#view-home .home-content-studio-card::after,.hermes-home-glass::after { transition:none !important; }
}
body.animations-disabled #view-home .home-tool-card::after,
body.animations-disabled #view-home .store-goals-preview::after,
body.animations-disabled #view-home .home-photo-vault-card::after,
body.animations-disabled #view-home .home-content-studio-card::after,body.animations-disabled .hermes-home-glass::after { transition:none !important; }

/* WKWebView text-selection policy: static app UI must not start iOS's
   selection loupe/callout during a long press. Editable fields and the
   existing intentionally selectable order identifiers keep native editing. */
#app,#app * { -webkit-touch-callout:none; -webkit-user-select:none; user-select:none; }
#app input,#app textarea,#app select,#app [contenteditable="true"],#app [contenteditable="true"] *,#app [role="textbox"],#app [data-text-selection="allow"] {
  -webkit-touch-callout:default; -webkit-user-select:text; user-select:text;
}
#app .followup-order-id-row > strong { -webkit-user-select:all; user-select:all; }

/* The existing Activity Feed is Hermes' notification center. Its rows use
   the shared dark glass material; only the unread marker carries lavender. */
.activity-unread-badge {
  top:-1px; right:-2px; min-width:15px; height:15px; padding:0 3px;
  border-width:1px; background:rgba(var(--accent-rgb),.92);
  font-size:8px; font-weight:750; letter-spacing:-.02em;
}
.activity-sale-event { position:relative; isolation:isolate; overflow:hidden; transition:transform .22s cubic-bezier(.22,1,.36,1),border-color .18s ease,background-color .18s ease; }
.activity-sale-event::after {
  content:""; position:absolute; z-index:0; inset:0; border:1px solid rgba(var(--theme-rgb),.035);
  border-top-color:rgba(var(--theme-rgb),.075); border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(var(--accent-rgb),.008) 48%,transparent 100%);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); pointer-events:none;
}
.activity-sale-event > * { position:relative; z-index:1; }
.activity-sale-event:active { border-color:rgba(var(--accent-rgb),.18); }
.activity-feed-empty { min-height:116px; margin-top:8px; border:1px solid rgba(var(--theme-rgb),.045); border-radius:18px; background:var(--hermes-glass-background); }
@media (prefers-reduced-motion:reduce) { .activity-sale-event { transition:none; } }
body.animations-disabled .activity-sale-event { transition:none; }

/* Build 27: only the Messages-to-Create gap gets the requested small nudge. */
#view-home #homeFollowupSection + #homeCreateCta { margin-top:calc(var(--home-card-gap) + 7px); }

/* Photo Vault keeps one quiet gallery glyph instead of decoding a thumbnail
   strip on Home; the count and the existing actions remain unchanged. */

/* The message sheet is mounted once and translated as a single surface.
   This avoids the old opacity/keyframe entry flash and keeps the handle drag
   directly tied to the panel under the pointer. */
.followup-sheet-backdrop {
  background:rgba(0,0,0,0); -webkit-backdrop-filter:none; backdrop-filter:none;
  transition:background .28s ease,-webkit-backdrop-filter .28s ease,backdrop-filter .28s ease;
}
.followup-sheet-backdrop.is-sheet-visible { background:rgba(0,0,0,.48); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); }
.followup-message-sheet {
  transform:translateY(100%); animation:none; will-change:transform;
  transition:transform .34s cubic-bezier(.22,.88,.24,1);
  touch-action:pan-y;
}
.followup-message-sheet.is-sheet-open { transform:translateY(0); }
.followup-message-sheet.is-sheet-dragging { transition:none; touch-action:none; }
.followup-confirm-grabber { min-height:18px; width:42px; padding-top:7px; box-sizing:content-box; touch-action:none; cursor:grab; }
.followup-confirm-grabber:active { cursor:grabbing; }
@media (prefers-reduced-motion:reduce) {
  .followup-sheet-backdrop,.followup-message-sheet { transition:none !important; }
}
body.animations-disabled .followup-sheet-backdrop,body.animations-disabled .followup-message-sheet { transition:none !important; }

/* Edit Draft Content and Media use the Listings surface itself; inputs stay
   visually distinct and the highlight is one shared perimeter layer. */
#editorSection-content,#editorSection-media,#editorSection-files,#editorSection-details {
  position:relative; isolation:isolate; margin:0 0 10px; padding:0;
  border:1px solid transparent; border-radius:14px; background:var(--hermes-glass-background);
  box-shadow:var(--hermes-glass-shadow);
}
#editorSection-content::after,#editorSection-media::after,#editorSection-files::after,#editorSection-details::after {
  content:""; position:absolute; z-index:0; inset:0; border:1px solid rgba(var(--theme-rgb),.035);
  border-top-color:rgba(var(--theme-rgb),.075); border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(var(--accent-rgb),.008) 48%,transparent 100%);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); pointer-events:none;
}
#editorSection-content > *,#editorSection-media > *,#editorSection-files > *,#editorSection-details > * { position:relative; z-index:1; }
#editorSection-content .editor-section-toggle,#editorSection-media .editor-section-toggle,#editorSection-files .editor-section-toggle,#editorSection-details .editor-section-toggle { padding-inline:12px; }
#editorSection-content .editor-section-body-inner,#editorSection-media .editor-section-body-inner,#editorSection-files .editor-section-body-inner,#editorSection-details .editor-section-body-inner { padding:4px 12px 18px; }
#editorSection-content .editor-tags-field { padding-top:0; }
.editor-tags-heading { margin-bottom:11px; }
.editor-tags-editor { padding-top:8px; padding-bottom:8px; }

/* One set of Listings glass tokens on Analytics Priority Actions. */
#insightsWeeklyPlan .insight-card {
  position:relative; isolation:isolate; overflow:hidden; border:1px solid transparent;
  border-radius:14px; background:var(--hermes-glass-background); box-shadow:var(--hermes-glass-shadow);
}
#insightsWeeklyPlan .insight-card::after {
  content:""; position:absolute; z-index:0; inset:0; border:1px solid rgba(var(--theme-rgb),.035);
  border-top-color:rgba(var(--theme-rgb),.075); border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(var(--accent-rgb),.008) 48%,transparent 100%);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); pointer-events:none;
}
#insightsWeeklyPlan .insight-card > * { position:relative; z-index:1; }
#insightsWeeklyPlan .insight-card { padding:12px; }
#insightsWeeklyPlan .insight-summary-copy { margin:8px 0 0; color:var(--text-secondary); font-size:11.5px; line-height:1.42; }
#insightsWeeklyPlan .insight-card-open { display:flex; align-items:center; justify-content:space-between; width:100%; min-height:36px; margin-top:5px; padding:0 2px; border:0; background:transparent; color:var(--accent-ink); font:600 11.5px/1 var(--font-family); text-align:left; -webkit-tap-highlight-color:transparent; }
#insightsWeeklyPlan .insight-action-details { margin-top:7px; }
#insightsWeeklyPlan .insights-premium-empty { display:flex; align-items:flex-start; gap:10px; padding:12px 13px; border:1px solid rgba(var(--theme-rgb),.035); border-top-color:rgba(var(--theme-rgb),.075); border-radius:14px; background:var(--hermes-glass-background); box-shadow:var(--hermes-glass-shadow); color:var(--text-secondary); }
#insightsWeeklyPlan .insights-premium-empty > span { display:grid; place-items:center; width:22px; height:22px; flex:0 0 22px; border-radius:50%; background:rgba(var(--accent-rgb),.09); color:var(--accent-ink); font-size:12px; }
#insightsWeeklyPlan .insights-premium-empty strong,#insightsWeeklyPlan .insights-premium-empty small { display:block; }
#insightsWeeklyPlan .insights-premium-empty strong { color:var(--text-primary); font-size:12px; font-weight:650; }
#insightsWeeklyPlan .insights-premium-empty small { margin-top:3px; color:var(--text-secondary); font-size:10.5px; line-height:1.4; }
#insightsWeeklyPlan .insight-action-row {
  position:relative; isolation:isolate; overflow:hidden; min-height:40px; margin-top:9px; padding:5px 9px;
  border:1px solid transparent; border-radius:11px; background:var(--hermes-glass-background);
  -webkit-backdrop-filter:var(--hermes-glass-blur); backdrop-filter:var(--hermes-glass-blur);
  box-shadow:var(--hermes-glass-elevated-shadow); transition:border-color 140ms ease,box-shadow 140ms ease;
}
#insightsWeeklyPlan .insight-action-row::after { content:""; position:absolute; z-index:0; inset:0; border:1px solid rgba(var(--theme-rgb),.035); border-top-color:rgba(var(--theme-rgb),.075); border-radius:inherit; background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(var(--accent-rgb),.008) 48%,transparent 100%); pointer-events:none; }
#insightsWeeklyPlan .insight-action-row > * { position:relative; z-index:1; }
#insightsWeeklyPlan .insight-action-row.is-led-pressed { border-color:rgba(var(--accent-rgb),.28); box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 0 7px rgba(var(--accent-rgb),.13); }
#insightsWeeklyPlan .insight-action-row.is-led-held { border-color:rgba(var(--accent-rgb),.38); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.075),0 0 9px rgba(var(--accent-rgb),.18); }
#insightsWeeklyPlan .insight-card.is-led-pressed { border-color:rgba(var(--accent-rgb),.28); box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 0 7px rgba(var(--accent-rgb),.13); }
#insightsWeeklyPlan .insight-card.is-led-held { border-color:rgba(var(--accent-rgb),.38); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.075),0 0 9px rgba(var(--accent-rgb),.18); }

/* Removal mode uses a native-size hit area and a restrained red glass control. */
.editor-media-tile.is-removal-armed { animation:none; }
.editor-media-remove-btn:focus-visible { outline:2px solid rgba(var(--accent-rgb),.76); outline-offset:2px; }
.editor-media-tile.is-removal-armed .editor-media-remove-face { animation:editor-remove-control-in .15s cubic-bezier(.2,.8,.25,1) both; }

.editor-media-remove-confirm[hidden] { display:none !important; }
.editor-media-remove-confirm {
  position:fixed; z-index:1800; inset:0; display:flex; align-items:center; justify-content:center;
  padding:20px; background:rgba(0,0,0,.52); -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);
}
.editor-media-remove-confirm-scrim { position:absolute; inset:0; border:0; background:transparent; }
.editor-media-remove-confirm-card {
  position:relative; width:min(100%,360px); padding:20px 18px 16px; border:1px solid rgba(var(--theme-rgb),.075);
  border-radius:18px; background:var(--hermes-glass-background); color:var(--text-primary); text-align:center;
  box-shadow:0 18px 48px rgba(0,0,0,.38); transform:translateY(8px) scale(.985); opacity:0;
  transition:transform .18s cubic-bezier(.2,.8,.25,1),opacity .18s ease;
}
.editor-media-remove-confirm.is-open .editor-media-remove-confirm-card { transform:none; opacity:1; }
.editor-media-remove-confirm-card h2 { margin:0; font-size:16px; font-weight:680; }
.editor-media-remove-confirm-card p { margin:8px 0 17px; color:var(--text-secondary); font-size:12px; line-height:1.45; }
.editor-media-remove-confirm-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; }
.editor-media-remove-confirm-actions button { min-height:42px; border-radius:11px; font:600 12px/1 var(--font-family); }
.editor-media-remove-cancel { border:1px solid rgba(255,255,255,.09); background:rgba(var(--theme-rgb),.045); color:var(--text-secondary-strong); }
.editor-media-remove-accept { border:1px solid rgba(230,90,110,.3); background:rgba(151,48,65,.72); color:#fff; }
.editor-media-remove-accept:disabled { opacity:.55; }
@media (prefers-reduced-motion:reduce) { .editor-media-tile.is-removal-armed,.editor-media-remove-confirm-card { animation:none; transition:none; transform:none; } }
body.animations-disabled .editor-media-tile.is-removal-armed,body.animations-disabled .editor-media-remove-confirm-card { animation:none; transition:none; transform:none; }

/* Each Listings row is its own low-contrast glass surface. The parent owns
   the complete rounded perimeter; the row stays transparent so it cannot
   cover the material or leave a bottom-only separator behind. */
.listings-list > [data-key] {
  position:relative;
  overflow:hidden;
  box-sizing:border-box;
  border:1px solid transparent;
  border-radius:14px;
  margin-bottom:0;
  background:var(--hermes-glass-background);
}
.listing-row {
  position:relative;
  z-index:1;
  background:transparent;
  border-bottom:0;
}

/* Chrome is intentionally denser than content glass so scrolling text does
   not show through the persistent header or bottom navigation. */
.app-header,.bottom-nav {
  background:var(--hermes-chrome-background);
  -webkit-backdrop-filter:var(--hermes-chrome-backdrop);
  backdrop-filter:var(--hermes-chrome-backdrop);
}
.editor-sticky-footer {
  background:var(--hermes-chrome-background);
  -webkit-backdrop-filter:var(--hermes-chrome-backdrop);
  backdrop-filter:var(--hermes-chrome-backdrop);
}

/* Build 26 final cascade: the same complete Listings glass edge, reused on
   Messages, Top Posters and Library search without changing their material. */
#view-followups .today-rows { display:flex; flex-direction:column; gap:8px; border-top:0; }
#view-followups .followup-customer-row {
  position:relative; overflow:hidden; box-sizing:border-box; min-height:72px;
  padding:11px 12px; border:1px solid transparent; border-bottom:1px solid transparent;
  border-radius:14px; background:var(--hermes-glass-background); box-shadow:var(--hermes-glass-shadow);
}
#view-followups .followup-customer-row::after,
.top-posters-list > [data-key]::after,
.library-search-field::after,
.listings-search-field::after {
  content:""; position:absolute; z-index:3; inset:0; border:1px solid rgba(var(--theme-rgb),.035);
  border-top-color:rgba(var(--theme-rgb),.075); border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.018),rgba(var(--accent-rgb),.008) 48%,transparent 100%);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025); pointer-events:none;
}
#view-followups .followup-customer-row > *,
.top-posters-list .top-poster-row > *,
.library-search-field > *, .listings-search-field > * { position:relative; z-index:1; }
#view-followups .followup-customer-row:active { background:var(--hermes-glass-background); filter:brightness(1.035); }
#view-followups .followup-customer-row { transition:border-color 140ms ease,box-shadow 140ms ease; }
#view-followups .followup-customer-row.is-led-pressed,
#view-followups .followup-customer-row.is-led-held { border-color:rgba(var(--accent-rgb),.28); box-shadow:inset 0 1px 0 rgba(255,255,255,.055),0 0 7px rgba(var(--accent-rgb),.13); }
#view-followups .followup-customer-row.is-led-held { border-color:rgba(var(--accent-rgb),.38); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.075),0 0 9px rgba(var(--accent-rgb),.18); }
.top-posters-list { gap:8px; }
.top-posters-list > [data-key] {
  position:relative; overflow:hidden; box-sizing:border-box; border:1px solid transparent;
  border-radius:14px; background:var(--hermes-glass-background); box-shadow:var(--hermes-glass-shadow);
}
.top-posters-list .top-poster-row { position:relative; z-index:1; min-height:64px; padding:10px 12px; border:0; background:transparent; }
.top-posters-list .top-poster-row:active { background:transparent; filter:brightness(1.035); }
.library-search-field { position:relative; isolation:isolate; border:1px solid transparent; }
.library-search-field,.listings-search-field { width:100%; min-height:44px; padding:0 8px; border-radius:13px; background:var(--hermes-glass-background); -webkit-backdrop-filter:var(--hermes-glass-blur); backdrop-filter:var(--hermes-glass-blur); box-shadow:var(--hermes-glass-shadow); }
.listings-search-field { position:relative; isolation:isolate; border:1px solid transparent; }
.library-search-field::after,.listings-search-field::after { z-index:0; }
.library-search-field .listings-search,.listings-search-field .listings-search { min-height:44px; padding:0 40px 0 8px; border:0; border-radius:inherit; background:transparent; }
.library-search-field:focus-within::after,.listings-search-field:focus-within::after { border-top-color:rgba(var(--accent-rgb),.13); }

/* The Create New CTA follows Messages by the same Home card-gap token. */
#view-home #homeFollowupSection + #homeCreateCta { margin-top:var(--home-card-gap); }

/* Compact image selection count and the opt-in draft-only removal control. */
.editor-media-count { margin-left:5px; color:var(--text-tertiary); font-size:9px; font-weight:550; letter-spacing:0; }
.editor-media-removal-hint { margin:2px 2px 7px; color:var(--text-secondary); font-size:10.5px; line-height:1.35; }
.editor-media-removal-hint[hidden] { display:none !important; }
.editor-media-remove-btn {
  position:absolute; z-index:4; top:0; right:0; display:grid; place-items:center;
  box-sizing:border-box; width:44px; height:44px; padding:0; border:0; border-radius:50%;
  background:none !important; box-shadow:none !important; color:#FFF; font:500 19px/1 -apple-system,BlinkMacSystemFont,sans-serif;
  -webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent; touch-action:manipulation; cursor:pointer;
}
.editor-media-remove-face {
  position:relative; z-index:0; display:grid; place-items:center; width:28px; height:28px; box-sizing:border-box;
  border:1px solid rgba(255,255,255,.18); border-radius:50%; color:#FFF; opacity:1; filter:none; mix-blend-mode:normal;
  background-color:rgba(255,59,48,.78); background-image:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,0) 58%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10);
  -webkit-backdrop-filter:blur(7px); backdrop-filter:blur(7px);
  transform:translate(6px,-6px);
  transition:transform .12s ease,border-color .12s ease;
}
.editor-media-remove-face svg { display:block; width:13px; height:13px; overflow:visible; pointer-events:none; }
.editor-media-remove-face svg path { fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.editor-media-remove-btn:active .editor-media-remove-face { transform:translate(6px,-6px) scale(.92); border-color:rgba(255,255,255,.34); }
@media (prefers-reduced-motion:reduce) { .editor-media-remove-face { transition:none; } }
@keyframes editor-remove-control-in { from { transform:translate(6px,-6px) scale(.82); opacity:0; } to { transform:translate(6px,-6px) scale(1); opacity:1; } }
@media (prefers-reduced-motion:reduce) { .editor-media-remove-btn { animation:none; transform:none; } }
body.animations-disabled .editor-media-remove-btn { animation:none; }
body.animations-disabled .editor-media-remove-face { animation:none; transform:translate(6px,-6px); }

.settings-tagline-label { display:block; margin:7px 0 6px; color:var(--text-secondary); font-size:11px; }
.settings-home-tagline-input { display:block; box-sizing:border-box; width:100%; min-height:56px; max-height:90px; padding:10px 11px; resize:vertical; border:1px solid rgba(var(--theme-rgb),.075); border-radius:12px; background:var(--hermes-glass-background); color:var(--text-primary); font:500 14px/1.4 var(--font-family); outline:none; }
.settings-home-tagline-input:focus { border-color:rgba(var(--accent-rgb),.38); box-shadow:0 0 0 1px rgba(var(--accent-rgb),.16); }
.settings-tagline-preview { display:flex; justify-content:space-between; align-items:flex-start; gap:12px; margin-top:11px; padding:10px 11px; border:1px solid rgba(var(--theme-rgb),.045); border-radius:11px; background:rgba(255,255,255,.018); }
.settings-tagline-preview > span { flex:0 0 auto; color:var(--text-tertiary); font-size:10px; }
.settings-tagline-preview > strong { min-width:0; color:var(--text-secondary-strong); font-size:11px; font-weight:550; line-height:1.35; text-align:right; white-space:pre-line; overflow-wrap:anywhere; }
.settings-tagline-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:11px; }
.settings-home-tagline-status { min-height:13px; margin:4px 0 0; color:var(--accent-ink); font-size:10px; }
.home-tagline { white-space:pre-line; overflow-wrap:anywhere; }

/* Build 28: Photo Vault mirrors Content Studio's Home card geometry and icon well. */
.home-photo-vault-card {
  display:flex; align-items:center; width:100%; min-height:66px; gap:12px; padding:11px 15px;
  border:1px solid transparent; border-radius:20px; color:var(--text-primary); text-align:left; cursor:pointer;
  transition:transform .16s ease,border-color .16s ease;
}
.home-photo-vault-card:active { transform:scale(.992); border-color:rgba(var(--accent-rgb),.25); }
.home-photo-vault-icon-container { display:grid; place-items:center; flex:0 0 42px; width:42px; height:42px; border:1px solid rgba(var(--accent-rgb),.2); border-radius:14px; color:var(--accent-ink); background:rgba(var(--accent-rgb),.065); -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.075),0 5px 16px -12px rgba(var(--accent-rgb),.42); }
.home-photo-vault-icon { display:block; width:21px; height:21px; overflow:visible; color:currentColor; }
.home-photo-vault-icon rect,.home-photo-vault-icon circle,.home-photo-vault-icon path { fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.home-photo-vault-copy { gap:4px; }
.home-photo-vault-copy strong { font-size:14px; font-weight:600; line-height:1.15; }
.home-photo-vault-copy small { font-size:11px; font-weight:500; line-height:1.2; }
@media (max-width:370px) { .home-photo-vault-card { gap:10px; padding-inline:15px; } }
@media (prefers-reduced-motion:reduce) { .home-photo-vault-card,#insightsWeeklyPlan .insight-action-row { transition:none; } }
body.animations-disabled .home-photo-vault-card,body.animations-disabled #insightsWeeklyPlan .insight-action-row { transition:none; }

/* Build 29: paired Home destinations share one compact, equal-height glass row. */
#view-home .home-quick-cards {
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; align-items:stretch;
  width:100%; margin:12px 0 0;
}
#view-home .home-quick-cards > .home-photo-vault-section,
#view-home .home-quick-cards > .home-content-studio-section { min-width:0; margin:0; }
#view-home .home-quick-card {
  display:flex; align-items:center; width:100%; min-width:0; min-height:58px; height:100%; gap:7px;
  padding:8px 10px; box-sizing:border-box; border:1px solid transparent; border-radius:18px;
  color:var(--text-primary); text-align:left; cursor:pointer;
}
#view-home .home-quick-card-icon {
  display:grid; place-items:center; flex:0 0 34px; width:34px; height:34px;
  border:1px solid rgba(var(--accent-rgb),.2); border-radius:12px; color:var(--accent-ink);
  background:rgba(var(--accent-rgb),.065);
  -webkit-backdrop-filter:blur(16px); backdrop-filter:blur(16px);
  box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.075),0 5px 16px -12px rgba(var(--accent-rgb),.42);
}
#view-home .home-quick-card-icon svg { display:block; width:22px; height:22px; }
#view-home .home-photo-vault-icon rect,#view-home .home-photo-vault-icon circle,#view-home .home-photo-vault-icon path { fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
#view-home .home-quick-card-copy { display:flex; flex:1 1 auto; min-width:0; flex-direction:column; gap:3px; }
#view-home .home-quick-card-copy strong { display:block; overflow:hidden; color:var(--text-primary); font-size:12px; font-weight:620; line-height:1.2; white-space:nowrap; text-overflow:ellipsis; }
#view-home .home-quick-card-copy small { display:-webkit-box; overflow:hidden; color:var(--text-secondary); font-size:9px; font-weight:500; line-height:1.25; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
#view-home .home-quick-card .home-content-studio-chevron { flex:0 0 8px; margin-left:0; font-size:20px; line-height:1; text-align:center; }
#view-home .home-quick-card:active { transform:scale(.992); border-color:rgba(var(--accent-rgb),.25); }
#view-home #homeQuickCards + #homeFollowupSection { margin:var(--home-card-gap) 0 0; }
@media (max-width:370px) {
  #view-home .home-quick-cards { gap:8px; }
  #view-home .home-quick-card { gap:5px; padding:7px; }
  #view-home .home-quick-card-icon { flex-basis:30px; width:30px; height:30px; }
  #view-home .home-quick-card-copy strong { font-size:10px; }
  #view-home .home-quick-card .home-content-studio-chevron { flex-basis:6px; font-size:17px; }
}
@media (prefers-reduced-motion:reduce) { #view-home .home-quick-card { transition:none; } }
body.animations-disabled #view-home .home-quick-card { transition:none; }

/* Stable iOS touch focus for the Insights category filters; keyboard focus
   remains visible in Hermes lavender, while touch selection has no white ring. */
.insights-priority-summary>div>button:focus { outline:none; box-shadow:none; }
.insights-priority-summary>div>button:focus-visible { outline:2px solid rgba(var(--accent-rgb),.62); outline-offset:2px; }

@media (prefers-reduced-motion:reduce) { .editor-media-remove-btn { animation:none; transform:none; } }

/* Original Hermes support and settings: existing semantic glass material. */
.rescue-view{padding-bottom:32px;max-width:760px;margin-inline:auto}.rescue-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 0 20px}.rescue-heading h1{font-size:27px;letter-spacing:-.9px;margin:4px 0}.rescue-heading p{font-size:12px;line-height:1.5;color:var(--text-secondary);margin:6px 0 0}.rescue-eyebrow{font-size:9px;letter-spacing:1.7px;color:var(--text-secondary);font-weight:650}.rescue-view h2{font-size:16px;letter-spacing:-.3px;margin:0}.rescue-glass{border:1px solid transparent;border-radius:20px;margin-bottom:14px;padding:18px}.rescue-account{display:flex;gap:10px;align-items:center;padding:12px 14px;border-radius:17px}.rescue-account>div{flex:1;min-width:0}.rescue-account strong{font-size:11px}.rescue-account small{display:block;color:var(--text-secondary);font-size:10px;line-height:1.5;overflow-wrap:anywhere;margin-top:2px}.rescue-account .text-link-btn{font-size:11px;padding:8px 2px;min-height:36px}.rescue-connection-dot{width:7px;height:7px;background:var(--text-tertiary);border-radius:50%;flex-shrink:0}.rescue-connection-dot.is-connected{background:#65b895;box-shadow:0 0 9px #65b89530}.rescue-steps{display:flex;gap:3px;margin:20px 0}.rescue-steps button{flex:1;border:0;background:none;color:var(--text-secondary);font-size:10px;padding:8px 0;display:flex;align-items:center;justify-content:center;gap:5px;min-height:40px}.rescue-steps button>span{border:1px solid var(--border);width:19px;height:19px;border-radius:50%;display:grid;place-items:center;font-size:9px}.rescue-steps .is-selected{color:var(--accent-ink)}.rescue-steps .is-selected>span{background:rgba(var(--accent-rgb),.14);border-color:rgba(var(--accent-rgb),.4)}.rescue-section-title{display:flex;gap:10px;align-items:center;margin:2px 0 22px}.rescue-section-title>span{font-size:10px;color:var(--accent-ink);font-variant-numeric:tabular-nums}.rescue-field{display:flex;flex-direction:column;gap:8px;min-width:0;margin:15px 0}.rescue-field>span{color:var(--text-secondary);font-size:10px;font-weight:550}.rescue-field input,.rescue-field textarea,.rescue-field select,.rescue-search,.rescue-auth textarea{width:100%;box-sizing:border-box;border:1px solid rgba(var(--theme-rgb),.10);background:rgba(var(--theme-rgb),.035);color:var(--text-primary);border-radius:12px;padding:12px;font:inherit;font-size:16px;min-height:44px;outline-offset:2px}.rescue-field input:focus,.rescue-field textarea:focus,.rescue-search:focus{outline:1px solid rgba(var(--accent-rgb),.55)}.rescue-field textarea{line-height:1.65;resize:vertical}.rescue-two{display:grid;grid-template-columns:1fr 1fr;gap:12px}.rescue-optional{margin:12px 0 22px}.rescue-optional summary,.rescue-history summary,.rescue-auth summary{font-size:12px;color:var(--text-secondary);padding:10px 0;cursor:pointer}.rescue-optional summary span,.rescue-history summary span{font-size:10px;opacity:.6;margin-left:8px}.rescue-primary{display:flex;align-items:center;justify-content:center;gap:12px;width:100%;min-height:46px;border-radius:14px;font-size:13px;margin-top:16px;margin-bottom:8px}.rescue-primary>span{margin-left:auto}.rescue-meta,.rescue-auth p{font-size:11px;line-height:1.65;color:var(--text-secondary)}.rescue-status{font-size:12px;line-height:1.6;color:var(--accent-ink);overflow-wrap:anywhere;margin:15px 3px}.rescue-status:empty{display:none}.rescue-status.is-error{color:var(--text-secondary-strong);border-left:2px solid var(--accent);padding-left:10px}.rescue-poster-list{max-height:330px;overflow:auto;margin-top:12px;overscroll-behavior:contain}.rescue-poster{width:100%;display:flex;align-items:center;gap:12px;border:1px solid transparent;border-radius:13px;padding:10px 8px;color:var(--text-primary);background:none;text-align:left;box-sizing:border-box;min-height:74px}.rescue-poster img,.rescue-poster-mark{width:42px;height:54px;object-fit:cover;border-radius:7px;flex-shrink:0}.rescue-poster-mark{display:grid;place-items:center;background:rgba(var(--accent-rgb),.06);font-size:22px;color:var(--accent-ink)}.rescue-poster>span:nth-child(2){flex:1;min-width:0}.rescue-poster strong{display:block;font-size:12px;font-weight:550}.rescue-poster small{display:block;color:var(--text-secondary);font-size:10px;line-height:1.4;margin-top:5px}.rescue-poster.is-selected,.rescue-selected{background:rgba(var(--accent-rgb),.07);border-color:rgba(var(--accent-rgb),.22)}.rescue-selection{color:var(--accent-ink);font-size:15px}.rescue-selected{margin-top:12px}.rescue-checkbox{display:flex;align-items:center;gap:8px;font-size:11px;line-height:1.5;margin:12px 0}.rescue-categories{display:grid;grid-template-columns:1fr 1fr;gap:8px}.rescue-categories button{min-height:46px;background:rgba(var(--theme-rgb),.02);color:var(--text-secondary-strong);border:1px solid var(--border);border-radius:12px;font-size:11px;padding:9px;text-align:left}.rescue-categories .is-selected{border-color:rgba(var(--accent-rgb),.5);background:rgba(var(--accent-rgb),.10);color:var(--accent-ink)}.rescue-tone-label{margin-top:25px}.rescue-tone-cards{display:flex;gap:9px;overflow-x:auto;scroll-snap-type:x proximity;padding:4px 1px 12px}.rescue-tone{flex:0 0 76%;max-width:260px;display:flex;flex-direction:column;gap:10px;border:1px solid var(--border);border-radius:16px;background:rgba(var(--theme-rgb),.025);color:var(--text-primary);text-align:left;padding:15px;scroll-snap-align:start;min-height:155px}.rescue-tone>span{font-size:9px;color:var(--accent-ink);letter-spacing:.3px}.rescue-tone>strong{font-size:13px;line-height:1.5;font-weight:550}.rescue-tone>small{font-size:10px;color:var(--text-secondary);line-height:1.6}.rescue-tone.is-selected{border-color:rgba(var(--accent-rgb),.55);background:rgba(var(--accent-rgb),.07)}.rescue-email{padding:0 18px 16px;overflow:hidden}.rescue-email-header{display:flex;align-items:center;justify-content:space-between;padding:17px 0;border-bottom:1px solid var(--border);margin-bottom:8px}.rescue-email-header>span:last-child{font-size:9px;color:var(--accent-ink)}.rescue-envelope{display:flex;gap:12px;align-items:baseline;font-size:12px;padding:10px 0;border-bottom:1px solid rgba(var(--theme-rgb),.06)}.rescue-envelope>span{width:22px;color:var(--text-secondary);font-size:10px}.rescue-envelope strong{font-weight:500;overflow-wrap:anywhere}.rescue-email .rescue-field input,.rescue-email .rescue-field textarea{border:0;background:transparent;padding:3px 0;border-radius:0;font-size:14px}.rescue-email .rescue-field input{font-weight:600}.rescue-email .rescue-field textarea{font-size:13px;line-height:1.8;min-height:245px}.rescue-template-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px}.rescue-template-actions button{font-size:10px;min-height:36px}.rescue-template-actions .btn-primary,.rescue-template-actions .btn-secondary{padding:8px 14px;border-radius:10px}.rescue-delivery{border-top:1px solid var(--border);margin-top:12px;padding-top:15px;font-size:11px;line-height:1.7;color:var(--text-secondary-strong);white-space:pre-line;overflow-wrap:anywhere}.rescue-history{margin-top:25px;border-top:1px solid var(--border);padding-top:5px}.rescue-history-row{display:flex;width:100%;justify-content:space-between;gap:10px;padding:14px 0;border:0;border-bottom:1px solid var(--border);background:none;text-align:left;color:var(--text-primary)}.rescue-history-row strong{display:block;font-size:12px;font-weight:500}.rescue-history-row small{display:block;font-size:10px;color:var(--text-secondary);margin-top:6px}.rescue-history-row>span:last-child{font-size:10px;color:var(--accent-ink)}.rescue-row-button{width:100%;background:none;border:0;color:inherit;text-align:left}.rescue-row-button small{display:block;font-size:10px;color:var(--text-secondary);line-height:1.6;margin-top:5px}.rescue-settings-previews{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:10px 0}.rescue-setting-image{display:flex;gap:9px;align-items:center;background:rgba(var(--theme-rgb),.025);border:1px solid var(--border);padding:9px;border-radius:13px;color:inherit;text-align:left;min-width:0}.rescue-setting-image img{width:40px;height:50px;object-fit:contain;border-radius:6px}.rescue-setting-image strong{font-size:10px;display:block}.rescue-setting-image small{font-size:9px;color:var(--text-secondary);display:block;margin-top:6px;line-height:1.4}.rescue-image-card .rescue-heading{margin:0 0 16px}.rescue-image-card h2{font-size:16px}.rescue-saved-state{font-size:10px;color:var(--accent-ink)}.rescue-image-preview{width:100%;height:220px;background:rgba(var(--theme-rgb),.025);border:1px solid var(--border);border-radius:15px;overflow:hidden;padding:8px;color:var(--text-secondary)}.rescue-image-preview img{width:100%;height:100%;object-fit:contain;display:block}.rescue-image-actions{display:flex;align-items:center;gap:14px;padding:8px 0}.rescue-image-actions button{font-size:11px;min-height:40px}.rescue-image-actions [data-remove]{margin-left:auto;color:var(--text-secondary)}.rescue-image-enabled{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--border);padding-top:12px;font-size:11px;color:var(--text-secondary-strong)}.rescue-image-dialog{width:90vw;max-width:650px;max-height:88dvh;border:1px solid var(--border);border-radius:20px;background:var(--app-surface);color:var(--text-primary);box-sizing:border-box}.rescue-image-dialog img{display:block;width:100%;max-height:74dvh;object-fit:contain}.rescue-image-dialog::backdrop{background:rgba(0,0,0,.75)}.rescue-exclusions{padding:12px;border:1px solid rgba(var(--accent-rgb),.3);border-radius:12px;font-size:11px;line-height:1.6;color:var(--text-secondary);overflow-wrap:anywhere;margin-top:12px}.rescue-empty{padding:20px 8px;font-size:12px;color:var(--text-secondary);line-height:1.6}.rescue-skeleton{height:210px;border-radius:14px;background:linear-gradient(105deg,rgba(var(--theme-rgb),.02),rgba(var(--theme-rgb),.07),rgba(var(--theme-rgb),.02));background-size:200% 100%}.rescue-view [hidden],#listingImagesSettings [hidden]{display:none!important}
#view-settings>.settings-group{border:1px solid transparent;border-radius:20px;padding:10px 17px 13px;margin-bottom:15px}#view-settings .settings-group-label{font-size:9px;letter-spacing:1.6px;color:var(--text-secondary);padding:9px 0 12px}#view-settings .settings-row{min-height:49px;padding-block:11px;border-color:rgba(var(--theme-rgb),.06)}#view-settings .settings-row-label{font-size:12px;font-weight:500}#view-settings .settings-row-value{font-size:11px;color:var(--text-secondary)}#view-settings .settings-switch-track{--settings-switch-border:1px;border:var(--settings-switch-border) solid rgba(var(--theme-rgb),.08)}#view-settings .settings-switch input:checked+.settings-switch-track{box-shadow:0 0 12px rgba(var(--accent-rgb),.12)}#view-settings .settings-theme-btn{border-radius:13px}#view-settings .settings-tagline-preview{border-radius:13px;background:rgba(var(--accent-rgb),.035)}
@media(prefers-reduced-motion:no-preference){body:not(.animations-disabled) .rescue-stage,body:not(.animations-disabled) .rescue-email{animation:rescue-reveal .18s ease-out}body:not(.animations-disabled) .rescue-tone,body:not(.animations-disabled) .rescue-categories button{transition:border-color .15s,background .15s}body:not(.animations-disabled) .rescue-skeleton{animation:rescue-shimmer 1.4s ease infinite}}@keyframes rescue-reveal{from{opacity:.5;transform:translateY(4px)}to{opacity:1;transform:none}}@keyframes rescue-shimmer{to{background-position:-200% 0}}@media(min-width:650px){.rescue-tone{flex-basis:30%}.rescue-poster-list{max-height:420px}.rescue-image-preview{height:280px}}
/* Home's shared reflection/press rules above also own these surfaces. */
.rescue-google-mark{display:grid;place-items:center;flex:0 0 32px;width:32px;height:32px;background:#fff;border-radius:10px}.rescue-google-mark img{display:block;width:18px;height:18px;object-fit:contain;filter:none;opacity:1}.rescue-account-title{display:flex;align-items:center;flex-wrap:wrap;gap:6px;min-width:0}.rescue-account-title strong{font-size:12px;font-weight:600}.rescue-account-title>span:last-child{font-size:10px;color:var(--text-secondary);line-height:1.4}.rescue-connected-check{display:grid;place-items:center;width:12px;height:12px;flex:0 0 12px;border-radius:50%;color:var(--accent-contrast);background:var(--accent);font-size:8px;font-weight:700}.rescue-account .rescue-account-copy{flex:1;min-width:0}.rescue-account-copy small{font-size:10px;line-height:1.5;overflow-wrap:anywhere}.rescue-account .text-link-btn{min-height:36px;flex-shrink:0}.rescue-account{gap:10px;border-radius:20px}.rescue-email{overflow:visible}.rescue-email .rescue-field textarea{resize:none;overflow-y:hidden;max-height:none;min-height:0;line-height:1.8;white-space:pre-wrap;overflow-wrap:anywhere;scroll-margin-block:100px}.rescue-email #rescueSubject{font-weight:600;line-height:1.6;min-height:28px}.rescue-email #rescueBody{min-height:180px}.rescue-body-field{margin-bottom:10px}.rescue-delivery{border:1px solid transparent;border-radius:14px;padding:12px;margin-top:14px}.rescue-primary.hermes-home-glass{color:var(--accent-ink);font-weight:650;border:1px solid rgba(var(--accent-rgb),.16);background:var(--hermes-glass-background);box-shadow:var(--hermes-glass-shadow)}.rescue-primary.hermes-home-glass:disabled{opacity:.55}.rescue-tone.hermes-home-glass,.rescue-categories button.hermes-home-glass,.rescue-setting-image.hermes-home-glass{background:var(--hermes-glass-background);border-color:transparent}.rescue-tone.is-selected::after,.rescue-categories button.is-selected::after{border-color:rgba(var(--accent-rgb),.24);border-top-color:rgba(var(--accent-rgb),.42);box-shadow:inset 0 1px 0 rgba(255,255,255,.06),0 0 5px rgba(var(--accent-rgb),.12)}.rescue-tone-cards{padding:5px 2px 12px;scroll-padding-inline:2px}.rescue-stage{scroll-margin-top:85px}.rescue-view{padding-bottom:40px;min-width:0}.rescue-envelope strong{min-width:0;line-height:1.5}.rescue-template-actions{row-gap:5px}.rescue-primary:focus-visible,.rescue-tone:focus-visible,.rescue-categories button:focus-visible{outline:2px solid rgba(var(--accent-rgb),.72);outline-offset:3px}
#view-settings .appearance-segment{background:rgba(var(--theme-rgb),.055);border:1px solid rgba(var(--theme-rgb),.12);border-radius:13px;padding:3px}#view-settings .appearance-segment button{border-radius:10px}#view-settings .settings-profile-name,#view-settings .settings-inline-select{background:rgba(var(--theme-rgb),.035);border-color:rgba(var(--theme-rgb),.1);box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.025)}#view-settings .settings-switch-track{box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.035)}
@media(prefers-reduced-motion:no-preference){body:not(.animations-disabled) .rescue-primary,body:not(.animations-disabled) .rescue-tone{transition:transform .16s ease,border-color .16s ease}body:not(.animations-disabled) .rescue-primary:active{transform:scale(.992)}}
/* Focused Settings motion: disclosures rotate; navigation arrows stay right. */
.settings-disclosure-chevron{display:inline-block;transform:rotate(0deg);transform-origin:center;transition:transform 250ms cubic-bezier(.2,.9,.25,1.02)}[aria-expanded="true"]>.settings-disclosure-chevron{transform:rotate(90deg)}
#view-settings #settingsBuildId,#view-settings #settingsAppVersion{font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0}#view-settings #settingsDiagnostics{max-width:58%;text-align:right;line-height:1.4;font-size:11px}
.view.is-active.is-entering.settings-route-transition{animation:hermes-settings-enter 250ms cubic-bezier(.2,.9,.25,1.02) both}@keyframes hermes-settings-enter{from{opacity:.82;transform:translate3d(var(--hermes-enter-x,0),0,0)}to{opacity:1;transform:none}}
.rescue-completion{text-align:center;padding:24px 18px}.rescue-success-mark{display:grid;place-items:center;width:34px;height:34px;margin:0 auto 12px;border-radius:50%;background:rgba(var(--accent-rgb),.11);border:1px solid rgba(var(--accent-rgb),.18);color:var(--accent-ink);font-size:17px}.rescue-completion>p{font-size:12px;line-height:1.6;color:var(--text-secondary)}.rescue-completion .rescue-meta{overflow-wrap:anywhere}.rescue-completion .rescue-primary{margin-top:12px}.rescue-completion .btn-secondary{font-weight:500}
@media(prefers-reduced-motion:no-preference){body:not(.animations-disabled) .rescue-completion:not([hidden]){animation:rescue-completed 240ms cubic-bezier(.2,.9,.25,1.02)}}@keyframes rescue-completed{from{opacity:.65;transform:translateY(3px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.settings-disclosure-chevron,.view.settings-route-transition{transition:none!important;animation:none!important}}body.animations-disabled .settings-disclosure-chevron,body.animations-disabled .view.settings-route-transition{transition:none!important;animation:none!important}

/* Accent swatches: one concentric selection outline, including custom color. */
.accent-presets{grid-template-columns:repeat(9,minmax(0,1fr));gap:6px;justify-items:center;align-items:center;padding:5px 0;}
#settingsAccentPresets>button{display:block;box-sizing:border-box;width:24px;height:24px;min-width:24px;min-height:24px;padding:0;margin:0;border:0;flex:none;aspect-ratio:1;border-radius:50%;background-clip:border-box;transform-origin:50% 50%;outline-offset:3px;}
#settingsAccentPresets>button.is-selected{outline:2px solid var(--text-primary);outline-offset:3px;transform:scale(1.05);}
:root[data-effective-theme="light"] .splash-wordmark,:root[data-effective-theme="light"] .splash-mark{filter:brightness(0);}
:root[data-effective-theme="light"] .draft-artwork-preview-close{color:var(--text-primary);}
:root[data-effective-theme="light"] .editor-section-warning-badge{color:var(--warning);}
:root[data-effective-theme="light"] .activity-floating-toast.is-error,:root[data-effective-theme="light"] .today-inline-error,:root[data-effective-theme="light"] .store-goal-modal-error{color:var(--danger);}
:root[data-effective-theme="light"] .settings-tagline-preview{border-color:var(--border);}
:root[data-effective-theme="light"] .hermes-delete-actions [data-delete-confirm],:root[data-effective-theme="light"] .editor-media-remove-accept{background:#B42332;color:#fff;}
:root[data-effective-theme="light"] .chip.is-loading{color:var(--accent-contrast);}
:root[data-effective-theme="light"] .followup-home-cta{border-color:var(--border);}

/* A symmetric ring belongs to the same square as its swatch, independent of
   UIKit button metrics or WebKit outline rendering. Colors/design stay intact. */
#settingsAccentPresets>button{appearance:none;-webkit-appearance:none;line-height:0;width:min(24px,100%);height:auto;min-width:0;min-height:0;aspect-ratio:1;outline:none;}
#settingsAccentPresets>button::before{content:"";position:absolute;inset:-5px;border:2px solid var(--text-primary);border-radius:50%;pointer-events:none;opacity:0;}
#settingsAccentPresets>button.is-selected{outline:none;}
#settingsAccentPresets>button.is-selected::before{opacity:1;}
.rescue-tone.is-selected::after,.rescue-categories button.is-selected::after{border-color:rgba(var(--accent-ink-rgb,var(--accent-rgb)),.4);border-top-color:rgba(var(--accent-ink-rgb,var(--accent-rgb)),.6);}
@media(prefers-reduced-motion:no-preference){body:not(.animations-disabled) #settingsAccentPresets>button::before{transition:opacity 150ms ease;}body:not(.animations-disabled) #settingsAccentPresets>button{transition:transform 150ms ease;}}
/* Placeholders carry semantic secondary ink in light mode, not an additional
   alpha reduction on top of an already secondary color. */
:root[data-effective-theme="light"] input::placeholder,:root[data-effective-theme="light"] textarea::placeholder{color:var(--text-secondary);opacity:1;}

/* Pinterest connection: reuse the same glass surface and compact pill geometry
   as Hermes Home, while keeping the profile identity stable during refreshes. */
#view-settings>#settingsPinterestAccount {padding:11px 14px 13px;margin-bottom:13px;}
#settingsPinterestAccount .pinterest-account-heading {display:flex;align-items:center;gap:9px;margin:0 0 9px;padding:0;font-size:14px;font-weight:600;letter-spacing:0;color:var(--text-primary);text-transform:none;}
.pinterest-account-heading img {object-fit:contain;flex:none;width:20px;height:20px;}
.pinterest-account-profile {display:flex;align-items:center;gap:10px;min-height:42px;}
.pinterest-account-profile>img,.pinterest-avatar-fallback {width:40px;height:40px;flex:none;border-radius:50%;object-fit:cover;}
.pinterest-avatar-fallback {display:grid;place-items:center;background:rgba(var(--theme-rgb),.045);color:var(--text-secondary);font-size:20px;}
.pinterest-account-profile [hidden] {display:none;}
.pinterest-avatar-fallback svg {width:22px;height:22px;}
.pinterest-account-profile>div {min-width:0;}
.pinterest-account-profile strong {display:flex;align-items:center;gap:7px;width:max-content;max-width:100%;min-width:0;font-size:14px;font-weight:600;color:var(--text-primary);}
.pinterest-account-profile strong>span {display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.pinterest-account-profile strong::after {content:"";width:7px;height:7px;flex:none;border-radius:50%;background:var(--text-tertiary);box-shadow:none;opacity:.78;transition:background-color .18s ease,box-shadow .18s ease,opacity .18s ease;}
.pinterest-account-secondary {font-size:11px;line-height:1.4;color:var(--text-secondary);overflow-wrap:anywhere;}
#settingsPinterestAccount[data-state="connected"] .pinterest-account-profile strong::after {background:var(--accent);box-shadow:0 0 5px rgba(var(--accent-rgb),.62),0 0 10px rgba(var(--accent-rgb),.24);opacity:1;animation:pinterest-led-breathe 2.8s ease-in-out infinite;}
#settingsPinterestAccount[data-state="connecting"] .pinterest-account-profile strong::after,#settingsPinterestAccount[data-state="checking"] .pinterest-account-profile strong::after {background:var(--accent);box-shadow:0 0 5px rgba(var(--accent-rgb),.48);opacity:.78;animation:pinterest-led-breathe 1.5s ease-in-out infinite;}
#settingsPinterestAccount[data-state="disconnected"] .pinterest-account-profile strong::after,#settingsPinterestAccount[data-state="unavailable"] .pinterest-account-profile strong::after {background:var(--text-tertiary);box-shadow:none;opacity:.56;animation:none;}
@keyframes pinterest-led-breathe {50%{opacity:.72;filter:brightness(.9);box-shadow:0 0 3px rgba(var(--accent-rgb),.4),0 0 7px rgba(var(--accent-rgb),.15);}}
#settingsPinterestIdentityMessage {margin:7px 0 0;}
#settingsPinterestIdentityMessage[hidden] {display:none;}
.pinterest-account-identity {min-width:0;align-self:center;}
.pinterest-account-actions {display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:8px;}
.pinterest-account-actions .pinterest-account-pill {position:relative;isolation:isolate;display:inline-flex;align-items:center;justify-content:center;min-height:34px;padding:0 11px;border:1px solid rgba(var(--accent-rgb),.12);border-radius:999px;color:var(--accent-ink);font-size:11px;line-height:1;font-weight:600;white-space:nowrap;cursor:pointer;}
.pinterest-account-actions .pinterest-account-pill:disabled {opacity:.48;cursor:default;}
@media(prefers-reduced-motion:reduce){#settingsPinterestAccount .pinterest-account-profile strong::after{animation:none!important;}}
body.animations-disabled #settingsPinterestAccount .pinterest-account-profile strong::after{animation:none!important;}

.rescue-open-overlay{position:fixed;inset:0;z-index:12000;background:rgba(0,0,0,.32);display:grid;place-items:center;padding:24px;animation:rescue-open-in .22s ease-out}
.rescue-open-card{position:relative;width:min(100%,340px);padding:24px;text-align:center;border-radius:24px;color:var(--text-primary)}
.rescue-open-card h2{font-size:20px;margin:4px 0 14px}.rescue-open-card p{font-size:13px;line-height:1.5;color:var(--text-secondary);margin:12px 0 18px}.rescue-open-email{font-size:14px;overflow-wrap:anywhere;user-select:text}.rescue-open-actions{display:flex;gap:10px}.rescue-open-actions button{flex:1;min-height:42px;border-radius:999px}.rescue-open-close{position:absolute;right:9px;top:7px;background:transparent;border:0;color:var(--text-secondary);font-size:24px;width:34px;height:34px}.rescue-open-card [data-open-status]{display:block;margin-top:9px}@keyframes rescue-open-in{from{opacity:0;transform:scale(.98)}to{opacity:1;transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.rescue-open-overlay{animation:none}}
.animations-disabled .rescue-open-overlay{animation:none}
/* The account handoff is elevated over readable content, like existing chrome. */
.rescue-open-card.hermes-home-glass{background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);box-shadow:var(--hermes-glass-elevated-shadow)}

/* Adaptive Planner composes the established Home glass; no new material. */
.planner-view{max-width:760px;margin:auto;padding-bottom:40px}.planner-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:18px 0}.planner-heading h1{font-size:26px;letter-spacing:-.8px;margin:0}.planner-heading p,.planner-meta,.planner-empty{font-size:12px;line-height:1.6;color:var(--text-secondary)}.planner-home{display:flex;flex-direction:column;gap:5px;width:100%;border:1px solid transparent;border-radius:20px;text-align:left;padding:16px 18px;margin:0 0 18px;color:var(--text-primary)}.planner-home>span,.planner-eyebrow{font-size:10px;letter-spacing:1.2px;color:var(--accent-ink);font-weight:600}.planner-home strong{font-size:16px}.planner-home small{font-size:11px;color:var(--text-secondary)}.planner-calendar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px}.planner-calendar button{display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 2px;border-radius:14px;border:1px solid var(--border);background:var(--app-surface);color:var(--text-secondary);min-height:86px}.planner-calendar button.is-selected{border-color:var(--accent-ink);background:rgba(var(--accent-rgb),.1);color:var(--text-primary)}.planner-calendar small{font-size:10px}.planner-calendar strong{font-size:16px}.planner-calendar span{font-size:10px}.planner-calendar i{display:flex;gap:3px;height:4px}.planner-calendar b,.planner-category-dot{width:4px;height:4px;display:inline-block;border-radius:50%;background:var(--accent-ink)}.planner-card{border:1px solid transparent;border-radius:20px;padding:20px;margin:16px 0}.planner-card h2{font-size:23px;line-height:1.3;letter-spacing:-.5px;margin:14px 0}.planner-card p,.planner-card details{font-size:12px;line-height:1.65;color:var(--text-secondary)}.planner-task-meta{font-size:11px;color:var(--accent-ink)}.planner-primary{min-height:44px;width:100%;border-radius:14px;margin:12px 0}.planner-task-actions{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}.planner-task-actions button{font-size:11px;min-height:38px}.planner-list h2,.planner-upcoming h3{font-size:14px}.planner-task-row{display:flex;align-items:center;gap:12px;padding:14px 2px;border-bottom:1px solid var(--border)}.planner-task-row>div{flex:1;min-width:0}.planner-task-row strong{font-size:12px;font-weight:550;display:block;line-height:1.5}.planner-task-row small{display:block;font-size:10px;color:var(--text-secondary);line-height:1.5;margin-top:3px}.planner-upcoming,.planner-backlog,.planner-notes{margin:18px 0;font-size:12px;color:var(--text-secondary)}.planner-upcoming summary,.planner-backlog summary,.planner-notes summary{padding:10px 0;cursor:pointer}.planner-workdays{padding:10px 0;border:0;display:flex;justify-content:space-between;gap:4px;font-size:11px}.planner-workdays legend{color:var(--text-secondary);margin-bottom:8px}.planner-workdays label{display:flex;align-items:center;flex-direction:column;gap:8px;min-height:44px}.planner-workdays input,.planner-inline input{accent-color:var(--accent)}.planner-inline{display:flex;align-items:center;gap:8px;font-size:12px}.planner-view [hidden],.planner-home[hidden]{display:none!important}.planner-card input,.planner-card select{min-width:0}.planner-card #plannerPostpone{padding:8px 0}.planner-card #plannerPostpone button{min-height:40px}@media(prefers-reduced-motion:no-preference){body:not(.animations-disabled) #plannerNext{animation:planner-appear .23s ease-out}}@keyframes planner-appear{from{opacity:.4;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}

.planner-calendar i{height:9px}.planner-calendar b{font-size:7px;line-height:9px;width:8px;height:9px;background:none;color:var(--accent-ink);font-style:normal}

/* Planner refinement: reuse the Home glass surface and semantic theme tokens. */
.planner-view{padding:10px 16px calc(112px + env(safe-area-inset-bottom));max-width:680px}
.planner-heading{margin:16px 0 18px;align-items:center}
.planner-heading h1{font-size:25px;font-weight:620;letter-spacing:-.7px}
.planner-heading p{margin:5px 0 0;font-size:12px}
.planner-day-switch{display:grid;grid-template-columns:1fr 1fr;gap:4px;padding:4px;margin:0 auto 15px;width:min(100%,360px);border:1px solid var(--border);border-radius:16px;background:var(--app-surface);box-shadow:inset 0 1px 0 rgba(255,255,255,.035)}
.planner-day-switch button{min-height:38px;border:0;border-radius:12px;background:transparent;color:var(--text-secondary);font:600 13px/1 -apple-system,BlinkMacSystemFont,sans-serif;transition:background-color .2s ease,color .2s ease,transform .18s ease}
.planner-day-switch button[aria-pressed="true"]{background:rgba(var(--accent-rgb),.16);color:var(--text-primary);box-shadow:inset 0 0 0 1px rgba(var(--accent-rgb),.22),0 2px 8px rgba(0,0,0,.12)}
.planner-day-switch button:active{transform:scale(.98)}
.planner-status{min-height:0;margin:0 2px 8px;color:var(--text-secondary);font-size:11px;line-height:1.45;text-align:center}
.planner-status:empty{display:none}
.planner-next-card{position:relative;overflow:hidden;padding:17px 17px 13px;margin:5px 0 21px;border:1px solid rgba(var(--theme-rgb),.12);border-radius:22px;color:var(--text-primary);background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);box-shadow:var(--hermes-glass-elevated-shadow)}
.planner-next-label{margin:0 0 8px;color:var(--accent-ink);font-size:10px;font-weight:650;letter-spacing:1px;text-transform:uppercase}
.planner-next-title{display:grid;grid-template-columns:40px minmax(0,1fr) 18px;align-items:center;gap:12px;width:100%;padding:3px 0 8px;border:0;background:none;color:inherit;text-align:left;font:inherit}
.planner-next-title>span:nth-child(2){min-width:0}
.planner-next-title strong,.planner-task-copy strong{display:block;overflow-wrap:anywhere;font-size:16px;font-weight:590;line-height:1.32;letter-spacing:-.2px}
.planner-next-title small,.planner-task-copy small{display:block;margin-top:4px;color:var(--text-secondary);font-size:11px;line-height:1.35}
.planner-icon{display:grid;place-items:center;width:38px;height:38px;flex:0 0 38px;border:1px solid rgba(var(--accent-rgb),.18);border-radius:13px;background:rgba(var(--accent-rgb),.10);color:var(--accent-ink)}
.planner-icon svg{width:19px;height:19px}
.planner-task-chevron{color:var(--text-secondary);font-size:24px;font-weight:300;line-height:1}
.planner-primary{min-height:43px;margin:7px 0 2px;border-radius:14px;font-weight:620;transition:transform .18s ease,filter .2s ease}
.planner-primary:active{transform:scale(.985)}
.planner-complete-link{display:block;margin:8px auto 0;padding:7px 12px;border:0;background:none;color:var(--text-secondary);font:550 12px/1.3 -apple-system,BlinkMacSystemFont,sans-serif}
.planner-finished-mark{display:grid;place-items:center;width:34px;height:34px;margin:0 0 10px;border-radius:50%;background:rgba(var(--accent-rgb),.14);color:var(--accent-ink);font-size:17px}
.planner-next-card h2{margin:0;font-size:19px;letter-spacing:-.3px}
.planner-next-card p{margin:5px 0 1px;color:var(--text-secondary);font-size:12px}
.planner-day-plan{margin:0 0 16px}
.planner-day-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin:0 2px 8px}
.planner-day-heading h2{margin:0;color:var(--text-primary);font-size:16px;font-weight:620;letter-spacing:-.25px}
.planner-day-heading span{color:var(--text-secondary);font-size:11px;font-variant-numeric:tabular-nums}
.planner-task-row{display:grid;grid-template-columns:40px minmax(0,1fr) 18px;align-items:center;gap:12px;width:100%;min-height:66px;margin:7px 0;padding:10px 13px;border:1px solid rgba(var(--theme-rgb),.10);border-radius:17px;background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);color:var(--text-primary);text-align:left;font:inherit;box-shadow:var(--hermes-glass-shadow);transition:transform .18s ease,border-color .2s ease,background-color .2s ease}
.planner-task-row:active:not(:disabled){transform:scale(.985);border-color:rgba(var(--accent-rgb),.28)}
.planner-task-copy{min-width:0}
.planner-task-copy strong{font-size:13px;font-weight:570}
.planner-task-row.is-complete{opacity:.7}
.planner-task-row:disabled{cursor:default}
.planner-task-check{display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:rgba(var(--accent-rgb),.15);color:var(--accent-ink);font-size:12px}
.planner-empty{margin:16px 2px;padding:12px 0;text-align:center}
.planner-settings-card{display:grid;gap:21px;margin:12px 0;padding:20px 17px 16px;border:1px solid rgba(var(--theme-rgb),.12);border-radius:22px;color:var(--text-primary);background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);box-shadow:var(--hermes-glass-elevated-shadow)}
.planner-capacity{display:grid;gap:13px}
.planner-capacity>span,.planner-notification-row{display:flex;align-items:center;justify-content:space-between;gap:12px}
.planner-capacity strong,.planner-notification-row strong,.planner-time-row strong{font-size:14px;font-weight:590;letter-spacing:-.15px}
.planner-capacity output{color:var(--accent-ink);font-size:13px;font-weight:620;font-variant-numeric:tabular-nums}
.planner-capacity input[type=range]{width:100%;height:5px;margin:0;accent-color:var(--accent);touch-action:pan-x}
.planner-workdays{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:5px;margin:0;padding:0;border:0}
.planner-workdays legend{margin:0 0 10px;color:var(--text-primary);font-size:14px;font-weight:590}
.planner-workdays label{position:relative;display:grid;place-items:center;min-height:37px;border:1px solid var(--border);border-radius:11px;background:rgba(var(--theme-rgb),.035);color:var(--text-secondary);font-size:11px;font-weight:560;transition:background-color .18s ease,border-color .18s ease,color .18s ease,transform .18s ease}
.planner-workdays label:has(input:checked){border-color:rgba(var(--accent-rgb),.30);background:rgba(var(--accent-rgb),.14);color:var(--text-primary)}
.planner-workdays label:active{transform:scale(.96)}
.planner-workdays input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;accent-color:var(--accent)}
.planner-time-group{display:grid;gap:9px}
.planner-time-row{position:relative;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:61px;padding:10px 13px;border:1px solid var(--border);border-radius:15px;background:rgba(var(--theme-rgb),.035);color:var(--text-primary);overflow:hidden}
.planner-time-row>span{display:grid;gap:4px;pointer-events:none}
.planner-time-row small,.planner-notification-row small{color:var(--text-secondary);font-size:10px;line-height:1.3}
.planner-time-row>b{margin-left:auto;color:var(--accent-ink);font-size:13px;font-weight:620;font-variant-numeric:tabular-nums;pointer-events:none}
.planner-time-row input[type=time]{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:.015;z-index:2;cursor:pointer;color-scheme:light dark}
.planner-notification-row{min-height:44px}
.planner-notification-row>span:first-child{display:grid;gap:4px}
.planner-notification-row .settings-switch{flex:0 0 44px}
.planner-settings-status{min-height:0;margin:0;text-align:center;color:var(--text-secondary);font-size:11px;line-height:1.45}
.planner-settings-status:empty{display:none}
.planner-settings-card .planner-primary{margin:0}
.planner-home{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 20px;align-items:center;gap:3px 12px;min-height:72px;margin:4px 0 17px;padding:13px 16px;border-color:rgba(var(--theme-rgb),.12);box-shadow:var(--hermes-glass-shadow);transition:transform .18s ease,border-color .2s ease}
.planner-home:active{transform:scale(.99);border-color:rgba(var(--accent-rgb),.28)}
.planner-home>span{grid-column:1;font-size:10px;letter-spacing:.8px}
.planner-home strong{grid-column:1;font-size:14px;line-height:1.35;letter-spacing:-.1px}
.planner-home small{grid-column:2;grid-row:1 / span 2;align-self:center;color:var(--accent-ink);font-size:25px;font-weight:300}
@media(max-width:380px){.planner-view{padding-right:13px;padding-left:13px}.planner-settings-card{padding:17px 13px}.planner-day-switch{width:100%}}
@media(prefers-reduced-motion:reduce){.planner-day-switch button,.planner-workdays label,.planner-task-row,.planner-primary,.planner-home{transition:none!important}.planner-next-card{animation:none!important}}
.animations-disabled .planner-day-switch button,.animations-disabled .planner-workdays label,.animations-disabled .planner-task-row,.animations-disabled .planner-primary,.animations-disabled .planner-home{transition:none!important}
.planner-native-icon{display:block;width:19px;height:19px;background-color:currentColor;-webkit-mask:var(--planner-symbol) center/contain no-repeat;mask:var(--planner-symbol) center/contain no-repeat}.planner-pinterest-icon{display:block;width:20px;height:20px;object-fit:contain}.planner-icon img{max-width:21px;max-height:21px}
.planner-weekly-goals.hermes-home-glass{background:var(--hermes-glass-background);border-color:transparent;-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);box-shadow:var(--hermes-glass-shadow)}.planner-week-goal{grid-template-columns:23px minmax(0,1fr) auto;row-gap:4px}.planner-goal-track{height:4px;background:rgba(var(--theme-rgb),.09);box-shadow:inset 0 1px 1px rgba(var(--theme-rgb),.035)}.planner-week-goal .planner-goal-icon{color:var(--goal-tone,var(--accent-ink))}.planner-week-goal .planner-goal-track i{background:var(--goal-tone,var(--accent-ink));box-shadow:0 0 5px color-mix(in srgb,var(--goal-tone,var(--accent-ink)) 28%,transparent)}.planner-week-goal.goal-etsy{--goal-tone:var(--accent-ink)}.planner-week-goal.goal-pinterest{--goal-tone:var(--success)}.planner-week-goal.goal-tiktok{--goal-tone:var(--warning)}
.planner-weekly-goals{margin:2px 0 20px;padding:13px 14px;border:1px solid rgba(var(--theme-rgb),.11);border-radius:18px;background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);box-shadow:var(--hermes-glass-shadow)}.planner-weekly-title{display:flex;align-items:center;justify-content:space-between;margin:0 1px 8px}.planner-weekly-title h2{margin:0;font-size:12px;font-weight:620}.planner-weekly-title button{padding:5px 2px;border:0;background:none;color:var(--accent-ink);font:550 11px -apple-system,BlinkMacSystemFont,sans-serif}.planner-weekly-rows{display:grid;gap:7px}.planner-week-goal{display:grid;grid-template-columns:23px minmax(0,1fr) auto;align-items:center;gap:4px 8px;min-height:31px}.planner-goal-icon{display:grid;place-items:center;width:22px;height:22px;color:var(--accent-ink)}.planner-goal-icon .planner-native-icon,.planner-goal-icon img{width:16px;height:16px}.planner-goal-name{font-size:11px;color:var(--text-secondary)}.planner-week-goal>strong{font-size:11px;font-weight:620;font-variant-numeric:tabular-nums}.planner-goal-track{grid-column:2/4;display:block;height:3px;margin:0 0 2px;border-radius:5px;background:rgba(var(--theme-rgb),.13);overflow:hidden}.planner-goal-track i{display:block;height:100%;border-radius:inherit;background:var(--accent-ink);transition:width .25s ease}
.planner-home{grid-template-columns:minmax(0,1fr) 18px;grid-template-rows:auto auto auto 4px auto;align-items:center;gap:5px 12px;min-height:0;padding:15px 16px 14px;text-align:left}.planner-home-eyebrow{grid-column:1;grid-row:1;color:var(--accent-ink);font-size:9px;font-weight:650;letter-spacing:1.05px}.planner-home-title{grid-column:1;grid-row:2;font-size:15px!important;font-weight:620;letter-spacing:-.25px}.planner-home-progress{grid-column:1;grid-row:3;color:var(--text-secondary);font-size:11px;line-height:1.35;font-variant-numeric:tabular-nums}.planner-home-track{grid-column:1;grid-row:4;display:block;width:100%;height:3px;overflow:hidden;border-radius:4px;background:rgba(var(--theme-rgb),.11);box-shadow:inset 0 1px 1px rgba(var(--theme-rgb),.035)}.planner-home-track i{display:block;height:100%;border-radius:inherit;background:var(--accent-ink);box-shadow:0 0 6px rgba(var(--accent-rgb),.24);transition:width .28s cubic-bezier(.2,.8,.2,1)}.planner-home-next{grid-column:1;grid-row:5;display:flex;align-items:baseline;gap:7px;min-width:0}.planner-home-next small{flex:0 0 auto;color:var(--text-secondary);font-size:8px;font-weight:650;letter-spacing:.75px}.planner-home-next b{overflow:hidden;color:var(--text-primary);font-size:11px;font-weight:560;line-height:1.35;text-overflow:ellipsis;white-space:nowrap}.planner-home-chevron{grid-column:2;grid-row:1/6;justify-self:center;align-self:center;color:var(--accent-ink);font-size:25px;font-weight:300;line-height:1}
.planner-goals-settings{display:flex;align-items:center;justify-content:space-between;order:-1;width:100%;min-height:52px;margin:0;padding:0 0 16px;border:0;border-bottom:1px solid var(--border);background:none;color:var(--text-primary);text-align:left}.planner-goals-settings>span:first-child{display:grid;gap:4px}.planner-goals-settings strong{font-size:14px;font-weight:590}.planner-goals-settings small{color:var(--text-secondary);font-size:10px}.planner-goals-settings>span:last-child{font-size:22px;color:var(--text-secondary)}
.planner-task-wrap{margin:7px 0}.planner-task-wrap .planner-task-row{margin:0}.planner-posted-link{display:block;margin:3px 0 0 auto;padding:5px 8px;border:0;background:none;color:var(--accent-ink);font:550 11px -apple-system,BlinkMacSystemFont,sans-serif}.planner-next-card .planner-posted-link{margin:6px auto 0}
.planner-goal-overlay,.planner-guide-overlay{position:fixed;z-index:1100;inset:0;display:grid;place-items:center;padding:20px 16px calc(20px + env(safe-area-inset-bottom));background:rgba(0,0,0,.38);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;transition:opacity .2s ease}.planner-goal-overlay[hidden],.planner-guide-overlay[hidden]{display:none}.planner-goal-overlay.is-visible,.planner-guide-overlay.is-visible{opacity:1}.planner-goal-sheet,.planner-guide-sheet{position:relative;width:min(100%,430px);max-height:min(86vh,760px);overflow:auto;padding:25px 20px 17px;border:1px solid rgba(var(--theme-rgb),.16);border-radius:25px;color:var(--text-primary);background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);box-shadow:var(--hermes-glass-elevated-shadow);transform:translateY(8px) scale(.985);transition:transform .22s cubic-bezier(.2,.8,.2,1)}.is-visible>.planner-goal-sheet,.is-visible>.planner-guide-sheet{transform:translateY(0) scale(1)}.planner-goal-close{position:absolute;right:13px;top:11px;width:32px;height:32px;border:0;border-radius:50%;background:rgba(var(--theme-rgb),.08);color:var(--text-secondary);font-size:23px;font-weight:300}.planner-goal-eyebrow{margin:0 0 7px;color:var(--accent-ink);font-size:9px;font-weight:650;letter-spacing:1px}.planner-goal-sheet h2,.planner-guide-sheet h2{margin:0;font-size:22px;letter-spacing:-.45px}.planner-goal-sheet>p,.planner-guide-sheet>p{margin:6px 0 17px;color:var(--text-secondary);font-size:12px;line-height:1.5}.planner-goal-options{display:grid;gap:8px}.planner-goal-option{display:grid;grid-template-columns:38px minmax(0,1fr) auto;align-items:center;gap:10px;min-height:66px;padding:9px 10px;border:1px solid rgba(var(--theme-rgb),.12);border-radius:17px;background:rgba(var(--theme-rgb),.035)}.planner-goal-option-copy{display:grid;gap:3px;min-width:0}.planner-goal-option-copy strong{font-size:12px;font-weight:590}.planner-goal-option-copy small{font-size:10px;color:var(--text-secondary)}.planner-stepper{display:flex;align-items:center;gap:7px}.planner-stepper button{display:grid;place-items:center;width:29px;height:29px;border:1px solid rgba(var(--accent-rgb),.2);border-radius:10px;background:rgba(var(--accent-rgb),.09);color:var(--accent-ink);font-size:18px;line-height:1}.planner-stepper output{min-width:22px;text-align:center;font-size:13px;font-weight:650;font-variant-numeric:tabular-nums}.planner-goal-feedback{min-height:0!important;margin:12px 2px 4px!important;text-align:center}.planner-goal-feedback:empty{display:none}.planner-goal-adjustments{display:flex;justify-content:center;gap:9px;margin:6px 0 8px}.planner-goal-adjustments[hidden]{display:none}.planner-goal-adjustments button,.planner-goal-dismiss{min-height:34px;padding:5px 9px;border:0;border-radius:10px;background:rgba(var(--accent-rgb),.08);color:var(--accent-ink);font:550 11px -apple-system,BlinkMacSystemFont,sans-serif}.planner-goal-sheet .planner-primary,.planner-guide-sheet .planner-primary{margin:10px 0 0}.planner-goal-dismiss{display:block;margin:7px auto 0;background:none;color:var(--text-secondary)}.planner-guide-sheet ol{display:grid;gap:11px;margin:18px 0 10px;padding:0;list-style:none}.planner-guide-sheet li{display:grid;grid-template-columns:23px 1fr;align-items:start;gap:9px;color:var(--text-primary);font-size:12px;line-height:1.5}.planner-guide-sheet li>span{display:grid;place-items:center;width:22px;height:22px;border-radius:8px;background:rgba(var(--accent-rgb),.12);color:var(--accent-ink);font-size:11px;font-weight:650}.planner-guide-sheet li.planner-guide-unavailable{display:block;color:var(--text-secondary)}
@media(prefers-reduced-motion:reduce){.planner-goal-overlay,.planner-guide-overlay,.planner-goal-sheet,.planner-guide-sheet,.planner-goal-track i{transition:none!important}.planner-goal-sheet,.planner-guide-sheet{transform:none!important}}.animations-disabled .planner-goal-overlay,.animations-disabled .planner-guide-overlay,.animations-disabled .planner-goal-sheet,.animations-disabled .planner-guide-sheet{transition:none!important}
.planner-brand-mark{display:block;width:19px;height:19px;flex:0 0 19px;background-color:var(--accent-ink);-webkit-mask-position:center;-webkit-mask-repeat:no-repeat;-webkit-mask-size:contain;mask-position:center;mask-repeat:no-repeat;mask-size:contain}.planner-brand-pinterest{-webkit-mask-image:url('/icons/pinterest-mark.svg');mask-image:url('/icons/pinterest-mark.svg')}.planner-brand-tiktok{-webkit-mask-image:url('/icons/tiktok-mark.svg');mask-image:url('/icons/tiktok-mark.svg')}.planner-week-goal .planner-goal-icon{color:var(--accent-ink)}.planner-week-goal{min-height:39px}.planner-goal-count{display:inline-flex;align-items:center;justify-content:center;min-width:62px;min-height:28px;padding:6px 12px;border:1px solid rgba(var(--theme-rgb),.09);border-radius:999px;background:linear-gradient(135deg,rgba(var(--accent-rgb),.075),rgba(var(--theme-rgb),.025));box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.045);color:var(--text-primary);font-size:11px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:.01em;line-height:1;transition:background-color .22s ease,border-color .22s ease}.planner-week-goal.goal-etsy .planner-goal-count{border-color:rgba(var(--accent-rgb),.13);background:linear-gradient(135deg,rgba(var(--accent-rgb),.09),rgba(var(--theme-rgb),.025))}.planner-week-goal.goal-pinterest .planner-goal-count{border-color:rgba(var(--accent-rgb),.13)}.planner-week-goal.goal-tiktok .planner-goal-count{border-color:rgba(var(--accent-rgb),.13)}
.planner-week-selector{display:flex;gap:6px;overflow-x:auto;padding:5px 2px 10px;margin:0 0 5px;scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch}.planner-week-selector::-webkit-scrollbar{display:none}.planner-week-button{position:relative;display:grid;grid-template-rows:auto auto 4px;justify-items:center;align-content:center;gap:4px;flex:1 0 43px;min-width:43px;min-height:62px;padding:8px 4px 6px;border:1px solid transparent;border-radius:15px;background:transparent;color:var(--text-secondary);scroll-snap-align:start}.planner-week-button>span{font-size:9px;font-weight:580;white-space:nowrap}.planner-week-button>strong{font-size:14px;font-weight:620;font-variant-numeric:tabular-nums;color:var(--text-primary)}.planner-week-button[aria-pressed="true"]{border-color:rgba(var(--accent-rgb),.18);background:rgba(var(--accent-rgb),.10);color:var(--accent-ink);box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.05)}.planner-week-button[aria-pressed="true"]>strong{color:var(--accent-ink)}.planner-week-button>i{width:4px;height:4px;border-radius:50%;background:transparent}.planner-week-button>i.has-pending{background:var(--text-tertiary)}.planner-week-button>i.is-done{background:var(--success)}.planner-week-button:active{transform:scale(.97)}
@media(prefers-reduced-motion:reduce){.planner-week-button,.planner-goal-count{transition:none!important}.planner-week-button:active{transform:none}}.animations-disabled .planner-week-button,.animations-disabled .planner-goal-count{transition:none!important}

/* Planner polish: shared accent, balanced weekly goals and native week strip. */
.planner-weekly-goals.hermes-home-glass{padding:14px 15px 13px;margin:3px 0 20px;background:var(--hermes-glass-background);border:1px solid rgba(var(--theme-rgb),.11);-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);box-shadow:var(--hermes-glass-shadow)}
.planner-weekly-title{margin:0 1px 11px}.planner-weekly-rows{gap:9px}.planner-week-goal{grid-template-columns:25px minmax(0,1fr) auto;column-gap:9px;row-gap:6px;min-height:40px;align-items:center}.planner-goal-icon{width:24px;height:24px;justify-self:center;align-self:center;color:var(--accent-ink)}.planner-goal-icon .planner-native-icon,.planner-goal-icon img{width:15px;height:15px;object-fit:contain}.planner-goal-icon .planner-brand-pinterest{width:16px;height:16px}.planner-goal-icon .planner-brand-tiktok{width:14px;height:14px}.planner-week-goal .planner-goal-name{line-height:1.2}.planner-goal-count{min-width:64px;min-height:27px;padding:5px 12px;border-color:rgba(var(--accent-rgb),.13);background:rgba(var(--theme-rgb),.035);box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.045);text-align:center;line-height:1;font-feature-settings:'tnum' 1}.planner-week-goal.goal-etsy .planner-goal-count,.planner-week-goal.goal-pinterest .planner-goal-count,.planner-week-goal.goal-tiktok .planner-goal-count{border-color:rgba(var(--accent-rgb),.13);background:rgba(var(--accent-rgb),.045)}
.planner-goal-track{grid-column:2/4;height:3px;margin:0 0 2px;background:rgba(var(--theme-rgb),.10);box-shadow:inset 0 .5px 0 rgba(var(--theme-rgb),.035)}.planner-goal-track i{background:var(--accent-ink);box-shadow:0 0 5px rgba(var(--accent-rgb),.25);transition:width .28s cubic-bezier(.2,.75,.25,1)}.planner-week-goal.goal-etsy,.planner-week-goal.goal-pinterest,.planner-week-goal.goal-tiktok{--goal-tone:var(--accent-ink)}.planner-week-goal .planner-goal-icon{color:var(--accent-ink)}.planner-week-goal .planner-goal-track i{background:var(--accent-ink);box-shadow:0 0 5px rgba(var(--accent-rgb),.24)}
.planner-week-selector{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:3px;overflow:visible;padding:4px 0 9px;margin:0 0 7px;scroll-snap-type:none}.planner-week-button{grid-template-rows:12px 20px 5px;justify-items:center;align-content:center;gap:3px;flex:initial;min-width:0;width:100%;min-height:57px;padding:5px 1px 4px;border:1px solid transparent;border-radius:14px;scroll-snap-align:none;transition:background-color .2s ease,border-color .2s ease,transform .16s ease}.planner-week-button>span{font-size:9px;font-weight:580;line-height:12px;letter-spacing:.01em;text-transform:uppercase}.planner-week-button>strong{font-size:14px;line-height:20px;font-weight:630}.planner-week-button>i{width:4px;height:4px}.planner-week-button>i.is-current{background:var(--accent-ink);box-shadow:0 0 4px rgba(var(--accent-rgb),.25)}.planner-week-button[aria-pressed=true]{border-color:rgba(var(--accent-rgb),.14);background:rgba(var(--accent-rgb),.075);box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.045)}.planner-week-button[aria-pressed=true]>strong{color:var(--text-primary)}
.planner-task-wrap{display:flex;align-items:center;gap:3px;margin:7px 0;padding:0 8px 0 11px;border:1px solid rgba(var(--theme-rgb),.10);border-radius:17px;background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);box-shadow:var(--hermes-glass-shadow);transition:border-color .2s ease,transform .16s ease}.planner-task-wrap:active{border-color:rgba(var(--accent-rgb),.23)}.planner-task-wrap .planner-task-row{display:grid;flex:1;grid-template-columns:36px minmax(0,1fr) 14px;gap:10px;min-width:0;min-height:64px;margin:0;padding:8px 0;border:0;border-radius:0;background:transparent;box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;transition:none}.planner-task-wrap .planner-task-row:active{transform:none;border-color:transparent}.planner-task-wrap .planner-icon{width:33px;height:33px;flex-basis:33px;border-radius:11px}.planner-task-wrap .planner-icon svg{width:17px;height:17px}.planner-task-wrap .planner-icon .planner-brand-tiktok{width:15px;height:15px}.planner-task-wrap .planner-icon .planner-brand-pinterest{width:16px;height:16px}.planner-task-wrap .planner-task-copy strong{transition:color .18s ease,opacity .18s ease}.planner-task-wrap .planner-task-row.is-complete .planner-task-copy strong{color:var(--text-secondary)}.planner-completion-control{display:grid;place-items:center;flex:0 0 29px;width:29px;height:29px;padding:0;border:1px solid rgba(var(--theme-rgb),.23);border-radius:50%;background:rgba(var(--theme-rgb),.035);color:var(--accent-ink);transition:background-color .18s ease,border-color .18s ease,transform .2s cubic-bezier(.2,.8,.2,1)}.planner-completion-control>span{font-size:14px;font-weight:650;line-height:1}.planner-completion-control:active:not(:disabled){transform:scale(.9)}.planner-completion-control.is-complete{border-color:rgba(var(--accent-rgb),.36);background:var(--accent);color:var(--accent-contrast,var(--text-primary));animation:planner-check-in .22s cubic-bezier(.2,.8,.25,1)}.planner-completion-control:disabled{opacity:.7}.planner-next-line{display:flex;align-items:center;gap:10px}.planner-next-line .planner-next-title{flex:1;min-width:0}.planner-next-line .planner-completion-control{flex-basis:30px;width:30px;height:30px}.planner-overload{color:var(--text-tertiary);font-style:normal;font-size:10px;font-weight:500}.planner-confirm-overlay{position:fixed;inset:0;z-index:12500;display:grid;place-items:center;padding:22px max(20px,env(safe-area-inset-left)) calc(22px + env(safe-area-inset-bottom));background:rgba(0,0,0,.36);-webkit-backdrop-filter:blur(9px);backdrop-filter:blur(9px);opacity:0;transition:opacity .18s ease}.planner-confirm-overlay[hidden]{display:none}.planner-confirm-overlay.is-visible{opacity:1}.planner-confirm-sheet{width:min(100%,350px);padding:21px 19px 14px;border:1px solid rgba(var(--theme-rgb),.14);border-radius:22px;color:var(--text-primary);background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);box-shadow:var(--hermes-glass-elevated-shadow);transform:translateY(5px) scale(.99);transition:transform .2s cubic-bezier(.2,.8,.2,1)}.planner-confirm-overlay.is-visible .planner-confirm-sheet{transform:none}.planner-confirm-sheet h2{margin:0;font-size:18px;font-weight:620;letter-spacing:-.3px}.planner-confirm-sheet p{margin:7px 0 15px;color:var(--text-secondary);font-size:12px;line-height:1.45}.planner-confirm-sheet .planner-primary{margin:3px 0 0}.planner-confirm-sheet .planner-goal-dismiss{margin-top:4px}@keyframes planner-check-in{from{transform:scale(.82)}to{transform:scale(1)}}
@media(prefers-reduced-motion:reduce){.planner-week-button,.planner-goal-track i,.planner-completion-control,.planner-confirm-overlay,.planner-confirm-sheet{transition:none!important;animation:none!important}.planner-week-button:active,.planner-completion-control:active{transform:none!important}}.animations-disabled .planner-week-button,.animations-disabled .planner-goal-track i,.animations-disabled .planner-completion-control,.animations-disabled .planner-confirm-overlay,.animations-disabled .planner-confirm-sheet{transition:none!important;animation:none!important}
.planner-week-button{grid-template-rows:12px 20px 7px}.planner-week-indicators{display:flex;align-items:center;justify-content:center;gap:3px;height:7px}.planner-week-indicators i{display:block;width:4px;height:4px;border-radius:50%;background:transparent}.planner-week-indicators i.is-current{background:var(--accent-ink);box-shadow:0 0 4px rgba(var(--accent-rgb),.24)}.planner-week-indicators i.is-done{background:var(--success)}.planner-week-indicators i.has-pending{background:var(--text-tertiary)}
.planner-goal-waiting{margin:9px 1px 0;color:var(--text-tertiary);font-size:10px;line-height:1.35}

/* Focused Planner refinements use the same glass surface and theme tokens as Home. */
.planner-settings-pill{display:inline-flex;align-items:center;justify-content:center;box-sizing:border-box;min-width:72px;min-height:34px;padding:0 13px;border:1px solid rgba(var(--accent-rgb),.18);border-radius:999px;background:var(--hermes-glass-background);-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);box-shadow:var(--hermes-glass-shadow);color:var(--accent-ink);font:550 11px/1 -apple-system,BlinkMacSystemFont,sans-serif;text-align:center;white-space:nowrap;transition:transform .16s ease,border-color .2s ease,background-color .2s ease}.planner-settings-pill:active{transform:scale(.97);border-color:rgba(var(--accent-rgb),.28)}
.planner-weekly-goals.hermes-home-glass{background:var(--hermes-glass-background);border:1px solid rgba(var(--theme-rgb),.12);-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);box-shadow:var(--hermes-glass-shadow)}
.planner-goal-count{background:rgba(var(--accent-rgb),.045);border-color:rgba(var(--accent-rgb),.14);box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.06)}
.planner-week-button[aria-pressed=true]{border-color:rgba(var(--accent-rgb),.17);background:var(--hermes-glass-background);-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);box-shadow:var(--hermes-glass-shadow),inset 0 0 0 1px rgba(var(--accent-rgb),.055)}
.planner-completion-control{background:var(--hermes-glass-background);-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.08);transition:background-color .18s ease,border-color .18s ease,transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease}.planner-completion-control.is-complete{box-shadow:0 0 8px rgba(var(--accent-rgb),.18),inset 0 1px 0 rgba(var(--theme-rgb),.16)}.planner-completion-control.is-reverting{animation:planner-check-out .2s cubic-bezier(.2,.8,.25,1)}
@keyframes planner-check-out{from{transform:scale(.88);opacity:.72}to{transform:scale(1);opacity:1}}
@media(prefers-reduced-motion:reduce){.planner-settings-pill,.planner-completion-control.is-reverting{transition:none!important;animation:none!important}.planner-settings-pill:active{transform:none}}
.animations-disabled .planner-settings-pill,.animations-disabled .planner-completion-control.is-reverting{transition:none!important;animation:none!important}

/* Daily social publishing is presented as one task card per platform; the
   individual unit controls mutate their existing Planner task records. */
.planner-publishing-card{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:8px;margin:7px 0;padding:8px 12px;border:1px solid rgba(var(--theme-rgb),.11);border-radius:17px;background:var(--hermes-chrome-background);-webkit-backdrop-filter:var(--hermes-chrome-backdrop);backdrop-filter:var(--hermes-chrome-backdrop);box-shadow:var(--hermes-glass-shadow)}
.planner-publishing-open{display:flex;align-items:center;gap:10px;min-width:0;min-height:45px;padding:0;border:0;background:transparent;color:var(--text-primary);text-align:left;font:inherit}
.planner-publishing-open strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:12px;font-weight:570}
.planner-publishing-open .planner-icon{width:33px;height:33px;flex:0 0 33px;border-radius:11px}
.planner-publishing-open .planner-brand-tiktok{width:15px;height:15px}.planner-publishing-open .planner-brand-pinterest{width:16px;height:16px}
.planner-publishing-open .planner-task-chevron{margin-left:auto}
.planner-publishing-card{padding-right:8px}
.planner-publishing-progress{display:flex;align-items:center;gap:6px;padding-right:0}
.planner-publish-units{display:flex;align-items:center;gap:5px}
.planner-publish-unit{display:grid;place-items:center;width:30px;height:30px;padding:0;border:1px solid rgba(var(--theme-rgb),.22);border-radius:50%;background:var(--hermes-glass-background);-webkit-backdrop-filter:var(--hermes-glass-blur);backdrop-filter:var(--hermes-glass-blur);color:var(--accent-ink);transition:transform .17s cubic-bezier(.2,.8,.2,1),background-color .17s ease,border-color .17s ease,box-shadow .17s ease}
.planner-publish-unit:active:not(:disabled){transform:scale(.9)}
.planner-publish-unit i{font-size:12px;font-style:normal;font-weight:650;line-height:1}
.planner-publish-unit.is-complete{border-color:rgba(var(--accent-rgb),.34);background:var(--accent);color:var(--accent-contrast,var(--text-primary));box-shadow:0 0 7px rgba(var(--accent-rgb),.16);animation:planner-check-in .2s cubic-bezier(.2,.8,.25,1)}
.planner-publish-unit.is-unavailable{border-style:solid;background:rgba(var(--theme-rgb),.045);opacity:.62}
.planner-publish-unit:disabled{cursor:default;opacity:1}
@media(max-width:370px){.planner-publishing-card{gap:5px;padding:7px 8px 7px 9px}.planner-publishing-progress{gap:3px;padding-right:0}.planner-publish-units{gap:3px}}
@media(prefers-reduced-motion:reduce){.planner-publish-unit{transition:none!important;animation:none!important}.planner-publish-unit:active{transform:none!important}}
.animations-disabled .planner-publish-unit{transition:none!important;animation:none!important}
.planner-workload{font-style:normal;font-size:10px;font-weight:530;white-space:nowrap}.planner-workload-light{color:var(--text-tertiary)}.planner-workload-moderate{color:var(--text-secondary)}.planner-workload-heavy{color:var(--warning)}

/* Focus Number: compact Home summary, retaining the shared Hermes glass material. */
.planner-home{grid-template-columns:52px 1px minmax(0,1fr) 12px;grid-template-rows:minmax(44px,auto);align-items:center;gap:0 12px;min-height:66px;padding:10px 14px;text-align:left}
.planner-home:active{transform:scale(.99)}
.planner-home .focus-number-count{grid-column:1;grid-row:1;display:grid;justify-items:center;align-content:center;gap:2px;min-width:0;text-align:center}
.planner-home .focus-number-count strong{grid-column:auto;color:var(--accent-ink);font-size:clamp(27px,7vw,30px);font-weight:560;line-height:.95;letter-spacing:-.055em;font-variant-numeric:tabular-nums}
.planner-home .focus-number-count small,.planner-home .focus-number-copy small{grid-column:auto;grid-row:auto;align-self:auto;color:var(--text-secondary);font-size:8px;font-weight:650;line-height:1.2;letter-spacing:.9px;text-transform:uppercase}
.planner-home .focus-number-divider{grid-column:2;grid-row:1;display:block;width:1px;height:36px;background:rgba(var(--theme-rgb),.12)}
.planner-home .focus-number-copy{grid-column:3;grid-row:1;display:grid;align-content:center;gap:4px;min-width:0;text-align:left}
.planner-home .focus-number-copy strong{display:-webkit-box;grid-column:auto;overflow:hidden;color:var(--text-primary);font-size:clamp(12px,3.5vw,14px);font-weight:570;line-height:1.3;letter-spacing:-.12px;text-overflow:ellipsis;-webkit-box-orient:vertical;-webkit-line-clamp:2}
.planner-home .focus-number-chevron{grid-column:4;grid-row:1;justify-self:end;color:var(--text-secondary);font-size:19px;font-weight:350;line-height:1}
.planner-home.is-focus-empty .focus-number-count strong,.planner-home.is-focus-empty .focus-number-copy small,.planner-home.is-focus-loading .focus-number-count strong,.planner-home.is-focus-loading .focus-number-copy small{color:var(--text-tertiary)}
.planner-home.is-focus-empty .focus-number-copy strong,.planner-home.is-focus-loading .focus-number-copy strong{color:var(--text-secondary);font-weight:520}
@media(max-width:380px){.planner-home{grid-template-columns:47px 1px minmax(0,1fr) 10px;gap:0 10px;padding-right:12px;padding-left:12px}.planner-home .focus-number-count strong{font-size:27px}}
@media(prefers-reduced-motion:reduce){.planner-home{transition:none!important}}
.animations-disabled .planner-home{transition:none!important}

/* Planner task refinements: equal trailing checkbox alignment and the explicitly confirmed store review action. */
.planner-task-wrap .planner-task-row.is-listing-task .planner-task-copy{display:flex;align-items:center;align-self:stretch}
.planner-task-wrap .planner-task-row.is-listing-task .planner-task-copy strong{line-height:1.25}
.planner-guide-complete{display:block;width:100%;min-height:40px;margin:8px 0 0;padding:8px 12px;border:1px solid rgba(var(--accent-rgb),.2);border-radius:13px;background:rgba(var(--accent-rgb),.08);color:var(--accent-ink);font:600 12px -apple-system,BlinkMacSystemFont,sans-serif}

/* Compact, evidence-based listing rows in Store Review. */
.planner-guide-sheet{padding-top:52px}
.planner-guide-sheet>.planner-goal-close{position:absolute;right:13px;top:11px}
.planner-guide-sheet ol.has-listings{gap:7px;margin:13px 0 10px;list-style:none}
.planner-guide-sheet li.planner-review-row{display:block;min-width:0}
.planner-review-row button{display:grid;width:100%;grid-template-columns:64px minmax(0,1fr) 12px;align-items:center;gap:11px;padding:9px 10px;border:1px solid rgba(var(--theme-rgb),.10);border-radius:14px;background:rgba(var(--theme-rgb),.035);color:var(--text-primary);text-align:left;font:inherit;transition:background-color .16s ease,border-color .16s ease,transform .16s ease}
.planner-review-row button:active{transform:scale(.99);border-color:rgba(var(--accent-rgb),.22);background:rgba(var(--accent-rgb),.055)}
.planner-review-thumb{position:relative;display:grid;width:64px;height:64px;aspect-ratio:1/1;overflow:hidden;place-items:center;border-radius:11px;background:rgba(var(--theme-rgb),.07);color:var(--text-secondary)}
.planner-review-thumb img{display:block;width:64px;height:64px;aspect-ratio:1/1;object-fit:cover;object-position:center}
.planner-review-thumb-fallback{display:grid;width:100%;height:100%;place-items:center;color:var(--text-secondary);font-size:17px}
.planner-review-thumb-fallback[hidden]{display:none!important}
.planner-review-copy{display:grid;min-width:0;gap:3px}
.planner-review-copy strong{overflow:hidden;font-size:12px;font-weight:600;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
.planner-review-copy small{overflow:hidden;color:var(--text-secondary);font-size:10px;line-height:1.3;font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap}
.planner-review-copy>span{overflow:hidden;color:var(--accent-ink);font-size:10px;font-weight:550;line-height:1.3;text-overflow:ellipsis;white-space:nowrap}
.planner-review-chevron{justify-self:end;color:var(--text-secondary);font-size:17px;font-weight:400}
.planner-guide-sheet li.planner-guide-unavailable{margin:12px 1px;color:var(--text-secondary);font-size:11px;line-height:1.45}
.planner-day-heading{align-items:center;margin-bottom:7px}
.planner-day-heading span{display:none}
@media(prefers-reduced-motion:reduce){.planner-review-row button{transition:none!important}.planner-review-row button:active{transform:none}}
.animations-disabled .planner-review-row button{transition:none!important}
.planner-reminder-options{display:grid;gap:10px;margin:0 4px 10px;padding:12px;border:1px solid rgba(var(--theme-rgb),.10);border-radius:15px;background:rgba(var(--theme-rgb),.025)}
.planner-reminder-options[hidden],.planner-reminder-times[hidden]{display:none!important}
.planner-reminder-choice,.planner-reminder-quiet,.planner-reminder-times label{display:flex;align-items:center;justify-content:space-between;gap:12px;color:var(--text-secondary);font-size:12px}
.planner-reminder-choice select,.planner-reminder-times input{min-height:34px;padding:5px 9px;border:1px solid rgba(var(--theme-rgb),.13);border-radius:10px;background:var(--hermes-glass-background);color:var(--text-primary);font:inherit;color-scheme:dark}
[data-effective-theme="light"] .planner-reminder-choice select,[data-effective-theme="light"] .planner-reminder-times input{color-scheme:light}
.planner-reminder-times{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.planner-notification-target{animation:planner-notification-target 1.8s ease-out 1}
@keyframes planner-notification-target{0%,100%{border-color:rgba(var(--accent-rgb),.12)}35%{border-color:rgba(var(--accent-rgb),.52);box-shadow:0 0 0 3px rgba(var(--accent-rgb),.12)}}
@media(prefers-reduced-motion:reduce){.planner-notification-target{animation:none!important}}
.animations-disabled .planner-notification-target{animation:none!important}

/* Focused visual corrections: named image-first Library cards, refined
   Create surface, and fixed icon-only navigation using Home glass tokens. */
.library-grid { gap: 14px; margin-top: 5px; }
.library-card-image {
  aspect-ratio: 0.88 / 1;
  margin-bottom: 0;
  border-radius: 18px;
  background: transparent;
  box-shadow: none;
}
.library-card-thumb { aspect-ratio: 0.88 / 1; object-fit: cover; margin: 0; padding: 0; }
.library-card.is-poster .library-card-thumb { object-fit: cover; padding: 0; }
.mockup-drag-placeholder { aspect-ratio: 0.88 / 1; border-radius: 18px; }
.library-card-content { background: transparent; }
.library-card-image::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, transparent 49%, rgba(0,0,0,.10) 61%, rgba(0,0,0,.78) 100%);
  pointer-events: none;
}
.library-card.is-selected .library-card-image { outline: none; }
.library-card-name {
  position: absolute;
  z-index: 3;
  right: 12px;
  bottom: 12px;
  left: 12px;
  display: -webkit-box;
  min-width: 0;
  overflow: hidden;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.28;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  white-space: normal;
  text-shadow: 0 1px 3px rgba(0,0,0,.35);
}
.library-card:focus-visible .library-card-image { outline: 2px solid var(--accent); outline-offset: 2px; }

#libraryRescueLink.library-action-pill.hermes-home-glass {
  border-color: rgba(var(--accent-rgb), .28);
  background: linear-gradient(145deg, rgba(var(--accent-rgb), .21), rgba(var(--accent-rgb), .12));
  color: var(--accent-ink);
  box-shadow: var(--hermes-glass-shadow), inset 0 1px 0 rgba(var(--theme-rgb), .09);
}

#libraryFilterChips,
#listingsFilterChips {
  width: fit-content;
  max-width: 100%;
  gap: 3px;
  padding: 4px;
  margin: 0 0 13px;
  border: 1px solid rgba(var(--theme-rgb), .075);
  border-radius: 999px;
  align-items: center;
  background: var(--hermes-glass-background);
  -webkit-backdrop-filter: var(--hermes-glass-blur);
  backdrop-filter: var(--hermes-glass-blur);
  box-shadow: var(--hermes-glass-shadow);
}
#libraryFilterChips .chip,
#listingsFilterChips .chip {
  min-height: 33px;
  padding: 0 15px;
  border-color: transparent;
  background: transparent;
  color: var(--text-secondary);
  font-size: 12px;
  transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}
#libraryFilterChips .chip.is-active,
#listingsFilterChips .chip.is-active {
  color: var(--accent-ink);
  border-color: rgba(var(--accent-rgb), .15);
  background: rgba(var(--accent-rgb), .12);
}

.create-drop-card {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  padding: 22px 20px 20px;
  border: 1px solid rgba(var(--theme-rgb), .10);
  border-radius: 21px;
  background: var(--hermes-glass-background);
  -webkit-backdrop-filter: var(--hermes-glass-blur);
  backdrop-filter: var(--hermes-glass-blur);
  box-shadow: var(--hermes-glass-shadow);
}
.create-drop-card::before {
  content: "";
  position: absolute;
  inset: 0 0 auto;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(var(--theme-rgb), .20), transparent);
  pointer-events: none;
}
.create-drop-icon {
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  padding: 11px;
  margin-bottom: 13px;
  border: 1px solid rgba(var(--theme-rgb), .09);
  border-radius: 15px;
  background: var(--hermes-glass-background);
  box-shadow: inset 0 1px 0 rgba(var(--theme-rgb), .06);
  color: var(--accent-ink);
}
.create-drop-icon svg { width: 22px; height: 22px; }
.create-drop-title { margin-bottom: 5px; font-size: 16px; letter-spacing: -.015em; }
.create-drop-body { margin-bottom: 18px; font-size: 12px; }
.create-picker-btn { min-width: 176px; min-height: 45px; border-radius: 15px; }

.bottom-nav {
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  min-height: calc(58px + env(safe-area-inset-bottom));
  padding: 3px 0 env(safe-area-inset-bottom);
  transform: none;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  align-items: stretch;
  border: 0;
  border-top: 1px solid rgba(var(--theme-rgb), .08);
  border-radius: 0;
  background: rgb(var(--chrome-rgb));
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: 0 -4px 16px rgba(0,0,0,.12);
}
.nav-item {
  position: relative;
  min-width: 0;
  min-height: 52px;
  display: grid;
  grid-template-rows: 22px 4px;
  align-content: center;
  justify-items: center;
  row-gap: 3px;
  border-radius: 0;
  color: var(--text-tertiary);
  -webkit-tap-highlight-color: transparent;
}
.nav-item .nav-icon { width: 22px; height: 22px; }
.nav-item:not(.nav-item-create) .nav-icon { position:relative; display:block; place-self:center; overflow:visible; transform-origin:50% 50%; --nav-dot-optical-x:0px; }
.nav-item.is-active { color: var(--accent-ink); }
.nav-item:not(.nav-item-create) .nav-icon::after {
  content: "";
  position: absolute;
  left: calc(50% + var(--nav-dot-optical-x));
  top: calc(100% + 3px);
  width: 4px;
  height: 4px;
  border-radius: 50%;
  transform: translateX(-50%) scale(.65);
  background: var(--accent);
  box-shadow: 0 0 5px rgba(var(--accent-rgb), .28);
  opacity: 0;
  transition: opacity 170ms ease, transform 210ms cubic-bezier(.2,.8,.2,1);
  pointer-events:none;
}
.nav-item:not(.nav-item-create).is-active .nav-icon::after { opacity:1; transform:translateX(-50%) scale(1); }
/* JavaScript measures each inline SVG's artwork bounds and sets this optical
   adjustment. The dot remains anchored to the icon box at every viewport size. */
.nav-item-create .nav-icon::after { display:none; }
.nav-label {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.nav-item-create .nav-icon-create {
  width: 44px;
  height: 44px;
  color: var(--accent-contrast);
  background: rgba(var(--accent-rgb), .92);
  border: 1px solid rgba(var(--theme-rgb), .18);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.24), 0 3px 10px rgba(0,0,0,.18);
}
.nav-item-create.is-active .nav-icon-create { box-shadow: inset 0 1px 0 rgba(255,255,255,.28), 0 0 0 3px rgba(var(--accent-rgb), .12); }
.nav-item-create .nav-icon-create::after { display: none; }
.nav-item-create { display: flex; align-items: center; justify-content: center; }
@media (prefers-reduced-motion: reduce) {
  #libraryFilterChips .chip, #listingsFilterChips .chip { transition: none; }
}
.animations-disabled #libraryFilterChips .chip, .animations-disabled #listingsFilterChips .chip { transition: none; }

/* Store Goals history extends the current details screen, using Hermes glass
   surfaces and theme tokens rather than a separate dashboard treatment. */
.store-goals-history { margin-top:22px; padding-bottom:8px; }
.store-goals-history-heading { display:flex; align-items:flex-end; justify-content:space-between; margin:0 2px 10px; }
.store-goals-history-heading h2 { margin:4px 0 0; color:var(--text-primary); font-size:18px; font-weight:720; letter-spacing:-.025em; }
.store-goals-growth-insight { margin:0 0 12px; padding:10px 12px; border:1px solid rgba(var(--accent-rgb),.16); border-radius:14px; background:rgba(var(--accent-rgb),.075); color:var(--text-secondary-strong); font-size:12px; font-weight:570; }
.store-goals-growth-insight[data-direction="up"] { color:var(--accent-ink); }
.store-goals-growth-insight[data-direction="down"] { color:var(--text-secondary-strong); }
.store-goals-chart-shell { position:relative; overflow:hidden; padding:10px 10px 9px; border:1px solid rgba(var(--theme-rgb),.085); border-radius:18px; background:linear-gradient(145deg,rgba(var(--accent-rgb),.045),rgba(var(--surface-rgb),.55)); box-shadow:inset 0 1px 0 rgba(var(--theme-rgb),.045); }
.store-goals-chart-controls { display:flex; justify-content:flex-end; gap:3px; margin-bottom:3px; }
.store-goals-chart-controls button { min-width:39px; height:26px; padding:0 9px; border:1px solid transparent; border-radius:999px; background:transparent; color:var(--text-tertiary); font-family:inherit; font-size:10px; font-weight:600; line-height:1; transition:background-color .18s ease,color .18s ease,border-color .18s ease; }
.store-goals-chart-controls button[aria-pressed="true"] { border-color:rgba(var(--accent-rgb),.18); background:rgba(var(--accent-rgb),.12); color:var(--accent-ink); }
.store-goals-history-chart { display:block; width:100%; height:126px; overflow:visible; transition:opacity .18s ease; touch-action:pan-y; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
.store-goals-history-chart[hidden] { display:none; }
.store-goals-chart-actual-line { fill:none; stroke:var(--accent); stroke-width:2.5; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; }
.store-goals-chart-goal-line { fill:none; stroke:rgba(var(--theme-rgb),.43); stroke-width:1.35; stroke-dasharray:3 4; stroke-linecap:round; vector-effect:non-scaling-stroke; }
.store-goals-chart-goal-label { pointer-events:none; }
.store-goals-chart-goal-label-surface { fill:rgba(var(--surface-rgb),.94); stroke:rgba(var(--accent-rgb),.20); stroke-width:.7; }
.store-goals-chart-goal-label-swatch { stroke:rgba(var(--theme-rgb),.64); stroke-width:1.2; stroke-dasharray:2 2; stroke-linecap:round; }
.store-goals-chart-goal-label-text { fill:var(--text-secondary); font:600 8px -apple-system,BlinkMacSystemFont,"SF Pro Text",sans-serif; }
.store-goals-chart-point { fill:var(--app-raised); stroke:var(--accent); stroke-width:2; cursor:pointer; vector-effect:non-scaling-stroke; transition:r .16s ease,fill .16s ease; }
.store-goals-chart-point:hover,.store-goals-chart-point:focus { r:5.5; fill:var(--accent); outline:none; }
.hermes-chart-tooltip { position:absolute; z-index:4; left:50%; top:8px; display:grid; width:max-content; max-width:calc(100% - 20px); gap:2px; padding:8px 10px; border:1px solid rgba(var(--accent-rgb),.34); border-radius:12px; background:rgba(var(--surface-rgb),.94); color:var(--text-secondary); font-size:10px; line-height:1.35; text-align:left; pointer-events:none; opacity:0; transform:translate(-50%,4px) scale(.97); box-shadow:0 0 12px rgba(var(--accent-rgb),.12),inset 0 1px 0 rgba(var(--theme-rgb),.09); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px); transition:opacity .22s ease,transform .24s cubic-bezier(.2,.8,.25,1),border-color .2s ease,box-shadow .2s ease; }
.hermes-chart-tooltip.is-visible { opacity:1; transform:translate(-50%,0) scale(1); border-color:rgba(var(--accent-rgb),.48); box-shadow:0 0 15px rgba(var(--accent-rgb),.17),inset 0 1px 0 rgba(var(--theme-rgb),.10); }
.hermes-chart-tooltip.is-below { transform:translate(-50%,4px) scale(.97); }
.hermes-chart-tooltip.is-below.is-visible { transform:translate(-50%,0) scale(1); }
.store-goals-tooltip-month { color:var(--text-secondary); font-size:9px; font-weight:620; }
.store-goals-tooltip-revenue { color:var(--text-primary); font-size:13px; font-weight:700; font-variant-numeric:tabular-nums; }
.store-goals-tooltip-meta,.store-goals-tooltip-cached { color:var(--text-tertiary); font-size:9px; }
.store-goals-chart-hit { fill:transparent; stroke:transparent; pointer-events:all; cursor:pointer; touch-action:pan-y; -webkit-tap-highlight-color:transparent; -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; outline:none; }
.store-goals-chart-hit:focus:not(:focus-visible) { stroke:transparent; }
.store-goals-chart-hit:focus-visible { stroke:rgba(var(--accent-rgb),.58); stroke-width:1.7; outline:none; }
.store-goals-chart-interaction { pointer-events:none; }
.store-goals-chart-guide { stroke:rgba(var(--accent-rgb),.30); stroke-width:1; stroke-dasharray:2 4; vector-effect:non-scaling-stroke; }
.store-goals-chart-selected-segment { fill:none; stroke:var(--accent-ink); stroke-width:2.8; stroke-linecap:round; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 2.5px rgba(var(--accent-rgb),.72)); opacity:.9; }
.store-goals-chart-selected-segment.is-pulsing { animation:store-goals-segment-pulse .6s ease-out both; }
.store-goals-chart-halo { fill:rgba(var(--accent-rgb),.12); filter:blur(2px) drop-shadow(0 0 3px rgba(var(--accent-rgb),.54)); opacity:.82; }
.store-goals-chart-contact { fill:rgba(var(--accent-rgb),.28); filter:blur(1px) drop-shadow(0 0 2px rgba(var(--accent-rgb),.72)); opacity:.82; }
.store-goals-chart-lens-rim { fill:rgba(var(--surface-rgb),.16); stroke:rgba(var(--theme-rgb),.78); stroke-width:.72; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 1.4px rgba(var(--accent-rgb),.68)); }
.store-goals-chart-lens-highlight { fill:var(--text-primary); opacity:.72; filter:drop-shadow(0 0 1.2px rgba(var(--accent-rgb),.8)); transition:cx .12s ease-out,cy .12s ease-out; }
.store-goals-chart-lens-glint { fill:#fff; opacity:.82; filter:drop-shadow(0 0 1px #fff); }
.store-goals-chart-ring { fill:none; stroke:rgba(var(--accent-rgb),.76); stroke-width:1.05; vector-effect:non-scaling-stroke; transform-box:fill-box; transform-origin:center; animation:store-goals-led-ring .54s cubic-bezier(.18,.62,.3,1) both; }
.store-goals-chart-electric-arc { fill:none; stroke:var(--text-primary); stroke-width:.8; stroke-linecap:round; stroke-linejoin:round; vector-effect:non-scaling-stroke; opacity:0; filter:drop-shadow(0 0 2px rgba(var(--accent-rgb),.95)); animation:store-goals-electric-discharge .28s ease-out both; }
.store-goals-chart-electric-arc.arc-2 { animation-duration:.36s; animation-delay:34ms; }
.store-goals-chart-electric-arc.arc-3 { animation-duration:.24s; animation-delay:76ms; }
.store-goals-chart-electric-core { fill:#fff; stroke:rgba(var(--accent-rgb),.9); stroke-width:.55; filter:drop-shadow(0 0 2px rgba(var(--accent-rgb),.95)); }
.store-goals-chart-traveler { fill:var(--text-primary); filter:drop-shadow(0 0 2px var(--accent)); }
.store-goals-chart-flow-trail { fill:none; stroke:var(--accent-ink); stroke-width:1.65; stroke-dasharray:1 4; stroke-linecap:round; vector-effect:non-scaling-stroke; filter:drop-shadow(0 0 2px rgba(var(--accent-rgb),.9)); transition:opacity .08s linear; }
.store-goals-chart-interaction.is-scrubbing .store-goals-chart-flow-trail { opacity:.58; }
.store-goals-chart-particle-dissolve { pointer-events:none; }
.store-goals-chart-particle { fill:var(--text-primary); opacity:0; filter:drop-shadow(0 0 1.8px rgba(var(--accent-rgb),.95)); transform-box:fill-box; transform-origin:center; animation:store-goals-particle-dissolve 360ms cubic-bezier(.2,.65,.25,1) both; }
.store-goals-chart-point.is-selected { r:3.8; fill:var(--text-primary); stroke:var(--accent); stroke-width:1.55; filter:drop-shadow(0 0 2px rgba(var(--accent-rgb),.85)); }
.store-goals-chart-interaction { opacity:1; transition:opacity .16s ease; }
.store-goals-chart-point { transform-box:fill-box; transform-origin:center; }
.store-goals-chart-tooltip[hidden] { display:none; }
@keyframes store-goals-led-ring { from { opacity:.82; transform:scale(.45); } to { opacity:0; transform:scale(2.7); } }
@keyframes store-goals-electric-discharge { 0% { opacity:0; stroke-dasharray:0 24; stroke-dashoffset:0; } 22% { opacity:.96; stroke-dasharray:8 16; } 100% { opacity:0; stroke-dasharray:2 22; stroke-dashoffset:-5; } }
@keyframes store-goals-particle-dissolve { 0% { opacity:0; transform:translate3d(0,0,0) scale(.55); } 18% { opacity:.82; } 100% { opacity:0; transform:translate3d(var(--particle-x),var(--particle-y),0) scale(0); } }
@keyframes store-goals-segment-pulse { 0% { opacity:.35; stroke-width:2.5; } 32% { opacity:1; stroke-width:4; } 100% { opacity:.86; stroke-width:3.2; } }
.store-goals-chart-tooltip[hidden] { display:none; }
.store-goals-chart-legend { display:flex; justify-content:center; gap:16px; padding-top:2px; color:var(--text-tertiary); font-size:9px; }
.store-goals-chart-legend[hidden] { display:none; }
.store-goals-chart-legend span { display:flex; align-items:center; gap:5px; }
.store-goals-chart-legend i { display:block; width:12px; height:2px; border-radius:2px; background:var(--accent); }
.store-goals-chart-legend span+span i { height:0; border-top:1px dashed var(--text-tertiary); background:transparent; }
.store-goals-chart-empty,.store-goals-history-empty { margin:8px 2px 12px; color:var(--text-tertiary); font-size:11px; line-height:1.45; }
.store-goals-chart-empty[hidden],.store-goals-history-empty[hidden] { display:none; }
.store-goals-history-list { display:flex; flex-direction:column; gap:7px; margin-top:12px; }
.store-goals-history-row { overflow:hidden; border:1px solid rgba(var(--theme-rgb),.075); border-radius:15px; background:rgba(var(--surface-rgb),.46); }
.store-goals-history-row summary { display:grid; min-height:47px; grid-template-columns:minmax(0,1fr) auto auto 12px; align-items:center; gap:8px; padding:0 11px; list-style:none; cursor:pointer; }
.store-goals-history-row summary::-webkit-details-marker { display:none; }
.store-goals-history-month { overflow:hidden; color:var(--text-primary); font-size:12px; font-weight:620; text-overflow:ellipsis; white-space:nowrap; }
.store-goals-history-summary { color:var(--text-primary); font-size:12px; font-weight:650; font-variant-numeric:tabular-nums; white-space:nowrap; }
.store-goals-history-status { color:var(--text-tertiary); font-size:9px; white-space:nowrap; }
.store-goals-history-status.is-achieved { color:var(--accent-ink); }
.store-goals-history-chevron { color:var(--text-tertiary); font-size:17px; line-height:1; transition:transform .18s ease; }
.store-goals-history-row[open] .store-goals-history-chevron { transform:rotate(90deg); }
.store-goals-history-detail { display:flex; flex-direction:column; gap:7px; padding:0 12px 11px; color:var(--text-secondary); font-size:10px; }
.store-goals-history-detail > div { display:flex; justify-content:space-between; gap:10px; }
.store-goals-history-detail strong { color:var(--text-primary); font-weight:620; white-space:nowrap; }
.store-goals-history-percent { color:var(--accent-ink); }
.store-goals-history-track { height:3px; overflow:hidden; border-radius:99px; background:rgba(var(--theme-rgb),.09); }
.store-goals-history-track i { display:block; height:100%; border-radius:inherit; background:var(--accent); }
.store-goals-history-stale { color:var(--text-tertiary); font-size:9px; }
@media(max-width:360px) { .store-goals-history-row summary { grid-template-columns:minmax(0,1fr) auto 12px; gap:6px; } .store-goals-history-status { display:none; } }
@media(prefers-reduced-motion:reduce) { .store-goals-chart-controls button,.store-goals-history-chart,.store-goals-chart-point,.store-goals-history-chevron,.hermes-chart-tooltip { transition:none!important; } .store-goals-chart-ring,.store-goals-chart-electric-arc,.store-goals-chart-particle,.store-goals-chart-selected-segment.is-pulsing { animation:none!important; }
  .store-goals-chart-traveler { display:none!important; } }
.animations-disabled .store-goals-chart-controls button,.animations-disabled .store-goals-history-chart,.animations-disabled .store-goals-chart-point,.animations-disabled .store-goals-history-chevron,.animations-disabled .hermes-chart-tooltip { transition:none!important; }
.animations-disabled .store-goals-chart-ring,.animations-disabled .store-goals-chart-electric-arc,.animations-disabled .store-goals-chart-particle,.animations-disabled .store-goals-chart-selected-segment.is-pulsing { animation:none!important; }
.animations-disabled .store-goals-chart-traveler { display:none!important; }

/* GPT feedback is a floating toast anchored to its control: it never changes
   the editor's measured layout or pushes the title/description fields. */
.editor-smart-import-control { position:relative; z-index:4; margin:0 0 12px; }
.editor-smart-import-control .editor-smart-import-row { margin:0; }
.editor-smart-import-control .editor-smart-import-status {
  position:absolute;
  z-index:8;
  top:calc(100% + 5px);
  left:50%;
  width:max-content;
  max-width:min(92vw,340px);
  min-height:0;
  max-height:120px;
  margin:0;
  padding:7px 11px;
  overflow:hidden;
  border-color:rgba(var(--accent-rgb),.2);
  border-radius:999px;
  background:rgba(22,20,30,.94);
  box-shadow:0 7px 18px rgba(0,0,0,.24),inset 0 1px 0 rgba(255,255,255,.045);
  opacity:0;
  pointer-events:none;
  transform:translate(-50%,-3px) scale(.985);
  transition:opacity .17s ease,transform .19s cubic-bezier(.2,.8,.2,1);
  white-space:normal;
}
.editor-smart-import-control .editor-smart-import-status.is-visible {
  opacity:1;
  transform:translate(-50%,0) scale(1);
}
.editor-smart-import-control .editor-smart-import-status.is-visible.is-success {
  border-color:rgba(var(--accent-rgb),.25);
  background:rgba(24,32,31,.96);
  color:var(--accent-ink);
}
.editor-smart-import-control .editor-smart-import-status.is-visible.is-partial {
  border-color:rgba(220,160,65,.24);
  background:rgba(42,34,23,.96);
  color:#e9c985;
}
.editor-smart-import-control .editor-smart-import-status.is-visible.is-error {
  border-color:rgba(205,83,98,.24);
  background:rgba(43,25,30,.96);
  color:#e3a0a7;
}
.editor-smart-import-control .editor-smart-import-status.is-visible.is-neutral {
  border-color:rgba(255,255,255,.12);
  background:rgba(29,28,34,.96);
  color:var(--text-secondary);
}
.editor-smart-import-control .editor-smart-import-status.is-entering {
  opacity:0;
  transform:translate(-50%,-3px) scale(.985);
}
.editor-smart-import-pill .editor-smart-import-icon {display:grid;place-items:center;flex:0 0 17px;width:17px;height:17px;font-size:0;line-height:0;}
.editor-smart-import-pill .editor-smart-import-icon svg {display:block;width:16px;height:16px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.45;stroke-linecap:round;stroke-linejoin:round;}
.editor-smart-import-pill[data-gpt-state="response-ready"] .editor-smart-import-icon svg {stroke-width:1.35;}
@media(prefers-reduced-motion:reduce) {
  .editor-smart-import-control .editor-smart-import-status { transition:none!important; }
  .editor-smart-import-control .editor-smart-import-status.is-visible { transform:translate(-50%,0); }
}
body.animations-disabled .editor-smart-import-control .editor-smart-import-status { transition:none!important; }

/* Final drag-preview treatment: no surface color behind the moved card.
   The complete image frame is the preview silhouette. */
.library-card.is-mockup.is-dragging {
  overflow:visible;
  border-radius:18px;
  background:transparent;
  box-shadow:none;
  filter:none;
}
.library-card.is-mockup.is-dragging .library-card-content {
  overflow:visible;
  border-radius:18px;
  background:transparent;
}
.library-card.is-mockup.is-dragging .library-card-image {
  overflow:hidden;
  border-radius:18px;
  outline:1px solid rgba(var(--accent-rgb),.66);
  outline-offset:0;
  box-shadow:0 10px 24px rgba(0,0,0,.30),0 0 0 1px rgba(var(--accent-rgb),.16);
}