:root{color-scheme:light dark;--bg:#efeae2;--ink:#15172a;--ink-2:#45475a;--muted:#86837a;--glass:linear-gradient(160deg,#ffffffa8,#ffffff5c);--edge:inset 0 1px 1px #fff,inset 0 0 0 1px #ffffffa6,0 0 0 .5px #15172a1a;--shadow:0 10px 30px -18px #15172a4d;--accent:#2f4fa8;--a1:#f5c97a;--a2:#eea08c;--a3:#93a9e6;--ui:"Archivo",-apple-system,"SF Pro Text",system-ui,sans-serif}
@media (prefers-color-scheme:dark){:root{--bg:#0b0d19;--ink:#f3efe6;--ink-2:#c8c4ba;--muted:#8b887f;--glass:linear-gradient(160deg,#ffffff17,#ffffff08);--edge:inset 0 1px 1px #ffffff40,inset 0 0 0 1px #ffffff26,0 0 0 .5px #00000080;--shadow:0 12px 30px -16px #000000a0;--accent:#8ea8ff;--a1:#3d2c78;--a2:#1d4a72;--a3:#6a4516}}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;min-height:100svh;background:var(--bg);color:var(--ink);font:400 16px/1.6 var(--ui);-webkit-font-smoothing:antialiased}
.aurora{position:fixed;inset:0;z-index:0;pointer-events:none;filter:blur(80px);opacity:.6}
.aurora i{position:absolute;width:60vmax;height:60vmax;border-radius:50%}
.aurora i:nth-child(1){background:var(--a1);left:-24vmax;top:-28vmax}
.aurora i:nth-child(2){background:var(--a2);right:-26vmax;top:10vmax}
.aurora i:nth-child(3){background:var(--a3);left:10vmax;bottom:-36vmax}
main{position:relative;z-index:1;max-width:720px;margin:0 auto;padding:calc(env(safe-area-inset-top) + 20px) max(16px,env(safe-area-inset-right)) calc(env(safe-area-inset-bottom) + 40px) max(16px,env(safe-area-inset-left))}
.top{display:flex;align-items:center;justify-content:space-between;margin-bottom:28px}
.brand{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:800 22px/1 var(--ui);font-stretch:115%;letter-spacing:-.04em}
.brand img{width:32px;height:32px}
.play{padding:10px 16px;border-radius:999px;background:var(--glass);box-shadow:var(--edge),var(--shadow);color:var(--ink);text-decoration:none;font:650 14px/1 var(--ui)}
h1{margin:0 0 8px;font:800 clamp(30px,6vw,42px)/1.1 var(--ui);letter-spacing:-.02em}
.lead{margin:0 0 28px;color:var(--ink-2);font-size:17px}
.card{margin:0 0 16px;padding:22px 24px;border-radius:26px;background:var(--glass);backdrop-filter:blur(24px) saturate(1.5);-webkit-backdrop-filter:blur(24px) saturate(1.5);box-shadow:var(--edge),var(--shadow)}
.card h2{margin:0 0 10px;font:750 19px/1.25 var(--ui)}
.card p,.card li{color:var(--ink-2)}
.card p:last-child,.card ul:last-child{margin-bottom:0}
.card ul{padding-left:20px}
a{color:var(--accent)}
details{padding:14px 0;border-top:1px solid color-mix(in srgb,var(--ink) 10%,transparent)}
details:first-of-type{border-top:0;padding-top:0}
summary{cursor:pointer;font:700 16px/1.4 var(--ui);color:var(--ink)}
details p{margin:10px 0 0}
form{display:grid;gap:14px}
label{display:grid;gap:6px;font:650 14px/1.2 var(--ui)}
label small{font-weight:500;color:var(--muted)}
select,textarea,input{width:100%;padding:12px 14px;border:0;border-radius:14px;background:color-mix(in srgb,var(--ink) 6%,transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 12%,transparent);color:var(--ink);font:500 16px/1.4 var(--ui)}
textarea{min-height:150px;resize:vertical}
select:focus,textarea:focus,input:focus{outline:2px solid var(--accent);outline-offset:1px}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
button{justify-self:start;min-height:50px;padding:0 24px;border:0;border-radius:999px;background:linear-gradient(180deg,#2b2e4b,#121426);color:#f6f2ea;font:700 15px/1 var(--ui);cursor:pointer}
@media (prefers-color-scheme:dark){button{background:linear-gradient(180deg,#fff,#e7e2d6);color:#12142a}}
button[disabled]{opacity:.5;cursor:default}
.status{margin:0;font:600 15px/1.4 var(--ui)}
.status.ok{color:#3e7a34}.status.err{color:#c24d36}
@media (prefers-color-scheme:dark){.status.ok{color:#8fcf7f}.status.err{color:#ff8a70}}
footer{margin-top:28px;color:var(--muted);font-size:13px;text-align:center}
footer a{color:inherit}
