/* ============================================================================
   portal-proto.css — the fake merchant portal ("Getting started"), rebuilt to
   match the Claude Design artboard: ivory ground, white cards, one blue
   accent, Figtree + Bricolage Grotesque. Used at natural size on
   portal-proto.html (local, --proto) and scaled onto the axis on /guides.
   Every class is pt- prefixed. Registered in build.py CACHE_BUST_ASSETS.
   ========================================================================== */
.pt{--acc:#1463FF;--acc2:#0A3DA3;--ink:#131A2A;--mut:#5B6578;--mut2:#4A5468;--body:#3F4859;--line:#E1E5EC;--line2:#EEF1F5;--soft:#C9D0DC;--bg:#F3F5F8;--card:#FFFFFF;--ok:#0F7A48;--tint:#E3ECFF;--warm:#FFF4EA;--warmb:#F5C9A0;--warmt:#9A4508;
  width:1120px;box-sizing:border-box;display:flex;flex-direction:column;background:var(--bg);color:var(--ink);font-family:'Figtree',system-ui,-apple-system,sans-serif;font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased;text-align:left;}
.pt *{box-sizing:border-box;}
.pt-head{height:64px;padding:0 40px;background:var(--card);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;flex:none;}
.pt-hl{display:flex;align-items:center;gap:14px;}
.pt-brand{font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:23px;letter-spacing:-.5px;color:var(--acc);}
.pt-vr{width:1px;height:22px;background:#D5DAE3;}
.pt-sec{font-size:14px;font-weight:600;color:var(--mut2);}
.pt-hr{display:flex;align-items:center;gap:20px;}
.pt-link{font-size:14px;font-weight:600;color:var(--acc);text-decoration:none;}
.pt-who{display:flex;align-items:center;gap:10px;}
.pt-who div{text-align:right;line-height:1.3;}
.pt-who b{display:block;font-size:14px;font-weight:600;}
.pt-who span{font-size:12.5px;color:var(--mut);}
.pt-av{width:36px;height:36px;border-radius:18px;background:var(--tint);color:var(--acc);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex:none;}
.pt-main{padding:32px 40px 28px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:24px;align-items:start;}
.pt-col{display:flex;flex-direction:column;gap:20px;min-width:0;}
.pt-card{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:24px;display:flex;flex-direction:column;gap:18px;}
.pt-hello{font-size:13px;font-weight:600;color:var(--mut);}
.pt-h1{margin:0;font-family:'Bricolage Grotesque',sans-serif;font-weight:700;font-size:34px;line-height:1.1;letter-spacing:-.7px;}
.pt-lede{margin:0;font-size:15px;line-height:1.5;color:var(--body);max-width:560px;}
.pt-prog{display:flex;flex-direction:column;gap:8px;}
.pt-prog-l{display:flex;justify-content:space-between;font-size:13px;font-weight:600;}
.pt-prog-l span+span{color:var(--mut);font-weight:500;}
.pt-bars{display:grid;grid-template-columns:repeat(10,minmax(0,1fr));gap:4px;}
.pt-bars i{height:7px;border-radius:4px;background:#D5DAE3;display:block;}
.pt-bars i.on{background:var(--acc);}
.pt-bars i.nx{background:#F5A25D;}
.pt-needs{background:var(--warm);border:1px solid var(--warmb);border-radius:12px;padding:16px 20px;display:flex;align-items:center;justify-content:space-between;gap:20px;}
.pt-needs .tag{font-size:11.5px;font-weight:700;color:var(--warmt);letter-spacing:.4px;text-transform:uppercase;}
.pt-needs .t{font-size:17px;font-weight:700;margin-top:3px;}
.pt-needs .x{font-size:13.5px;color:var(--mut2);margin-top:3px;max-width:44ch;}
.pt-btns{display:flex;gap:10px;flex:none;}
.pt-btn{display:inline-flex;align-items:center;height:40px;padding:0 16px;border-radius:9px;font-weight:700;font-size:13.5px;text-decoration:none;white-space:nowrap;border:1px solid transparent;font-family:inherit;background:var(--acc);color:#fff;}
.pt-btn.line{background:var(--card);color:var(--ink);border-color:var(--soft);font-weight:600;}
.pt-plan-h{display:flex;justify-content:space-between;align-items:baseline;}
.pt-h2{margin:0;font-family:'Bricolage Grotesque',sans-serif;font-size:22px;font-weight:700;}
.pt-upd{font-size:12.5px;color:var(--mut);}
.pt-grp{display:flex;flex-direction:column;}
.pt-grp-l{font-size:11.5px;font-weight:700;color:var(--mut);letter-spacing:.6px;text-transform:uppercase;padding-bottom:6px;}
.pt-row{display:grid;grid-template-columns:32px minmax(0,1fr) auto;gap:14px;align-items:start;padding:10px 0;border-top:1px solid var(--line2);}
.pt-row b{display:block;font-size:14.5px;font-weight:600;}
.pt-row span{display:block;font-size:12.5px;color:var(--mut);padding-top:1px;}
.pt-row em{font-style:normal;font-size:12.5px;color:var(--mut);white-space:nowrap;padding-top:2px;}
.pt-row.next b{font-weight:700;}
.pt-row.next em{color:var(--acc);font-weight:600;}
.pt-ck{width:28px;height:28px;border-radius:14px;background:var(--ok);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;}
.pt-ck.nx{background:var(--tint);border:2px solid var(--acc);}
.pt-ck.nx i{width:9px;height:9px;border-radius:5px;background:var(--acc);display:block;}
.pt-side{display:flex;flex-direction:column;gap:20px;min-width:0;}
.pt-card.sm{padding:20px;gap:14px;}
.pt-tag{font-size:11.5px;font-weight:700;color:var(--mut);letter-spacing:.6px;text-transform:uppercase;}
.pt-hw{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;}
.pt-hw .t{font-family:'Bricolage Grotesque',sans-serif;font-size:22px;font-weight:700;padding-top:4px;}
.pt-hw .s{font-size:12.5px;color:var(--mut);padding-top:2px;}
.pt-pill{font-size:11px;font-weight:700;color:var(--ok);background:#E3F5EA;border-radius:999px;padding:5px 9px;white-space:nowrap;}
.pt-steps{display:flex;flex-direction:column;}
.pt-step{display:grid;grid-template-columns:16px minmax(0,1fr) auto;gap:10px;align-items:center;padding:6px 0;font-size:13.5px;}
.pt-step i{width:11px;height:11px;border-radius:6px;background:var(--ok);display:block;}
.pt-step.last{font-weight:700;}
.pt-step.last i{box-shadow:0 0 0 4px #D6EDE0;}
.pt-step span{font-size:12px;color:var(--mut);}
.pt-box{background:#F6F8FB;border-radius:9px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;}
.pt-box .tag{font-size:11.5px;font-weight:700;color:var(--mut2);text-transform:uppercase;letter-spacing:.4px;}
.pt-box .x{font-size:13px;line-height:1.55;}
.pt-links{display:flex;justify-content:space-between;align-items:center;}
.pt-links a{font-size:13px;font-weight:600;color:var(--acc);text-decoration:none;}
.pt-rtext{font-size:13.5px;color:var(--body);line-height:1.5;padding-top:4px;}
.pt-list{display:flex;flex-direction:column;gap:8px;}
.pt-li{display:flex;align-items:center;gap:10px;font-size:13.5px;}
.pt-li i{width:20px;height:20px;border-radius:6px;background:var(--ok);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center;font-style:normal;flex:none;}
.pt-note{background:#EAF6EF;border-radius:9px;padding:11px 13px;font-size:13px;line-height:1.5;color:#0B5A36;}
.pt-person{display:flex;gap:10px;align-items:center;}
.pt-person .av{width:40px;height:40px;border-radius:20px;background:#E7EAF0;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700;color:var(--mut2);flex:none;}
.pt-person .av.s{background:var(--tint);color:var(--acc);}
.pt-person b{display:block;font-size:14px;font-weight:700;}
.pt-person span{font-size:12.5px;color:var(--mut);line-height:1.4;display:block;}
.pt-team-btns{display:flex;gap:10px;}
.pt-team-btns .pt-btn{flex:1;justify-content:center;height:42px;}
.pt-foot{font-size:11.5px;color:#6B7487;text-align:center;}

/* ── screen 2 + 3 parts: intro band, chips, menu tables, questions, install day ── */
.pt-intro{padding:28px 40px 4px;display:flex;flex-direction:column;gap:6px;}
.pt-back{font-size:13px;font-weight:600;color:var(--acc);}
.pt-intro .pt-h1{font-size:30px;}
.pt-intro .pt-lede{max-width:640px;}
.pt-main.menu{padding-top:20px;}
.pt-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:4px;}
.pt-chip{font-size:12px;font-weight:600;color:var(--mut2);background:var(--card);border:1px solid var(--line);border-radius:999px;padding:6px 11px;}
.pt-chip.ok{color:var(--ok);background:#E3F5EA;border-color:#CBEBD8;}
.pt-msec{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:20px 24px;display:flex;flex-direction:column;gap:12px;}
.pt-msec-h{display:flex;justify-content:space-between;align-items:baseline;gap:12px;}
.pt-msec-h span{font-size:12.5px;color:var(--mut);white-space:nowrap;}
.pt-menu{display:grid;grid-template-columns:minmax(0,1fr) 64px;gap:6px 12px;font-size:14px;align-items:baseline;}
.pt-menu.two{grid-template-columns:minmax(0,1fr) 64px 64px;}
.pt-mc{font-size:11.5px;font-weight:700;color:var(--mut);text-transform:uppercase;letter-spacing:.4px;text-align:right;}
.pt-mp{text-align:right;font-variant-numeric:tabular-nums;color:var(--mut2);}
.pt-more{font-size:12.5px;color:var(--acc);font-weight:600;padding-top:2px;}
.pt-withphoto{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;align-items:start;}
.pt-withphoto img{width:120px;height:120px;object-fit:cover;border-radius:10px;display:block;border:1px solid var(--line);}
.pt-opts{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.pt-opt{background:#F6F8FB;border-radius:9px;padding:10px 12px;}
.pt-opt b{display:block;font-size:12.5px;font-weight:700;}
.pt-opt span{display:block;font-size:12.5px;color:var(--mut);padding-top:2px;}
.pt-mnote{background:var(--warm);border-radius:9px;padding:10px 12px;font-size:12.5px;line-height:1.5;color:#6B3306;}
.pt-upd.ok{color:var(--ok);font-weight:700;}
.pt-q{display:flex;flex-direction:column;gap:8px;padding-top:4px;}
.pt-ql{font-size:13.5px;font-weight:600;line-height:1.4;}
.pt-input{display:flex;align-items:center;gap:6px;height:40px;border:1px solid var(--soft);border-radius:9px;padding:0 12px;font-size:15px;background:var(--card);}
.pt-input span{color:var(--mut);}
.pt-input b{font-weight:600;}
.pt-pills{display:flex;flex-wrap:wrap;gap:6px;}
.pt-pill-b{height:34px;display:inline-flex;align-items:center;padding:0 12px;border-radius:999px;font-size:12.5px;font-weight:600;border:1px solid var(--soft);background:var(--card);color:var(--ink);}
.pt-pill-b.on{background:var(--acc);color:#fff;border-color:var(--acc);}
.pt-sent{background:#E3F5EA;border-radius:10px;padding:12px 14px;}
.pt-sent b{display:block;font-size:13.5px;color:var(--ok);}
.pt-sent span{display:block;font-size:12.5px;color:#0B5A36;padding-top:2px;line-height:1.45;}
.pt-by{font-size:11.5px;color:var(--mut);}
.pt-also{display:flex;flex-direction:column;}
.pt-also-r{display:flex;justify-content:space-between;gap:12px;font-size:13.5px;padding:7px 0;border-top:1px solid var(--line2);}
.pt-also-r em{font-style:normal;font-size:12.5px;color:var(--mut);white-space:nowrap;}
.pt-list.gap{gap:12px;}
.pt-li.big{font-size:14.5px;display:grid;grid-template-columns:20px minmax(0,1fr) auto;gap:12px;}
.pt-li.big em{font-style:normal;font-size:12.5px;color:var(--mut);}
.pt-li i.n{background:var(--tint);color:var(--acc);}
.pt-note.warm{background:var(--warm);color:#6B3306;}
.pt-box .x.sub{color:var(--mut);font-size:12.5px;}
