:root {
  --bg: #07070a;
  --bg-soft: #0d0d12;
  --panel: rgba(17, 17, 24, .72);
  --panel-solid: #111118;
  --line: rgba(255, 255, 255, .085);
  --line-strong: rgba(255, 255, 255, .14);
  --text: #f7f7fb;
  --muted: #a3a3b2;
  --dim: #737383;
  --violet: #8b5cf6;
  --violet-2: #6d5dfc;
  --cyan: #55d9ff;
  --pink: #ef5da8;
  --green: #51e6a8;
  --amber: #f8c65d;
  --danger: #ff6b81;
  --shadow: 0 28px 90px rgba(0, 0, 0, .42);
  --radius-xl: 26px;
  --radius-lg: 20px;
  --radius-md: 14px;
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  min-width: 320px;
  min-height: 100vh;
  overflow-x: hidden;
  background: var(--bg);
  color: var(--text);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; text-decoration: none; }
svg { fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }

.noise {
  position: fixed;
  inset: 0;
  z-index: -1;
  opacity: .035;
  pointer-events: none;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.9'/%3E%3C/svg%3E");
}
.ambient { position: fixed; z-index: -2; border-radius: 999px; filter: blur(110px); pointer-events: none; opacity: .22; }
.ambient-a { width: 680px; height: 420px; top: -160px; left: 12%; background: #5734d8; transform: rotate(-14deg); }
.ambient-b { width: 620px; height: 420px; top: 340px; right: -260px; background: #154a7d; transform: rotate(20deg); opacity: .18; }

.shell { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.glass-panel {
  background: linear-gradient(180deg, rgba(24, 24, 33, .82), rgba(12, 12, 18, .74));
  border: 1px solid var(--line);
  box-shadow: var(--shadow), inset 0 1px 0 rgba(255,255,255,.035);
  backdrop-filter: blur(22px) saturate(130%);
}

.topbar { height: 82px; display: flex; align-items: center; justify-content: space-between; }
.brand { display: inline-flex; align-items: center; gap: 11px; font-weight: 760; letter-spacing: -.025em; font-size: 18px; }
.brand-mark { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 10px; background: linear-gradient(145deg, #9776ff, #6357f0); box-shadow: 0 10px 28px rgba(114, 87, 239, .34), inset 0 1px 0 rgba(255,255,255,.35); }
.brand-mark svg { width: 21px; stroke: none; fill: white; }
.brand-mark.small { width: 29px; height: 29px; }
.top-actions { display: flex; align-items: center; gap: 22px; }
.nav-link { border: 0; background: none; color: var(--muted); cursor: pointer; transition: .2s ease; padding: 8px 0; font-size: 14px; }
.nav-link:hover { color: var(--text); }
.status-pill { display: inline-flex; align-items: center; gap: 8px; color: #c7c7d3; font-size: 12px; padding: 7px 11px; border: 1px solid var(--line); border-radius: 999px; background: rgba(255,255,255,.03); }
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 4px rgba(81,230,168,.1); }

.hero { padding: 88px 0 80px; text-align: center; }
.hero-copy { max-width: 920px; margin: 0 auto 42px; }
.eyebrow { display: inline-flex; align-items: center; gap: 8px; color: #c0b7e9; font-size: 12px; font-weight: 700; letter-spacing: .11em; text-transform: uppercase; }
.spark { color: #aa8fff; font-size: 15px; }
h1 { margin: 20px 0 22px; font-size: clamp(48px, 7vw, 86px); line-height: .99; letter-spacing: -.065em; font-weight: 760; }
.gradient-text { background: linear-gradient(95deg, #f7f3ff 4%, #bca8ff 48%, #66dfff 105%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.hero-sub { max-width: 760px; margin: 0 auto; color: var(--muted); font-size: clamp(17px, 2vw, 21px); line-height: 1.65; letter-spacing: -.01em; }

.input-card { max-width: 1000px; margin: 0 auto; border-radius: var(--radius-xl); text-align: left; overflow: hidden; }
#thread-form { padding: 24px 24px 18px; }
#thread-form > label { display: block; margin: 0 0 10px 2px; color: #dedee6; font-size: 13px; font-weight: 650; }
.input-row { display: grid; grid-template-columns: 1fr auto; gap: 12px; }
.url-field-wrap { position: relative; min-width: 0; }
.url-field-wrap input { width: 100%; height: 58px; border: 1px solid var(--line-strong); background: rgba(7,7,11,.72); color: var(--text); border-radius: 16px; outline: none; padding: 0 48px 0 48px; font-size: 16px; transition: .2s ease; box-shadow: inset 0 1px 0 rgba(255,255,255,.025); }
.url-field-wrap input::placeholder { color: #686877; }
.url-field-wrap input:focus { border-color: rgba(139,92,246,.78); box-shadow: 0 0 0 4px rgba(139,92,246,.1), inset 0 1px 0 rgba(255,255,255,.04); }
.field-icon { position: absolute; left: 17px; top: 18px; width: 22px; color: #7f7f90; pointer-events: none; }
.clear-input { position: absolute; right: 13px; top: 13px; width: 32px; height: 32px; border: 0; border-radius: 10px; background: transparent; color: #828292; font-size: 22px; cursor: pointer; opacity: 0; transition: .2s; }
.url-field-wrap.has-value .clear-input { opacity: 1; }
.clear-input:hover { background: rgba(255,255,255,.06); color: white; }
.primary-button { height: 58px; min-width: 178px; display: inline-flex; align-items: center; justify-content: center; gap: 10px; padding: 0 21px; border: 0; border-radius: 16px; background: linear-gradient(135deg, #8f62ff, #6955f5); color: white; font-weight: 720; cursor: pointer; box-shadow: 0 13px 36px rgba(113,82,244,.35), inset 0 1px 0 rgba(255,255,255,.32); transition: transform .2s ease, filter .2s ease, box-shadow .2s ease; }
.primary-button:hover { transform: translateY(-1px); filter: brightness(1.08); box-shadow: 0 17px 42px rgba(113,82,244,.42), inset 0 1px 0 rgba(255,255,255,.34); }
.primary-button:active { transform: translateY(1px); }
.primary-button svg { width: 20px; }
.primary-button.loading { pointer-events: none; }
.primary-button.loading .button-label, .primary-button.loading > svg { display: none; }
.button-loader { display: none; width: 20px; height: 20px; border: 2px solid rgba(255,255,255,.34); border-top-color: white; border-radius: 50%; animation: spin .7s linear infinite; }
.primary-button.loading .button-loader { display: inline-block; }
@keyframes spin { to { transform: rotate(360deg); } }
.input-footer { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-top: 16px; }
.quick-presets { display: inline-flex; gap: 5px; padding: 4px; background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.055); border-radius: 12px; }
.preset { border: 0; background: transparent; color: #888897; padding: 8px 12px; border-radius: 9px; font-size: 12px; font-weight: 650; cursor: pointer; transition: .2s; }
.preset:hover { color: #d9d9e2; }
.preset.active { color: white; background: rgba(255,255,255,.085); box-shadow: inset 0 1px 0 rgba(255,255,255,.06); }
.text-button { border: 0; background: transparent; color: #aaa0d8; display: inline-flex; align-items: center; gap: 7px; cursor: pointer; font-size: 13px; padding: 7px 3px; }
.text-button:hover { color: #d8ccff; }
.text-button svg { width: 15px; }
.advanced-strip { border-top: 1px solid var(--line); background: rgba(0,0,0,.11); }
.advanced-toggle { width: 100%; border: 0; background: transparent; color: #9d9dac; padding: 14px 24px; display: flex; align-items: center; justify-content: space-between; cursor: pointer; font-size: 12px; }
.advanced-toggle > span { display: flex; align-items: center; gap: 8px; }
.advanced-toggle svg { width: 17px; }
.advanced-toggle .chevron { transition: transform .25s ease; }
.advanced-toggle[aria-expanded="true"] .chevron { transform: rotate(180deg); }
.advanced-panel { padding: 5px 24px 20px; display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 24px; align-items: center; }
.setting-group label { display: flex; justify-content: space-between; color: #aaaab8; font-size: 12px; margin-bottom: 7px; }
.setting-group input { width: 100%; accent-color: var(--violet); }
.switch-row { display: flex; align-items: center; gap: 9px; color: #b1b1bd; font-size: 12px; cursor: pointer; }
.switch-row input { position: absolute; opacity: 0; pointer-events: none; }
.switch { position: relative; width: 33px; height: 19px; border-radius: 999px; background: #2c2c36; border: 1px solid rgba(255,255,255,.08); transition: .2s; flex: 0 0 auto; }
.switch::after { content: ""; position: absolute; width: 13px; height: 13px; left: 2px; top: 2px; border-radius: 50%; background: #9595a1; transition: .2s; }
.switch-row input:checked + .switch { background: #7458ef; }
.switch-row input:checked + .switch::after { transform: translateX(14px); background: white; }
.trust-row { display: flex; align-items: center; justify-content: center; gap: 32px; margin-top: 22px; color: #767684; font-size: 12px; }
.trust-row span { display: flex; align-items: center; gap: 7px; }
.trust-row svg { width: 16px; color: #9797a4; }

.workspace { padding: 10px 0 95px; scroll-margin-top: 20px; }
.workspace-toolbar { min-height: 74px; border-radius: 19px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 12px 16px; position: sticky; top: 12px; z-index: 15; }
.result-identity { display: flex; align-items: center; gap: 12px; min-width: 0; }
.result-identity img { width: 43px; height: 43px; object-fit: cover; border-radius: 13px; background: #252530; border: 1px solid rgba(255,255,255,.1); }
.result-title-row { display: flex; align-items: center; gap: 6px; }
.result-title-row strong { font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 290px; }
.result-identity span { color: #858594; font-size: 11px; }
.verified-badge { color: #7bb9ff !important; font-weight: 800; }
.toolbar-actions { display: flex; align-items: center; gap: 8px; }
.segmented { display: flex; align-items: center; padding: 3px; background: rgba(0,0,0,.24); border: 1px solid var(--line); border-radius: 11px; }
.segment { width: 31px; height: 29px; border: 0; background: transparent; color: #342f4b; cursor: pointer; border-radius: 8px; font-size: 22px; line-height: 1; }
.segment:nth-child(2) { color: #e8e0d0; }
.segment:nth-child(3) { color: #15151a; }
.segment.active { background: rgba(255,255,255,.1); box-shadow: inset 0 1px 0 rgba(255,255,255,.08); }
.icon-button { width: 38px; height: 38px; border-radius: 11px; display: grid; place-items: center; border: 1px solid var(--line); background: rgba(255,255,255,.03); color: #a2a2af; cursor: pointer; transition: .2s; }
.icon-button:hover { color: white; border-color: var(--line-strong); background: rgba(255,255,255,.06); }
.icon-button svg { width: 17px; }
.secondary-button { height: 38px; padding: 0 13px; border-radius: 11px; border: 1px solid var(--line); background: rgba(255,255,255,.045); color: #d4d4dd; cursor: pointer; font-size: 12px; font-weight: 650; }
.secondary-button:hover { background: rgba(255,255,255,.075); }
.workspace-grid { display: grid; grid-template-columns: 245px minmax(0, 1fr); gap: 20px; margin-top: 20px; align-items: start; }
.control-panel { border-radius: 19px; padding: 7px 0; position: sticky; top: 106px; }
.panel-section { padding: 16px 18px 18px; border-bottom: 1px solid var(--line); }
.panel-section:last-of-type { border-bottom: 0; }
.section-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 13px; color: #ededf3; font-size: 11px; font-weight: 750; letter-spacing: .08em; text-transform: uppercase; }
.tiny-link { border: 0; background: transparent; color: #777787; padding: 0; cursor: pointer; text-transform: none; letter-spacing: 0; font-size: 10px; }
.tiny-link:hover { color: white; }
.control-check { display: flex; align-items: center; gap: 10px; color: #a8a8b4; font-size: 12px; margin: 11px 0; cursor: pointer; }
.control-check input { position: absolute; opacity: 0; }
.control-check > span { width: 16px; height: 16px; border: 1px solid #41414c; border-radius: 5px; position: relative; background: rgba(0,0,0,.2); }
.control-check input:checked + span { border-color: #785cf0; background: #785cf0; }
.control-check input:checked + span::after { content: ""; position: absolute; width: 7px; height: 4px; left: 3px; top: 4px; border-left: 1.5px solid white; border-bottom: 1.5px solid white; transform: rotate(-45deg); }
.select-label { display: block; color: #858593; font-size: 10px; margin: 12px 0; text-transform: uppercase; letter-spacing: .06em; }
.select-label select { width: 100%; margin-top: 6px; height: 38px; padding: 0 10px; border: 1px solid var(--line); border-radius: 10px; color: #cfcfd8; background: #111117; outline: none; font-size: 12px; text-transform: none; letter-spacing: 0; }
.stats-panel { padding-bottom: 14px; }
.stat-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.stat-grid div { padding: 10px; border-radius: 10px; background: rgba(255,255,255,.027); border: 1px solid rgba(255,255,255,.04); }
.stat-grid strong { display: block; font-size: 17px; letter-spacing: -.02em; }
.stat-grid span { color: #777785; font-size: 9px; text-transform: uppercase; letter-spacing: .06em; }
.source-note { display: flex; align-items: flex-start; gap: 9px; color: #696978; padding: 15px 18px; font-size: 10px; line-height: 1.5; }
.source-note svg { width: 15px; flex: 0 0 auto; margin-top: 1px; }
.preview-column { min-width: 0; }
.preview-shell { --doc-bg: #101015; --doc-card: #17171e; --doc-line: rgba(255,255,255,.09); --doc-text: #f1f1f5; --doc-muted: #8c8c99; background: var(--doc-bg); color: var(--doc-text); border: 1px solid rgba(255,255,255,.08); border-radius: 22px; overflow: hidden; box-shadow: 0 35px 100px rgba(0,0,0,.37); transition: background .25s, color .25s; }
.preview-shell.theme-paper { --doc-bg: #f4f0e8; --doc-card: #fffdf8; --doc-line: rgba(47,39,28,.13); --doc-text: #211f1b; --doc-muted: #746f67; color-scheme: light; }
.preview-shell.theme-ink { --doc-bg: #e9e9e7; --doc-card: #f7f7f5; --doc-line: rgba(0,0,0,.15); --doc-text: #111114; --doc-muted: #5f5f65; color-scheme: light; }
.preview-header { min-height: 155px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 38px 44px 30px; border-bottom: 1px solid var(--doc-line); background: radial-gradient(circle at 88% -10%, rgba(119,86,240,.24), transparent 44%); }
.preview-kicker { color: #8d76eb; font-size: 9px; font-weight: 780; letter-spacing: .14em; }
.preview-header h2 { margin: 8px 0 3px; font-size: clamp(25px, 4vw, 38px); letter-spacing: -.04em; line-height: 1.1; }
.preview-header p { margin: 0; color: var(--doc-muted); font-size: 12px; }
.preview-date { color: var(--doc-muted); font-size: 10px; text-align: right; white-space: nowrap; }
.thread-list { padding: 12px 44px 28px; }
.post-card { display: grid; grid-template-columns: 24px 1fr; gap: 12px; position: relative; }
.thread-rail { display: flex; flex-direction: column; align-items: center; }
.rail-dot { width: 8px; height: 8px; margin-top: 30px; border-radius: 50%; background: #8570e6; border: 2px solid var(--doc-bg); box-shadow: 0 0 0 1px #8570e6; z-index: 1; }
.rail-line { flex: 1; width: 1px; background: var(--doc-line); min-height: 20px; }
.post-card:last-child .rail-line { background: linear-gradient(var(--doc-line), transparent); }
.post-content { padding: 21px 0 24px; border-bottom: 1px solid var(--doc-line); min-width: 0; }
.post-card:last-child .post-content { border-bottom: 0; }
.post-header { display: grid; grid-template-columns: 38px minmax(0, 1fr) auto; align-items: center; gap: 10px; margin-bottom: 14px; }
.post-avatar { width: 38px; height: 38px; border-radius: 12px; object-fit: cover; background: #25252d; }
.post-author { min-width: 0; }
.post-author > div { display: flex; align-items: center; gap: 5px; }
.post-name { display: block; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.post-verified { color: #419cff; font-size: 10px; }
.post-handle { display: block; color: var(--doc-muted); font-size: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.post-time { color: var(--doc-muted); font-size: 9px; white-space: nowrap; }
.post-text { font-size: 15px; line-height: 1.67; white-space: pre-wrap; overflow-wrap: anywhere; letter-spacing: -.006em; }
.post-text a { color: #8c7af0; text-decoration: underline; text-decoration-color: rgba(140,122,240,.35); text-underline-offset: 3px; }
.post-embed { margin-top: 15px; }
.media-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 5px; border-radius: 14px; overflow: hidden; border: 1px solid var(--doc-line); }
.media-grid.one { grid-template-columns: 1fr; }
.media-grid.three img:first-child { grid-row: span 2; }
.media-grid img { width: 100%; height: 210px; object-fit: cover; background: rgba(255,255,255,.03); cursor: zoom-in; }
.media-grid.one img { height: auto; max-height: 620px; object-fit: contain; }
.video-card { overflow: hidden; border-radius: 14px; border: 1px solid var(--doc-line); background: rgba(0,0,0,.18); }
.video-card video { width: 100%; max-height: 580px; background: #000; display: block; }
.video-poster { position: relative; }
.video-poster img { width: 100%; max-height: 540px; object-fit: cover; }
.video-play { position: absolute; inset: 50% auto auto 50%; transform: translate(-50%,-50%); width: 52px; height: 52px; display: grid; place-items: center; border-radius: 50%; background: rgba(0,0,0,.7); backdrop-filter: blur(8px); }
.video-play svg { width: 21px; margin-left: 3px; }
.external-card, .quote-card { display: grid; grid-template-columns: 96px 1fr; min-height: 96px; overflow: hidden; border: 1px solid var(--doc-line); border-radius: 14px; background: rgba(255,255,255,.025); }
.external-card.no-thumb, .quote-card { grid-template-columns: 1fr; }
.external-card img { width: 96px; height: 100%; object-fit: cover; }
.external-copy, .quote-copy { padding: 13px 15px; min-width: 0; }
.external-copy strong, .quote-copy strong { display: block; font-size: 12px; line-height: 1.35; margin-bottom: 4px; }
.external-copy p, .quote-copy p { margin: 0; color: var(--doc-muted); font-size: 10px; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.external-copy span { display: block; margin-top: 8px; color: var(--doc-muted); font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.quote-meta { color: #8a79e6; font-size: 9px; margin-bottom: 8px; }
.post-metrics { display: flex; gap: 15px; margin-top: 14px; color: var(--doc-muted); font-size: 9px; }
.post-metrics span { display: inline-flex; align-items: center; gap: 4px; }
.post-metrics svg { width: 12px; }
.post-source { display: inline-flex; align-items: center; gap: 4px; margin-top: 13px; color: var(--doc-muted); font-size: 9px; opacity: .75; }
.post-source:hover { color: #8a79e6; opacity: 1; }
.post-source svg { width: 11px; }
.preview-footer { display: flex; justify-content: space-between; gap: 20px; padding: 17px 44px; border-top: 1px solid var(--doc-line); color: var(--doc-muted); font-size: 9px; }
.density-compact .thread-list { padding-top: 4px; padding-bottom: 15px; }
.density-compact .post-content { padding: 14px 0 16px; }
.density-compact .post-header { margin-bottom: 9px; }
.density-compact .post-text { font-size: 13px; line-height: 1.5; }
.density-airy .post-content { padding: 30px 0 34px; }
.density-airy .post-text { line-height: 1.8; }
.export-dock { margin-top: 20px; min-height: 84px; border-radius: 19px; padding: 12px 14px 12px 16px; display: flex; align-items: center; justify-content: space-between; gap: 16px; position: sticky; bottom: 14px; z-index: 14; }
.dock-copy { display: flex; align-items: center; gap: 12px; }
.dock-icon { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 12px; background: rgba(129,96,246,.14); color: #a78bfa; }
.dock-icon svg { width: 19px; }
.dock-copy strong { display: block; font-size: 13px; }
.dock-copy span { color: #7f7f8e; font-size: 10px; }
.export-actions { display: flex; align-items: stretch; gap: 8px; }
.export-button { min-height: 58px; display: flex; align-items: center; gap: 10px; padding: 8px 13px; border-radius: 13px; border: 1px solid var(--line); background: rgba(255,255,255,.035); cursor: pointer; text-align: left; transition: .2s; }
.export-button:hover { background: rgba(255,255,255,.065); border-color: var(--line-strong); transform: translateY(-1px); }
.export-button.featured { background: linear-gradient(135deg, #8660f4, #6754e6); border-color: transparent; box-shadow: 0 12px 30px rgba(105,84,230,.28), inset 0 1px 0 rgba(255,255,255,.28); }
.export-button.featured:hover { filter: brightness(1.07); }
.format-icon { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: rgba(255,255,255,.11); font-size: 9px; font-weight: 800; letter-spacing: .04em; }
.export-button strong { display: block; font-size: 11px; white-space: nowrap; }
.export-button small { display: block; margin-top: 1px; color: rgba(255,255,255,.55); font-size: 9px; white-space: nowrap; }
.menu-arrow { width: 14px; margin-left: 5px; color: #777786; }
.export-menu-wrap { position: relative; }
.export-menu { position: absolute; right: 0; bottom: calc(100% + 10px); width: 270px; padding: 7px; border: 1px solid var(--line-strong); border-radius: 15px; background: #15151c; box-shadow: 0 24px 70px rgba(0,0,0,.55); }
.export-menu button { width: 100%; display: flex; align-items: center; gap: 10px; border: 0; border-radius: 10px; background: transparent; padding: 9px; color: white; cursor: pointer; text-align: left; }
.export-menu button:hover { background: rgba(255,255,255,.06); }
.export-menu button strong { display: block; font-size: 11px; }
.export-menu button small { display: block; color: #777786; font-size: 9px; margin-top: 1px; }
.menu-format { width: 33px; height: 33px; display: grid; place-items: center; border-radius: 9px; font-size: 8px; font-weight: 800; }
.menu-format.red { background: rgba(255,85,107,.13); color: #ff778c; }
.menu-format.blue { background: rgba(70,155,255,.14); color: #69adff; }
.menu-format.purple { background: rgba(147,94,255,.14); color: #ab88ff; }
.menu-format.gray { background: rgba(255,255,255,.08); color: #bcbcc6; }
.menu-format.green { background: rgba(70,220,157,.13); color: #62e8ad; }
.menu-format.yellow { background: rgba(248,198,93,.13); color: #f8cf71; }

.features { padding: 105px 0 90px; }
.section-intro { max-width: 680px; }
.section-intro h2, .how-copy h2 { margin: 15px 0 14px; font-size: clamp(36px, 5vw, 58px); line-height: 1.05; letter-spacing: -.052em; }
.section-intro p, .how-copy p { color: var(--muted); font-size: 16px; }
.feature-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 48px; }
.feature-card { min-height: 265px; border: 1px solid var(--line); border-radius: 20px; padding: 24px; background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.014)); transition: .25s; }
.feature-card:hover { transform: translateY(-4px); border-color: var(--line-strong); background: linear-gradient(180deg, rgba(255,255,255,.055), rgba(255,255,255,.018)); }
.feature-icon { width: 43px; height: 43px; display: grid; place-items: center; border-radius: 13px; margin-bottom: 42px; }
.feature-icon svg { width: 21px; }
.feature-icon.violet { color: #a991ff; background: rgba(139,92,246,.12); }
.feature-icon.cyan { color: #67ddff; background: rgba(85,217,255,.1); }
.feature-icon.pink { color: #ff86bf; background: rgba(239,93,168,.11); }
.feature-icon.amber { color: #ffd57b; background: rgba(248,198,93,.11); }
.feature-card h3 { margin: 0 0 9px; font-size: 17px; letter-spacing: -.025em; }
.feature-card p { margin: 0; color: #8d8d9b; font-size: 13px; line-height: 1.65; }
.how { padding: 15px 0 100px; }
.how-panel { border-radius: 28px; padding: 55px; display: grid; grid-template-columns: 1fr 1.1fr; gap: 75px; align-items: center; overflow: hidden; position: relative; }
.how-panel::after { content: ""; position: absolute; width: 360px; height: 360px; left: -160px; bottom: -260px; background: #6f4fe8; filter: blur(90px); opacity: .2; }
.steps { list-style: none; margin: 0; padding: 0; }
.steps li { display: grid; grid-template-columns: 55px 1fr; gap: 14px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.steps li:last-child { border-bottom: 0; }
.steps > li > span { color: #8068df; font-size: 11px; font-weight: 800; letter-spacing: .08em; padding-top: 3px; }
.steps strong { display: block; font-size: 15px; margin-bottom: 3px; }
.steps p { margin: 0; color: #858594; font-size: 12px; }
.footer { padding: 30px 0 46px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.footer p { margin: 8px 0 0; color: #686876; font-size: 11px; }
.footer-links { display: flex; gap: 22px; color: #878795; font-size: 11px; }
.footer-links a:hover { color: white; }

.toast-stack { position: fixed; right: 20px; top: 20px; z-index: 100; display: grid; gap: 10px; width: min(360px, calc(100% - 40px)); pointer-events: none; }
.toast { display: flex; align-items: flex-start; gap: 10px; padding: 13px 14px; border: 1px solid var(--line-strong); border-radius: 13px; background: rgba(20,20,28,.94); box-shadow: 0 18px 50px rgba(0,0,0,.45); backdrop-filter: blur(20px); animation: toast-in .28s ease both; }
.toast.out { animation: toast-out .23s ease both; }
.toast-icon { width: 24px; height: 24px; border-radius: 8px; display: grid; place-items: center; flex: 0 0 auto; background: rgba(81,230,168,.12); color: var(--green); font-size: 12px; }
.toast.error .toast-icon { background: rgba(255,107,129,.12); color: var(--danger); }
.toast strong { display: block; font-size: 11px; }
.toast p { margin: 2px 0 0; color: #8a8a98; font-size: 10px; line-height: 1.45; }
@keyframes toast-in { from { opacity: 0; transform: translateY(-8px) scale(.98); } }
@keyframes toast-out { to { opacity: 0; transform: translateY(-6px) scale(.98); } }
.modal-backdrop { position: fixed; inset: 0; z-index: 80; display: grid; place-items: center; padding: 24px; background: rgba(4,4,7,.72); backdrop-filter: blur(10px); }
.progress-card { width: min(430px, 100%); border-radius: 22px; padding: 24px; display: grid; grid-template-columns: 60px 1fr auto; align-items: center; gap: 16px; }
.progress-ring { position: relative; width: 58px; height: 58px; }
.progress-ring svg { width: 58px; transform: rotate(-90deg); }
.progress-ring circle { fill: none; stroke: rgba(255,255,255,.07); stroke-width: 3; }
.progress-ring #progress-circle { stroke: #8b6cf2; stroke-dasharray: 106.8; stroke-dashoffset: 106.8; transition: stroke-dashoffset .25s; }
.progress-ring span { position: absolute; inset: 0; display: grid; place-items: center; font-size: 10px; font-weight: 700; }
.progress-card h3 { margin: 0 0 4px; font-size: 14px; }
.progress-card p { margin: 0; color: #858594; font-size: 11px; }

.lightbox { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; padding: 30px; background: rgba(0,0,0,.9); cursor: zoom-out; }
.lightbox img { max-width: min(1300px, 96vw); max-height: 92vh; object-fit: contain; border-radius: 10px; box-shadow: 0 25px 100px rgba(0,0,0,.6); }

.legal-page { min-height: 100vh; }
.legal-main { width: min(780px, calc(100% - 40px)); margin: 70px auto 120px; }
.legal-main h1 { font-size: clamp(44px, 8vw, 72px); }
.legal-main h2 { margin: 38px 0 10px; font-size: 22px; letter-spacing: -.03em; }
.legal-main p, .legal-main li { color: #a0a0ad; }
.legal-main a { color: #a78bfa; text-decoration: underline; }

@media (max-width: 1000px) {
  .feature-grid { grid-template-columns: repeat(2, 1fr); }
  .workspace-grid { grid-template-columns: 210px minmax(0, 1fr); }
  .advanced-panel { grid-template-columns: 1fr 1fr; }
  .how-panel { gap: 35px; }
}
@media (max-width: 760px) {
  .shell { width: min(100% - 24px, 1180px); }
  .topbar { height: 68px; }
  .top-actions .nav-link { display: none; }
  .status-pill { font-size: 10px; padding: 6px 9px; }
  .hero { padding: 62px 0 55px; }
  h1 { font-size: clamp(44px, 14vw, 67px); }
  .hero-sub { font-size: 16px; }
  .input-row { grid-template-columns: 1fr; }
  .primary-button { width: 100%; }
  .input-footer { align-items: flex-start; flex-direction: column; }
  .quick-presets { width: 100%; }
  .preset { flex: 1; padding-inline: 6px; }
  .advanced-panel { grid-template-columns: 1fr; }
  .trust-row { flex-wrap: wrap; gap: 12px 22px; }
  .workspace-toolbar { position: relative; top: 0; align-items: flex-start; }
  .toolbar-actions { flex-wrap: wrap; justify-content: flex-end; }
  .segmented { display: none; }
  .workspace-grid { grid-template-columns: 1fr; }
  .control-panel { position: relative; top: 0; display: grid; grid-template-columns: 1fr 1fr; }
  .source-note { grid-column: 1 / -1; }
  .preview-header { padding: 28px 22px 22px; align-items: flex-start; flex-direction: column; }
  .preview-date { text-align: left; }
  .thread-list { padding-inline: 20px; }
  .preview-footer { padding-inline: 22px; }
  .export-dock { position: relative; bottom: auto; align-items: stretch; flex-direction: column; }
  .export-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .export-button { width: 100%; }
  .export-menu { left: 0; right: auto; width: min(290px, calc(100vw - 42px)); }
  .how-panel { grid-template-columns: 1fr; padding: 34px 25px; }
  .footer { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 540px) {
  .hero-copy { margin-bottom: 30px; }
  .eyebrow { font-size: 10px; }
  #thread-form { padding: 17px 14px 14px; }
  .advanced-toggle { padding-inline: 15px; }
  .advanced-panel { padding-inline: 15px; }
  .quick-presets { overflow-x: auto; }
  .preset { white-space: nowrap; }
  .workspace-toolbar { flex-direction: column; }
  .toolbar-actions { width: 100%; justify-content: flex-start; }
  .control-panel { grid-template-columns: 1fr; }
  .source-note { grid-column: auto; }
  .feature-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 220px; }
  .feature-icon { margin-bottom: 28px; }
  .export-actions { grid-template-columns: 1fr; }
  .dock-copy { display: none; }
  .media-grid img { height: 150px; }
  .external-card { grid-template-columns: 78px 1fr; }
  .external-card img { width: 78px; }
  .progress-card { grid-template-columns: 52px 1fr; }
  .progress-card > button { grid-column: 2; justify-self: start; }
}

@media print {
  @page { margin: 14mm; size: A4; }
  body { background: white !important; }
  body * { visibility: hidden !important; }
  #preview-shell, #preview-shell * { visibility: visible !important; }
  #preview-shell { position: absolute; left: 0; top: 0; width: 100%; border: 0; border-radius: 0; box-shadow: none; background: white !important; color: #151518 !important; }
  #preview-shell * { --doc-bg: white; --doc-card: white; --doc-line: rgba(0,0,0,.14); --doc-text: #151518; --doc-muted: #666; }
  .preview-header { padding: 12mm 8mm 8mm; background: none; }
  .thread-list { padding: 3mm 8mm 5mm; }
  .post-card { break-inside: avoid; page-break-inside: avoid; }
  .post-source { color: #555 !important; }
  .preview-footer { padding-inline: 8mm; }
  video { display: none !important; }
  .video-poster { display: block !important; }
}
.video-quality { position: absolute; right: 10px; bottom: 10px; padding: 6px 9px; border: 1px solid rgba(255,255,255,.18); border-radius: 999px; background: rgba(10,10,14,.72); color: rgba(255,255,255,.9); backdrop-filter: blur(10px); font-size: 8px; font-weight: 750; letter-spacing: .04em; text-transform: uppercase; }
.video-placeholder { min-height: 220px; display: grid; place-items: center; align-content: center; gap: 8px; text-align: center; color: var(--doc-muted); background: radial-gradient(circle at 50% 40%, rgba(129,96,246,.18), transparent 45%), rgba(0,0,0,.12); }
.video-placeholder .video-play.static { position: static; transform: none; }
.video-placeholder strong { color: var(--doc-text); font-size: 12px; }
.video-placeholder small { max-width: 260px; font-size: 9px; }
.guide-main { width: min(980px, calc(100% - 40px)); margin: 58px auto 120px; }
.guide-hero { padding: 76px 0 70px; max-width: 900px; }
.guide-hero h1 { margin: 17px 0 22px; font-size: clamp(52px, 8vw, 88px); line-height: .96; letter-spacing: -.065em; }
.guide-hero > p { max-width: 700px; color: #a0a0ad; font-size: 18px; line-height: 1.7; }
.guide-cta { display: inline-flex; align-items: center; gap: 20px; margin-top: 25px; padding: 14px 18px; border-radius: 12px; background: linear-gradient(135deg,#8963f6,#6250df); box-shadow: 0 16px 36px rgba(103,80,225,.25); font-size: 12px; font-weight: 800; }
.guide-cta span { font-size: 18px; line-height: 1; }
.guide-content { display: grid; gap: 12px; }
.guide-content > article { padding: 34px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg,rgba(255,255,255,.035),rgba(255,255,255,.015)); }
.guide-content > article h2, .guide-steps h2, .guide-faq h2, .guide-final h2 { margin: 0 0 12px; font-size: clamp(25px,4vw,38px); letter-spacing: -.045em; }
.guide-content > article p, .guide-final p { margin: 0; color: #9b9baa; font-size: 15px; line-height: 1.75; }
.guide-steps, .guide-faq, .guide-final { margin-top: 55px; padding: 42px; border: 1px solid var(--line); border-radius: 22px; background: radial-gradient(circle at 0 0,rgba(126,87,244,.13),transparent 40%),rgba(255,255,255,.02); }
.guide-steps ol { margin: 25px 0 0; padding: 0; list-style: none; counter-reset: guide-step; }
.guide-steps li { counter-increment: guide-step; display: grid; grid-template-columns: 34px 1fr; gap: 14px; padding: 17px 0; border-top: 1px solid var(--line); color: #b4b4bf; }
.guide-steps li::before { content: counter(guide-step, decimal-leading-zero); color: #9175f5; font-size: 10px; font-weight: 800; }
.guide-faq details { border-top: 1px solid var(--line); }
.guide-faq summary { padding: 20px 0; cursor: pointer; color: #efeff4; font-weight: 700; }
.guide-faq details p { margin: -5px 0 22px; color: #9999a7; line-height: 1.7; }
.guide-final { text-align: center; padding-block: 64px; }
.guide-final p { margin-inline: auto; }
.guide-footer { width: min(980px,calc(100% - 40px)); margin: 0 auto 50px; padding-top: 24px; border-top: 1px solid var(--line); display: flex; gap: 20px; align-items: center; color: #777784; font-size: 10px; }
.guide-footer > a { color: #fff; font-weight: 800; }
.guide-footer nav { margin-left: auto; display: flex; gap: 17px; }
.guide-footer nav a:hover { color: #fff; }
@media(max-width:700px){.guide-main{width:min(100% - 24px,980px);margin-top:24px}.guide-hero{padding:50px 0}.guide-hero h1{font-size:clamp(46px,15vw,68px)}.guide-content>article,.guide-steps,.guide-faq,.guide-final{padding:27px 22px}.guide-footer{width:min(100% - 24px,980px);align-items:flex-start;flex-direction:column}.guide-footer nav{margin-left:0;flex-wrap:wrap}}

/* SkyArchive v1.2 — SEO, guide, status and revenue-ready surfaces */
.skip-link { position: fixed; left: 18px; top: -80px; z-index: 3000; padding: 11px 16px; border-radius: 10px; background: #fff; color: #09090d; font-weight: 800; transition: top .18s ease; }
.skip-link:focus { top: 18px; }
.top-actions a.nav-link { display: inline-flex; align-items: center; text-decoration: none; }
.ad-section { margin-top: 24px; margin-bottom: 20px; }
.ad-shell { width: 100%; min-height: 110px; padding: 13px; border: 1px dashed rgba(255,255,255,.1); border-radius: 16px; background: rgba(255,255,255,.018); text-align: center; overflow: hidden; }
.ad-shell > span { display: block; margin-bottom: 8px; color: #686875; font-size: 9px; letter-spacing: .12em; text-transform: uppercase; }
.ad-mount { min-height: 78px; }
.control-panel .ad-shell { margin: 10px 12px 14px; width: auto; min-height: 250px; }
.seo-section { padding-top: 92px; }
.format-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.025); box-shadow: 0 26px 90px rgba(0,0,0,.2); }
.format-table { width: 100%; border-collapse: collapse; min-width: 760px; }
.format-table th, .format-table td { padding: 19px 22px; border-bottom: 1px solid var(--line); text-align: left; vertical-align: top; }
.format-table th { color: #8f8f9e; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.format-table td { color: #aaaab7; font-size: 13px; line-height: 1.55; }
.format-table td:first-child { color: #f4f4f8; width: 170px; }
.format-table tbody tr:last-child td { border-bottom: 0; }
.section-link { margin: 18px 2px 0; }
.section-link a { color: #a994ff; font-size: 13px; font-weight: 750; text-decoration: none; }
.section-link a:hover { color: #d0c5ff; }
.use-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; }
.use-grid article { min-height: 185px; padding: 24px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.015)); }
.use-grid strong { display: block; margin-bottom: 24px; font-size: 17px; }
.use-grid p { margin: 0; color: #888895; font-size: 12px; line-height: 1.7; }
.troubleshooting-preview { display: grid; grid-template-columns: minmax(0,1.25fr) minmax(280px,.75fr); align-items: center; gap: 60px; }
.troubleshooting-preview h2 { max-width: 780px; margin: 12px 0 16px; font-size: clamp(31px,4.5vw,53px); line-height: 1.02; letter-spacing: -.045em; }
.troubleshooting-preview p { max-width: 700px; color: #8d8d99; line-height: 1.75; }
.mini-checks { display: grid; gap: 10px; padding: 24px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.025); }
.mini-checks span { padding: 12px 14px; border-radius: 11px; background: rgba(255,255,255,.03); color: #babac5; font-size: 12px; }
.faq-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.faq-grid details, .v12-faq details { border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.025); }
.faq-grid summary, .v12-faq summary { position: relative; padding: 18px 48px 18px 18px; color: #e8e8ee; font-size: 13px; font-weight: 700; cursor: pointer; list-style: none; }
.faq-grid summary::-webkit-details-marker, .v12-faq summary::-webkit-details-marker { display: none; }
.faq-grid summary::after, .v12-faq summary::after { content: '+'; position: absolute; right: 18px; top: 14px; color: #8e78ed; font-size: 22px; font-weight: 400; }
.faq-grid details[open] summary::after, .v12-faq details[open] summary::after { content: '−'; }
.faq-grid details p, .v12-faq details p { margin: 0; padding: 0 18px 18px; color: #898995; font-size: 12px; line-height: 1.7; }
.related-section { padding-top: 70px; }
.related-section > h2 { margin: 10px 0 24px; font-size: clamp(28px,4vw,44px); letter-spacing: -.04em; }
.related-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.related-card { display: flex; flex-direction: column; min-height: 190px; padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.025); text-decoration: none; transition: transform .18s, border-color .18s, background .18s; }
.related-card:hover { transform: translateY(-3px); border-color: rgba(153,125,255,.45); background: rgba(135,101,255,.06); }
.related-card strong { color: #efeff4; font-size: 15px; line-height: 1.35; }
.related-card span { margin-top: 11px; color: #7f7f8c; font-size: 11px; line-height: 1.6; }
.related-card b { margin-top: auto; padding-top: 20px; color: #a994ff; font-size: 11px; }
.seo-footer { align-items: flex-start; gap: 50px; }
.footer-columns { display: grid; grid-template-columns: repeat(3,minmax(130px,1fr)); gap: 42px; }
.footer-columns nav { display: flex; flex-direction: column; gap: 9px; }
.footer-columns strong { margin-bottom: 6px; color: #cfcfd7; font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.footer-columns a { color: #747481; font-size: 11px; text-decoration: none; }
.footer-columns a:hover { color: #fff; }
.v12-page .topbar { position: relative; }
.breadcrumb { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; margin: 16px 0 48px; color: #626270; font-size: 10px; }
.breadcrumb a { color: #898997; text-decoration: none; }
.breadcrumb a:hover { color: #fff; }
.v12-guide { width: min(1080px, calc(100% - 40px)); }
.v12-guide-hero { max-width: 940px; padding-bottom: 34px; }
.v12-guide-hero h1 { max-width: 900px; font-size: clamp(45px,7vw,82px); line-height: .97; letter-spacing: -.06em; }
.v12-guide-hero > p { max-width: 800px; color: #a0a0ac; font-size: clamp(16px,2.2vw,21px); line-height: 1.65; }
.guide-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 28px; }
.guide-article { width: min(860px,100%); margin: 52px auto 0; }
.guide-block { padding: 34px 0; border-bottom: 1px solid var(--line); }
.guide-block h2 { margin: 0 0 14px; color: #f1f1f5; font-size: clamp(25px,3.8vw,37px); line-height: 1.1; letter-spacing: -.035em; }
.guide-block p { margin: 0; color: #9a9aa6; font-size: 15px; line-height: 1.82; }
.guide-block code, .legal-section code { padding: 2px 6px; border: 1px solid rgba(255,255,255,.1); border-radius: 6px; background: rgba(255,255,255,.045); color: #cfc2ff; font-size: .9em; }
.v12-steps { margin: 68px 0; padding: 34px; border: 1px solid var(--line); border-radius: 22px; background: linear-gradient(145deg, rgba(116,79,245,.09), rgba(255,255,255,.02)); }
.v12-steps h2 { margin: 10px 0 24px; font-size: clamp(27px,4vw,42px); letter-spacing: -.04em; }
.v12-steps ol { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.v12-steps li { display: grid; grid-template-columns: 44px 1fr; align-items: center; gap: 12px; padding: 14px; border-radius: 13px; background: rgba(255,255,255,.035); }
.v12-steps li span { color: #9a83fb; font-size: 11px; font-weight: 800; letter-spacing: .08em; }
.v12-steps li p { margin: 0; color: #b7b7c1; font-size: 13px; line-height: 1.55; }
.v12-faq { margin-top: 70px; }
.v12-faq h2 { margin: 10px 0 24px; font-size: clamp(29px,4vw,46px); letter-spacing: -.04em; }
.v12-faq details { margin: 9px 0; }
.guide-hub { width: min(1180px,calc(100% - 40px)); }
.guide-hub .guide-hero { max-width: 920px; }
.guide-hub-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; margin-top: 48px; }
.guide-hub-card { display: flex; flex-direction: column; min-height: 320px; padding: 30px; border: 1px solid var(--line); border-radius: 21px; background: linear-gradient(145deg, rgba(255,255,255,.04), rgba(255,255,255,.015)); text-decoration: none; transition: .2s ease; }
.guide-hub-card:hover { transform: translateY(-4px); border-color: rgba(143,111,255,.45); box-shadow: 0 26px 80px rgba(0,0,0,.24); }
.guide-hub-card > span { color: #9d86fa; font-size: 9px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }
.guide-hub-card h2 { margin: 22px 0 14px; color: #f2f2f6; font-size: clamp(25px,3vw,36px); line-height: 1.05; letter-spacing: -.04em; }
.guide-hub-card p { margin: 0; color: #8d8d99; font-size: 13px; line-height: 1.7; }
.guide-hub-card b { margin-top: auto; padding-top: 28px; color: #b29eff; font-size: 11px; }
.legal-section { padding: 24px 0; border-bottom: 1px solid var(--line); }
.legal-section:last-child { border-bottom: 0; }
.status-main, .changelog-main { width: min(900px,calc(100% - 40px)); }
.status-grid { display: grid; gap: 12px; margin: 34px 0 52px; }
.status-grid article { display: flex; align-items: center; gap: 17px; padding: 22px; border: 1px solid var(--line); border-radius: 17px; background: rgba(255,255,255,.026); }
.status-grid article strong { color: #f1f1f5; font-size: 14px; }
.status-grid article p { margin: 5px 0 0; color: #868692; font-size: 12px; }
.status-light { width: 12px; height: 12px; flex: 0 0 auto; border-radius: 50%; background: #7f7f89; box-shadow: 0 0 0 6px rgba(127,127,137,.1); }
.status-light.pending { animation: statusPulse 1.2s infinite alternate; }
.status-light.ok { background: #42d693; box-shadow: 0 0 0 6px rgba(66,214,147,.1),0 0 22px rgba(66,214,147,.3); }
.status-light.down { background: #ff6f7d; box-shadow: 0 0 0 6px rgba(255,111,125,.1),0 0 22px rgba(255,111,125,.3); }
@keyframes statusPulse { to { opacity:.35; } }
.release { margin: 34px 0; padding: 28px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,.025); }
.release header { display: flex; justify-content: space-between; gap: 18px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.release header strong { display: block; color: #f3f3f7; font-size: 20px; }
.release header time, .release header > span { color: #858591; font-size: 10px; }
.release ul { margin: 24px 0 0; padding-left: 20px; color: #a2a2ad; }
.release li { margin: 10px 0; line-height: 1.65; }

@media (max-width: 980px) {
  .use-grid, .related-grid { grid-template-columns: 1fr 1fr; }
  .troubleshooting-preview { grid-template-columns: 1fr; gap: 28px; }
  .seo-footer { flex-direction: column; }
  .footer-columns { width: 100%; }
}
@media (max-width: 720px) {
  .seo-section { padding-top: 68px; }
  .use-grid, .related-grid, .faq-grid, .guide-hub-grid { grid-template-columns: 1fr; }
  .use-grid article { min-height: 145px; }
  .footer-columns { grid-template-columns: 1fr 1fr; gap: 28px; }
  .v12-guide-hero h1 { font-size: clamp(40px,12vw,62px); }
  .guide-article { margin-top: 30px; }
  .v12-steps { padding: 24px 18px; }
  .guide-hub-card { min-height: 260px; }
  [data-ad-density="desktop"] { display: none !important; }
  .ad-shell { min-height: 90px; }
  .ad-mount { min-height: 60px; }
}
@media (max-width: 500px) {
  .footer-columns { grid-template-columns: 1fr; }
  .format-table th, .format-table td { padding: 16px; }
  .v12-steps li { grid-template-columns: 34px 1fr; }
  .guide-actions .secondary-button { width: 100%; justify-content: center; }
}