/* Shared refinements: forest, cream, editorial type, real garment imagery. */
[hidden] { display:none !important; }
button:focus-visible, summary:focus-visible, select:focus-visible, input:focus-visible { outline:2px solid var(--sage);outline-offset:3px; }
.hero-card.stage .stylist-options { order:0;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;flex:none;margin:0 0 6px; }
body.on-today .hero-card.stage .stylist-options { order:0;grid-template-columns:minmax(0,1fr) auto;margin:0 0 6px; }
.hero-card.stage #styleGroups { display:flex;min-width:0;overflow:visible;mask:none;padding:0;gap:4px; }
.home-group-selector { display:flex;flex:1;min-width:0;align-items:center;justify-content:space-between;gap:12px;border:0;background:transparent;color:var(--ink);padding:3px 4px;text-align:left;min-height:44px; }
.home-group-selector small { display:block;color:var(--muted);font-size:10px;letter-spacing:.12em;text-transform:uppercase;margin-bottom:2px; }
.home-group-selector b { display:block;font:600 20px/1.12 var(--serif);overflow-wrap:anywhere; }
.home-group-selector:disabled { opacity:1; }
.group-context-open { flex:none;width:44px;height:44px;background:transparent;border:1px solid var(--line);border-radius:50%;color:var(--ink);font-size:19px; }
.hero-card.stage #weatherAwareToggle { align-self:center;display:grid;gap:2px;justify-items:center;border:1px solid var(--line);border-radius:14px;padding:6px 10px;min-height:44px;font-size:10px;line-height:1.2; }
.hero-card.stage #weatherAwareToggle b { font-size:12px; }
.hero-card.stage #weatherAwareToggle { color:var(--muted);font-size:11px; }
.hero-card.stage #weatherAwareToggle[aria-pressed=true] { color:#fff; }
.hero-card.stage .home-context-bar { order:1;position:static;display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:8px;min-height:0;padding:0;margin:0 0 7px;flex:none;pointer-events:auto; }
.home-context-bar .stage-weather, .home-context-bar .stage-tip { display:flex;position:relative;align-items:center;gap:7px;border:1px solid var(--line);border-radius:14px;background:var(--surface);color:var(--ink);padding:7px 10px;min-width:0;min-height:46px;writing-mode:horizontal-tb;white-space:normal;text-align:left; }
.home-context-bar .stage-weather { justify-content:flex-start; }
.home-context-bar .stage-weather .stage-weather-icon { display:grid;place-items:center;flex:none;width:25px;height:25px; }
.home-context-bar .stage-weather-icon svg { width:24px;height:24px; }
.weather-compact-copy { display:flex;flex-wrap:wrap;align-items:baseline;column-gap:6px;row-gap:2px;min-width:0;line-height:1.25; }
.home-context-bar .weather-city { font:650 12px/1.2 var(--sans);overflow-wrap:anywhere; }
.weather-compact-reading { font-size:12px;color:var(--muted); }
.home-context-bar .stage-tip { flex-wrap:wrap;justify-content:flex-start;column-gap:6px;row-gap:2px; }
.home-context-bar .style-title { font:650 12px/1.2 var(--sans);color:var(--ink); }
.home-context-bar .style-reason { font:500 12px/1.2 var(--sans);color:var(--muted);overflow-wrap:anywhere;flex:1; }
.home-context-bar .style-arrow { font-size:16px; }
.home-context-bar .style-swatches { display:none; }
.hero-card.stage .outfit-insight { order:3;display:flex;justify-content:space-between;align-items:center;gap:6px;flex:none;margin-top:3px; }
.outfit-insight button { min-height:36px;font-size:12px; }
.why-trigger { border:0;background:none;color:var(--ink);font:650 12px var(--sans);padding:6px 4px; }
.outfit-feedback { padding:6px 4px;text-decoration:none;color:var(--muted); }
.hero-card.stage .thumb-bar { flex:none;order:5;margin-top:2px; }
.hero-card.stage .lock-notice,.hero-card.stage .piece-locks { order:4; }
body.on-today .hero-card.stage .editorial-board .flatlay-scene { inset:1.5% 12px 1%; }
body.on-today .hero-card.stage .fit-stack.flatlay { order:2;position:relative;display:block;flex:1 1 auto;min-height:0;padding:0;background:var(--lay); }
body.on-today .hero-card.stage .fit-stack .fit-hint { display:none; }
body.on-today .hero-card.stage .home-context-bar * { writing-mode:horizontal-tb;white-space:normal;text-transform:none;letter-spacing:normal;overflow:visible;text-overflow:clip; }
body.on-today .hero-card.stage .thumb-bar { order:5; }
body.on-today .hero-card.stage .outfit-insight { order:3; }
.view[data-view="today"].active { animation:none;transform:none; }
body.on-today main { padding-top:7px; }
body.on-today .hero-card.stage.home-flow { height:auto !important;max-height:none; }
body.on-today .hero-card.stage.home-flow .fit-stack.flatlay { min-height:280px;flex:0 0 280px; }
body.on-today .hero-card.stage.home-flow .thumb-bar { position:sticky;bottom:calc(var(--navh,72px) + 4px);z-index:10;background:var(--paper);padding-block:5px; }
body.on-today .hero-card.stage .flatlay-piece { position:absolute;display:block;padding:0;margin:0;border:0;max-width:none;min-width:0;background:none;overflow:visible;touch-action:manipulation; }
body.on-today .hero-card.stage .flatlay-piece .fit-crop { display:block;width:100%;height:100%; }
body.on-today .hero-card.stage .flatlay-piece .fit-crop img { display:block;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center; }
body.on-today .editorial-board::after { opacity:.28; }
.hero-card.stage .home-context-bar .stage-weather-empty .weather-compact-copy { display:block; }
.hero-card.stage .home-context-bar .stage-weather-empty .weather-city { display:none; }
.hero-card.stage .home-context-bar .stage-weather-nocity .weather-compact-reading { font-size:12px;color:var(--ink); }
.hero-card.stage .home-context-bar .stage-weather-nocity { padding:7px 10px; }
body.on-today .hero-card.stage .no-look-board .no-look-message { position:relative;inset:auto;max-height:none;overflow:visible;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;background:transparent;padding:24px 18px;border-radius:0;width:100%;box-sizing:border-box;color:#283b30;font-weight:400; }
.no-look-message h2 { font:500 clamp(24px,6vw,32px)/1.1 var(--serif);margin:0; }
.no-look-message p { margin:0;max-width:32ch;font-size:14px;line-height:1.5; }
.no-look-message .text-button { color:#344c3e;min-height:44px;font-size:12px; }
.recovery-mark { display:grid;place-items:center;width:52px;height:52px;border:1px solid #a8b39f;border-radius:50%;font-size:28px; }
.recovery-actions { display:grid;gap:8px;width:min(100%,290px); }
.recovery-actions button { min-height:44px; }
.recovery-actions .primary-button { background:#284535;color:#fff;border:1px solid #284535; }
.recovery-actions .secondary-button { background:#f6f0e5;color:#284535;border:1px solid #9aa78f; }
.hero-card.stage .recovery-bar { display:none; }
.hero-card.stage:has(.no-look-board:not(.starter-board)) { height:auto !important;min-height:calc(100dvh - var(--navh,70px) - 32px);max-height:none; }
.hero-card.stage .no-look-board:not(.starter-board) { min-height:350px; }
.hero-card.stage:has(.no-look-board:not(.starter-board)) .group-context-open { display:none; }
.hero-card.stage .no-look-board:has(.no-match-preview) .no-look-message { margin-top:260px; }
.group-option { width:100%;display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:12px;align-items:center;min-height:58px;padding:12px 10px;border:0;border-bottom:1px solid var(--line);background:transparent;color:var(--ink);text-align:left; }
.group-option span { font-size:16px;overflow-wrap:anywhere; }
.group-option small { color:var(--muted);font-size:12px; }
.group-option[aria-pressed=true] { background:var(--chip-bg);border-radius:12px; }
#homeGroupSearch { margin-bottom:14px; }
.context-group { font:600 22px var(--serif);margin:0 0 8px;overflow-wrap:anywhere; }
.context-field { display:grid;gap:7px;min-width:0;margin:14px 0; }
.context-field > span { font-size:13px;font-weight:650; }
.context-field select { width:100%;min-height:46px;border:1px solid var(--line);border-radius:12px;background:var(--surface-2);color:var(--ink);padding:10px;font:400 16px var(--sans); }
.context-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px; }
.context-requirements { margin-top:14px;border-top:1px solid var(--line);padding-top:18px; }
.context-requirements summary { font-size:14px;font-weight:650;cursor:pointer; }
.why-main { font:500 25px/1.3 var(--serif); }
.why-facts { padding-left:20px;font-size:14px;line-height:1.65; }
.saved-search { margin:4px 0 18px;width:100%; }
body .backup-nudge { background:var(--surface-2);color:var(--ink);border:1px solid var(--line); }
body .backup-nudge .backup-nudge-copy { color:var(--ink); }
body .backup-nudge .nudge-later { color:var(--muted); }
.organise-open { display:flex;align-items:center;gap:6px;min-height:44px;padding:8px 10px; }
.organise-open span { font-size:12px; }
.organise-scope { margin:6px 16px 10px;color:var(--muted);font-size:12px;line-height:1.4; }
.organise-scope .text-button { display:block;padding:4px 0;min-height:32px;font-size:12px; }
#itemDialog,#groupDialog,#groupContextDialog { overflow:hidden; }
#itemDialog[open],#groupDialog[open],#groupContextDialog[open] { display:flex;flex-direction:column; }
#itemDialog .sheet-content,#groupDialog .sheet-content,#groupContextDialog .sheet-content { flex:1;min-height:0;max-height:none;overflow-y:auto; }
.editor-actions { display:flex;gap:8px;flex:none;padding:12px 20px calc(12px + env(safe-area-inset-bottom,0px));background:var(--surface);border-top:1px solid var(--line); }
.editor-actions button { flex:1;min-height:46px; }
.recognition-details { color:var(--muted);font-size:12px;margin:10px 0 16px; }
.delete-section { margin:20px 0 8px;border-top:1px solid var(--line);padding-top:16px; }
.delete-section summary { color:var(--muted);font-size:13px;cursor:pointer;min-height:36px; }
.wear-again { margin:6px 0;min-height:44px;width:100%; }
.buy-assumption { margin:10px 0 16px;padding:12px;border-radius:12px;background:var(--surface-2);font-size:13px;line-height:1.5;color:var(--muted); }
.buy-summary { grid-template-columns:minmax(0,1fr);align-items:start; }
.buy-summary > b { font:500 25px/1.12 var(--serif); }
.buy-summary details { margin-top:2px;font-size:13px;line-height:1.5;color:inherit; }
.buy-summary details summary { min-height:44px;padding:12px 0;cursor:pointer; }
.buy-gain b { font:650 13px/1.3 var(--sans); }
.buy-examples { margin-top:14px;border-top:1px solid var(--line);padding-top:12px; }
.buy-examples summary { min-height:32px;font-size:13px;cursor:pointer;color:var(--ink); }
.buy-examples ul { list-style:none;margin:10px 0;padding:0; }
.buy-examples li { padding:8px 0;border-bottom:1px solid var(--line); }
.buy-example-photos { display:flex;gap:8px; }
.buy-example-photos img { width:64px;height:70px;object-fit:contain;background:var(--lay);border-radius:10px; }
.buy-examples li p { font-size:12px;line-height:1.4; }
.hero-card.stage .piece-locks:not(:has(button)) { display:none; }
.starter-route { font-size:14px;line-height:1.4;color:#384c3e;margin:8px 0; }
.starter-on .fit-actions { display:none; }
body.on-today .starter-on .starter-title { font-size:clamp(25px,7vw,34px); }
#welcomeDialog .wl-actions { order:-1;position:sticky;top:-15px;z-index:4;margin:0 0 12px;padding:12px 2px;background:var(--wl-bg);border-top:0;border-bottom:1px solid var(--wl-line); }
#welcomeDialog .wl-close { position:absolute;top:87px; }
#welcomeDialog .wl-location { display:none; }
#welcomeDialog .wl-fine { color:#9a988f; }
#welcomeDialog .wl-step-foot > span:last-child { font-size:clamp(11px,3cqw,13px); }
@media(max-width:350px) {
  .home-group-selector b { font-size:18px; }
  .group-context-open { width:40px; }
  .hero-card.stage .home-context-bar { gap:6px; }
  .home-context-bar .stage-weather,.home-context-bar .stage-tip { padding:6px 8px; }
  .organise-open { padding:8px; }
  .organise-open span { display:inline; }
  .hero-card.stage .no-look-board:not(.starter-board) { min-height:330px; }
}
@media(max-height:650px) {
  .hero-card.stage .home-context-bar { margin-bottom:5px; }
  body.on-today .hero-card.stage .thumb-bar .fit-btn { min-height:50px; }
  .hero-card.stage .stylist-options { margin-bottom:3px; }
  .hero-card.stage .outfit-insight button { min-height:32px; }
}
@media(min-width:760px) {
  .hero-card.stage .home-context-bar { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .home-context-bar .stage-tip,.home-context-bar .stage-weather { min-height:48px; }
}
