@font-face { font-family:Inter; font-style:normal; font-weight:100 900; font-display:swap; src:url('/fonts/InterVariable.woff2') format('woff2'); }
:root { color-scheme:dark; --ink:#08090b; --surface:#111319; --text:#f2f0eb; --muted:#aaa8b3; --line:#ffffff1a; --action:#6c4df2; --soft:#c8bcff; --body:Rubik,system-ui,sans-serif; }
* { box-sizing:border-box; } [hidden] { display:none !important; }
body { margin:0; background:var(--ink); color:var(--text); font:15px/1.6 var(--body); }
button,input,select { font:inherit; color:inherit; } button,a,input,select { -webkit-tap-highlight-color:transparent; }
button,.button { display:inline-flex; align-items:center; justify-content:center; min-height:44px; padding:10px 18px; border:1px solid var(--line); border-radius:9px; background:transparent; color:var(--text); cursor:pointer; font-weight:650; text-decoration:none; }
button:hover,.button:hover { background:#1d1c26; } button:disabled { opacity:.55; cursor:not-allowed; }
.primary { background:var(--action); border-color:var(--action); color:white; } .primary:hover { background:#7b5ff4; }
a { color:var(--soft); text-underline-offset:4px; }
:focus-visible { outline:3px solid var(--soft); outline-offset:4px; } ::selection { background:#604baa; color:#fff; }
.portal-header { height:86px; max-width:1360px; margin:auto; padding:20px 40px; display:flex; align-items:center; gap:24px; border-bottom:1px solid var(--line); }
.portal-header > a:not(.portal-brand) { margin-left:auto; color:var(--muted); font-size:13px; text-decoration:none; }
.portal-brand { display:flex; align-items:center; gap:10px; text-decoration:none; color:var(--text); font-weight:750; font-size:22px; }
.portal-brand img { width:34px; height:34px; }.portal-brand span { display:flex; align-items:center; gap:9px; }.portal-brand small { position:relative; top:2px; font:650 10px/1.2 Manrope,sans-serif; padding:5px 7px; border:1px solid #7c5cff60; border-radius:5px; color:var(--soft); }
main { max-width:1360px; margin:auto; padding:0 40px; min-height:calc(100vh - 175px); }
h1,h2,p { margin-top:0; } h1 { font-size:clamp(30px,3.5vw,48px); line-height:1.18; letter-spacing:-.035em; font-weight:650; } h1 em { color:var(--soft); font-style:normal; } h2 { font-size:23px; line-height:1.3; letter-spacing:-.02em; }
.guest-layout { padding:38px 0 44px; display:grid; grid-template-columns:minmax(0,1.3fr) minmax(340px,.85fr); gap:72px; align-items:start; }
.guest-story h1 { font-size:clamp(36px,4.2vw,58px); }.guest-story > p { max-width:47ch; color:var(--muted); font-size:17px; }
.guest-story dl { margin:24px 0 20px; display:flex; gap:50px; }.guest-story dt { font-size:24px; font-weight:700; }.guest-story dd { max-width:23ch; margin:8px 0 0; color:var(--muted); font-size:13px; }
.quiet,small { color:var(--muted); font-size:13px; }.guest-story .quiet { font-size:13px; }
.auth-box { padding:28px; background:var(--surface); border-radius:14px; }.auth-tabs { display:flex; gap:8px; margin-bottom:18px; border-bottom:1px solid var(--line); padding-bottom:18px; }.auth-tabs button { flex:1; border:0; }.auth-tabs button[aria-pressed=true] { background:#2b2444; color:var(--soft); }
.auth-form,.profile-form { display:grid; gap:14px; }.auth-form h2 { margin-bottom:0; }.auth-form p { margin-bottom:0; }.auth-form label,.profile-form label { display:grid; gap:8px; font-size:13px; font-weight:600; }
input,select { width:100%; min-height:46px; padding:10px 12px; background:#08090b; border:1px solid #ffffff29; border-radius:8px; font-size:15px; }input[readonly] { color:var(--muted); }
.auth-form small { margin-top:-12px; }.invite-link { border:0; color:var(--soft); padding-inline:0; font-size:13px; margin-top:14px; }
.message { color:#f4b5af; font-size:14px; }.message:empty { display:none; }.auth-box .message { margin:18px 0 0; }
.cabinet-layout { display:grid; grid-template-columns:235px minmax(0,1fr); min-height:700px; }.account-nav { border-right:1px solid var(--line); padding:36px 22px 36px 0; }.account-person { display:flex; align-items:center; gap:10px; margin-bottom:36px; }.account-person > span { width:38px; height:38px; display:grid; place-items:center; background:#29213f; color:var(--soft); border-radius:10px; font-weight:700; }.account-person > div { min-width:0; display:grid; }.account-person strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:14px; }.account-person small { overflow:hidden; text-overflow:ellipsis; font-size:11px; }.account-nav nav { display:grid; gap:6px; }.account-nav button,.account-nav nav a { border:0; text-align:left; justify-content:flex-start; color:var(--muted); font-size:14px; }.account-nav button[aria-current=page] { color:var(--soft); background:#221c33; }.account-nav nav a { padding:12px 18px; text-decoration:none; }
.account-content { min-width:0; padding:42px 0 54px 48px; }.account-content h1 { font-size:34px; margin-bottom:10px; }.intro { color:var(--muted); margin-bottom:32px; }
.product-row { padding:26px 0; border-block:1px solid var(--line); display:grid; grid-template-columns:1fr auto; gap:16px; align-items:center; }.product-row h2 { margin-bottom:6px; }.product-row p { margin-bottom:0; color:var(--muted); }.product-state { color:var(--soft); font-size:13px; }.product-row dl { display:flex; gap:32px; margin:18px 0 0; }.product-row dt { font-size:12px; color:var(--muted); }.product-row dd { margin:4px 0 0; font-variant-numeric:tabular-nums; }.account-next { margin-top:42px; }.account-next p { max-width:58ch; color:var(--muted); }.account-next .quiet { margin-top:12px; }
.device-row { padding:20px 0; display:flex; align-items:center; justify-content:space-between; gap:18px; border-bottom:1px solid var(--line); }.device-row h2 { font-size:16px; margin-bottom:4px; }.device-row p { font-size:12px; color:var(--muted); margin:0; }.device-row button { font-size:13px; }.empty-state { padding:36px 0; color:var(--muted); }.profile-form { max-width:430px; margin-bottom:32px; }footer { max-width:1280px; margin:auto; padding:28px 0; border-top:1px solid var(--line); display:flex; justify-content:space-between; color:var(--muted); font-size:12px; }.initial-state { padding:60px 0; color:var(--muted); }
@media(max-width:1000px) { .guest-layout { gap:40px; }.guest-story dl { gap:24px; }.cabinet-layout { grid-template-columns:190px minmax(0,1fr); }.account-content { padding-left:28px; } }
@media(max-width:720px) { .portal-header { padding:16px 20px; height:74px; gap:14px; }main { padding:0 20px; }.guest-layout { grid-template-columns:1fr; padding:36px 0; gap:30px; }.guest-story h1 { font-size:38px; }.guest-story dl { margin:24px 0; }.auth-box { padding:22px; }.cabinet-layout { display:block; min-height:0; }.account-nav { border-right:0; border-bottom:1px solid var(--line); padding:22px 0 12px; }.account-person { margin-bottom:18px; }.account-nav nav { display:flex; overflow:auto; }.account-nav button,.account-nav nav a { white-space:nowrap; flex-shrink:0; padding:10px 12px; }.account-content { padding:28px 0 40px; }.account-content h1 { font-size:30px; }.product-row { grid-template-columns:1fr; }.product-row .button { justify-self:start; }.device-row { align-items:flex-start; }.device-row button { padding:8px 12px; }footer { margin:0 20px; }.portal-header #logout { padding:8px 10px; }.portal-header > a:not(.portal-brand) { font-size:12px; }.portal-brand { font-size:19px; }.portal-brand small { font-size:8px; }.portal-brand img { width:30px;height:30px; } }
/* Match the public site's quieter typography; put the form first on phones. */
h1,h2,.guest-story dt,.portal-brand { font-weight:550; }
button,.button { font-weight:500; }
.portal-brand small { top:0; display:inline-grid; place-items:center; padding:0 7px; height:22px; font:500 9px/1 var(--body); }
.portal-brand small { transform:translateY(2px); }
.portal-brand small > span { display:block; transform:translateY(.5px); }
.back-to-site { gap:9px; padding:8px 14px; }
.back-to-site > span { font-size:18px; }
.guest-story h1 { letter-spacing:-.045em; }
.auth-box { border:1px solid var(--line); }
.auth-form label,.profile-form label { font-weight:500; }
.guest-layout { position:relative; isolation:isolate; min-height:0; }
.guest-story,.auth-box { position:relative; z-index:1; }
.guest-story { text-shadow:0 2px 16px #08090b; }
.auth-scene { position:relative; z-index:0; left:-14%; width:128%; aspect-ratio:16/9; margin-top:-28px; pointer-events:none; overflow:hidden; }
.auth-scene img,.auth-scene video { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; transform:scaleX(-1); opacity:.82; }
.auth-scene video { opacity:0; transition:opacity 1s; }
.auth-scene.is-playing video { opacity:.6; }
.auth-scene::after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#08090b,transparent 28%,transparent 78%,#08090b),linear-gradient(90deg,#08090b,transparent 18%,transparent 65%,#08090b); }
.auth-help { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:0 12px; margin-top:14px; padding-top:12px; border-top:1px solid var(--line); font-size:11px; color:var(--muted); }
.auth-help a { width:fit-content; min-height:36px; display:flex; align-items:center; }
.auth-help { align-items:baseline; }
.auth-help a { min-height:24px;display:inline; }
@media(min-width:721px) {
  .guest-layout { padding:24px 0 16px; }
  .guest-story h1 { font-size:clamp(36px,3.7vw,50px);margin-bottom:22px; }
  .guest-story > p { font-size:15px;margin-bottom:18px; }
  .guest-story dl { margin:18px 0 16px; }
  .guest-story dd { margin-top:4px; }
  .guest-story > .quiet { display:none; }
  .auth-scene { width:128%;height:260px;aspect-ratio:auto;margin-top:-8px; }
  .auth-scene img { height:auto;top:-80px;left:-28%;object-fit:cover;transform:none; }
  .auth-box { padding:24px; }
  .auth-tabs { margin-bottom:16px;padding-bottom:14px; }
  .auth-form { gap:12px; }
  .auth-form h2 { font-size:21px; }
  .invite-link { margin-top:8px; }
  footer { padding:14px 0; }
}
.google-entry > button { width:100%; gap:12px; background:#18191e; border-color:#ffffff40; font-weight:500; }
.google-entry svg { width:18px; height:18px; flex-shrink:0; }.google-entry > p { font-size:11px; margin:10px 0 0; }
.auth-divider { display:flex; align-items:center; gap:12px; color:var(--muted); font-size:11px; margin:15px 0; }.auth-divider::before,.auth-divider::after { content:''; flex:1; height:1px; background:var(--line); }
.google-profile { max-width:500px; padding:26px 0; margin-bottom:25px; border-block:1px solid var(--line); }.google-profile h2 { font-size:18px; margin-bottom:10px; }
@media(max-width:1000px) { .auth-scene { left:-15%; width:120%; } }
@media(max-width:720px) { .auth-scene { display:none; }.guest-layout { min-height:0; } }
@media(max-width:720px) { .guest-story { display:none; }.guest-layout { padding:28px 0 40px; }.auth-box { padding:22px 18px; }.auth-form h2 { font-size:23px; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto !important; transition:none !important; animation:none !important; } }
