/* Deliberate hierarchy: page context recedes, the active surface comes forward. */
:root { --motion-ease:cubic-bezier(.22,.8,.25,1); scrollbar-gutter:stable; }
:root { --radius-panel:24px; --radius-control:12px; --radius-small:16px; }
body.landing .lp-product-card,body.landing .lp-tour,body.landing .lp-status-card,body.landing .lp-final-cta,body.app-page .auth-card,body.app-page .surface,body.app-page .stat-card,body.app-page .model-card { border-radius:var(--radius-panel); }
body.landing .lp-float-tag,body.landing .lp-access-step,body.landing .lp-preview-tabs,body.app-page .key-row,body.app-page .code-row { border-radius:var(--radius-small); }
body.landing .lp-button,body.app-page .button,body.app-page .small-button,body.app-page .top-button,body.app-page .form-field input,body.app-page .form-field select { border-radius:var(--radius-control); }
html:has(body.landing) { overflow-x:clip; }
html.lenis,html.lenis body { height:auto; }
.lenis.lenis-smooth { scroll-behavior:auto !important; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior:contain; }
.lenis.lenis-stopped { overflow:clip; }
.lenis.lenis-smooth iframe { pointer-events:none; }
.xinix-site-surface { transform-origin:35% 40%; }
body.app-page .auth-card,body.app-page .app-main,body.app-page .app-topbar { animation:none; }
.account-drawer { position:fixed; inset:0; width:100%; height:100%; max-width:none; max-height:none; padding:0; margin:0; border:0; overflow:hidden; background:transparent; color:var(--ink); }
.account-drawer::backdrop { background:transparent; }
.drawer-backdrop { position:absolute; inset:0; width:100%; height:100%; border:0; border-radius:0; padding:0; background:rgba(10,25,17,.32); cursor:pointer; }
.drawer-panel { position:absolute; inset:0 0 0 auto; width:min(540px,100%); height:100%; background:var(--bg); border-left:1px solid var(--line); box-shadow:-24px 0 80px -28px rgba(8,22,16,.25); display:flex; flex-direction:column; overflow:hidden; }
.drawer-top { display:flex; flex-shrink:0; align-items:center; justify-content:space-between; gap:16px; padding:24px 34px; border-bottom:1px solid var(--line); }
.drawer-close { width:38px; height:38px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; background:var(--card); color:var(--ink); cursor:pointer; }
.drawer-close svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.5; }
.drawer-content { position:relative; flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; padding:30px 34px 24px; scrollbar-width:thin; }
body.app-page .drawer-panel .auth-layout { display:block; width:100%; margin:0; }
.drawer-panel .auth-story { display:none; }
body.app-page .drawer-panel .auth-card { border:0; background:none; box-shadow:none; padding:0; border-radius:0; }
body.app-page .drawer-panel .auth-card h1 { font-size:44px; margin:0 0 16px; }
body.app-page .drawer-panel .auth-card > p { font-size:12px; }
.drawer-bottom { flex-shrink:0; display:flex; align-items:center; justify-content:space-between; padding:16px 34px; border-top:1px solid var(--line); color:var(--muted); font:10px var(--sans); }
.drawer-bottom a { color:var(--green); }
.drawer-panel :focus-visible { outline:2px solid var(--green); outline-offset:3px; }
body.landing .lp-faq details[open] > p { animation:none; }
body.landing .lp-faq details > p { padding-bottom:22px; margin-bottom:0; }
.lp-button,.button,.small-button,.top-button,.drawer-close,.lp-theme-toggle,.app-theme-toggle { transition:transform 220ms var(--motion-ease),background-color 220ms,border-color 220ms; }
.lp-button:active,.button:active,.small-button:active,.top-button:active,.drawer-close:active { transform:scale(.975) !important; }
.lp-theme-toggle:active,.app-theme-toggle:active { transform:rotate(-20deg) scale(.92); }
.landing.js-motion [data-reveal],.landing.js-motion [data-reveal].is-visible { opacity:1; transform:none; transition:none; }
@supports (animation-timeline:view()) {
    html[data-motion=full] .landing .lp-section-heading,html[data-motion=full] .landing .lp-feature-content,html[data-motion=full] .landing .lp-access-copy,html[data-motion=full] .landing .lp-access-step,html[data-motion=full] .landing .lp-tour-copy,html[data-motion=full] .landing .lp-faq > div,html[data-motion=full] .landing .lp-status-card {
      animation:spatial-scroll linear both;
      animation-duration:auto !important;
      animation-timeline:view(); animation-range:entry 0% cover 36%;
    }
    @keyframes spatial-scroll { from { translate:0 42px; } to { translate:0 0; } }
    html[data-motion=full] .landing .lp-feature-content { animation-name:feature-content-scroll; }
    @keyframes feature-content-scroll { from { translate:0 18px; } to { translate:0 0; } }
    html[data-motion=full] .landing .lp-tour-visual { animation:tour-depth linear both; animation-duration:auto !important; animation-timeline:view(); animation-range:entry 0% cover 60%; }
    @keyframes tour-depth { from { transform:translateY(25px) rotate(-4deg) scale(.94); } to { transform:none; } }
    html[data-motion=full] .landing .lp-journey { view-timeline-name:--journey; view-timeline-axis:block; }
    html[data-motion=full] .landing .lp-journey-line span { width:100%; height:100%; transform-origin:left top; transition:none; animation:journey-flow linear both; animation-duration:auto !important; animation-timeline:--journey; animation-range:entry 20% cover 55%; }
    @keyframes journey-flow { from { transform:scaleX(0); } to { transform:scaleX(1); } }
    @media(max-width:760px) { html[data-motion=full] .landing .lp-journey-line span { animation-name:journey-flow-vertical; } @keyframes journey-flow-vertical { from { transform:scaleY(0); } to { transform:scaleY(1); } } }
}
body.landing .lp-orbit,body.landing .lp-float { animation:none; }
::view-transition-old(root),::view-transition-new(root) { animation:none; mix-blend-mode:normal; }
::view-transition-old(root) { z-index:1; }::view-transition-new(root) { z-index:2; }
::view-transition-group(root) { animation:none; }
::view-transition { pointer-events:none; }
/* Apply the palette once before the snapshots animate. Repainting individual
   text, borders and glass colors throughout the reveal caused mobile stutter. */
html[data-theme-changing] body,html[data-theme-changing] body *,html[data-theme-changing] body *::before,html[data-theme-changing] body *::after { transition:none !important; }
.lp-hero-art { transform-style:preserve-3d; }
body.landing .lp-product-card,body.landing .lp-float-tag { transition:none; animation:none; }
/* Rasterize the glow once; animate only a small composited halo, not a new
   box-shadow every frame. The original static light and shadow stay intact. */
body.landing .lp-live-indicator,body.landing .lp-status-dot.is-online { position:relative; animation:none; }
html[data-motion=full] body.landing .lp-live-indicator::after,html[data-motion=full] body.landing .lp-status-dot.is-online::after { content:''; position:absolute; inset:-6px; border-radius:50%; background:#8aa76f; pointer-events:none; animation:composited-halo 3s ease-in-out infinite; }
html[data-motion=full] body.landing .lp-status-dot.is-online::after { inset:-8px; background:#6d9b63; animation-duration:2.6s; }
@keyframes composited-halo { 0%,100% { transform:scale(.4); opacity:0; } 50% { transform:scale(1); opacity:.12; } }
body.landing .lp-live-indicator:not(.is-motion-visible)::after,body.landing .lp-status-dot:not(.is-motion-visible)::after,body.landing .lp-tour-visual .signal:not(.is-motion-visible) { animation-play-state:paused; }
.lp-preview-tabs { position:relative; isolation:isolate; }
.lp-preview-indicator { position:absolute; top:4px; left:0; border-radius:4px; background:color-mix(in srgb,var(--lp-green) 13%,transparent); z-index:-1; pointer-events:none; }
body.landing .lp-preview-tabs button[aria-pressed=true] { background:transparent; color:var(--lp-green); }
body.landing .lp-product-card[data-preview] .lp-product-row { opacity:1; }
.lp-product-row { position:relative; }
.lp-product-row.is-preview { background:color-mix(in srgb,var(--lp-green) 6%,transparent); border-radius:8px; }
body.landing .lp-product-row.is-preview .lp-row-glyph { transform:rotate(-8deg) scale(1.08); }
.lp-row-glyph { transition:transform 600ms var(--motion-ease); }
/* Each card owns its bounds; moving one card must not cover its neighbour. */
body.landing .lp-feature-grid { grid-template-columns:repeat(3,minmax(0,1fr)); overflow:hidden; border-radius:var(--radius-panel); }
body.landing .lp-feature,body.landing .lp-feature + .lp-feature { min-width:0; min-height:370px; margin:0; padding:34px 29px; overflow:clip; isolation:isolate; border-radius:0; transform:none; translate:none; box-shadow:none; display:flex; }
body.landing .lp-feature:hover { transform:none; translate:none; box-shadow:none; }
body.landing .lp-feature-content { display:flex; flex-direction:column; flex:1; min-width:0; }
body.landing .lp-feature-content h3 { margin:25px 0 12px; }
body.landing .lp-feature-content p { margin:0; }
body.landing .lp-feature-content > a { position:static; display:inline-flex; align-items:center; gap:10px; align-self:flex-start; margin-top:auto; padding-top:24px; color:var(--lp-green); font-size:12px; font-weight:650; }
body.landing .lp-feature-content > a span { transition:transform .4s; }
body.landing .lp-feature-content > a:hover span { transform:translate(2px,-2px); }
@media(max-width:760px) {
  body.landing .lp-feature-grid { grid-template-columns:1fr; }
  body.landing .lp-feature,body.landing .lp-feature + .lp-feature { min-height:0; padding:28px 24px; border-left:0; }
  body.landing .lp-feature + .lp-feature { border-top:1px solid var(--lp-line); }
  body.landing .lp-feature-content > a { margin-top:0; }
}
.drawer-panel [data-motion-ghost] { user-select:none; }
.app-nav { position:relative; isolation:isolate; }
.dashboard-nav-cursor { position:absolute; inset:0 0 auto; border-radius:7px; background:color-mix(in srgb,var(--green) 10%,transparent); z-index:-1; pointer-events:none; }
body.app-page .app-nav a.is-active { background:transparent; }
.lp-motion-toggle,.app-motion-toggle { display:grid; place-items:center; flex-shrink:0; width:36px; height:36px; padding:8px; border:1px solid var(--lp-line,var(--line)); border-radius:50%; background:transparent; color:var(--lp-ink,var(--ink)); cursor:pointer; }
.lp-motion-toggle svg,.app-motion-toggle svg { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.lp-motion-toggle[aria-pressed=true],.app-motion-toggle[aria-pressed=true] { color:var(--lp-green,var(--green)); background:color-mix(in srgb,var(--lp-green,var(--green)) 10%,transparent); }
html[data-motion=full] .lp-button:hover,html[data-motion=full] .button:hover { transform:translateY(-3px) !important; }
html[data-motion=full] .lp-orbit,html[data-motion=full] .lp-float-tag { animation:none !important; }
@media (prefers-reduced-motion:reduce) {
  html[data-motion=full] body,html[data-motion=full] body *,html[data-motion=full] body *::before,html[data-motion=full] body *::after { transition-duration:400ms !important; }
  html[data-motion=full] body .lp-product-card,html[data-motion=full] body .lp-float-tag { transition:none !important; }
}
html[data-motion=reduced] *,html[data-motion=reduced] *::before,html[data-motion=reduced] *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; transition-duration:.01ms !important; }
html[data-motion=reduced] ::view-transition-group(*),html[data-motion=reduced] ::view-transition-old(*),html[data-motion=reduced] ::view-transition-new(*) { animation:none !important; }
@media (max-width:600px) {
  :root { scrollbar-gutter:auto; }
  .drawer-panel { width:100%; border-left:0; }
  .drawer-top { padding:18px 24px; }
  .drawer-content { padding:26px 24px; }
  .drawer-bottom { padding:16px 24px max(16px,env(safe-area-inset-bottom)); }
  body.app-page .drawer-panel .auth-card h1 { font-size:38px; }
}
@media (max-width:700px) {
  .lp-motion-toggle { position:absolute; top:13px; right:66px; }
}

html[data-theme-changing] body * { animation-play-state:paused !important; }
/* More air and softer edges, preserving the green/ivory identity. */
body.landing .lp-hero { grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
body.landing .lp-hero-copy,body.landing .lp-hero-art { min-width:0; }
body.landing .lp-hero h1 { text-wrap:balance; }
body.landing .lp-feature-grid { border:1px solid var(--lp-line); background:linear-gradient(145deg,color-mix(in srgb,var(--lp-card) 85%,transparent),var(--lp-surface)); }
body.landing .lp-feature-symbol { border-radius:16px; }
body.landing .lp-section-summary,body.landing .lp-feature p { text-wrap:pretty; }
body.landing .lp-status-card { box-shadow:0 12px 36px -28px rgba(10,30,20,.22); }
body.landing .lp-kicker-line { background:linear-gradient(90deg,var(--lp-green),transparent); }
body.landing .lp-feature-content > a { min-height:44px; }
@media(max-width:700px) {
  body.landing .lp-hero { grid-template-columns:minmax(0,1fr); }
  body.landing .lp-hero h1 { font-size:clamp(48px,13.2vw,86px); letter-spacing:-.055em; }
  body.landing .lp-actions { flex-wrap:wrap; }
}


::view-transition-group(root) { isolation:isolate; }
html[data-theme-changing] .lp-hero-art { pointer-events:none; }

/* Corner water: one captured texture carries both irregular quarter-ripples. */
.xinix-water-ripple { position:fixed; width:512px; height:512px; pointer-events:none; contain:strict; }
.xinix-water-ripple canvas { display:block; width:100%; height:100%; }
::view-transition-group(water-corner) { z-index:4; animation:none; }
::view-transition-image-pair(water-corner) { overflow:visible; }
::view-transition-old(water-corner) { display:none; }
::view-transition-new(water-corner) { animation:none; mix-blend-mode:normal; transform-origin:100% 0; }
