.jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 28px; }
.jump a { color: #dfe5f5; text-decoration: none; font-size: .9rem; font-weight: 500; padding: .5em .95em; border-radius: 99px; border: 1px solid rgba(255,255,255,.18); }
.jump a:hover { background: rgba(255,255,255,.08); color: #fff; }

.demo-section { scroll-margin-top: 68px; }
.solution { scroll-margin-top: 68px; }
.solution.alt { background: var(--paper-2); }
.solution .section-head { margin-bottom: 24px; }
.solution { display: grid; grid-template-columns: minmax(0, 1fr); }
.solution > .wrap { width: 100%; }
.solution > .solution-panel { grid-row: 2; grid-column: 1; width: 100%; }
.solution-panel.off { visibility: hidden; pointer-events: none; }
.solution-panel { padding-top: 12px; }
.subtabs { display: flex; flex-wrap: wrap; gap: 8px; }
.subtabs button { font: 600 .92rem var(--body); padding: .6em 1.1em; border-radius: 99px; border: 1.5px solid var(--line); background: #fff; cursor: pointer; color: var(--text); }
.subtabs button:hover { border-color: var(--blue); }
.subtabs button.on { background: var(--blue); border-color: var(--blue); color: #fff; }
.solution .idea-filters { background: transparent; }
.demo-section.alt { background: var(--paper-2); }
.demo-section.dark { background: var(--ink); color: #fff; }
.demo-section.dark .demo-copy p, .demo-section.dark .bullets { color: #b8c1d9; }
.demo-section.dark .eyebrow { color: var(--shirt); }
.demo { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(32px, 5vw, 64px); align-items: center; }
.demo-copy p { color: var(--muted); border-left: 3px solid var(--blue); padding: 6px 0 6px 16px; margin: 18px 0; font-size: 1.05rem; }
.bullets { padding-left: 1.2em; color: #343b4d; margin: 0 0 1em; }
.bullets li { margin-bottom: .35em; }
.bullets li::marker { color: var(--blue); }
.hint { font-size: .9rem; color: var(--muted); border-left: 3px solid var(--blue); padding-left: 12px; }
.demo-panel { background: var(--card); border: 1px solid var(--line); border-radius: 20px; box-shadow: 0 30px 60px -36px rgba(10,15,30,.45); overflow: hidden; }
@media (max-width: 900px) { .demo { grid-template-columns: minmax(0, 1fr); } }

.tabs { display: flex; gap: 4px; padding: 8px; background: var(--paper-2); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.tabs button { font: 600 .88rem var(--body); border: 0; background: transparent; padding: .6em 1em; border-radius: 10px; cursor: pointer; color: var(--muted); }
.tabs button.on { background: #fff; color: var(--text); box-shadow: 0 2px 6px -2px rgba(0,0,0,.2); }

/* ---------- 01 animations ---------- */
.anim-panel { position: relative; aspect-ratio: 4 / 3; overflow: hidden; background: #0f1a3d; cursor: crosshair; }
.anim-panel .layer { position: absolute; transition: transform .25s ease-out; will-change: transform; }
.sky { inset: -10%; background: linear-gradient(#0b1638 0%, #3150b5 55%, #ffb27a 100%); }
.sun { width: 22%; aspect-ratio: 1; border-radius: 50%; left: 58%; top: 34%; background: radial-gradient(circle, #ffe3a3, #ffb547 60%, transparent 62%); box-shadow: 0 0 80px 20px rgba(255,181,71,.45); }
.hills-back { left: -8%; width: 116%; bottom: 22%; height: 34%; }
.hills-mid { left: -8%; width: 116%; bottom: 14%; height: 34%; }
.water { left: -8%; width: 116%; bottom: -4%; height: 24%; background: repeating-linear-gradient(180deg, #1b3a8f 0 6px, #2246a6 6px 9px); }
.boat { font-size: clamp(28px, 6vw, 52px); left: 22%; bottom: 13%; animation: rock 3s ease-in-out infinite; }
@keyframes rock { 50% { translate: 0 -5px; rotate: 4deg; } }
.anim-card { position: absolute; left: 6%; top: 8%; background: rgba(255,255,255,.92); backdrop-filter: blur(8px); border-radius: 14px; padding: 16px 18px; display: grid; gap: 4px; max-width: 60%; box-shadow: 0 20px 40px -20px rgba(0,0,0,.6); }
.anim-card b { font-family: var(--display); font-size: 1.25rem; }
.anim-card span { color: var(--muted); font-size: .9rem; margin-bottom: 8px; }
.anim-card .btn { justify-self: start; border: 0; }
.anim-panel.intro .sun { animation: rise 1.4s cubic-bezier(.2,.8,.3,1) both; }
.anim-panel.intro .hills-back { animation: slideUp 1s .2s cubic-bezier(.2,.8,.3,1) both; }
.anim-panel.intro .hills-mid { animation: slideUp 1s .35s cubic-bezier(.2,.8,.3,1) both; }
.anim-panel.intro .boat { animation: sail 1.4s .5s cubic-bezier(.2,.8,.3,1) both, rock 3s 2s ease-in-out infinite; }
.anim-panel.intro .anim-card { animation: pop .6s .9s cubic-bezier(.3,1.5,.5,1) both; }
@keyframes rise { from { translate: 0 120%; opacity: 0; } }
@keyframes slideUp { from { translate: 0 60%; } }
@keyframes sail { from { translate: -260% 0; } }
@keyframes pop { from { scale: .6; opacity: 0; } }

/* ---------- 02 mini chat ---------- */
.mini-chat { display: flex; flex-direction: column; height: 500px; }
.mc-head { display: flex; align-items: center; gap: 12px; padding: 14px 16px; background: #16161b; color: #fff; }
.mc-av { width: 40px; height: 40px; border-radius: 50%; background: #e0313f; display: grid; place-items: center; font-size: 1.2rem; }
.mc-head small { display: block; color: #9aa3bb; font-size: .8rem; }
.mc-log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; background: #f6f6f8; }
.mc-msg { max-width: 82%; padding: 10px 13px; border-radius: 16px; font-size: .93rem; line-height: 1.45; }
.mc-msg.bot { background: #fff; border: 1px solid #e3e3ea; border-bottom-left-radius: 4px; }
.mc-msg.me { background: #e0313f; color: #fff; align-self: flex-end; border-bottom-right-radius: 4px; }
.mc-lead { align-self: stretch; background: #0f1a33; color: #fff; border-radius: 12px; padding: 14px; font-size: .88rem; animation: pop .45s cubic-bezier(.3,1.5,.5,1); }
.mc-lead b { color: var(--mint); display: block; margin-bottom: 6px; font-family: var(--mono); font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; }
.mc-lead dl { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; margin: 0; }
.mc-lead dt { color: #8d97b3; }
.mc-lead dd { margin: 0; }
.mc-quick { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 12px 0; background: #fff; }
.mc-quick button { font: 600 .82rem var(--body); padding: 7px 11px; border-radius: 99px; border: 1.5px solid #e0313f; color: #b3122a; background: #fff; cursor: pointer; }
.mc-form { display: flex; gap: 8px; padding: 10px 12px 12px; background: #fff; }
.mc-form input { flex: 1; font: inherit; font-size: .93rem; padding: 10px 14px; border: 1.5px solid #e3e3ea; border-radius: 99px; outline: none; }
.mc-form input:focus { border-color: #e0313f; }
.mc-form button { border: 0; background: #e0313f; color: #fff; border-radius: 50%; width: 40px; height: 40px; cursor: pointer; }

/* ---------- 03 shop ---------- */
.shop-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding: 14px 16px; background: var(--ink); color: #fff; font-size: .88rem; }
.shop-bar label { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.shop-bar select { font: inherit; padding: 6px 10px; border-radius: 8px; border: 0; }
.shop-badge { font: 600 .75rem var(--mono); padding: 5px 9px; border-radius: 6px; background: rgba(255,255,255,.12); }
.shop-badge.deal { background: var(--mint); color: #0b2a1d; }
.shop-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; padding: 16px; }
.product { border: 1px solid var(--line); border-radius: 12px; padding: 12px; display: grid; gap: 6px; }
.product .pic { height: 64px; border-radius: 8px; background: var(--paper-2); display: grid; place-items: center; font-size: 1.8rem; }
.product b { font-size: .92rem; line-height: 1.25; }
.product small { color: var(--muted); font-family: var(--mono); font-size: .72rem; }
.price { display: flex; align-items: baseline; gap: 8px; }
.price strong { font-size: 1.05rem; transition: color .3s; }
.price s { color: var(--muted); font-size: .85rem; }
.price.flash strong { color: #15936b; }
.product button { font: 600 .85rem var(--body); border: 0; background: var(--blue); color: #fff; padding: 8px; border-radius: 8px; cursor: pointer; }
.cart { border-top: 1px solid var(--line); padding: 14px 16px 18px; background: #fafaf7; font-size: .92rem; }
.cart-row { display: flex; justify-content: space-between; gap: 12px; padding: 3px 0; }
.cart-row.total { font-weight: 700; font-size: 1.05rem; border-top: 1px solid var(--line); margin-top: 6px; padding-top: 8px; }
.cart-row.save { color: #15936b; }
.cart .btn { width: 100%; justify-content: center; margin-top: 12px; border: 0; }
.cart-empty { color: var(--muted); }
.order-ok { text-align: center; padding: 8px 0; }
.order-ok b { display: block; font-size: 1.1rem; margin-bottom: 4px; }
@media (max-width: 480px) { .shop-grid { grid-template-columns: minmax(0, 1fr); } }

/* ---------- 04 admin ---------- */
.admin { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); }
.admin-edit { padding: 18px; display: grid; gap: 10px; align-content: start; background: #fafaf7; border-right: 1px solid var(--line); font-size: .88rem; }
.admin-title { font-weight: 700; font-family: var(--display); font-size: 1.05rem; }
.admin-edit label { display: grid; gap: 4px; font-weight: 600; }
.admin-edit input:not([type=checkbox]), .admin-edit textarea { font: inherit; font-weight: 400; padding: 8px 10px; border: 1.5px solid var(--line); border-radius: 8px; width: 100%; resize: vertical; }
.admin-edit input:focus, .admin-edit textarea:focus { outline: none; border-color: var(--blue); }
.admin-label { font-weight: 600; }
.swatches { display: flex; gap: 8px; }
.swatches button { width: 28px; height: 28px; border-radius: 50%; border: 3px solid #fff; background: var(--c); box-shadow: 0 0 0 1.5px var(--line); cursor: pointer; }
.swatches button.on { box-shadow: 0 0 0 2.5px var(--text); }
.switch { display: flex !important; grid-template-columns: none; align-items: center; gap: 10px; cursor: pointer; margin-top: 4px; }
.switch input { position: absolute; opacity: 0; }
.switch span { width: 36px; height: 20px; border-radius: 99px; background: #c8ccd6; position: relative; transition: background .2s; flex: none; }
.switch span::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; transition: transform .2s; }
.switch input:checked + span { background: var(--blue); }
.switch input:checked + span::after { transform: translateX(16px); }
.switch input:focus-visible + span { box-shadow: 0 0 0 3px rgba(47,107,255,.35); }
.admin-preview { --brand: #b8642a; background: #fbf6ee; color: #3a2414; display: flex; flex-direction: column; min-height: 380px; }
.ap-banner { background: var(--brand); color: #fff; text-align: center; font-size: .8rem; font-weight: 600; padding: 7px; transition: background .3s; }
.ap-nav { display: flex; justify-content: space-between; align-items: center; padding: 12px 16px; font-size: .8rem; border-bottom: 1px solid #ecdcc6; gap: 8px; }
.ap-nav b { color: var(--brand); font-family: var(--display); font-size: 1rem; transition: color .3s; }
.ap-nav span { opacity: .7; }
.ap-hero { padding: 28px 20px; flex: 1; display: flex; flex-direction: column; justify-content: center; background: radial-gradient(circle at 90% 20%, color-mix(in srgb, var(--brand) 22%, transparent), transparent 60%); }
.ap-hero h4 { font: 800 clamp(1.4rem, 2.6vw, 2rem)/1.05 var(--display); letter-spacing: -.02em; margin: 0 0 10px; word-break: break-word; }
.ap-hero p { font-size: .92rem; opacity: .8; margin-bottom: 16px; }
.ap-btn { align-self: flex-start; background: var(--brand); color: #fff; padding: 9px 16px; border-radius: 99px; font-weight: 700; font-size: .88rem; transition: background .3s; }
.ap-closed { align-self: flex-start; font-size: .85rem; font-weight: 600; padding: 8px 12px; border-radius: 8px; background: #fff1e0; color: #8a4a12; }
@media (max-width: 560px) { .admin { grid-template-columns: minmax(0, 1fr); } .admin-edit { border-right: 0; border-bottom: 1px solid var(--line); } }

/* ---------- 05 inventory ---------- */
.inv { font-size: .92rem; }
.inv-list { padding: 14px; display: grid; gap: 10px; }
.class-row { display: grid; grid-template-columns: 1fr auto; gap: 6px 14px; align-items: center; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; }
.class-row b { font-size: .98rem; }
.class-row small { color: var(--muted); display: block; }
.spots { grid-column: 1; display: flex; align-items: center; gap: 8px; font-size: .8rem; color: var(--muted); }
.spot-bar { flex: 1; max-width: 160px; height: 6px; border-radius: 99px; background: var(--paper-2); overflow: hidden; }
.spot-bar i { display: block; height: 100%; background: #1597b8; transition: width .4s; }
.spots.low .spot-bar i { background: #f08c00; }
.spots.full .spot-bar i { background: #e5484d; }
.class-row button { grid-row: 1 / span 2; grid-column: 2; font: 600 .85rem var(--body); border: 0; padding: 9px 14px; border-radius: 99px; cursor: pointer; background: #1597b8; color: #fff; }
.class-row button.wait { background: #fff; color: #b3122a; border: 1.5px solid #e5484d; }
.reg-form { border: 1.5px solid #1597b8; border-radius: 12px; padding: 14px; display: grid; gap: 10px; background: #f2fbfd; animation: pop .35s cubic-bezier(.3,1.5,.5,1); }
.reg-form input { font: inherit; padding: 9px 12px; border: 1.5px solid var(--line); border-radius: 8px; }
.reg-form .row { display: flex; gap: 8px; flex-wrap: wrap; }
.reg-form button { font: 600 .88rem var(--body); border: 0; padding: 9px 14px; border-radius: 8px; cursor: pointer; background: #1597b8; color: #fff; }
.reg-form button.cancel { background: transparent; color: var(--muted); }
.reg-done { border-radius: 12px; padding: 14px; background: #e9f9f1; border: 1px solid #a6e3c5; animation: pop .35s cubic-bezier(.3,1.5,.5,1); }
.reg-done code { font-family: var(--mono); background: #fff; padding: 2px 6px; border-radius: 4px; }
.owner { padding: 14px; display: grid; gap: 16px; }
.owner h4 { font-family: var(--display); font-size: 1rem; margin: 0 0 8px; }
.owner table { width: 100%; border-collapse: collapse; font-size: .85rem; }
.owner th { text-align: left; font-weight: 600; color: var(--muted); font-size: .75rem; text-transform: uppercase; letter-spacing: .04em; padding: 6px 6px; border-bottom: 1px solid var(--line); }
.owner td { padding: 8px 6px; border-bottom: 1px solid var(--paper-2); vertical-align: middle; }
.table-scroll { overflow-x: auto; }
.pill { font: 600 .72rem var(--mono); padding: 3px 7px; border-radius: 5px; white-space: nowrap; }
.pill.wait { background: #fff3dc; color: #8a5a00; }
.pill.paid { background: #e3f7ec; color: #11734f; }
.pill.list { background: #ffe7e8; color: #b3122a; }
.owner td button { font: 600 .78rem var(--body); border: 1.5px solid var(--line); background: #fff; border-radius: 6px; padding: 4px 8px; cursor: pointer; }
.cap { display: inline-flex; align-items: center; gap: 6px; }
.cap button { width: 24px; height: 24px; padding: 0 !important; }
.empty { color: var(--muted); font-size: .85rem; }

/* ---------- 06 automation ---------- */
.auto-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-top: 8px; font-size: .9rem; color: var(--muted); }
.auto-list b { display: block; color: var(--text); margin-bottom: 2px; }
@media (max-width: 480px) { .auto-list { grid-template-columns: minmax(0, 1fr); } }
.auto-panel { background: var(--ink-2); border-color: rgba(255,255,255,.1); color: #fff; padding-bottom: 16px; }
.auto-panel .tabs { background: var(--ink-3); border-color: rgba(255,255,255,.08); }
.auto-panel .tabs button { color: #9aa3bb; }
.auto-panel .tabs button.on { background: var(--blue); color: #fff; }
.auto-in { display: grid; gap: 6px; padding: 16px 16px 10px; font: 600 .75rem var(--mono); text-transform: uppercase; letter-spacing: .06em; color: #8d97b3; }
.auto-in textarea { font: .88rem/1.5 var(--body); text-transform: none; letter-spacing: 0; color: #e6ebf7; background: #0b1124; border: 1px solid rgba(255,255,255,.1); border-radius: 10px; padding: 12px; resize: vertical; }
.auto-panel > .btn { margin-left: 16px; border: 0; }
.pipeline { list-style: none; margin: 16px; padding: 0; display: grid; gap: 6px; }
.pipeline li { display: flex; align-items: center; gap: 10px; font-size: .9rem; color: #6b7590; transition: color .3s; }
.pipeline li i { width: 20px; height: 20px; border-radius: 50%; border: 2px solid #3a4566; display: grid; place-items: center; font-style: normal; font-size: .7rem; flex: none; transition: all .3s; }
.pipeline li.busy { color: #fff; }
.pipeline li.busy i { border-color: var(--shirt); border-top-color: transparent; animation: spin .7s linear infinite; }
.pipeline li.done { color: #dfe5f5; }
.pipeline li.done i { background: var(--mint); border-color: var(--mint); color: #0b2a1d; }
@keyframes spin { to { transform: rotate(360deg); } }
.auto-out { margin: 0 16px; display: grid; gap: 10px; }
.out-card { background: #0b1124; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; padding: 12px 14px; font-size: .88rem; animation: pop .4s cubic-bezier(.3,1.5,.5,1); }
.out-card b { display: block; font: 600 .72rem var(--mono); color: var(--shirt); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px; }
.out-card dl { display: grid; grid-template-columns: auto 1fr; gap: 3px 14px; margin: 0; }
.out-card dt { color: #8d97b3; }
.out-card dd { margin: 0; color: #e6ebf7; }
.out-card p { margin: 0; color: #dfe5f5; white-space: pre-line; }

/* ---------- groups ---------- */
.group-band { background: var(--blue); color: #fff; padding-block: 56px 48px; scroll-margin-top: 68px; }
.group-band .eyebrow { color: #cfe0ff; margin-bottom: .4rem; }
.group-band h2 { margin-bottom: .25em; }
.group-band p { color: #dbe6ff; margin: 0; max-width: 60ch; font-size: 1.1rem; }

/* ---------- shared panel parts ---------- */
.panel-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px; border-bottom: 1px solid var(--line); background: #fafaf7; font-size: .9rem; }
.panel-bar span { color: var(--muted); font-size: .82rem; }
.panel-foot { display: flex; flex-wrap: wrap; gap: 8px; padding: 14px 16px; }
.panel-foot .btn { border: 0; }
.panel-foot .btn-ghost { border: 2px solid var(--blue); color: var(--blue-deep); }
.btn[disabled] { opacity: .4; pointer-events: none; }
.demo-panel table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.demo-panel th { text-align: left; font-weight: 600; color: var(--muted); font-size: .72rem; text-transform: uppercase; letter-spacing: .04em; padding: 8px 10px; border-bottom: 1px solid var(--line); white-space: nowrap; }
.demo-panel td { padding: 8px 10px; border-bottom: 1px solid var(--paper-2); vertical-align: middle; }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.pill.ok { background: #e3f7ec; color: #11734f; }
.pill.ai { background: #eef2ff; color: var(--blue-deep); }
.pill.low { background: #fff3dc; color: #8a5a00; }
.pill.out { background: #ffe7e8; color: #b3122a; }
.flash-in { animation: pop .35s cubic-bezier(.3,1.5,.5,1); }

/* ---------- accounting ---------- */
.acct td:nth-child(4) { min-width: 170px; }
.acct select { font: inherit; font-size: .82rem; padding: 3px 6px; border-radius: 6px; border: 1.5px solid #f08c00; }
.conf { color: var(--muted); font-size: .72rem; margin-left: 4px; }

/* ---------- reporting ---------- */
.seg { display: inline-flex; background: var(--paper-2); border-radius: 8px; padding: 2px; }
.seg button { font: 600 .8rem var(--body); border: 0; background: none; padding: 5px 10px; border-radius: 6px; cursor: pointer; color: var(--muted); }
.seg button.on { background: #fff; color: var(--text); box-shadow: 0 1px 3px rgba(0,0,0,.15); }
.kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1px; background: var(--line); border-bottom: 1px solid var(--line); }
.kpi { background: #fff; padding: 12px 14px; }
.kpi small { display: block; color: var(--muted); font-size: .74rem; }
.kpi b { font: 700 1.25rem var(--display); font-variant-numeric: tabular-nums; }
.kpi em { display: block; font-style: normal; font-size: .74rem; color: var(--muted); }
@media (max-width: 520px) { .kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.chart-wrap { position: relative; padding: 16px 16px 4px; }
.chart-title { font-size: .82rem; color: var(--muted); margin-bottom: 8px; }
.bars { position: relative; height: 150px; display: flex; align-items: flex-end; gap: 2px; border-bottom: 1px solid #c8ccd6; background: repeating-linear-gradient(to top, transparent 0 49px, #eeece6 49px 50px); }
.bar-col { flex: 1; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; cursor: default; }
.bar-col i { display: block; width: min(60%, 28px); background: var(--blue); border-radius: 4px 4px 0 0; transition: height .5s cubic-bezier(.3,1,.4,1); }
.bar-col:hover i, .bar-col.last i { background: var(--blue-deep); }
.bar-x { display: flex; gap: 2px; padding: 4px 0 0; }
.bar-x span { flex: 1; text-align: center; font-size: .68rem; color: var(--muted); }
.chart-tip { position: absolute; background: var(--ink); color: #fff; font-size: .78rem; padding: 6px 9px; border-radius: 6px; pointer-events: none; white-space: nowrap; transform: translate(-50%, -100%); }
.rep-summary { margin: 8px 16px 12px; padding: 12px 14px; background: #f3f6ff; border-radius: 10px; font-size: .88rem; }
.rep-summary b { display: block; font: 600 .72rem var(--mono); color: var(--blue-deep); text-transform: uppercase; letter-spacing: .05em; margin-bottom: 4px; }
.rep-table { margin: 0 16px 14px; font-size: .85rem; }
.rep-table summary { cursor: pointer; color: var(--blue-deep); font-weight: 600; }

/* ---------- tax ---------- */
.tax-in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 12px; padding: 16px 16px 0; }
.tax-in label, .lead-in label { display: grid; gap: 4px; font-weight: 600; font-size: .84rem; }
.tax-in input, .lead-in select { font: inherit; font-weight: 400; padding: 8px 10px; border: 1.5px solid var(--line); border-radius: 8px; width: 100%; }
@media (max-width: 480px) { .tax-in { grid-template-columns: minmax(0, 1fr); } }
.pipeline.light li { color: #9aa3bb; }
.pipeline.light li i { border-color: #c8ccd6; }
.pipeline.light li.busy, .pipeline.light li.done { color: var(--text); }
.tax-form { margin: 0 16px 16px; border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.tax-form .line { display: grid; grid-template-columns: 52px 1fr auto; gap: 10px; padding: 9px 12px; border-bottom: 1px solid var(--paper-2); font-size: .87rem; }
.tax-form .line span:first-child { font: 600 .78rem var(--mono); color: var(--blue-deep); }
.tax-form .line.total { background: #f3f6ff; font-weight: 700; }
.tax-note { margin: 0 16px 16px; font-size: .84rem; padding: 10px 12px; border-radius: 10px; background: #fff7e6; color: #6b4a00; }

/* ---------- inventory ---------- */
.stock td button { font: 600 .76rem var(--body); border: 1.5px solid var(--line); background: #fff; border-radius: 6px; padding: 4px 8px; cursor: pointer; margin-left: 4px; white-space: nowrap; }
.stock td:last-child { text-align: right; white-space: nowrap; }
.reorder { padding: 14px 16px 16px; background: #fafaf7; border-top: 1px solid var(--line); font-size: .88rem; }
.reorder h4 { font-family: var(--display); margin: 0 0 8px; font-size: 1rem; }
.reorder ul { margin: 0 0 10px; padding-left: 1.1em; }
.reorder .btn { border: 0; }

/* ---------- customers ---------- */
.crm { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.5fr); min-height: 440px; }
.crm-side { border-right: 1px solid var(--line); background: #fafaf7; padding: 12px; display: flex; flex-direction: column; gap: 8px; }
.crm-side input { font: inherit; font-size: .88rem; padding: 8px 10px; border: 1.5px solid var(--line); border-radius: 8px; }
.crm-due { font-size: .78rem; font-weight: 600; color: #8a5a00; background: #fff3dc; padding: 6px 9px; border-radius: 6px; }
.crm-side ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; overflow-y: auto; }
.crm-side li button { width: 100%; text-align: left; font: inherit; font-size: .86rem; border: 0; background: transparent; padding: 8px 10px; border-radius: 8px; cursor: pointer; display: flex; justify-content: space-between; gap: 6px; align-items: center; }
.crm-side li button.on { background: #fff; box-shadow: 0 1px 4px rgba(0,0,0,.12); }
.crm-detail { padding: 16px; font-size: .88rem; display: grid; gap: 12px; align-content: start; }
.crm-detail h4 { font: 700 1.2rem var(--display); margin: 0; }
.crm-meta { color: var(--muted); font-size: .82rem; }
.crm-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.crm-stats div { background: var(--paper); border-radius: 8px; padding: 8px 10px; }
.crm-stats small { display: block; color: var(--muted); font-size: .72rem; }
.crm-ai { background: #f3f6ff; border-radius: 10px; padding: 10px 12px; }
.crm-ai b { font: 600 .72rem var(--mono); color: var(--blue-deep); text-transform: uppercase; letter-spacing: .05em; display: block; margin-bottom: 3px; }
.crm-notes { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.crm-notes li { border-left: 3px solid var(--line); padding-left: 10px; }
.crm-notes small { color: var(--muted); display: block; font-size: .74rem; }
.crm-add { display: flex; gap: 6px; }
.crm-add input { flex: 1; font: inherit; font-size: .86rem; padding: 7px 10px; border: 1.5px solid var(--line); border-radius: 8px; min-width: 0; }
.crm-add button { border: 0; }
@media (max-width: 600px) { .crm { grid-template-columns: minmax(0, 1fr); } .crm-side { border-right: 0; border-bottom: 1px solid var(--line); } .crm-side ul { max-height: 160px; } }

/* ---------- products ---------- */
.prod { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); }
.prod-edit { border-right: 1px solid var(--line); }
.prod-row { display: grid; grid-template-columns: auto minmax(0, 1fr) 70px; gap: 8px; align-items: center; padding: 8px 14px; border-bottom: 1px solid var(--paper-2); font-size: .86rem; }
.prod-row input[type=text], .prod-row input[type=number] { font: inherit; font-size: .86rem; padding: 6px 8px; border: 1.5px solid transparent; border-radius: 6px; background: transparent; width: 100%; min-width: 0; }
.prod-row input:hover, .prod-row input:focus { border-color: var(--line); background: #fff; outline: none; }
.prod-row.hidden-row input[type=text] { color: var(--muted); text-decoration: line-through; }
.prod-row .switch { margin: 0; }
.prod-add { display: flex; gap: 6px; padding: 12px 14px; }
.prod-add input { font: inherit; font-size: .86rem; padding: 7px 10px; border: 1.5px solid var(--line); border-radius: 8px; min-width: 0; flex: 1; }
.prod-add input[type=number] { flex: 0 0 80px; }
.prod-add button { border: 0; }
.prod-shop { background: #fbf6ee; padding: 14px; }
.prod-shop-head { font-weight: 700; font-size: .9rem; margin-bottom: 10px; }
.prod-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.prod-card { background: #fff; border-radius: 10px; padding: 10px; font-size: .82rem; box-shadow: 0 1px 4px rgba(0,0,0,.08); animation: pop .35s cubic-bezier(.3,1.5,.5,1); }
.prod-card .pic { height: 46px; border-radius: 6px; background: #f6e6cf; display: grid; place-items: center; font-size: 1.4rem; margin-bottom: 6px; }
.prod-card b { display: block; line-height: 1.2; word-break: break-word; }
.prod-card span { color: #b8642a; font-weight: 700; }
@media (max-width: 600px) { .prod { grid-template-columns: minmax(0, 1fr); } .prod-edit { border-right: 0; } }

/* ---------- login ---------- */
.auth { display: grid; place-items: center; padding: 28px 16px; min-height: 440px; background: linear-gradient(160deg, #eef2ff, #f5f3ee); }
.auth-card { width: min(360px, 100%); background: #fff; border-radius: 16px; padding: 24px; box-shadow: 0 20px 40px -24px rgba(10,15,30,.4); display: grid; gap: 12px; font-size: .9rem; animation: pop .35s cubic-bezier(.3,1.5,.5,1); }
.auth-card h4 { font: 700 1.25rem var(--display); margin: 0; }
.auth-card label { display: grid; gap: 4px; font-weight: 600; font-size: .84rem; }
.auth-card input { font: inherit; padding: 9px 12px; border: 1.5px solid var(--line); border-radius: 8px; }
.auth-card input:focus { outline: none; border-color: var(--blue); }
.auth-card .btn { justify-content: center; border: 0; }
.demo-accts { display: flex; flex-wrap: wrap; gap: 6px; }
.demo-accts button { font: 600 .78rem var(--body); border: 1.5px solid var(--line); background: #fff; border-radius: 99px; padding: 5px 10px; cursor: pointer; }
.auth-err { color: #b3122a; font-size: .84rem; font-weight: 600; }
.auth-small { color: var(--muted); font-size: .8rem; }
.auth-link { background: none; border: 0; color: var(--blue-deep); font: inherit; font-size: .82rem; cursor: pointer; padding: 0; text-align: left; }
.sms { background: #e9e9ee; border-radius: 16px 16px 16px 4px; padding: 10px 12px; font-size: .84rem; }
.sms small { display: block; color: var(--muted); font-size: .72rem; margin-bottom: 2px; }
.code-in { letter-spacing: .5em; text-align: center; font-family: var(--mono) !important; font-size: 1.2rem !important; }
.perm { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.perm li::before { content: "✓ "; color: #15936b; font-weight: 700; }
.perm li.no { color: var(--muted); }
.perm li.no::before { content: "✕ "; color: #b3122a; }

/* ---------- leads ---------- */
.lead-in { display: flex; flex-wrap: wrap; gap: 10px; align-items: end; padding: 14px 16px; }
.lead-in label { flex: 1; min-width: 130px; }
.lead-in .btn { border: 0; }
.lead-card { margin: 0 16px 10px; border: 1px solid var(--line); border-radius: 12px; padding: 12px 14px; font-size: .86rem; display: grid; gap: 6px; animation: pop .35s cubic-bezier(.3,1.5,.5,1); }
.lead-top { display: flex; justify-content: space-between; gap: 8px; align-items: center; }
.lead-top b { font-size: .95rem; }
.score { font: 700 .78rem var(--mono); padding: 3px 8px; border-radius: 6px; background: #e3f7ec; color: #11734f; white-space: nowrap; }
.score.mid { background: #fff3dc; color: #8a5a00; }
.lead-card small { color: var(--muted); }
.lead-card details summary { cursor: pointer; color: var(--blue-deep); font-weight: 600; font-size: .82rem; }
.lead-card details p { margin: 6px 0 0; padding: 10px; background: var(--paper); border-radius: 8px; white-space: pre-line; }
.lead-actions { display: flex; gap: 6px; }
.lead-actions button { font: 600 .78rem var(--body); border: 1.5px solid var(--blue); background: #fff; color: var(--blue-deep); border-radius: 99px; padding: 5px 11px; cursor: pointer; }
.lead-actions button.done { background: var(--blue); color: #fff; }

/* ---------- outreach ---------- */
.out-wrap { padding: 14px 16px 16px; display: grid; gap: 12px; font-size: .88rem; }
.out-who { display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; background: var(--paper); border-radius: 10px; padding: 10px 12px; }
.out-who b { font-size: 1.05rem; }
.seq { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.seq li { display: grid; grid-template-columns: 64px 1fr; gap: 10px; align-items: start; }
.seq li span { font: 600 .74rem var(--mono); color: var(--blue-deep); background: #eef2ff; border-radius: 6px; padding: 4px 6px; text-align: center; }
.email { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.email-head { background: #fafaf7; padding: 8px 12px; font-size: .8rem; color: var(--muted); border-bottom: 1px solid var(--line); }
.email-head b { color: var(--text); }
.email p { margin: 0; padding: 12px; white-space: pre-line; }
.out-go { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.out-go .btn { border: 0; }
.out-go span { color: #11734f; font-weight: 600; }

/* ---------- order desk ---------- */
.od .so { background: #0b1124; border: 1px solid rgba(255,255,255,.1); border-radius: 12px; padding: 12px 14px; font-size: .86rem; animation: pop .4s cubic-bezier(.3,1.5,.5,1); }
.od .so b.h { display: block; font: 600 .72rem var(--mono); color: var(--shirt); text-transform: uppercase; letter-spacing: .06em; margin-bottom: 6px; }
.od .so table { font-size: .82rem; }
.od .so th { color: #8d97b3; border-color: rgba(255,255,255,.1); }
.od .so td { border-color: rgba(255,255,255,.06); color: #e6ebf7; }
.od .so small { color: #8d97b3; display: block; }
.od .tagm { font: 600 .68rem var(--mono); padding: 2px 6px; border-radius: 4px; background: rgba(143,184,255,.18); color: var(--shirt); white-space: nowrap; }
.od .tagw { font: 600 .68rem var(--mono); padding: 2px 6px; border-radius: 4px; background: rgba(255,181,71,.18); color: var(--amber); white-space: nowrap; }

.phone { justify-self: start; width: min(300px, 100%); background: #fff; border: 1px solid var(--line); border-radius: 22px; padding: 14px; display: grid; gap: 6px; }
.phone > small { color: var(--muted); font-size: .74rem; text-align: center; }
.phone .sms { background: #e9e9ee; }


/* ---------- phone tweaks ---------- */
@media (max-width: 600px) {
  .acct-table th:first-child, .acct-table td:first-child { display: none; }
  .demo-panel table { font-size: .8rem; }
  .demo-panel th, .demo-panel td { padding: 7px 6px; }
  .stock td:last-child button { display: block; margin: 0 0 4px auto; }
  .prod-add { flex-wrap: wrap; }
  .prod-add input[type=number] { flex: 1 1 70px; }
  .lead-in label { min-width: 0; flex: 1 1 120px; }
  .panel-foot .btn { flex: 1 1 auto; justify-content: center; }
}

.audit-card { display: grid; grid-template-columns: auto 1fr auto; gap: 12px; align-items: start; margin: 0 16px 10px; padding: 12px 14px; border: 1px solid var(--line); border-radius: 12px; }
.audit-icon { font-size: 1.3rem; line-height: 1.2; }
.audit-card b { display: block; font-size: .95rem; margin-bottom: 2px; }
.audit-card p { margin: 0; font-size: .85rem; color: #343b4d; }
.audit-impact { font: 700 1rem var(--mono); color: #0b7a4f; text-align: right; white-space: nowrap; }
.audit-impact small { display: block; font: 500 .7rem var(--body); color: var(--muted); }
.audit-total { display: flex; justify-content: space-between; align-items: center; margin: 0 16px 16px; padding: 12px 14px; border-radius: 12px; background: #f3f6ff; font-weight: 600; }
.audit-total b { font: 700 1.3rem var(--mono); color: #0b7a4f; }
@media (max-width: 480px) { .audit-card { grid-template-columns: auto 1fr; } .audit-impact { grid-column: 2; text-align: left; } }

.run-panel, .fixed-panel { height: min(600px, 85vh); overflow-y: auto; }

@media (max-width: 700px) {
  .solution { padding-block: 40px; }
  .solution .section-head { margin-bottom: 16px; }
  .solution .section-head h2 { font-size: 1.7rem; }
  .solution .section-head .lead { display: none; }
  .subtabs, .jump, .solution .idea-filters { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: -24px; padding-inline: 24px; }
  .subtabs::-webkit-scrollbar, .jump::-webkit-scrollbar, .solution .idea-filters::-webkit-scrollbar { display: none; }
  .subtabs, .jump, .solution .idea-filters { scroll-snap-type: x proximity; -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 20px, #000 calc(100% - 20px), transparent 100%); mask-image: linear-gradient(90deg, transparent 0, #000 20px, #000 calc(100% - 20px), transparent 100%); }
  .subtabs button, .jump a, .solution .idea-filters button { flex: none; white-space: nowrap; scroll-snap-align: center; }
  .solution .idea-filters { position: static; }
  .jump { display: none; }
  .solution-panel { padding-top: 4px; }
  .solution-panel .demo { gap: 20px; }
  .demo-copy h2 { display: none; }
  .demo-copy p { font-size: 1rem; margin: 12px 0 20px; }
  .demo-copy .bullets, .demo-copy .auto-list { display: none; }
  .demo-panel { border-radius: 14px; font-size: .85rem; }
  .run-panel, .fixed-panel { height: min(340px, 56vh); }
  .mini-chat { height: 300px; }
  .auto-in { padding: 12px 12px 8px; }
  .auto-in textarea { height: 96px; }
  .auth { min-height: 280px; padding: 14px 10px; }
  .auth-card { padding: 18px; gap: 10px; }
  .anim-panel { aspect-ratio: 16 / 9; }
  .panel-bar { padding: 9px 12px; }
  .panel-foot, .tax-in, .lead-in { padding-inline: 12px; }
}

.auth-card.portal { width: min(540px, 100%); gap: 14px; }
.pt-head { display: flex; justify-content: space-between; align-items: start; gap: 12px; }
.pt-head h4 { margin: 6px 0 2px; }
.pt-head small { color: var(--muted); }
.pt-list { display: grid; gap: 8px; }
.pt-row { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; }
.pt-row b { display: block; font-size: .92rem; }
.pt-row small { display: block; color: var(--muted); font-size: .8rem; }
.pt-price { color: #0b7a4f; font-weight: 700; }
.pt-acct { display: grid; grid-template-columns: auto 1fr; gap: 6px 16px; margin: 0; }
.pt-acct dt { color: var(--muted); }
.pt-acct dd { margin: 0; font-weight: 600; }
.pt-note { padding: 9px 12px; border-radius: 10px; background: #eaf8f0; color: #0b5a3a; font-size: .84rem; }
.pt-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-top: 10px; border-top: 1px solid var(--line); font-weight: 600; }
.pt-bar .btn[disabled] { opacity: .4; cursor: default; }

@media (max-width: 700px) {
  .run-panel .out-card, .run-panel .flash-in, .run-panel .lead-card, .run-panel .audit-card, .run-panel .pipeline li { animation: none; transition: none; }
  .run-panel .pipeline li.busy i { animation: none; border-top-color: var(--shirt); }
  .run-panel .btn { transition: none; }
}