/* NSD.SG — dark palette, purple accent, "Apple treatment": whitespace, pill buttons, layered shadows, spring motion. */
:root{--bg:#0f1014;--bg2:#15161c;--bg3:#1c1d25;--line:rgba(255,255,255,.08);--line-2:rgba(255,255,255,.14);--text:#f2f2f5;--text-2:#c3c4cd;--muted:#8f909c;--accent:#7c5cff;--accent2:#a78bfa;--accent-rgb:124,92,255;--ok:#34d399;--warn:#fbbf24;--danger:#f87171;
--r:14px;--r-lg:22px;--spring:cubic-bezier(.16,1,.3,1);--px:clamp(20px,5vw,64px);--py:clamp(72px,10vw,128px);--max:1120px;
--shadow-sm:0 2px 12px rgba(0,0,0,.28),0 0 0 1px rgba(255,255,255,.04);--shadow-md:0 10px 32px rgba(0,0,0,.35),0 0 0 1px rgba(255,255,255,.05);--shadow-lg:0 24px 64px rgba(0,0,0,.45),0 0 0 1px rgba(255,255,255,.06);
--glow:0 2px 8px rgba(var(--accent-rgb),.25),0 10px 28px rgba(var(--accent-rgb),.32);--glow-hover:0 4px 12px rgba(var(--accent-rgb),.3),0 20px 44px rgba(var(--accent-rgb),.45);
--font:-apple-system,BlinkMacSystemFont,"SF Pro Text",Inter,"Segoe UI",Roboto,system-ui,sans-serif}
*,*::before,*::after{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;scroll-padding-top:76px}[id]{scroll-margin-top:76px}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body.drawer-open{overflow:hidden}
a{color:var(--accent2);text-decoration:none;transition:color .18s}a:hover{color:#c4b5fd}
h1,h2,h3,h4{line-height:1.08;margin:0 0 .5em;letter-spacing:-.025em;font-weight:700}h1{font-size:clamp(2rem,4.5vw,2.9rem)}h2{font-size:clamp(1.5rem,3vw,2rem)}h3{font-size:1.1rem;letter-spacing:-.01em}h4{font-size:.95rem}
p{margin:0 0 1em}code{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9em;background:var(--bg3);padding:.12em .4em;border-radius:6px;color:var(--text-2)}
img{max-width:100%;display:block}
.container{max-width:var(--max);margin:0 auto;padding:0 var(--px)}.container.narrow{max-width:680px}
.muted{color:var(--muted)}.small{font-size:.85rem}.ok{color:var(--ok)}.warn{color:var(--warn)}.mt{margin-top:1.5rem}.hide-sm{display:none}@media(min-width:760px){.hide-sm{display:inline}}
.inline{display:inline}
:focus-visible{outline:2px solid var(--accent2);outline-offset:3px;border-radius:6px}

/* ---- header ------------------------------------------------------------ */
.site-header{position:sticky;top:0;z-index:200;background:rgba(15,16,20,.78);backdrop-filter:blur(24px) saturate(180%);-webkit-backdrop-filter:blur(24px) saturate(180%);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:22px;height:64px}
.nav-links{display:flex;align-items:center;gap:26px;flex:1;min-width:0;overflow:hidden}
.nav-links a{color:var(--text-2);font-size:.9rem;font-weight:500;white-space:nowrap;padding:6px 0;border-bottom:1.5px solid transparent;transition:color .18s,border-color .18s}
.nav-links a:hover{color:#fff}.nav-links a.active{color:#fff;border-bottom-color:var(--accent)}
.nav-cta{display:flex;gap:10px;align-items:center;margin-left:auto}.nav-email{max-width:180px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand{font-weight:800;letter-spacing:.06em;font-size:1.1rem;color:#fff;white-space:nowrap}.brand span{color:var(--accent2)}.brand.small{font-size:1rem}.brand:hover{color:#fff}
.admin-link{color:var(--warn)!important}.pill-admin{background:rgba(251,191,36,.15);color:var(--warn)}
.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;width:44px;height:44px;padding:0 10px;margin-right:-10px;background:none;border:0;cursor:pointer}
.hamburger span{display:block;height:1.5px;background:var(--text);border-radius:2px;transition:transform .25s var(--spring),opacity .2s}
.drawer{display:none;position:fixed;inset:0;z-index:300;background:var(--bg);padding:96px var(--px) 48px;flex-direction:column;gap:32px;overflow-y:auto}
.drawer.open{display:flex;animation:fade .25s var(--spring)}
.drawer-close{position:absolute;top:12px;right:calc(var(--px) - 12px);width:44px;height:44px;font-size:30px;line-height:1;color:var(--muted);background:none;border:0;cursor:pointer}
.drawer-links{display:flex;flex-direction:column;gap:6px}.drawer-links a{font-size:2rem;font-weight:700;letter-spacing:-.03em;color:var(--text);padding:8px 0}.drawer-links a.active{color:var(--accent2)}
.drawer-cta{display:flex;flex-direction:column;gap:12px;padding-top:24px;border-top:1px solid var(--line)}.drawer-cta .btn{width:100%}.drawer-cta .inline{display:block}.drawer-cta .inline .btn{width:100%}.drawer-cta .nav-email{max-width:none;text-align:center}
@media(max-width:880px){.nav-links{display:none}.nav::after{content:"";flex:1}.nav-cta{margin-left:0;order:3}.hamburger{display:flex;order:4}.marketing .nav-cta .btn-ghost{display:none}.app .nav-cta{display:none}}
@media(max-width:380px){.marketing .nav-cta{display:none}}
@keyframes fade{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ---- buttons ----------------------------------------------------------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 22px;border-radius:980px;border:1.5px solid transparent;font:inherit;font-weight:600;font-size:.95rem;line-height:1.2;cursor:pointer;text-decoration:none!important;white-space:nowrap;-webkit-appearance:none;transition:transform .35s var(--spring),box-shadow .35s var(--spring),background .2s,border-color .2s,color .2s}
.btn:active{transform:translateY(0) scale(.98)}
.btn-primary{background:var(--accent);color:#fff;box-shadow:var(--glow)}.btn-primary:hover{background:#6a49ff;color:#fff;transform:translateY(-3px);box-shadow:var(--glow-hover)}
.btn-ghost{background:rgba(255,255,255,.03);border-color:var(--line-2);color:var(--text)}.btn-ghost:hover{border-color:rgba(255,255,255,.28);color:#fff;transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.btn-danger{background:transparent;border-color:rgba(248,113,113,.4);color:var(--danger)}.btn-danger:hover{background:rgba(248,113,113,.1);color:var(--danger);transform:translateY(-2px)}
.btn-lg{padding:16px 30px;font-size:1.05rem}.btn-sm{padding:9px 16px;font-size:.88rem}.btn-tiny{padding:5px 12px;font-size:.8rem}
.btn .arrow{display:inline-block;transition:transform .3s var(--spring)}.btn:hover .arrow{transform:translateX(5px)}

/* ---- hero -------------------------------------------------------------- */
.hero{padding:clamp(72px,10vw,132px) 0 clamp(48px,6vw,72px);text-align:center;position:relative;background:radial-gradient(1000px 480px at 50% -12%,rgba(var(--accent-rgb),.28),transparent 68%)}
.eyebrow{display:inline-flex;align-items:center;gap:12px;color:var(--accent2);text-transform:uppercase;letter-spacing:.24em;font-size:.72rem;font-weight:600;margin-bottom:22px}
.eyebrow::before,.eyebrow::after{content:"";width:24px;height:1px;background:var(--accent);opacity:.7}
.hero h1{font-size:clamp(2.4rem,7vw,4.6rem);letter-spacing:-.035em;line-height:1.02;max-width:900px;margin:0 auto .5em}
.grad{background:linear-gradient(90deg,#a78bfa 0%,#7c5cff 45%,#60a5fa 100%);-webkit-background-clip:text;background-clip:text;color:transparent}
.lead{font-size:clamp(1.05rem,1.6vw,1.25rem);color:var(--text-2);font-weight:400;max-width:620px;margin:0 auto 2em;line-height:1.7}.lead strong{color:#fff;font-weight:600}
.hero-form{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;max-width:640px;margin:0 auto}
.hero-note{color:var(--muted);font-size:.9rem;margin-top:1em;min-height:1.4em}
.domain-input{display:flex;align-items:center;background:rgba(255,255,255,.04);border:1.5px solid var(--line-2);border-radius:980px;padding:0 20px 0 0;overflow:hidden;flex:1;min-width:240px;transition:border-color .2s,box-shadow .35s var(--spring),transform .35s var(--spring)}
.domain-input input{flex:1;background:transparent;border:0;color:var(--text);font:inherit;font-size:1.05rem;padding:15px 20px;outline:0;min-width:0}.domain-input input::placeholder{color:var(--muted)}.domain-input span{color:var(--muted);font-weight:600}
.domain-input:focus-within{border-color:var(--accent);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.18),var(--shadow-sm)}
.flow{display:inline-flex;gap:14px;align-items:center;margin-top:52px;padding:11px 20px;border:1px solid var(--line);border-radius:980px;background:rgba(255,255,255,.02);color:var(--muted);font-size:.88rem;flex-wrap:wrap;justify-content:center}.flow i{color:var(--accent2);font-style:normal}

/* ---- sections ---------------------------------------------------------- */
.section{padding:var(--py) 0}.section.alt{background:var(--bg2)}.section h2{font-size:clamp(1.8rem,3.6vw,2.6rem);letter-spacing:-.03em;margin-bottom:.6em}.section-lead{color:var(--text-2);max-width:600px;margin-bottom:2.4em;font-size:1.05rem;line-height:1.75}
.grid{display:grid;gap:20px}.grid.two{grid-template-columns:1fr}.grid.three{grid-template-columns:1fr}@media(min-width:760px){.grid.two{grid-template-columns:1fr 1fr}.grid.three{grid-template-columns:repeat(3,1fr)}}.grid.tight{gap:12px}
.card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r-lg);padding:26px;margin-bottom:20px;box-shadow:var(--shadow-sm);transition:transform .4s var(--spring),box-shadow .4s var(--spring),border-color .2s}
.section .grid .card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md);border-color:var(--line-2)}
.section.alt .card{background:var(--bg3)}.card.empty{text-align:center;padding:56px 24px}.card.danger{border-color:rgba(248,113,113,.3)}.card p:last-child{margin-bottom:0}
.step{width:38px;height:38px;border-radius:50%;background:var(--accent);color:#fff;display:grid;place-items:center;font-weight:700;margin-bottom:16px;box-shadow:var(--glow)}
.features{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}.features li{padding:14px 18px;background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow-sm)}.features li::before{content:"✓ ";color:var(--ok);font-weight:700}
.pricing{grid-template-columns:1fr}@media(min-width:760px){.pricing{grid-template-columns:repeat(auto-fit,minmax(260px,1fr))}}
.plan{display:flex;flex-direction:column}.plan.featured{border-color:rgba(var(--accent-rgb),.6);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.12),var(--shadow-md)}.plan .price{font-size:2.4rem;font-weight:800;letter-spacing:-.03em;margin:.1em 0 .3em}.plan ul{padding-left:1.1em;color:var(--text-2);flex:1}.plan ul li{margin:.35em 0}
details{border-bottom:1px solid var(--line);padding:16px 0}summary{cursor:pointer;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px}summary::-webkit-details-marker{display:none}summary::after{content:"+";color:var(--accent2);font-size:1.2em;line-height:1;transition:transform .3s var(--spring)}details[open] summary::after{transform:rotate(45deg)}details p{margin:.8em 0 0;color:var(--text-2)}
.cta{padding:var(--py) 0;text-align:center;background:linear-gradient(180deg,var(--bg2),var(--bg))}.cta h2{font-size:clamp(1.8rem,4.5vw,3rem);letter-spacing:-.03em}.cta .btn{margin:8px 0 20px}
.site-footer{border-top:1px solid var(--line);padding:56px 0 36px;color:var(--muted);font-size:.9rem}.foot-grid{display:grid;grid-template-columns:1fr;gap:28px}@media(min-width:760px){.foot-grid{grid-template-columns:2fr 1fr 1fr 1fr}}
.foot-grid h4{margin:0 0 .7em;color:var(--text);letter-spacing:.02em}.foot-grid a{display:block;color:var(--muted);margin:.4em 0}.foot-grid a:hover{color:var(--text)}.fine{margin-top:36px;font-size:.8rem}
.site-footer.slim{padding:22px 0}.site-footer.slim .container{display:flex;justify-content:space-between;flex-wrap:wrap;gap:8px}
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--spring),transform .8s var(--spring)}.reveal.on{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}*{transition-duration:.01ms!important;animation-duration:.01ms!important}}

/* ---- forms ------------------------------------------------------------- */
.form label{display:block;margin-bottom:16px;font-weight:600;font-size:.92rem}.form label small,.form label .muted{font-weight:400;color:var(--muted);display:block;margin-top:4px}
.form input:not([type=checkbox]):not([type=file]),.form select,.form textarea,.filters input,.filters select,.form-inline input,.form-inline select{width:100%;background:var(--bg3);border:1.5px solid var(--line);border-radius:12px;color:var(--text);font:inherit;font-size:16px;padding:12px 15px;margin-top:6px;outline:0;transition:border-color .2s,box-shadow .3s var(--spring)}
.form input:focus,.form textarea:focus,.form select:focus,.filters input:focus,.form-inline input:focus{border-color:var(--accent);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.16)}.form input[disabled]{opacity:.6}
.form .domain-input{margin-top:6px;border-radius:12px}.form .domain-input input,.form .domain-input input:not([type=checkbox]):not([type=file]),.form .domain-input input:focus{margin:0;border:0;background:transparent;box-shadow:none;border-radius:0}
.check{display:flex!important;gap:10px;align-items:flex-start;font-weight:400!important}.check input{margin-top:5px;accent-color:var(--accent)}.checks{display:flex;flex-wrap:wrap;gap:16px;margin:8px 0 16px}
.form-inline{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:8px 0}.form-inline input,.form-inline select{width:auto;flex:1;min-width:120px;margin:0}
.filters{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.filters input{flex:1;min-width:200px;margin:0}.filters select{width:auto;margin:0}
.flash{padding:13px 18px;border-radius:var(--r);margin-bottom:18px;border:1px solid;box-shadow:var(--shadow-sm)}.flash-success,.flash-ok{background:rgba(52,211,153,.1);border-color:rgba(52,211,153,.35)}.flash-error{background:rgba(248,113,113,.1);border-color:rgba(248,113,113,.35)}.flash-warn{background:rgba(251,191,36,.1);border-color:rgba(251,191,36,.35)}.flash ul{margin:0;padding-left:1.2em}
.auth h1{margin-top:24px}

/* ---- app --------------------------------------------------------------- */
.app-main{padding:36px var(--px) 72px;min-height:70vh}
.page-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin-bottom:26px}.page-head h1{margin-bottom:.2em;overflow-wrap:anywhere}.actions{display:flex;gap:8px;flex-wrap:wrap}
.crumb{color:var(--muted);font-size:.85rem;margin-bottom:.5em}
.pill{display:inline-block;padding:3px 11px;border-radius:980px;font-size:.72rem;font-weight:700;background:var(--bg3);color:var(--muted);vertical-align:middle;text-transform:uppercase;letter-spacing:.06em}
.pill-live,.pill-active,.pill-resolved{background:rgba(52,211,153,.15);color:var(--ok)}.pill-suspended,.pill-disabled,.pill-alert,.pill-expired{background:rgba(248,113,113,.15);color:var(--danger)}.pill-empty,.pill-pending,.pill-warn,.pill-open,.pill-reviewing{background:rgba(251,191,36,.15);color:var(--warn)}
.site-list .site-row{display:grid;grid-template-columns:1fr auto;gap:8px 16px;align-items:center;color:inherit;text-decoration:none!important}@media(min-width:760px){.site-list .site-row{grid-template-columns:2fr auto 1fr auto}}.site-row:hover{border-color:var(--line-2);transform:translateY(-3px);box-shadow:var(--shadow-md)}.site-name{font-weight:700;font-size:1.05rem}
.dropzone{border:1.5px dashed var(--line-2);border-radius:var(--r-lg);padding:32px 20px;text-align:center;transition:border-color .2s,background .2s,transform .35s var(--spring);background:rgba(255,255,255,.02)}.dropzone.over{border-color:var(--accent);background:rgba(var(--accent-rgb),.08);transform:scale(1.01)}.dropzone.busy .dz-inner,.dropzone.disabled .dz-inner{opacity:.4;pointer-events:none}
.dz-title{font-weight:700;font-size:1.1rem;margin-bottom:.3em}.dz-buttons{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:12px 0 16px}
.bar{height:8px;background:var(--bg);border-radius:980px;overflow:hidden;margin:10px auto;max-width:420px}.bar span{display:block;height:100%;width:0;background:var(--accent);transition:width .2s}
.file-list{max-height:420px;overflow:auto;border:1px solid var(--line);border-radius:var(--r)}.file-row{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:9px 14px;border-bottom:1px solid var(--line);font-size:.9rem}.file-row:last-child{border-bottom:0}.file-path{font-family:ui-monospace,Menlo,monospace;font-size:.85rem;overflow-wrap:anywhere}
.release-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}.release-row.current{background:rgba(52,211,153,.05)}.release-row:last-child{border-bottom:0}
.spark{display:flex;align-items:flex-end;gap:2px;height:60px;margin-top:8px}.spark i{flex:1;background:var(--accent);opacity:.7;border-radius:2px 2px 0 0;min-width:2px}
.meter{height:6px;background:var(--bg3);border-radius:980px;overflow:hidden;margin-top:4px}.meter span{display:block;height:100%;background:var(--accent)}
.plain{list-style:none;padding:0}.plain li{margin:.45em 0}.plan-line{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}
hr{border:0;border-top:1px solid var(--line);margin:20px 0}
.table{width:100%;border-collapse:collapse;font-size:.92rem}.table th,.table td{text-align:left;padding:10px 10px;border-bottom:1px solid var(--line);vertical-align:top}.table th{color:var(--muted);font-weight:600;font-size:.76rem;text-transform:uppercase;letter-spacing:.06em}.table.small{font-size:.82rem}.table.small td{padding:7px 8px}
.card .table{display:block;overflow-x:auto}

/* ---- admin ------------------------------------------------------------- */
.admin-header .nav-links a{font-size:.86rem}
/* Ten admin links do not fit beside the brand and buttons until ~1300px: use the drawer earlier, never clip. */
.admin-header .nav{height:auto;min-height:64px;flex-wrap:wrap;padding:6px 0}.admin-header .nav-links{flex-wrap:wrap;overflow:visible;row-gap:0;gap:4px 22px}
@media(max-width:880px){.admin-header .nav-links{display:none}}
.stats{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-bottom:24px}.stat{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;min-width:0;overflow:hidden;box-shadow:var(--shadow-sm)}.stat-value{font-size:1.4rem;font-weight:800;letter-spacing:-.02em;line-height:1.15;overflow-wrap:anywhere}.stat .small{overflow-wrap:anywhere}.stat-label{color:var(--muted);font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;margin-top:2px}
.row-between{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:9px 0;border-bottom:1px solid var(--line);flex-wrap:wrap}.row-between:last-child{border-bottom:0}.row-gap{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chip{display:inline-flex;align-items:center;gap:6px;background:var(--bg3);border:1px solid var(--line);border-radius:980px;padding:4px 12px;font-size:.82rem}.chip button{background:none;border:0;color:var(--danger);cursor:pointer;font-size:.8rem;padding:0}
.tabs{display:flex;gap:4px;flex-wrap:wrap}.tabs a{padding:7px 14px;border-radius:980px;color:var(--muted);font-size:.9rem}.tabs a.active{background:var(--bg3);color:var(--text)}
.legal h3{margin-top:1.4em}

/* ---- steps / showcase / badge demo ------------------------------------- */
.steps{list-style:none;padding:0;margin:0;display:grid;gap:14px;counter-reset:step}@media(min-width:760px){.steps{grid-template-columns:repeat(3,1fr)}}
.steps li{position:relative;padding:16px 16px 16px 56px;border:1px solid var(--line);border-radius:var(--r);background:rgba(255,255,255,.02);display:flex;flex-direction:column;gap:6px;line-height:1.45}
.steps li::before{counter-increment:step;content:counter(step);position:absolute;left:16px;top:16px;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-weight:700;font-size:.85rem;background:var(--bg3);color:var(--muted)}
.steps li.done::before{content:"✓";background:rgba(52,211,153,.18);color:var(--ok)}.steps li.now{border-color:rgba(var(--accent-rgb),.6);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.12)}.steps li.now::before{background:var(--accent);color:#fff;box-shadow:var(--glow)}
.steps li .btn{align-self:flex-start;margin-top:4px}
.notice{margin:16px 0 0;padding:12px 16px;border-radius:var(--r);background:rgba(251,191,36,.08);border:1px solid rgba(251,191,36,.3);font-size:.92rem;color:var(--text-2)}
.showcase{list-style:none;padding:0;margin:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}
.showcase a{display:grid;grid-template-columns:1fr auto;gap:2px 12px;align-items:center;padding:16px 18px;border:1px solid var(--line);border-radius:var(--r);background:var(--bg2);color:var(--text);box-shadow:var(--shadow-sm);transition:transform .35s var(--spring),box-shadow .35s var(--spring),border-color .2s}
.showcase a:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--line-2);color:#fff}.sc-name{font-weight:700}.sc-name i{font-style:normal;color:var(--accent2)}.sc-name{grid-column:1}.sc-title{grid-column:1;font-size:.85rem}.showcase .arrow{grid-column:2;grid-row:1/3;color:var(--muted)}
.badge-demo{border:1px solid var(--line-2);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);background:#fff;color:#111}
.bd-bar{display:flex;align-items:center;gap:6px;padding:10px 14px;background:#ececf0;border-bottom:1px solid #d9d9df}.bd-bar span{width:10px;height:10px;border-radius:50%;background:#c9c9d1}.bd-bar em{margin-left:12px;font-style:normal;font-size:.8rem;color:#666;background:#fff;border-radius:6px;padding:3px 10px;flex:1}
.bd-page{position:relative;padding:32px 28px 64px;min-height:260px}.bd-line{height:12px;border-radius:6px;background:#e4e4ea;margin:0 0 12px}.bd-line.w90{width:90%}.bd-line.w80{width:80%}.bd-line.w70{width:70%}.bd-line.w60{width:60%;height:22px;background:#d3d3dc}.bd-line.w50{width:50%}.bd-block{height:90px;border-radius:12px;background:#eeeef3;margin:16px 0}
.bd-badge{position:absolute;inset:0;pointer-events:none}.bd-badge a{pointer-events:auto}

/* ---- roadmap / changelog -------------------------------------------------- */
.rm-board{display:grid;gap:18px;margin-top:2rem}@media(min-width:880px){.rm-board{grid-template-columns:repeat(3,1fr)}}
.rm-col{background:rgba(255,255,255,.02);border:1px solid var(--line);border-radius:var(--r-lg);padding:18px}.rm-col h2{font-size:1.1rem;margin:0 0 .2em;display:flex;gap:8px;align-items:baseline}.rm-col>p{margin-bottom:14px}
.rm-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}
.rm-card{background:var(--bg2);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin-bottom:12px;box-shadow:var(--shadow-sm);transition:transform .35s var(--spring),box-shadow .35s var(--spring)}.rm-card:hover{transform:translateY(-2px);box-shadow:var(--shadow-md)}
.rm-card h3{font-size:1rem;margin:.4em 0 .3em}.rm-card p{font-size:.9rem;margin:0 0 .8em;line-height:1.5}
.rm-top{display:flex;justify-content:space-between;align-items:center;gap:8px}.rm-cat{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;color:var(--accent2)}
.rm-card.shipped .rm-cat{color:var(--ok)}.rm-card.in_progress{border-color:rgba(var(--accent-rgb),.5)}
.rm-foot{display:flex;align-items:center;gap:12px}
.vote{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border-radius:980px;border:1.5px solid var(--line-2);background:rgba(255,255,255,.03);color:var(--text);font:inherit;font-size:.85rem;font-weight:600;cursor:pointer;text-decoration:none!important;transition:transform .3s var(--spring),background .2s,border-color .2s}
.vote:hover{transform:translateY(-2px);border-color:var(--accent2);color:#fff}.vote.on{background:var(--accent);border-color:transparent;color:#fff;box-shadow:var(--glow)}
.rm-suggest h2{margin-bottom:.6em}
.cl-list{margin-top:2.5rem;border-left:1px solid var(--line);padding-left:28px}.cl-entry{position:relative;padding-bottom:40px}.cl-entry::before{content:"";position:absolute;left:-34px;top:8px;width:11px;height:11px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--bg),0 0 0 6px rgba(var(--accent-rgb),.35)}
.cl-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;color:var(--muted);font-size:.85rem;margin-bottom:.4em}.cl-entry h2{font-size:1.35rem}.cl-body ul{padding-left:1.2em;color:var(--text-2)}.cl-body li{margin:.35em 0}
.tag{font-size:.68rem;text-transform:uppercase;letter-spacing:.08em;font-weight:700;padding:3px 9px;border-radius:980px;background:var(--bg3);color:var(--muted)}.tag-new{background:rgba(var(--accent-rgb),.18);color:var(--accent2)}.tag-improved{background:rgba(52,211,153,.15);color:var(--ok)}.tag-fixed{background:rgba(251,191,36,.15);color:var(--warn)}
.rm-admin-item{margin-bottom:12px}

.sub-box{padding:14px 16px;border:1px solid rgba(52,211,153,.35);background:rgba(52,211,153,.06);border-radius:var(--r);margin-bottom:8px}.sub-box p{margin:0 0 .6em}

/* ---- back to top ------------------------------------------------------- */
.to-top{position:fixed;right:20px;bottom:20px;z-index:150;width:46px;height:46px;border-radius:50%;border:1px solid var(--line-2);background:rgba(21,22,28,.85);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);color:var(--text);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-md);opacity:0;transform:translateY(12px) scale(.9);pointer-events:none;transition:opacity .35s var(--spring),transform .35s var(--spring),background .2s,border-color .2s}
.to-top.show{opacity:1;transform:none;pointer-events:auto}.to-top:hover{background:var(--accent);border-color:transparent;color:#fff;transform:translateY(-3px);box-shadow:var(--glow-hover)}
.drawer-open .to-top{opacity:0;pointer-events:none}
@media(max-width:600px){.to-top{right:16px;bottom:calc(16px + env(safe-area-inset-bottom))}}

/* ---- phones ------------------------------------------------------------ */
@media(max-width:600px){
  .hero{padding-top:56px}.eyebrow{letter-spacing:.16em;font-size:.68rem}.eyebrow::before,.eyebrow::after{display:none}.hero-form{flex-direction:column}.hero-form .btn{width:100%}.domain-input{min-width:0}.flow{margin-top:36px;font-size:.82rem;gap:8px}
  .cta .btn{width:100%}.page-head .actions{width:100%}.page-head .actions .btn{flex:1}
  .dz-buttons .btn{width:100%}.release-row .btn,.plan-line .btn{width:100%}
  .card{padding:20px}.stats{grid-template-columns:1fr 1fr}
}
.flash-info{background:rgba(139,92,246,.1);border-color:rgba(139,92,246,.35)}
.promo-box{padding:14px 16px;border:1px solid rgba(139,92,246,.4);background:rgba(139,92,246,.07);border-radius:var(--r);margin:0 0 16px}.promo-box h3{margin:0 0 10px}.promo-box .compare{margin-bottom:10px}.promo-box .compare th{text-align:left;font-weight:600}.promo-box .compare .hl{color:var(--text)}.promo-box .compare td:first-child{color:var(--muted)}
.rm-files{display:flex;flex-wrap:wrap;gap:8px;margin:6px 0}.rm-files a{font-size:.85rem}

/* ---- Continue with Google ---- */
.oauth{margin:0 0 18px}.btn-google{width:100%;gap:10px;background:#fff;color:#1f1f1f;border-color:#dadce0}.btn-google:hover{background:#f3f4f6;color:#1f1f1f}
.or{display:flex;align-items:center;gap:12px;color:var(--muted);font-size:.85rem;margin:16px 0 0}.or::before,.or::after{content:"";flex:1;height:1px;background:var(--line)}

/* ---- paste-to-publish ---- */
.paste-box{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}.paste-box summary{cursor:pointer;list-style:none;display:flex;gap:8px;align-items:baseline;flex-wrap:wrap}.paste-box summary::before{content:"+";color:var(--accent2);font-weight:700}.paste-box[open] summary::before{content:"–"}
.paste-box .form{margin-top:14px}.paste-box textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;line-height:1.45}
.page-input{border-radius:10px;padding:0}.page-input span{padding-left:14px;color:var(--muted);font-weight:500;white-space:nowrap}.page-input input{padding-left:4px}
/* ---- who it's for ---- */
.who .card h3{display:flex;gap:10px;align-items:center}.who .card h3 .ico{font-size:1.2rem}.who .card p{color:var(--text-2)}.who .card .eg{color:var(--muted);font-size:.88rem;margin:0}
.loop{display:grid;gap:14px;grid-template-columns:1fr;margin:28px 0 0}@media(min-width:760px){.loop{grid-template-columns:repeat(3,1fr)}}
.loop .card{text-align:left}.loop code{display:block;margin-top:8px;white-space:normal;overflow-wrap:anywhere}
.ugly{font-family:ui-monospace,Menlo,monospace;font-size:.82rem;color:var(--muted);text-decoration:line-through;overflow-wrap:anywhere}.nice{font-family:ui-monospace,Menlo,monospace;font-size:.95rem;color:var(--ok);overflow-wrap:anywhere}

/* try it (0.8.0) */
.try .try-form{text-align:left;margin-top:8px}.try .try-form textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;line-height:1.45;min-height:160px}.try .try-form .btn{margin-top:4px}
.try-result .try-link{display:flex;gap:14px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:18px 0 10px}.try-result .try-link>a:first-child{font-family:ui-monospace,Menlo,monospace;font-size:1.05rem;color:var(--ok);overflow-wrap:anywhere}
.try-result .keep{margin-top:22px}.try-result .keep select{font:inherit;padding:10px 12px;border-radius:12px;border:1.5px solid var(--line-2);background:rgba(255,255,255,.04);color:var(--text);min-width:220px}

/* try it: two choices, drop anywhere, progress, waiting steps, live frame (Apple treatment: air, pills, depth) */
.try .try-form{position:relative;padding:34px;margin-top:8px;transition:border-color .2s,box-shadow .4s var(--spring)}
.try .try-form.over{border-color:var(--accent);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.18),var(--shadow-md)}
.try-choices{display:grid;gap:18px;grid-template-columns:1fr;margin-bottom:26px}@media(min-width:760px){.try-choices{grid-template-columns:1fr 1fr}}
.try-choices .choice{border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;background:rgba(255,255,255,.02);display:flex;flex-direction:column}.try-choices .choice h3{margin:0 0 10px;font-size:1.15rem}.try-choices .choice p{margin:0 0 18px;line-height:1.55}
.try-choices .file-pick{cursor:pointer;align-self:flex-start}.try-choices .drop-hint{margin:14px 0 0}.try-form textarea{margin-top:0;min-height:170px;flex:1;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.85rem;line-height:1.45}
.try-actions{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin:0 0 6px}.try-actions .muted.warn{color:var(--warn)}
.try-fine{margin:18px 0 0}
.drop-veil{position:absolute;inset:0;border-radius:var(--r-lg);background:rgba(15,16,20,.86);display:none;place-items:center;font-size:1.3rem;font-weight:700;color:#fff;pointer-events:none}.try-form.over .drop-veil{display:grid}
.bar.busy span{width:40%;animation:slide 1.1s ease-in-out infinite}@keyframes slide{0%{transform:translateX(-100%)}100%{transform:translateX(260%)}}
.try-result .try-link{display:flex;gap:16px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:24px 0 12px;padding:22px 26px}.try-result .try-link>a:first-child{font-family:ui-monospace,Menlo,monospace;font-size:1.05rem;color:var(--ok);overflow-wrap:anywhere}
.try-frame-wrap{border:1px solid var(--line-2);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-lg);background:#fff;margin:28px 0 32px}.try-frame{display:block;width:100%;height:min(62vh,560px);border:0;background:#fff}
.try-result .keep{margin-top:8px;padding:30px}.try-result .keep select{font:inherit;padding:12px 14px;border-radius:12px;border:1.5px solid var(--line-2);background:rgba(255,255,255,.04);color:var(--text);min-width:220px}
.steps.wait{grid-template-columns:1fr;margin:24px 0}.steps.wait li.now strong::after{content:"";display:inline-block;width:12px;height:12px;margin-left:10px;border:2px solid var(--accent);border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite;vertical-align:-1px}@keyframes spin{to{transform:rotate(360deg)}}
.sc-temp{margin-top:56px;padding-top:40px;border-top:1px solid var(--line)}.pill-temp{background:rgba(251,191,36,.14);color:var(--warn);margin-right:6px}.showcase.temp .sc-name{font-weight:600;font-family:ui-monospace,Menlo,monospace;font-size:.9rem;overflow-wrap:anywhere}.showcase.temp .sc-title{display:flex;align-items:center;gap:8px;white-space:nowrap;margin-top:6px}.showcase.temp .pill-temp{margin:0;padding:2px 9px;font-size:.66rem}
.steps.waiting li.now strong::after{content:"";display:inline-block;width:12px;height:12px;margin-left:10px;border:2px solid var(--accent);border-right-color:transparent;border-radius:50%;animation:spin .8s linear infinite;vertical-align:-1px}.btn.is-wait{opacity:.6;cursor:default}
.token-fresh{border-color:rgba(var(--accent-rgb),.6);box-shadow:0 0 0 4px rgba(var(--accent-rgb),.12)}.token-fresh .token code{display:block;padding:12px 14px;font-size:.95rem;overflow-wrap:anywhere;user-select:all}.plain-steps{padding-left:20px;margin:0 0 14px}.plain-steps li{margin-bottom:6px}.example{font-size:1.1rem;padding:14px 18px;border-left:3px solid var(--accent);background:rgba(255,255,255,.03);border-radius:0 12px 12px 0}
.host-bar{position:relative;padding:12px 56px;font-size:.92rem;line-height:1.45;border-bottom:1px solid var(--line);text-align:center}.host-bar.warn{background:rgba(251,191,36,.12);color:#fde68a}.host-bar.info{background:rgba(var(--accent-rgb),.12);color:var(--text-2)}.host-bar p{margin:0 auto;max-width:820px}.host-bar p+p{margin-top:6px}.host-bar a{color:inherit;text-decoration:underline}.host-bar button{position:absolute;right:14px;top:50%;transform:translateY(-50%);width:32px;height:32px;border:0;border-radius:50%;background:rgba(255,255,255,.1);color:inherit;font-size:18px;cursor:pointer}
.hero-new-wrap{margin-bottom:14px}.hero-new{display:inline-flex;gap:8px;align-items:center;margin:0 0 22px;padding:6px 14px 6px 8px;border-radius:999px;background:rgba(var(--accent-rgb),.14);color:var(--text);font-size:.85rem;text-decoration:none;border:1px solid rgba(var(--accent-rgb),.35)}.hero-new b{background:var(--accent);color:#fff;padding:2px 9px;border-radius:999px;font-size:.72rem;letter-spacing:.06em;text-transform:uppercase}.hero-new:hover{color:#fff}
@media(max-width:600px){.host-bar{padding:10px 44px 10px 14px;font-size:.85rem;text-align:left}.host-bar button{right:8px}}
/* mobile pass (0.9.8) */
@media(max-width:600px){.try .try-form{padding:22px 16px}.try-choices .choice{padding:18px}.try-actions{flex-direction:column;align-items:stretch}.try-actions .btn{width:100%;text-align:center}
.try-result .try-link{padding:16px}.try-result .try-link .btn{width:100%;text-align:center}.try-frame{height:60vh}.try-result .keep .btn-lg{width:100%;text-align:center}.try-result .keep .form-inline select{width:100%}
.page-head .actions{width:100%;display:flex;gap:8px}.page-head .actions .btn{flex:1;text-align:center}
.table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}}
.domain-box{border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;margin:14px 0}.domain-head{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:8px}.domain-head form{margin-left:auto}.table.dns code{overflow-wrap:anywhere}.flash.small{padding:10px 14px;font-size:.88rem}