:root{--night:#1C2541;--dusk:#3A506B;--sun:#F4A259;--rose:#F28482;--sky:#F7F8FC;--line:#D9DDEA;--ink:#1C2541;--muted:#5B6480}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--sky);color:var(--ink);font:400 17px/1.55 "Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:var(--dusk)}
a:focus-visible,.btn:focus-visible{outline:3px solid var(--sun);outline-offset:3px;border-radius:4px}
.wrap{max-width:860px;margin:0 auto;padding:0 24px}

/* hero */
.hero{position:relative;background:linear-gradient(180deg,var(--night) 0%,var(--dusk) 78%,#6B5B7B 100%);color:#fff;overflow:hidden;padding:88px 0 140px}
.hero h1{font:700 clamp(44px,8vw,84px)/0.98 "Bricolage Grotesque",sans-serif;letter-spacing:-0.02em;margin:0;max-width:9ch}
.hero p{margin:20px 0 0;font-size:19px;color:#E4E7F2;max-width:34ch}
.sun{position:absolute;left:50%;bottom:-150px;width:300px;height:300px;margin-left:-150px;border-radius:50%;background:linear-gradient(180deg,#B85C7A 0%,#E06A6A 9%,#F2844F 18%,#F9A048 28%,#FBBE4E 38%,#FFDA6A 46%,#FFE98C 52%,#FFE98C 100%);box-shadow:0 0 120px 40px rgba(249,160,72,.35)}
.horizon{position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--rose)}
@media (max-width:719px){.sun{width:200px;height:200px;margin-left:-100px;bottom:-110px}}
@media (min-width:720px){.sun{left:auto;right:8%;margin-left:0}}
@media (prefers-reduced-motion:no-preference){.sun{animation:rise 1.6s cubic-bezier(.2,.7,.2,1) both}@keyframes rise{from{transform:translateY(120px)}to{transform:none}}}

/* apps */
.apps{padding-top:56px;padding-bottom:24px}
.apps h2{font:700 28px/1.2 "Bricolage Grotesque",sans-serif;margin:0 0 8px}
.app{display:grid;grid-template-columns:72px 1fr auto;gap:12px 32px;align-items:center;padding:28px 0;border-top:1px solid var(--line)}
.app:last-child{border-bottom:1px solid var(--line)}
.app h3{font:700 24px/1.2 "Bricolage Grotesque",sans-serif;margin:0}
.app p{margin:6px 0 0;color:var(--muted)}
.app .status{display:inline-block;font-size:14px;font-weight:600;color:var(--night);background:#FFE3B8;padding:4px 12px;border-radius:999px;margin-top:10px}
.actions{display:flex;flex-wrap:wrap;gap:10px;justify-content:flex-end}
.btn{display:inline-block;padding:10px 18px;border-radius:999px;font-weight:600;font-size:15px;text-decoration:none;border:1.5px solid var(--night);color:var(--night);background:transparent;white-space:nowrap}
.btn.primary{background:var(--night);color:#fff}
.btn:hover{background:var(--dusk);border-color:var(--dusk);color:#fff}
.icon{width:72px;height:72px;border-radius:22%;display:block;box-shadow:0 1px 3px rgba(28,37,65,.15)}
.icon.placeholder{background:linear-gradient(180deg,#F2844F,#FFDA6A);opacity:.35;box-shadow:none}
@media (max-width:640px){.app{grid-template-columns:56px 1fr}.icon{width:56px;height:56px}.actions{grid-column:2;justify-content:flex-start}}

footer{padding-top:40px;padding-bottom:56px;color:var(--muted);font-size:15px}

/* legal pages */
.bar{background:var(--night)}
.bar a{display:inline-flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font:700 18px/1 "Bricolage Grotesque",sans-serif;padding:18px 0}
.bar .dot{width:18px;height:9px;border-radius:18px 18px 0 0;background:var(--sun)}
.legal{max-width:68ch;margin:0 auto;padding:48px 24px 72px;font:400 17px/1.7 Literata,Georgia,serif}
.legal .app-name{font:600 16px/1.3 "Instrument Sans",sans-serif;color:var(--dusk);margin:0}
.legal h1{font:700 clamp(32px,6vw,46px)/1.1 "Bricolage Grotesque",sans-serif;margin:6px 0 8px;letter-spacing:-0.01em}
.legal h2{font:700 23px/1.25 "Bricolage Grotesque",sans-serif;margin:2.2em 0 .5em}
.legal h3{font:600 18px/1.3 "Instrument Sans",sans-serif;margin:1.6em 0 .4em}
.legal li{margin:.25em 0}
.legal a{word-break:break-word}
.legal .other{margin-top:3em;padding-top:1.2em;border-top:1px solid var(--line);font:400 15px/1.5 "Instrument Sans",sans-serif}