/* cipher0ne members theme. Mirrors cipher0ne.com: warm near-black, one acid-lime accent, Space Grotesk. */

@font-face{font-family:"Space Grotesk";font-style:normal;font-weight:300 700;font-display:swap;src:url(../fonts/space-grotesk.woff2) format("woff2")}

:root{
  color-scheme:dark;
  --bg:#0b0a09;--surface:#141210;--field:#100e0c;--line:#2a2521;--line-strong:#6e655d;
  --text:#c4bbb3;--text-strong:#f6f2ed;--muted:#968c83;
  --accent:#d7ff3c;--on-accent:#0b0a09;--focus:#fff27a;--glow-rgb:215,255,60;
  --font-display:"Space Grotesk",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-prose:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --ghost-accent-color:#d7ff3c;
  --s2:8px;--s3:12px;--s4:16px;--s5:24px;--s6:32px;--s7:48px;--s8:72px;
  --pill:10px;--wrap:1180px;--read:680px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;background:var(--bg)}
@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
body{margin:0;background:transparent;color:var(--text);font:400 1rem/1.65 var(--font-display);min-height:100vh;display:flex;flex-direction:column;overflow-x:hidden;-webkit-font-smoothing:antialiased;position:relative}
img,svg,video{max-width:100%;height:auto}
a{color:var(--accent);text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:3px}
:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:6px}
h1,h2,h3,h4{font-family:var(--font-display);color:var(--text-strong);font-weight:700;line-height:1.08;letter-spacing:-.025em;text-wrap:balance;margin:0 0 var(--s4)}
p{margin:0 0 var(--s4)}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;padding:0;margin:-1px}
.skip{position:absolute;left:var(--s4);top:-60px;z-index:100;background:var(--accent);color:var(--on-accent);padding:var(--s2) var(--s4);font-weight:700;border-radius:var(--pill)}
.skip:focus{top:var(--s2);text-decoration:none}
.wrap{width:100%;max-width:var(--wrap);margin:0 auto;padding:0 var(--s4)}
@media (min-width:768px){.wrap{padding:0 var(--s5)}}
.wrap-read{width:100%;max-width:calc(var(--read) + 2*var(--s4));margin-left:auto;margin-right:auto;padding-left:var(--s4);padding-right:var(--s4)}
.wrap-wide{width:100%;max-width:960px;margin:0 auto;padding:0 var(--s4)}
.site-main{flex:1;overflow-x:clip;position:relative}
.muted{color:var(--muted)}.small{font-size:.875rem}
.hl{color:var(--accent);text-shadow:0 0 34px rgba(var(--glow-rgb),.25)}
.lede{font-size:clamp(1.06rem,1rem + .3vw,1.2rem);color:var(--text);max-width:60ch}

/* atmosphere: faint hexagon grid, noise and lime glow blobs, as on the main site */
.fx{position:fixed;inset:0;pointer-events:none;z-index:-1;-webkit-mask-image:radial-gradient(ellipse 85% 65% at 50% 0%,#000,transparent 78%);mask-image:radial-gradient(ellipse 85% 65% at 50% 0%,#000,transparent 78%)}
.fx::before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97' viewBox='0 0 56 97'%3E%3Cpath d='M0.00,-29.00 L25.11,-14.50 L25.11,14.50 L0.00,29.00 L-25.11,14.50 L-25.11,-14.50ZM56.00,-29.00 L81.11,-14.50 L81.11,14.50 L56.00,29.00 L30.89,14.50 L30.89,-14.50ZM28.00,19.50 L53.11,34.00 L53.11,63.00 L28.00,77.50 L2.89,63.00 L2.89,34.00ZM0.00,68.00 L25.11,82.50 L25.11,111.50 L0.00,126.00 L-25.11,111.50 L-25.11,82.50ZM56.00,68.00 L81.11,82.50 L81.11,111.50 L56.00,126.00 L30.89,111.50 L30.89,82.50Z' fill='none' stroke='%23d7ff3c' stroke-width='1' stroke-linejoin='round'/%3E%3C/svg%3E");background-size:56px 97px;opacity:.10}
body::before{content:"";position:fixed;z-index:-2;pointer-events:none;width:620px;height:620px;right:-180px;top:-160px;border-radius:50%;background:radial-gradient(closest-side,rgba(var(--glow-rgb),.13),transparent)}
body::after{content:"";position:fixed;z-index:-2;pointer-events:none;width:560px;height:560px;left:-240px;top:40%;border-radius:50%;background:radial-gradient(closest-side,rgba(150,90,255,.14),transparent)}

.kicker{font:600 11px/1.4 var(--font-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--accent);margin:0 0 var(--s3)}
.micro{font:500 11px/1.4 var(--font-mono);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}

/* header */
.site-header{position:sticky;top:0;z-index:50;border-bottom:1px solid var(--line);background:rgba(11,10,9,.82);-webkit-backdrop-filter:blur(14px) saturate(140%);backdrop-filter:blur(14px) saturate(140%)}
.bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2) var(--s3);min-height:68px}
.brand{display:inline-flex;align-items:center;gap:10px;font:700 1.25rem/1 var(--font-display);color:var(--text-strong);letter-spacing:-.02em;min-height:44px}
.brand:hover{text-decoration:none}
.brand-mark{width:30px;height:30px}
.brand-word b{color:var(--accent);font-weight:700}
.bar-actions{display:flex;align-items:center;gap:var(--s3);margin-left:auto}
.nav{display:flex;order:3;flex:0 0 100%;gap:2px;overflow-x:auto;scrollbar-width:none;padding-bottom:4px}
.nav::-webkit-scrollbar{display:none}
.nav a{color:var(--muted);font:500 15px/1 var(--font-display);padding:0 12px;min-height:44px;display:inline-flex;align-items:center;white-space:nowrap}
.nav a:hover{color:var(--text-strong);text-decoration:none}
@media (min-width:900px){.nav{order:0;flex:0 1 auto;margin-left:var(--s5);padding-bottom:0}.bar-actions{margin-left:auto}}

/* buttons */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:0 28px;border-radius:var(--pill);border:1px solid var(--line-strong);background:transparent;color:var(--text-strong);font:700 16px/1 var(--font-display);letter-spacing:-.01em;cursor:pointer;white-space:nowrap;transition:transform 180ms,box-shadow 180ms,border-color 180ms}
.btn:hover{text-decoration:none;border-color:var(--text-strong)}
.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent);box-shadow:0 8px 28px rgba(var(--glow-rgb),.32),0 0 0 1px rgba(var(--glow-rgb),.4)}
.btn-primary:hover{color:var(--on-accent);border-color:var(--accent);box-shadow:0 10px 38px rgba(var(--glow-rgb),.5),0 0 0 1px rgba(var(--glow-rgb),.6)}
.btn-sm{min-height:42px;padding:0 20px;font-size:15px}
.textlink{display:inline-flex;align-items:center;color:var(--muted);font:500 15px/1.2 var(--font-display);min-height:44px}
.textlink:hover{color:var(--text-strong);text-decoration:none}
.actions{display:flex;flex-wrap:wrap;gap:var(--s4);align-items:center;margin-top:var(--s5)}

/* hero + error pages */
.hero{padding:var(--s8) 0 var(--s8)}
.hero h1{font-size:clamp(2.4rem,1.4rem + 4.4vw,4.3rem);line-height:1.02;letter-spacing:-.035em;margin:0 0 var(--s4)}
.err{padding-top:calc(var(--s8) + var(--s5))}
.plain-list{list-style:none;padding:0;margin:var(--s6) 0;display:grid;gap:var(--s3)}
.plain-list li{border:1px solid var(--line);border-radius:12px;padding:var(--s4);background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.01))}
.plain-list a{color:var(--text-strong);font-weight:600;margin-right:var(--s3)}

/* article */
.article{padding:var(--s7) 0 var(--s8)}
.article-head{margin-bottom:var(--s6)}
.article-title{font-size:clamp(2.2rem,1.4rem + 3.6vw,3.8rem);line-height:1.04;letter-spacing:-.035em;margin:var(--s3) 0 var(--s5)}
.under{display:inline}
.article-title::after{content:"";display:block;width:84px;height:5px;border-radius:4px;background:var(--accent);box-shadow:0 0 16px rgba(var(--glow-rgb),.5);margin-top:var(--s4)}
.article-excerpt{color:var(--text)}
.article-image{margin:0 auto var(--s6)}
.article-image img{border-radius:16px;border:1px solid var(--line)}
.prose{font-family:var(--font-prose);font-size:1.0625rem;line-height:1.72;overflow-wrap:break-word}
.prose h2{font-size:clamp(1.5rem,1.2rem + 1vw,1.9rem);margin:var(--s7) 0 var(--s4)}
.prose h3{font-size:1.3rem;margin:var(--s6) 0 var(--s3)}
.prose strong{color:var(--text-strong)}
.prose a{text-decoration:underline;text-underline-offset:3px}
.prose li{margin-bottom:var(--s2)}
.prose hr{border:0;height:1px;background:linear-gradient(90deg,rgba(var(--glow-rgb),.6),transparent);margin:var(--s7) 0}
.prose blockquote{margin:var(--s5) 0;padding:var(--s4) var(--s5);border:1px solid var(--line);border-left:3px solid var(--accent);border-radius:8px;background:rgba(255,255,255,.02)}
.prose blockquote p:last-child{margin:0}
.prose code{font-family:var(--font-mono);font-size:.88em;background:var(--field);border:1px solid var(--line);border-radius:6px;padding:.1em .4em}
.prose pre{overflow-x:auto;background:var(--field);border:1px solid var(--line);border-radius:12px;padding:var(--s4)}
.prose pre code{border:0;background:none;padding:0}
.prose table{display:block;overflow-x:auto;border-collapse:collapse;max-width:100%}
.prose th,.prose td{padding:10px 12px;border-bottom:1px solid var(--line);text-align:left}
.prose img{border-radius:12px}
.prose figure{margin:var(--s5) 0}
.prose figcaption{font-size:.875rem;color:var(--muted);text-align:center;margin-top:var(--s2)}
.kg-width-wide,.kg-width-full{max-width:100%}
.kg-card.kg-button-card .kg-btn,.kg-btn{background:var(--accent)!important;color:var(--on-accent)!important;border-radius:var(--pill);font-weight:700}
.kg-callout-card{border-radius:12px}

/* paywall: Ghost's own upgrade block is replaced by the .cta-card below it */
.gh-post-upgrade-cta{display:none!important}
.cta-card{position:relative;overflow:hidden;margin:var(--s7) 0 0;border:1px solid rgba(var(--glow-rgb),.4);border-radius:28px;padding:var(--s7) var(--s5);background:radial-gradient(ellipse 70% 90% at 100% 0%,rgba(var(--glow-rgb),.12),transparent 60%),radial-gradient(ellipse 60% 80% at 0% 100%,rgba(150,90,255,.12),transparent 60%),#121010}
.cta-card h2{font-size:clamp(1.6rem,1.2rem + 1.6vw,2.3rem)}
@media (min-width:768px){.cta-card{padding:var(--s8) var(--s7)}}

/* footer */
.site-footer{border-top:1px solid var(--line);padding:var(--s7) 0 var(--s6);font-size:.875rem}
.foot{display:grid;gap:var(--s5)}
@media (min-width:860px){.foot{grid-template-columns:1.4fr 1fr 1fr}}
.foot h2{margin:0 0 var(--s2)}
.foot ul{list-style:none;padding:0;margin:0}
.foot li a{display:inline-flex;min-height:36px;align-items:center;color:var(--text)}
.foot li a:hover{color:var(--accent);text-decoration:none}
.fine{color:var(--muted);font-size:.8125rem;margin:var(--s4) 0 0;max-width:42ch}

@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:1ms!important;transition-duration:1ms!important;scroll-behavior:auto!important}}
@media print{.fx,.site-header,.site-footer{display:none}}
.hero .wrap>*{max-width:760px}