/* BOLABO AI Workbench demo — page-level styles */
.app{padding:26px 0 70px}
.stage{display:flex;align-items:center;gap:16px;flex-wrap:wrap;padding:14px 20px;margin-bottom:18px}
.stage-l{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.stage-r{margin-left:auto;display:flex;gap:10px;align-items:center}
.stage.prod img{width:64px;height:64px;border-radius:12px;object-fit:cover}
.g2-1{grid-template-columns:1.55fr 1fr}
@media (max-width:980px){.g2-1{grid-template-columns:1fr}.g2{grid-template-columns:1fr}}
.sticky{position:sticky;top:calc(var(--hdr) + 14px)}
@media (max-width:980px){.sticky{position:static}}
.ch{font-size:14px;font-weight:800;margin:0 0 10px}
.rules{display:grid;gap:16px}
.rk{width:24px;height:24px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:inline-grid;place-items:center;font-weight:800;font-size:12.5px;flex:none}
.ico-l{width:44px;height:44px;border-radius:12px;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;margin-bottom:12px}
.nw{white-space:nowrap}

/* checker pieces */
mark{border-radius:3px;padding:0 2px;color:inherit}
mark.crit{background:var(--crit-bg);color:var(--crit-ink);border-bottom:2px solid var(--crit)}
mark.warn{background:var(--warn-bg);color:var(--warn-ink);border-bottom:2px solid var(--warn)}
.hl-text{background:var(--surface-2);border-radius:10px;padding:12px 14px;line-height:2;white-space:pre-wrap;font-size:14px;margin-top:12px;word-break:break-word}
.hl-text.big{font-size:14.5px;min-height:120px}
.hl-text.sm{font-size:12.5px;line-height:1.7;padding:0;background:none;margin-top:8px;white-space:normal}
.hl-text.sm:empty{display:none}
.score{display:flex;align-items:baseline;gap:6px}
.score b{font-size:46px;line-height:1;font-weight:800}
.score span{color:var(--muted);font-weight:700}
.score em{font-style:normal;font-weight:700;margin-left:8px;font-size:14px}
.score.good b,.score.good em{color:var(--good-ink)}.score.warn b,.score.warn em{color:var(--warn-ink)}.score.crit b,.score.crit em{color:var(--crit-ink)}
.cats{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.hitlist{list-style:none;margin:12px 0 0;padding:0;display:grid;gap:8px}
.hitlist li{font-size:13px;display:grid;gap:2px}
.hitlist small{color:var(--muted);font-size:12px;line-height:1.55}
.mini-res{min-height:200px}
.hit{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:10px;background:var(--surface)}
.hit .hh{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hit .q{font-size:15px}
.hit p{margin:8px 0;font-size:13.5px;color:var(--ink-2)}
.alts{display:flex;gap:8px;flex-wrap:wrap;align-items:center}

/* ---------- files ---------- */
.steps3{display:flex;gap:6px;list-style:none;margin:0 0 0 auto;padding:0;flex-wrap:wrap}
.steps3 li{display:flex;align-items:center;gap:8px;font-size:12.5px;font-weight:700;color:var(--muted);padding:5px 12px 5px 6px;border:1px solid var(--line);border-radius:99px}
.steps3 li i{width:20px;height:20px;border-radius:50%;background:var(--surface-3);display:grid;place-items:center;font-style:normal;font-size:11px}
.steps3 li.on{color:var(--brand);border-color:var(--brand-line);background:var(--brand-soft)}
.steps3 li.on i{background:var(--brand);color:var(--on-brand)}
.board{display:grid;grid-template-columns:1fr 350px;gap:18px;align-items:start}
@media (max-width:1060px){.board{grid-template-columns:1fr}}
.toolbar{display:flex;gap:12px;align-items:center;flex-wrap:wrap;padding:14px 16px;border-bottom:1px solid var(--line)}
.toolbar.t2{background:var(--surface-2)}
.toolbar .sp{margin-left:auto}
.search{position:relative;flex:1;min-width:190px}
.search .ic{position:absolute;left:11px;top:11px;color:var(--muted)}
.search input{padding-left:34px}
table.files td{vertical-align:top}
.fn{display:flex;gap:10px;align-items:flex-start}
.fn .ic{margin-top:3px;color:var(--brand)}
.fn small,.nn small{display:block;color:var(--muted);font-size:12px;line-height:1.5;word-break:break-all}
.nn b{font-size:13px;word-break:break-all}
.nn small .ic{margin-right:3px;vertical-align:-1px}
.tg{display:flex;gap:5px;flex-wrap:wrap;margin-top:5px}
.tg:empty{display:none}
.conf{display:inline-block;width:38px;height:6px;border-radius:9px;background:var(--surface-3);margin-right:6px;vertical-align:middle;overflow:hidden}
.conf i{display:block;height:100%;background:var(--c)}
tr.sel td{background:var(--brand-soft)!important}
tr.done td{opacity:.6}
tr[data-id]{cursor:pointer}
.empty{padding:34px;text-align:center;color:var(--muted)}
.detail{position:sticky;top:calc(var(--hdr) + 14px);overflow:hidden}
@media (max-width:1060px){.detail{position:static}}
.detail .hd h3{font-size:14px;word-break:break-all;display:flex;gap:6px;align-items:center}
.meta{display:grid;grid-template-columns:70px 1fr;gap:4px 10px;margin:12px 0;font-size:13px}
.meta dt{color:var(--muted)}.meta dd{margin:0;font-weight:600;word-break:break-all}
.dh{font-size:12.5px;color:var(--ink-2);margin:16px 0 8px;letter-spacing:.04em}
ul.why{list-style:none;margin:0;padding:0;display:grid;gap:6px;font-size:13px}
ul.why li{display:flex;gap:8px;align-items:flex-start}
ul.why li .ic{color:var(--good-ink);margin-top:4px}
ul.why.no li .ic{color:var(--crit-ink)}
.dact{display:flex;gap:8px;margin-top:14px}
.pv{border-radius:10px;overflow:hidden;background:var(--surface-2);min-height:120px;display:grid;place-items:center}
.pv.img img{width:100%;height:170px;object-fit:cover}
.pv.lock{padding:20px;text-align:center;gap:4px;color:var(--muted);align-content:center;justify-items:center}
.pv.lock small{font-size:12px}
.pv.logo{padding:16px}
.pv.paper{padding:16px 18px;display:block;background:#fff;color:#222;border:1px solid var(--line)}
.pv .ph{font-weight:800;text-align:center;letter-spacing:.3em;margin-bottom:12px;font-size:14px;color:#222;border-bottom:2px solid #222;padding-bottom:6px}
.pl{display:flex;gap:8px;align-items:center;font-size:11px;color:#666;margin:6px 0}
.pl i{flex:1;height:7px;border-radius:4px;background:#e4e7ec}
.pl.short{width:60%;height:7px;background:#e4e7ec;border-radius:4px}
.tree ul{list-style:none;margin:0;padding-left:18px}
.tree>ul{padding-left:0}
.tree summary{cursor:pointer;display:flex;align-items:center;gap:7px;padding:4px 0;list-style:none}
.tree summary::-webkit-details-marker{display:none}
.tree summary .ic{color:var(--brand)}
.tree summary em{font-style:normal;font-size:11.5px;background:var(--surface-3);border-radius:99px;padding:0 8px;color:var(--ink-2)}
.tree li.fl{font-size:13px;padding:2px 0;display:flex;align-items:center;gap:6px;color:var(--ink);word-break:break-all}
.tree li.fl .ic{color:var(--muted)}
.tree li.dim{opacity:.4;font-style:italic}
.pv2{display:grid;gap:6px}
.pv2 .k{font-size:12px;color:var(--muted);font-weight:700}
.pv2 .v{background:var(--surface-2);border-radius:9px;padding:9px 12px;font-size:13.5px;word-break:break-all;font-weight:600}
.pv2 .v.ok{background:var(--good-bg);color:var(--good-ink)}
.pv2 .ar{text-align:center;color:var(--muted)}
.scope{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.scope li{display:flex;gap:12px;align-items:center;border:1px solid var(--line);border-radius:12px;padding:12px 14px}
.scope li>div{flex:1}
.scope small{display:block;color:var(--muted);font-size:12px}
.scope .dot{width:26px;height:26px;border-radius:50%;background:var(--surface-3);display:grid;place-items:center;color:var(--muted)}
.scope li.on{border-color:var(--good);background:var(--good-bg)}
.scope li.on .dot{background:var(--good-ink);color:#fff}
.scope li.next{border-style:dashed}
ul.safe{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:13.5px}
ul.safe li{display:flex;gap:9px;align-items:flex-start}
ul.safe li .ic{color:var(--good-ink);margin-top:3px}
.sumgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center}
.sumgrid div{background:var(--surface-2);border-radius:10px;padding:10px 4px}
.sumgrid b{display:block;font-size:24px;line-height:1.2}
.sumgrid span{font-size:12px;color:var(--muted)}
.sumgrid .zero{background:var(--good-bg)}.sumgrid .zero b{color:var(--good-ink)}
ol.toc{padding-left:22px;display:grid;gap:8px}

/* ---------- salon ---------- */
.insight{padding:18px 22px}
.ins-h{font-weight:800;display:flex;gap:8px;align-items:center;margin-bottom:10px;color:var(--brand)}
ol.ins{margin:0;padding-left:20px;display:grid;gap:8px;font-size:14px}
.sm3 .card{min-width:0}
.funnel{display:grid;gap:4px}
.frow{display:grid;grid-template-columns:190px 1fr 78px;gap:12px;align-items:center;padding:6px 0;cursor:default}
@media (max-width:640px){.frow{grid-template-columns:1fr 60px}.frow .fl{grid-column:1/-1;font-size:13px;margin-bottom:-4px}}
.fl{font-weight:700;font-size:14px}
.ft{height:26px;background:var(--surface-2);border-radius:7px;overflow:hidden}
.ft i{display:block;height:100%;border-radius:0 6px 6px 0;min-width:4px}
.fv{text-align:right;font-weight:800;font-variant-numeric:tabular-nums;font-size:16px}
.rate{display:flex;align-items:center;gap:8px;font-size:12.5px;color:var(--muted);padding:2px 0 2px 8px}
.rate.worst{color:var(--ink);font-weight:600}
.rate .arrow{color:var(--axis)}
.adc{display:flex;gap:10px;align-items:center;min-width:230px}
.adc img{width:42px;height:42px;border-radius:8px;object-fit:cover;flex:none}
.adc small{display:block;color:var(--muted);font-size:11.5px;line-height:1.5}
.ad-sum{margin-top:6px;border-top:1px solid var(--line);padding-top:12px}
.sumrow{display:flex;gap:14px;flex-wrap:wrap;font-size:13px;color:var(--ink-2)}
.sumrow b{color:var(--ink);font-size:16px}
.prop{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px 20px;margin-bottom:14px;box-shadow:var(--shadow);transition:.2s}
.prop.approved{border-color:var(--good);box-shadow:0 0 0 3px color-mix(in srgb,var(--good) 14%,transparent)}
.prop.rejected{opacity:.55}
.prop header{display:flex;gap:12px;align-items:flex-start}
.prop h3{font-size:15.5px}
.pid{background:var(--brand);color:var(--on-brand);font-weight:800;border-radius:8px;padding:1px 9px;font-size:13px;flex:none;margin-top:2px}
.ptags{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0}
.pd{display:grid;grid-template-columns:96px 1fr;gap:8px 12px;margin:0;font-size:13.5px}
.pd dt{color:var(--muted);font-weight:700;font-size:12.5px}.pd dd{margin:0}
.pd .fr{display:inline-block;background:var(--surface-2);border-radius:7px;padding:2px 8px;margin-right:4px}
.pd .to{display:inline-block;background:var(--good-bg);color:var(--good-ink);border-radius:7px;padding:2px 8px;font-weight:600}
.pd .arr{color:var(--muted);margin-right:4px}
.prop footer{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.apcount{font-size:15px;margin-bottom:10px}.apcount b{font-size:28px}
.aplog{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:13.5px}
.aplog li{display:flex;gap:10px;align-items:flex-start}
.aplog small{display:block;color:var(--muted);font-size:11.5px}
.tg.approved,.aplog .tg{width:10px;height:10px;border-radius:50%;margin-top:7px;flex:none;background:var(--axis);display:block}
.aplog .tg.approved{background:var(--good)}.aplog .tg.hold{background:var(--warn)}.aplog .tg.rejected{background:var(--crit)}
pre.doc{white-space:pre-wrap;background:var(--surface-2);border-radius:10px;padding:14px;font-family:var(--font);font-size:13px;line-height:1.8;margin:0}
.lpwrap{display:grid;grid-template-columns:1fr 1fr;gap:24px 12px;justify-items:center}
.lpcol .cap{text-align:center;margin-bottom:10px}
.lpwrap.v-before .lpcol[data-col="after"],.lpwrap.v-after .lpcol[data-col="before"]{display:none}
.lpwrap.v-before,.lpwrap.v-after{grid-template-columns:1fr}
@media (max-width:760px){.lpwrap{grid-template-columns:1fr}}
.phone{width:288px;border:9px solid #1d232c;border-radius:34px;background:#1d232c;box-shadow:var(--shadow)}
.phone .scr{height:540px;overflow-y:auto;border-radius:24px;background:#fff;scrollbar-width:none}
.phone .scr::-webkit-scrollbar{display:none}
.lp{font-family:var(--font);color:#1b2330;background:#fff;font-size:12px;line-height:1.65;position:relative}
.lp-top{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid #e6e9ee;position:sticky;top:0;background:#fff;z-index:3}
.lp-menu{font-size:18px}
.lp-tel{background:#1c5cab;color:#fff;border-radius:99px;padding:3px 11px;font-size:11px;font-weight:700}
.lp-hero{height:170px;background-size:cover;background-position:center;position:relative}
.lp-hero.tall{height:230px}
.lp-hero .ov{position:absolute;inset:0;background:linear-gradient(0deg,rgba(0,0,0,.72),rgba(0,0,0,.05) 70%);color:#fff;padding:14px;display:flex;flex-direction:column;justify-content:flex-end}
.lp-hero h4{font-size:18px;line-height:1.35;margin:0 0 3px}
.lp-hero p{margin:0;font-size:11.5px;opacity:.92}
.lp-sec{padding:14px}
.lp-sec h5{font-size:13px;margin:0 0 6px;border-left:4px solid #1c5cab;padding-left:8px}
.lp-sec ul{margin:0;padding-left:18px}
.lp-sec p{margin:0 0 6px}
.lp-gray{color:#8a919c}
.lp-btn{display:block;text-align:center;background:#1c5cab;color:#fff;padding:12px;border-radius:9px;font-weight:800;margin:8px 14px;font-size:14px}
.lp-btn.sm{display:inline-block;padding:5px 12px;font-size:11px;background:#8a919c;font-weight:600;margin:4px 0}
.lp-btn.ghost{background:#fff;color:#1c5cab;border:2px solid #1c5cab}
.lp-cta{position:relative;padding:6px 0}
.lp-badges{position:relative;display:flex;gap:6px;flex-wrap:wrap;padding:10px 14px;font-size:11px}
.lp-badges span{background:#eef4fc;border-radius:99px;padding:3px 10px;display:inline-flex;gap:4px;align-items:center;color:#1c5cab;font-weight:700}
.lp-tb{width:100%;border-collapse:collapse;font-size:11.5px}.lp-tb td{padding:6px 4px;border-bottom:1px solid #e6e9ee}
.lp-fix{position:sticky;bottom:0;display:grid;grid-template-columns:2fr 1fr;background:#fff;box-shadow:0 -6px 14px rgba(0,0,0,.14);padding:6px 4px;z-index:3}
.lp-fix .lp-btn{margin:2px 4px;padding:9px}
.lp .pin{display:inline-grid;place-items:center;width:19px;height:19px;border-radius:50%;background:#eb6834;color:#fff;font-size:10.5px;font-style:normal;font-weight:800;margin-left:6px;vertical-align:middle;line-height:1}
.lp-cta>.pin,.lp-badges>.pin,.lp-fix>.pin{position:absolute;left:2px;top:-2px;margin:0;z-index:4}
.lp .hl{outline:3px solid #eb6834;outline-offset:2px;border-radius:6px}
ol.lpnotes{grid-column:1/-1;list-style:none;margin:6px 0 0;padding:0;display:grid;gap:8px;width:100%;max-width:760px}
.lpwrap.v-before .lpnotes{display:none}
.lpnotes li{display:flex;gap:10px;align-items:flex-start;border:1px solid var(--line);border-radius:10px;padding:10px 12px;cursor:pointer;font-size:13.5px}
.lpnotes li b{background:var(--s2);color:#fff;border-radius:50%;width:22px;height:22px;display:grid;place-items:center;font-size:12px;flex:none}
.lpnotes li.hl{border-color:var(--s2);background:color-mix(in srgb,var(--s2) 10%,var(--surface))}
.cg{display:grid;grid-template-columns:1fr;gap:14px}
.gv{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:12px;background:var(--surface)}
.gvh{display:flex;gap:10px;align-items:center;justify-content:space-between;margin-bottom:8px;flex-wrap:wrap}
.gv label.f{margin-top:10px;display:flex;justify-content:space-between}
.cc{font-weight:600;color:var(--muted)}.cc.over{color:var(--crit-ink);font-weight:800}
.imgs{display:grid;gap:14px}
.im{margin:0;position:relative;border-radius:12px;overflow:hidden}
.im img{width:100%;height:190px;object-fit:cover}
.im .ov{position:absolute;left:0;right:0;top:0;height:190px;background:linear-gradient(0deg,rgba(0,0,0,.7),rgba(0,0,0,.02) 65%);color:#fff;padding:12px 14px;display:flex;flex-direction:column;justify-content:flex-end;gap:6px;align-items:flex-start}
.im .ov b{font-size:15px;line-height:1.4;text-shadow:0 1px 6px rgba(0,0,0,.5)}
.im .bd{background:#eb6834;color:#fff;font-size:11px;font-weight:800;padding:2px 9px;border-radius:99px}
.im figcaption{font-size:12px;color:var(--muted);padding:6px 2px 0}
.calc{display:grid;gap:8px;background:var(--surface-2);border-radius:12px;padding:14px}
.cv2{display:flex;justify-content:space-between;align-items:baseline;font-size:13.5px;gap:10px}
.cv2 b{font-size:20px}.cv2 small{font-size:12px;color:var(--muted);margin-left:3px;font-weight:600}
.cdiff{font-size:13px;border-radius:9px;padding:9px 12px;margin-top:4px}
.cdiff.up{background:var(--warn-bg);color:var(--ink)}.cdiff.dn{background:var(--good-bg);color:var(--ink)}
.need{margin:8px 0 0;padding-left:18px;font-size:13.5px;display:grid;gap:4px}
.btnrow{display:flex;gap:8px;flex-wrap:wrap}
table.hm{border-collapse:separate;border-spacing:4px;width:100%;min-width:480px}
table.hm th{font-size:12px;color:var(--ink-2);font-weight:700;padding:6px}
table.hm td{text-align:center;padding:12px 4px;border-radius:9px;font-weight:700;font-size:13.5px;color:var(--ink)}
table.hm td.cur{outline:3px solid var(--s2);outline-offset:-1px}
table.hm td.imp{outline:3px dashed var(--good);outline-offset:-1px}
ol.prio{list-style:none;margin:0;padding:0;display:grid;gap:12px}
ol.prio li{display:flex;gap:12px;align-items:flex-start}
ol.prio small{display:block;color:var(--muted);font-size:12px}
.pt{cursor:pointer}.pt:hover circle,.pt:focus circle{r:16}

/* ---------- preorder ---------- */
.gapcard .gap-h{font-size:17px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:12px}
.gapcard .gap-h b{font-size:30px}
.pbar{position:relative;height:14px;border-radius:99px;background:var(--surface-3);overflow:hidden}
.pbar .a{position:absolute;left:0;top:0;bottom:0;background:var(--s2);border-radius:99px 0 0 99px}
.pbar .f{position:absolute;top:0;bottom:0;background:repeating-linear-gradient(45deg,var(--s2) 0 5px,transparent 5px 9px);opacity:.55}
.pbar.sm{height:10px}.pbar .ref{position:absolute;top:-2px;bottom:-2px;width:2px;background:var(--ink)}
.pbl{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-top:6px}
ul.sug{list-style:none;margin:0;padding:0;display:grid;gap:12px;font-size:13.5px}
ul.sug li{display:flex;gap:10px;align-items:flex-start}
.scn{display:grid;gap:14px}
.sc{border:1px solid var(--line);border-radius:12px;padding:14px;display:grid;gap:8px}
.sh{display:flex;gap:10px;align-items:baseline;flex-wrap:wrap}.sh b{font-size:16px}
.sn{display:flex;align-items:center;gap:10px;margin-top:6px}.sn b{font-size:22px}
.hbars{display:grid;gap:10px}
.hb{display:grid;grid-template-columns:150px 1fr 60px;gap:10px;align-items:center;cursor:default}
@media (max-width:520px){.hb{grid-template-columns:100px 1fr 46px}}
.hb .hl{font-size:13px;font-weight:700;line-height:1.35}
.hb .hl small{display:block;font-weight:500;color:var(--muted);font-size:11px}
.ht{height:18px;background:var(--surface-2);border-radius:6px;overflow:hidden}
.ht i{display:block;height:100%;border-radius:0 5px 5px 0}
.hv{font-weight:800;font-size:13.5px;text-align:right;font-variant-numeric:tabular-nums}
ol.posts{list-style:none;margin:0;padding:0;display:grid;gap:10px}
ol.posts li{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--line);padding-bottom:10px}
ol.posts li:last-child{border:0;padding:0}
ol.posts img{width:52px;height:52px;border-radius:10px;object-fit:cover}
ol.posts li>div{flex:1;font-size:13.5px}
ol.posts .pcnt{font-size:13px;color:var(--muted)}ol.posts .pcnt b{font-size:20px;color:var(--ink)}
.chp{display:inline-block;font-size:10.5px;font-weight:800;padding:0 6px;border-radius:5px;border:1px solid var(--brand-line);background:var(--brand-soft);color:var(--brand);line-height:1.6;margin-right:3px}
.cw{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center;font-size:12px;color:var(--muted);font-weight:700;margin-bottom:4px}
.cg7{display:grid;grid-template-columns:repeat(7,1fr);gap:4px}
.cd{min-height:78px;border:1px solid var(--line);background:var(--surface);border-radius:9px;padding:5px 5px 4px;text-align:left;cursor:pointer;display:flex;flex-direction:column;gap:3px;font-family:inherit;color:inherit}
.cd.out{border:0;background:none;cursor:default}
.cd:hover:not(.out):not(.off){border-color:var(--brand)}
.cd.off{opacity:.35;cursor:default}
.cd.past{background:var(--surface-2)}
.cd.today{outline:2px solid var(--s2);outline-offset:-1px}
.cd.sel{background:var(--brand-soft);border-color:var(--brand)}
.cd .dn{font-size:12px;font-weight:800}
.cd em{font-style:normal;font-size:10px;font-weight:800;color:var(--s2);line-height:1.2}
.cd .cps{display:flex;gap:2px;flex-wrap:wrap}
.cd .chp{font-size:9.5px;padding:0 4px;margin:0}
@media (max-width:640px){.cd{min-height:56px}.cd .chp{font-size:8.5px;padding:0 2px}.cd em{display:none}}
.dpost{border:1px solid var(--line);border-radius:10px;padding:11px 13px;margin-bottom:10px;display:grid;gap:6px;font-size:13.5px}
.dps{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.chkgrid{display:flex;gap:8px;flex-wrap:wrap}
.sw2{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);border-radius:99px;padding:6px 13px;font-size:13px;font-weight:600;cursor:pointer;background:var(--surface)}
.sw2:has(input:checked){border-color:var(--brand);background:var(--brand-soft);color:var(--brand)}
.tasks{list-style:none;margin:0;padding:0;display:grid;gap:10px}
.tasks .switch{align-items:flex-start;font-weight:500;font-size:13.5px}
.tasks .switch input{margin-top:1px}
.phh{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}

/* ---------- report ---------- */
.rep-grid{display:grid;grid-template-columns:270px 1fr;gap:20px;align-items:start}
@media (max-width:980px){.rep-grid{grid-template-columns:1fr}}
.rep-side{position:sticky;top:calc(var(--hdr) + 14px)}
@media (max-width:980px){.rep-side{position:static}}
.paper2{background:var(--surface);border:1px solid var(--line);border-radius:6px;box-shadow:var(--shadow);padding:34px 38px;min-width:0}
@media (max-width:640px){.paper2{padding:20px 16px}}
.paper2 section{margin-top:24px}
.paper2 h4{font-size:15px;border-left:4px solid var(--brand);padding-left:10px;margin-bottom:10px}
.rp-h{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;border-bottom:2px solid var(--ink);padding-bottom:14px}
.rp-h .brand small{font-size:12px;letter-spacing:.02em}
.rp-m{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
ul.rp-sum{margin:0;padding-left:20px;display:grid;gap:6px;font-size:14px}
.rp-t tr.grp td{background:var(--surface-2);font-weight:800;font-size:12.5px}
.d.up{color:var(--good-ink);font-weight:700}.d.down{color:var(--crit-ink);font-weight:700}
.cols2{display:grid;grid-template-columns:1fr 1fr;gap:20px}
@media (max-width:640px){.cols2{grid-template-columns:1fr}}
ul.rp-l{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:13.5px}
ul.rp-l li{display:flex;gap:8px;align-items:flex-start}
ul.rp-l.g .ic{color:var(--good-ink);margin-top:4px}ul.rp-l.b .ic{color:var(--warn-ink);margin-top:4px}
ul.rp-act{list-style:none;margin:0;padding:0;display:grid;gap:8px}
ul.rp-act li{display:flex;justify-content:space-between;gap:10px;align-items:center;border:1px solid var(--line);border-radius:10px;padding:10px 12px;font-size:13.5px}
ul.rp-act label{display:flex;gap:10px;align-items:center;cursor:pointer}
.rp-f{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:28px;padding-top:12px;border-top:1px solid var(--line);font-size:11.5px;color:var(--muted)}

/* ---------- how ---------- */
.arch{display:grid;grid-template-columns:1fr auto 1fr auto 1fr auto 1fr auto 1fr;gap:8px;align-items:stretch}
.arch .col{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.arch .col h4{font-size:14px}
.arch .col ul{margin:0;padding-left:16px;font-size:13px;display:grid;gap:3px;color:var(--ink-2);flex:1}
.arch .col.human{border-color:var(--s2);box-shadow:0 0 0 3px color-mix(in srgb,var(--s2) 16%,transparent)}
.arch .ar{align-self:center;color:var(--axis);font-size:22px;font-weight:800}
@media (max-width:1060px){.arch{grid-template-columns:1fr}.arch .ar{transform:rotate(90deg);justify-self:center}}
table.plans th,table.plans td{vertical-align:top;font-size:13.5px}
table.plans tbody th{background:var(--surface-2);font-size:12.5px}
table.plans thead th{font-size:14px;padding:12px}
table.plans .rec{background:color-mix(in srgb,var(--brand-soft) 70%,transparent)}
table.plans thead th.rec{background:var(--brand);color:var(--on-brand)}
.lv{font-weight:800}
.steps4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media (max-width:900px){.steps4{grid-template-columns:repeat(2,1fr)}}@media (max-width:560px){.steps4{grid-template-columns:1fr}}
.steps4 h3{font-size:15.5px;margin:10px 0 6px}
ul.chk{list-style:none;margin:0;padding:0;display:grid;gap:8px;font-size:14px}
ul.chk li{display:flex;gap:9px;align-items:flex-start}
ul.chk li .ic{color:var(--good-ink);margin-top:4px}
ol.qs{margin:10px 0 0;padding-left:20px;display:grid;gap:7px;font-size:13.5px}
.cta-band{margin-top:28px;background:linear-gradient(100deg,#0f3f7a,#1c5cab);color:#fff;border-radius:18px;padding:26px 30px;display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.cta-band h3{font-size:19px}.cta-band p{margin:6px 0 0;color:#dbe6f5}
.lvh{display:flex;gap:12px;align-items:center;margin-bottom:14px}
.lvf{display:flex;gap:18px;flex-wrap:wrap;margin-top:16px;padding:12px 14px;background:var(--surface-2);border-radius:10px;font-size:13.5px;font-weight:600}
@media (max-width:560px){.hero .wrap{padding:48px 0 52px}.sec{padding:44px 0}.card .bd{padding:16px}}

.board>*{min-width:0}
.toolbar .seg{max-width:100%;overflow-x:auto}
.flow.f4{grid-template-columns:repeat(4,1fr)}
@media (max-width:900px){.flow.f4{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.flow.f4{grid-template-columns:1fr}}
.chart svg.ic,.viewtoggle svg{width:14px;height:14px;display:inline-block;flex:none}
.lp-hero h4{word-break:keep-all;overflow-wrap:anywhere}
