/* Homepage only. Use the portal palette and keep the demo independent of account data. */
.home-v3{--home-corner:14px;--home-pad:clamp(12px,1.5vw,22px);--home-demo-height:256px}
.home-v3 .home-v3-main>.shell{width:min(1360px,calc(100% - clamp(32px,6vw,96px)))}
.home-hero{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);align-items:center;gap:clamp(26px,4vw,70px);padding-block:clamp(46px,6vw,98px);min-width:0}
.home-hero-copy,.home-console,.home-demo-content,.home-demo-panel{min-width:0}
.home-hero-copy .eyebrow{margin-bottom:20px}
.home-hero h1{font-size:clamp(37px,5.6vw,88px);line-height:1.04;letter-spacing:-.051em;font-weight:700;text-wrap:balance}
.home-hero .home-lead{font-size:clamp(16px,1.25vw,19px);line-height:1.66;max-width:560px;margin-top:22px}
.home-hero .actions{margin-top:26px}
.home-platform-notes{display:flex;gap:8px 14px;align-items:center;flex-wrap:wrap;list-style:none;padding:0;margin-top:20px;color:var(--muted);font-size:13px}
.home-platform-notes li+li::before{content:"";display:inline-block;width:4px;height:4px;margin:0 12px 2px 0;border-radius:50%;background:var(--accent)}
.home-console{container:home-console/inline-size;isolation:isolate;border:1px solid var(--line);border-radius:var(--home-corner);background:linear-gradient(150deg,color-mix(in srgb,var(--accent) 5%,var(--surface)),var(--surface) 54%);box-shadow:0 20px 46px #0003;scroll-margin-block:18px}
.home-console-head{display:flex;justify-content:space-between;align-items:center;gap:8px 12px;flex-wrap:wrap;padding:14px var(--home-pad);border-bottom:1px solid var(--line);min-height:55px}
.home-console-brand{display:flex;align-items:center;gap:9px;font-size:14px;font-weight:600;color:var(--ink)}
.home-console-mark{display:block;width:23px;height:23px;background:var(--accent);mask:url('/assets/oko-logo.svg') center/contain no-repeat;flex:none}
.home-demo-tag{border:1px solid var(--line);border-radius:7px;padding:3px 8px;color:var(--muted);font-size:12px;line-height:1.5}
.home-module-tabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:6px;padding:10px var(--home-pad);border-bottom:1px solid var(--line-soft)}
.home-module-tab{min-width:0;min-height:44px;display:flex;align-items:center;justify-content:center;gap:7px;border:1px solid transparent;border-radius:8px;padding:7px 5px;color:var(--muted);font-size:13px;font-weight:500;line-height:1.35;text-align:center;transition:color 120ms ease,background-color 120ms ease,border-color 120ms ease}
.home-module-tab span{min-width:0;overflow-wrap:anywhere}
.home-module-tab .icon{width:17px;height:17px}
.home-module-tab[aria-selected=true]{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 27%,var(--line));background:color-mix(in srgb,var(--accent) 9%,var(--bg))}
.home-module-tab:focus-visible{outline-offset:2px;transition:none}
.home-demo-content{padding:var(--home-pad)}
.home-demo-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:10px}
.home-demo-panel-heading h3{font-size:18px;letter-spacing:-.018em;overflow-wrap:anywhere}
.home-demo-panel-heading>span,.home-card-marker small,.home-steps>li>span{color:var(--accent);font-size:12px;font-variant-numeric:tabular-nums;white-space:nowrap}
.home-demo-panel>p{margin-top:11px;font-size:14px;line-height:1.5;min-height:42px}
.home-demo-surface{min-width:0;min-height:var(--home-demo-height);border:1px solid var(--line-soft);border-radius:10px;background:var(--bg);overflow:hidden}
.home-demo-label{display:block;color:var(--ink);font-size:12px;font-weight:600;line-height:1.4}
.home-radio-demo{display:grid;grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);grid-template-rows:minmax(100px,1fr) 93px;gap:8px;padding:9px}
.home-radio-video,.home-radio-signals,.home-radio-spectrum{border:1px solid var(--line-soft);border-radius:8px;padding:9px;background:var(--surface);min-width:0}
.home-radio-video{display:grid;grid-template-rows:auto 1fr}
.home-video-grid{display:grid;place-items:center;min-width:0;background:linear-gradient(var(--line-soft) 1px,transparent 1px),linear-gradient(90deg,var(--line-soft) 1px,transparent 1px),var(--bg);background-size:28px 28px;border-radius:6px}
.home-radio-video .home-video-grid{margin-top:7px;min-height:64px}
.home-video-grid svg{width:min(92%,260px);height:100%;max-height:90px;stroke:color-mix(in srgb,var(--accent) 54%,var(--line));stroke-width:1.3}
.home-radio-signals{display:grid;align-content:start;gap:8px}
.home-radio-signals>span:not(.home-demo-label){display:flex;align-items:center;gap:6px;font-size:12px;line-height:1.35;color:var(--muted);overflow-wrap:anywhere}
.home-radio-signals i{width:6px;height:6px;border:1px solid var(--accent);border-radius:50%;flex:none}
.home-radio-spectrum{grid-column:1/-1;display:grid;grid-template-rows:auto 1fr;gap:6px}
.home-plot{width:100%;height:100%;min-height:0;overflow:hidden}
.home-plot-grid{stroke:var(--line);stroke-width:1;fill:none}
.home-plot-trace{stroke:var(--accent);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;fill:none;vector-effect:non-scaling-stroke}
.home-map-demo{display:grid;grid-template-rows:minmax(174px,1fr) auto;background:var(--surface)}
.home-map-viewport{position:relative;min-height:174px;background:linear-gradient(var(--line-soft) 1px,transparent 1px),linear-gradient(90deg,var(--line-soft) 1px,transparent 1px),var(--bg);background-size:28px 28px}
.home-map-art{position:absolute;inset:0;width:100%;height:100%}
.home-map-terrain{stroke:color-mix(in srgb,var(--accent) 21%,var(--line));stroke-width:1.4;fill:none}
.home-map-route{stroke:var(--accent);stroke-width:3;stroke-linejoin:round;fill:none}
.home-map-art [data-home-map-shape=route] circle{stroke:var(--accent);stroke-width:2;fill:var(--surface)}
.home-map-objects rect{fill:var(--surface-raised);stroke:var(--muted);stroke-width:1.5}
.home-map-controls{display:flex;gap:7px;flex-wrap:wrap;padding:6px 9px;border-top:1px solid var(--line-soft)}
.home-map-controls button{min-height:44px;padding:5px 10px;border:1px solid var(--line);border-radius:7px;color:var(--muted);font-size:13px;background:var(--bg);transition:color 120ms ease,border-color 120ms ease,background-color 120ms ease}
.home-map-controls button[aria-pressed=true]{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 36%,var(--line));background:var(--accent-soft)}
.home-map-controls button:focus-visible{outline-offset:2px;transition:none}
.home-chat-demo{display:grid;grid-template-columns:minmax(96px,1fr) minmax(0,2fr);gap:0;background:var(--surface)}
.home-chat-list{display:flex;flex-direction:column;gap:7px;padding:12px 8px;border-right:1px solid var(--line-soft);font-size:12px;color:var(--muted)}
.home-chat-list strong{color:var(--ink);padding-inline:7px}
.home-chat-list>span{padding:5px 7px;overflow-wrap:anywhere}
.home-chat-selected{color:var(--accent);background:var(--accent-soft);border-radius:6px}
.home-chat-thread{display:flex;flex-direction:column;min-width:0;align-items:flex-start;gap:9px;padding:12px 10px;background:var(--bg)}
.home-chat-heading{width:100%;font-size:13px;padding-bottom:8px;border-bottom:1px solid var(--line-soft)}
.home-chat-bubble{max-width:95%;font-size:12px;line-height:1.45;padding:6px 9px;border:1px solid var(--line);border-radius:8px;background:var(--surface-raised);overflow-wrap:anywhere}
.home-chat-own{align-self:flex-end;background:var(--accent-soft);border-color:color-mix(in srgb,var(--accent) 19%,var(--line))}
.home-chat-input{width:100%;margin-top:auto;padding:5px 8px;border:1px solid var(--line);border-radius:6px;color:var(--muted);font-size:12px;background:var(--surface)}
.home-stream-demo{display:grid;grid-template-rows:1fr auto;background:var(--surface)}
.home-stream-picture{position:relative;min-height:170px;padding:11px;display:grid;grid-template-rows:1fr auto;gap:7px}
.home-stream-picture .home-video-grid{min-height:120px}
.home-stream-footer{display:flex;align-items:center;gap:7px 10px;flex-wrap:wrap;padding:8px 12px;border-top:1px solid var(--line-soft);font-size:13px;color:var(--ink);background:var(--surface-raised)}
.home-stream-footer .icon{width:17px;height:17px;color:var(--accent)}
.home-stream-footer small{margin-left:auto;color:var(--muted);font-size:12px}
.home-detail,.home-account{border-top:1px solid var(--line);padding-block:clamp(42px,5.2vw,82px)}
.home-section-intro{max-width:730px;margin-bottom:24px}
.home-section-intro .eyebrow,.home-account-copy .eyebrow,.home-cta .eyebrow{margin-bottom:12px}
.home-section-intro h2,.home-account-copy h2{font-size:clamp(32px,3.7vw,54px);line-height:1.13}
.home-section-intro p:not(.eyebrow),.home-account-copy p:not(.eyebrow){font-size:16px;line-height:1.68;margin-top:14px;max-width:610px}
.home-module-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.home-module-card{display:flex;flex-direction:column;min-width:0;border:1px solid var(--line);border-radius:var(--home-corner);padding:clamp(14px,1.6vw,23px);background:var(--surface)}
.home-card-marker{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-bottom:13px}
.home-card-marker>span{display:grid;place-items:center;width:39px;height:39px;border-radius:9px;background:var(--accent-soft);color:var(--accent)}
.home-card-marker .icon{width:20px;height:20px}
.home-module-card h3{font-size:clamp(16px,1.5vw,21px);line-height:1.35;overflow-wrap:anywhere}
.home-module-card p{font-size:14px;line-height:1.57;margin:8px 0 14px}
.home-module-card ul{display:flex;flex-wrap:wrap;gap:5px;list-style:none;padding:0;margin-top:auto}
.home-module-card li{padding:2px 7px;border:1px solid var(--line);border-radius:6px;color:var(--muted);font-size:12px;line-height:1.5;background:var(--bg)}
.home-section-action{margin-top:18px}
.home-account{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(26px,5vw,82px);align-items:start}
.home-account .actions{margin-top:18px}
.home-steps{list-style:none;padding:0;border:1px solid var(--line);border-radius:var(--home-corner);background:var(--surface)}
.home-steps li{display:grid;grid-template-columns:34px minmax(0,1fr);gap:12px;padding:clamp(14px,2vw,23px)}
.home-steps li+li{border-top:1px solid var(--line-soft)}
.home-steps>li>span{display:grid;place-items:center;align-self:start;height:34px;border-radius:7px;background:var(--accent-soft)}
.home-steps h3{font-size:17px;line-height:1.42;letter-spacing:-.015em}
.home-steps p{margin-top:4px;font-size:14px;line-height:1.54}
.home-cta{display:flex;justify-content:space-between;align-items:center;gap:18px;flex-wrap:wrap;border:1px solid color-mix(in srgb,var(--accent) 23%,var(--line));border-radius:var(--home-corner);background:linear-gradient(110deg,color-mix(in srgb,var(--accent) 7%,var(--surface)),var(--surface) 57%);padding:clamp(18px,3vw,38px);margin-bottom:clamp(40px,6vw,78px)}
.home-cta h2{font-size:clamp(29px,3.3vw,48px);line-height:1.15}
@container home-console (max-width:620px){.home-module-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:950px){.home-hero{grid-template-columns:minmax(0,1fr);gap:29px}.home-hero h1{font-size:clamp(39px,7vw,68px)}.home-module-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.home-account{grid-template-columns:minmax(0,1fr)}}
@media(max-width:520px){.home-module-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.home-hero{padding-block:32px 37px}.home-hero-copy .eyebrow{margin-bottom:13px}.home-hero .home-lead{margin-top:15px}.home-hero .actions{margin-top:18px}.home-module-grid{grid-template-columns:minmax(0,1fr)}.home-demo-panel>p{min-height:62px}.home-cta>.button{width:100%}}
@media(max-width:380px){.home-v3{--home-demo-height:268px}.home-radio-demo{grid-template-columns:minmax(0,1fr);grid-template-rows:92px auto 81px}.home-radio-signals{display:flex;flex-wrap:wrap;gap:6px 9px}.home-radio-signals .home-demo-label{width:100%}.home-radio-spectrum{padding:7px}.home-console-head{padding-block:11px}.home-module-tab{font-size:12px;gap:5px}.home-module-tab .icon{width:15px;height:15px}.home-chat-demo{grid-template-columns:minmax(0,1fr)}.home-chat-list{flex-direction:row;align-items:center;flex-wrap:wrap;border-right:0;border-bottom:1px solid var(--line-soft);padding:6px}.home-chat-list>span:last-child{display:none}.home-chat-thread{min-height:170px}}
@media(max-width:345px){.home-module-tab{flex-direction:column;gap:2px;min-height:48px;padding-inline:3px}}
@media(hover:hover) and (pointer:fine){.home-module-tab:hover,.home-map-controls button:hover{background:var(--surface-raised);border-color:var(--line);color:var(--ink)}.home-module-tab[aria-selected=true]:hover{color:var(--accent);background:var(--accent-soft)}}
@media(prefers-reduced-motion:reduce){.home-v3 .home-module-tab,.home-v3 .home-map-controls button{transition:none}}
/* The anchors also switch examples when scripts are unavailable. */
.home-console:not([data-home-ready]) .home-demo-panel:not(:first-child):not(:target){display:none}
.home-console:not([data-home-ready]):has(.home-demo-panel:target) .home-demo-panel:first-child:not(:target){display:none}
.home-console:not([data-home-ready]) .home-map-controls{display:none}
.home-console:not([data-home-ready]):not(:has(.home-demo-panel:target)) .home-module-tab:first-child,
.home-console:not([data-home-ready]):has(#home-demo-radio:target) [data-home-tab=radio],
.home-console:not([data-home-ready]):has(#home-demo-map:target) [data-home-tab=map],
.home-console:not([data-home-ready]):has(#home-demo-messenger:target) [data-home-tab=messenger],
.home-console:not([data-home-ready]):has(#home-demo-broadcast:target) [data-home-tab=broadcast]{color:var(--accent);border-color:color-mix(in srgb,var(--accent) 27%,var(--line));background:var(--accent-soft)}