/* Obstat: Divina's gold and indigo on deep space, self-hosted fonts */
@font-face{font-family:"JetBrains Mono";src:url(/fonts/jetbrains-mono.woff2) format("woff2");font-weight:100 800;font-display:swap}
@font-face{font-family:"Instrument Sans";src:url(/fonts/instrument-sans.woff2) format("woff2");font-weight:400 700;font-display:swap}
@font-face{font-family:Michroma;src:url(/fonts/michroma.woff2) format("woff2");font-weight:400;font-display:swap}

:root{
  --ink:#0b0a12; --panel:#13121d; --panel2:#1c1a29; --line:#2b2840; --dim:#9a96b3; --bone:#ece9f7;
  --acc:#d9b46a; --acc-ink:#1a1206; --indigo:#8f8cf5; --ok:#9ad7b0; --amber:#ff9d7a;
  --mono:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  --ui:"Instrument Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ease-out:cubic-bezier(0.23,1,0.32,1);
  color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(1.2px 1.2px at 12% 18%,rgba(236,233,247,.55),transparent 60%),radial-gradient(1px 1px at 78% 32%,rgba(236,233,247,.4),transparent 60%),radial-gradient(1.4px 1.4px at 42% 8%,rgba(217,180,106,.6),transparent 60%),radial-gradient(1px 1px at 92% 64%,rgba(236,233,247,.35),transparent 60%),radial-gradient(1px 1px at 6% 72%,rgba(143,140,245,.5),transparent 60%),radial-gradient(900px 520px at 85% -10%,rgba(217,180,106,.14),transparent 60%),radial-gradient(700px 460px at -10% 30%,rgba(143,140,245,.10),transparent 60%),var(--ink);background-attachment:fixed;color:var(--bone);font:16px/1.6 var(--ui);-webkit-font-smoothing:antialiased}
main{max-width:1040px;margin:0 auto;padding:28px 16px 72px}
a{color:var(--indigo)}
:focus-visible{outline:2px solid var(--indigo);outline-offset:2px}
::selection{background:var(--acc);color:var(--acc-ink)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.muted{color:var(--dim)}
code{font-family:var(--mono);font-size:.88em}

nav{display:flex;justify-content:space-between;align-items:center;gap:12px;font-family:var(--mono);font-size:14px}
nav a{text-decoration:none}
nav .home{color:var(--bone);font-weight:600}
nav .home b{color:var(--indigo);font-weight:600}
nav .home{display:inline-flex;align-items:center;gap:8px}
nav .logo{display:block;border-radius:7px}

header{margin:56px 0 36px}
.eyebrow{font-family:var(--mono);font-size:13px;color:var(--indigo);margin:0}
h1{font-family:Michroma,var(--ui);font-weight:400;font-size:clamp(30px,6vw,56px);line-height:1.12;letter-spacing:-.01em;margin:14px 0 18px}
h1 em{font-style:normal;color:var(--acc)}
h2{font-size:20px;margin:0 0 14px}
.lead{font-size:18px;color:var(--dim);max-width:36em;margin:0}

.panel{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:20px;margin-bottom:48px}
.field{display:flex;gap:10px}
input,select{font:inherit;color:var(--bone);background:var(--ink);border:1px solid var(--line);border-radius:10px;min-height:46px;padding:0 14px;min-width:0}
input:focus,select:focus{border-color:var(--indigo);outline:none}
.field input{flex:1;font-family:var(--mono);font-size:15px}
.btn{all:unset;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:46px;padding:0 20px;border-radius:10px;font-weight:650;cursor:pointer;background:var(--acc);color:var(--acc-ink);text-decoration:none;white-space:nowrap;transition:transform .12s var(--ease-out),opacity .15s}
.btn:active{transform:scale(.97)}
.btn:focus-visible{outline:2px solid var(--bone);outline-offset:2px}
.btn[disabled]{opacity:.5;cursor:default}
.btn.ghost{background:transparent;color:var(--bone);border:1px solid var(--line)}
.btn.small{min-height:36px;padding:0 14px;font-size:14px;border-radius:8px}
.status{min-height:1.6em;margin:10px 0 0;font-size:14px;color:var(--dim)}
.status.err{color:#ff8a8a}

.result{margin-top:16px;border-top:1px solid var(--line);padding-top:18px}
.result h3{margin:0 0 4px;font-size:18px}
.result .actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.steps{margin:10px 0 0;padding-left:20px;color:var(--dim)}
.steps li{margin:4px 0}
.tabs{display:flex;gap:4px;margin-top:16px;flex-wrap:wrap}
.tabs button{all:unset;cursor:pointer;font-family:var(--mono);font-size:13px;padding:7px 12px;border-radius:8px 8px 0 0;color:var(--dim);background:var(--panel2)}
.tabs button[aria-selected="true"]{color:var(--acc-ink);background:var(--acc)}
.tabs button:focus-visible{outline:2px solid var(--indigo)}
.code{position:relative;background:var(--ink);border:1px solid var(--line);border-radius:0 10px 10px 10px}
.code pre{margin:0;padding:16px;overflow:auto;max-height:360px;font:13px/1.55 var(--mono);color:#d9d5f5}
.code .btn{position:absolute;top:10px;right:10px}

.list-head{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:6px}
.list-head h2{margin:0}
.tools{display:flex;gap:8px}
.tools input{width:200px}
.warn{font-size:14px;color:var(--dim);margin:6px 0 18px}

.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(290px,1fr));gap:14px}
.card{display:flex;flex-direction:column;background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px}
.card-top{display:flex;align-items:center;gap:12px}
.mark{flex:none;width:40px;height:40px;border-radius:10px;display:grid;place-items:center;font:600 16px var(--mono);color:var(--acc-ink);background:linear-gradient(135deg,var(--acc),var(--indigo))}
.card h3{margin:0;font-size:16px;line-height:1.3;overflow-wrap:anywhere}
.card .by{font-family:var(--mono);font-size:12px;color:var(--dim);overflow-wrap:anywhere}
.card p.desc{margin:12px 0;font-size:14px;color:#c9c5dc;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.meta{display:flex;flex-wrap:wrap;gap:6px 12px;font-family:var(--mono);font-size:12px;color:var(--dim);margin-bottom:12px}
.badge{border-radius:999px;padding:1px 8px;border:1px solid var(--line)}
.badge.ok{color:var(--ok);border-color:rgba(154,215,176,.4)}
.badge.warn{color:var(--amber);border-color:rgba(255,157,122,.38)}
h2.gap{margin-top:40px}
.gap-s{margin-top:10px}
.card .push{margin-top:auto}
.card-err,.card-note{margin:0;font-size:13px;color:#ff8a8a}
.card-note{color:var(--dim)}
.card-err:not(:empty),.card-note:not(:empty){margin-top:10px}
.card .actions{display:flex;gap:8px}
.card .actions .btn{flex:1}
.empty{grid-column:1/-1;color:var(--dim)}

footer{margin-top:64px;font-size:14px;color:var(--dim)}

@media (max-width:560px){
  .field{flex-direction:column}
  .tools{width:100%}
  .tools input{flex:1;width:auto}
}
@media (prefers-reduced-motion:reduce){.btn{transition:none}}

/* obstat.app home */
.navlinks{display:flex;gap:18px}
.hero{margin-bottom:56px}
.get{margin-top:30px;max-width:560px}
.btn.big{min-height:56px;padding:0 28px;font-size:17px}
.small{font-size:14px;margin:10px 0 0}
.soon-tag{display:inline-block;font-family:var(--mono);font-size:13px;color:var(--acc);border:1px solid rgba(217,180,106,.45);border-radius:999px;padding:3px 12px;margin:0 0 14px}
.features{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.features article{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:18px}
.features h3{margin:0 0 6px;font-size:17px}
.features p{margin:0;color:var(--dim);font-size:15px}
.chips{list-style:none;padding:0;margin:0 0 14px;display:flex;flex-wrap:wrap;gap:8px}
.chips li{font-family:var(--mono);font-size:13px;border:1px solid var(--line);background:var(--panel);border-radius:999px;padding:5px 12px}
.chips.dim li{color:var(--dim);border-style:dashed;background:transparent}
.newslist{display:grid;gap:12px}
.news{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 18px}
.news.is-open{border-color:rgba(255,157,122,.55)}
.news .kind{font-family:var(--mono);font-size:12px;color:var(--indigo);margin:0}
.news h3{margin:4px 0;font-size:17px}
.news p{margin:0;color:var(--dim)}
@media (max-width:560px){ .navlinks{gap:12px} .get .field{flex-direction:column} }
.check{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--dim);margin:8px 0 0;cursor:pointer}