/* Owner workspace: translucent surfaces over a quiet, illuminated canvas. */
.owner-ui { --muted:#b2c1ce; --line:rgba(187,211,231,.19); color:#edf3f8; background:radial-gradient(ellipse at 75% 25%,#263c50 0,transparent 48%),radial-gradient(ellipse at 15% 80%,#28413f 0,transparent 42%),#101c28; min-height:100svh; }
.owner-ui .brand-rail { min-height:68px; padding:12px 28px; background:#101b27; border-bottom:1px solid var(--line); }
.owner-ui .brand { font-size:20px; }
.owner-ui .brand img { width:21px; height:29px; }
.owner-ui .brand-rail .eyebrow { font-size:10px; }
.owner-ui .brand-rail > a:last-child { font-size:13px; }
.owner-ui #notice { color:#172332; }
.owner-ui .workspace { max-width:1800px; margin:auto; grid-template-columns:214px minmax(0,1fr); min-height:calc(100svh - 220px); }
.owner-ui .sidebar { padding:28px 16px 20px; gap:30px; background:rgba(12,23,33,.65); border-right:1px solid var(--line); }
.owner-ui .sidebar-brand { padding:0 4px; display:flex; align-items:center; gap:10px; font-size:19px; }
.owner-ui .sidebar-brand small { display:block; margin-top:4px; font-size:11px; color:var(--muted); font-weight:400; }
.workspace-monogram { display:grid; place-items:center; width:38px; height:42px; border:1px solid #8fa5b9; border-radius:12px; color:#edd3bb; font-size:23px; }
.owner-ui .sidebar nav { gap:6px; }
.owner-ui .sidebar nav button { display:flex; align-items:center; gap:11px; padding:12px; font-size:14px; color:#b6c7d5; background:transparent; border:1px solid transparent; min-height:46px; }
.nav-icon { width:20px; height:20px; flex:0 0 20px; }
.owner-ui .sidebar nav button[aria-current] { color:#fff2e4; background:linear-gradient(120deg,rgba(218,186,155,.18),rgba(218,186,155,.05)); border-color:rgba(218,186,155,.25); box-shadow:inset 3px 0 #d8b898; }
.nav-count { margin-left:auto; font-size:12px; color:#c1cdda; }
.owner-ui .sidebar .next-badge { margin-left:0; min-width:20px; height:20px; font-size:11px; }
.owner-ui .sidebar .session { padding:0 8px; font-size:12px; }
.workspace-status { display:flex; gap:7px; align-items:center; color:#d8e8e3; font-size:11px; }
.workspace-status > span { width:6px; height:6px; border-radius:50%; background:#a4d6bf; box-shadow:0 0 12px #a4d6bf66; }
.owner-ui .session p { margin:12px 0; font-size:12px; }
.owner-ui .session button { padding:6px 0; min-height:36px; display:block; font-size:12px; }
.workspace-credit { padding:0 8px; font-size:11px; color:var(--muted); }
.workspace-credit strong { display:block; margin-top:5px; color:#d5e0e9; font-weight:500; letter-spacing:.04em; }
.crm-stage { min-width:0; padding:0 28px; }
.crm-toolbar { min-height:98px; display:flex; justify-content:space-between; align-items:center; gap:20px; }
.crm-breadcrumb { display:block; font-size:12px; color:var(--muted); margin-bottom:8px; }
.crm-toolbar strong { font-size:18px; font-weight:500; }
.owner-role { display:flex; align-items:center; gap:12px; font-size:12px; color:var(--muted); flex-shrink:0; }
.owner-avatar,.context-avatar,.register-avatar { display:grid; place-items:center; border:1px solid #bfcddd3d; background:linear-gradient(145deg,#6d829866,#d8b89826); border-radius:50%; color:#f4e2d2; width:38px; height:38px; flex-shrink:0; }
.crm-pipeline { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:8px; border:1px solid var(--line); border-radius:18px; background:rgba(15,28,41,.54); margin-bottom:26px; }
.owner-ui .pipeline-step { display:flex; align-items:center; gap:11px; padding:10px 12px; background:transparent; color:#d7e2ec; min-width:0; border-radius:12px; }
.pipeline-step strong,.pipeline-step small { display:block; }
.pipeline-step strong { font-size:13px; font-weight:600; }
.pipeline-step small { color:var(--muted); font-size:11px; margin-top:4px; }
.step-index { display:grid; place-items:center; width:30px; height:30px; flex:0 0 30px; border:1px solid var(--line); border-radius:50%; font-size:12px; }
.step-index svg { width:20px; height:20px; }
.is-complete .step-index { color:#b6e6d1; background:#426f602e; border-color:#95d5b950; }
.owner-ui .workspace-content { grid-template-columns:minmax(0,1fr) 258px; gap:22px; padding:0 0 40px; align-items:start; }
.crm-panel,.stat-bubble,.work-focus,.workspace-register { border:1px solid rgba(203,222,239,.2); background:linear-gradient(135deg,rgba(71,92,111,.32),rgba(33,51,68,.55)); backdrop-filter:blur(22px); -webkit-backdrop-filter:blur(22px); box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 16px 36px rgba(3,11,18,.13); border-radius:24px; }
.content-panel { padding:28px; }
.owner-ui h2.demo-view-title { font-size:32px; line-height:1.15; font-weight:500; letter-spacing:-.035em; margin-bottom:20px; }
.owner-ui h2 { font-size:22px; font-weight:500; line-height:1.25; letter-spacing:-.02em; }
.owner-ui p { font-size:14px; line-height:1.6; }
.owner-ui .eyebrow,.owner-ui dt,.owner-ui .field-label { color:var(--muted); font:500 11px/1.6 Hanken,Arial,sans-serif; letter-spacing:.06em; }
.owner-ui button { border-radius:12px; font-size:14px; padding:12px 17px; background:#dcc0a5; color:#172331; font-weight:600; transition:background .16s,box-shadow .16s; }
.owner-ui button:hover { box-shadow:inset 0 0 0 1px #f6dec766,0 4px 15px #07101930; }
.owner-ui button.secondary { background:#ffffff06; color:#e1eaf0; border-color:#9bb4c64d; }
.owner-ui button.link { color:#c5d6e5; background:transparent; font-size:12px; font-weight:400; padding-left:0; box-shadow:none; }
.owner-ui :is(button,a,input,textarea,select,summary):focus-visible { outline-color:#f3d0a9; }
.owner-ui .actions { gap:12px; }
.owner-ui .trace { margin:0; padding:0; border:0; display:grid; gap:20px; min-width:0; }
.customer-context,.activity-panel { padding:21px; }
.panel-heading { display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:22px; }
.owner-ui .panel-heading h2 { margin:0; font-size:14px; font-weight:600; letter-spacing:0; }
.panel-heading > span { font-size:10px; color:var(--muted); }
.context-person { display:flex; gap:10px; align-items:center; margin:25px 0; }
.context-person > div { min-width:0; }
.context-person strong { display:block; font-size:14px; font-weight:500; overflow-wrap:anywhere; }
.context-person small { display:block; font-size:11px; color:var(--muted); margin-top:5px; overflow-wrap:anywhere; }
.customer-context dl { margin:0; }
.customer-context dl > div { padding:12px 0; border-top:1px solid var(--line); }
.customer-context dd { margin:5px 0 0; font-size:13px; overflow-wrap:anywhere; }
.owner-ui .customer-context p { margin:20px 0 0; font-size:12px; color:var(--muted); }
.owner-ui .trace .events { display:block; margin:0; }
.owner-ui .events li { padding:12px 0 12px 16px; position:relative; }
.owner-ui .events li::before { content:""; position:absolute; top:20px; left:0; width:5px; height:5px; border-radius:50%; background:#b9c9d6; }
.owner-ui .events strong { font-size:12px; font-weight:400; }
.owner-ui .events time { font-size:10px; margin-bottom:5px; }
.workspace-tools { display:flex; gap:20px; padding:10px 4px; }
.owner-ui .next-step,.owner-ui .step-note { margin:0 0 18px; padding:14px 18px; background:#d8b8980e; border:1px solid #d8b89840; border-radius:16px; }
.owner-ui .next-step p,.owner-ui .step-note p { font-size:13px; }
.owner-ui .fields { gap:12px; margin:24px 0; }
.owner-ui .field { padding:12px 14px; background:#0b192766; border-color:#adc7dc35; border-radius:14px; font-size:13px; color:#c3d0dc; }
.owner-ui input,.owner-ui textarea { background:transparent; color:#f1f5f8; font-size:16px; }
.owner-ui .compose textarea,.owner-ui .estimate-item input { background:#0b192766; border:1px solid #adc7dc35; border-radius:12px; padding:12px; margin-top:8px; }
.owner-ui .estimate-item { border-radius:16px; padding:18px; }
.owner-ui .estimate-item label { font-size:13px; gap:0; color:#c3d0dc; }
.owner-ui .field-error { color:#ffb6a7; }
.owner-ui .record-fields { gap:12px; }
.owner-ui .record-fields div { background:#0d1c2a55; border-color:var(--line); border-radius:14px; padding:16px; }
.owner-ui .record-fields dd { font-size:16px; }
.owner-ui .record-summary { font-size:18px; line-height:1.6; }
.owner-ui .table-head { background:#0c1c2a66; border-radius:12px 12px 0 0; font-size:10px; }
.owner-ui .record-row { background:#66809516; color:#eaf1f6; border-radius:0 0 14px 14px; padding:22px 16px; }
.owner-ui .record-row strong { font-size:20px; }
.owner-ui .record-row small { font-size:13px; }
.owner-ui .badge,.status-pill { border-radius:20px; background:#a4cfbd20; color:#c5ebd9; border:1px solid #a4cfbd40; font:500 11px Hanken,Arial,sans-serif; padding:7px 11px; }
.owner-ui .quote-document { background:#10213155; border:1px solid var(--line); border-radius:18px; padding:24px; }
.owner-ui .quote-document h2 { font-size:22px; }
.owner-ui .quote-total { color:#f1d6ba; font-size:22px; }
.owner-ui .confirmation { font-size:13px; }
.owner-ui input[type=checkbox] { accent-color:#d8b898; }
.owner-ui .failure { background:#d8b89812; border-color:#d8b89855; border-radius:14px; }
.owner-ui .empty { font-size:16px; padding:28px 0; }
.owner-ui .packet,.owner-ui .dock { border-radius:16px; font-size:12px; }
.owner-ui .conversation li { margin:14px 0; padding:18px; border:1px solid var(--line); border-radius:18px 18px 18px 4px; background:#10223266; }
.owner-ui .conversation li:has(.eyebrow):nth-child(even) { background:#ffffff06; border-radius:18px 18px 4px 18px; margin-left:24px; }
.owner-ui .conversation p { font-size:17px; }
.owner-ui .conversation .eyebrow { font-size:10px; color:#d7bda4; }
.owner-ui dialog { background:#213343; color:#edf3f8; border-radius:24px; }
.content-panel:has(.overview-heading) { background:none; border:0; box-shadow:none; backdrop-filter:none; padding:0; }
.overview-heading { display:flex; justify-content:space-between; align-items:start; gap:12px; margin:4px 0 24px; }
.owner-ui .overview-heading h2.demo-view-title { margin:0 0 10px; }
.overview-heading p { color:var(--muted); margin:0; }
.environment-label { border:1px solid var(--line); border-radius:20px; padding:7px 10px; font-size:10px; color:#c7d5e0; white-space:nowrap; }
.overview-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:14px; margin-bottom:22px; }
.owner-ui .stat-bubble { padding:20px; background:linear-gradient(140deg,#718ca130,#253a4d55); border:1px solid var(--line); border-radius:22px; color:#f0f5f8; font-weight:400; }
.stat-bubble > span,.stat-bubble > strong,.stat-bubble > small { display:block; }
.stat-bubble > span { font-size:13px; color:#c6d4df; }
.stat-bubble > strong { font-size:42px; font-weight:400; line-height:1.4; letter-spacing:-.06em; }
.stat-bubble > small { font-size:11px; line-height:1.5; color:var(--muted); }
.work-focus { display:flex; align-items:start; gap:22px; padding:28px; background:radial-gradient(ellipse at 0 0,#91bfb226,transparent 70%),linear-gradient(130deg,#49687a50,#23384999); margin-bottom:22px; }
.focus-orbit { display:grid; place-items:center; width:52px; height:52px; flex:0 0 52px; border-radius:18px; border:1px solid #b6d9d65c; background:#a6d9cb12; box-shadow:0 0 30px #a6d9cb0b,inset 0 1px #ffffff1a; color:#c4e1d9; }
.focus-orbit svg { width:25px; height:25px; }
.focus-label { font-size:11px; color:#c5dfd7; display:block; margin:2px 0 12px; }
.owner-ui .work-focus h2 { font-size:27px; max-width:390px; margin:0 0 14px; letter-spacing:-.035em; }
.work-focus p { color:#c1d0dc; overflow-wrap:anywhere; }
.work-focus .actions { margin-top:23px; }
.workspace-register { padding:24px; }
.register-empty { border-top:1px solid var(--line); padding:24px 0 8px; }
.register-empty > span { font-size:14px; }
.owner-ui .register-empty p { font-size:12px; color:var(--muted); margin:8px 0 0; }
.owner-ui .work-register-row { display:flex; align-items:center; gap:12px; width:100%; background:#ffffff05; color:#e8f0f6; padding:16px 12px; border:1px solid var(--line); }
.work-register-row strong,.work-register-row small { display:block; text-align:left; }
.work-register-row strong { font-size:13px; overflow-wrap:anywhere; }
.work-register-row small { font-size:11px; font-weight:400; color:var(--muted); margin-top:4px; }
.work-register-row .status-pill { margin-left:auto; }
@supports not (backdrop-filter:blur(1px)) { .crm-panel,.stat-bubble,.work-focus,.workspace-register { background:#263a4c; } }
@media (max-width:1250px) { .owner-ui .workspace-content { grid-template-columns:minmax(0,1fr); } .owner-ui .trace { grid-template-columns:1fr 1fr; } .overview-heading { align-items:center; } }
@media (max-width:850px) { .owner-ui .workspace { display:block; } .owner-ui .sidebar { display:none; } .owner-ui .mobile-nav { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:0 0 20px; background:transparent; font-size:12px; } .owner-ui .mobile-nav select { width:auto; min-width:150px; border:1px solid var(--line); background:#213344; color:#edf3f8; border-radius:12px; padding:12px; } }
@media (max-width:600px) {
.owner-ui .brand-rail { padding:10px 18px; gap:8px; } .owner-ui .brand-rail .eyebrow { display:none; }

.crm-stage { padding:0 16px; } .crm-toolbar { min-height:86px; gap:12px; } .crm-toolbar strong { font-size:15px; } .owner-role { font-size:0; } .owner-avatar { font-size:14px; }
.crm-pipeline { grid-template-columns:1fr 1fr; margin-bottom:20px; gap:4px; padding:5px; } .owner-ui .pipeline-step { padding:8px; gap:8px; } .pipeline-step small { font-size:10px; }
.owner-ui .workspace-content { padding-bottom:20px; } .content-panel { padding:22px 18px; border-radius:22px; } .owner-ui h2.demo-view-title { font-size:28px; } .owner-ui .trace { grid-template-columns:1fr; }
.overview-heading { display:block; } .environment-label { display:inline-block; margin-top:14px; } .overview-stats { gap:8px; } .owner-ui .stat-bubble { padding:14px 10px; border-radius:18px; } .stat-bubble > strong { font-size:34px; } .stat-bubble > span { font-size:12px; } .stat-bubble > small { font-size:10px; }
.work-focus { padding:22px 18px; display:block; } .focus-orbit { margin-bottom:18px; } .owner-ui .work-focus h2 { font-size:26px; } .workspace-register { padding:20px 18px; } .work-register-row { flex-wrap:wrap; } .work-register-row .status-pill { margin-left:0; }
.owner-ui .quote-document { padding:18px; } .owner-ui .record-fields dd { font-size:15px; } .owner-ui .quote-document h2 { font-size:20px; } .owner-ui .packet { width:130px; padding:14px; } .owner-ui .dock { padding:16px; } .owner-ui .packet-lane { gap:10px; }
.owner-ui .conversation p { font-size:16px; } .owner-ui .conversation li:nth-child(even) { margin-left:10px; } .owner-ui .next-step { padding:14px; }
}
.owner-ui .packet .eyebrow { color:#233745; }
.owner-ui .privacy-banner button,.owner-ui .session button { min-height:44px; }
/* Compact shared notice and marketing-aligned demo entrance. */
.privacy-banner { display:grid; grid-template-columns:minmax(0,1fr) auto auto; align-items:center; gap:12px 24px; padding:14px max(28px,4.5vw); background:#e6ecee; color:#233745; border-bottom:1px solid #c9d3d8; }
.privacy-short strong { display:block; font-size:14px; margin-bottom:3px; }
.privacy-short span { display:block; font-size:12px; line-height:1.5; }
.privacy-banner details { margin:0; font-size:12px; }
.privacy-banner summary { padding:12px 0; min-height:44px; }
.privacy-banner button { margin:0; min-height:44px; padding:10px 14px; background:transparent; color:#233745; border:1px solid #8296a1; border-radius:3px; font-size:12px; white-space:nowrap; }
.privacy-banner:has(details[open]) { align-items:start; }
.privacy-banner details[open] { grid-column:1/-1; grid-row:2; }
.privacy-banner:has(details[open]) > button { grid-column:3; grid-row:1; }
.privacy-expanded { max-width:95ch; padding-bottom:8px; }
.privacy-banner .privacy-expanded p { font-size:13px; margin:8px 0; }
.owner-ui .privacy-banner { background:#192735; color:#d4dfe8; border-color:var(--line); padding:12px 28px; }
.owner-ui .privacy-short strong { color:#f1d5b9; }
.owner-ui .privacy-banner button { background:transparent; color:#e8d0bb; border-color:#796b60; border-radius:10px; font-size:12px; }
.entry { background:#233745; padding:48px max(28px,4.5vw) 44px; min-height:0; }
.entry h2.demo-view-title { font-size:clamp(36px,3.65vw,58px); font-weight:650; letter-spacing:-.035em; line-height:1.1; margin:20px 0 24px; max-width:20ch; }
.entry > p:not(.eyebrow) { font-size:20px; max-width:54ch; line-height:1.5; }
.entry .eyebrow { font-size:11px; letter-spacing:.14em; color:#aec6d4; }
.entry .actions { margin:30px 0 16px; gap:14px; }
.entry button:not(.link) { min-width:0; min-height:56px; padding:14px 24px; font-size:16px; font-weight:650; border:1px solid #d8b898; border-radius:3px; }
.entry button.secondary { background:transparent; color:#f2f4f3; border-color:#aec6d4; }
.entry .link { font-size:16px; text-decoration:underline; }
.entry .entry-foot { margin:32px 0 0; padding-top:22px; border-top:1px solid #aec6d440; font-size:10px; line-height:1.8; }
body:not(.owner-ui) .brand-rail { background:#233745; }
@media(max-width:800px) {
.privacy-banner,.owner-ui .privacy-banner { grid-template-columns:minmax(0,1fr) auto; gap:4px 16px; padding:12px 22px; }
.privacy-short { grid-column:1/-1; }
.privacy-banner > button { grid-column:2; grid-row:2; }
.privacy-banner:has(details[open]) > button { grid-column:2; grid-row:2; }
.privacy-banner details[open] { grid-row:3; }
.entry { padding:32px 22px; min-height:0; }
.entry h2.demo-view-title { font-size:36px; margin:18px 0 20px; }
.entry > p:not(.eyebrow) { font-size:18px; }
.entry .actions { margin:26px 0 12px; }
.entry .actions button:nth-child(2) { padding:14px 24px; font-size:16px; background:transparent; color:#f2f4f3; }
.entry .entry-foot { margin-top:24px; }
}
body:has(.entry) { background:#233745; min-height:100svh; }
.entry .privacy-banner { margin-top:24px; padding:16px 20px; border:1px solid #aec6d440; background:#1a2c38; color:#f2f4f3; }
.entry .privacy-banner button { min-height:44px; padding:10px 14px; font-size:12px; background:transparent; color:#f2f4f3; border-color:#aec6d4; }
.entry .privacy-banner p { color:#aec6d4; }
@media(max-width:800px) { .entry .privacy-banner { padding:14px; } }
/* Decorative desktop flow occupies the existing space beside the introduction. */
.entry-workflow { position:absolute; top:56px; right:4.5vw; width:37%; max-width:480px; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:32px 24px; pointer-events:none; }
.entry-workflow span { position:relative; display:grid; place-items:center; min-height:58px; padding:10px; border:1px solid #aec6d465; border-radius:5px; background:#1a2c3866; color:#dce6ec; font-size:13px; text-align:center; }
.entry-workflow span:not(:nth-child(3n))::after { content:""; position:absolute; left:100%; top:50%; width:24px; border-top:1px solid #aec6d485; }
.entry-workflow span:nth-child(3)::after { content:""; position:absolute; top:100%; right:50%; height:32px; border-left:1px solid #aec6d485; }
.entry-workflow span:nth-child(4) { grid-column:3; grid-row:2; }
.entry-workflow span:nth-child(5) { grid-column:2; grid-row:2; }
.entry-workflow span:nth-child(6) { grid-column:1; grid-row:2; border-color:#d8b898; color:#edd6bf; }
.entry-workflow span:nth-child(4)::after,.entry-workflow span:nth-child(5)::after { left:auto; right:100%; }
@media(max-width:1150px) { .entry-workflow { display:none; } }
