/* Home. Greeting, account at a glance, go-live checklist, trial, the assistant,
   the business line (what happens when someone calls), setup progress and activity. */

/* Greeting */
.home-welcome{align-items:flex-end}
.home-signal{display:none}
.account-kicker{display:block;color:var(--muted);font-size:.75rem;font-weight:650;letter-spacing:.01em}

/* Account at a glance */
.workspace-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:20px}
.workspace-metric{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"label icon" "value value" "sub sub";align-items:center;gap:2px 12px;min-width:0;padding:18px 20px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-sm);color:var(--text);text-decoration:none;transition:border-color var(--t-fast),box-shadow var(--t-med) var(--ease),transform var(--t-med) var(--ease)}
.workspace-metric:hover{border-color:var(--accent-line);box-shadow:var(--shadow-md);text-decoration:none;transform:translateY(-1px)}
.workspace-metric>span{grid-area:label;color:var(--muted);font-size:.8125rem;font-weight:650}
.workspace-metric>i{grid-area:icon;display:grid;place-items:center;width:34px;height:34px;border-radius:var(--r-md);background:var(--accent-soft);color:var(--accent-text);font-size:1.1rem}
.workspace-metric>strong{grid-area:value;margin-top:6px;overflow:hidden;font-size:1.875rem;font-weight:450;letter-spacing:-.035em;line-height:1.1;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.workspace-metric>small{grid-area:sub;margin-top:2px;color:var(--muted);font-size:.8125rem}

/* Go-live checklist */
.golive{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:28px;margin-bottom:20px;padding:24px 28px;border:1px solid var(--accent-line);border-radius:var(--r-bubble);background:var(--signature-soft);box-shadow:var(--shadow-sm)}
.golive h2{margin:0 0 4px;font-size:1.25rem;letter-spacing:-.025em}
.golive>div>p{margin:0;color:var(--muted)}
.golive-ring{position:relative;display:grid;place-items:center;width:104px;height:104px;border-radius:50%;background:var(--surface);box-shadow:var(--shadow-sm)}
.golive-ring svg{position:absolute;inset:0;transform:rotate(-90deg)}
.golive-ring circle{fill:none;stroke-width:9;stroke-linecap:round}
.golive-ring .track{stroke:color-mix(in srgb,var(--accent) 14%,transparent)}
.golive-ring .meter{stroke:var(--accent);stroke-dasharray:289;stroke-dashoffset:var(--offset,289);transition:stroke-dashoffset 400ms var(--ease)}
.golive-ring>div{position:relative;text-align:center}
.golive-ring strong{display:block;font-size:1.625rem;font-weight:550;letter-spacing:-.04em;line-height:1;font-variant-numeric:tabular-nums}
.golive-ring small{display:block;margin-top:2px;color:var(--muted);font-size:.75rem}
.golive-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:16px 0 0;padding:0;list-style:none}
.golive-steps a{display:flex;align-items:flex-start;gap:10px;height:100%;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-md);background:var(--surface);color:var(--text);text-decoration:none;transition:border-color var(--t-fast),box-shadow var(--t-fast)}
.golive-steps a:hover{border-color:var(--accent-line);text-decoration:none}
.golive-steps a.next{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent)}
.golive-steps a>span:nth-child(2){display:grid;flex:1;gap:2px;min-width:0}
.golive-steps strong{font-size:.875rem;line-height:1.35}
.golive-steps small{color:var(--muted);font-size:.8125rem;line-height:1.4}
.golive-check{display:grid;place-items:center;flex:none;width:22px;height:22px;margin-top:1px;border:2px solid var(--line-strong);border-radius:50%;color:transparent;font-size:.9rem}
.golive-steps li.done .golive-check{border-color:var(--ok);background:var(--ok);color:#fff}
.golive-steps li.done strong{color:var(--muted)}
@keyframes golive-fill{from{stroke-dashoffset:var(--from,289)}}
@keyframes golive-tick{from{transform:scale(.3);opacity:0}}
.golive-go{flex:none;margin-top:1px;color:var(--faint);font-size:1.15rem}
.golive-steps a.next .golive-go{color:var(--accent)}

/* Free trial and the save-a-card prompt */
.trial-strip{display:flex;align-items:center;gap:16px;margin-bottom:16px;padding:14px 18px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-xs)}
.trial-days{display:grid;place-items:center;align-content:center;flex:none;width:56px;height:56px;border-radius:16px 16px 16px 5px;background:var(--accent-soft);color:var(--accent-text);font-size:1.375rem;font-weight:650;line-height:1;font-variant-numeric:tabular-nums}
.trial-days small{margin-top:3px;font-size:.6875rem;font-weight:650}
.trial-strip>div{flex:1;min-width:0}
.trial-strip strong{display:block;font-size:.9375rem}
.trial-strip>div>span{display:block;margin-top:2px;color:var(--muted);font-size:.875rem}
.trial-strip.urgent{border-color:var(--warn-line);background:var(--warn-soft)}
.trial-strip.urgent .trial-days{background:color-mix(in srgb,var(--warn) 16%,var(--surface));color:var(--warn)}
.page-dashboard #autopay-prompt{display:flex;flex-wrap:wrap;align-items:center;gap:10px 16px;margin:0 0 20px;padding:12px 16px;border:1px dashed var(--line-strong);border-radius:var(--r-lg);background:var(--surface-2);color:var(--text-2);font-size:.875rem}
.page-dashboard #autopay-prompt p{flex:1;min-width:220px;margin:0}
.page-dashboard #autopay-prompt .bx{color:var(--accent);margin-right:4px}
.page-dashboard #autopay-prompt form{margin:0}

/* The assistant (a banner) and the business line */
.home-essentials{display:grid;gap:20px;margin-bottom:20px}
.assistant-discovery{display:flex;flex-direction:column;gap:16px;min-width:0;padding:24px;border-radius:var(--r-bubble)}
.assistant-discovery-mark{display:grid;place-items:center;width:52px;height:52px;border-radius:16px 16px 16px 5px;background:var(--signature);color:#fff;font-size:1.6rem;box-shadow:0 10px 24px -14px var(--accent)}
.assistant-discovery-copy .eyebrow{margin-bottom:6px}
.assistant-discovery h2{font-size:1.25rem;letter-spacing:-.025em}
.assistant-discovery p{max-width:52ch;margin-top:6px;color:var(--muted)}
.assistant-discovery-actions{display:flex;flex-wrap:wrap;gap:10px}

.empty-line-card{display:flex;flex-wrap:wrap;align-items:center;gap:16px;min-width:0;padding:22px;border:1px dashed var(--line-strong);border-radius:var(--r-lg);background:var(--surface)}
.empty-line-card>span{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:var(--r-md);background:var(--accent-soft);color:var(--accent-text);font-size:1.4rem}
.empty-line-card>div{flex:1;min-width:200px}
.empty-line-card h2{font-size:1.0625rem}
.empty-line-card p{margin-top:4px;color:var(--muted);font-size:.875rem}

.business-line-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-sm)}
.business-line-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px 22px 0}
.business-line-head>div{min-width:0}
.line-kicker{display:block;color:var(--muted);font-size:.8125rem;font-weight:650}
.business-line-head h2{margin-top:2px;overflow:hidden;font-size:1.75rem;font-weight:500;letter-spacing:-.03em;line-height:1.2;text-overflow:ellipsis;white-space:nowrap;font-variant-numeric:tabular-nums}
.line-state-pill{display:inline-flex;align-items:center;flex:none;gap:7px;max-width:100%;padding:5px 11px;border-radius:var(--r-pill);background:var(--ok-soft);color:var(--ok);font-size:.75rem;font-weight:700}
.line-state-pill i{flex:none;width:8px;height:8px;border-radius:50%;background:currentColor;box-shadow:0 0 0 3px color-mix(in srgb,currentColor 20%,transparent)}
.tone-paused .line-state-pill{background:var(--warn-soft);color:var(--warn)}
.line-state-pill.is-changed{animation:line-state-morph 520ms var(--spring) both}
.line-state-pill.is-changed i{animation:line-state-dot 1.1s ease-out 2}
@keyframes line-state-morph{0%{opacity:.4;transform:scale(.86)}100%{opacity:1;transform:none}}
@keyframes line-state-dot{0%{box-shadow:0 0 0 0 color-mix(in srgb,currentColor 45%,transparent)}100%{box-shadow:0 0 0 9px transparent}}
.line-number-menu{position:relative;z-index:9;width:fit-content;max-width:100%}
.line-number-menu>summary{display:flex;align-items:center;gap:6px;width:fit-content;max-width:100%;list-style:none;cursor:pointer}
.line-number-menu>summary::-webkit-details-marker{display:none}
.line-number-menu>summary>i{flex:none;color:var(--muted);font-size:1.25rem;transition:transform var(--t-med) var(--ease)}
.line-number-menu[open]>summary>i{transform:rotate(180deg)}
.line-number-popover{position:absolute;top:calc(100% + 8px);left:0;width:min(330px,calc(100vw - 32px));padding:6px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-lg);animation:popover-in var(--t-med) var(--ease)}
.line-number-popover>span{display:block;padding:6px 10px 8px;color:var(--muted);font-size:.75rem;font-weight:650}
.line-number-popover>a{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;padding:9px 10px;border-radius:var(--r-sm);color:var(--text);text-decoration:none}
.line-number-popover>a:hover,.line-number-popover>a[aria-current=true]{background:var(--surface-2);text-decoration:none}
.line-number-popover strong,.line-number-popover small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.line-number-popover strong{font-size:.875rem;font-variant-numeric:tabular-nums}
.line-number-popover small{color:var(--muted);font-size:.8125rem}
.line-number-popover>a>i{color:var(--accent);font-size:1.15rem}

.home-call-outcome{display:flex;align-items:flex-start;gap:14px;margin:18px 22px 0;padding:16px;border-radius:var(--r-md);background:var(--surface-2)}
.home-call-mark{display:grid;place-items:center;flex:none;width:40px;height:40px;border-radius:var(--r-md);background:var(--accent-soft);color:var(--accent-text);font-size:1.25rem}
.home-call-outcome h3{margin-top:2px;font-size:1rem}
.home-call-outcome p{margin-top:2px;color:var(--muted);font-size:.875rem}
.home-plan-details{margin:12px 22px 0;border-top:1px solid var(--line)}
.home-plan-details>summary{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:12px 0;color:var(--text-2);font-size:.875rem;font-weight:650;list-style:none;cursor:pointer}
.home-plan-details>summary::-webkit-details-marker{display:none}
.home-plan-details>summary:hover{color:var(--text)}
.home-plan-details>summary>i{color:var(--muted);font-size:1.15rem;transition:transform var(--t-med) var(--ease)}
.home-plan-details[open]>summary>i{transform:rotate(180deg)}
.call-outcome-flow{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding-bottom:4px;animation:disclosure-in var(--t-med) var(--ease)}
.call-outcome-flow>div{min-width:0;padding:12px 14px;border:1px solid var(--line);border-radius:var(--r-md)}
.call-outcome-flow small{display:block;color:var(--muted);font-size:.75rem;font-weight:650}
.call-outcome-flow strong{display:block;margin-top:2px;font-size:.875rem}
.call-outcome-flow p{margin-top:2px;color:var(--muted);font-size:.8125rem;line-height:1.45}
.call-outcome-flow .needs-attention{border-color:var(--warn-line);background:var(--warn-soft)}
.call-outcome-flow .needs-attention strong{color:var(--warn)}

.business-line-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto;padding:18px 22px 20px}
.today-override{position:relative}
.today-override>summary{list-style:none}
.today-override>summary::-webkit-details-marker{display:none}
.today-override[open]>summary{background:var(--surface-3)}
.today-override>form{position:absolute;bottom:calc(100% + 8px);right:0;z-index:50;width:min(340px,calc(100vw - 36px));padding:14px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-lg);animation:disclosure-in var(--t-med) var(--ease)}
.today-override fieldset{display:grid;gap:6px;margin:0 0 12px}
.today-override legend{margin-bottom:8px;font-size:.875rem;font-weight:700}
.today-override fieldset label{position:relative;cursor:pointer}
.today-override fieldset input{position:absolute;opacity:0}
.today-override fieldset label>span{display:block;padding:10px 12px;border:1px solid var(--line);border-radius:var(--r-md);transition:border-color var(--t-fast),background-color var(--t-fast)}
.today-override fieldset input:checked+span{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 0 1px var(--accent)}
.today-override fieldset input:focus-visible+span{box-shadow:var(--ring)}
.today-override fieldset input:disabled+span{cursor:not-allowed;opacity:.45}
.today-override strong,.today-override small{display:block}
.today-override strong{font-size:.875rem}
.today-override small{margin-top:1px;color:var(--muted);font-size:.8125rem}
.line-duration{display:grid;gap:6px;margin-bottom:12px;color:var(--text-2);font-size:.8125rem;font-weight:650}
.line-mode-warning{display:block;margin-bottom:10px;color:var(--warn);font-size:.8125rem;font-weight:650}

/* Next setup step */
.setup-ribbon{display:flex;align-items:center;gap:16px;margin-bottom:20px;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--surface);box-shadow:var(--shadow-xs)}
.setup-count{display:grid;place-items:center;flex:none;width:46px;height:46px;border:2px solid var(--accent-line);border-radius:50%;color:var(--accent-text);font-size:.8125rem;font-weight:750;font-variant-numeric:tabular-nums}
.setup-ribbon>div{flex:1;min-width:0}
.setup-ribbon strong{display:block;font-size:.9375rem}
.setup-ribbon p{margin-top:2px;color:var(--muted);font-size:.875rem}
.setup-progress{display:block;height:6px;margin-top:10px;overflow:hidden;border-radius:var(--r-pill);background:var(--surface-3)}
.setup-progress>span{display:block;height:100%;border-radius:inherit;background:var(--signature);transition:width var(--t-slow) var(--ease)}

/* Recent activity and shortcuts */
.home-secondary-grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:20px;align-items:start}
.home-secondary-grid>.panel{margin:0}
.workspace-shortcuts{display:grid;gap:10px;padding:20px 22px 22px}
.workspace-shortcuts h2{font-size:1rem}
.workspace-shortcuts>p{margin:-4px 0 4px;color:var(--muted);font-size:.875rem}
.workspace-shortcuts>a{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid var(--line);border-radius:var(--r-md);color:var(--text);text-decoration:none;transition:border-color var(--t-fast),background-color var(--t-fast)}
.workspace-shortcuts>a:hover{border-color:var(--accent-line);background:var(--surface-2);text-decoration:none}
.workspace-shortcuts>a>.bx:first-child{display:grid;place-items:center;flex:none;width:36px;height:36px;border-radius:var(--r-md);background:var(--accent-soft);color:var(--accent-text);font-size:1.15rem}
.workspace-shortcuts>a>span{display:grid;flex:1;gap:1px;min-width:0}
.workspace-shortcuts strong{font-size:.875rem}
.workspace-shortcuts small{color:var(--muted);font-size:.75rem}
.workspace-shortcuts>a>.bx:last-child{color:var(--faint);font-size:1.15rem}

@media(min-width:1000px){
 .home-signal{display:flex;align-items:flex-end;gap:4px;height:38px;margin:0 6px 6px auto}
 .home-signal i{display:block;width:5px;border-radius:var(--r-pill);background:var(--signature);opacity:.85}
 .home-signal i:nth-child(1),.home-signal i:nth-child(7){height:12px}
 .home-signal i:nth-child(2),.home-signal i:nth-child(6){height:22px}
 .home-signal i:nth-child(3),.home-signal i:nth-child(5){height:31px}
 .home-signal i:nth-child(4){height:38px}
}
@media(min-width:760px){
 .assistant-discovery{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:20px}
 .assistant-discovery-actions{justify-content:flex-end}
}
@media(min-width:900px){
 .business-line-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start}
 .business-line-head,.business-line-actions{grid-column:1/-1}
 .home-call-outcome{margin:18px 8px 0 22px}
 .home-plan-details{margin:18px 22px 0 8px;padding:0 14px;border:1px solid var(--line);border-radius:var(--r-md)}
 .home-plan-details>summary{min-height:72px}
 .call-outcome-flow{grid-template-columns:1fr;padding-bottom:14px}
 .business-line-actions{padding-top:20px}
}
@media(max-width:860px){
 .home-secondary-grid{grid-template-columns:1fr}
 .golive-steps{grid-template-columns:1fr}
}
@media(max-width:600px){
 .workspace-metrics{gap:8px;margin-bottom:14px}
 .workspace-metric{grid-template-areas:"label" "value";grid-template-columns:1fr;padding:12px 14px}
 .workspace-metric>i,.workspace-metric>small{display:none}
 .workspace-metric>strong{margin-top:2px;font-size:1.25rem}
 .workspace-metric>span{font-size:.75rem}
 .golive{grid-template-columns:1fr;justify-items:start;gap:16px;padding:20px}
 .golive-ring{width:84px;height:84px}
 .golive-ring strong{font-size:1.375rem}
 .trial-strip{flex-wrap:wrap}
 .trial-strip>.btn{width:100%}
 .home-essentials{gap:14px;margin-bottom:14px}
 .assistant-discovery{padding:20px}
 .assistant-discovery-actions>.btn{flex:1}
 .business-line-head{flex-direction:column;padding:18px 18px 0}
 .business-line-head h2{font-size:1.5rem}
 .home-call-outcome{margin:16px 18px 0}
 .home-plan-details{margin:12px 18px 0}
 .call-outcome-flow{grid-template-columns:1fr}
 .business-line-actions{padding:16px 18px 18px}
 .business-line-actions>.btn,.business-line-actions>.today-override,.today-override>summary{width:100%}
 .today-override>form{position:fixed;left:10px;right:10px;bottom:calc(var(--dock-clearance) + 10px);width:auto}
 .setup-ribbon{flex-wrap:wrap}
 .setup-ribbon>.btn{width:100%}
 .home-secondary-grid{gap:14px}
}
@media(prefers-reduced-motion:no-preference){
 .golive.is-progress .golive-ring .meter{animation:golive-fill 700ms var(--ease) 150ms backwards}
 .golive-steps li.just-done .golive-check{animation:golive-tick 520ms var(--spring) 600ms backwards}
 .home-signal i{transform-origin:bottom;animation:sa-signal 1.6s var(--ease) both}
 .home-signal i:nth-child(2),.home-signal i:nth-child(6){animation-delay:80ms}
 .home-signal i:nth-child(3),.home-signal i:nth-child(5){animation-delay:160ms}
 .home-signal i:nth-child(4){animation-delay:240ms}
}
@keyframes sa-signal{0%{transform:scaleY(.2)}45%{transform:scaleY(1.08)}70%{transform:scaleY(.85)}100%{transform:none}}
