:root { --bg:#07090d; --ink:#e8edf2; --dim:#9aa5b3; --teal:#3fd8c8; --line:rgba(255,255,255,.12); }
* { box-sizing:border-box; margin:0; }
html, body { height:100%; }
body { background:var(--bg); color:var(--ink); font:16px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; }

.scene { position:relative; min-height:100vh; min-height:100dvh; display:flex; align-items:center; justify-content:center;
         padding:32px 16px; background:var(--bg) url(/hero.webp) center 35%/cover no-repeat; }
.scene::before { content:""; position:absolute; inset:0; background:radial-gradient(ellipse at center, rgba(7,9,13,.35) 0%, rgba(7,9,13,.8) 70%, rgba(7,9,13,.92) 100%); }
.home .scene::before { background:rgba(7,9,13,.82); }
.center { position:relative; z-index:1; width:100%; max-width:520px; text-align:center; display:flex; flex-direction:column; align-items:center; gap:28px; }

.quote p { font-size:clamp(1.6rem,6vw,2.6rem); line-height:1.2; font-weight:700; letter-spacing:.01em; text-shadow:0 2px 18px rgba(0,0,0,.6); }
.quote cite { display:block; margin-top:12px; color:var(--teal); font-style:normal; letter-spacing:.12em; text-transform:uppercase; font-size:.85rem; }

.btn { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 40px; border-radius:999px;
       text-decoration:none; font-weight:700; letter-spacing:.14em; text-transform:uppercase; font-size:.95rem; }
.btn.primary { background:var(--teal); color:#05201d; box-shadow:0 0 0 0 rgba(63,216,200,.5); transition:box-shadow .2s, transform .2s; }
.btn.primary:hover, .btn.primary:focus-visible { box-shadow:0 0 0 6px rgba(63,216,200,.25); outline:none; transform:translateY(-1px); }

h1 { font-size:clamp(2rem,7vw,3rem); font-weight:800; letter-spacing:.02em; line-height:1.1; }
h1 span { color:var(--teal); }
.apps { width:100%; display:grid; gap:12px; }
.app { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:64px; padding:16px 20px; border-radius:14px;
       border:1px solid var(--line); background:rgba(255,255,255,.05); color:var(--ink); text-decoration:none; text-align:left; }
.app-name { font-size:1.2rem; font-weight:700; }
.app-sub { color:var(--teal); font-weight:600; font-size:.95rem; white-space:nowrap; }
a.app:hover, a.app:focus-visible { border-color:var(--teal); background:rgba(63,216,200,.08); outline:none; }
.app.soon { opacity:.55; cursor:default; }
.app.soon .app-sub { color:var(--dim); font-weight:500; }
.signout { color:var(--dim); font-size:.9rem; text-decoration:underline; text-underline-offset:3px; min-height:44px; display:inline-flex; align-items:center; }
.signout:hover { color:var(--ink); }
.note { color:var(--dim); max-width:420px; }
