/* Liquid glass is reserved for the navigation. All other surfaces are matte. */
:root { color-scheme:dark; --paper:#071022; --ink:#eff5ff; --muted:#b2c3de; --line:#b9d4ff30; --dark:#080f20; --accent:#9fc8ff; --radius:12px; }
html { scroll-padding-top:120px; background:var(--paper); }
body { isolation:isolate; background:#071022; }
body::before { content:''; position:fixed; inset:0; z-index:-1; pointer-events:none; }
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible { outline:3px solid #b6d8ff; outline-offset:5px; }
.preview { background:#0a1323; color:#b8cbea; border-bottom:1px solid #b4d7ff19; }
.nav { position:sticky; top:16px; z-index:30; height:82px; min-height:82px; margin-top:22px; padding-inline:28px; border-radius:999px; }
.brand { color:#f5f8ff; }.brand img { filter:brightness(0) invert(1); }.nav nav { color:#dfebff; }
.button,.link-button { border-radius:12px; box-shadow:none; text-shadow:none; transition:background .2s,border-color .2s,transform .2s; }
.button { min-height:52px; padding-inline:24px; font-weight:600; }
.primary,.light { background:#b9d3f7; border:1px solid #b9d3f7; color:#10213b; }
.primary:hover,.light:hover { background:#d1e3fc; border-color:#d1e3fc; transform:translateY(-1px); }
.secondary { background:#182a45; border:1px solid #7794bc66; color:#edf4ff; }
.secondary:hover { background:#233b5d; border-color:#99b8e5; transform:translateY(-1px); }
.link-button { min-height:42px; padding:10px 14px; background:#192b44; color:#dceaff; border:1px solid #879fc433; }
.link-button:hover { background:#263c59; color:#fff; border-color:#9eb9e866; }
.text-link { color:#d1e5ff; }.auth-links { gap:10px; }
.hero h1 { font-weight:450; } h1 em,h2 em { color:#aacdff; }.eyebrow { color:#a5c9ff; }.hero-description { color:#b7c8e3; }
.hero-visual { position:relative; border-radius:30px; overflow:hidden; padding:27px; border:1px solid #b4d4ff33; }
.drawing-head { color:#cee1ff; border-color:#b4d4ff33; }.architecture { filter:invert(1) hue-rotate(175deg); opacity:.6; mix-blend-mode:screen; }
.drawing-caption { display:flex; justify-content:space-between; align-items:center; border:0; border-top:1px solid #adc8eb33; border-radius:0; width:100%; margin-top:0; padding:20px 0 0; gap:18px; font-weight:500; background:none; box-shadow:none; text-shadow:none; }
.circle-arrow { flex-shrink:0; border:0; color:#c9ddfb; }.drawing-note { color:#a9bedc; text-align:left; margin-top:18px; }
.product,.auth-panel,.dashboard,.release-panel { background:#142238; border:1px solid #6b87ae40; border-radius:24px; box-shadow:0 18px 40px #0002; }
.status-pill { color:#d4e6ff; border-color:#bdd8ff40; background:#1b2d47; }
.workflow { background:#0b1628; color:var(--ink); }.workflow-steps article { border-color:#a8cbff33; }
.plan-card { border-radius:16px; background:#1b2e49; border:1px solid #bad8ff33; }
.field input,.field select { border-radius:12px; border-color:#a8c9ff55; background:#0c182b; }
.field input::placeholder { color:#a9bbd7; }.field select option { background:#101e38; color:#eff5ff; }
.form-message.error { color:#ffb6b1; }.signed-in { background:#253d60; }
.button:disabled { background:#19263a; color:#a9b7ce; border-color:#8197b233; box-shadow:none; transform:none; }
.skip { color:#071022; }
@media(max-width:760px) { .nav { top:10px; }.hero-visual { padding:22px; border-radius:24px; }.dashboard-actions { gap:12px; }.release-panel button { white-space:normal; } }
@media(prefers-reduced-motion:reduce) { .button,.link-button { transition:none; transform:none; } }
@media(forced-colors:active) {
  body::before { display:none; }
  .nav,.button,.link-button,.drawing-caption,.auth-panel,.dashboard,.release-panel { background:Canvas; color:CanvasText; border:1px solid CanvasText; box-shadow:none; text-shadow:none; }
  .button:disabled { color:GrayText; border-color:GrayText; }
}