:root{--ink:#0f1720;--ink2:#2a3540;--muted:#5b6772;--dim:#8a949e;--line:#e4eaed;--line2:#cfd9dd;--sky:#f2f9fa;--teal:#0f7f8c;--teal2:#0b6570;--cyan:#2ec4cb;--mint:#13a89a;--f:"Plus Jakarta Sans",Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
body{background:#fff;color:var(--ink);font:16px/1.65 var(--f);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:var(--teal)}
.wrap{max-width:860px;margin:0 auto;padding:0 24px}
header{background:#0b0d10;border-bottom:1px solid #1c2229}
.nav{max-width:1200px;margin:0 auto;padding:0 24px;height:74px;display:flex;align-items:center;justify-content:space-between;gap:16px}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{height:42px;width:auto}
.brand span{font:600 16px/1 Montserrat,var(--f);letter-spacing:.32em;color:#fff}
.back{color:#c3cdd4;text-decoration:none;font-weight:600;font-size:14px;white-space:nowrap}
.back:hover{color:var(--cyan)}
.hero{background:linear-gradient(180deg,#e9f7f8,#fff);padding:64px 0 36px}
.eyebrow{font:700 12.5px/1 var(--f);letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}
h1{font-size:clamp(32px,5vw,48px);line-height:1.08;letter-spacing:-.025em;font-weight:800;margin:14px 0 12px}
h2{font-size:22px;letter-spacing:-.01em;margin:34px 0 10px}
p.lead{font-size:18px;color:var(--muted)}
main{padding-bottom:72px}
.card{background:#fff;border:1px solid var(--line);border-radius:22px;padding:30px;box-shadow:0 2px 4px rgba(15,23,32,.05),0 24px 60px -24px rgba(15,127,140,.28);margin-top:-10px}
label{display:grid;gap:7px;font-size:13px;font-weight:700;color:var(--ink2);margin-bottom:14px}
input,select{font:15px/1.4 var(--f);color:var(--ink);background:#fff;border:1.5px solid var(--line2);border-radius:12px;padding:13px 14px;width:100%;outline:none}
input:focus,select:focus{border-color:var(--teal);box-shadow:0 0 0 4px rgba(15,127,140,.12)}
.btn{display:inline-flex;align-items:center;justify-content:center;height:48px;padding:0 24px;border-radius:999px;font:700 15px/1 var(--f);border:1.5px solid var(--teal);cursor:pointer;text-decoration:none;white-space:nowrap}
.btn-primary{background:var(--teal);color:#fff}.btn-primary:hover{background:var(--teal2)}
.btn-ghost{background:#fff;color:var(--teal)}.btn-ghost:hover{background:var(--sky)}
.btn:disabled{opacity:.55;cursor:default}
.row{display:flex;gap:12px;flex-wrap:wrap;margin-top:6px}
.msg{margin-top:18px;border-radius:14px;padding:16px 18px;font-size:15px;display:none}
.msg.show{display:block}
.msg.ok{background:#e6f7f6;border:1px solid #bfe6e3}
.msg.err{background:#fff2f2;border:1px solid #f3c7c9}
.msg.info{background:var(--sky);border:1px solid var(--line)}
.msg b{display:block;margin-bottom:4px}
.lics{margin-top:26px}
.lic{display:flex;align-items:center;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:14px;padding:14px 16px;margin-top:10px;flex-wrap:wrap}
.lic small{display:block;color:var(--dim);word-break:break-all}
.lic button{border:1px solid var(--line2);background:#fff;border-radius:999px;padding:8px 14px;font:600 13px/1 var(--f);cursor:pointer;color:var(--ink2)}
.legal h2{font-size:19px}
.legal p,.legal li{color:var(--ink2);margin-bottom:10px}
.legal ul{padding-left:22px}
.draft{background:#fff8e6;border:1px solid #f1d998;border-radius:12px;padding:12px 16px;font-size:14px;color:#6b5310;margin-bottom:18px}
footer{background:#0b0d10;color:#aab4bd;font-size:13.5px;padding:34px 0}
footer .wrap{max-width:1200px;display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap}
footer a{color:#c3cdd4;text-decoration:none;margin-right:18px}footer a:hover{color:#fff}
@media (max-width:640px){.wrap,.nav{padding:0 16px}.brand span{font-size:13px;letter-spacing:.2em}.brand img{height:34px}.card{padding:22px}.hero{padding:44px 0 28px}}

/* ===== gloss buttons ===== */
.btn-primary{position:relative;overflow:hidden;isolation:isolate;
  background-image:linear-gradient(180deg,rgba(255,255,255,.30) 0%,rgba(255,255,255,.08) 48%,rgba(0,0,0,0) 52%,rgba(0,0,0,.14) 100%);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55),inset 0 -2px 0 rgba(0,0,0,.18),0 10px 22px -10px rgba(10,30,70,.55);
  text-shadow:0 1px 0 rgba(0,0,0,.12);
  transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .25s,background-color .2s,filter .2s}
.btn-primary::after{content:"";position:absolute;top:0;bottom:0;left:-75%;width:50%;z-index:-1;pointer-events:none;
  background:linear-gradient(100deg,rgba(255,255,255,0),rgba(255,255,255,.38),rgba(255,255,255,0));transform:skewX(-20deg);transition:none}
.btn-primary:hover{transform:translateY(-2px);filter:brightness(1.06);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6),inset 0 -2px 0 rgba(0,0,0,.16),0 16px 30px -12px rgba(10,30,70,.6),0 0 0 3px rgba(34,211,230,.14)}
.btn-primary:hover::after{left:130%;transition:left .65s ease}
.btn-primary:active{transform:translateY(1px);box-shadow:inset 0 2px 4px rgba(0,0,0,.22),0 4px 10px -6px rgba(10,30,70,.5)}
.btn-ghost{background-image:linear-gradient(180deg,rgba(255,255,255,.9),rgba(255,255,255,.55));box-shadow:inset 0 1px 0 #fff,0 6px 14px -10px rgba(10,30,70,.45);transition:transform .2s cubic-bezier(.2,.8,.2,1),box-shadow .25s,border-color .2s,color .2s}
.btn-ghost:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 #fff,0 12px 22px -12px rgba(10,30,70,.5)}
.card:hover{box-shadow:0 2px 4px rgba(11,22,48,.05),0 28px 60px -22px rgba(11,22,48,.35),0 0 0 1px rgba(19,145,159,.35)}
@media (prefers-reduced-motion:reduce){.btn-primary::after{display:none}}
