/* Shared style for the sanitized zine reading copies (deep-link targets). */ :root { --bg:#0c120e; --surface:#141b16; --surface-2:#1a231c; --text:#e9f0ea; --fg-strong:#fff; --muted:#9fb0a4; --line:rgba(255,255,255,.12); --accent:#34d399; /* overridden per-zine via inline style on */ } * { box-sizing:border-box; margin:0; padding:0; } html { scroll-behavior:smooth; } body { font-family:ui-monospace, "SF Mono", Menlo, Consolas, monospace; background:var(--bg); color:var(--text); line-height:1.62; -webkit-font-smoothing:antialiased; padding:0 20px calc(60px + env(safe-area-inset-bottom)); } .wrap { max-width:760px; margin:0 auto; } header.z { padding:44px 0 22px; margin-bottom:8px; border-bottom:1px solid var(--line); } header.z .kicker { font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:var(--accent); } header.z h1 { font-size:clamp(28px,6vw,42px); font-weight:800; line-height:1.1; margin:12px 0 6px; color:var(--fg-strong); letter-spacing:.01em; } header.z .by { color:var(--muted); font-size:13px; } header.z .intro { margin-top:16px; font-size:15px; color:var(--text); } .backlink { display:inline-block; margin:22px 0 0; font-size:13px; color:var(--accent); text-decoration:none; } .backlink:hover { text-decoration:underline; } section.s { padding:30px 0; border-bottom:1px solid var(--line); scroll-margin-top:20px; } section.s > .n { font-size:12px; letter-spacing:.16em; color:var(--accent); font-weight:700; } section.s > h2 { font-size:clamp(20px,4.4vw,26px); font-weight:800; color:var(--fg-strong); margin:6px 0 14px; } section.s h3 { font-size:15px; color:var(--fg-strong); margin:20px 0 8px; } section.s p { margin:12px 0; } section.s ul, section.s ol { margin:12px 0 12px 22px; } section.s li { margin:6px 0; } b, strong { color:var(--fg-strong); } em { color:var(--accent); font-style:normal; } a { color:var(--accent); } code { background:rgba(255,255,255,.08); border-radius:5px; padding:1px 6px; font-size:.9em; color:var(--accent); } .quote { border-left:3px solid var(--accent); background:var(--surface); border-radius:0 12px 12px 0; padding:14px 18px; margin:18px 0; font-size:15px; } .quote .who { display:block; margin-top:8px; font-size:12px; color:var(--muted); letter-spacing:.04em; } table { width:100%; border-collapse:separate; border-spacing:0; margin:16px 0; font-size:14px; background:var(--surface); border:1px solid var(--line); border-radius:12px; overflow:hidden; } th { text-align:left; font-size:11px; text-transform:uppercase; letter-spacing:.1em; color:var(--accent); padding:9px 12px; border-bottom:1px solid var(--line); background:var(--surface-2); } td { padding:9px 12px; border-bottom:1px solid rgba(255,255,255,.07); vertical-align:top; } tr:last-child td { border-bottom:none; } td b { color:var(--fg-strong); } .kv { display:grid; grid-template-columns:minmax(120px,1fr) 2fr; gap:0; border:1px solid var(--line); border-radius:12px; overflow:hidden; margin:16px 0; background:var(--surface); } .kv dt { padding:9px 12px; border-bottom:1px solid rgba(255,255,255,.07); color:var(--accent); font-weight:700; font-size:13px; } .kv dd { padding:9px 12px; border-bottom:1px solid rgba(255,255,255,.07); font-size:14px; } .kv dt:last-of-type, .kv dd:last-of-type { border-bottom:none; } .note { background:var(--surface-2); border:1px solid var(--line); border-left:3px solid var(--accent); border-radius:0 12px 12px 0; padding:12px 16px; margin:18px 0; font-size:14px; } footer.z { padding:26px 0 10px; color:var(--muted); font-size:12px; } footer.z a { color:var(--accent); } .gv-link { margin:0 0 18px; } .gv-link a { display:inline-block; padding:10px 18px; border-radius:999px; border:1px solid var(--accent); color:var(--accent); text-decoration:none; font-weight:700; } .gv-link a:hover { background:color-mix(in srgb, var(--accent) 14%, transparent); }