/* Public website: landing (/), pricing (/pricing). Layout = mockup A (Mail Log) with B's mailing label (owner, 2026-10-27).
   Every class starts with "l-" so nothing collides with the member app's short class names in style.css. */
.site{max-width:none;min-height:100vh;display:block;background:var(--bg);box-shadow:none}
.site{--deep:#333335;--char:#4D4D4F;--ease:cubic-bezier(.16,1,.3,1);--disp:'Flama Condensed',Gotham,sans-serif;--sub:Gotham,sans-serif;font-size:17px;line-height:1.5}
body:has(.site){background:var(--bg)}
.site ::selection{background:var(--yellow);color:var(--deep)}
.site :focus-visible{outline:2px solid var(--deep);outline-offset:2px}
.l-nav.dark :focus-visible,.l-hero :focus-visible,.l-foot :focus-visible,.j-planbar :focus-visible{outline-color:var(--yellow)}
html:has(.site){scroll-padding-top:90px}
.l-wrap{max-width:1200px;margin:0 auto;padding:0 32px}
.site h1,.site h2,.site h3{font-family:var(--disp);font-weight:500;line-height:.95;margin:0;letter-spacing:-.01em;text-wrap:balance}
:where(.site) svg.i{width:22px;height:22px;flex:none}   /* low priority: component icon sizes win */

.l-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 22px;border-radius:12px;border:1.5px solid var(--char);background:transparent;font-family:var(--sub);font-weight:700;font-size:15px;text-decoration:none;cursor:pointer;white-space:nowrap;transition:background .2s,color .2s,transform .2s var(--ease)}
.l-btn:hover{transform:translateY(-1px)}
.l-btn.dark{background:var(--char);color:var(--yellow)}
.l-btn.dark:hover{background:var(--deep)}
.l-btn.yel{background:var(--yellow);border-color:var(--yellow);color:var(--deep)}
.l-btn.sm{min-height:40px;padding:0 16px;font-size:14px;border-radius:10px}

/* nav */
.l-nav{position:sticky;top:0;z-index:20;background:rgba(248,247,242,.95);backdrop-filter:saturate(1.2) blur(8px);border-bottom:1px solid var(--line)}
.l-nav .l-wrap{display:flex;align-items:center;gap:28px;height:76px}
.l-nav img{height:44px;display:block}
.l-links{display:flex;gap:26px;margin-left:12px}
.l-links a{font-family:var(--sub);font-weight:700;font-size:14px;text-decoration:none;color:var(--muted)}
.l-links a:hover,.l-links a[aria-current=page]{color:var(--ink)}
.l-nav .l-sp{flex:1}
.l-nav .l-acts{display:flex;gap:10px}
.l-nav.dark{background:rgba(51,51,53,.97);border-color:#4a4a4c}
.l-nav.dark img{filter:brightness(0) invert(1)}
.l-nav.dark .l-links a{color:#c9c8c2}.l-nav.dark .l-links a:hover{color:#fff}
.l-nav.dark .l-btn:not(.yel){border-color:rgba(255,255,255,.55);color:#fff}

/* hero: headline + mailing label, then the sample mail log */
.l-hero{background:var(--deep);color:#fff;padding:64px 0 0;overflow:hidden}
.l-hero .l-top{display:grid;grid-template-columns:1.1fr 1fr;gap:56px;align-items:center}
.l-hero h1{font-size:clamp(64px,8.2vw,132px);color:#fff}
.l-hero h1 em{font-style:normal;color:var(--yellow)}
.l-lead{font-size:19px;color:#d9d8d2;max-width:44ch;margin:22px 0 0}
.l-label{background:#fff;border-radius:14px;padding:30px 34px 34px;box-shadow:0 24px 50px -20px rgba(0,0,0,.55);font-family:var(--sub);font-weight:700;font-size:26px;line-height:1.35;color:var(--deep);position:relative;transform:rotate(-2deg);transition:transform .6s var(--ease)}
.l-label:hover{transform:rotate(0)}
.l-label > div:not(.l-bar){padding-right:100px;overflow-wrap:anywhere}
.l-label .l-to{font-family:var(--body,Akkurat),sans-serif;font-weight:400;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.l-label .l-pmb{background:var(--yellow);padding:0 6px;border-radius:4px;white-space:nowrap}
.l-label .l-stamp{position:absolute;top:20px;right:24px;width:78px;height:90px;background:var(--yellow);border-radius:3px;display:grid;place-items:center;color:var(--deep);outline:2px dotted var(--deep);outline-offset:-7px}
.l-label .l-stamp svg{width:38px;height:38px;stroke-width:1.6}
.l-label .l-bar{height:42px;margin-top:20px;background:repeating-linear-gradient(90deg,var(--deep) 0 2px,transparent 2px 5px,var(--deep) 5px 6px,transparent 6px 9px,var(--deep) 9px 12px,transparent 12px 14px);opacity:.85;border-radius:2px}

.l-log{margin-top:64px;background:var(--bg);color:var(--ink);border-radius:20px 20px 0 0;padding:26px 28px 6px;box-shadow:0 -20px 60px rgba(0,0,0,.25)}
.l-log .l-lh{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.l-log .l-lh b{font-family:var(--disp);font-weight:500;font-size:30px}
.l-log .l-lh .l-sp{flex:1}
.l-log .l-lt{display:flex;gap:20px;font-family:var(--sub);font-size:13px;color:var(--muted)}
.l-log .l-lt span[aria-current]{color:var(--ink);box-shadow:inset 0 -2px 0 var(--ink);padding-bottom:4px}
.l-log table{width:100%;border-collapse:collapse;font-size:15px}
.l-log th{font-family:var(--sub);font-size:12px;color:var(--muted);text-align:left;padding:10px 12px;border-bottom:1px solid var(--line2);white-space:nowrap}
.l-log td{padding:12px;border-bottom:1px solid var(--line);vertical-align:middle}
.l-log tbody tr{transition:background .2s}
.l-log tbody tr:hover{background:#fff}
.l-snd{display:flex;align-items:center;gap:14px;font-weight:700}
.l-thumb{width:74px;height:46px;border-radius:6px;border:1px solid var(--line);flex:none;background:#fff;overflow:hidden}
.l-thumb svg{width:100%;height:100%;display:block}
.l-pill{display:inline-block;font-size:12.5px;font-weight:600;padding:3px 10px;border-radius:999px;background:var(--field);white-space:nowrap}
.l-pill.new{background:var(--yellow)}
.l-pill.ok{background:var(--soft)}
.l-act{display:flex;gap:6px;justify-content:flex-end}
.l-act button{border:1px solid var(--line2);background:#fff;border-radius:9px;height:34px;padding:0 11px;font-family:var(--sub);font-size:12.5px;display:inline-flex;align-items:center;gap:6px;cursor:pointer}
.l-act button svg{width:16px;height:16px}
.l-act button:hover{border-color:var(--char)}
.l-act button[aria-pressed=true]{background:var(--char);color:var(--yellow);border-color:var(--char)}
.l-syn{font-size:12px;color:var(--muted);padding:10px 2px 14px}

/* sections */
.l-sec{padding:110px 0}
.l-sec.flush{padding-top:0}
.l-sech{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:46px}
.l-sech h2{font-size:clamp(46px,5.4vw,76px)}
.l-sech p{max-width:420px;margin:0;color:var(--muted)}
.l-sech a{font-family:var(--sub);font-weight:700;font-size:15px}
.l-svc{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line2)}
.l-svc > div{padding:30px 28px 34px 0;border-bottom:1px solid var(--line2)}
.l-svc > div:nth-child(3n+2),.l-svc > div:nth-child(3n+3){padding-left:28px;border-left:1px solid var(--line2)}
.l-ic{width:52px;height:52px;border-radius:14px;background:var(--yellow);display:grid;place-items:center;margin-bottom:18px}
.l-ic svg{width:26px;height:26px}
.l-svc h3{font-size:34px;margin-bottom:8px}
.l-svc p{margin:0;color:var(--muted);max-width:32ch}
.l-from{display:block;margin-top:12px;font-family:var(--sub);font-size:13px;color:var(--ink)}
.l-steps{display:grid;grid-template-columns:repeat(3,1fr);border-top:2px solid var(--char)}
.l-steps > div{padding:26px 28px 0 0}
.l-steps .l-n{font-family:var(--disp);font-size:88px;line-height:.8;color:var(--yellow);-webkit-text-stroke:1.5px var(--char)}
.l-steps h3{font-size:34px;margin:18px 0 10px}
.l-steps p{margin:0;color:var(--muted);max-width:34ch}

.l-pr{font-family:var(--disp);font-size:64px;line-height:1;margin:14px 0 4px}
.l-pr small{font-family:Akkurat,sans-serif;font-size:16px;color:var(--muted)}
.l-yr{font-size:14px;color:var(--muted)}
.l-fromline{font-size:clamp(22px,2.4vw,30px);margin:-18px 0 0}
.l-fromline b{font-family:var(--disp);font-weight:500;font-size:1.5em}
.l-fromline a{font-family:var(--sub);font-weight:700;font-size:.7em;white-space:nowrap}

.l-cta{background:var(--yellow);padding:90px 0}
.l-cta .l-wrap{display:flex;align-items:center;justify-content:space-between;gap:40px}
.l-cta h2{font-size:clamp(52px,6vw,92px);color:var(--deep);max-width:18ch}
.l-foot{background:var(--deep);color:#d9d8d2;padding:64px 0 40px;font-size:15px}
.l-foot .l-wrap{display:grid;grid-template-columns:2fr 1fr;gap:40px}
.l-foot img{height:44px;filter:brightness(0) invert(1)}
.l-foot h4{font-family:var(--sub);font-size:13px;color:#fff;margin:0 0 12px}
.l-foot a{display:block;color:#d9d8d2;text-decoration:none;margin:6px 0}
.l-foot a:hover{color:var(--yellow)}
.l-foot p{margin:16px 0 0;max-width:36ch}
.l-legal{grid-column:1/-1;border-top:1px solid #4a4a4c;padding-top:22px;font-size:13px;color:#a9a8a2}

/* pricing page */
.l-phero{padding:80px 0 30px}
.l-phero h1{font-size:clamp(72px,9vw,140px)}
.l-phero p{font-size:19px;color:var(--muted);max-width:52ch;margin:18px 0 0}
.l-seg{display:inline-flex;border:1.5px solid var(--char);border-radius:12px;padding:3px;margin-top:30px;background:#fff}
.l-seg button{border:0;background:none;border-radius:9px;height:40px;padding:0 18px;font-family:var(--sub);font-size:14px;cursor:pointer}
.l-seg button[aria-pressed=true]{background:var(--char);color:var(--yellow)}
.l-cmp{width:100%;border-collapse:separate;border-spacing:0;margin-top:34px;background:#fff;border:1.5px solid var(--char);border-radius:18px}
.l-cmp th,.l-cmp td{padding:14px 20px;text-align:left;border-top:1px solid var(--line);font-size:15.5px}
.l-cmp thead th{border-top:0;vertical-align:bottom;padding:26px 20px 22px}
.l-cmp thead th:first-child{border-top-left-radius:16px}.l-cmp thead th:last-child{border-top-right-radius:16px}
.l-cmp tbody tr:last-child th{border-bottom-left-radius:16px}.l-cmp tbody tr:last-child td:last-child{border-bottom-right-radius:16px}
.l-cmp thead h3{font-size:36px}
.l-cmp thead .l-pr{font-size:56px;margin-top:10px}
.l-cmp thead .l-btn{margin-top:14px}
.l-cmp td:not(:first-child),.l-cmp th:not(:first-child){width:24%;font-variant-numeric:tabular-nums}
.l-cmp tbody th{font-weight:400;color:var(--muted)}
.l-cmp .grp th{background:var(--bg);font-family:var(--sub);font-size:13px;color:var(--ink);padding:12px 20px}
.l-off{color:var(--muted)}
.l-fine{font-size:14px;color:var(--muted);max-width:80ch;margin:22px 0 110px}

@media (max-width:900px){
  .l-wrap{padding:0 20px}
  .l-sec{padding:72px 0}
  .l-links{display:none}
  .l-nav .l-wrap{height:64px;gap:12px}.l-nav img{height:34px}
  .l-nav .l-btn.sm{padding:0 12px;min-height:44px;font-size:13px}
  .l-sech{flex-direction:column;align-items:flex-start}
  .l-steps,.l-svc,.l-foot .l-wrap{grid-template-columns:1fr}
  .l-svc > div{padding-left:0!important;border-left:0!important}
  .l-hero .l-top{grid-template-columns:1fr;gap:34px}
  .l-label{font-size:20px;padding:22px 22px 24px}.l-label > div:not(.l-bar){padding-right:64px}
  .l-label .l-stamp{width:56px;height:66px;top:16px;right:16px}.l-label .l-stamp svg{width:28px;height:28px}
  .l-log{padding:16px 12px 4px;margin-top:40px}
  .l-log .l-lt{display:none}
  .l-log th:nth-child(2),.l-log td:nth-child(2),.l-log th:nth-child(3),.l-log td:nth-child(3){display:none}
  .l-act button span{display:none}
  .l-thumb{width:56px;height:36px}
  .l-cta .l-wrap{flex-direction:column;align-items:flex-start}
  .l-cmp{table-layout:fixed}.l-cmp tbody th,.l-cmp thead th:first-child{width:28%}
  .l-cmp th,.l-cmp td{padding:10px 8px;font-size:13px}
  .l-cmp tbody td,.l-cmp tbody th{overflow-wrap:anywhere}
  .l-cmp thead h3{font-size:18px}.l-cmp thead .l-pr{font-size:20px;white-space:nowrap}.l-cmp thead .l-btn{display:none}
  .l-cmp thead .l-pr small{display:block;font-size:11px}.l-cmp .l-yr{font-size:11px}
}
/* sign-up (/join): layout "A · Checkout" (owner, 2026-10-27) */
.j-mem{font-size:14px;color:var(--muted);align-self:center}
.j-wrap{padding-bottom:110px}
.j-head{padding:46px 0 0}
.j-head h1{font-size:clamp(46px,5vw,72px)}
.j-head p{color:var(--muted);margin:12px 0 0;max-width:56ch}
.j-steps{display:flex;margin:28px 0 36px;border-bottom:1px solid var(--line2)}
.j-steps span{flex:1;font-family:var(--sub);font-size:13px;color:var(--muted);padding:0 0 14px;display:flex;align-items:center;gap:8px;border-bottom:3px solid transparent;margin-bottom:-2px}
.j-steps i{font-style:normal;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line2);display:grid;place-items:center;font-size:11px;flex:none}
.j-steps i svg{width:14px;height:14px;stroke-width:3}
.j-steps .done{color:var(--ink)}.j-steps .done i{background:var(--char);color:var(--yellow);border-color:var(--char)}
.j-steps .cur{color:var(--ink);border-color:var(--yellow)}.j-steps .cur i{border-color:var(--char);background:var(--yellow)}
.j-body{display:grid;grid-template-columns:1fr 360px;gap:44px;align-items:start}
.j-body.full{grid-template-columns:1fr}
.j-sum{position:sticky;top:100px;background:#fff;border:1.5px solid var(--char);border-radius:18px;padding:22px}
.j-sum h4{font-family:var(--disp);font-weight:500;font-size:28px;margin:0 0 12px}
.j-lbl{border:1px solid var(--line);border-radius:12px;padding:14px 16px;font-family:var(--sub);font-weight:700;font-size:15px;line-height:1.4;color:var(--deep);overflow-wrap:anywhere}
.j-to{font-family:Akkurat,sans-serif;font-weight:400;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:4px}
.j-pm{background:var(--yellow);padding:0 5px;border-radius:4px;white-space:nowrap}
.j-sumplan{display:flex;justify-content:space-between;gap:10px;padding:14px 0 6px;font-size:15px}
.j-sum .j-lines{border:0;padding:0;margin-top:6px;border-top:1px solid var(--line);border-radius:0}
.j-seg{display:inline-flex;border:1.5px solid var(--char);border-radius:12px;padding:3px;background:#fff}
.j-seg button{border:0;background:none;border-radius:9px;height:40px;padding:0 18px;font-family:var(--sub);font-size:14px;cursor:pointer}
.j-seg button[aria-pressed=true]{background:var(--char);color:var(--yellow)}
.j-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px;align-items:start}
.j-plan{position:relative;background:#fff;border:1.5px solid var(--line2);border-radius:18px;padding:26px 24px 20px;cursor:pointer;display:flex;flex-direction:column;transition:border-color .2s,box-shadow .2s,transform .2s var(--ease)}
.j-plan:hover{border-color:var(--char);transform:translateY(-2px)}
.j-plan[aria-checked=true]{border-color:var(--char);box-shadow:0 0 0 2px var(--char),0 18px 40px -22px rgba(40,40,41,.45)}
.j-radio{position:absolute;top:22px;right:22px;width:24px;height:24px;border-radius:50%;border:2px solid var(--line2);display:grid;place-items:center}
.j-plan[aria-checked=true] .j-radio{border-color:var(--char);background:var(--char);color:var(--yellow)}
.j-radio svg{width:14px;height:14px;stroke-width:3;opacity:0}.j-plan[aria-checked=true] .j-radio svg{opacity:1}
.j-plan h3{font-size:34px;padding-right:30px}
.j-pr{font-family:var(--disp);font-size:52px;line-height:1;margin:12px 0 2px}
.j-pr small{font-family:Akkurat,sans-serif;font-size:15px;color:var(--muted)}
.j-alt{font-size:13.5px;color:var(--muted)}
.j-plan ul{list-style:none;padding:0;margin:16px 0 14px;display:grid;gap:8px;font-size:15px}
.j-plan li{display:flex;gap:9px}.j-plan li svg{width:17px;height:17px;margin-top:3px}
.j-more{border:0;background:none;padding:10px 0 0;border-top:1px solid var(--line);font-family:var(--sub);font-size:13px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;color:var(--ink)}
.j-more svg{width:16px;height:16px;transition:transform .3s var(--ease)}
.j-open .j-more svg{transform:rotate(180deg)}
.j-det{display:grid;grid-template-rows:0fr;transition:grid-template-rows .4s var(--ease)}
.j-open .j-det{grid-template-rows:1fr}
.j-det > div{overflow:hidden}
.j-det .pd{display:grid;gap:4px;padding-top:6px;font-size:13.5px}
.j-det .pdg b{display:block;font-family:var(--sub);font-size:11.5px;margin:8px 0 3px}
.j-det .pdr{display:flex;justify-content:space-between;gap:10px;color:var(--muted);padding:2px 0}
.j-det .pdr span:last-child{color:var(--ink);font-weight:600;font-variant-numeric:tabular-nums;white-space:nowrap}
.j-fine{font-size:13.5px;color:var(--muted);margin-top:16px}
.j-planbar{display:flex;align-items:center;gap:16px;margin-top:24px;padding:18px 22px;background:var(--deep);color:#fff;border-radius:16px}
.j-planbar b{display:block;font-family:var(--disp);font-weight:500;font-size:26px;line-height:1}
.j-planbar span{color:#c9c8c2;font-size:14px}.j-planbar .l-sp{flex:1}
.j-opt{display:flex;gap:14px;align-items:center;background:#fff;border:1.5px solid var(--line2);border-radius:14px;padding:16px 18px;width:100%;text-align:left;margin-bottom:10px;cursor:pointer}
.j-opt[aria-checked=true]{border-color:var(--char);box-shadow:0 0 0 1px var(--char)}
.j-opt .r{width:20px;height:20px;border-radius:50%;border:2px solid var(--line2);flex:none}
.j-opt[aria-checked=true] .r{border:6px solid var(--char)}
.j-opt .t{flex:1}.j-opt .t b{display:block;font-size:16px}.j-opt .t span{font-size:14px;color:var(--muted)}
.j-opt .p{font-family:var(--sub);font-size:14px}
.j-f{display:grid;gap:6px;margin-bottom:14px}
.j-f label{font-family:var(--sub);font-size:13px}
.j-f input{height:50px;border-radius:12px;border:1.5px solid var(--line2);background:#fff;padding:0 14px;font-size:16px;width:100%}
.j-f input:focus{outline:none;border-color:var(--char);box-shadow:0 0 0 1.5px var(--char),0 0 0 5px rgba(254,219,0,.5)}
.j-exp{display:grid;grid-template-columns:1.2fr 1fr;gap:8px}
.j-exp select{height:50px;border-radius:12px;border:1.5px solid var(--line2);background:#fff;padding:0 10px;font-size:16px;width:100%;min-width:0}
.j-exp select:focus{outline:none;border-color:var(--char);box-shadow:0 0 0 1.5px var(--char),0 0 0 5px rgba(254,219,0,.5)}
.j-g2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.j-g3{display:grid;grid-template-columns:2fr 1fr 1fr;gap:12px}
.j-g3:has(.j-exp){grid-template-columns:1.6fr 1fr 1fr}
.j-g2:has(.j-exp){grid-template-columns:1.6fr 1fr}
.site .j-h2{font-family:var(--disp);font-weight:500;font-size:30px;margin:36px 0 14px}
.j-chk{display:flex;gap:10px;align-items:flex-start;font-size:15px;margin-top:10px}
.j-chk input{width:20px;height:20px;accent-color:var(--char);margin-top:2px;flex:none}
.j-lines{background:#fff;border:1.5px solid var(--line2);border-radius:16px;padding:6px 18px}
.j-lines > div{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-top:1px solid var(--line);font-size:15px}
.j-lines > div:first-child{border-top:0}
.j-lines .tot{font-weight:700;font-size:17px}
.j-lines > .j-then{display:block;border-top:0;padding:0 0 10px;margin-top:-6px;font-size:13.5px;color:var(--muted);text-align:right}
.j-ok{color:#2f7a3c;font-size:14px}.j-bad{color:var(--danger);font-size:14px}
/* Create Your Login: Email + Send code, Code + Confirm (owner 2026-11-02); the button wraps under the field on narrow phones */
.j-ec{display:flex;gap:8px;align-items:stretch}
.j-ec input{flex:1;min-width:0}
.j-ec .l-btn{flex:none;min-height:50px;min-width:144px;border-radius:12px}
.j-ec input:disabled{background:#f1f0ea;color:inherit;opacity:1;-webkit-text-fill-color:currentColor}
.j-ec .l-btn.j-ecok:disabled{opacity:1;border-color:#2f7a3c;color:#2f7a3c}
.j-ec .l-btn.j-ecok svg{width:18px;height:18px}
[data-ecmsg] .j-bad{margin-top:2px}
@media (max-width:600px){.j-ec .l-btn{min-width:128px;padding:0 12px}}
@media (max-width:359px){.j-ec{flex-wrap:wrap}.j-ec .l-btn{flex:1 1 100%}}
.j-up .up{padding:20px;border-radius:16px;margin-bottom:12px}
.up .upb{flex:none;pointer-events:none}
.j-acts{display:flex;gap:10px;justify-content:space-between;margin-top:30px}
@media (max-width:900px){
  .j-head{padding-top:28px}
  .j-steps{margin:20px 0 24px}.j-steps span{justify-content:center;gap:6px}
  /* process audit 3c (L16): every step keeps a short label on phones */
  .j-steps b{font-size:0}.j-steps b::after{content:attr(data-s);font-size:12.5px}
  .j-body{grid-template-columns:1fr;gap:24px}.j-sum{position:static;order:-1}
  .j-plans,.j-g2,.j-g3{grid-template-columns:1fr}
  .j-mem{display:none}
  .j-planbar{position:sticky;bottom:calc(12px + env(safe-area-inset-bottom))}
  .l-seg button,.j-seg button{height:44px}
  .j-more{min-height:44px}
}
/* waiting for approval (applicantView): layout "A · Checklist" (owner, 2026-10-27) */
.w-user{display:flex;align-items:center;gap:12px;font-family:var(--sub);font-size:14px}
.w-av{width:36px;height:36px;border-radius:50%;background:var(--char);color:var(--yellow);display:grid;place-items:center;font-size:12px}
.w-wrap{display:grid;grid-template-columns:1fr 400px;gap:56px;align-items:start;padding:52px 0 120px}
.w-h1{font-size:clamp(52px,6vw,88px)}
.w-lead{color:var(--muted);font-size:18px;margin:14px 0 0;max-width:52ch}
.w-list{margin-top:34px;display:grid;gap:14px}
.w-sec{background:#fff;border:1.5px solid var(--line2);border-radius:18px;padding:22px 24px}
.w-sec.cur{border-color:var(--char)}
.w-sh{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.w-sh h2{font-size:28px;flex:1}
.w-sh small{font-family:var(--sub);font-size:12.5px;color:var(--muted)}
.w-chk{width:26px;height:26px;border-radius:50%;border:1.5px solid var(--line2);display:grid;place-items:center;flex:none}
.w-chk.ok{background:var(--char);border-color:var(--char);color:var(--yellow)}
.w-chk svg.i{width:14px;height:14px;stroke-width:3}
.w-opt{display:flex;gap:14px;align-items:center;background:#fff;border:1.5px solid var(--line2);border-radius:14px;padding:16px 18px;width:100%;text-align:left;margin-bottom:10px;cursor:pointer}
.w-opt[aria-checked=true]{border-color:var(--char);box-shadow:0 0 0 1px var(--char)}
.w-opt .r{width:20px;height:20px;border-radius:50%;border:2px solid var(--line2);flex:none}
.w-opt[aria-checked=true] .r{border:6px solid var(--char)}
.w-opt .t{flex:1}.w-opt .t b{display:block;font-size:16px}.w-opt .t span{font-size:14px;color:var(--muted)}
.w-opt .p{font-family:var(--sub);font-size:14px}
.w-up{display:flex;gap:14px;align-items:center;background:#fff;border:1.5px dashed var(--line2);border-radius:14px;padding:18px;position:relative;cursor:pointer}
.w-up.done{border-style:solid;border-color:var(--char)}
.w-up svg.i{width:28px;height:28px}
.w-up .t{flex:1}.w-up .t b{display:block;font-size:16px}.w-up .t span{font-size:14px;color:var(--muted)}
.w-up input{position:absolute;inset:0;opacity:0;cursor:pointer}
.w-up:focus-within{box-shadow:0 0 0 2px var(--deep),0 0 0 5px var(--yellow)}
.w-hint.deskline{margin-top:18px}
.w-note{font-size:14.5px;color:var(--muted);background:var(--bg);border:1px solid var(--line);border-radius:12px;padding:12px 14px;margin-top:4px}
.w-hint{font-size:13.5px;color:var(--muted);margin:-6px 0 12px}
.w-alldone{margin-top:18px;background:var(--yellow);border-radius:18px;padding:20px 22px;display:flex;gap:14px;align-items:center}
.w-alldone b{display:block;font-family:var(--disp);font-weight:500;font-size:28px;line-height:1}
.w-aside{position:sticky;top:110px}
.w-label{background:#fff;border-radius:14px;padding:26px 30px 30px;box-shadow:0 22px 46px -22px rgba(40,40,41,.5);font-family:var(--sub);font-weight:700;font-size:22px;line-height:1.35;color:var(--deep);position:relative;transform:rotate(-1.5deg);overflow-wrap:anywhere}
.w-st{display:inline-block;font-size:11px;background:var(--bg);border:1px solid var(--line2);border-radius:999px;padding:5px 10px;color:var(--muted);margin-bottom:12px}
.w-to{font-family:Akkurat,sans-serif;font-weight:400;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px}
.w-pm{background:var(--yellow);padding:0 6px;border-radius:4px;white-space:nowrap}
.w-bar{height:38px;margin-top:18px;background:repeating-linear-gradient(90deg,var(--deep) 0 2px,transparent 2px 5px,var(--deep) 5px 6px,transparent 6px 9px,var(--deep) 9px 12px,transparent 12px 14px);opacity:.85}
.w-bar.dim{opacity:.18}
.w-prog{margin-top:22px;font-family:var(--sub);font-size:13px;color:var(--muted)}
.w-tr{height:8px;border-radius:4px;background:var(--line);margin-top:8px;overflow:hidden}.w-tr i{display:block;height:100%;background:var(--yellow);transition:width .5s var(--ease)}
.w-pick{display:grid;gap:6px;margin-bottom:12px}
.w-pick label{font-family:var(--sub);font-size:13px}
.w-pick select,.w-pick input{height:50px;border-radius:12px;border:1.5px solid var(--line2);background:#fff;padding:0 12px;font-size:16px;width:100%}
.w-pick select:focus,.w-pick input:focus{outline:none;border-color:var(--char);box-shadow:0 0 0 1.5px var(--char),0 0 0 5px rgba(254,219,0,.5)}
.w-up.off{cursor:not-allowed}.w-up.off > svg,.w-up.off .l-btn{opacity:.4}.w-up.off input{cursor:not-allowed}
.w-warn{color:var(--danger);background:var(--danger-soft);border-color:#f0c9c3;margin:-2px 0 12px}
@media (max-width:900px){
  .w-wrap{grid-template-columns:1fr;gap:28px;padding-top:28px}.w-aside{position:static;order:-1}
  .w-label{font-size:19px;padding:20px 20px 22px}
  .w-user span:not(.w-av){display:none}
  .w-sh small{display:none}
}
@media (prefers-reduced-motion:reduce){.site *{transition:none!important}}

.l-cmp .hlc{background:#FFFDF0}
.l-cmp thead th.hlc{background:var(--char);color:#fff}
.l-cmp thead th.hlc .l-pr small,.l-cmp thead th.hlc .l-yr{color:#c9c8c2}
.l-cmp thead th.hlc .l-btn{background:var(--yellow);color:var(--deep);border-color:var(--yellow)}
.l-btn:disabled{opacity:.45;cursor:default;transform:none}
/* UI audit 2026-11-02 */
.l-cmp thead th{position:sticky;top:76px;z-index:2;background:#fff}
@media (max-width:900px){ .l-cmp thead th{top:64px} }
.l-cmp thead th.hlc{background:var(--char)}
.l-pr,.j-pr,.j-lines,.j-sumplan,.w-prog{font-variant-numeric:tabular-nums}
.l-btn[aria-disabled=true]{opacity:.45;transform:none}
.j-need{color:var(--danger);font-size:14.5px;margin:14px 0 0}
.j-paying{background:var(--soft);border-radius:12px;padding:12px 14px;margin:0 0 14px;font-weight:600}
.j-chk-n{color:var(--muted);font-size:14px}
.j-f select{height:50px;border-radius:12px;border:1.5px solid var(--line2);background:#fff;padding:0 10px;font-size:16px;width:100%;min-width:0}
.j-f select:focus{outline:none;border-color:var(--char);box-shadow:0 0 0 1.5px var(--char),0 0 0 5px rgba(254,219,0,.5)}
.j-head h1:focus{outline:none}
