:root{--coral:#FF4400;--peach:#FFB347;--mint:#00C775;--lavender:#1F2ADE;--sky:#60B4FF;--dark:#1A1A1A;--mid:#7A776F;--light:#EEF0FD;--card:#FFFFFF;
  /* Brand blue is fixed — used for help icons, the wholesale/min-to-charge line, and the Google sign-in link. It never follows the per-step theme color. */
  --brand-blue:#1F2ADE;--brand-blue-bg:#C9CCF6;
  /* Body, headings, and uppercase micro-labels — one font, no exceptions */
  --ff:'Archivo','Helvetica Neue',Helvetica,Arial,sans-serif;
  --fs:'Archivo','Helvetica Neue',Helvetica,Arial,sans-serif;
  /* Numeric displays */
  --fn:'Bricolage Grotesque',sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--ff);background:#FAFAFA;min-height:100vh;color:var(--dark);overflow-x:hidden}
/* Numeric displays: Bricolage Grotesque, tabular figures */
.num,.hp-val,.stat-box .sv,.cp-item .cpv,.sl-val,.sl-num,.sc-ws-pill,
input.sc-rt-input,.sc-side-badge,.ps-card-label,.ps-card-sub,
.ps-card-val,.ps-band-val,.ps-final-val,.mb,input[type=number],select,.account-opt-badge{font-family:var(--fn);font-variant-numeric:tabular-nums}
/* Text inputs stay in the primary body font */
input:not([type=number]):not([type=range]),textarea{font-family:var(--ff)}
input[type=number]::-webkit-outer-spin-button,input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
input[type=number]{-moz-appearance:textfield}
.blob{position:fixed;border-radius:50%;filter:blur(60px);opacity:.22;pointer-events:none;z-index:0;animation:drift 10s ease-in-out infinite alternate;will-change:transform}
/* Blobs are GPU-expensive on mobile — drop the blur, keep subtle colour wash */
@media(pointer:coarse){.blob{filter:none;opacity:.10}}
.blob-1{width:400px;height:400px;background:#FF6B6B;top:-100px;left:-100px}
.blob-2{width:300px;height:300px;background:#6BCFB0;bottom:-50px;right:-50px;animation-delay:-3s}
.blob-3{width:200px;height:200px;background:#FFB347;top:40%;left:60%;animation-delay:-6s}
@keyframes drift{from{transform:translate(0,0)scale(1)}to{transform:translate(30px,20px)scale(1.1)}}
#app{position:relative;z-index:1;max-width:720px;margin:0 auto;padding:20px 16px 80px}
/* iPhone home bar safe-area: adds to existing 80px bottom padding */
@supports(padding-bottom:env(safe-area-inset-bottom)){
  #app{padding-bottom:calc(80px + env(safe-area-inset-bottom))}
}
/* Eliminate 300ms tap delay and kill tap highlight on all interactive elements */
.btn,.mode-card,.ind-card,.country-btn,.import-cta,.picker-btn,.currency-sel,
button,input,select,textarea{touch-action:manipulation}
.btn,.mode-card,.ind-card,.country-btn,.import-cta,.picker-btn{
  -webkit-tap-highlight-color:transparent
}
.top-bar{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;gap:10px;flex-wrap:nowrap}
.top-bar-right{display:flex;align-items:center;gap:8px;flex-wrap:nowrap;margin-left:auto;min-width:0}
/* All controls stay on a single row on mobile — shrink sizing instead of wrapping
   to a second line, so logo + language + currency + sign-in all fit at once. */
@media(max-width:540px){
  .top-bar{gap:6px;margin-bottom:10px}
  .logo{font-size:18px;flex-shrink:0}
  .top-bar-right{gap:5px}
  .picker-group{padding:2px}
  .picker-btn{padding:4px 8px;font-size:11px}
  .currency-sel{padding:6px 20px 6px 9px;font-size:11px;background-position:right 8px center}
  .auth-signin-btn{padding:6px 10px;font-size:11px}
}
@media(max-width:380px){
  .logo{font-size:16px}
  .picker-btn{padding:4px 6px;font-size:10px}
  .currency-sel{padding:5px 18px 5px 8px;font-size:10px}
  .auth-signin-btn{padding:5px 8px;font-size:10px}
}
.logo{font-size:22px;font-weight:800;color:#1A1A1A;letter-spacing:-1.2px;display:flex;align-items:center;gap:6px}
/* All top-bar controls share one pill recipe: white bg, #EAE8E2 border, 12px/600.
   Heights are equalised: picker-group = 1px border + 3px outer pad + 5px inner pad (×2).
   currency-sel and auth-signin-btn = 1px border + 8px padding (×2). Same total. */
.picker-group{display:flex;gap:2px;background:#fff;border:1px solid #EAE8E2;border-radius:999px;padding:3px}
.picker-btn{border:none;border-radius:999px;padding:5px 11px;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;background:transparent;color:#6B6B6B;white-space:nowrap}
.picker-btn.active{background:#1A1A1A;color:#fff}
/* Progress indicator — its own full-width row below the top bar, mirroring the
   mockup's allocation of significant width to "Step N of Total" + bar segments. */
.progress-track{display:block;width:100%;margin-bottom:16px}
.progress-track:empty{display:none;margin-bottom:0}
/* Progress indicator — mockup style: "Step N of Total" + step name, then a full-width
   row of thick rounded bar segments (one per step), each its own fixed color. */
.prog-strip{display:flex;flex-direction:column;gap:6px;width:100%}
.prog-head{display:flex;align-items:baseline;justify-content:space-between;gap:7px}
.prog-badge{font-family:var(--fs);font-size:11px;font-weight:700;color:var(--lavender);text-transform:uppercase;letter-spacing:1.2px;white-space:nowrap}
.prog-name{font-size:12px;color:#9A978F;white-space:nowrap}
.prog-bars{display:flex;align-items:center;gap:5px}
.prog-home{width:13px;height:13px;border-radius:50%;background:#1A1A1A;opacity:.35;flex-shrink:0;cursor:pointer;transition:opacity .15s}
.prog-home:hover{opacity:.6}
.prog-dot{flex:1;height:7px;min-width:10px;border-radius:999px;opacity:.3;transition:opacity .2s;flex-shrink:0}
.prog-dot.done,.prog-dot.active{opacity:1}
.prog-dot.visited{opacity:.55;cursor:pointer}
.prog-dot.visited:hover{opacity:.75}
.prog-dot.done{cursor:pointer}
/* Shared session banner — sits between top-bar and step card */
#shareBanner:empty{display:none}
#shareBanner{margin-bottom:12px}
/* Read-only lock: disable all inputs/selects/textareas while in a shared view.
   Buttons + onclick-divs are locked via JS capture-phase interceptor (see share.js). */
.share-locked input,
.share-locked textarea,
.share-locked select:not(#currencyPickerTop){pointer-events:none !important;opacity:0.65;cursor:default !important}
.share-locked input[type="range"]{opacity:0.4}
/* Only dim Export and Share buttons in shared view — all other buttons stay fully active */
.share-locked [onclick="exportSheet()"],.share-locked [onclick="shareLink()"]{opacity:0.45 !important;cursor:default !important}
/* Disable all action buttons in shared read-only view */
.share-locked button{pointer-events:none !important;opacity:0.5 !important;cursor:default !important}
/* Re-enable: back (.btn.bg), next/save-step (.btn.bp), start-wizard (.btn.btn-red) */
.share-locked button.btn.bg,.share-locked button.btn.bp,.share-locked button.btn.btn-red{pointer-events:auto !important;opacity:1 !important;cursor:pointer !important}
/* Keep export + share locked even though they carry .btn.bp (specificity 0,4,1 > 0,3,1) */
.share-locked button.btn.bp[onclick="exportSheet()"],.share-locked button.btn.bp[onclick="shareLink()"]{pointer-events:none !important;opacity:0.45 !important;cursor:default !important}
/* Disable clickable landing cards; prod-item stays clickable so the (locked) modal can open */
.share-locked .mode-card,.share-locked .ind-card{pointer-events:none !important;opacity:0.7 !important;cursor:default !important}
/* Product modal locked state (class applied via JS when _shareReadOnly) */
#prodModal.share-locked button{pointer-events:none !important;opacity:0.5 !important;cursor:default !important}
#prodModal.share-locked button.prod-modal-close{pointer-events:auto !important;opacity:1 !important;cursor:pointer !important}
#prodModal.share-locked input,#prodModal.share-locked select,#prodModal.share-locked textarea{pointer-events:none !important;opacity:0.65;cursor:default !important}
#prodModal.share-locked input[type="range"]{opacity:0.4}
/* Card */
.card{background:var(--card);border-radius:24px;padding:28px 24px;box-shadow:0 20px 60px rgba(0,0,0,.15);animation:slideUp .4s cubic-bezier(.34,1.56,.64,1)}
@keyframes slideUp{from{opacity:0;transform:translateY(40px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}
/* Step label — shows "Step N · Name" using existing lavender uppercase style */
.step-label{font-family:var(--fs);font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--lavender);margin-bottom:6px}
.card-title{font-size:24px;font-weight:800;line-height:1.2;color:var(--dark);margin-bottom:6px}
.card-sub{font-size:14px;color:var(--mid);margin-bottom:20px;line-height:1.5}
/* Grid */
.fg{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;align-items:end}
.fg.s{grid-template-columns:1fr}.fg.t{grid-template-columns:1fr 1fr 1fr}
/* Fields */
.field{display:flex;flex-direction:column;gap:5px}
.field label{font-size:12px;font-weight:600;color:var(--mid);display:flex;align-items:center;gap:4px;flex-wrap:wrap}
.iw{position:relative;display:flex;align-items:center}
.iw .pfx{position:absolute;left:14px;font-weight:700;color:var(--mid);font-size:14px;pointer-events:none;z-index:1}
.iw input,.iw select{width:100%;padding:13px 14px 13px 30px;border:1px solid #E8E4F0;border-radius:14px;font-size:16px;font-weight:600;color:var(--dark);background:var(--light);outline:none;transition:all .2s}
.iw input.np{padding-left:14px}
.iw input:focus,.iw select:focus{border-color:var(--lavender);background:white;box-shadow:none}
.iw .sfx{position:absolute;right:11px;font-size:12px;font-weight:600;color:var(--mid);pointer-events:none}
select{-webkit-appearance:none;background:var(--light) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='%234A4A6A'%3E%3Cpath d='M7 10l5 5 5-5z'/%3E%3C/svg%3E") no-repeat right 10px center/18px;padding-right:32px!important;padding-left:12px!important;cursor:pointer}
/* Buttons */
.btn-row{display:flex;gap:10px;margin-top:20px}
.btn{border:none;border-radius:14px;font-size:14px;font-weight:700;cursor:pointer;padding:13px 20px;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:7px}
.bp{background:var(--lavender);color:white;flex:1;box-shadow:none}
.bp:hover{transform:translateY(-1px)}
.bp:disabled{opacity:.4;cursor:not-allowed;transform:none}
.bg{background:#fff;color:#5C5A54;border:1px solid #D9D6CE}.bg:hover{background:#F4F2EC}
.bm{background:var(--lavender);color:white;flex:1;box-shadow:none}
.bc{background:var(--coral);color:white;flex:1}
.bm:hover,.bc:hover{transform:translateY(-1px)}
/* HIGH: focus-visible rings for keyboard navigation */
.btn:focus-visible{outline:3px solid color-mix(in srgb,var(--lavender) 70%,transparent);outline-offset:2px}
.bg:focus-visible{outline:3px solid var(--lavender);outline-offset:2px}
.picker-btn:focus-visible{outline:2px solid rgba(255,255,255,.8);outline-offset:2px}
.country-btn:focus-visible,.ind-card:focus-visible,.mode-card:focus-visible,.prod-item:focus-visible{outline:3px solid var(--lavender);outline-offset:2px}
input[type=range]:focus-visible{outline:3px solid var(--pc-main,var(--lavender));outline-offset:3px}
/* Sections & Tips */
.sec{font-family:var(--fs);font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--lavender);margin:18px 0 10px;display:flex;align-items:center;gap:8px}
.sec::after{content:'';flex:1;height:1px;background:linear-gradient(to right,#E8E4F0,transparent)}
/* ── Unified callout system ───────────────────────────────────────────────────
   Every helper box on every page is exactly one of four types, sharing one
   geometry: flex row, icon in its own flex-shrink:0 column, text in flex:1,
   radius 16px, padding 14px, body 13px/1.5, one emoji top-left.
   INFO = neutral guidance, no action (bg #ECEDF1, icon 💡)
   ACTION = has a button, tinted in the page's phase color (icon ⭐)
   RESULT = a computed outcome/confirmation/summary (magenta tint, ✓ check)
   INLINE NOTE = minor aside, unframed, no fill (muted text, icon optional)   */
.tip{background:#F3F0E9;border:1px solid #E7E2D7;border-radius:16px;padding:14px;font-size:13px;color:#1A1A1A;display:flex;gap:9px;align-items:flex-start;margin-bottom:16px;line-height:1.5}
.tip-i{font-size:16px;flex-shrink:0;width:20px;text-align:center}
.tip>span:last-child{flex:1;min-width:0}
/* Plain inline helper line — no colored box, for notes that don't need visual weight.
   Padding/icon-column width match .tip/.tip-i so the icon+text column lines up at the
   same indent whether a note is boxed or plain, on this page or any other. */
.helper-line{display:flex;gap:9px;align-items:flex-start;font-size:12.5px;color:#7A776F;line-height:1.5;margin-bottom:14px;padding:0 14px}
.helper-line-muted{color:#7A776F}
.helper-line-i{font-size:16px;flex-shrink:0;width:20px;text-align:center}
.helper-line>span:last-child{flex:1;min-width:0}
/* Tooltip */
.tt{position:relative;display:inline-flex;align-items:center;cursor:default}
.tt-q{width:15px;height:15px;background:var(--brand-blue-bg);color:var(--brand-blue);border-radius:50%;font-size:9px;font-weight:800;display:inline-flex;align-items:center;justify-content:center;cursor:help;flex-shrink:0;opacity:.85;transition:opacity .15s;position:relative}
/* Expand touch target on touch devices without changing visual size */
@media(pointer:coarse){.tt-q{width:20px;height:20px;font-size:10px}}
.tt:hover .tt-q,.tt:focus-within .tt-q{opacity:1}
.tt-q:focus-visible{outline:2px solid var(--brand-blue);outline-offset:2px;opacity:1}
/* Mobile: tooltip shows on tap via focus (.tt-q has tabindex="0" in ttLabel()) */
.tt:focus-within .tt-box{opacity:1}
.tt-box{position:absolute;bottom:calc(100% + 8px);left:0;background:#1A1A1A;color:white;border-radius:10px;padding:9px 13px;font-size:12px;line-height:1.5;width:230px;z-index:300;pointer-events:none;opacity:0;transition:opacity .2s;font-weight:400;box-shadow:0 8px 24px rgba(0,0,0,.35);white-space:normal;text-transform:none;letter-spacing:normal}
.tt-box em{color:#FFE66D;font-style:normal;font-weight:600}
.tt:hover .tt-box{opacity:1}
/* Suggestion */
.sug{background:color-mix(in srgb,var(--lavender) 9%,#fff);border:none;border-radius:16px;padding:14px;margin:12px 0;animation:fadeIn .3s ease}
.sug p{font-size:13px;color:var(--dark);line-height:1.5}
.sug-acts{display:flex;gap:8px;margin-top:10px;flex-wrap:wrap}
/* Hourly rate feedback note — themed to match step color, error keeps semantic red */
.lrNote-good{background:color-mix(in srgb,#D4396F 8%,#fff);color:#1A1A1A;border-radius:16px;padding:14px;font-size:13px;line-height:1.5}
.lrNote-neutral{background:#F3F0E9;border:1px solid #E7E2D7;color:var(--dark);border-radius:16px;padding:14px;font-size:13px;line-height:1.5}
.mb{border:none;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;padding:7px 12px}
.mb-y{background:var(--lavender);color:white}.mb-n{background:rgba(0,0,0,.06);color:var(--dark)}
@keyframes fadeIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}
/* Mode selector */
/* Desktop: 3-column centered cards (old fairy/shuffle/factory emojis, large + centered) */
.mode-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px}
.mode-card{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center;border:2px solid #EAE8E2;border-radius:16px;padding:24px 16px 16px;cursor:pointer;transition:all .15s;background:#fff;gap:6px}
.mode-card:hover{border-color:var(--lavender);transform:translateY(-1px)}
.mode-card.sel{border-color:var(--lavender);background:color-mix(in srgb,var(--lavender) 9%,#fff)}
.mode-card-top{display:flex;flex-direction:column;align-items:center;gap:10px;width:100%}
/* Desktop emoji: large, centered */
.mode-card .me{font-size:36px;display:block;text-align:center;line-height:1;width:auto;flex-shrink:0}
.mode-card .ml{font-size:15px;font-weight:700;color:#1A1A1A;margin-bottom:2px}
.mode-card .ms{font-size:12px;color:#6B6B6B;line-height:1.45}
/* Checkmark: absolute top-right corner on desktop */
.mode-card-check{position:absolute;top:12px;right:12px;opacity:0;transition:opacity .15s}
.mode-card.sel .mode-card-check{opacity:1}
.mode-info-btn{display:inline-block;margin-top:4px;font-size:10px;font-weight:700;color:var(--mid);background:none;border:1px solid #EAE8E2;border-radius:99px;padding:2px 8px;cursor:pointer;transition:all .15s;align-self:center}
.mode-info-btn:hover{border-color:var(--lavender);color:var(--lavender)}
.mode-info-box{display:none;margin-top:4px;font-size:11px;color:var(--mid);line-height:1.5;text-align:left;background:#F3F0E9;border:1px solid #E7E2D7;border-radius:12px;padding:8px 10px}
.mode-info-box.open{display:block}
/* Mobile: stacked row layout with smaller emoji on left */
@media(max-width:480px){
  .mode-grid{display:flex;flex-direction:column;gap:8px}
  .mode-card{flex-direction:column;align-items:stretch;text-align:left;padding:12px 14px;gap:8px}
  .mode-card-top{flex-direction:row;align-items:center;gap:13px}
  .mode-card .me{font-size:26px;width:32px;flex-shrink:0;white-space:nowrap;display:flex;align-items:center;justify-content:center}
  .mode-card-check{position:static;flex-shrink:0}
  .mode-info-btn{align-self:center}
  .mode-card .ml{font-size:14px}
  .mode-card .ms{font-size:12px}
}
/* Welcome */
.hero{text-align:center;padding:10px 0 6px}
.hero .big-e{font-size:60px;display:block;margin-bottom:10px;animation:bounce 2s ease-in-out infinite}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.hero h1{font-size:26px;font-weight:900;background:linear-gradient(135deg,var(--lavender),var(--coral));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:8px}
.hero p{font-size:14px;color:var(--mid);line-height:1.6;max-width:380px;margin:0 auto 16px}
.pills{display:flex;flex-wrap:wrap;gap:6px;justify-content:center;margin-bottom:18px}
.pill{background:var(--light);border-radius:999px;padding:5px 11px;font-size:12px;font-weight:600;color:var(--mid)}
/* Country row */
.country-row{display:flex;gap:8px;margin-bottom:10px}
.country-btn{flex:1;border:2px solid #E8E4F0;border-radius:14px;padding:12px 10px;text-align:center;cursor:pointer;transition:all .2s;background:var(--light);font-size:20px;font-weight:700}
.country-btn span{display:block;font-size:12px;font-weight:700;color:var(--mid);margin-top:4px}
.country-btn.sel{border-color:var(--lavender);background:white;box-shadow:0 0 0 3px color-mix(in srgb,var(--lavender) 15%,transparent)}
/* Industry */
.industry-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:8px;margin-bottom:14px}
.ind-card{border:2px solid #E8E4F0;border-radius:14px;padding:10px 8px;text-align:center;cursor:pointer;transition:all .2s;background:var(--light)}
.ind-card:hover{border-color:var(--lavender);background:white;transform:translateY(-2px)}
.ind-card.sel{border-color:var(--lavender);background:white;box-shadow:0 0 0 3px color-mix(in srgb,var(--lavender) 15%,transparent)}
.ind-card .ie{font-size:24px;margin-bottom:3px}
.ind-card .il{font-size:11px;font-weight:700;color:var(--dark);line-height:1.2}
/* Hours preview */
.hrs-prev{background:var(--light);border-radius:14px;padding:12px;margin:12px 0;display:flex;gap:8px;flex-wrap:wrap}
.hp-item{flex:1;text-align:center;min-width:70px}
.hp-label{font-size:10px;text-transform:uppercase;font-weight:700;color:var(--lavender);opacity:.75;letter-spacing:1px;margin-bottom:2px}
.hp-val{font-size:24px;font-weight:900;color:var(--lavender)}
/* Stat grid */
.stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:14px}
.stat-box{background:var(--light);border-radius:14px;padding:12px 14px;text-align:center}
.stat-box .sl{font-family:var(--fs);font-size:11px;color:var(--mid);font-weight:700;letter-spacing:1.2px;text-transform:uppercase;margin-bottom:3px}
.stat-box .sv{font-size:17px;font-weight:800;color:var(--lavender)}
/* Product list */
.prod-list{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}
.prod-item{background:#fff;border-radius:14px;padding:12px 14px;display:flex;justify-content:space-between;align-items:center;cursor:pointer;transition:all .2s;border:1.5px solid #E9E7E0}
.prod-item:hover{border-color:var(--lavender);background:#fff}
.prod-item .pn{font-weight:700;font-size:14px;color:var(--dark)}
.prod-item .ps{font-size:11px;color:var(--mid);margin-top:2px}
.prod-form{background:var(--light);border-radius:18px;padding:16px;margin-bottom:14px}
.pf-badge{background:var(--light);border-radius:10px;padding:8px 14px;display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;border:1.5px solid var(--lavender)}
.pf-section{border-radius:12px;overflow:hidden;margin-bottom:8px;border:1.5px solid rgba(38,37,30,0.08)}
.pf-sec-hd{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;background:var(--light);cursor:pointer;user-select:none;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:1px;color:var(--mid);transition:background .15s}
.pf-sec-hd:hover{background:color-mix(in srgb,var(--lavender) 12%,white)}
.pf-chevron{display:inline-block;margin-right:6px;font-style:normal;font-size:10px}
.pf-sec-bd{padding:12px 14px;background:white}
.pf-subtotal{background:var(--lavender);color:white;border-radius:20px;padding:2px 10px;font-size:11px;font-weight:700;letter-spacing:0;text-transform:none}
.prod-form-title{font-weight:700;font-size:15px;color:var(--dark);margin-bottom:12px}
.cost-prev{background:color-mix(in srgb,var(--lavender) 12%,#fff);border-radius:14px;padding:14px 16px;border:none;margin-top:12px}
.cost-prev-title{font-size:11px;font-weight:700;color:var(--lavender);letter-spacing:1px;text-transform:uppercase;margin-bottom:8px}
.cost-prev-items{display:flex;gap:14px;flex-wrap:wrap}
.cp-item{display:flex;flex-direction:column;justify-content:space-between}
.cp-item .cpl{font-size:11px;color:var(--mid)}
.cp-item .cpv{font-weight:800;font-size:14px;margin-top:auto}
.cp-item.tot .cpv{font-size:16px;color:var(--lavender)}
/* Formula hint */
.formula-hint{font-size:11px;color:var(--lavender);font-weight:600;margin-top:3px;opacity:.8}
/* Pricing flow — vertical "formula ledger" list, matching mockup step 5 */
.price-strip{border:1px solid #EFEDE8;border-radius:18px;overflow:hidden;margin-bottom:16px}
.ps-hd{font-family:var(--fs);font-size:10px;font-weight:700;color:#9A978F;padding:13px 16px 11px;background:#FAFAFA;border-bottom:1px solid #EFEDE8;text-transform:uppercase;letter-spacing:1px}
.ps-rows{padding:6px 16px 10px}
.ps-card{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid #F4F2EC}
.ps-card:last-child{border-bottom:none}
.ps-card-label{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:#1A1A1A;line-height:1.3}
.ps-card-dot{width:9px;height:9px;border-radius:3px;flex-shrink:0}
.ps-card-sub{font-size:12px;font-weight:500;opacity:.6;margin-left:4px}
.ps-card-val{font-size:15px;font-weight:700;flex-shrink:0;white-space:nowrap}
/* Profit group — Net Profit + Safety + Growth, bracketed as one section */
.ps-profit-group{padding:2px 0 0}
.ps-profit-group-lbl{font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:#9A978F;padding:9px 0 3px}
.ps-profit-group-inner .ps-card{padding:8px 0}
/* "= Wholesale" / "= Retail" / "Customer pays" bands */
.ps-band{display:flex;align-items:center;justify-content:space-between;padding:13px 16px;border-top:1px solid #EFEDE8;border-bottom:1px solid #EFEDE8}
.ps-band-label{display:flex;align-items:center;gap:8px;font-size:14px;font-weight:800}
.ps-band-sub{font-weight:500;opacity:.7;font-size:11px}
.ps-band-val{font-size:18px;font-weight:800}
.ps-op-row{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;font-size:12.5px;color:#6B6B6B}
.ps-final{display:flex;align-items:center;justify-content:space-between;padding:16px}
.ps-final-label{font-size:14px;font-weight:800}
.ps-final-val{font-size:28px;font-weight:800;letter-spacing:-1.2px}
/* Pricing page slider section labels */
.pricing-sec-lbl{font-family:var(--fs);font-size:10px;font-weight:700;letter-spacing:1.8px;text-transform:uppercase;margin:20px 0 8px;display:flex;align-items:center;gap:8px;padding-left:2px}
.pricing-sec-lbl::after{content:'';flex:1;height:1px;background:#E8E4F0}
/* pc-* colors are driven by PRICE_COLORS inline styles in s4-pricing.js — do not add color rules here */
/* Slider explanation */
.sl-explain{font-size:12.5px;color:#5C5A54;margin-top:8px;margin-bottom:0;line-height:1.5}
.sl-explain strong{color:#1A1A1A}
.baseline-note{background:#F3F0E9;border:1px solid #E7E2D7;border-radius:16px;padding:14px;font-size:13px;color:#1A1A1A;margin-bottom:16px;display:flex;gap:8px;align-items:flex-start}
.baseline-note>span:first-child{flex-shrink:0;width:20px;text-align:center}
.baseline-note>span:last-child{flex:1;min-width:0}
.prefill-banner .pf-row{display:flex;gap:10px;align-items:flex-start;margin-bottom:10px}
.prefill-banner .pf-row>span:first-child{flex-shrink:0;width:32px;text-align:center}
.prefill-banner .pf-row>span:last-child{flex:1;min-width:0}
.lrNote-row{display:flex;align-items:flex-start;gap:8px}
.lrNote-row>svg{flex-shrink:0;margin-top:1px}
.lrNote-row>span:last-child{flex:1;min-width:0}
/* Sliders */
.sl-field{margin-bottom:16px;padding:16px;border-radius:20px}
.sl-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.sl-label{font-size:14px;font-weight:700;color:#1A1A1A}
/* --pc-main / --pc-light are set per-slider by mkSl() from PRICE_COLORS; fallback to step theme */
.sl-val{background:var(--pc-main,var(--lavender));color:white;border-radius:999px;padding:5px 16px;font-size:13px;font-weight:700;min-width:52px;cursor:text;display:inline-flex;align-items:center;justify-content:center;gap:1px;border:2px solid transparent;transition:background .18s,border-color .18s,box-shadow .18s,transform .18s;font-variant-numeric:tabular-nums}
.sl-val:hover{background:color-mix(in srgb,var(--pc-main,var(--lavender)) 82%,white);border-color:rgba(255,255,255,.7);box-shadow:0 2px 8px color-mix(in srgb,var(--pc-main,var(--lavender)) 35%,transparent);transform:translateY(-1px)}
.sl-val:focus-within{background:var(--pc-light,var(--light));border-color:var(--pc-main,var(--lavender));box-shadow:0 0 0 3px color-mix(in srgb,var(--pc-main,var(--lavender)) 18%,transparent);transform:none}
.sl-val:focus-within .sl-num{color:var(--pc-main,var(--lavender))}
.sl-val-wrap{display:inline-flex;align-items:center;gap:5px}
.sl-num{background:transparent;color:white;border:none;outline:none;font-size:13px;font-weight:700;text-align:center;-moz-appearance:textfield;padding:0;margin:0;cursor:text;font-variant-numeric:tabular-nums}
.sl-num::-webkit-inner-spin-button,.sl-num::-webkit-outer-spin-button{-webkit-appearance:none}
input[type=range]{width:100%;-webkit-appearance:none;height:6px;border-radius:999px;background:linear-gradient(to right,var(--pc-main,var(--lavender)) var(--fill,0%),rgba(0,0,0,0.12) var(--fill,0%));outline:none;cursor:pointer}
input[type=range]::-moz-range-track{background:transparent}
input[type=range]::-moz-range-progress{background:var(--pc-main,var(--lavender));height:6px;border-radius:999px}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--pc-main,var(--lavender));cursor:pointer;box-shadow:0 2px 8px color-mix(in srgb,var(--pc-main,var(--lavender)) 45%,transparent)}
/* Product modal */
.prod-modal-overlay{position:fixed;inset:0;z-index:1000;background:rgba(0,0,0,.45);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:20px}
.prod-modal-box{background:white;border-radius:18px;max-width:520px;width:100%;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 60px rgba(0,0,0,.3)}
.prod-modal-hd{display:flex;align-items:center;justify-content:space-between;padding:16px 20px 12px;border-bottom:1px solid #E8E4F0;flex-shrink:0}
.prod-modal-title{font-weight:800;font-size:16px;color:var(--dark)}
.prod-modal-close{border:none;background:var(--light);border-radius:8px;cursor:pointer;font-size:14px;font-weight:700;color:var(--mid);padding:5px 10px;transition:all .15s}
.prod-modal-close:hover{background:var(--lavender);color:white}
.prod-modal-body{overflow-y:auto;padding:16px 20px;flex:1}
/* Summary — split-band card */
.summary-card{border:1.5px solid #E8E4F0;border-radius:14px;padding:0;margin-bottom:10px;overflow:visible;transition:border-color .2s;position:relative}
.summary-card:hover{border-color:var(--lavender)}
/* Zebra: odd = white, even = light grey */
.summary-card:nth-child(odd){background:white}
.summary-card:nth-child(even){background:#F9FAFB}
.sc-name{font-weight:800;font-size:14px;color:var(--dark)}
.sc-cost{font-size:11px;color:var(--mid)}
/* sc-main wrappers: transparent in CSS grid on desktop, real containers on mobile */
.sc-main-top{display:contents}
.sc-main-prices{display:contents}
/* Top band inherits card background (transparent) */
.sc-main{display:grid;grid-template-columns:30px 1fr minmax(90px,144px) minmax(90px,144px);align-items:center;gap:8px;padding:8px 12px 6px;border-radius:12px 12px 0 0;background:transparent}
.sc-icon{font-size:28px;width:28px;height:28px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.sc-icon img{width:28px!important;height:28px!important;object-fit:cover;border-radius:5px}
.sc-col-lbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px;display:flex;align-items:center;justify-content:center;gap:3px}
.sc-ws-col .sc-col-lbl{color:var(--lavender)}
.sc-rt-col .sc-col-lbl{color:var(--lavender)}
.sc-ws-pill{font-size:15px;font-weight:900;color:var(--lavender);background:var(--light);border-radius:7px;padding:4px 10px;text-align:center}
input.sc-rt-input{font-family:inherit;font-size:15px;font-weight:900;color:white;background:var(--lavender);border-radius:7px;padding:4px 10px;border:2px solid transparent;text-align:center;width:100%;cursor:text;outline:none;transition:all .18s}
input.sc-rt-input:hover{background:color-mix(in srgb,var(--lavender) 80%,white);border-style:solid;border-color:white;box-shadow:0 2px 10px color-mix(in srgb,var(--lavender) 40%,transparent);transform:translateY(-1px)}
input.sc-rt-input:focus{background:var(--light);color:var(--lavender);border-style:solid;border-color:var(--lavender);box-shadow:0 0 0 3px color-mix(in srgb,var(--lavender) 20%,transparent);transform:none}
/* Slider band: neutral grey, NOT purple — purple only on thumb + badges */
.sc-slider-band{display:flex;align-items:center;gap:8px;padding:5px 12px 7px;background:#F3F4F6;border-top:1px solid #E8E4F0;border-radius:0 0 12px 12px}
.sc-slider-band input[type=range]{flex:1}
.sc-side-wrap{display:flex;flex-direction:column;align-items:center;flex-shrink:0;gap:2px}
.sc-side-lbl{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;color:#6B7280;opacity:.9}
.sc-side-badge{font-size:13px;font-weight:800;color:var(--lavender);white-space:nowrap}
.sc-side-badge.negative{color:#DC2626}
/* Export */
.export-btn{background:linear-gradient(135deg,#f5576c,#f093fb);color:white;border:none;border-radius:14px;font-size:14px;font-weight:700;cursor:pointer;padding:13px 24px;width:100%;margin-top:10px;transition:all .2s;display:flex;align-items:center;justify-content:center;gap:8px;box-shadow:0 4px 18px rgba(245,87,108,.35)}
.export-btn:hover{transform:translateY(-2px)}
#confetti-canvas{position:fixed;top:0;left:0;width:100%;height:100%;pointer-events:none;z-index:999}
/* HIGH: respect reduced-motion preference for blob drift + card slideUp */
@media(prefers-reduced-motion:reduce){
  .blob{animation:none}
  @keyframes slideUp{from{opacity:0}to{opacity:1}}
  .hero .big-e{animation:none}
  *{transition-duration:.01ms!important;animation-duration:.01ms!important}
}
@media(max-width:480px){
  /* Layout */
  .fg{grid-template-columns:1fr}
  .fg.t{grid-template-columns:1fr 1fr}
  .card{padding:20px 16px}
  .industry-grid{grid-template-columns:repeat(3,1fr)}
  .stat-grid{grid-template-columns:1fr 1fr}
  .mode-grid{gap:8px}
  /* Summary card: flex column so name gets its own full-width top row */
  .sc-main{display:flex!important;flex-direction:column;align-items:stretch;gap:4px;padding:8px 10px 6px}
  .sc-main-top{display:flex;align-items:center;gap:8px}
  .sc-main-top .sc-icon{font-size:24px;width:26px;height:26px;flex-shrink:0}
  .sc-name-col{flex:1;display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0}
  .sc-name-col .sc-name{flex:1;min-width:0}
  .sc-name-col .sc-cost{flex-shrink:0;white-space:nowrap}
  .sc-main-prices{display:flex;align-items:center;gap:6px}
  .sc-main-prices .sc-ws-col,.sc-main-prices .sc-rt-col{flex:1}
  .sc-ws-pill,.sc-rt-col{font-size:13px}
  input.sc-rt-input{font-size:13px;width:100%}
  /* Hide duplicate button text on mobile — icon only */
  .dup-label{display:none}
  /* Product filter: two dropdowns side-by-side, 50% each */
  .prod-filter{flex-direction:row;flex-wrap:nowrap;gap:6px}
  .prod-filter select{flex:1 1 0;min-width:0;width:50%}
  /* Product modal: shrink for keyboard visibility */
  .prod-modal-overlay{padding:10px}
  .prod-modal-box{max-height:88vh;border-radius:14px}
  /* Slider thumb: bigger touch target */
  input[type=range]::-webkit-slider-thumb{width:22px;height:22px}
  /* iOS input zoom fix: font-size < 16px triggers auto-zoom on Safari */
  .iw input,.iw select{font-size:16px}
}
/* Extra-small screens (360px and below) */
@media(max-width:360px){
  .card{padding:16px 14px}
  .sc-main{padding:6px 8px}
  .sc-ws-pill,.sc-rt-col{font-size:11px}
  input.sc-rt-input{font-size:11px}
  /* Prevent tooltip box from clipping off the right edge */
  .tt-box{max-width:calc(100vw - 40px)}
}
/* Price column labels: full text by default, short on very compact screens */
.price-lbl-short{display:none}
@media(max-width:400px){.price-lbl-full{display:none}.price-lbl-short{display:inline}}
/* Export button label: full text by default, short on mobile */
.export-lbl-short{display:none}
@media(max-width:480px){.export-lbl-full{display:none!important}.export-lbl-short{display:inline!important}.share-lbl-full{display:none}}
/* Mode dot: tiny colored circle replacing badge text on mobile */
.mode-dot{display:none;width:9px;height:9px;border-radius:50%;flex-shrink:0;vertical-align:middle;margin-left:5px;line-height:1;position:relative;top:-1px}
.self-dot{background:#22C55E}
.out-dot{background:#3B82F6}
/* Summary help box: mobile-only price explanation + legend */
.sum-help-box{display:none;margin-bottom:10px;padding:14px;background:#F3F0E9;border-radius:16px;border:1px solid #E7E2D7}
.sum-help-tips{font-size:11px;color:var(--mid);line-height:1.6}
.sum-legend{display:flex;gap:14px;margin-top:6px}
.sum-legend-item{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;color:var(--mid)}
.sum-legend-item .mode-dot{display:inline-block;margin-left:0}
@media(max-width:480px){
  .sc-col-tip{display:none}
  .sc-mode-badge{display:none}
  .mode-dot{display:inline-block}
  .sum-help-box{display:block}
}
/* Currency picker — same pill recipe as EN/ES and Sign In */
.currency-sel{border:1px solid #EAE8E2;border-radius:999px;padding:8px 26px 8px 12px;font-size:12px;font-weight:600;cursor:pointer;background-color:#fff;color:#1A1A1A;outline:none;-webkit-appearance:none;appearance:none;line-height:1;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='8' height='5' viewBox='0 0 8 5'%3E%3Cpath d='M0 0l4 5 4-5z' fill='%239A978F'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center}
.currency-sel option{color:var(--dark);background:white}
/* Country/currency message */
.currency-msg{background:#F3F0E9;border:1px solid #E7E2D7;border-radius:16px;padding:14px;font-size:13px;color:#1A1A1A;display:flex;gap:8px;align-items:flex-start;margin-top:8px;animation:fadeIn .3s ease;line-height:1.5}
/* Category section labels in product list */
.cat-section-label{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--lavender);margin:14px 0 8px;display:flex;align-items:center;gap:8px}
.cat-section-label::after{content:'';flex:1;height:1px;background:linear-gradient(to right,#E8E4F0,transparent)}
/* Emoji picker */
.emoji-picker-wrap{max-height:78px;overflow-y:auto;border:1.5px solid #E8E4F0;border-radius:10px;padding:6px 8px;background:white;margin-bottom:8px;scrollbar-width:thin}
.sum-cat-header{font-size:11px;font-weight:700;letter-spacing:1.5px;text-transform:uppercase;color:var(--lavender);margin:16px 0 6px;padding:6px 12px;background:var(--light);border-radius:8px;display:flex;align-items:center;justify-content:space-between}
.sum-cat-toggle{cursor:pointer;user-select:none}
.sum-cat-toggle:hover{background:#EEF0FD;color:var(--lavender)}
.sum-cat-chevron{font-size:9px;opacity:.6;margin-left:6px}
.emoji-cat-lbl{font-size:10px;font-weight:700;color:var(--lavender);text-transform:uppercase;letter-spacing:.5px;margin:5px 0 3px;display:block}
.emoji-grid{display:flex;flex-wrap:wrap;gap:3px;margin-bottom:2px}
/* HIGH: emoji buttons boosted to 36px to approach 44px touch target */
.emoji-btn{font-size:18px;width:36px;height:36px;border:2px solid transparent;border-radius:7px;background:transparent;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;padding:0;line-height:1}
.emoji-btn:hover,.emoji-btn.emo-sel{border-color:var(--lavender);background:#EEF0FD}
.emoji-btn:focus-visible{outline:2px solid var(--lavender);outline-offset:1px}
/* pc-growth / pc-bank / pc-iva colors driven by PRICE_COLORS inline styles in s4-pricing.js */
/* Product filter bar */
.prod-filter{display:flex;gap:8px;margin-bottom:10px;flex-wrap:wrap;align-items:center}
.prod-filter select{font-size:12px;font-weight:600;padding:5px 10px;border:1.5px solid #E4E1D9;border-radius:8px;background:#fff;color:var(--dark);cursor:pointer;outline:none;transition:border-color .2s}
.prod-filter select:focus{border-color:var(--lavender)}

/* ── Landing Page (Step 0) ─────────────────────────────────────── */
body.landing{background:#FAFAFA;font-family:var(--ff)}
body.landing .blob{display:none}
body.landing .currency-sel option{color:#1A1A1A}

.landing-wrap{padding:0}
.landing-hero{margin-bottom:32px;padding-top:8px}
.landing-headline{font-family:var(--ff);font-weight:800;font-size:clamp(40px,10vw,52px);line-height:.9;color:#1A1A1A;letter-spacing:-2.4px;margin-bottom:14px}
.landing-headline span{color:#1F2ADE}
.landing-subline{font-family:var(--ff);font-style:normal;font-weight:400;font-size:16px;color:#5C5A54;line-height:1.45}

.landing-section{margin-bottom:24px}
.landing-lbl{font-family:var(--fs);font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:#9A978F;margin-bottom:10px;display:flex;align-items:center;gap:8px}
.landing-lbl::after{content:'';flex:1;height:1px;background:#E6E4DE}

.landing-input{background:#FAFAFA!important;border:1px solid #EAE8E2!important;font-size:16px!important;border-radius:14px!important;padding:13px 14px!important;transition:all .2s!important}
.landing-input:focus{border-color:#1A1A1A!important;box-shadow:none!important;background:#FAFAFA!important}

body.landing input,body.landing select,body.landing button{font-family:var(--ff)}
body.landing .btn-red{font-family:var(--ff)}
body.landing .iw select{background-color:white;border-color:#EAE8E2}

body.landing .ind-card{background:white;border-color:#EAE8E2}
body.landing .ind-card:hover{border-color:#1F2ADE;transform:translateY(-2px)}
body.landing .ind-card.sel{border-color:#1F2ADE;background:color-mix(in srgb,#1F2ADE 9%,#fff);box-shadow:none}

body.landing .country-btn{background:white;border-color:#EAE8E2}
body.landing .country-btn.sel{border-color:#1F2ADE;background:color-mix(in srgb,#1F2ADE 9%,#fff);box-shadow:none}

body.landing .mode-card{background:white;border-color:#EAE8E2}
body.landing .mode-card:hover{border-color:#1F2ADE}
body.landing .mode-card.sel{border-color:#1F2ADE;background:color-mix(in srgb,#1F2ADE 9%,#fff);box-shadow:none}


.btn-red{background:#1F2ADE;color:white;flex:1;box-shadow:none;font-family:var(--ff);font-weight:700;font-size:17px;letter-spacing:0;padding:17px 20px!important;border-radius:14px;border:none}
.btn-red:hover{transform:translateY(-1px);box-shadow:0 8px 24px rgba(31,42,222,.25)}
.btn-red:disabled{opacity:.32;cursor:not-allowed;transform:none}

.landing-footnote{font-family:var(--ff);font-style:normal;font-weight:500;font-size:14px;color:#9A978F;text-align:center;margin-top:18px;padding-top:18px;border-top:1px solid #E6E4DE}
/* Welcome back banner buttons */
.resume-btn-primary{padding:9px 16px;font-size:14px;font-family:var(--ff);font-weight:700;background:#1A1A1A;color:white;border:none;border-radius:10px;cursor:pointer;transition:opacity .2s}
.resume-btn-primary:hover{opacity:.8}
.resume-btn-ghost{padding:9px 16px;font-size:14px;font-family:var(--ff);font-weight:600;background:transparent;color:rgba(28,28,28,0.5);border:1.5px solid #EAE8E2;border-radius:10px;cursor:pointer}
.resume-btn-ghost:hover{color:#1A1A1A}
.palette-preview{display:flex;align-items:center;justify-content:center;gap:6px;flex-wrap:wrap;padding:14px 0 4px}
.palette-chip{display:flex;align-items:center;gap:6px;font-family:var(--ff);font-size:11px;font-weight:600;color:#8C8070;letter-spacing:.3px}
.palette-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.palette-arrow{font-size:11px;color:#C8BEB4;margin:0 2px}

/* ── Inner Steps: Typography + Theme ─────────────────────────────────────── */
body:not(.landing){font-family:var(--ff);background:#FAFAFA}
body:not(.landing) .blob{display:none}
body:not(.landing) .currency-sel option{color:#1A1A1A}
body:not(.landing) input,body:not(.landing) select,body:not(.landing) button,body:not(.landing) .btn{font-family:var(--ff)}
/* Card */
body:not(.landing) .card{background:#fff;border:1px solid #EAE8E2;box-shadow:0 20px 60px rgba(20,20,35,.08);border-radius:20px;padding:22px 20px}
body:not(.landing) .card-title{font-family:var(--ff);font-weight:800;letter-spacing:-1.4px;color:#1A1A1A;font-size:30px;line-height:1}
body:not(.landing) .card-sub{color:#6B6B6B;font-size:15px}
/* Section labels — step-colored */
body:not(.landing) .sec{color:var(--lavender);letter-spacing:1.5px;font-weight:700}
body:not(.landing) .sec::after{background:linear-gradient(to right,var(--lavender),transparent);opacity:.25}
/* Step label */
body:not(.landing) .step-label{color:var(--lavender);letter-spacing:2px}
/* Field labels */
body:not(.landing) .field label{color:#1A1A1A;font-size:13px;font-weight:600}
/* Inputs — warm fill, step-color focus */
body:not(.landing) .iw input,body:not(.landing) .iw select{background:#FAFAFA;border:1px solid #EAE8E2;color:#1A1A1A;font-weight:500;border-radius:14px}
body:not(.landing) .iw input:focus,body:not(.landing) .iw select:focus{border-color:#1A1A1A;box-shadow:none;background:#FAFAFA}
body:not(.landing) .iw .pfx,body:not(.landing) .iw .sfx{color:#9A978F;opacity:1}
/* Tooltip */
body:not(.landing) .tt-q{background:var(--brand-blue-bg);color:var(--brand-blue);opacity:.85}
body:not(.landing) .tt-box{background:#1A1A1A}
/* Primary button — solid step color */
body:not(.landing) .bp{font-family:var(--ff);font-weight:700;font-size:16px;background:var(--lavender);color:white;box-shadow:none;border-radius:14px}
body:not(.landing) .bp:hover{transform:translateY(-1px);box-shadow:0 8px 24px color-mix(in srgb,var(--lavender) 35%,transparent);background:var(--lavender)}
body:not(.landing) .bp:disabled{opacity:.35;cursor:not-allowed;transform:none}
/* Back / ghost button */
body:not(.landing) .bg{background:#fff;color:#5C5A54;border-radius:14px;border:1px solid #D9D6CE}
body:not(.landing) .bg:hover{background:#F4F2EC;color:#1A1A1A}
/* Mint/pre-fill button — step light bg */
body:not(.landing) .bm{background:var(--lavender);color:white;box-shadow:none;border-radius:14px}
body:not(.landing) .bm:hover{transform:translateY(-1px);box-shadow:0 8px 22px color-mix(in srgb,var(--lavender) 35%,transparent)}
@keyframes prefill-pulse-btn{
  0%,100%{transform:scale(1);box-shadow:0 4px 14px rgba(0,0,0,.15);filter:brightness(1)}
  50%{transform:scale(1.07);box-shadow:0 10px 30px rgba(0,0,0,.25);filter:brightness(1.12)}
}
body:not(.landing) button.prefill-breathe{animation:prefill-pulse-btn 1.6s ease-in-out infinite}
/* Pre-fill banner */
/* Flat tinted box, no accent border — matches mockup's prefill banner exactly */
.prefill-banner{background:color-mix(in srgb,var(--lavender) 9%,#fff);border:none;border-radius:16px;padding:15px;font-size:13px;color:#1A1A1A;margin:16px 0 14px;line-height:1.5}

/* ── Per-page theme accent colors ────────────────────────────────────────────
   Each category page keeps ONE theme color for its buttons/labels/tooltips,
   matching the mockup. This is set via theme-* classes (computed from the
   step's function name in ui.js render()) rather than step INDEX, since step
   index shifts between solo/hybrid/outsource modes but category doesn't.    */
body.theme-blue{--lavender:#1F2ADE;--light:color-mix(in srgb,#1F2ADE 9%,#fff)}
body.theme-orange{--lavender:#FF4400;--light:color-mix(in srgb,#FF4400 12%,#fff)}
/* ── Rate / Volume step colour hierarchy ──────────────────────────────────────
   Tier 1 (orange) = hero number input + slider + primary action buttons — inherited.
   Tier 2 (neutral cream) = supporting stat facts, no phase colour competing.
   .tip / .lrNote-good are handled by the universal callout system now (INFO
   #ECEDF1, RESULT magenta) — no per-theme override needed for them.        */
body.theme-orange .stat-box{background:#F6F4EF;border:1px solid #EDEBE4}
body.theme-orange .stat-box .sl{color:#9A978F}
body.theme-orange .stat-box .sv{color:#1A1A1A}
/* Break-even is the hero insight on this page — keep it orange */
body.theme-orange .stat-box.stat-breakeven{background:color-mix(in srgb,#FF4400 6%,#fff);border-color:color-mix(in srgb,#FF4400 20%,#fff)}
body.theme-orange .stat-box.stat-breakeven .sl{color:#FF4400;opacity:.7}
body.theme-orange .stat-box.stat-breakeven .sv{color:#FF4400;font-size:20px}
/* Hero rate input: always show orange border so it reads as the primary control */
body.theme-orange #lr{border-color:#FF4400;font-size:24px;font-weight:800;letter-spacing:-0.5px}
/* Green theme: #0A8B57 (dark) drives text/labels/borders for contrast on white,
   but the mockup's solid CTA buttons use bright #00C775 bg + dark #06301F text —
   not the generic var(--lavender) bg + white text pattern other themes use. */
body.theme-green{--lavender:#0A8B57;--light:color-mix(in srgb,#00DF82 12%,#fff)}
body.theme-green .bp,body.theme-green .bm,body.theme-green .bp:hover,body.theme-green .bm:hover{background:#00C775;color:#06301F}
body.theme-magenta{--lavender:#D4396F;--light:color-mix(in srgb,#D4396F 10%,#fff)}

/* ── Progress bar segment color: fixed per dot position, independent of the
   active page's theme color (mockup: dot 2 is pink even on the orange-themed
   "Time off" page). Sequence cycles through the mockup's 6-segment palette;
   shape/opacity rules live earlier alongside .prog-strip/.prog-bars. */
.prog-dot{background:var(--dot-c,#D1D5DB)}

/* ── Market Research ──────────────────────────────────────────────────────── */
.market-chip{border:2px solid #E8E4F0;border-radius:20px;background:white;color:var(--mid);font-size:12px;font-weight:700;padding:6px 14px;cursor:pointer;transition:all .15s}
.market-chip.sel{border-color:var(--lavender);background:var(--light);color:var(--dark)}
.market-panel{background:white;border:1.5px solid #E8E4F0;border-radius:16px;padding:16px;margin-bottom:8px}
.market-panel-header{display:flex;align-items:flex-start;gap:10px;margin-bottom:12px}
.market-panel-icon{font-size:22px;flex-shrink:0;margin-top:2px}
.market-panel-title{font-size:15px;font-weight:800;color:var(--dark)}
.market-panel-sub{font-size:12px;color:var(--mid);margin-top:1px}
.market-locked{border-style:dashed}
.market-locked-body{text-align:center;padding:16px 0 6px}
.market-loading{display:flex;flex-direction:column;align-items:center;padding:24px 0}
.market-spinner{width:36px;height:36px;border:3px solid #EEF0FD;border-top-color:var(--lavender);border-radius:50%;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.market-vibe-confirmed{font-size:13px;color:var(--mid);background:var(--light);border-radius:10px;padding:9px 12px;margin-bottom:12px}
.market-pos-bar-wrap{margin-bottom:14px}
.market-pos-bar{position:relative;height:8px;background:#EEF0FD;border-radius:99px;margin:8px 0 56px}
.market-pos-fill{height:100%;background:linear-gradient(to right,#00DF82,#1F2ADE);border-radius:99px}
.market-pos-dot{position:absolute;top:50%;transform:translate(-50%,-50%);width:14px;height:14px;background:var(--lavender);border:2px solid white;border-radius:50%;box-shadow:0 1px 4px rgba(0,0,0,.15);z-index:1;cursor:pointer}
.market-pos-dot:hover{z-index:10}
.market-pos-label{position:absolute;top:calc(100% + 8px);left:50%;transform:translateX(-50%);background:white;border:1.5px solid #E8E4F0;color:var(--dark);font-size:10px;font-weight:600;border-radius:8px;padding:4px 8px;white-space:nowrap;text-align:center;line-height:1.4;box-shadow:0 1px 4px rgba(0,0,0,.08)}
.market-pos-label::before{content:'';position:absolute;bottom:100%;left:50%;transform:translateX(-50%);border:4px solid transparent;border-bottom-color:#E8E4F0}
.market-pills{display:flex;flex-direction:column;gap:6px;margin-bottom:4px}
.market-pill{background:var(--light);border-radius:10px;padding:9px 12px;font-size:13px;color:#3B0764;font-weight:500;line-height:1.4}
.market-comp-row{display:flex;align-items:center;gap:10px;padding:9px 12px;background:#FAFAFA;border-radius:10px;border:1px solid #EEF0FD}
/* Vibe picker */
.vibe-picker{margin-bottom:4px}
.vibe-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}
.vibe-tile{border:2px solid #E8E4F0;border-radius:12px;background:white;cursor:pointer;padding:10px 6px;display:flex;flex-direction:column;align-items:center;gap:4px;transition:all .15s}
.vibe-tile:hover{border-color:var(--lavender);background:var(--light)}
.vibe-tile.sel{border-color:var(--lavender);background:var(--light);box-shadow:0 0 0 3px color-mix(in srgb,var(--lavender) 20%,transparent)}
.vibe-emoji{font-size:22px}
.vibe-label{font-size:11px;font-weight:700;color:var(--mid);text-align:center;line-height:1.2}

/* ── Spreadsheet Import Modal ─────────────────────────────────────────────── */
.import-overlay{position:fixed;inset:0;z-index:2000;background:rgba(0,0,0,.5);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px}
.import-box{background:white;border-radius:20px;width:100%;max-width:520px;max-height:88vh;display:flex;flex-direction:column;box-shadow:0 24px 64px rgba(0,0,0,.28);overflow:hidden}
.import-hd{display:flex;align-items:center;gap:10px;padding:16px 20px 13px;border-bottom:1.5px solid #EEF0FD;flex-shrink:0}
.import-title{font-weight:800;font-size:16px;color:#1A1A1A;flex:1}
.import-close{border:none;background:#EEF0FD;border-radius:8px;cursor:pointer;font-size:14px;font-weight:700;color:#4A4A6A;padding:5px 10px;transition:all .15s;flex-shrink:0}
.import-close:hover{background:#161FB5;color:white}
.import-body{overflow-y:auto;padding:18px 20px 20px;flex:1}
.import-sub{font-size:13px;color:#4A4A6A;line-height:1.6;margin-bottom:16px}
/* Drop zone */
.import-drop{border:2px dashed #B9C0F5;border-radius:16px;padding:28px 20px;text-align:center;background:#FAFAFA;cursor:default;transition:all .2s}
.import-drop.drag-active{border-color:#161FB5;background:#EEF0FD;transform:scale(1.01)}
.import-browse{display:inline-flex;align-items:center;gap:6px;background:#1F2ADE;color:white;border-radius:10px;padding:9px 18px;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s}
.import-browse:hover{background:#161FB5;transform:translateY(-1px)}
.import-privacy{margin-top:14px;font-size:12px;color:#6B7280;background:#F9FAFB;border-radius:10px;padding:9px 13px;line-height:1.5}
.import-err{background:#FEF2F2;border:1.5px solid #FECACA;border-radius:10px;padding:10px 14px;font-size:13px;color:#DC2626;margin-top:12px}
/* Tab selector */
.import-tabs-list{display:flex;flex-direction:column;gap:8px}
.import-tab-row{display:flex;align-items:center;gap:10px;padding:10px 14px;border:1.5px solid #E8E4F0;border-radius:12px;background:white;cursor:pointer;transition:all .15s}
.import-tab-row:hover{border-color:#1F2ADE;background:#FAFAFA}
.import-tab-row.deselected{opacity:.5;background:#F9FAFB}
.import-tab-row input[type=checkbox]{width:16px;height:16px;accent-color:#1F2ADE;flex-shrink:0;cursor:pointer}
.import-tab-info{flex:1;min-width:0}
.import-tab-name{font-weight:700;font-size:13px;color:#1A1A1A;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.import-tab-meta{font-size:11px;color:#6B7280;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-top:2px}
.import-tab-skip{font-size:10px;font-weight:700;color:#9CA3AF;background:#F3F4F6;border-radius:6px;padding:2px 8px;flex-shrink:0}
/* Review sections */
.import-sec{border:1.5px solid #E8E4F0;border-radius:14px;margin-bottom:12px;overflow:hidden}
.import-sec-hd{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:#FAFAFA;font-size:13px;font-weight:700;color:#1A1A1A;border-bottom:1px solid #EEF0FD}
.import-sec-ct{font-size:11px;font-weight:700;background:#EEF0FD;color:#1F2ADE;border-radius:20px;padding:2px 8px}
.import-sec-bd{padding:12px 14px}
.import-sec-warn .import-sec-hd{background:#FEF9EC;border-bottom-color:#FDE68A;color:#92400E}
.import-sec-warn{border-color:#FDE68A}
/* Products */
.import-prod-row{display:flex;align-items:flex-start;justify-content:space-between;gap:8px;padding:6px 0;border-bottom:1px solid #F9FAFB}
.import-prod-row:last-child{border-bottom:none}
.import-prod-dt{display:flex;flex-wrap:wrap;gap:6px;flex-shrink:0;justify-content:flex-end}
/* Only style direct-child pill spans; nested .icb confidence badges use their own colors */
.import-prod-dt > span{font-size:11px;color:#6B7280;background:#F3F4F6;border-radius:6px;padding:2px 7px;display:flex;align-items:center;gap:3px}
.import-more{font-size:12px;color:#1F2ADE;font-weight:700;padding-top:8px;text-align:center}
/* Costs grid */
.import-costs-grid{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.import-cost-row{display:flex;align-items:center;justify-content:space-between;background:#F9FAFB;border-radius:8px;padding:6px 10px}
.import-cost-lbl{font-size:12px;color:#4A4A6A;font-weight:600}
.import-cost-val{font-size:12px;font-weight:800;color:#1A1A1A;display:flex;align-items:center;gap:4px}
/* Notes */
.import-note-row{font-size:12px;color:#78350F;line-height:1.6;padding:2px 0}
/* Legacy legend rule — overridden by the rule lower down */
/* Blurb */
.import-blurb{background:linear-gradient(135deg,#EEF0FD,#EEF0FD);border-radius:12px;padding:12px 16px;font-size:13px;color:#1F2ADE;font-weight:600;margin-bottom:14px;line-height:1.5}
/* Spinner */
.import-spinner{width:40px;height:40px;border:3px solid #EEF0FD;border-top-color:#1F2ADE;border-radius:50%;animation:spin .8s linear infinite;display:inline-block}
/* Analysis status lines — three visual states */
.import-ast{font-size:13px;font-weight:600;transition:color .4s,opacity .4s}
.import-ast-wait{opacity:.2;color:#9CA3AF}
.import-ast-active{opacity:1;color:#161FB5;animation:ast-breathe 2.2s ease-in-out infinite}
.import-ast-done{opacity:1;color:#059669;animation:none}
@keyframes ast-breathe{0%,100%{opacity:1}50%{opacity:.35}}
/* Confidence badges */
.icb{display:inline-flex;align-items:center;justify-content:center;width:16px;height:16px;border-radius:4px;font-size:10px;font-weight:800;vertical-align:middle;flex-shrink:0}
.icb-high{background:#D1FAE5;color:#065F46}
.icb-medium{background:#FEF9C3;color:#713F12}
.icb-low{background:#FEE2E2;color:#991B1B}
/* Import landing CTA — visible but secondary to the main mode cards */
.import-cta{display:flex;align-items:center;justify-content:center;gap:8px;font-family:var(--ff);font-size:14px;font-weight:700;color:#4A5568;cursor:pointer;background:white;border:2px dashed #C4B8A8;border-radius:12px;padding:14px 20px;width:100%;margin-top:12px;transition:all .2s;box-shadow:0 1px 4px rgba(0,0,0,.06)}
.import-cta:hover,.import-cta:focus-visible{background:#EEF0FD;border-color:#1F2ADE;color:#1F2ADE;box-shadow:0 2px 8px rgba(31,42,222,.12)}
.import-cta:active{transform:scale(.98);box-shadow:none}
.import-signin-hint{font-size:11px;font-weight:600;color:var(--mid);opacity:.75;white-space:nowrap}
@media(max-width:480px){.import-cta{flex-wrap:wrap}.import-signin-hint{flex-basis:100%;text-align:center;white-space:normal}}
/* Review checkbox rows */
.import-check-row{display:flex;align-items:center;gap:8px;padding:9px 14px;border-bottom:1px solid #F3F4F6;cursor:pointer;transition:background .12s;user-select:none;flex-wrap:nowrap}
.import-check-row:last-child{border-bottom:none}
.import-check-row:hover{background:#FAFAFA}
.import-check-row.deselected{opacity:.38}
.import-chk{width:16px;height:16px;accent-color:#161FB5;flex-shrink:0;cursor:pointer}
/* Product name inline (no block) */
.import-prod-nm{font-weight:700;font-size:13px;color:#1A1A1A;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1;min-width:0}
/* Period toggle button */
.import-period-btn{border:1.5px solid #E8E4F0;border-radius:6px;background:white;color:#9CA3AF;font-size:10px;font-weight:700;padding:3px 7px;cursor:pointer;flex-shrink:0;transition:all .15s;white-space:nowrap}
.import-period-btn:hover{border-color:#1F2ADE;color:#161FB5}
.import-period-btn.active{border-color:#1F2ADE;background:#EEF0FD;color:#161FB5}
.import-all-yearly-btn{border:1.5px solid #E8E4F0;border-radius:6px;background:white;color:#6B7280;font-size:11px;font-weight:700;padding:3px 10px;cursor:pointer;margin-left:auto;transition:all .15s;white-space:nowrap}
.import-all-yearly-btn:hover{border-color:#1F2ADE;color:#161FB5}
.import-all-yearly-btn.active{border-color:#1F2ADE;background:#EEF0FD;color:#161FB5}
/* Legend sits above sections, not below */
.import-legend{display:flex;align-items:center;gap:6px;font-size:11px;color:#6B7280;margin-bottom:12px;flex-wrap:wrap}
/* Review hint */
.import-hint{font-size:12px;color:#6B7280;background:#F9FAFB;border-radius:14px;padding:10px 14px;margin-bottom:12px;line-height:1.6}
/* Imported badge on product list */
.prod-badge-imported{font-size:10px;font-weight:700;background:#EEF0FD;color:#1F2ADE;border-radius:4px;padding:2px 6px;margin-left:6px;vertical-align:middle;white-space:nowrap}
@media(max-width:480px){.import-costs-grid{grid-template-columns:1fr}}

/* ── Auth ──────────────────────────────────────────────────────────────────── */
.auth-slot{display:flex;align-items:center;flex-shrink:0;position:relative;z-index:9999}
/* Sign In — same pill recipe as EN/ES and currency */
.auth-signin-btn{border:1px solid #EAE8E2;border-radius:999px;padding:8px 13px;font-size:12px;font-weight:600;cursor:pointer;background:#fff;color:#1A1A1A;transition:all .15s;white-space:nowrap}
.auth-signin-btn:hover{background:#F4F2EC}
.auth-dropdown-wrap{position:relative}
.auth-user-pill{display:flex;align-items:center;gap:6px;border:1px solid #EAE8E2;border-radius:999px;padding:5px 10px 5px 5px;background:#fff;cursor:pointer;transition:background .15s;color:#1A1A1A}
.auth-user-pill:hover{background:white}
.auth-user-name{font-size:12px;font-weight:700;max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auth-menu{display:none;position:absolute;top:calc(100% + 6px);right:0;background:white;border-radius:12px;box-shadow:0 8px 30px rgba(0,0,0,.18);padding:6px;min-width:180px;z-index:9999}
.auth-dropdown-wrap.open .auth-menu{display:block}
.auth-menu-email{font-size:11px;color:var(--mid);padding:6px 10px 8px;border-bottom:1px solid #EEF0FD;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.auth-menu button{width:100%;text-align:left;border:none;background:none;padding:8px 10px;border-radius:8px;font-size:13px;font-weight:600;color:var(--dark);cursor:pointer;transition:background .15s}
.auth-menu button:hover{background:var(--light)}

/* Save nudge text inside card */
.save-nudge{text-align:center;font-size:12px;color:var(--mid);margin-top:16px;line-height:1.6;padding-top:14px;border-top:1px solid #EEF0FD}
.save-nudge-link{background:none;border:none;color:var(--brand-blue);font-size:12px;font-weight:700;cursor:pointer;text-decoration:underline;text-underline-offset:2px;padding:0}
.save-nudge-link:hover{opacity:.75}

/* ── Account modal ─────────────────────────────────────────────────────────── */
.account-overlay{position:fixed;inset:0;background:rgba(26,26,46,.55);backdrop-filter:blur(6px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .3s}
.account-overlay.visible{opacity:1}
.account-modal{background:white;border-radius:24px;padding:32px 28px;max-width:500px;width:100%;box-shadow:0 30px 80px rgba(0,0,0,.25);position:relative;animation:slideUp .35s cubic-bezier(.34,1.56,.64,1)}
.account-close{position:absolute;top:16px;right:16px;border:none;background:var(--light);border-radius:50%;width:30px;height:30px;font-size:13px;cursor:pointer;color:var(--mid);display:flex;align-items:center;justify-content:center;transition:background .15s}
.account-close:hover{background:#E8E4F0}
.account-cloud-icon{font-size:40px;margin-bottom:10px;text-align:center}
.account-title{font-size:22px;font-weight:800;color:var(--dark);text-align:center;margin-bottom:6px}
.account-subtitle{font-size:14px;color:var(--mid);text-align:center;margin-bottom:20px}
.account-compare{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:22px}
.account-option{border:1.5px solid #E8E4F0;border-radius:16px;padding:16px;position:relative}
.account-option-highlighted{border-color:var(--lavender);background:linear-gradient(135deg,#EEF0FD,#FFF0F5)}
.account-opt-badge{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:linear-gradient(135deg,var(--lavender),#161FB5);color:white;font-size:10px;font-weight:800;padding:3px 10px;border-radius:99px;white-space:nowrap}
.account-opt-icon{font-size:24px;margin-bottom:6px;text-align:center}
.account-opt-title{font-size:13px;font-weight:800;color:var(--dark);text-align:center;margin-bottom:10px}
.account-opt-list{list-style:none;display:flex;flex-direction:column;gap:5px}
.account-opt-list li{font-size:12px;line-height:1.4;padding-left:18px;position:relative;color:var(--mid)}
.account-opt-pro::before{content:'✓';position:absolute;left:0;color:#20BF6B;font-weight:800}
.account-opt-con::before{content:'✗';position:absolute;left:0;color:#FF6B6B;font-weight:800}
.account-google-btn{width:100%;display:flex;align-items:center;justify-content:center;gap:10px;border:none;border-radius:14px;padding:14px;background:var(--dark);color:white;font-size:15px;font-weight:700;cursor:pointer;transition:all .2s;margin-bottom:10px}
.account-google-btn:hover{background:#2D2D4E;transform:translateY(-1px);box-shadow:0 6px 20px rgba(0,0,0,.2)}
.account-skip-btn{width:100%;border:none;background:none;color:var(--mid);font-size:13px;font-weight:600;cursor:pointer;padding:6px;transition:color .15s}
.account-skip-btn:hover{color:var(--dark)}
@media(max-width:420px){.account-compare{grid-template-columns:1fr}.account-modal{padding:24px 18px}}

/* ── Cost section accordion (touch devices) ────────────────────────────────── */
/* pointer:coarse = finger/stylus — catches all phones including in-app browsers
   (Instagram, Facebook) that may report a viewport wider than 480px.
   Desktop mouse users (pointer:fine) always see all sections expanded.        */
.cost-sec { /* no styles on non-touch */ }

@media(pointer:coarse){
  .cost-sec { margin-bottom:4px; }

  /* Make the section header tappable */
  .cost-sec .sec.sec-toggle {
    cursor:pointer;
    user-select:none;
    margin:0;
    padding:14px 4px;
    border-radius:10px;
    transition:background .15s;
    -webkit-tap-highlight-color:transparent;
  }
  .cost-sec .sec.sec-toggle:active { background:rgba(130,100,200,.08); }

  /* Chevron */
  .sec-chev {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:20px;
    height:20px;
    margin-left:4px;
    flex-shrink:0;
    border-radius:50%;
    background:rgba(130,100,200,.12);
    transition:transform .25s ease;
  }
  .sec-chev::after {
    content:'';
    display:block;
    width:6px;
    height:6px;
    border-right:2px solid var(--lavender);
    border-bottom:2px solid var(--lavender);
    transform:rotate(45deg) translateY(-1px);
    transition:transform .25s ease;
  }

  /* Collapsed: hide body; open: show body + flip chevron */
  .cost-sec .sec-body { display:none; padding-bottom:4px; }
  .cost-sec.open .sec-body { display:block; }
  .cost-sec.open .sec-chev { transform:rotate(0); }
  .cost-sec.open .sec-chev::after { transform:rotate(-135deg) translateY(-1px); }

  /* Suppress decorative line — chevron takes that role on touch */
  .cost-sec .sec.sec-toggle::after { display:none; }

  /* Prompt animation on the next section's chevron */
  @keyframes chev-prompt {
    0%,65%,100% { transform:translateY(0); }
    15%          { transform:translateY(-2px); }
    38%          { transform:translateY(4px); }
    52%          { transform:translateY(-1px); }
    60%          { transform:translateY(1.5px); }
  }
  .cost-sec.open + .cost-sec .sec-chev {
    animation: chev-prompt 2.2s cubic-bezier(0.4,0,0.2,1) infinite;
  }
}
