/* Structure for the guided flows (choice chips, pick cards, wizard). Colours come from the Synlo brand in synlo-ui.css. */
:root{--accent:var(--brand)}
.nav-sub{display:none}.nav-sub.open{display:block}
.chipset{display:flex;flex-wrap:wrap;gap:8px;margin-top:2px}
.cs{border:1.5px solid var(--line);background:var(--surface);color:var(--text-2);border-radius:12px;padding:9px 14px;font:inherit;font-weight:600;font-size:13.5px;cursor:pointer;text-align:left;line-height:1.3;transition:border-color .12s,background .12s}
.cs:hover:not(:disabled){border-color:var(--brand);color:var(--brand)}
.cs.on{border-color:transparent;background:var(--grad);color:#fff;box-shadow:0 4px 12px rgba(109,76,238,.28)}
.cs:disabled{opacity:.4;cursor:not-allowed}
select.chipped{display:none!important}
.pickgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}
.pick{display:flex;flex-direction:column;gap:4px;padding:14px;border:1.5px solid var(--line);border-radius:14px;background:var(--surface);cursor:pointer;text-align:left;font:inherit;color:var(--text);transition:border-color .12s,background .12s}
.pick:hover{border-color:var(--brand-100)}.pick.on{border-color:var(--brand);background:var(--brand-50);box-shadow:0 0 0 4px rgba(109,76,238,.1)}
.pick b{font-size:14.5px}.pick small{color:var(--muted);font-size:12.5px;line-height:1.4}.pick .pk-p{font-weight:800;margin-top:4px;font-family:var(--font-d)}
.wz{max-width:680px;margin:0 auto}
.wz-bar{display:flex;gap:6px;margin-bottom:22px}.wz-bar i{flex:1;height:5px;border-radius:99px;background:var(--line)}.wz-bar i.on{background:var(--grad)}
.wz-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px;box-shadow:var(--shadow-sm)}
.wz-k{font-size:12px;color:var(--muted);font-weight:700;margin-bottom:6px}
.wz-card h2{font-size:20px;margin-bottom:4px}.wz-d{color:var(--muted);margin:0 0 20px}
.wz-foot{display:flex;justify-content:space-between;gap:10px;margin-top:16px}
.wz-sum{display:grid;grid-template-columns:130px 1fr;gap:10px 14px;font-size:14px}.wz-sum dt{color:var(--muted)}.wz-sum dd{margin:0;font-weight:600;word-break:break-word}
@media (max-width:600px){.wz-card{padding:18px}.wz-foot .btn{flex:1}.pickgrid{grid-template-columns:1fr}}
/* bottom tab bar is switched off for now */
.tabbar{display:none!important}
:root{--tabbar-h:0px}