/* Kotizly — a complete workspace design system. */
:root {
    --ink:#17243c; --ink-soft:#3c4961; --muted:#6d7890;
    --paper:#f5f7fb; --surface:#fff; --surface-soft:#f7f9fc;
    --line:#e7ebf2; --line-strong:#d8deea;
    --brand:#4265ed; --brand-dark:#3454d1; --brand-soft:#edf1ff;
    --navy:#111a30; --green:#188267; --green-soft:#e8f7f1;
    --danger:#c54452; --danger-soft:#fff0f1;
    --shadow-sm:0 2px 4px #15254803; --shadow:0 8px 28px #15254808;
    --shadow-lg:0 24px 65px -18px #182f6430;
    --radius:16px;
    --font-display:Manrope,"DM Sans",system-ui,sans-serif;
    --font-sans:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:90px; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--font-sans); font-size:14px; line-height:1.6; -webkit-font-smoothing:antialiased; }
[hidden] { display:none !important; }
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
button { cursor:pointer; }
button:disabled { cursor:default; opacity:.55; box-shadow:none; }
img,svg { max-width:100%; }
::selection { background:#dce4ff; }
:focus-visible { outline:3px solid #91a6ff; outline-offset:3px; }
h1,h2,h3,h4,p { margin-top:0; }
h1,h2,h3,h4 { font-family:var(--font-display); line-height:1.3; font-weight:750; letter-spacing:-.035em; }
h1 { font-size:36px; } h2 { font-size:19px; } h3 { font-size:17px; }
p { margin-bottom:1rem; }
.icon { flex-shrink:0; vertical-align:middle; width:20px; height:20px; }
.muted,.page-head p,.panel-head p,.section-heading p { color:var(--muted); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position:fixed; top:-80px; left:20px; z-index:200; padding:10px 20px; background:var(--brand); color:#fff; border-radius:8px; }
.skip-link:focus { top:10px; }
.brand { display:inline-flex; align-items:center; gap:10px; font-family:var(--font-display); font-size:27px; font-weight:800; letter-spacing:-1.4px; white-space:nowrap; }
.brand-mark { display:inline-grid; place-items:center; width:36px; height:39px; color:#fff; background:var(--brand); border-radius:11px 11px 11px 3px; font-size:32px; line-height:1; font-weight:800; letter-spacing:-2px; padding:0 3px 6px 0; }
.brand-dot { color:#7f98ff; }
.button { display:inline-flex; align-items:center; justify-content:center; gap:9px; min-height:44px; padding:11px 19px; border:1px solid transparent; border-radius:9px; background:var(--brand); color:#fff; font-size:13px; font-weight:650; line-height:1.45; box-shadow:0 3px 6px #4265ed18; transition:background .18s,box-shadow .18s,transform .18s; }
.button:hover { background:var(--brand-dark); box-shadow:0 5px 15px #4265ed25; transform:translateY(-1px); }
.button:active { transform:translateY(0); }
.button .icon { width:17px; height:17px; }
.button-small { min-height:38px; padding:9px 15px; font-size:12px; }
.button-quiet { background:#fff; color:var(--ink-soft); border-color:var(--line-strong); box-shadow:var(--shadow-sm); }
.button-quiet:hover { color:var(--brand-dark); background:var(--brand-soft); border-color:#bac8fb; box-shadow:none; }
.button-danger { background:var(--danger); }
.button-danger:hover { background:#ab3543; }
.text-button { padding:0; border:0; background:none; font-size:12px; color:var(--muted); font-weight:600; }
.text-link { display:inline-flex; gap:7px; align-items:center; color:var(--brand-dark); font-size:12px; font-weight:650; }
.text-link .icon { width:16px; height:16px; }
.danger { color:var(--danger) !important; }
.icon-button { display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; flex-shrink:0; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--muted); }
.icon-button:hover { background:var(--brand-soft); color:var(--brand); }
.eyebrow,.step-kicker { display:block; margin-bottom:9px; color:var(--brand-dark); font-size:10px; font-weight:700; letter-spacing:1.8px; text-transform:uppercase; }
.avatar { display:inline-grid; place-items:center; flex-shrink:0; width:36px; height:36px; border-radius:50%; background:#edf0fd; color:var(--brand-dark); font-family:var(--font-display); font-weight:750; font-size:13px; }
.blue { background:#edf1ff; color:#4265ed; } .violet { background:#f2edff; color:#9366db; } .amber { background:#fff6e7; color:#c78a35; } .mint { background:#eaf8f2; color:#259977; }
/* Navigation and workspace */
.app-shell { display:grid; grid-template-columns:242px minmax(0,1fr); min-height:100vh; }
.sidebar { position:sticky; top:0; height:100dvh; display:flex; flex-direction:column; padding:28px 18px 0; background:var(--navy); color:#c0c9df; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#303f5d transparent; }
.sidebar-brand { display:flex; align-items:center; justify-content:space-between; padding:0 13px; }
.sidebar .brand { color:#fff; }
.sidebar .brand-mark { background:#5173fb; }
.sidebar-close { display:none; }
.workspace-switch { display:flex; align-items:center; gap:10px; padding:13px 11px; margin:28px 0 27px; border:1px solid #ffffff14; border-radius:10px; background:#ffffff04; }
.workspace-switch > span:nth-child(2) { flex:1; min-width:0; }
.workspace-switch strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#e8ecf8; font-size:11px; font-weight:600; }
.workspace-switch small { display:block; color:#98a7c5; font-size:9px; }
.workspace-switch > .icon { width:13px; }
.workspace-monogram { display:grid; place-items:center; width:31px; height:33px; flex-shrink:0; background:#293956; color:#c5d1ed; border:1px solid #41516e; border-radius:7px; font-size:12px; }
.nav-caption { display:block; margin:0 13px 9px; color:#8391ae; font-size:9px; font-weight:600; letter-spacing:1.5px; text-transform:uppercase; }
.nav-caption-secondary { margin-top:28px; }
.side-nav { display:grid; gap:5px; }
.side-nav a { display:flex; align-items:center; gap:12px; padding:12px 14px; min-height:45px; border-radius:8px; color:#a9b5cf; font-size:12px; font-weight:500; transition:background .18s,color .18s; }
.side-nav .icon { width:18px; height:18px; }
.side-nav a:hover { color:#fff; background:#ffffff08; }
.side-nav a.active { background:#4265ed; color:#fff; box-shadow:0 5px 18px #00000013; }
.side-nav a.active:after { content:""; width:5px; height:5px; border-radius:50%; background:#c0d0ff; margin-left:auto; }
.sidebar-bottom { margin-top:auto; padding-top:35px; }
.sidebar-promo { position:relative; padding:17px 14px; border:1px solid #ffffff0e; border-radius:11px; background:linear-gradient(125deg,#1c2a47,#1b2541); }
.promo-icon { display:flex; margin-bottom:10px; color:#a1b6ff; }
.promo-icon .icon { width:21px; height:21px; }
.sidebar-promo strong { display:block; color:#edf1ff; font-family:var(--font-display); font-size:12px; }
.sidebar-promo p { margin:6px 0 13px; font-size:11px; color:#a4b1cd; line-height:1.6; }
.sidebar-promo a { display:flex; align-items:center; justify-content:space-between; font-size:11px; color:#b6c7ff; font-weight:600; }
.sidebar-promo a .icon { width:15px; height:15px; }
.sidebar-foot { padding-top:20px; }
.market-select { width:auto; max-width:100%; min-height:34px; padding:6px 28px 6px 10px; background:var(--surface-soft); color:var(--ink-soft); border:1px solid var(--line); border-radius:7px; font-size:11px; cursor:pointer; }
.market-select-inverse { width:100%; background:#18233b; color:#bcc9e2; border-color:#ffffff0f; font-size:10px; }
.market-select-inverse option { color:var(--ink); background:#fff; }
.sidebar-user { display:flex; justify-content:space-between; align-items:center; gap:8px; padding:18px 0; margin-top:17px; border-top:1px solid #ffffff0e; }
.sidebar-user > a { display:flex; gap:10px; align-items:center; min-width:0; }
.sidebar-user > a > span:last-child { min-width:0; }
.sidebar-user strong { display:block; max-width:125px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:11px; font-weight:600; color:#e0e8f8; }
.sidebar-user small { display:block; color:#96a4bf; font-size:9px; }
.sidebar-user .avatar { background:#2d3d5d; color:#c9d7f7; width:33px; height:33px; font-size:12px; }
.logout-button { display:grid; place-items:center; width:29px; height:34px; border:0; background:none; color:#8f9ebb; }
.logout-button .icon { width:17px; }
.logout-button:hover { color:#fff; }
.workspace { min-width:0; }
.workspace-header { position:sticky; top:0; z-index:25; display:flex; justify-content:space-between; align-items:center; min-height:77px; gap:16px; padding:15px 36px; background:#ffffffed; backdrop-filter:blur(18px); border-bottom:1px solid var(--line); }
.breadcrumb { display:flex; align-items:center; gap:14px; color:var(--muted); font-size:11px; }
.breadcrumb > .icon { width:12px; height:12px; color:#aab3c3; }
.breadcrumb strong { color:var(--ink); font-weight:550; }
.topbar-actions { display:flex; align-items:center; gap:20px; }
.global-search { display:flex; align-items:center; gap:8px; color:#8c98ad; }
.global-search .icon { width:16px; height:16px; }
.global-search input { width:155px; padding:4px; border:0; min-height:32px; background:transparent; font-size:11px; }
.global-search input:focus { box-shadow:none; }
.locale-chip { display:inline-flex; align-items:center; gap:6px; color:var(--ink-soft); font-size:11px; font-weight:600; }
.locale-chip .icon { width:15px; height:15px; color:var(--muted); }
.topbar-avatar { width:32px; height:32px; border:3px solid #fff; outline:1px solid var(--line); }
.mobile-menu,.sidebar-backdrop { display:none; }
.main-content { width:100%; max-width:1560px; margin:auto; padding:35px 36px 0; }
.page-head { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:27px; }
.page-head h1 { margin-bottom:8px; font-size:29px; letter-spacing:-1px; }
.page-head .eyebrow { font-size:9px; letter-spacing:1.5px; margin-bottom:7px; }
.page-head p { margin:0; font-size:12px; }
.page-head > .button { flex-shrink:0; }
.greeting-dot { color:var(--brand); }
.workspace-footer { display:flex; justify-content:space-between; align-items:center; color:#8892a5; font-size:10px; padding:28px 0 22px; margin-top:18px; }
.workspace-footer > span:last-child { display:flex; gap:7px; align-items:center; }
.workspace-footer .icon { width:13px; height:13px; }
/* Dashboard */
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:17px; margin-bottom:22px; }
.metric-card { display:flex; flex-direction:column; justify-content:space-between; min-width:0; min-height:164px; padding:19px 20px; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.metric-label { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.metric-label > span:first-child,.metric-card > span { font-size:11px; font-weight:500; color:var(--muted); }
.metric-icon { display:inline-flex; align-items:center; justify-content:center; width:33px; height:33px; flex-shrink:0; border-radius:9px; }
.metric-icon .icon { width:17px; height:17px; }
.metric-card > strong,.metric-values > strong { display:block; font-family:var(--font-display); font-size:28px; line-height:1.4; font-weight:750; letter-spacing:-1px; font-variant-numeric:tabular-nums; margin:8px 0; }
.metric-values > .multiple-value { font-size:20px; margin:4px 0; }
.metric-card small { display:flex; align-items:center; gap:5px; font-size:10px; color:var(--muted); }
.metric-card small .icon { width:12px; height:12px; }
.metric-accent { position:relative; overflow:hidden; color:#fff; border-color:#4265ed; background:linear-gradient(120deg,#4265ed,#567af5); }
.metric-accent:after { content:""; position:absolute; width:170px; height:170px; right:-65px; top:40px; border:1px solid #ffffff14; border-radius:50%; box-shadow:0 0 0 24px #ffffff04,0 0 0 48px #ffffff03; pointer-events:none; }
.metric-accent .metric-label > span:first-child,.metric-accent > span,.metric-accent small { color:#e0e7ff; }
.metric-accent .metric-icon { background:#ffffff1c; color:#fff; }
.dashboard-analytics,.dashboard-lower { display:grid; grid-template-columns:minmax(0,1.85fr) minmax(270px,1fr); gap:22px; margin-bottom:22px; }
.panel { background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); padding:23px; min-width:0; }
.panel-head { display:flex; justify-content:space-between; align-items:center; gap:14px; margin-bottom:21px; }
.panel-head h2 { margin:0 0 5px; font-size:15px; letter-spacing:-.3px; }
.panel-head p { margin:0; font-size:11px; }
.panel-head a { color:var(--brand-dark); }
.period-pill { display:inline-flex; align-items:center; gap:6px; padding:6px 10px; border:1px solid var(--line); border-radius:7px; font-size:9px; color:var(--ink-soft); white-space:nowrap; }
.period-pill .icon { width:12px; height:12px; }
.chart-legend { display:flex; justify-content:flex-end; gap:18px; margin:0 0 8px; }
.chart-legend > span { display:flex; align-items:center; gap:6px; color:var(--muted); font-size:9px; }
.legend-dot { display:inline-block; width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.legend-dot.blue { background:#5578f4; }.legend-dot.mint { background:#90d9c2; }
.activity-chart { display:flex; height:209px; position:relative; }
.chart-axis { display:flex; flex-direction:column; justify-content:space-between; width:26px; flex-shrink:0; padding-bottom:28px; color:#99a2b3; font-size:9px; }
.chart-plot { flex:1; min-width:0; display:flex; gap:8px; background:repeating-linear-gradient(to top,transparent 0,transparent calc(50% - 1px),var(--line) calc(50% - 1px),var(--line) 50%) 0 0/100% calc(100% - 28px) no-repeat; }
.chart-column { flex:1; display:flex; flex-direction:column; align-items:center; min-width:0; }
.bar-pair { position:relative; display:flex; align-items:flex-end; justify-content:center; gap:5px; height:calc(100% - 28px); width:100%; padding:0 9px; border-radius:4px; }
.chart-bar { width:22px; max-width:40%; height:var(--bar-height); min-height:2px; background:#5578f4; border-radius:5px 5px 0 0; transition:opacity .18s; }
.bar-accepted { background:#95d8c4; }
.bar-pair:hover .chart-bar { opacity:.8; }
.chart-month { padding-top:9px; color:#8b95a7; font-size:9px; }
.chart-tooltip { position:absolute; bottom:105%; left:50%; z-index:5; transform:translateX(-50%); background:var(--navy); color:#fff; padding:7px 9px; border-radius:6px; font-size:10px; white-space:nowrap; opacity:0; pointer-events:none; }
.chart-column:first-child .chart-tooltip { left:0; transform:none; }
.chart-column:last-child .chart-tooltip { left:auto; right:0; transform:none; }
.bar-pair:hover .chart-tooltip,.bar-pair:focus-visible .chart-tooltip { opacity:1; }
.chart-empty { position:absolute; inset:0 0 28px 26px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:9px; background:#ffffffcc; text-align:center; padding:15px; }
.chart-empty .empty-icon { margin:0; width:43px; height:43px; }
.chart-empty strong { font-size:12px; font-weight:500; }
.chart-empty a { color:var(--brand-dark); font-size:11px; }
.chart-empty a .icon { width:14px; }
.pipeline-total { display:flex; align-items:baseline; gap:7px; }
.pipeline-total > strong { font-family:var(--font-display); font-size:34px; line-height:1.3; font-weight:750; letter-spacing:-1px; }
.pipeline-total > span:nth-child(2) { color:var(--muted); font-size:11px; }
.pipeline-total .status-pill { margin-left:auto; font-size:9px; }
.pipeline-track { display:flex; height:9px; background:#f0f3f8; border-radius:5px; overflow:hidden; gap:2px; margin:17px 0 21px; }
.pipeline-segment { height:100%; }
.segment-draft { background:#b8c1d5; }.segment-sent { background:#5c7bf0; }.segment-viewed { background:#a08ae1; }.segment-accepted { background:#65c6a5; }.segment-declined { background:#e4979e; }.segment-expired { background:#dbc397; }
.pipeline-list { display:grid; grid-template-columns:1fr 1fr; gap:14px 24px; }
.pipeline-list a { display:flex; justify-content:space-between; align-items:center; gap:12px; font-size:10px; }
.pipeline-list a > span { display:flex; gap:7px; align-items:center; color:var(--muted); }
.pipeline-list a:hover span { color:var(--brand-dark); }
.pipeline-list strong { font-weight:600; }
.record-row { display:grid; grid-template-columns:36px minmax(0,1fr) auto auto 12px; gap:12px; align-items:center; padding:15px 0; border-top:1px solid var(--line); }
.record-row:hover .record-main strong { color:var(--brand); }
.record-icon { display:grid; place-items:center; width:36px; height:36px; border-radius:10px; background:#edf1fc; color:#6983bf; font-weight:650; font-size:12px; }
.record-row:nth-child(3n+2) .record-icon { background:#f5effc; color:#9876b9; }.record-row:nth-child(3n) .record-icon { background:#eaf6f3; color:#64a18f; }
.record-main { min-width:0; display:grid; gap:2px; }
.record-main strong { font-size:12px; font-weight:600; }
.record-main span { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:10px; color:var(--muted); }
.record-amount { font-size:11px; font-weight:650; font-variant-numeric:tabular-nums; white-space:nowrap; }
.record-arrow { width:12px; height:12px; color:#a4aec0; }
.quick-actions { padding-top:8px; }
.quick-actions > h2 { font-size:13px; margin:0 0 14px 3px; }
.action-card { display:flex; gap:13px; align-items:flex-start; padding:19px 17px; margin-bottom:12px; background:#edf0fa; border:1px solid #e3e8f4; border-radius:13px; transition:background .18s; }
.action-card:last-child { background:#eaf4f1; border-color:#deede8; }
.action-card:hover { background:#e3e9fa; }
.action-card > div { flex:1; }
.action-card strong { font-family:var(--font-display); font-size:12px; font-weight:750; }
.action-card p { font-size:11px; color:var(--muted); margin:5px 0 0; line-height:1.7; }
.action-card > .icon { width:14px; height:14px; color:#8b9bbd; margin-top:3px; }
/* Forms, records, states */
.empty-state { padding:50px 20px; text-align:center; }
.empty-icon { display:inline-flex; align-items:center; justify-content:center; width:54px; height:54px; border:1px solid #e2e9fc; border-radius:16px; color:#7591e4; background:#f1f5ff; margin-bottom:16px; }
.empty-icon .icon { width:24px; height:24px; }
.empty-state h2,.empty-state h3 { font-size:17px; margin:0 0 7px; }
.empty-state p { color:var(--muted); font-size:12px; max-width:350px; margin:0 auto 20px; }
.status-pill { display:inline-flex; align-items:center; justify-content:center; gap:5px; padding:4px 8px; border:1px solid transparent; border-radius:5px; font-size:9px; line-height:1.3; font-weight:550; color:#567184; background:#edf3f7; white-space:nowrap; }
.status-pill:before { content:""; width:4px; height:4px; border-radius:50%; background:currentColor; flex-shrink:0; }
.status-draft { color:#73829b; background:#eef1f6; }.status-sent { color:#4e6edb; background:#edf1ff; }.status-viewed { color:#8a66c4; background:#f2edfc; }.status-accepted { color:#218767; background:#e9f7f0; }.status-declined { color:#c85d68; background:#fff0f1; }.status-expired { color:#ad873e; background:#fbf5e9; }
.notice { margin-bottom:18px; padding:13px 16px; border-radius:9px; font-size:12px; border:1px solid transparent; }
.notice-success { background:var(--green-soft); color:var(--green); border-color:#cfecdf; }.notice-error { background:var(--danger-soft); color:var(--danger); border-color:#f7d9dc; }
.form-stack { display:grid; gap:18px; }
.form-grid { display:grid; gap:21px 18px; }.form-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }.form-grid .wide { grid-column:1/-1; }
label { display:grid; gap:7px; font-size:12px; color:var(--ink-soft); font-weight:550; min-width:0; }
input,select,textarea { width:100%; min-width:0; min-height:44px; padding:11px 13px; border:1px solid var(--line-strong); border-radius:8px; background:#fff; color:var(--ink); font-size:13px; transition:border-color .18s,box-shadow .18s; }
textarea { resize:vertical; line-height:1.7; }
input::placeholder,textarea::placeholder { color:#9aa4b7; font-weight:400; }
input:focus,select:focus,textarea:focus { border-color:#819af9; outline:0; box-shadow:0 0 0 3px #4265ed10; }
input[type=checkbox],input[type=radio] { width:16px; min-height:16px; accent-color:var(--brand); }
input[type=color] { padding:6px; cursor:pointer; }
input[type=file] { background:var(--surface-soft); padding:10px; font-size:11px; }
input::file-selector-button { border:1px solid var(--line-strong); border-radius:5px; background:#fff; color:var(--ink-soft); padding:5px 9px; margin-right:10px; font:inherit; cursor:pointer; }
.field-error { font-size:11px; color:var(--danger); margin:0; }.field-hint { font-size:11px; color:var(--muted); }
.filter-bar { display:grid; grid-template-columns:minmax(0,1fr) 180px auto; gap:10px; margin-bottom:22px; }
.search-field { position:relative; }
.search-field > .icon { position:absolute; top:13px; left:13px; color:#8c99b0; width:17px; height:17px; }
.search-field input { padding-left:39px; background:var(--surface-soft); }
.filter-bar select { font-size:12px; }
.table-wrap { overflow:auto; scrollbar-width:thin; }
table { width:100%; border-collapse:collapse; font-size:12px; }
th { font-size:9px; text-transform:uppercase; letter-spacing:.8px; text-align:left; font-weight:600; color:#7f8ba2; background:#f8f9fc; }
th,td { padding:15px 13px; border-bottom:1px solid var(--line); vertical-align:middle; }
thead th:first-child { border-radius:7px 0 0 7px; } thead th:last-child { border-radius:0 7px 7px 0; }
td { font-variant-numeric:tabular-nums; } td strong { font-weight:600; } td small { display:block; margin-top:4px; color:var(--muted); font-size:10px; max-width:320px; }
tbody tr:hover { background:#f9fbff; } tbody tr:last-child td { border-bottom:0; }
.align-right { text-align:right; }
.row-actions,.page-actions { display:flex; gap:12px; align-items:center; }
.row-actions { font-size:11px; white-space:nowrap; }
.row-actions > a { color:var(--brand-dark); font-weight:600; }
.row-actions .text-button { font-size:10px; }
.table-client { display:flex; align-items:center; gap:11px; min-width:180px; }
.table-client .record-icon { flex-shrink:0; }
.table-client small { white-space:normal; }
.filter-reset { display:inline-flex; margin-top:12px; color:var(--brand-dark); font-size:12px; }
/* Quote builder */
.builder-layout { display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:22px; align-items:start; }
.wizard { overflow:hidden; background:var(--surface); border:1px solid var(--line); border-radius:var(--radius); box-shadow:var(--shadow-sm); }
.stepper { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; list-style:none; margin:0; padding:24px; border-bottom:1px solid var(--line); }
.stepper li { position:relative; display:flex; flex-direction:column; gap:9px; align-items:center; color:#939eb1; font-size:10px; font-weight:500; text-align:center; }
.stepper li:not(:last-child):after { content:""; position:absolute; left:calc(50% + 23px); right:calc(-50% + 13px); top:17px; height:1px; background:var(--line); }
.stepper span { display:grid; place-items:center; width:35px; height:35px; border:1px solid var(--line-strong); background:#fff; border-radius:50%; font-size:12px; font-weight:600; }
.stepper li.active { color:var(--brand-dark); }.stepper li.active span { border-color:var(--brand); background:var(--brand); color:#fff; box-shadow:0 0 0 4px #edf1ff; }
.stepper li.complete span { color:var(--brand); background:var(--brand-soft); border-color:#d2dcff; box-shadow:none; }
.wizard-step { padding:30px; min-height:342px; }
.wizard-step .section-heading { margin-bottom:26px; }
.wizard-step .section-heading h2 { font-size:24px; }.wizard-step .section-heading p { font-size:12px; }
.section-heading { max-width:640px; margin-bottom:30px; }.section-heading h2 { font-size:35px; margin-bottom:13px; }.section-heading p { font-size:14px; }
.step-kicker { font-size:9px; letter-spacing:1.2px; }
.wizard-actions { display:flex; gap:10px; padding:18px 26px; background:#fafbfe; border-top:1px solid var(--line); }
.wizard-spacer { flex:1; }
.builder-aside { padding:24px 21px; background:#ecf1ff; border:1px solid #e2e9fc; border-radius:var(--radius); }
.builder-aside > .icon { color:var(--brand); width:27px; height:27px; margin-bottom:20px; }
.builder-aside h3 { font-size:17px; }.builder-aside p { font-size:12px; color:#70809f; }
.builder-aside-rule { height:1px; background:#d7e1f7; margin:20px 0; }
.builder-aside small { display:flex; align-items:center; gap:7px; font-size:10px; color:#6c7fa5; }
.builder-aside small .icon { width:15px; }
.ai-box { display:flex; justify-content:space-between; align-items:center; gap:17px; padding:18px; margin:22px 0; border:1px solid #dddffc; border-radius:10px; background:#f5f3ff; }
.ai-box strong { font-size:12px; color:#6c61b7; margin-left:6px; }.ai-box p { font-size:11px; color:var(--muted); margin:5px 0 0; }.ai-box .button { flex-shrink:0; font-size:11px; }
.pro-label { display:inline-block; background:#e7dfff; color:#8060c7; font-size:9px; font-weight:700; padding:3px 5px; border-radius:4px; }
.line-items-head { display:flex; align-items:center; justify-content:space-between; gap:12px; margin:27px 0 15px; }.line-items-head h3 { font-size:15px; margin-bottom:4px; }.line-items-head p { font-size:11px; color:var(--muted); margin:0; }
.line-items { display:grid; gap:12px; }
.line-item { display:grid; grid-template-columns:minmax(130px,2fr) 65px 75px 90px auto 32px; gap:8px; align-items:end; padding:14px; background:#f8faff; border:1px solid var(--line); border-radius:10px; }
.line-item label { font-size:10px; }.line-item input { padding:9px; font-size:12px; }.line-item > strong { align-self:center; padding-top:22px; font-size:11px; white-space:nowrap; }.line-item .icon-button { width:32px; height:43px; }
.review-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(220px,.85fr); gap:25px; }
.totals-card { background:var(--navy); color:#c5d0e6; padding:22px; border-radius:12px; }
.totals-card > div { display:flex; justify-content:space-between; gap:12px; padding:10px 0; font-size:12px; }.totals-card .grand-total { border-top:1px solid #ffffff1c; margin-top:8px; padding-top:19px; color:#fff; font-size:18px; }
.quota-hint { padding:11px 15px; margin:0 0 18px; border:1px solid #e1e8fa; border-radius:9px; color:var(--muted); font-size:11px; background:var(--brand-soft); }.quota-hint a { color:var(--brand-dark); font-weight:600; margin-left:7px; }
.quota-wall { max-width:780px; }.quota-wall p { color:var(--muted); }
/* Documents and delivery */
.whatsapp-button { background:#20866b; }.whatsapp-button:hover { background:#176e57; }
.delivery-panel { margin-bottom:22px; }
.delivery-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:15px; }
.delivery-option { display:flex; flex-direction:column; padding:18px; background:var(--surface-soft); border:1px solid var(--line); border-radius:11px; }
.delivery-option.featured { background:#f0faf6; border-color:#bfe5d7; }
.delivery-option-head { display:flex; justify-content:space-between; align-items:center; gap:7px; margin-bottom:13px; }.delivery-option-head strong { font-size:12px; }
.delivery-option p { flex:1; font-size:11px; line-height:1.8; white-space:pre-line; color:var(--muted); background:#ffffffa6; padding:12px; border-radius:7px; max-height:150px; overflow:auto; }.delivery-option .button { width:100%; font-size:11px; }
.share-card { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:18px 22px; margin-bottom:22px; background:#ecf2ff; border:1px solid #dce5fb; border-radius:12px; }
.share-card > div { display:grid; gap:4px; min-width:0; }.share-card .muted { font-size:10px; }.share-card strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:500; }.share-card .button { flex-shrink:0; }
.completion-panel { margin-bottom:26px; }.completion-form { grid-template-columns:repeat(4,minmax(0,1fr)); align-items:end; }.completion-form .button { width:100%; }
.quote-document { max-width:980px; margin:auto; background:#fff; border:1px solid var(--line); border-radius:14px; padding:clamp(24px,4vw,50px); box-shadow:var(--shadow); }
.document-head { display:flex; justify-content:space-between; align-items:flex-start; gap:25px; padding-bottom:26px; border-bottom:3px solid var(--contractor-brand,var(--brand)); }
.document-logo { display:block; max-width:180px; max-height:55px; object-fit:contain; margin-bottom:10px; }.document-brand { font-family:var(--font-display); font-size:24px; font-weight:750; letter-spacing:-.6px; }.document-head p { margin:6px 0 0; color:var(--muted); font-size:11px; overflow-wrap:anywhere; }
.document-number { display:grid; text-align:right; flex-shrink:0; }.document-number strong { font-size:14px; }
.document-number span,.document-meta span,.document-scope > span,.terms > span { text-transform:uppercase; letter-spacing:1px; font-size:9px; font-weight:600; color:#8791a3; }
.document-meta { display:grid; grid-template-columns:2fr 1fr 1fr; gap:15px; margin:24px 0 30px; }.document-meta > div { display:grid; gap:6px; padding:14px; background:#f7f9fc; border-radius:8px; }.document-meta strong { font-size:12px; font-weight:600; }
.document-scope { margin-bottom:28px; }.document-scope h2 { font-size:23px; margin:6px 0 12px; }.document-scope p { font-size:12px; color:var(--ink-soft); }
.document-table { overflow:auto; }.document-row { display:grid; grid-template-columns:minmax(130px,2fr) .7fr .8fr .9fr; min-width:450px; gap:15px; padding:15px 12px; border-bottom:1px solid var(--line); font-size:11px; }.document-row > :last-child { text-align:right; }.document-row strong { font-weight:600; }.document-row-head { background:var(--surface-soft); font-size:9px; color:var(--muted); text-transform:uppercase; letter-spacing:.8px; border-radius:6px; }
.document-bottom { display:grid; grid-template-columns:1fr 1fr; gap:40px; margin-top:26px; }.terms p { font-size:11px; margin-top:9px; color:var(--muted); }.document-totals > div { display:flex; justify-content:space-between; gap:12px; padding:8px 0; font-size:12px; }.document-grand-total { padding-top:16px !important; margin-top:6px; border-top:1px solid var(--line-strong); font-size:15px !important; }.document-dual { color:var(--muted); }.document-watermark { margin-top:35px; border-top:1px solid var(--line); padding-top:18px; text-align:center; font-size:10px; color:var(--muted); }
.public-quote-page { max-width:1030px; margin:45px auto; padding:0 20px; }.made-with { text-align:center; font-size:11px; color:var(--muted); margin-top:20px; }.made-with a { font-weight:600; color:var(--brand-dark); }
/* Settings and income */
.settings-grid { display:grid; grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr); align-items:start; gap:22px; }.settings-side { display:grid; gap:22px; }.settings-grid .panel-head { padding-bottom:18px; border-bottom:1px solid var(--line); }.settings-grid .panel { padding:25px; }
.branding-block { display:grid; gap:8px; padding:17px; border:1px dashed var(--line-strong); border-radius:10px; }.field-label { color:var(--ink-soft); font-size:12px; font-weight:600; }.branding-block p { margin:0; }.logo-preview { display:flex; align-items:center; flex-wrap:wrap; gap:15px; }.logo-preview img { max-width:150px; max-height:55px; object-fit:contain; }.checkbox-inline { display:flex; align-items:center; gap:7px; font-size:11px; }
.danger-zone { border-color:#f1d9dd; }.danger-zone h2 { font-size:15px; color:var(--danger); }.danger-zone p { font-size:11px; color:var(--muted); }.danger-zone form { display:grid; gap:15px; }
.income-layout { display:grid; grid-template-columns:minmax(260px,1fr) minmax(0,2fr); gap:22px; }.income-chart-panel { margin-bottom:22px; }.income-bars { display:flex; align-items:flex-end; gap:16px; height:210px; padding:15px 10px 6px; overflow-x:auto; overflow-y:hidden; scrollbar-width:thin; }.income-bar-column { flex:1 0 48px; height:100%; display:flex; flex-direction:column; align-items:center; justify-content:flex-end; min-width:0; }.income-bar-column > div { display:flex; align-items:flex-end; justify-content:center; width:100%; height:calc(100% - 28px); }.income-bar-column i { display:block; width:55%; height:var(--bar-height); min-height:2px; background:#6180f3; border-radius:5px 5px 0 0; }.income-bar-column span { color:var(--muted); font-size:10px; padding-top:9px; }.income-bar-column small { font-size:9px; color:var(--brand-dark); margin-bottom:8px; }
/* Public site */
.public-shell { background:#fff; }
.site-header { display:flex; align-items:center; gap:55px; max-width:1340px; margin:auto; padding:23px 40px; }
.public-nav { display:flex; flex:1; align-items:center; gap:24px; font-size:12px; font-weight:550; }.public-nav > a:not(.button):hover { color:var(--brand); }.public-nav-spacer { flex:1; }.public-nav .market-select { max-width:160px; font-size:10px; background:#fff; }.public-menu-toggle { display:none; }
.hero { display:grid; grid-template-columns:1.04fr 1fr; align-items:center; gap:55px; max-width:1270px; margin:auto; padding:70px 40px 82px; }
.hero-badge { display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border:1px solid #e0e7f9; border-radius:6px; color:#6480b3; background:#f8faff; font-size:10px; margin-bottom:25px; }.hero-badge > span { width:5px; height:5px; background:#688aed; border-radius:50%; }
.hero h1 { font-size:clamp(38px,4.2vw,57px); line-height:1.13; letter-spacing:-2.6px; font-weight:800; margin-bottom:24px; }.hero h1 em { font-style:normal; color:var(--brand); }.hero-copy > p { max-width:425px; color:var(--muted); font-size:15px; line-height:1.85; margin-bottom:28px; }.hero-actions { display:flex; align-items:center; gap:12px; }.hero-actions .button { min-height:47px; font-size:12px; }.trust-row { display:flex; flex-wrap:wrap; gap:18px; margin-top:20px; }.trust-row > span { display:flex; gap:5px; align-items:center; color:#8793a8; font-size:9px; }.trust-row .icon { width:13px; height:13px; color:#6e9b8d; }
.hero-stage { position:relative; padding:38px 34px 54px; background:#edf2fe; border-radius:24px; isolation:isolate; }
.stage-orbit { position:absolute; z-index:-1; border:1px solid #d4def7; width:380px; height:380px; border-radius:50%; pointer-events:none; }.hero-stage .orbit-one { top:50px; left:5px; }.hero-stage .orbit-two { top:17px; left:38px; }
.stage-label { display:flex; align-items:center; justify-content:center; gap:8px; font-size:9px; color:#7e90b8; margin-bottom:22px; text-transform:uppercase; letter-spacing:1.4px; }.stage-label .icon { width:15px; height:15px; }
.quote-preview { position:relative; background:#fff; border:1px solid #e8edf7; border-radius:11px; padding:25px 28px 16px; box-shadow:0 18px 40px -12px #24458324; transform:rotate(-2deg); }
.preview-top { display:flex; align-items:center; justify-content:space-between; margin-bottom:25px; }.preview-top .brand { font-size:17px; letter-spacing:-.8px; gap:7px; }.preview-top .brand-mark { width:25px; height:27px; border-radius:7px 7px 7px 2px; font-size:22px; padding-bottom:4px; }.preview-quote-label { display:grid; text-align:right; color:var(--muted); font-size:8px; text-transform:uppercase; letter-spacing:.5px; }.preview-quote-label strong { font-size:10px; color:var(--ink); margin-top:3px; }
.preview-heading .eyebrow { font-size:7px; letter-spacing:1.5px; }.preview-heading h2 { font-size:20px; margin-bottom:19px; letter-spacing:-.7px; max-width:260px; }.client-line { display:flex; justify-content:space-between; align-items:center; background:#f7f9fe; border-radius:6px; padding:10px 12px; margin-bottom:16px; }.client-line > span:first-child { display:grid; font-size:8px; color:var(--muted); }.client-line strong { font-size:11px; font-weight:600; color:var(--ink); margin-top:3px; }.preview-client-avatar { display:grid; place-items:center; width:28px; height:28px; background:#e8edfc; color:#718bc7; border-radius:50%; font-size:9px; }
.preview-items > div { display:flex; justify-content:space-between; gap:12px; padding:9px 0; border-bottom:1px solid #eff2f8; font-size:9px; }.preview-items > div > span { color:#73809a; }.preview-items strong { font-weight:550; white-space:nowrap; }.preview-tax { border-bottom:0 !important; }.preview-tax strong { color:var(--muted); }
.preview-total { display:flex; justify-content:space-between; align-items:center; gap:12px; margin-top:10px; padding:15px; background:#eff3ff; border-radius:6px; }.preview-total > span { display:grid; font-size:10px; font-weight:600; }.preview-total small { font-size:7px; color:#8190ad; font-weight:400; }.preview-total strong { font-family:var(--font-display); font-size:23px; color:var(--brand-dark); letter-spacing:-1px; }.preview-note { display:flex; align-items:center; justify-content:center; gap:4px; font-size:7px; color:#9ca6ba; margin-top:13px; }.preview-note .icon { width:10px; height:10px; }
.floating-card { position:absolute; display:flex; align-items:center; gap:11px; bottom:24px; right:-15px; background:#fff; border:1px solid #e8edf7; border-radius:11px; padding:14px 18px; box-shadow:0 10px 35px #233d6112; transform:rotate(3deg); }.floating-card > span { display:grid; place-items:center; width:32px; height:32px; background:#e6f8ef; color:#46a481; border-radius:50%; }.floating-card strong { display:block; font-size:10px; font-weight:600; }.floating-card small { display:block; font-size:8px; color:var(--muted); margin-top:3px; }.floating-card > .icon { color:#90a8de; width:16px; margin-left:12px; }.stage-caption { position:absolute; left:24px; bottom:17px; font-size:8px; color:#93a3c1; display:flex; align-items:center; gap:5px; }.stage-caption > span { width:4px; height:4px; border-radius:50%; background:#88a0d7; }
.trade-strip { display:flex; align-items:center; justify-content:space-between; gap:22px; max-width:1190px; padding:25px 0; margin:0 auto 95px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); color:#7d8ba3; }.trade-strip > span { font-family:var(--font-display); font-size:13px; font-weight:650; color:var(--ink-soft); }.trade-strip > div { display:flex; align-items:center; gap:8px; font-size:11px; }.trade-strip .icon { width:17px; height:17px; }
.home-section { max-width:1270px; margin:0 auto 95px; padding:0 40px; }.centered { text-align:center; margin:0 auto 40px; }.centered .eyebrow { text-align:center; }.centered h2 { font-size:34px; letter-spacing:-1.3px; }.centered p { font-size:13px; line-height:1.85; }
.feature-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:22px; }.feature-card { padding:30px; background:#fff; border:1px solid var(--line); border-radius:15px; transition:box-shadow .2s,transform .2s; }.feature-card:hover { transform:translateY(-4px); box-shadow:var(--shadow); }.feature-icon { display:inline-flex; align-items:center; justify-content:center; width:43px; height:43px; border-radius:12px; margin-bottom:24px; }.feature-icon .icon { width:21px; height:21px; }.feature-card h3 { font-size:17px; margin-bottom:12px; }.feature-card p { font-size:12px; line-height:1.85; color:var(--muted); margin-bottom:23px; }.feature-rule { display:block; width:28px; height:3px; border-radius:2px; background:#dce5ff; }
.workflow-section { background:#f6f8fd; padding:70px 40px; }.workflow { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:55px; max-width:1060px; margin:auto; }.workflow > div { position:relative; }.workflow-number { position:absolute; right:15px; top:-8px; font-family:var(--font-display); font-weight:800; font-size:64px; color:#e4eaf5; line-height:1; letter-spacing:-3px; }.workflow-icon { display:grid; place-items:center; width:46px; height:46px; border:1px solid #dfe6f5; border-radius:12px; background:#fff; color:var(--brand); margin-bottom:25px; }.workflow h3 { font-size:17px; margin-bottom:11px; }.workflow p { font-size:12px; color:var(--muted); margin-bottom:0; line-height:1.85; }
.home-cta { display:flex; align-items:center; justify-content:space-between; gap:40px; max-width:1190px; padding:45px 50px; border-radius:19px; margin:75px auto; background:var(--navy); color:#fff; position:relative; overflow:hidden; }.home-cta .eyebrow { color:#99b2ff; }.home-cta h2 { font-size:29px; max-width:530px; margin-bottom:13px; letter-spacing:-1px; }.home-cta p { color:#a0afcd; font-size:13px; margin:0; }.home-cta .button { flex-shrink:0; }
.site-footer { display:flex; align-items:center; justify-content:space-between; gap:30px; max-width:1270px; padding:35px 40px; margin:auto; border-top:1px solid var(--line); }.site-footer .brand { font-size:22px; }.site-footer .brand-mark { width:28px; height:30px; font-size:25px; border-radius:8px 8px 8px 2px; padding-bottom:5px; }.site-footer p { margin:12px 0 0; font-size:11px; color:var(--muted); }.footer-links { display:flex; flex-wrap:wrap; gap:22px; color:var(--muted); font-size:11px; }.footer-links a:hover { color:var(--brand); }
.public-shell .main-content { max-width:1260px; padding:30px 40px 65px; }.public-shell .main-content > .section-heading { margin:35px auto 45px !important; }.public-shell .main-content > .section-heading h2 { font-size:37px; }.public-flash { max-width:1190px; margin:15px auto 0; padding:0 20px; }
/* Authentication */
.guest-shell { display:grid; grid-template-columns:minmax(390px,.92fr) minmax(450px,1.08fr); min-height:100dvh; background:#fff; }
.auth-story { display:flex; flex-direction:column; justify-content:space-between; padding:43px 55px 29px; background:var(--navy); color:#fff; position:relative; overflow:hidden; }.auth-story .brand { font-size:30px; }.auth-story-copy { padding:48px 0 25px; max-width:420px; margin:auto; width:100%; }.auth-story-copy .eyebrow { color:#98affc; font-size:9px; margin-bottom:16px; }.auth-story-copy h2 { font-size:clamp(33px,3.6vw,51px); line-height:1.22; letter-spacing:-2px; margin-bottom:20px; white-space:pre-line; }.auth-story-copy > p { color:#a5b3ce; font-size:13px; line-height:1.9; max-width:330px; }
.auth-illustration { position:relative; height:235px; margin:28px 0 20px; isolation:isolate; }.auth-orbit { position:absolute; border:1px solid #ffffff0b; border-radius:50%; width:240px; height:240px; left:50%; top:-9px; transform:translateX(-50%); z-index:-1; }.auth-orbit.orbit-two { width:300px; height:300px; top:-39px; }.auth-mini-document { width:190px; height:204px; background:linear-gradient(135deg,#344667,#253751); transform:rotate(-9deg); margin:0 auto; border:1px solid #ffffff17; border-radius:10px; padding:19px; box-shadow:0 20px 50px #00000010; }.mini-doc-icon { display:block; color:#aec3fd; margin-bottom:15px; }.mini-doc-icon .icon { width:22px; height:22px; }.mini-line { display:block; height:5px; border-radius:3px; background:#ffffff40; width:80%; margin-bottom:7px; }.mini-line.short { width:50%; opacity:.5; }.mini-doc-lines { display:grid; gap:9px; border-top:1px solid #ffffff12; margin-top:17px; padding-top:13px; }.mini-doc-lines i { height:3px; width:100%; background:#ffffff15; }.mini-doc-total { display:flex; justify-content:space-between; align-items:center; border-top:1px solid #ffffff12; margin-top:12px; padding-top:9px; font-size:12px; }.mini-doc-total > span { width:28%; height:4px; background:#ffffff22; }.mini-doc-total strong { color:#c0d0fa; font-weight:500; }.auth-success { display:flex; gap:9px; align-items:center; position:absolute; bottom:13px; right:-2px; padding:14px 18px; background:#fff; color:var(--ink); border-radius:9px; font-size:10px; box-shadow:0 10px 30px #00000013; transform:rotate(3deg); }.auth-success > span { display:grid; place-items:center; width:25px; height:25px; border-radius:50%; background:#e7f9ef; color:#3a9b7a; }.auth-success .icon { width:15px; height:15px; }.auth-spark { position:absolute; top:20px; right:40px; color:#aabfff; }.auth-spark .icon { width:30px; height:30px; }
.auth-benefits { display:flex; flex-wrap:wrap; gap:17px; margin-top:35px; }.auth-benefits > span { display:flex; gap:6px; align-items:center; font-size:9px; color:#b1bfda; }.auth-benefits .icon { width:13px; height:13px; color:#a5b8f0; }.auth-story-footer { margin:0; color:#7f90b2; font-size:10px; }
.auth-content { display:flex; flex-direction:column; padding:30px 40px 22px; }.auth-toolbar { display:flex; justify-content:flex-end; }.guest-switch { display:flex; align-items:center; gap:16px; }.guest-switch .market-select { background:#fff; border-color:var(--line); font-size:10px; }.auth-mobile-brand { display:none; }.auth-wrap { width:100%; max-width:370px; margin:auto; padding:50px 0; }.auth-card { background:#fff; }.auth-card .eyebrow { font-size:9px; margin-bottom:12px; }.auth-card h1 { font-size:32px; letter-spacing:-1.2px; margin-bottom:12px; }.auth-card > .muted { font-size:12px; line-height:1.8; margin-bottom:28px; }.auth-card .form-stack { gap:17px; }.auth-card label { font-size:11px; }.auth-card input { min-height:47px; }.auth-card .form-stack > .button { width:100%; margin-top:6px; min-height:46px; }.auth-links { display:flex; align-items:center; justify-content:space-between; gap:16px; font-size:10px; margin-top:22px; color:var(--muted); }.auth-links a { color:var(--brand-dark); font-weight:550; }.auth-links a:hover { text-decoration:underline; }.auth-security { display:flex; align-items:center; justify-content:center; gap:6px; font-size:9px; color:#8b96ab; margin:0; }.auth-security .icon { width:12px; height:12px; }
.password-field { position:relative; display:block; }.password-field input { padding-right:45px; }.password-toggle { position:absolute; top:50%; right:8px; transform:translateY(-50%); width:32px; height:32px; background:none; border:0; color:#91a0ba; display:grid; place-items:center; }.password-toggle svg { width:17px; height:17px; }.password-toggle[aria-pressed=true] { color:var(--brand); }
/* Pricing, gallery, billing */
.pricing-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:23px; max-width:1110px; margin:0 auto 32px; }
.tier-card { position:relative; display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--line); border-radius:15px; padding:30px; background:#fff; }.tier-card.featured { border:2px solid var(--brand); background:linear-gradient(180deg,#f3f6ff,#fff 55%); box-shadow:0 12px 32px #4265ed0d; padding:29px; }.tier-card h3 { font-size:23px; margin-bottom:20px; }.tier-card .eyebrow { font-size:9px; }.tier-badge { position:absolute; top:-13px; right:20px; border-radius:6px; padding:5px 12px; color:#fff; background:var(--brand); font-size:9px; font-weight:650; letter-spacing:.5px; }
.tier-price { font-family:var(--font-display); font-size:40px; line-height:1.3; font-weight:800; letter-spacing:-1.8px; margin-bottom:16px; }.tier-price small { font-size:11px; color:var(--muted); font-weight:400; letter-spacing:0; font-family:var(--font-sans); }.tier-yearly { font-size:11px; color:var(--brand-dark); margin:-7px 0 20px; }.tier-desc { font-size:12px; color:var(--muted); margin-bottom:24px; line-height:1.8; }.tier-list { list-style:none; padding:23px 0 0; border-top:1px solid var(--line); margin:0 0 28px; display:grid; gap:14px; font-size:11px; color:var(--ink-soft); }.tier-list li { display:flex; gap:10px; align-items:baseline; }.tier-list li:before { content:"✓"; color:var(--brand); font-weight:700; }.tier-list li.off { color:#9ca5b5; }.tier-list li.off:before { content:"–"; color:#b8c0cf; }.tier-card > .button { width:100%; }
.plan-actions { display:grid; gap:9px; }.plan-actions form { margin:0; }.plan-actions .button { width:100%; font-size:11px; }.billing-panel .plan-actions,.billing-result .plan-actions,.quota-wall .plan-actions { display:flex; flex-wrap:wrap; }.billing-panel .plan-actions .button,.billing-result .plan-actions .button,.quota-wall .plan-actions .button { width:auto; }
.pricing-market { font-size:11px !important; margin:12px auto 0; max-width:620px; color:var(--muted); }.pricing-market strong { font-weight:500; color:var(--ink-soft); }.pricing-note { max-width:1110px; margin:0 auto 26px; padding:30px; background:#f8faff; }.pricing-note-grid { display:grid; grid-template-columns:1.5fr 1fr; gap:35px; align-items:center; }.pricing-note h3 { font-size:21px; margin-bottom:12px; }.region-table { padding:20px; background:#fff; border:1px solid var(--line); border-radius:10px; }.region-table .tier-price { font-size:26px; letter-spacing:-.8px; }.pricing-fineprint { max-width:740px; text-align:center; margin:0 auto 20px; font-size:10px; color:var(--muted); }.tier-note { font-size:11px; color:var(--muted); }
.billing-plan { display:flex; justify-content:space-between; gap:15px; padding:13px; background:#f3f6ff; border:1px solid #e3eafa; border-radius:8px; margin-bottom:15px; font-size:11px; }.billing-plan span { color:var(--muted); }.billing-plan strong { color:var(--brand-dark); font-size:12px; }.billing-panel .field-hint { margin:10px 0 18px; }.pay-panel { max-width:580px; margin:60px auto; text-align:center; padding:40px; }.billing-result { max-width:750px; }.billing-result-text { font-size:14px; }.billing-result.is-done .billing-result-text { color:var(--green); }.centered > .status-pill { white-space:normal; flex-wrap:wrap; max-width:100%; }
.gallery-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-bottom:35px; }.gallery-card { display:flex; flex-direction:column; justify-content:space-between; padding:28px; }.gallery-card-head { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; margin-bottom:18px; }.gallery-card-head .eyebrow { margin:0; font-size:9px; }.gallery-card h3 { font-size:20px; }.gallery-client { font-size:11px; color:var(--muted); }.gallery-items { border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:12px 0; margin:20px 0; }.gallery-items > div { display:flex; justify-content:space-between; gap:20px; padding:8px 0; font-size:11px; }.gallery-items > div > span { color:var(--muted); }.gallery-items strong { white-space:nowrap; font-weight:600; }.gallery-total { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:20px; font-size:12px; color:var(--muted); }.gallery-total strong { font-family:var(--font-display); font-size:24px; font-weight:750; color:var(--ink); letter-spacing:-.8px; }.gallery-card .button { width:100%; }
/* Responsive layouts */
@media (min-width:1550px) { .main-content { padding-left:48px; padding-right:48px; }.metric-card { min-height:178px; }.activity-chart { height:245px; }.pipeline-list { gap:20px 24px; }.panel { padding:26px; } }
@media (max-width:1250px) { .app-shell { grid-template-columns:220px minmax(0,1fr); }.sidebar { padding-left:14px; padding-right:14px; }.workspace-header { padding:15px 25px; }.main-content { padding:29px 25px 0; }.metric-grid { gap:12px; }.metric-card { padding:16px; }.metric-card > strong,.metric-values > strong { font-size:25px; }.metric-values > .multiple-value { font-size:18px; }.metric-label { gap:5px; }.metric-label > span:first-child { font-size:10px; }.metric-icon { width:29px; height:29px; }.dashboard-analytics,.dashboard-lower { grid-template-columns:minmax(0,1.6fr) minmax(250px,1fr); gap:17px; }.panel { padding:20px; }.record-row { gap:9px; }.record-row .record-arrow { display:none; }.record-row { grid-template-columns:33px minmax(0,1fr) auto auto; }.builder-layout { grid-template-columns:minmax(0,1fr); }.builder-aside { display:none; }.site-header { gap:30px; }.public-nav { gap:17px; }.hero { gap:36px; }.hero-stage { padding-left:24px; padding-right:24px; }.trade-strip { margin-left:40px; margin-right:40px; }.home-cta { margin-left:40px; margin-right:40px; }.settings-grid { grid-template-columns:minmax(0,1.3fr) minmax(275px,1fr); }.settings-grid .form-grid.two { grid-template-columns:1fr; }.delivery-grid { grid-template-columns:1fr; }.delivery-option { display:grid; grid-template-columns:1fr auto; gap:0 20px; }.delivery-option p { grid-column:1; margin-bottom:0; max-height:95px; }.delivery-option .button { grid-column:2; grid-row:1/3; align-self:center; }.completion-form { grid-template-columns:repeat(2,minmax(0,1fr)); }.income-layout { grid-template-columns:1fr; } }
@media (max-width:1050px) { .dashboard-analytics { grid-template-columns:minmax(0,1fr); }.pipeline-panel { display:grid; grid-template-columns:1fr 1fr; gap:0 25px; }.pipeline-panel .panel-head { grid-column:1/-1; }.pipeline-total { grid-column:1; }.pipeline-track { grid-column:1; }.pipeline-list { grid-column:2; grid-row:2/4; }.dashboard-lower { grid-template-columns:1fr; }.quick-actions { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.quick-actions h2 { grid-column:1/-1; margin-bottom:0; }.action-card { margin:0; }.metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.metric-card { min-height:150px; }.metric-card > strong,.metric-values > strong { font-size:29px; }.metric-values > .multiple-value { font-size:19px; }.settings-grid { grid-template-columns:1fr; }.settings-grid .form-grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }.settings-side { grid-template-columns:1fr 1fr; }.settings-side .billing-panel { grid-column:1/-1; }.hero { gap:30px; padding-top:45px; }.hero h1 { font-size:42px; }.hero-copy > p { font-size:13px; }.hero-actions { flex-direction:column; align-items:flex-start; }.hero-stage { padding:27px 19px 50px; }.quote-preview { padding:20px; }.preview-heading h2 { font-size:18px; }.hero-stage .stage-orbit { width:280px; height:280px; }.public-nav > .market-select { max-width:125px; }.public-nav { gap:14px; font-size:11px; }.site-header { padding:20px 30px; gap:30px; }.site-header .brand { font-size:23px; }.trade-strip { flex-wrap:wrap; justify-content:center; margin-bottom:65px; }.trade-strip > span { width:100%; text-align:center; }.feature-card { padding:24px; }.guest-shell { grid-template-columns:.9fr 1.1fr; }.auth-story { padding:35px; }.auth-story-copy h2 { font-size:38px; }.auth-content { padding:25px 35px; }.auth-success { right:-15px; }.line-item { grid-template-columns:minmax(120px,2fr) 65px 70px 90px; }.line-item > strong { padding-top:0; grid-column:1/4; }.line-item .icon-button { justify-self:end; height:30px; }.tier-card { padding:23px; }.tier-card.featured { padding:22px; }.tier-card h3 { font-size:20px; } }
@media (max-width:800px) { .app-shell { display:block; }.sidebar { position:fixed; z-index:70; inset:0 auto 0 0; width:255px; transform:translateX(-100%); transition:transform .22s ease; padding-top:25px; visibility:hidden; }.sidebar.open { transform:translateX(0); visibility:visible; }.sidebar-close { display:flex; width:28px; height:28px; color:#a7b6d3; background:transparent; border-color:#ffffff18; }.sidebar-close .icon { width:16px; }.sidebar-backdrop { display:block; position:fixed; inset:0; z-index:65; background:#0d183680; border:0; backdrop-filter:blur(3px); }.menu-open { overflow:hidden; }.mobile-menu { display:inline-flex; width:32px; height:32px; border:0; }.workspace-header { min-height:66px; padding:12px 22px; }.breadcrumb { gap:9px; }.topbar-actions { gap:14px; }.main-content { padding:27px 22px 0; }.page-head h1 { font-size:27px; }.metric-card { min-height:151px; }.activity-chart { height:230px; }.public-menu-toggle { display:inline-flex; margin-left:auto; }.site-header { position:relative; flex-wrap:wrap; padding:19px 24px; gap:0; border-bottom:1px solid var(--line); }.public-nav { display:none; width:100%; flex:none; padding:23px 0 6px; flex-wrap:wrap; gap:18px; }.public-nav.open { display:flex; }.public-nav-spacer { display:none; }.public-nav > .market-select { max-width:200px; }.public-nav > a { font-size:12px; }.hero { grid-template-columns:1fr; gap:45px; padding:50px 32px 55px; text-align:center; }.hero-copy { max-width:550px; margin:auto; }.hero h1 { font-size:50px; letter-spacing:-2.2px; }.hero-copy > p { margin-left:auto; margin-right:auto; font-size:14px; }.hero-actions { flex-direction:row; justify-content:center; }.trust-row { justify-content:center; }.hero-stage { width:min(100%,450px); padding:32px 34px 55px; margin:auto; text-align:left; }.hero-stage .stage-orbit { width:340px; height:340px; }.quote-preview { padding:24px 27px 16px; }.preview-heading h2 { font-size:21px; }.floating-card { right:-10px; }.trade-strip { margin:0 25px 65px; gap:15px 25px; }.home-section { padding:0 25px; margin-bottom:65px; }.feature-grid { gap:13px; }.feature-card { padding:21px; }.feature-card h3 { font-size:15px; }.feature-card p { font-size:11px; }.centered h2 { font-size:29px; }.workflow-section { padding:50px 25px; }.workflow { gap:30px; }.workflow-number { font-size:50px; right:0; }.workflow h3 { font-size:15px; }.workflow p { font-size:11px; }.home-cta { margin:50px 25px; padding:35px; flex-direction:column; align-items:flex-start; gap:25px; }.home-cta h2 { font-size:28px; }.site-footer { padding:30px 25px; }.footer-links { gap:14px; }.public-shell .main-content { padding:22px 25px 45px; }.public-shell .main-content > .section-heading h2 { font-size:30px; }.pricing-grid { gap:15px; }.tier-card { padding:21px 18px; }.tier-card.featured { padding:20px 17px; }.tier-price { font-size:34px; }.tier-list { font-size:10px; }.guest-shell { grid-template-columns:.85fr 1.15fr; }.auth-story { padding:30px 25px; }.auth-story-copy h2 { font-size:31px; letter-spacing:-1.3px; }.auth-story-copy > p { font-size:12px; }.auth-content { padding:25px; }.auth-card h1 { font-size:28px; }.auth-illustration { transform:scale(.85); transform-origin:center; margin-left:-15px; margin-right:-15px; }.auth-benefits { flex-direction:column; gap:10px; }.guest-switch { gap:8px; }.guest-switch .market-select { max-width:190px; }.gallery-card { padding:22px; }.gallery-card h3 { font-size:18px; }.gallery-total strong { font-size:21px; } }
@media (max-width:600px) { body { font-size:13px; }.workspace-header { padding:11px 16px; }.breadcrumb > span,.breadcrumb > .icon { display:none; }.breadcrumb { gap:8px; }.topbar-actions { gap:13px; }.global-search { display:none; }.main-content { padding:24px 16px 0; }.page-head { align-items:flex-start; flex-wrap:wrap; gap:17px; margin-bottom:22px; }.page-head h1 { font-size:25px; letter-spacing:-.8px; }.page-head p { font-size:11px; }.page-head > .button { min-height:39px; font-size:11px; padding:9px 13px; }.page-head > .button .icon { width:15px; }.page-head .eyebrow { font-size:8px; }.metric-grid { gap:10px; margin-bottom:16px; }.metric-card { min-height:148px; padding:15px; border-radius:12px; }.metric-label > span:first-child { font-size:10px; }.metric-icon { width:27px; height:27px; border-radius:8px; }.metric-icon .icon { width:15px; height:15px; }.metric-card > strong,.metric-values > strong { font-size:25px; letter-spacing:-.7px; }.metric-values > .multiple-value { font-size:17px; }.metric-card small { font-size:9px; }.panel { padding:18px; border-radius:13px; }.panel-head { gap:10px; margin-bottom:18px; }.panel-head h2 { font-size:14px; }.panel-head p { font-size:10px; }.period-pill { font-size:8px; padding:5px 7px; }.period-pill .icon { display:none; }.dashboard-analytics,.dashboard-lower { gap:16px; margin-bottom:16px; }.activity-chart { height:190px; }.chart-plot { gap:1px; }.bar-pair { gap:4px; padding:0 6px; }.chart-bar { width:15px; }.pipeline-panel { display:block; }.pipeline-list { gap:14px 32px; }.pipeline-total { margin-top:3px; }.pipeline-track { margin:15px 0 20px; }.record-row { grid-template-columns:33px minmax(0,1fr) auto; gap:8px 10px; padding:14px 0; }.record-row .status-pill { grid-column:3; grid-row:auto; }.record-amount { grid-column:2/4; margin-top:-3px; font-size:10px; }.record-main strong { font-size:11px; }.record-main span { font-size:9px; }.record-icon { width:32px; height:32px; border-radius:9px; }.text-link { font-size:10px; }.text-link .icon { width:13px; }.quick-actions { grid-template-columns:1fr; gap:12px; }.quick-actions h2 { margin-bottom:0; }.action-card { padding:17px; }.workspace-footer { font-size:9px; padding-top:20px; }.workspace-footer > span:last-child { max-width:180px; text-align:right; }.workspace-footer .icon { display:none; }.filter-bar { grid-template-columns:1fr auto; gap:9px; }.search-field { grid-column:1/-1; }.filter-bar select { font-size:11px; }.filter-bar .button { font-size:11px; }.table-wrap { margin-left:-5px; margin-right:-5px; } th,td { padding:13px 10px; } td { font-size:11px; }.form-grid.two { grid-template-columns:1fr; }.form-grid { gap:17px; }.stepper { padding:21px 13px; gap:7px; }.stepper li { font-size:8px; }.stepper span { width:30px; height:30px; font-size:11px; }.stepper li:not(:last-child):after { top:15px; left:calc(50% + 20px); right:calc(-50% + 13px); }.wizard-step { padding:25px 20px; min-height:350px; }.wizard-step .section-heading h2 { font-size:22px; }.wizard-step .section-heading p { font-size:11px; }.wizard-actions { padding:17px 20px; }.wizard-actions .button { font-size:11px; }.line-item { grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }.item-description { grid-column:1/-1; }.line-item > strong { grid-column:1/3; }.line-item .icon-button { grid-column:3; }.ai-box,.line-items-head { flex-direction:column; align-items:stretch; }.ai-box .button { align-self:flex-start; }.line-items-head .button { align-self:flex-start; font-size:11px; }.review-grid { grid-template-columns:1fr; }.page-actions { flex-wrap:wrap; gap:9px; }.page-actions .button { font-size:11px; }.delivery-option { display:flex; gap:0; }.delivery-option p { margin-bottom:14px; }.share-card { align-items:stretch; flex-direction:column; gap:14px; padding:17px; }.share-card .button { align-self:flex-start; }.completion-form { grid-template-columns:1fr; }.quote-document { padding:23px 18px; }.document-head { gap:15px; }.document-brand { font-size:19px; }.document-number strong { font-size:12px; }.document-head p { font-size:10px; }.document-meta { grid-template-columns:1fr 1fr; gap:9px; margin:20px 0; }.document-meta > div:first-child { grid-column:1/-1; }.document-meta > div { padding:11px; }.document-meta strong { font-size:11px; }.document-scope h2 { font-size:20px; }.document-bottom { grid-template-columns:1fr; gap:15px; }.document-row { gap:12px; padding:13px 7px; min-width:430px; }.settings-grid .panel { padding:21px; }.settings-grid .form-grid.two,.settings-side { grid-template-columns:1fr; }.settings-side .billing-panel { grid-column:auto; }.income-bars { gap:10px; }.income-bar-column small { font-size:8px; }.hero { padding:37px 24px 48px; }.hero-badge { font-size:9px; margin-bottom:21px; }.hero h1 { font-size:40px; letter-spacing:-1.8px; }.hero-copy > p { font-size:13px; }.hero-actions { flex-wrap:wrap; gap:10px; }.hero-actions .button { min-height:44px; font-size:11px; }.trust-row { gap:10px 17px; }.trust-row > span { font-size:8px; }.hero-stage { padding:29px 25px 54px; border-radius:19px; }.hero-stage .stage-orbit { width:250px; height:250px; }.preview-heading h2 { font-size:19px; }.quote-preview { padding:22px 20px 15px; }.preview-total strong { font-size:21px; }.floating-card { right:-6px; padding:12px 14px; }.floating-card strong { font-size:9px; }.floating-card small { font-size:8px; }.stage-caption { left:15px; bottom:11px; font-size:7px; }.trade-strip { margin-bottom:50px; padding:22px 0; gap:15px 20px; }.trade-strip > div { font-size:9px; }.trade-strip > div .icon { width:14px; }.feature-grid { grid-template-columns:1fr; gap:15px; }.feature-card { padding:26px; }.feature-icon { margin-bottom:19px; }.feature-card h3 { font-size:18px; }.feature-card p { font-size:12px; }.centered { margin-bottom:28px; }.centered h2 { font-size:28px; }.centered p { font-size:12px; }.workflow { grid-template-columns:1fr; gap:30px; }.workflow > div { padding-bottom:27px; border-bottom:1px solid #e4eaf5; }.workflow > div:last-child { border:0; padding-bottom:0; }.workflow h3 { font-size:18px; }.workflow p { font-size:12px; }.workflow-icon { margin-bottom:20px; }.workflow-number { right:10px; font-size:70px; }.home-cta { padding:30px; }.home-cta h2 { font-size:26px; }.site-footer { flex-direction:column; align-items:flex-start; gap:25px; }.footer-links { gap:22px; font-size:10px; }.guest-shell { display:block; }.auth-story { display:none; }.auth-content { min-height:100dvh; padding:22px; }.auth-toolbar { justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap; }.auth-mobile-brand { display:inline-flex; font-size:22px; gap:8px; }.auth-mobile-brand .brand-mark { width:27px; height:29px; font-size:24px; border-radius:8px 8px 8px 2px; padding-bottom:4px; }.guest-switch .market-select { max-width:150px; font-size:9px; min-height:32px; padding:6px; }.guest-switch .locale-chip { font-size:10px; }.auth-wrap { max-width:370px; padding:50px 4px; }.auth-card h1 { font-size:31px; }.auth-links { font-size:10px; }.auth-security { font-size:9px; padding-bottom:5px; }.pricing-grid { grid-template-columns:1fr; gap:25px; max-width:430px; }.tier-card,.tier-card.featured { padding:29px; }.tier-card h3 { font-size:24px; }.tier-list { font-size:12px; }.tier-price { font-size:42px; }.pricing-note-grid { grid-template-columns:1fr; gap:22px; }.pricing-note { padding:25px; }.pricing-note h3 { font-size:21px; }.gallery-grid { grid-template-columns:1fr; gap:18px; }.gallery-items { font-size:10px; }.gallery-card h3 { font-size:20px; }.public-shell .main-content { padding:20px 20px 40px; }.public-shell .main-content > .section-heading h2 { font-size:29px; }.pay-panel { margin:25px auto; padding:27px; }.public-quote-page { padding:0 13px; margin:25px auto; } }
@media (max-width:360px) { .hero { padding-left:18px; padding-right:18px; }.hero h1 { font-size:35px; }.hero-stage { padding-left:17px; padding-right:17px; }.metric-card { padding:12px; }.metric-card > strong,.metric-values > strong { font-size:22px; }.metric-values > .multiple-value { font-size:16px; }.metric-label { flex-wrap:wrap; }.metric-label .metric-icon { width:22px; height:22px; }.auth-toolbar { gap:18px; }.auth-toolbar .guest-switch { width:100%; justify-content:space-between; }.preview-items > div { font-size:8px; } }
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; } }
@media print { .sidebar,.workspace-header,.workspace-footer,.site-header,.site-footer,.page-actions,.share-card,.delivery-panel,.completion-panel,.no-print { display:none !important; }.app-shell { display:block; }.main-content { padding:0; }.quote-document { box-shadow:none; border:0; max-width:none; }.document-table { overflow:visible; } body { background:#fff; } }
/* Standalone, printable income statement. */
.statement-shell { padding:35px 22px; }
.statement-toolbar { max-width:920px; margin:0 auto 22px; display:flex; gap:13px; align-items:center; }
.statement-toolbar > a { margin-right:auto; }.statement-toolbar select { min-height:36px; padding:7px 10px; font-size:11px; }
.statement-card { max-width:920px; margin:auto; background:#fff; border:1px solid var(--line); border-radius:14px; padding:45px; box-shadow:var(--shadow); }
.statement-head { display:flex; justify-content:space-between; align-items:center; gap:25px; border-bottom:3px solid var(--brand); padding-bottom:25px; margin-bottom:25px; }
.statement-head h1 { font-size:26px; margin:0 0 7px; }.statement-head p { font-size:11px; color:var(--muted); margin:0; overflow-wrap:anywhere; }
.statement-year { text-align:right; }.statement-year span { display:block; font-size:9px; text-transform:uppercase; color:var(--muted); }.statement-year strong { font-family:var(--font-display); font-size:33px; color:var(--brand); letter-spacing:-1px; }
.statement-meta { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; background:var(--surface-soft); padding:20px; border-radius:9px; margin-bottom:32px; }.statement-meta > div { display:grid; gap:8px; }.statement-meta span { font-size:9px; text-transform:uppercase; color:var(--muted); }.statement-meta strong { font-size:15px; font-weight:600; }.statement-card > h2 { font-size:16px; margin-bottom:17px; }.statement-total { font-size:14px; font-weight:650; border-top:2px solid var(--line-strong); }.statement-signatures { display:grid; grid-template-columns:1fr 1fr; gap:45px; margin-top:65px; }.statement-signatures span { border-top:1px solid var(--line-strong); padding-top:10px; color:var(--muted); font-size:10px; }.statement-footer { text-align:center; margin-top:40px; padding-top:18px; border-top:1px solid var(--line); color:var(--muted); font-size:9px; overflow-wrap:anywhere; }
@media(max-width:600px) { .statement-shell { padding:20px 13px; }.statement-card { padding:25px 18px; }.statement-head { gap:13px; }.statement-head h1 { font-size:21px; }.statement-year strong { font-size:27px; }.statement-meta { gap:12px; padding:14px; }.statement-meta strong { font-size:12px; }.statement-meta span { font-size:8px; }.statement-signatures { gap:20px; }.statement-toolbar .button { font-size:10px; padding:8px 10px; }.statement-toolbar > a { font-size:10px; } }
@media print { .statement-shell { padding:0; }.statement-card { border:0; box-shadow:none; padding:0; max-width:none; }.statement-card .table-wrap { overflow:visible; }.statement-head,.statement-signatures { break-inside:avoid; } }
.error-state { max-width:560px; margin:40px auto 60px; }
.error-state h1 { font-size:30px; letter-spacing:-.8px; margin:0 0 10px; }
.public-shell .error-state { padding:80px 24px; }
/* Business: templates and team */
.template-picker { display:flex; align-items:center; gap:12px; flex-wrap:wrap; padding:14px 18px; margin-bottom:18px; }
.template-picker label { display:flex; align-items:center; gap:8px; font-weight:600; font-size:12px; color:var(--brand-dark); }
.template-picker label .icon { width:16px; height:16px; }
.template-picker select { flex:1; min-width:180px; max-width:420px; }
.template-save { align-items:center; }
.template-save .muted { display:flex; align-items:center; gap:6px; }
.template-save .muted .icon { width:14px; height:14px; }
.template-save-form { display:flex; gap:10px; flex:1; justify-content:flex-end; flex-wrap:wrap; }
.template-save-form input { min-width:220px; flex:1; max-width:340px; }
.team-invite-form { align-items:end; }
.team-invite-actions { display:flex; align-items:flex-end; }
.team-join { max-width:560px; }
.team-join h1 { font-size:26px; letter-spacing:-.6px; margin:6px 0 10px; }
td small.muted { display:block; margin-top:3px; }
@media (max-width:600px) { .template-save-form { justify-content:stretch; } .template-save-form input { min-width:0; max-width:none; } .team-invite-actions .button { width:100%; } }
.oauth-divider { display:flex; align-items:center; gap:12px; margin:18px 0 14px; color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:1px; }
.oauth-divider:before,.oauth-divider:after { content:""; flex:1; height:1px; background:var(--line); }
.google-button { display:flex; width:100%; justify-content:center; gap:10px; }
.team-panel { margin-bottom:18px; }
.auth-card .form-stack + .field-hint { margin-top:14px; }
.team-panel .plan-actions { margin-top:16px; }

/* Legal pages (terms, privacy, refund policy) */
.legal-page { display: flex; justify-content: center; }
.legal-prose { max-width: 46rem; width: 100%; padding: 2.5rem 0 4rem; line-height: 1.65; }
.legal-prose h1 { margin: 0 0 .25rem; }
.legal-prose h2 { font-size: 1.15rem; margin: 2rem 0 .5rem; }
.legal-prose p, .legal-prose li { margin: 0 0 .75rem; }
.legal-prose ul { padding-left: 1.25rem; }
.legal-prose .legal-updated { opacity: .7; font-size: .9rem; margin-bottom: 1.5rem; }