/* Budget mode v2 (WF-079 L2): the home box, the entry screen, the in-mode header and the Stay-step signpost.
   Tokens only — every colour comes from style.css (the --budget-box* family and the accent tokens). */

/* ---- The home box (Explore, under "… Or choose vibe criteria") ---- */
/* One compact row at every width: the question, then the pill (user, 2026-10-28). The whole box is the tap target. */
.budget-home{margin:10px 0 4px}
.budget-box{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 8px 8px 16px;border-radius:var(--radius-card);background:var(--budget-box);color:var(--budget-box-ink);text-decoration:none;box-shadow:var(--shadow-card);transition:transform var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}
.budget-box:hover{transform:translateY(-1px);box-shadow:var(--shadow-pop)}
.budget-box:focus-visible{outline:3px solid var(--budget-box-eyebrow);outline-offset:3px}
.budget-box-title{min-width:0;font:900 clamp(16px,4.2vw,20px)/1.2 var(--font-head);letter-spacing:-.02em;color:var(--budget-box-ink)}
.budget-box-amount{display:inline-block;min-width:3.4ch;font-weight:800;font-variant-numeric:tabular-nums}
.budget-pill-wide{display:none}
@media(min-width:700px){.budget-pill-wide{display:inline}.budget-pill-narrow{display:none}}
.budget-box-pill{flex:none;display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:0 14px;border-radius:var(--radius-pill);background:var(--budget-box-pill);color:var(--budget-box-pill-ink);font-weight:800;font-size:14px}
.budget-home-on{margin:8px 2px 0;font-size:14px;color:var(--ink-2)}
.budget-leave-link{border:0;background:none;padding:0;color:var(--accent-text);font-weight:800;text-decoration:underline;text-underline-offset:2px;min-height:var(--tap)}

/* ---- Budget screens: the header (back · Budget mode · Leave budget mode) ---- */
.budget-top{display:flex;align-items:center;gap:8px;min-height:var(--tap);margin:8px 0 4px}
.budget-back{flex:none;min-height:var(--tap);padding:0 10px 0 4px}
.budget-top-title{flex:1;min-width:0;font:900 15px/1.2 var(--font-head);color:var(--accent-text);text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.budget-leave{flex:none;min-height:36px;padding:0 12px;border:1px solid var(--accent-line);border-radius:var(--radius-pill);background:var(--surface);color:var(--accent-text);font-size:13px;font-weight:800}
.budget-leave:hover{background:var(--accent-soft)}
/* In the top bar (destination overview, budget mode on). Below 520 px the title needs the room, so the link is hidden there
   (phones leave from the budget screens or the home box's "Leave budget mode"). */
.budget-leave-top{min-height:36px;padding:0 10px;margin-right:4px;border:1px solid var(--accent-line);border-radius:var(--radius-pill);background:var(--surface);color:var(--accent-text);font-size:12px;font-weight:800;white-space:nowrap}
@media(max-width:519px){.budget-leave-top{display:none}}

/* ---- The entry screen (view=budget) ---- */
.budget-entry{max-width:760px;margin:0 auto;padding-bottom:24px}
.budget-entry h1{margin:12px 0 4px;font:900 clamp(28px,6vw,40px)/1.1 var(--font-head)}
.budget-entry h1:focus{outline:none}
.budget-lede{color:var(--muted);margin:0 0 16px}
.budget-amount{display:grid;gap:14px;padding:18px;border:1px solid var(--line);border-radius:var(--radius-card);background:var(--surface);box-shadow:var(--shadow-card)}
.budget-figure{display:flex;align-items:baseline;justify-content:center;gap:2px;color:var(--accent-ink)}
.budget-currency{font:900 clamp(36px,10vw,56px)/1 var(--font-head)}
.budget-amount-input{width:5.2ch;min-width:0;border:0;border-bottom:2px solid var(--accent-line);background:transparent;color:var(--accent-ink);font:900 clamp(44px,12vw,68px)/1.05 var(--font-head);letter-spacing:-.03em;text-align:left;padding:0;-moz-appearance:textfield;appearance:textfield}
.budget-amount-input::-webkit-outer-spin-button,.budget-amount-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.budget-amount-input:focus-visible{outline:none;border-bottom-color:var(--accent)}
.budget-range{width:100%;min-height:var(--tap);accent-color:var(--accent);margin:0}
.budget-picks{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}
.budget-q{margin-top:22px}
.budget-q-title{font-size:16px;margin:0 0 8px}
.budget-from{display:flex;flex-wrap:wrap;gap:8px}
.budget-go{width:100%;margin-top:26px;min-height:52px;font-size:16px}
.budget-foot{margin:12px 0 0;font-size:13px;color:var(--muted);text-align:center}

/* ---- The options placeholder (view=budget-options; L3 replaces it) ---- */
.budget-options{max-width:960px;margin:0 auto;padding-bottom:24px}
.budget-options .loading-state{margin:24px 0}

/* ---- The Stay step signpost (under the band chips, £ chosen, mode off) ---- */
.budget-signpost{margin:10px 0 0;font-size:14px}
.budget-signpost a{display:inline-flex;align-items:center;gap:.3em;min-height:var(--tap);color:var(--accent-text);font-weight:800}

@media(prefers-reduced-motion:reduce){.budget-box{transition:none}.budget-box:hover{transform:none}}

/* ---- Deep-dive pre-sets (WF-079 L4): Worth paying for (Ideas), Cheap hacks (overview), the loose home's line ---- */
.ideas-worth{margin:12px 0 4px}
.worth-note{margin:2px 0 0;font-size:13px;color:var(--muted)}
.worth-why{display:block}
.worth-source{display:inline-flex;align-items:center;justify-content:center;min-width:24px;min-height:24px;color:var(--accent-text);font-weight:800;text-decoration:none;vertical-align:middle}
.worth-source:hover{text-decoration:underline}
.hacks-body{display:grid;gap:8px;margin-top:8px}
.hack-cat>h3{display:flex;align-items:center;gap:8px;margin:0 0 6px;font-size:15px;line-height:22px;font-weight:800}
.hack-cat>h3 .icon{color:var(--accent-text)}
.hack-cat-title{flex:1;min-width:0}
.hack-tips{list-style:none;margin:0;padding:0 12px 10px;display:grid;gap:10px}
.hack-tip{display:grid;gap:2px}
.hack-text{margin:0;line-height:1.45}
.hack-asof{font-size:12px;color:var(--muted);white-space:nowrap}
.hack-sources{margin:0}
.hack-source{display:inline-flex;align-items:center;min-height:32px}
@media(prefers-reduced-motion:reduce){