/* OMNI-176 v2 public Home. Scoped to #mobile.home-v2 so the protected administrator stylesheets stay untouched. */
#mobile.home-v2{
 --dot:color-mix(in srgb,var(--ink) 11%,transparent);
 --p-fill:var(--p);
 --p:#62A8FF;--s:#A996F2;--h:#2E3F57;
 --bg:#131517;--surface:#202326;--inset:#292C30;--selection:#3C424A;--muted:#ADB1B8;--ink:#F0F1F3;--on-p:#0b0c0e;
 --line:color-mix(in srgb,var(--ink) 11%,transparent);--shadow:0 24px 60px -30px #00000099;
 --ease:cubic-bezier(.2,.7,.2,1);--spring:cubic-bezier(.34,1.3,.5,1);--t:.22s;--header:72px;
 background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,sans-serif;font-size:17px;line-height:1.6;
 padding:0;margin:0;width:100%;max-width:none;overflow:clip;position:relative;-webkit-font-smoothing:antialiased;
 transition:background-color .4s var(--ease),color .4s var(--ease)}
/* OMNI-324: the page canvas follows the Home mode so overscroll, scrollbars and form controls match; html:has() keeps the admin workspace (where #mobile is hidden) untouched. */
html:has(#mobile.home-v2[data-home-mode=light]:not([hidden])){color-scheme:light}html:has(#mobile.home-v2[data-home-mode=light]:not([hidden])) body{background:#F4F1EB}@media (prefers-color-scheme: light){html:has(#mobile.home-v2:not([data-home-mode=dark]):not([hidden])){color-scheme:light}html:has(#mobile.home-v2:not([data-home-mode=dark]):not([hidden])) body{background:#F4F1EB}}
#mobile.home-v2[data-home-mode=light]{--bg:#F4F1EB;--surface:#FBF8F3;--inset:#EBE7E0;--selection:#E1DBD2;--muted:#6B685F;--ink:#37352F;--on-p:#fff;--p:#2A7DE1;--s:#7C5CD6;--h:#D9E6F7;--shadow:0 24px 60px -34px #37352F66;--p-fill:color-mix(in srgb,var(--p) 88%,black)}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]){--bg:#F4F1EB;--surface:#FBF8F3;--inset:#EBE7E0;--selection:#E1DBD2;--muted:#6B685F;--ink:#37352F;--on-p:#fff;--p:#2A7DE1;--s:#7C5CD6;--h:#D9E6F7;--shadow:0 24px 60px -34px #37352F66;--p-fill:color-mix(in srgb,var(--p) 88%,black)}}
#mobile.home-v2[data-home-colourway=muted]{--p:#A9B8C8;--s:#C4C8CE;--h:#464C54;--bg:#292D32;--surface:#363B42;--inset:#41474F;--selection:#515A64}
#mobile.home-v2[data-home-colourway=muted][data-home-mode=light]{--p:#56677A;--s:#8A8F96;--h:#E2E5E9;--bg:#F6F6F4;--surface:#FFFFFF;--inset:#EDEDEA;--selection:#E2E2DE;--muted:#666662;--ink:#2A2A28}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=muted]:not([data-home-mode=dark]){--p:#56677A;--s:#8A8F96;--h:#E2E5E9;--bg:#F6F6F4;--surface:#FFFFFF;--inset:#EDEDEA;--selection:#E2E2DE;--muted:#666662;--ink:#2A2A28}}
#mobile.home-v2[data-home-colourway=bold]{--p:#0A84FF;--s:#7D7AFF;--h:#2C2C2E;--bg:#000000;--surface:#101214;--inset:#191C20;--selection:#31363D;--on-p:#fff}
#mobile.home-v2[data-home-colourway=bold][data-home-mode=light]{--p:#0A84FF;--s:#5E5CE6;--h:#E5E5EA;--bg:#FFFFFF;--surface:#FFFFFF;--inset:#F2F2F2;--selection:#E5E5E5;--muted:#6E6E73;--ink:#000000}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=bold]:not([data-home-mode=dark]){--p:#0A84FF;--s:#5E5CE6;--h:#E5E5EA;--bg:#FFFFFF;--surface:#FFFFFF;--inset:#F2F2F2;--selection:#E5E5E5;--muted:#6E6E73;--ink:#000000}}
/* Crags tint their surfaces with the primary colour, as the app does. */
#mobile.home-v2[data-home-colourway=mitake]{--p:#F58AB6;--s:#85C9B6;--h:#9C2F5C}
#mobile.home-v2[data-home-colourway=mitake][data-home-mode=light]{--p:#D6457F;--s:#3F7E6E;--h:#F9D3E3}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=mitake]:not([data-home-mode=dark]){--p:#D6457F;--s:#3F7E6E;--h:#F9D3E3}}
#mobile.home-v2[data-home-colourway=bishop]{--p:#D4A47A;--s:#DCE6EE;--h:#4E3A28}
#mobile.home-v2[data-home-colourway=bishop][data-home-mode=light]{--p:#8A5E3B;--s:#7F98AC;--h:#F4F2EF}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=bishop]:not([data-home-mode=dark]){--p:#8A5E3B;--s:#7F98AC;--h:#F4F2EF}}
#mobile.home-v2[data-home-colourway=fontainebleau]{--p:#7FC48C;--s:#D9BE8E;--h:#A8925E}
#mobile.home-v2[data-home-colourway=fontainebleau][data-home-mode=light]{--p:#2F6B3A;--s:#9A7B4F;--h:#E3D3A6}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=fontainebleau]:not([data-home-mode=dark]){--p:#2F6B3A;--s:#9A7B4F;--h:#E3D3A6}}
#mobile.home-v2[data-home-colourway=hueco]{--p:#E57A5E;--s:#84BDE3;--h:#A9674A}
#mobile.home-v2[data-home-colourway=hueco][data-home-mode=light]{--p:#9C3D2A;--s:#3E7CA6;--h:#EBC7A8}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=hueco]:not([data-home-mode=dark]){--p:#9C3D2A;--s:#3E7CA6;--h:#EBC7A8}}
#mobile.home-v2[data-home-colourway=squamish]{--p:#4CC7D4;--s:#8CC487;--h:#1F5D63}
#mobile.home-v2[data-home-colourway=squamish][data-home-mode=light]{--p:#0E6E7A;--s:#3D6B3A;--h:#CFE0DC}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=squamish]:not([data-home-mode=dark]){--p:#0E6E7A;--s:#3D6B3A;--h:#CFE0DC}}
#mobile.home-v2[data-home-colourway=yosemite]{--p:#6FB8DB;--s:#9BCB86;--h:#5E6D75}
#mobile.home-v2[data-home-colourway=yosemite][data-home-mode=light]{--p:#2C6E8F;--s:#4E7A3C;--h:#D5DEE3}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=yosemite]:not([data-home-mode=dark]){--p:#2C6E8F;--s:#4E7A3C;--h:#D5DEE3}}
#mobile.home-v2[data-home-colourway=mitake],#mobile.home-v2[data-home-colourway=bishop],#mobile.home-v2[data-home-colourway=fontainebleau],#mobile.home-v2[data-home-colourway=hueco],#mobile.home-v2[data-home-colourway=squamish],#mobile.home-v2[data-home-colourway=yosemite]{
 --bg:color-mix(in srgb,var(--p) 8%,#121316);--surface:color-mix(in srgb,var(--p) 12%,#1c1e22);--inset:color-mix(in srgb,var(--p) 17%,#24272c);--selection:color-mix(in srgb,var(--p) 26%,#2c3036)}
#mobile.home-v2[data-home-colourway=mitake][data-home-mode=light],#mobile.home-v2[data-home-colourway=bishop][data-home-mode=light],#mobile.home-v2[data-home-colourway=fontainebleau][data-home-mode=light],#mobile.home-v2[data-home-colourway=hueco][data-home-mode=light],#mobile.home-v2[data-home-colourway=squamish][data-home-mode=light],#mobile.home-v2[data-home-colourway=yosemite][data-home-mode=light]{
 --bg:color-mix(in srgb,var(--p) 6%,#f6f4f0);--surface:color-mix(in srgb,var(--p) 4%,#fffdf9);--inset:color-mix(in srgb,var(--p) 10%,#efece6);--selection:color-mix(in srgb,var(--p) 18%,#e6e2db)}@media (prefers-color-scheme: light){#mobile.home-v2[data-home-colourway=mitake]:not([data-home-mode=dark]),#mobile.home-v2[data-home-colourway=bishop]:not([data-home-mode=dark]),#mobile.home-v2[data-home-colourway=fontainebleau]:not([data-home-mode=dark]),#mobile.home-v2[data-home-colourway=hueco]:not([data-home-mode=dark]),#mobile.home-v2[data-home-colourway=squamish]:not([data-home-mode=dark]),#mobile.home-v2[data-home-colourway=yosemite]:not([data-home-mode=dark]){
 --bg:color-mix(in srgb,var(--p) 6%,#f6f4f0);--surface:color-mix(in srgb,var(--p) 4%,#fffdf9);--inset:color-mix(in srgb,var(--p) 10%,#efece6);--selection:color-mix(in srgb,var(--p) 18%,#e6e2db)}}

/* Reset against the protected admin cascade. */
#mobile.home-v2 *,#mobile.home-v2 *::before,#mobile.home-v2 *::after{box-sizing:border-box}
#mobile.home-v2 a{color:inherit}#mobile.home-v2 button,#mobile.home-v2 summary{font:inherit;color:inherit}
#mobile.home-v2 h1,#mobile.home-v2 h2,#mobile.home-v2 h3,#mobile.home-v2 p,#mobile.home-v2 ul,#mobile.home-v2 ol{margin:0;padding:0;max-width:none;font-size:inherit;line-height:inherit;color:inherit;text-align:left}
#mobile.home-v2 [hidden]{display:none!important}
#mobile.home-v2 a,#mobile.home-v2 button,#mobile.home-v2 summary{min-height:44px}
#mobile.home-v2 a:focus-visible,#mobile.home-v2 button:focus-visible,#mobile.home-v2 summary:focus-visible{outline:3px solid var(--p);outline-offset:3px;border-radius:12px}
#mobile.home-v2 section[id]{scroll-margin-top:calc(var(--header) + 16px)}
.hv-container{width:min(1200px,calc(100% - 48px));margin-inline:auto}
.hv-skip{position:absolute;left:16px;top:-60px;z-index:20;padding:10px 16px;border-radius:12px;background:var(--p);color:var(--on-p);text-decoration:none;font-weight:600}
.hv-skip:focus{top:16px}
.hv-sky{position:absolute;inset:0;pointer-events:none;z-index:0;overflow:hidden}
.hv-sky>span{position:absolute;inset:0;background-image:radial-gradient(circle,var(--dot) 1.1px,transparent 1.7px);background-size:28px 28px;background-position:14px 14px;opacity:.6}
.hv-sky>i{position:absolute;width:min(1100px,120vw);height:700px;top:-220px;left:50%;transform:translateX(-50%);border-radius:50%;background:radial-gradient(ellipse at 50% 50%,color-mix(in srgb,var(--p) 28%,transparent),transparent 62%);transition:background .5s var(--ease)}

#mobile.home-v2>*{position:relative;z-index:1}

/* Header */
#mobile.home-v2 .hv-header{position:sticky;top:0;z-index:30;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:16px;min-height:72px;padding:10px 0;margin:0;border-bottom:1px solid transparent;background:color-mix(in srgb,var(--bg) 72%,transparent);backdrop-filter:blur(18px) saturate(1.4);-webkit-backdrop-filter:blur(18px) saturate(1.4);transition:border-color var(--t),background .4s var(--ease)}
#mobile.home-v2 .hv-header[data-scrolled=true]{border-bottom-color:var(--line)}
#mobile.home-v2 .hv-header>.hv-container{display:contents}
#mobile.home-v2 .guest-brand{display:inline-flex;align-items:center;gap:10px;font-size:22px;font-weight:700;letter-spacing:-.03em;text-decoration:none;white-space:nowrap}
#mobile.home-v2 .omni-mark{width:34px;height:34px;object-fit:contain;transition:transform .4s var(--spring)}
#mobile.home-v2 .guest-brand:hover .omni-mark{transform:rotate(18deg)}
#mobile.home-v2 .guest-nav{position:relative;display:flex;flex-wrap:nowrap;white-space:nowrap;gap:2px;justify-self:center;padding:4px;border-radius:999px;background:var(--inset);isolation:isolate}
#mobile.home-v2 .guest-nav>a{position:relative;z-index:1;flex:0 0 auto;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border-radius:999px;font-size:14px;font-weight:600;color:var(--muted);text-decoration:none;transition:color var(--t)}
#mobile.home-v2 .guest-nav>a:hover,#mobile.home-v2 .guest-nav>a[aria-current=true]{color:var(--ink)}
#mobile.home-v2 .guest-nav>a[aria-current=true]{color:var(--on-p)}
#mobile.home-v2 .hv-pill{position:absolute;z-index:0;top:4px;bottom:4px;left:0;width:0;border-radius:999px;background:var(--p-fill);opacity:0;transform:translateX(var(--pill-x,0));width:var(--pill-w,0);transition:transform var(--t) var(--spring),width var(--t) var(--spring),opacity var(--t),background .4s var(--ease)}
#mobile.home-v2 .hv-pill[data-on=true]{opacity:1}
#mobile.home-v2 .guest-primary-nav{justify-self:end}
#mobile.home-v2 .guest-climb-link,#mobile.home-v2 .hv-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:12px 20px;border-radius:14px;font-size:15px;font-weight:600;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:transform var(--t) var(--spring),background var(--t),color var(--t),border-color var(--t),box-shadow var(--t)}
#mobile.home-v2 .guest-climb-link,#mobile.home-v2 .hv-button.primary{background:var(--p-fill);color:var(--on-p);box-shadow:0 10px 30px -14px color-mix(in srgb,var(--p) 70%,transparent)}
#mobile.home-v2 .hv-button.secondary{background:var(--inset);color:var(--ink);border-color:var(--line)}
#mobile.home-v2 .hv-button.ghost{background:transparent;color:var(--ink);border-color:var(--line)}
#mobile.home-v2 .guest-climb-link:hover,#mobile.home-v2 .hv-button:hover{transform:translateY(-1px)}
#mobile.home-v2 .guest-climb-link:active,#mobile.home-v2 .hv-button:active{transform:scale(.97)}
#mobile.home-v2 .hv-button.secondary:hover,#mobile.home-v2 .hv-button.ghost:hover{background:var(--selection)}
#mobile.home-v2 .guest-climb-link{min-height:44px;padding:10px 16px;font-size:14px}
#mobile.home-v2 .hv-button,#mobile.home-v2 .guest-climb-link{width:auto;flex:0 0 auto}

/* Type */
#mobile.home-v2 .hv-kicker{display:inline-flex;align-items:center;gap:10px;font-size:13px;font-weight:600;letter-spacing:.02em;color:var(--muted);margin:0 0 16px}
#mobile.home-v2 .hv-kicker .hv-dot{width:8px;height:8px;border-radius:50%;background:var(--p);box-shadow:0 0 0 0 color-mix(in srgb,var(--p) 50%,transparent);animation:hv-pulse 2.4s ease-out infinite}
@keyframes hv-pulse{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--p) 55%,transparent)}70%{box-shadow:0 0 0 10px transparent}100%{box-shadow:0 0 0 0 transparent}}
#mobile.home-v2 h1{font-size:clamp(46px,7vw,96px);line-height:1.02;font-weight:750;letter-spacing:-.045em;margin:0 0 24px;text-wrap:balance}
#mobile.home-v2 h1 em,#mobile.home-v2 h2 em{font-style:normal;color:var(--p);transition:color .4s var(--ease)}
#mobile.home-v2 h2{font-size:clamp(30px,4.2vw,54px);line-height:1.08;font-weight:700;letter-spacing:-.035em;margin:0 0 16px;text-wrap:balance}
#mobile.home-v2 h3{font-size:20px;line-height:1.3;font-weight:650;letter-spacing:-.015em}
#mobile.home-v2 .hv-lead{font-size:clamp(17px,1.5vw,21px);line-height:1.6;color:var(--muted);max-width:40ch}
#mobile.home-v2 .hv-heading{max-width:720px;margin-bottom:40px}
#mobile.home-v2 .hv-heading>p:last-child{font-size:18px;line-height:1.6;color:var(--muted)}
#mobile.home-v2 .hv-section{padding-block:clamp(64px,9vw,120px)}
#mobile.home-v2 .hv-section+.hv-section{border-top:1px solid var(--line)}
#mobile.home-v2 .hv-small{font-size:13px;line-height:1.6;color:var(--muted)}

/* Hero */
#mobile.home-v2 .hv-hero{display:grid;grid-template-columns:1.05fr 1fr;align-items:center;gap:4%;padding-top:clamp(32px,6vw,80px);padding-bottom:clamp(48px,7vw,96px);min-height:min(820px,calc(100vh - var(--header)))}
#mobile.home-v2 .hv-actions{display:flex;flex-wrap:wrap;gap:12px;margin:28px 0 20px}
#mobile.home-v2 .hv-boards{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}
#mobile.home-v2 .hv-boards>span{display:inline-flex;align-items:center;gap:8px;min-height:36px;padding:6px 14px;border-radius:999px;background:var(--inset);border:1px solid var(--line);font-size:14px;font-weight:600}
#mobile.home-v2 .hv-boards>span::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--board,var(--p))}
#mobile.home-v2 .hv-boards>.kilter{--board:#F28C28}#mobile.home-v2 .hv-boards>.tension{--board:#3AA0E3}#mobile.home-v2 .hv-boards>.moon{--board:#E0483E}
#mobile.home-v2 .hv-stage{position:relative;height:clamp(520px,60vw,720px);perspective:1500px;transform-style:preserve-3d;--px:0;--py:0}
#mobile.home-v2 .hv-glow{position:absolute;inset:6% 0;border-radius:50%;background:radial-gradient(ellipse at 50% 45%,color-mix(in srgb,var(--p) 32%,transparent),transparent 64%);filter:blur(10px);transition:background .5s var(--ease)}
#mobile.home-v2 .hv-phone{position:absolute;width:var(--w,280px);margin:0;transform:translate3d(var(--x,0),var(--y,0),0) rotateX(calc(var(--tx,0deg) + var(--py) * -6deg)) rotateY(calc(var(--ty,0deg) + var(--px) * 8deg)) rotateZ(var(--tz,0deg));transition:transform .5s var(--ease)}
#mobile.home-v2 .hv-phone-a{--w:290px;--x:0;--y:30px;--ty:-16deg;--tz:-5deg;z-index:2}
#mobile.home-v2 .hv-phone-b{--w:220px;--x:66%;--y:150px;--ty:14deg;--tz:6deg;z-index:1;opacity:.96}
#mobile.home-v2 .hv-device{position:relative;aspect-ratio:1178/2556;border-radius:12.5% / 5.8%;background:linear-gradient(160deg,#3a3d44,#15171b 60%,#2a2d33);padding:3.2%;box-shadow:var(--shadow),inset 0 0 0 1px #ffffff1c}
#mobile.home-v2 .hv-phone-b .hv-device{background:linear-gradient(160deg,#e3e5ea,#8e929b 55%,#d6d9df)}
#mobile.home-v2 .hv-device::before{content:"";position:absolute;left:50%;top:3.4%;width:26%;height:2.9%;transform:translateX(-50%);border-radius:999px;background:#000;z-index:3}
#mobile.home-v2 .hv-device::after{content:"";position:absolute;right:-1.6%;top:22%;width:1.6%;height:11%;border-radius:0 3px 3px 0;background:#2b2e34}
#mobile.home-v2 .hv-screen{position:relative;width:100%;height:100%;border-radius:10.5% / 4.9%;overflow:hidden;background:#000}
#mobile.home-v2 .hv-screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
#mobile.home-v2 .hv-screen::after{content:"";position:absolute;inset:0;background:linear-gradient(115deg,#ffffff1f 0%,transparent 38%,transparent 60%,#ffffff0d 100%);pointer-events:none}
#mobile.home-v2 .hv-float{position:absolute;z-index:3;display:inline-flex;align-items:center;gap:10px;padding:10px 14px;border-radius:14px;background:color-mix(in srgb,var(--surface) 86%,transparent);backdrop-filter:blur(12px);border:1px solid var(--line);box-shadow:var(--shadow);font-size:13px;font-weight:600;white-space:nowrap}
#mobile.home-v2 .hv-float .hv-tile{width:30px;height:30px;border-radius:8px}
#mobile.home-v2 .hv-float-1{left:0;top:62%}#mobile.home-v2 .hv-float-2{right:2%;top:8%}
#mobile.home-v2 .hv-stage-note{position:absolute;left:0;right:0;bottom:-8px;text-align:center;font-size:12px;color:var(--muted)}
#mobile.home-v2 .hv-still-controls{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
#mobile.home-v2 .hv-still-controls>button{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:transparent;color:var(--ink);font-size:14px;font-weight:600;cursor:pointer;transition:background var(--t),transform var(--t) var(--spring)}
#mobile.home-v2 .hv-still-controls>button:hover{background:var(--inset)}#mobile.home-v2 .hv-still-controls>button:active{transform:scale(.97)}

/* Icon tiles and cards */
#mobile.home-v2 .hv-tile{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:26%;background:var(--tint,var(--p));color:#fff;flex-shrink:0;box-shadow:inset 0 -2px 0 #00000026}
#mobile.home-v2 .hv-tile>svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
#mobile.home-v2 .hv-tile[data-tint=blue]{--tint:#2A7DE1}#mobile.home-v2 .hv-tile[data-tint=violet]{--tint:#7C5CD6}#mobile.home-v2 .hv-tile[data-tint=green]{--tint:#2F9E5B}#mobile.home-v2 .hv-tile[data-tint=orange]{--tint:#E8762B}#mobile.home-v2 .hv-tile[data-tint=red]{--tint:#D9453D}#mobile.home-v2 .hv-tile[data-tint=teal]{--tint:#1A9AA6}#mobile.home-v2 .hv-tile[data-tint=pink]{--tint:#D6457F}#mobile.home-v2 .hv-tile[data-tint=amber]{--tint:#C98A12}#mobile.home-v2 .hv-tile[data-tint=indigo]{--tint:#4C5BD4}#mobile.home-v2 .hv-tile[data-tint=slate]{--tint:#5B6B7F}#mobile.home-v2 .hv-tile[data-tint=brown]{--tint:#8A5E3B}#mobile.home-v2 .hv-tile[data-tint=primary]{--tint:var(--p);color:var(--on-p)}
#mobile.home-v2 .hv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
#mobile.home-v2 .hv-card{position:relative;display:flex;flex-direction:column;gap:14px;padding:24px;border-radius:20px;background:var(--surface);border:1px solid var(--line);min-width:0;transition:transform .35s var(--spring),border-color var(--t),background .4s var(--ease)}
#mobile.home-v2 .hv-card:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--p) 40%,var(--line))}
#mobile.home-v2 .hv-card.wide{grid-column:span 2}
#mobile.home-v2 .hv-card p{font-size:16px;line-height:1.6;color:var(--muted)}
#mobile.home-v2 .hv-card ul{list-style:none;display:grid;gap:8px;font-size:15px;color:var(--muted)}
#mobile.home-v2 .hv-card ul>li{display:flex;gap:10px;align-items:flex-start}
#mobile.home-v2 .hv-card ul>li::before{content:"";flex-shrink:0;width:6px;height:6px;border-radius:50%;background:var(--p);margin-top:10px}
#mobile.home-v2 .hv-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:auto}
#mobile.home-v2 .hv-chip{display:inline-flex;align-items:center;min-height:28px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:600;background:var(--inset);color:var(--muted);border:1px solid var(--line)}
#mobile.home-v2 .hv-chip.ios{color:var(--ink)}#mobile.home-v2 .hv-chip.web{background:color-mix(in srgb,var(--p) 18%,var(--inset));color:var(--ink)}#mobile.home-v2 .hv-chip.admin{background:color-mix(in srgb,#E8762B 20%,var(--inset));color:var(--ink)}

/* Session steps */
#mobile.home-v2 .hv-steps{list-style:none;counter-reset:step;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
#mobile.home-v2 .hv-steps>li{position:relative;padding:28px 24px 24px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
#mobile.home-v2 .hv-steps>li::before{counter-increment:step;content:counter(step);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--p);color:var(--on-p);font-weight:700;margin-bottom:18px}
#mobile.home-v2 .hv-steps strong{display:block;font-size:19px;font-weight:650;letter-spacing:-.01em;margin-bottom:8px}
#mobile.home-v2 .hv-steps p{color:var(--muted);font-size:16px}
#mobile.home-v2 .hv-affiliation{margin-top:28px;font-size:13px;line-height:1.6;color:var(--muted);max-width:80ch}

/* Colourways */
#mobile.home-v2 .hv-colourways{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:clamp(28px,4vw,48px);border-radius:28px;background:var(--surface);border:1px solid var(--line);transition:background .4s var(--ease)}
#mobile.home-v2 .hv-colourways h2{font-size:clamp(28px,3.4vw,42px)}
#mobile.home-v2 .hv-colourways p{color:var(--muted);font-size:17px}
#mobile.home-v2 .hv-palette{display:flex;flex-direction:column;gap:18px}
#mobile.home-v2 .hv-swatches{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
#mobile.home-v2 .hv-swatch{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:12px;min-height:56px;padding:8px 12px;border-radius:16px;border:1.5px solid var(--line);background:var(--inset);color:var(--ink);cursor:pointer;text-align:left;font-size:14px;font-weight:600;transition:border-color var(--t),transform var(--t) var(--spring),background var(--t)}
#mobile.home-v2 .hv-swatch:hover{transform:translateY(-2px)}#mobile.home-v2 .hv-swatch:active{transform:scale(.97)}
#mobile.home-v2 .hv-swatch[aria-pressed=true]{border-color:var(--p);box-shadow:0 0 0 3px color-mix(in srgb,var(--p) 25%,transparent)}
#mobile.home-v2 .hv-swatch>i{position:relative;width:34px;height:34px;border-radius:10px;background:var(--sw-p);box-shadow:inset 0 0 0 1px #00000022;overflow:hidden}
#mobile.home-v2 .hv-swatch>i::before{content:"";position:absolute;right:0;bottom:0;width:50%;height:50%;background:var(--sw-s);border-top-left-radius:8px}
#mobile.home-v2 .hv-swatch>i::after{content:"";position:absolute;left:5px;bottom:5px;width:9px;height:9px;border-radius:50%;background:var(--sw-h)}
#mobile.home-v2 .hv-swatch small{display:block;font-weight:500;color:var(--muted);font-size:12px}
#mobile.home-v2 .hv-seg{position:relative;display:inline-grid;grid-auto-flow:column;grid-auto-columns:1fr;padding:4px;border-radius:999px;background:var(--inset);isolation:isolate;width:max-content}
#mobile.home-v2 .hv-seg>button{position:relative;z-index:1;min-height:44px;padding:0 20px;border:0;border-radius:999px;background:transparent;color:var(--muted);font-size:14px;font-weight:600;cursor:pointer;transition:color var(--t)}
#mobile.home-v2 .hv-seg>button[aria-pressed=true]{color:var(--on-p)}
#mobile.home-v2 .hv-seg>.hv-pill{top:4px;bottom:4px;opacity:1}
#mobile.home-v2 .hv-profile{display:flex;align-items:center;gap:12px;padding:12px 14px;border-radius:16px;background:var(--bg);border:1px solid var(--line)}
#mobile.home-v2 .hv-profile>i{width:40px;height:40px;border-radius:50%;background:linear-gradient(135deg,var(--p),var(--s));flex-shrink:0}
#mobile.home-v2 .hv-profile strong{display:block;font-size:15px}
#mobile.home-v2 .hv-profile span{font-size:13px;color:var(--muted)}

/* Beta */
#mobile.home-v2 .hv-beta{display:grid;grid-template-columns:1.1fr .9fr;gap:40px;align-items:start}
#mobile.home-v2 .hv-beta .hv-lead{max-width:46ch}
#mobile.home-v2 .hv-release{padding:28px;border-radius:24px;background:var(--surface);border:1px solid var(--line)}
#mobile.home-v2 .hv-release h3{font-size:22px;margin:8px 0 16px}
#mobile.home-v2 .hv-release ul{list-style:none;display:grid;gap:12px}
#mobile.home-v2 .hv-release li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;font-size:15px;line-height:1.5}
#mobile.home-v2 .hv-release li>.hv-tile{width:32px;height:32px}#mobile.home-v2 .hv-release li>.hv-tile>svg{width:17px;height:17px}
#mobile.home-v2 .hv-release li strong{display:block;font-weight:650}
#mobile.home-v2 .hv-release li span{color:var(--muted)}
#mobile.home-v2 .hv-release>p{margin-top:16px;font-size:13px;color:var(--muted)}

/* Updates and questions */
/* OMNI-327: the tracker is a reviewed snapshot rendered at release time (scripts/tracker-snapshot.mjs); the old live roadmap widget is hidden and no longer mounted. */
#mobile.home-v2 .hv-tracker{display:grid;gap:24px}
#mobile.home-v2 .hv-tracker-asof{font-size:15px;color:var(--muted)}
#mobile.home-v2 .hv-tracker-counts{list-style:none;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
#mobile.home-v2 .hv-tracker-counts li{padding:16px 18px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
#mobile.home-v2 .hv-tracker-counts strong{display:block;font-size:28px;font-weight:650;letter-spacing:-.5px;font-variant-numeric:tabular-nums}
#mobile.home-v2 .hv-tracker-counts span{font-size:13px;color:var(--muted)}
#mobile.home-v2 .hv-tracker-builds{list-style:none;display:grid;gap:12px}
#mobile.home-v2 .hv-tracker-build{padding:24px 28px;border-radius:24px;background:var(--surface);border:1px solid var(--line)}
#mobile.home-v2 .hv-tracker-build-head{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:12px}
#mobile.home-v2 .hv-tracker-build h3{font-size:20px;margin:0 auto 0 0}
#mobile.home-v2 .hv-tracker-verified{font-size:13px;color:var(--muted)}
#mobile.home-v2 .hv-tracker-items{list-style:none;display:grid;gap:12px}
#mobile.home-v2 .hv-tracker-items li{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;font-size:15px;line-height:1.5}
#mobile.home-v2 .hv-tracker-items li>.hv-tile{width:32px;height:32px}#mobile.home-v2 .hv-tracker-items li>.hv-tile>svg{width:17px;height:17px}
#mobile.home-v2 .hv-tracker-items strong{display:block;font-weight:650}
#mobile.home-v2 .hv-tracker-meta{display:block;color:var(--muted);font-size:13px}
#mobile.home-v2 .hv-tracker-more summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:44px;padding:12px 0;font-size:17px;font-weight:600;cursor:pointer;border-top:1px solid var(--line)}
#mobile.home-v2 .hv-tracker-more summary::-webkit-details-marker{display:none}
#mobile.home-v2 .hv-tracker-more summary>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--inset);font-size:20px;line-height:1;flex-shrink:0;transition:transform .3s var(--spring),background var(--t)}
#mobile.home-v2 .hv-tracker-more[open] summary>span{transform:rotate(45deg);background:var(--p-fill);color:var(--on-p)}
#mobile.home-v2 .hv-tracker-more>.hv-tracker-builds{margin-top:12px}
#mobile.home-v2 .hv-faq{display:grid;gap:0;max-width:860px}
#mobile.home-v2 .hv-faq details{border-top:1px solid var(--line)}
#mobile.home-v2 .hv-faq details:last-child{border-bottom:1px solid var(--line)}
#mobile.home-v2 .hv-faq summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 0;font-size:18px;font-weight:600;cursor:pointer}
#mobile.home-v2 .hv-faq summary::-webkit-details-marker{display:none}
#mobile.home-v2 .hv-faq summary>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--inset);color:var(--ink);font-size:20px;line-height:1;flex-shrink:0;transition:transform .3s var(--spring),background var(--t)}
#mobile.home-v2 .hv-faq details[open] summary>span{transform:rotate(45deg);background:var(--p-fill);color:var(--on-p)}
#mobile.home-v2 .hv-faq details>p{padding:0 48px 20px 0;color:var(--muted);font-size:16px;max-width:72ch}
#mobile.home-v2 .hv-boards details>ul{list-style:none;margin:0;padding:0 48px 20px 0;display:grid;gap:10px;max-width:72ch}#mobile.home-v2 .hv-boards details>ul>li{display:grid;gap:2px;font-size:16px}#mobile.home-v2 .hv-boards details>ul>li>strong{font-weight:650;color:var(--ink)}#mobile.home-v2 .hv-boards details>ul>li>span{color:var(--muted);font-size:14px}

/* Footer */
#mobile.home-v2 .hv-footer{display:grid;grid-template-columns:auto 1fr auto;gap:24px;align-items:center;padding-block:40px 48px;border-top:1px solid var(--line);font-size:14px;color:var(--muted)}
#mobile.home-v2 .hv-footer nav{display:flex;flex-wrap:wrap;gap:4px 8px;justify-content:center}
#mobile.home-v2 .hv-footer nav>a,#mobile.home-v2 .hv-footer nav>button{display:inline-flex;align-items:center;padding:8px 12px;border-radius:12px;background:transparent;border:0;color:var(--ink);text-decoration:none;font-size:14px;font-weight:600;cursor:pointer;transition:background var(--t)}
#mobile.home-v2 .hv-footer nav>a:hover,#mobile.home-v2 .hv-footer nav>button:hover{background:var(--inset)}
#mobile.home-v2 .hv-footer small{grid-column:1/-1;display:block;font-size:12px;line-height:1.6;max-width:80ch}
#mobile.home-v2 .hv-footer #mobile-status:empty{display:none}
#mobile.home-v2 .hv-footer #mobile-status{grid-column:1/-1;font-size:13px}

/* Still viewer */
#mobile.home-v2 .hv-viewer{inset:0;margin:auto;width:min(760px,calc(100% - 32px));max-height:94vh;padding:16px;border:1px solid var(--line);border-radius:20px;background:var(--surface);color:var(--ink);overflow:auto}
#mobile.home-v2 .hv-viewer::backdrop{background:#05070bcc;backdrop-filter:blur(8px)}
#mobile.home-v2 .hv-viewer>header{display:flex;align-items:center;justify-content:space-between;gap:16px}
#mobile.home-v2 .hv-viewer h2{font-size:18px;margin:0;flex:1;min-width:0;overflow-wrap:anywhere}
#mobile.home-v2 .hv-viewer header>button{flex-shrink:0;min-height:40px;padding:8px 14px;border-radius:999px;border:1px solid var(--line);background:var(--inset);color:var(--ink);font-size:14px;font-weight:600;cursor:pointer}
#mobile.home-v2 .hv-viewer-stage{height:70vh;margin:16px auto;border-radius:16px;overflow:hidden;background:#000}
#mobile.home-v2 .hv-viewer-stage img{display:block;height:100%;width:100%;object-fit:contain;transition:transform .4s var(--ease)}
#mobile.home-v2 .hv-viewer[data-home-preview=focus] .hv-viewer-stage img{transform:scale(1.8);transform-origin:50% 28%}
#mobile.home-v2 .hv-viewer>p{font-size:13px;color:var(--muted);text-align:center}

/* Reveal on scroll */
#mobile.home-v2 [data-reveal]{opacity:0;transform:translateY(18px);transition:opacity .6s var(--ease),transform .7s var(--ease);transition-delay:calc(var(--i,0) * 70ms)}
#mobile.home-v2 [data-reveal=in]{opacity:1;transform:none}
#mobile.home-v2[data-home-motion=reduced] [data-reveal]{opacity:1;transform:none;transition:none}

/* Responsive */
@media(max-width:1080px){
 #mobile.home-v2 .hv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}#mobile.home-v2 .hv-card.wide{grid-column:span 2}
 #mobile.home-v2 .guest-nav{max-width:100%;overflow-x:auto;scrollbar-width:none}
 #mobile.home-v2 .hv-hero{grid-template-columns:1fr;gap:32px}#mobile.home-v2 .hv-stage{height:min(600px,110vw)}
 #mobile.home-v2 .hv-phone-a{--x:6%}#mobile.home-v2 .hv-phone-b{--x:60%}
 #mobile.home-v2 .hv-colourways,#mobile.home-v2 .hv-beta{grid-template-columns:1fr}
}
@media(max-width:720px){#mobile.home-v2 .hv-tracker-counts{grid-template-columns:repeat(2,minmax(0,1fr))}#mobile.home-v2 .hv-tracker-build{padding:20px}
 .hv-container{width:calc(100% - 32px)}
 #mobile.home-v2{font-size:16px}
 #mobile.home-v2 h1{font-size:clamp(42px,12vw,64px)}
 #mobile.home-v2 .hv-grid,#mobile.home-v2 .hv-steps{grid-template-columns:1fr}#mobile.home-v2 .hv-card.wide{grid-column:auto}
 #mobile.home-v2 .hv-swatches{grid-template-columns:repeat(2,minmax(0,1fr))}
 #mobile.home-v2 .hv-stage{height:min(560px,125vw)}#mobile.home-v2 .hv-phone-a{--w:230px;--x:0;--y:24px}#mobile.home-v2 .hv-phone-b{--w:180px;--x:54%;--y:120px}
 #mobile.home-v2 .hv-float-2{display:none}
 #mobile.home-v2 .hv-footer{grid-template-columns:1fr;text-align:left}#mobile.home-v2 .hv-footer nav{justify-content:flex-start}
 #mobile.home-v2 .hv-viewer-stage{height:62vh}
}
@media(max-width:380px){#mobile.home-v2 .hv-phone-a{--w:200px}#mobile.home-v2 .hv-phone-b{--w:160px;--x:50%}}

/* Motion preferences and forced colours */
@media(prefers-reduced-motion:reduce){#mobile.home-v2 *,#mobile.home-v2 *::before,#mobile.home-v2 *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}#mobile.home-v2 [data-reveal]{opacity:1;transform:none}#mobile.home-v2 .hv-phone{transform:translate3d(var(--x,0),var(--y,0),0) rotateY(var(--ty,0deg)) rotateZ(var(--tz,0deg))}}
#mobile.home-v2[data-home-motion=reduced] *,#mobile.home-v2[data-home-motion=reduced] *::before,#mobile.home-v2[data-home-motion=reduced] *::after{animation:none!important;transition:none!important}
#mobile.home-v2[data-home-motion=reduced] .hv-phone{transform:translate3d(var(--x,0),var(--y,0),0) rotateY(var(--ty,0deg)) rotateZ(var(--tz,0deg))}
@media(prefers-contrast:more){#mobile.home-v2 .hv-sky>span{display:none}}
@media(forced-colors:active){#mobile.home-v2{--bg:Canvas;--ink:CanvasText;--muted:CanvasText;--line:CanvasText;--p:LinkText;--on-p:Canvas;--surface:Canvas;--inset:Canvas}#mobile.home-v2 .hv-sky,#mobile.home-v2 .hv-glow,#mobile.home-v2 .hv-float{display:none}#mobile.home-v2 .hv-device{outline:2px solid CanvasText}#mobile.home-v2 .hv-screen{forced-color-adjust:none}#mobile.home-v2 .hv-button,#mobile.home-v2 .guest-climb-link,#mobile.home-v2 .hv-swatch{border:1px solid ButtonText}}

/* Media: phone-framed clips and screenshot galleries. Nothing loads until the clip is near the viewport. */
#mobile.home-v2 .hv-badge{display:inline-flex;align-items:center;gap:6px;min-height:28px;padding:3px 10px;border-radius:999px;font-size:12px;font-weight:700;letter-spacing:.01em;background:color-mix(in srgb,var(--p) 22%,var(--inset));color:var(--ink);border:1px solid color-mix(in srgb,var(--p) 40%,transparent)}
#mobile.home-v2 .hv-badge.only{background:var(--p-fill);color:var(--on-p);border-color:transparent}
#mobile.home-v2 .hv-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8}
#mobile.home-v2 .hv-feature{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,72px);align-items:center;padding-block:clamp(40px,6vw,88px)}
#mobile.home-v2 .hv-feature+.hv-feature{border-top:1px solid var(--line)}
#mobile.home-v2 .hv-feature.flip>.hv-feature-copy{order:2}
#mobile.home-v2 .hv-feature-copy{max-width:520px}
#mobile.home-v2 .hv-feature-copy h2{font-size:clamp(28px,3.4vw,44px);margin-top:14px}
#mobile.home-v2 .hv-feature-copy>p{font-size:17px;line-height:1.65;color:var(--muted)}
#mobile.home-v2 .hv-feature-copy ul{list-style:none;display:grid;gap:10px;margin-top:20px;font-size:16px;color:var(--ink)}
#mobile.home-v2 .hv-feature-copy ul>li{display:flex;gap:12px;align-items:flex-start}
#mobile.home-v2 .hv-feature-copy ul>li>.hv-tile{width:30px;height:30px;margin-top:-2px}#mobile.home-v2 .hv-feature-copy ul>li>.hv-tile>svg{width:16px;height:16px}
#mobile.home-v2 .hv-feature-copy ul>li span{color:var(--muted)}
#mobile.home-v2 .hv-feature-copy ul>li strong{display:block;font-weight:650;color:var(--ink)}
#mobile.home-v2 .hv-media{position:relative;display:grid;place-items:center;min-width:0}
#mobile.home-v2 .hv-media .hv-glow{inset:10% 6%}
#mobile.home-v2 .hv-figure{position:relative;margin:0;width:min(300px,78vw);--tx:0deg;--ty:0deg;--tz:0deg}
#mobile.home-v2 .hv-figure .hv-device{transform:rotateY(var(--ty)) rotateZ(var(--tz));transition:transform .5s var(--ease)}
#mobile.home-v2 .hv-figure.tilt-l .hv-device{--ty:-10deg;--tz:-3deg}#mobile.home-v2 .hv-figure.tilt-r .hv-device{--ty:10deg;--tz:3deg}
#mobile.home-v2 .hv-figure:hover .hv-device{--ty:0deg;--tz:0deg}
#mobile.home-v2 .hv-screen>video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#000}
#mobile.home-v2 .hv-figure figcaption{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:14px;font-size:13px;line-height:1.5;color:var(--muted)}
#mobile.home-v2 .hv-shots{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:22px}
#mobile.home-v2 .hv-shot{position:relative;display:block;padding:0;border:1px solid var(--line);border-radius:16px;overflow:hidden;background:#000;cursor:zoom-in;aspect-ratio:1206/2622;transition:transform .35s var(--spring),border-color var(--t)}
#mobile.home-v2 .hv-shot:hover{transform:translateY(-3px);border-color:color-mix(in srgb,var(--p) 50%,var(--line))}
#mobile.home-v2 .hv-shot>img{display:block;width:100%;height:100%;object-fit:cover}
#mobile.home-v2 .hv-shot>span{position:absolute;left:8px;bottom:8px;right:8px;padding:5px 8px;border-radius:10px;background:#0b0c0ecc;color:#fff;font-size:12px;line-height:1.3;backdrop-filter:blur(6px)}
#mobile.home-v2 .hv-party{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;align-items:start;margin-top:28px}
#mobile.home-v2 .hv-party .hv-figure{width:100%}
#mobile.home-v2 .hv-party .hv-device{transform:none}
#mobile.home-v2 .hv-party figcaption{flex-direction:column;align-items:flex-start;gap:8px}
#mobile.home-v2 .hv-party figcaption strong{color:var(--ink);font-size:14px}
#mobile.home-v2 .hv-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:32px}
#mobile.home-v2 .hv-strip>div{padding:22px;border-radius:20px;background:var(--surface);border:1px solid var(--line)}
#mobile.home-v2 .hv-strip strong{display:block;font-size:18px;margin:12px 0 6px;letter-spacing:-.01em}
#mobile.home-v2 .hv-strip p{font-size:15px;color:var(--muted)}
#mobile.home-v2 [data-home-figure][data-playing=true] .hv-screen::after{opacity:0}
@media(max-width:1080px){#mobile.home-v2 .hv-party{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:860px){#mobile.home-v2 .hv-feature{grid-template-columns:1fr}#mobile.home-v2 .hv-feature.flip>.hv-feature-copy{order:0}#mobile.home-v2 .hv-media{order:1}#mobile.home-v2 .hv-strip{grid-template-columns:1fr}}
@media(max-width:560px){#mobile.home-v2 .hv-party{grid-template-columns:1fr 1fr;gap:10px}#mobile.home-v2 .hv-shots{gap:6px}#mobile.home-v2 .hv-shot{border-radius:12px}#mobile.home-v2 .hv-shot>span{display:none}}

/* Standard icon sprite, scroll progress, LED board and pointer tilt (DESIGN-STANDARDS.md §4–5). */
#mobile.home-v2 .hv-tile>svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round;transition:transform .3s var(--spring)}
#mobile.home-v2 .hv-card:hover .hv-tile>svg,#mobile.home-v2 .hv-strip>div:hover .hv-tile>svg{transform:scale(1.12) rotate(-6deg)}
#mobile.home-v2 .hv-progress{position:absolute;left:0;bottom:-1px;height:2px;width:100%;transform-origin:0 50%;transform:scaleX(var(--progress,0));background:var(--p);opacity:.9;transition:transform .12s linear,background .4s var(--ease)}
#mobile.home-v2 .hv-led{position:absolute;right:-6%;top:-4%;width:min(560px,92%);height:auto;z-index:0;pointer-events:none;color:var(--p);opacity:.9;mask-image:radial-gradient(ellipse at 55% 45%,#000 30%,transparent 72%)}
#mobile.home-v2 .hv-led circle{fill:color-mix(in srgb,var(--ink) 14%,transparent);transition:fill .4s var(--ease)}
#mobile.home-v2 .hv-led circle.on{fill:color-mix(in srgb,var(--ink) 14%,transparent);animation:hv-led 9s ease-in-out infinite;animation-delay:calc(var(--k) * .55s)}
@keyframes hv-led{0%,4%{fill:color-mix(in srgb,var(--ink) 14%,transparent);r:3.2}8%,52%{fill:var(--p);r:4.4}60%,100%{fill:color-mix(in srgb,var(--ink) 14%,transparent);r:3.2}}
#mobile.home-v2 .hv-phone,#mobile.home-v2 .hv-float{z-index:1}
#mobile.home-v2 .hv-figure .hv-device{transform:rotateY(var(--ty)) rotateZ(var(--tz));transition:transform .45s var(--ease)}
#mobile.home-v2 .hv-figure[data-tilting=true] .hv-device{transition:transform .08s linear}
#mobile.home-v2 .hv-swatch[aria-pressed=true]>i{animation:hv-pop .4s var(--spring)}
@keyframes hv-pop{0%{transform:scale(.8)}60%{transform:scale(1.12)}100%{transform:scale(1)}}
#mobile.home-v2 .hv-badge.only{animation:hv-badge 6s ease-in-out infinite}
@keyframes hv-badge{0%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--p) 45%,transparent)}50%{box-shadow:0 0 0 6px transparent}}
#mobile.home-v2[data-home-motion=reduced] .hv-led circle.on{animation:none;fill:var(--p)}
@media(prefers-reduced-motion:reduce){#mobile.home-v2 .hv-led circle.on{animation:none;fill:var(--p)}}
@media(max-width:1080px){#mobile.home-v2 .hv-led{right:-10%;top:0;width:min(480px,100%)}}

/* 3D devices: a stacked body with real depth, a gloss sweep and a ground shadow. Rotation follows the pointer and the scroll. */
#mobile.home-v2 .hv-stage,#mobile.home-v2 .hv-media,#mobile.home-v2 .hv-party{perspective:1400px;perspective-origin:50% 40%}
#mobile.home-v2 .hv-device{position:relative;transform-style:preserve-3d;aspect-ratio:1178/2556;border-radius:12.5% / 5.8%;background:linear-gradient(160deg,#4a4e57,#1a1c21 55%,#33363d);padding:3.2%;box-shadow:inset 0 0 0 1px #ffffff24,inset 0 0 0 3px #0b0c0e;transition:transform .5s var(--ease)}
#mobile.home-v2 .hv-device::before{content:"";position:absolute;left:50%;top:3.4%;width:26%;height:2.9%;transform:translateX(-50%) translateZ(1px);border-radius:999px;background:#000;z-index:3}
#mobile.home-v2 .hv-device::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(105deg,transparent 30%,#ffffff26 44%,#ffffff0d 50%,transparent 62%);background-size:260% 100%;background-position:120% 0;transform:translateZ(2px);pointer-events:none;mix-blend-mode:screen}
#mobile.home-v2 .hv-depth{position:absolute;inset:0;border-radius:inherit;background:linear-gradient(160deg,#2b2e34,#0f1013 60%,#23262c);transform:translateZ(calc(var(--z) * -1.4px));box-shadow:inset 0 0 0 1px #ffffff10}
#mobile.home-v2 .hv-depth[style*="--z:7"]{background:#0a0b0d;box-shadow:0 30px 60px -20px #000c}
#mobile.home-v2 .hv-screen{position:relative;z-index:2;transform:translateZ(1px);width:100%;height:100%;border-radius:10.5% / 4.9%;overflow:hidden;background:#000}
#mobile.home-v2 .hv-screen::after{transform:translateZ(1px)}
#mobile.home-v2 .hv-ground{position:absolute;left:8%;right:8%;bottom:-9%;height:10%;border-radius:50%;background:radial-gradient(ellipse at 50% 50%,#000a,transparent 70%);transform:translateZ(-12px);filter:blur(6px);pointer-events:none}
#mobile.home-v2 .hv-phone-b .hv-device{background:linear-gradient(160deg,#e6e8ed,#9196a0 55%,#d7dbe1)}
#mobile.home-v2 .hv-phone-b .hv-depth{background:linear-gradient(160deg,#aeb3bb,#6d727b 60%,#9a9fa8)}
/* Hero phones stand at fixed yaws (OMNI-329), nudged by the pointer. Feature phones: scroll-driven yaw plus pointer tilt. */
#mobile.home-v2 .hv-phone{transform:translate3d(var(--x,0),var(--y,0),0) rotateX(calc(var(--tx,0deg) + var(--py) * -8deg)) rotateY(calc(var(--ty,0deg) + var(--px) * 14deg)) rotateZ(var(--tz,0deg));transition:transform .4s var(--ease)}
#mobile.home-v2 .hv-figure{transform-style:preserve-3d}
#mobile.home-v2 .hv-figure .hv-device{transform:rotateX(var(--tx,0deg)) rotateY(calc(var(--ry,0deg) + var(--ty,0deg))) rotateZ(var(--tz,0deg));transition:transform .35s var(--ease)}
#mobile.home-v2 .hv-figure[data-tilting=true] .hv-device{transition:transform .06s linear}
#mobile.home-v2 .hv-figure.tilt-l{--ty:0deg;--tz:0deg}#mobile.home-v2 .hv-figure.tilt-r{--ty:0deg;--tz:0deg}
/* Quicker page motion. */
#mobile.home-v2 [data-reveal]{transform:translateY(12px);transition:opacity .4s var(--ease),transform .45s var(--spring);transition-delay:calc(var(--i,0) * 50ms)}
#mobile.home-v2 .hv-led circle.on{animation-duration:6s;animation-delay:calc(var(--k) * .32s)}
#mobile.home-v2 .hv-card{transition:transform .25s var(--spring),border-color var(--t),background .4s var(--ease)}
#mobile.home-v2 .hv-card:hover{transform:translateY(-4px) scale(1.01)}
#mobile.home-v2 .hv-shot{transition:transform .25s var(--spring),border-color var(--t)}
/* Reduced motion: flat, still devices. */
#mobile.home-v2[data-home-motion=reduced] .hv-device,#mobile.home-v2[data-home-motion=reduced] .hv-device::after,#mobile.home-v2[data-home-motion=reduced] .hv-party .hv-device{animation:none;transform:none}
@media(prefers-reduced-motion:reduce){#mobile.home-v2 .hv-device,#mobile.home-v2 .hv-device::after{animation:none!important;transform:none!important}}
@media(max-width:720px){#mobile.home-v2 .hv-stage,#mobile.home-v2 .hv-media{perspective:900px}}

/* 3D devices, revised: a body with real thickness (11% of width, 16 rounded slices), yaw only, bottom edge level with the ground. */
#mobile.home-v2 .hv-stage,#mobile.home-v2 .hv-media,#mobile.home-v2 .hv-party{perspective:1600px;perspective-origin:50% 62%}
#mobile.home-v2 .hv-device{--depth:calc(var(--w,280px) * .11);transform-style:preserve-3d;padding:3.2%;background:linear-gradient(90deg,#5a5e68,#2a2d33 12%,#1c1e23 50%,#2a2d33 88%,#5a5e68);box-shadow:inset 0 0 0 1px #ffffff2e}
#mobile.home-v2 .hv-depth{position:absolute;inset:0;border-radius:inherit;transform:translateZ(calc(var(--depth) * var(--z) / -16));background:linear-gradient(90deg,#6b707b,#3a3e46 10%,#2a2d33 50%,#3a3e46 90%,#6b707b);box-shadow:inset 0 0 0 1px #ffffff14}
#mobile.home-v2 .hv-depth[style*="--z:16"]{background:linear-gradient(160deg,#2b2e34,#101216 60%,#1d2026);box-shadow:inset 0 0 0 1px #ffffff10,0 40px 60px -20px #000c}
#mobile.home-v2 .hv-phone-b .hv-device{background:linear-gradient(90deg,#f1f3f6,#b9bec6 12%,#9aa0a9 50%,#b9bec6 88%,#f1f3f6)}
#mobile.home-v2 .hv-phone-b .hv-depth{background:linear-gradient(90deg,#f3f5f8,#c3c8cf 10%,#aab0b8 50%,#c3c8cf 90%,#f3f5f8)}
#mobile.home-v2 .hv-phone-b .hv-depth[style*="--z:16"]{background:linear-gradient(160deg,#e3e6eb,#9ea4ad 60%,#c9ced5)}
#mobile.home-v2 .hv-screen{transform:translateZ(.5px)}
#mobile.home-v2 .hv-device::before{transform:translateX(-50%) translateZ(1px)}
#mobile.home-v2 .hv-device::after{transform:translateZ(1.5px)}
/* Yaw only. The hero phones stand side by side on one ground plane; the second sits behind, never intersecting the first. */
#mobile.home-v2 .hv-phone{transform:translate3d(var(--x,0),var(--y,0),var(--z,0px)) rotateY(calc(var(--px,0) * 10deg));transition:transform .4s var(--ease)}
#mobile.home-v2 .hv-phone-a{--w:300px;--x:0;--y:60px;--z:0px;z-index:2}
#mobile.home-v2 .hv-phone-b{--w:220px;--x:62%;--y:170px;--z:-160px;z-index:1;opacity:1}
#mobile.home-v2 .hv-figure .hv-device{transform:rotateY(calc(var(--ry,0deg) + var(--ty,0deg) + var(--fan,0deg)))}
#mobile.home-v2 .hv-ground{position:absolute;left:50%;bottom:-4%;width:120%;height:9%;transform:translateX(-50%) translateZ(-40px);border-radius:50%;background:radial-gradient(ellipse at 50% 50%,#000b,#0006 40%,transparent 70%);filter:blur(7px);pointer-events:none;z-index:0}
#mobile.home-v2 .hv-figure{position:relative}
#mobile.home-v2 .hv-phone-b .hv-screen img{object-fit:cover}
@media(max-width:1080px){#mobile.home-v2 .hv-phone-a{--x:4%}#mobile.home-v2 .hv-phone-b{--x:60%}}
@media(max-width:720px){#mobile.home-v2 .hv-phone-a{--w:230px;--x:0;--y:30px}#mobile.home-v2 .hv-phone-b{--w:170px;--x:58%;--y:120px;--z:-120px}}
@media(max-width:380px){#mobile.home-v2 .hv-phone-a{--w:200px}#mobile.home-v2 .hv-phone-b{--w:150px;--x:54%}}
#mobile.home-v2[data-home-motion=reduced] .hv-phone,#mobile.home-v2[data-home-motion=reduced] .hv-figure .hv-device{transform:translate3d(var(--x,0),var(--y,0),0)}
/* Nav pill: one smooth slide, no flash. The pill stays visible once placed; link colour follows it slightly behind. */
#mobile.home-v2 .hv-pill{opacity:1;transition:transform .32s var(--spring),width .32s var(--spring),background .4s var(--ease)}
#mobile.home-v2 .hv-pill:not([data-on=true]){opacity:0}
#mobile.home-v2 .guest-nav>a{transition:color .28s var(--ease) .08s}
#mobile.home-v2 .hv-seg>button{transition:color .28s var(--ease) .06s}
#mobile.home-v2 .hv-phone-b{--x:68%;--y:150px;--z:-90px}
#mobile.home-v2 .hv-float-1{left:-5%;top:56%;z-index:4}#mobile.home-v2 .hv-float-2{z-index:4}
@media(max-width:720px){#mobile.home-v2 .hv-phone-b{--x:62%;--y:110px;--z:-70px}#mobile.home-v2 .hv-float-1{left:0}}

/* No inline styles: the page CSP is style-src 'self'. Stagger, slices, LED steps, swatches and spacing come from classes. */
#mobile.home-v2 [data-i="1"]{--i:1}#mobile.home-v2 [data-i="2"]{--i:2}#mobile.home-v2 [data-i="3"]{--i:3}
#mobile.home-v2 .hv-depth:nth-of-type(1){--z:1}#mobile.home-v2 .hv-depth:nth-of-type(2){--z:2}#mobile.home-v2 .hv-depth:nth-of-type(3){--z:3}#mobile.home-v2 .hv-depth:nth-of-type(4){--z:4}#mobile.home-v2 .hv-depth:nth-of-type(5){--z:5}#mobile.home-v2 .hv-depth:nth-of-type(6){--z:6}#mobile.home-v2 .hv-depth:nth-of-type(7){--z:7}#mobile.home-v2 .hv-depth:nth-of-type(8){--z:8}#mobile.home-v2 .hv-depth:nth-of-type(9){--z:9}#mobile.home-v2 .hv-depth:nth-of-type(10){--z:10}#mobile.home-v2 .hv-depth:nth-of-type(11){--z:11}#mobile.home-v2 .hv-depth:nth-of-type(12){--z:12}#mobile.home-v2 .hv-depth:nth-of-type(13){--z:13}#mobile.home-v2 .hv-depth:nth-of-type(14){--z:14}#mobile.home-v2 .hv-depth:nth-of-type(15){--z:15}#mobile.home-v2 .hv-depth:nth-of-type(16){--z:16;background:linear-gradient(160deg,#2b2e34,#101216 60%,#1d2026);box-shadow:inset 0 0 0 1px #ffffff10,0 40px 60px -20px #000c}
#mobile.home-v2 .hv-phone-b .hv-depth:nth-of-type(16){background:linear-gradient(160deg,#e3e6eb,#9ea4ad 60%,#c9ced5)}
#mobile.home-v2 .hv-led .k0{--k:0}#mobile.home-v2 .hv-led .k1{--k:1}#mobile.home-v2 .hv-led .k2{--k:2}#mobile.home-v2 .hv-led .k3{--k:3}#mobile.home-v2 .hv-led .k4{--k:4}#mobile.home-v2 .hv-led .k5{--k:5}#mobile.home-v2 .hv-led .k6{--k:6}#mobile.home-v2 .hv-led .k7{--k:7}#mobile.home-v2 .hv-led .k8{--k:8}
#mobile.home-v2 .sw-classic{--sw-p:#62A8FF;--sw-s:#A996F2;--sw-h:#2E3F57}#mobile.home-v2 .sw-muted{--sw-p:#A9B8C8;--sw-s:#C4C8CE;--sw-h:#464C54}#mobile.home-v2 .sw-bold{--sw-p:#0A84FF;--sw-s:#7D7AFF;--sw-h:#2C2C2E}#mobile.home-v2 .sw-mitake{--sw-p:#F58AB6;--sw-s:#85C9B6;--sw-h:#9C2F5C}#mobile.home-v2 .sw-bishop{--sw-p:#D4A47A;--sw-s:#DCE6EE;--sw-h:#4E3A28}#mobile.home-v2 .sw-fontainebleau{--sw-p:#7FC48C;--sw-s:#D9BE8E;--sw-h:#A8925E}#mobile.home-v2 .sw-hueco{--sw-p:#E57A5E;--sw-s:#84BDE3;--sw-h:#A9674A}#mobile.home-v2 .sw-squamish{--sw-p:#4CC7D4;--sw-s:#8CC487;--sw-h:#1F5D63}#mobile.home-v2 .sw-yosemite{--sw-p:#6FB8DB;--sw-s:#9BCB86;--sw-h:#5E6D75}
#mobile.home-v2[data-home-mode=light] .sw-classic{--sw-p:#2A7DE1;--sw-s:#7C5CD6;--sw-h:#D9E6F7}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-classic{--sw-p:#2A7DE1;--sw-s:#7C5CD6;--sw-h:#D9E6F7}}#mobile.home-v2[data-home-mode=light] .sw-muted{--sw-p:#56677A;--sw-s:#8A8F96;--sw-h:#E2E5E9}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-muted{--sw-p:#56677A;--sw-s:#8A8F96;--sw-h:#E2E5E9}}#mobile.home-v2[data-home-mode=light] .sw-bold{--sw-p:#0A84FF;--sw-s:#5E5CE6;--sw-h:#E5E5EA}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-bold{--sw-p:#0A84FF;--sw-s:#5E5CE6;--sw-h:#E5E5EA}}#mobile.home-v2[data-home-mode=light] .sw-mitake{--sw-p:#D6457F;--sw-s:#3F7E6E;--sw-h:#F9D3E3}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-mitake{--sw-p:#D6457F;--sw-s:#3F7E6E;--sw-h:#F9D3E3}}#mobile.home-v2[data-home-mode=light] .sw-bishop{--sw-p:#8A5E3B;--sw-s:#7F98AC;--sw-h:#F4F2EF}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-bishop{--sw-p:#8A5E3B;--sw-s:#7F98AC;--sw-h:#F4F2EF}}#mobile.home-v2[data-home-mode=light] .sw-fontainebleau{--sw-p:#2F6B3A;--sw-s:#9A7B4F;--sw-h:#E3D3A6}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-fontainebleau{--sw-p:#2F6B3A;--sw-s:#9A7B4F;--sw-h:#E3D3A6}}#mobile.home-v2[data-home-mode=light] .sw-hueco{--sw-p:#9C3D2A;--sw-s:#3E7CA6;--sw-h:#EBC7A8}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-hueco{--sw-p:#9C3D2A;--sw-s:#3E7CA6;--sw-h:#EBC7A8}}#mobile.home-v2[data-home-mode=light] .sw-squamish{--sw-p:#0E6E7A;--sw-s:#3D6B3A;--sw-h:#CFE0DC}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-squamish{--sw-p:#0E6E7A;--sw-s:#3D6B3A;--sw-h:#CFE0DC}}#mobile.home-v2[data-home-mode=light] .sw-yosemite{--sw-p:#2C6E8F;--sw-s:#4E7A3C;--sw-h:#D5DEE3}@media (prefers-color-scheme: light){#mobile.home-v2:not([data-home-mode=dark]) .sw-yosemite{--sw-p:#2C6E8F;--sw-s:#4E7A3C;--sw-h:#D5DEE3}}
#mobile.home-v2 .hv-mt12{margin-top:12px}#mobile.home-v2 .hv-mt14{margin-top:14px}#mobile.home-v2 .hv-mt16{margin-top:16px}#mobile.home-v2 .hv-mt20{margin-top:20px}#mobile.home-v2 .hv-mt24{margin-top:24px}#mobile.home-v2 .hv-muted{color:var(--muted)}
#mobile.home-v2 .hv-shots-4{grid-template-columns:repeat(4,minmax(0,1fr));max-width:900px}
/* Every ancestor between the perspective and the device keeps 3D, so the body's depth layers are not flattened. */
#mobile.home-v2 .hv-phone,#mobile.home-v2 .hv-figure,#mobile.home-v2 .hv-party figure,#mobile.home-v2 .hv-media figure{transform-style:preserve-3d}
/* Softer glass: no seam when the body is turned. */
#mobile.home-v2 .hv-screen::after{background:linear-gradient(115deg,#ffffff10 0%,transparent 28%)}
#mobile.home-v2 .hv-device::after{background:linear-gradient(105deg,transparent 34%,#ffffff14 46%,#ffffff08 50%,transparent 60%);background-size:260% 100%}
#mobile.home-v2 .hv-float-1{left:-10%;top:60%}
@media(max-width:720px){#mobile.home-v2 .hv-float-1{left:-2%;top:62%}}
/* iPhone proportions (16 Pro: 71.5 × 149.6 mm body, ~1.4 mm bezel, 8.25 mm thick): bezel 2% of width, body radius 14% of width, screen radius 12.4%, Dynamic Island 32% wide. */
#mobile.home-v2 .hv-device{padding:2%;border-radius:14% / 6.45%;--depth:calc(var(--w,280px) * .115)}
#mobile.home-v2 .hv-screen{border-radius:12.4% / 5.72%}
#mobile.home-v2 .hv-device::before{width:32%;height:4.1%;top:2.9%;border-radius:999px}
#mobile.home-v2 .hv-figure .hv-device{transition:transform .22s var(--ease)}
#mobile.home-v2 .hv-figure[data-tilting=true] .hv-device{transition:transform .06s linear}
/* Each phone is its own 3D scene. Stages, figures and their siblings stay flat, so labels, captions, dots and buttons can never intersect a rotated body (Safari composites intersecting 3D siblings by slicing them). */
#mobile.home-v2 .hv-stage,#mobile.home-v2 .hv-media,#mobile.home-v2 .hv-party,#mobile.home-v2 .hv-figure{perspective:none;transform-style:flat}
#mobile.home-v2 .hv-phone{perspective:1500px;perspective-origin:50% 60%;transform-style:flat;transform:translate3d(var(--x,0),var(--y,0),0)}
#mobile.home-v2 .hv-phone-b{--z:0px;z-index:1}#mobile.home-v2 .hv-phone-a{z-index:2}
#mobile.home-v2 .hv-figure{perspective:1500px;perspective-origin:50% 55%}
#mobile.home-v2 .hv-figure .hv-device,#mobile.home-v2 .hv-phone .hv-device{transform-style:preserve-3d}
#mobile.home-v2 .hv-float,#mobile.home-v2 .hv-stage-note,#mobile.home-v2 .hv-figure figcaption{position:relative;z-index:5;transform:none}
#mobile.home-v2 .hv-float{position:absolute}
#mobile.home-v2 .hv-led{z-index:0}
/* No blended gloss (it rendered as a seam on a turned body); a faint flat highlight only. */
#mobile.home-v2 .hv-device::after{mix-blend-mode:normal;animation:none;background:linear-gradient(105deg,transparent 38%,#ffffff0a 48%,transparent 58%)}
#mobile.home-v2 .hv-screen::after{display:none}
#mobile.home-v2 .hv-ground{transform:translateX(-50%);z-index:0}
#mobile.home-v2 .hv-phone>.hv-device{transition:transform .4s var(--ease)}
/* OMNI-329: no turntables. Each hero phone stands at one fixed yaw; the pointer nudge (±5°) turns it and it settles once on leave. Reduced motion keeps the flat, still devices. */
#mobile.home-v2 .hv-phone-a .hv-device{transform:rotateY(calc(-14deg + var(--nudge,0deg)))}
#mobile.home-v2 .hv-phone-b .hv-device{transform:rotateY(calc(10deg + var(--nudge,0deg)))}
#mobile.home-v2[data-home-motion=reduced] .hv-phone .hv-device{transform:none}
/* Party phones stand in a fixed fan, each pair facing inwards; the scroll yaw and pointer tilt still apply. */
#mobile.home-v2 .hv-party .hv-figure:nth-child(odd){--fan:8deg}#mobile.home-v2 .hv-party .hv-figure:nth-child(even){--fan:-8deg}
#mobile.home-v2 .hv-stage-note{position:absolute;left:0;right:0;bottom:-8px;top:auto}
@media(max-width:720px){#mobile.home-v2 .hv-stage-note{bottom:-4px}}
#mobile.home-v2 .hv-pill.hv-still{transition:none}
/* OMNI-326: the admin shell's guest-page.css adds margin-top:16px to .guest-nav at <=760px; the Home sets its own spacing. The two-row header (<=1080px) uses an 8px row gap and phone nav links are 44px tall. */
#mobile.home-v2 .guest-nav{margin:0}
@media(max-width:1080px){#mobile.home-v2 .hv-header{row-gap:8px}}
/* The skip link and sky are absolute; #mobile.home-v2>* had out-specified them, leaving a line box above the header, a skip link behind the sticky header and a 0px-tall star field. */
#mobile.home-v2>.hv-skip{position:absolute;z-index:40;color:var(--on-p);background:var(--p-fill)}
#mobile.home-v2>.hv-sky{position:absolute;z-index:0}
/* Header side gutters: .hv-header>.hv-container is display:contents, so the header carries the container's gutter (max(24px,(100% - 1200px)/2); 16px on phones), aligning the mark and buttons with the hero. */
#mobile.home-v2 .hv-header{padding:10px max(24px,calc((100% - 1200px) / 2))}
@media(max-width:720px){#mobile.home-v2 .hv-header{padding:10px 16px}}
/* OMNI-325: no web-app option on phones (<=720px) or coarse-pointer touch devices; /app/ is desktop-only and hands them off. There the hero's primary action is the phone-only "iOS beta". */
#mobile.home-v2 .hv-phone-only{display:none}
@media (max-width:720px),(hover:none) and (pointer:coarse){#mobile.home-v2 .guest-primary-nav,#mobile.home-v2 .hv-actions>.hv-phone-hide{display:none}#mobile.home-v2 .hv-phone-only{display:inline-flex}}
/* OMNI-329 follow-up from a real phone (2026-10-22): the shell wraps .guest-nav at any text size, which turned the pill into a tall circle; the track never wraps and scrolls sideways instead. The floating chips over the hero phones are hidden on phones, where they covered the artwork. */
@media(max-width:720px){#mobile.home-v2 .hv-float{display:none}#mobile.home-v2 .guest-nav{max-width:100%;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}}
/* Phone layout pass from the same screenshot (2026-10-22). Header: one 64px row on phones, the mark alone (aria-label "Omni home" stays) and a full-width tab track whose tabs share the width, or scroll when text is large (the script keeps the current tab in view). Thumbnail strips: a swipeable row with 42%-wide shots and their captions, instead of three or four 90px phones. */
@media(max-width:720px){
 #mobile.home-v2 .hv-header{grid-template-columns:auto minmax(0,1fr);column-gap:8px;row-gap:0;min-height:0;padding:6px 16px}
 #mobile.home-v2 .guest-brand{font-size:0;gap:0;min-width:44px;min-height:44px;justify-content:center}
 #mobile.home-v2 .omni-mark{width:30px;height:30px}
 #mobile.home-v2 .guest-nav{grid-column:2;grid-row:1;justify-self:stretch;width:100%;scrollbar-width:none;scroll-snap-type:x proximity}
 #mobile.home-v2 .guest-nav::-webkit-scrollbar{display:none}
 #mobile.home-v2 .guest-nav>a{flex:1 1 auto;min-width:max-content;justify-content:center;padding:0 7px;font-size:13px;scroll-snap-align:center}
 #mobile.home-v2 .hv-shots,#mobile.home-v2 .hv-shots-4{display:flex;max-width:none;gap:10px;margin-inline:-16px;padding:2px 16px 10px;overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;scroll-snap-type:x mandatory;scroll-padding-inline:16px;scrollbar-width:none}
 #mobile.home-v2 .hv-shots::-webkit-scrollbar{display:none}
 #mobile.home-v2 .hv-shots>.hv-shot{flex:0 0 42%;scroll-snap-align:start;border-radius:14px}
 #mobile.home-v2 .hv-shot>span{display:block}
}
/* Phone hero: the 230px phone A is 532px tall from --y:30px, but the stage was min(560px,125vw) = 487px at 390px wide, so the phone ran under the caption and up to the next section. The stage is as tall as the phones on phones. */
@media(max-width:720px){#mobile.home-v2 .hv-stage{height:572px}}
@media(max-width:380px){#mobile.home-v2 .hv-stage{height:508px}}
/* Tablets and landscape phones (721-1080px): the header kept the desktop grid instead of a second row, which took 121px of a 390px landscape screen; mark, tabs and the web-app link measure 663px at most. The left floating chip sat 46-72px outside the viewport there. */
@media(max-width:1080px) and (min-width:721px){#mobile.home-v2 .hv-float-1{left:8px}#mobile.home-v2 .hv-header{gap:12px}#mobile.home-v2 .hv-stage{height:740px}}
/* At those widths the 300px phone is 717px tall from its 60px offset while the stage was min(600px,110vw) = 600px: the phone ran under the caption and 67px into the next section. */
/* Desktop (1081px and up): the stage was clamp(520px,60vw,720px), under the 714px phone until 1200px wide, so the caption sat on the phone between 1081 and about 1190px. */
@media(min-width:1081px){#mobile.home-v2 .hv-stage{height:740px}}
/* OMNI-567 (Nick): party phones face each other with a yaw-only inward tilt: no x or z rotation, no scroll turn, no pointer tilt. Reduced motion keeps them flat. */
#mobile.home-v2 .hv-party .hv-figure{--fan:0deg;--ry:0deg;--ty:0deg;--tx:0deg;--tz:0deg;--yaw:0deg}
#mobile.home-v2 .hv-party .hv-figure .hv-device{transform:rotateY(var(--yaw))}
#mobile.home-v2 .hv-party .hv-figure:nth-child(1){--yaw:16deg}
#mobile.home-v2 .hv-party .hv-figure:nth-child(2){--yaw:7deg}
#mobile.home-v2 .hv-party .hv-figure:nth-child(3){--yaw:-7deg}
#mobile.home-v2 .hv-party .hv-figure:nth-child(4){--yaw:-16deg}
@media (max-width:900px){#mobile.home-v2 .hv-party .hv-figure:nth-child(odd){--yaw:12deg}#mobile.home-v2 .hv-party .hv-figure:nth-child(even){--yaw:-12deg}}
#mobile.home-v2[data-home-motion=reduced] .hv-party .hv-figure .hv-device{transform:none}
/* OMNI-355: the logo's dot grid sits behind the administrator sign-in card and the workspace too, the same 28px grid as the Home sky and the secondary pages, in both themes; high contrast and forced colours drop it. */
#login,#workspace{background-image:radial-gradient(circle,color-mix(in srgb,var(--ink) 11%,transparent) 1.1px,transparent 1.7px);background-size:28px 28px;background-position:14px 14px}
@media(prefers-contrast:more),(forced-colors:active){#login,#workspace{background-image:none}}
