:root{color-scheme:dark;--bg:#030b14;--panel:#07111d;--line:#153047;--text:#edf4ff;--muted:#9db3cf;--cyan:#35d8ff;--blue:#1ea7fa;--green:#49ef91;--red:#ff7a7a;font-family:'DM Sans',Arial,sans-serif}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);line-height:1.55;min-height:100vh}
.top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;color:var(--text);text-decoration:none;font-weight:700;letter-spacing:.08em}
.brand img{width:34px;height:34px}
.top nav{display:flex;gap:18px;flex-wrap:wrap}
a{color:var(--cyan)}
.card{max-width:520px;margin:32px auto;padding:28px 16px}
.card.wide{max-width:900px}
h1{font-size:28px;margin:0 0 8px}
h2{font-size:18px;margin:28px 0 8px}
p{color:var(--muted)}
label{display:block;margin:14px 0 4px;font-size:14px;color:var(--muted)}
input[type=email],input[type=password],input[type=text]{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:8px;background:var(--panel);color:var(--text);font:inherit}
input:focus{outline:2px solid var(--blue);outline-offset:1px}
button,.btn{display:inline-block;margin-top:16px;padding:11px 18px;border:0;border-radius:8px;background:var(--blue);color:#001018;font:inherit;font-weight:700;cursor:pointer;text-decoration:none}
button.quiet{background:transparent;color:var(--text);border:1px solid var(--line)}
button.danger{background:var(--red)}
.err{color:var(--red);margin:12px 0}.ok{color:var(--green);margin:12px 0}
.note{font-size:13px}
.panel{border:1px solid var(--line);background:var(--panel);border-radius:10px;padding:16px;margin:12px 0}
code,pre{font-family:ui-monospace,Menlo,Consolas,monospace;background:#02070d;border:1px solid var(--line);border-radius:6px}
code{padding:1px 5px}pre{padding:12px;overflow-x:auto;white-space:pre-wrap;word-break:break-all}
.plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.meter{height:8px;background:#0b2033;border-radius:6px;overflow:hidden}.meter i{display:block;height:100%;background:var(--cyan)}
form.inline{display:inline}
.meter i.w0{width:0%}.meter i.w5{width:5%}.meter i.w10{width:10%}.meter i.w15{width:15%}.meter i.w20{width:20%}.meter i.w25{width:25%}.meter i.w30{width:30%}.meter i.w35{width:35%}.meter i.w40{width:40%}.meter i.w45{width:45%}.meter i.w50{width:50%}.meter i.w55{width:55%}.meter i.w60{width:60%}.meter i.w65{width:65%}.meter i.w70{width:70%}.meter i.w75{width:75%}.meter i.w80{width:80%}.meter i.w85{width:85%}.meter i.w90{width:90%}.meter i.w95{width:95%}.meter i.w100{width:100%}

/* pricing */
.hero { margin: 24px 0 8px; } .hero h1 { font-size: 2rem; line-height: 1.2; } .hero .big { color: var(--accent, #1eabed); }
.hero .lead { max-width: 46rem; } .toggle a { margin-right: 12px; opacity: .7; } .toggle a.on { opacity: 1; font-weight: 600; text-decoration: underline; }
.plans { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.plan .price { font-size: 1.8rem; margin: 4px 0 8px; } .plan .price small { font-size: .8rem; opacity: .7; } .plan ul { padding-left: 18px; } .plan.feature { outline: 2px solid var(--accent, #1eabed); }
table.rates { width: 100%; border-collapse: collapse; } table.rates th, table.rates td { text-align: left; padding: 6px 8px; border-bottom: 1px solid rgba(128,128,128,.3); }
.faq h3 { margin: 12px 0 2px; font-size: 1rem; }