body{margin:0}*{box-sizing:border-box}:root{--font-sans:system-ui,-apple-system,BlinkMacSystemFont,sans-serif}.jarvis {
  --j-bg: #f5f5f7;
  --j-white: #fff;
  --j-ink: #1d1d1f;
  --j-text: #303037;
  --j-muted: #72727d;
  --j-line: #e8e8ed;
  --j-wash: #eeeef2;
  --j-blue: #007aff;
  --j-blue-dark: #005ac1;
  --j-blue-soft: #e7f1ff;
  --j-purple: #7957df;
  --j-purple-soft: #eee7fc;
  --j-coral: #ef7652;
  --j-green: #23835b;
  --j-sage-bg: #e3efe5;
  --j-sage-ink: #346b50;
  --j-lilac-bg: #ede7fb;
  --j-lilac-ink: #7658ab;
  --j-peach-bg: #ffede1;
  --j-peach-ink: #af5a36;
  --j-sky-bg: #e1edff;
  --j-sky-ink: #406bb1;
  --j-glass: rgba(255, 255, 255, 0.78);
  --j-sidebar: rgba(244, 245, 249, 0.84);
  --j-overlay: rgba(36, 39, 58, 0.25);
  --j-highlight: rgba(255, 255, 255, 0.65);
  --j-shadow:
    0 5px 24px rgba(32, 36, 64, 0.045), 0 1px 3px rgba(32, 36, 64, 0.04);
  --j-hover-shadow: 0 20px 40px rgba(44, 40, 77, 0.12);
  --j-modal-shadow: 0 30px 100px rgba(40, 36, 65, 0.18);
  --j-feature: linear-gradient(118deg, #e9e5ff 0%, #eff0ff 47%, #f5e6f2 100%);
  --j-orb: conic-gradient(
    from 40deg,
    #82bbff,
    #9671ff,
    #f597e0,
    #f9aa83,
    #98d7ff,
    #82bbff
  );
  --j-icon-gradient: linear-gradient(150deg, #71a4ff, #6b6bed 52%, #a569e9);
  --j-faint-shadow: rgba(69, 44, 29, 0.12);
  --j-focus-ring: 0 0 0 4px rgba(0, 122, 255, 0.2);
  --j-font:
    -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text",
    Helvetica, Arial, sans-serif;
  --j-person: var(--j-sky-bg);
  --j-person-ink: var(--j-sky-ink);
}
.jarvis [data-tone="sage"] {
  --j-person: var(--j-sage-bg);
  --j-person-ink: var(--j-sage-ink);
}
.jarvis [data-tone="lilac"] {
  --j-person: var(--j-lilac-bg);
  --j-person-ink: var(--j-lilac-ink);
}
.jarvis [data-tone="peach"] {
  --j-person: var(--j-peach-bg);
  --j-person-ink: var(--j-peach-ink);
}
.jarvis [data-tone="blue"] {
  --j-person: var(--j-sky-bg);
  --j-person-ink: var(--j-sky-ink);
}
.jarvis {
  --sx-backdrop: #f5f7fa;
  --sx-surface: #ffffff;
  --sx-ink: #1a2533;
  --sx-muted: #7a8492;
  --sx-border: #e3e8ef;
  --sx-blue: #2368ef;
  --sx-violet: #7855de;
  --sx-soft-blue: #e8f0ff;
  --sx-soft-lilac: #efeafd;
  --sx-paper-shadow:
    0 35px 65px rgba(42, 53, 80, 0.18), 0 4px 12px rgba(42, 53, 80, 0.09);
  --sx-float-shadow: 0 22px 55px rgba(42, 53, 80, 0.15);
}
.jarvis {
  --ls-cloud: #f3f6fb;
  --ls-ink: #253044;
  --ls-blue: #3675eb;
  --ls-lilac: #b8a7ee;
  --ls-sage: #8bbca7;
  --ls-apricot: #f3b59c;
  --ls-muted: #728197;
  --ls-grid: #cbd7e8;
  --ls-island-blue: #e4efff;
  --ls-island-blue-deep: #cee0fa;
  --ls-island-lilac: #efebfc;
  --ls-island-lilac-deep: #dcd3f1;
  --ls-island-sage: #e5f2e8;
  --ls-island-sage-deep: #cbe3d3;
  --ls-shadow-color: #55718c;
  --ls-glass: rgba(255, 255, 255, 0.72);
  --ls-soft-glass: rgba(255, 255, 255, 0.4);
  --ls-stroke: rgba(255, 255, 255, 0.92);
  --ls-card-shadow:
    0 14px 40px rgba(48, 74, 110, 0.055), 0 2px 5px rgba(48, 74, 110, 0.035);
  --ls-drawer-shadow: -20px 0 90px rgba(48, 74, 110, 0.16);
  --ls-curtain: rgba(80, 99, 131, 0.13);
}

.access-space { display: block; min-height: 100svh; color: var(--ls-ink); background: var(--ls-cloud); padding: 36px 5vw; font-family: var(--font-sans); overflow: hidden; }
.access-brand { display: flex; align-items: center; gap: 12px; font-size: 13px; font-weight: 650; }
.access-brand > span { display: grid; place-content: center; width: 40px; height: 40px; background: var(--ls-ink); color: var(--sx-surface); border-radius: 14px; font-size: 20px; }
.access-brand sub { display: contents; font-size: 11px; }
.access-composition { max-width: 1180px; margin: 9vh auto 0; display: grid; grid-template-columns: 1.1fr 1fr; gap: 9vw; align-items: center; }
.access-eyebrow { font-size: 11px; text-transform: uppercase; letter-spacing: .18em; color: var(--ls-muted); }
.access-intro h1 { font-size: clamp(38px, 4.8vw, 68px); line-height: 1.08; letter-spacing: -.06em; margin: 25px 0; font-weight: 520; }
.access-intro h1 span { display: block; }
.access-intro > p { color: var(--ls-muted); max-width: 340px; font-size: 17px; line-height: 1.65; }
.access-orbits { position: relative; width: 300px; height: 210px; margin: 32px 0 0; isolation: isolate; }
.access-orbits > i { position: absolute; width: 150px; height: 150px; border-radius: 50%; box-shadow: var(--ls-card-shadow); border: 1px solid var(--ls-stroke); animation: access-float 8s ease-in-out infinite; }
.access-orbits > i:nth-child(1) { left: 0; top: 38px; background: var(--ls-island-blue-deep); }
.access-orbits > i:nth-child(2) { left: 78px; top: 0; background: var(--ls-island-lilac-deep); animation-delay: -2s; }
.access-orbits > i:nth-child(3) { left: 143px; top: 49px; background: var(--ls-island-sage-deep); animation-delay: -4s; }
.access-orbits > span { position: absolute; left: 98px; top: 77px; font-size: 53px; letter-spacing: -.06em; }
.access-orbits sub { font-size: 24px; }
.access-panel { background: var(--ls-glass); border: 1px solid var(--ls-stroke); border-radius: 32px; padding: 44px; box-shadow: var(--ls-card-shadow); backdrop-filter: blur(24px); }
.access-dot { display: block; height: 9px; width: 9px; background: var(--ls-sage); border-radius: 50%; margin-bottom: 28px; }
.access-panel h2 { font-size: 29px; font-weight: 550; letter-spacing: -.045em; margin: 0 0 12px; }
.access-subtitle { color: var(--ls-muted); font-size: 14px; line-height: 1.6; overflow-wrap: anywhere; }
.access-panel form { margin-top: 30px; display: grid; gap: 21px; }
.access-panel label { display: grid; gap: 9px; font-size: 12px; font-weight: 600; }
.access-panel input { width: 100%; min-width: 0; box-sizing: border-box; border: 1px solid var(--sx-border); background: var(--sx-surface); border-radius: 12px; min-height: 48px; padding: 12px 14px; font: inherit; font-size: 16px; color: var(--ls-ink); }
.access-panel input:focus { outline: 2px solid var(--ls-blue); outline-offset: 3px; }
.access-panel form > button { margin-top: 5px; border: 0; border-radius: 13px; padding: 16px 18px; font: inherit; font-size: 14px; font-weight: 600; color: var(--sx-surface); background: var(--ls-ink); display: flex; justify-content: space-between; cursor: pointer; }
.access-panel button:disabled { opacity: .6; cursor: wait; }
.access-privacy, .access-panel small { color: var(--ls-muted); font-size: 11px; line-height: 1.7; }
.access-privacy { margin-top: 30px; padding-top: 23px; border-top: 1px solid var(--sx-border); }
.access-message { font-size: 13px; line-height: 1.6; margin: 0; color: var(--j-peach-ink); }
.access-message[data-success="true"] { color: var(--j-sage-ink); }
.access-actions { display: flex; justify-content: space-between; gap: 15px; margin-top: 24px; font-size: 12px; }
.access-actions button { background: none; padding: 0; border: 0; font: inherit; color: inherit; cursor: pointer; }
.access-actions a { color: inherit; }
.ls-account-link { font-size: 12px; color: var(--ls-ink); text-decoration: none; white-space: nowrap; margin-left: 14px; }
@keyframes access-float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@media (max-width: 760px) { .access-space { padding: 23px 20px 40px; } .access-composition { grid-template-columns: 1fr; margin-top: 38px; gap: 26px; } .access-intro h1 { font-size: 38px; margin: 15px 0; } .access-intro > p { font-size: 14px; } .access-orbits { display: none; } .access-panel { padding: 29px 25px; border-radius: 24px; } .access-dot { margin-bottom: 18px; } .ls-account-link { font-size: 10px; margin-left: 0; } }
@media (prefers-reduced-motion: reduce) { .access-orbits > i { animation: none; } }