:root { --bg:#171b1d; --panel:#202629; --ink:#e2e7e4; --amber:#efb43c; --steel:#94a09a; --line:#3b4440; font-family:Georgia,'Times New Roman',serif; color:var(--ink); background:var(--bg); }
* { box-sizing:border-box; }
.player-action { display:inline-block; padding:10px 16px; background:var(--amber); color:var(--bg); font-weight:600; text-decoration:none; border:1px solid currentColor; }
.player-action:focus-visible { outline:3px solid var(--ink); outline-offset:3px; }
body { margin:0; background:var(--bg); }
a { color:inherit; }
.site-header { min-width:0; min-height:74px; padding:0 4vw; display:flex; align-items:center; justify-content:space-between; border-bottom:4px solid var(--amber); }
.brand { max-width:100%; flex:0 0 auto; overflow-wrap:anywhere; font:900 22px Impact,'Arial Black',sans-serif; text-decoration:none; letter-spacing:.02em; }
nav { display:flex; gap:1px; background:var(--line); }
.site-header nav { min-width:0; overflow-x:auto; }
nav a { padding:14px; background:var(--bg); font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace; text-decoration:none; text-transform:uppercase; }
nav a:hover { color:#171b1d; background:var(--amber); }
main { max-width:1260px; margin:0 auto; padding:30px 4vw 80px; }
.command-strip { display:grid; grid-template-columns:repeat(3,1fr); border:1px solid var(--line); }
.command-strip span { padding:12px; color:var(--steel); border-right:1px solid var(--line); font:10px ui-monospace,SFMono-Regular,Menlo,monospace; }
.command-strip span:last-child { color:var(--amber); border:0; }
.tactical-visual { position:relative; margin:22px 0 0; overflow:hidden; border:1px solid var(--line); background:#0d1113; }
.tactical-visual::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(7,10,11,.32),transparent 55%),linear-gradient(0deg,rgba(7,10,11,.52),transparent 42%); pointer-events:none; }
.tactical-visual picture { display:block; }
.tactical-visual img { display:block; width:100%; height:auto; aspect-ratio:16/7; object-fit:cover; }
.tactical-visual figcaption { position:absolute; z-index:1; right:14px; bottom:12px; padding:7px 9px; color:var(--amber); background:rgba(23,27,29,.88); border:1px solid var(--line); font:700 9px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.12em; }
article { margin-top:54px; }
.kicker { color:var(--amber); font:700 11px ui-monospace,SFMono-Regular,Menlo,monospace; letter-spacing:.18em; }
h1,h2 { overflow-wrap:anywhere; font-family:Impact,'Arial Black',sans-serif; font-weight:900; text-transform:uppercase; }
h1 { max-width:950px; margin:16px 0 28px; font-size:clamp(48px,7vw,96px); line-height:.9; letter-spacing:-.045em; }
.lede { max-width:800px; color:#c5cec9; font-size:18px; line-height:1.7; }
.article-section { min-width:0; margin:0; padding:32px; display:grid; grid-template-columns:120px minmax(0,1fr); gap:34px; background:var(--panel); border:1px solid var(--line); border-bottom:0; }
.article-section:last-of-type { border-bottom:1px solid var(--line); }
.section-index { color:var(--amber); font:900 36px Impact,'Arial Black',sans-serif; }
.section-content { min-width:0; }
h2 { margin:0 0 14px; font-size:28px; }
.article-section p { color:#c2cbc6; line-height:1.75; }
.content-block + .content-block { margin-top:24px; }
.block-prose p:first-child { margin-top:0; }
.block-steps ol,.block-checklist ul { margin:0; padding-left:25px; color:#c2cbc6; }
.block-steps li,.block-checklist li { padding:8px 0 8px 8px; line-height:1.65; }
.block-steps li::marker { color:var(--amber); font:700 11px ui-monospace,SFMono-Regular,Menlo,monospace; }
.block-checklist li::marker { color:var(--steel); }
.block-comparison .table-scroll { max-width:100%; overflow-x:auto; border:1px solid var(--line); }
.block-comparison table { width:100%; min-width:620px; border-collapse:collapse; }
.block-comparison th,.block-comparison td { padding:14px; text-align:left; vertical-align:top; border-right:1px solid var(--line); border-bottom:1px solid var(--line); line-height:1.5; }
.block-comparison th { color:#171b1d; background:var(--amber); font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace; text-transform:uppercase; }
.block-faq dl { margin:0; }
.block-faq .faq-item { display:grid; grid-template-columns:minmax(180px,.7fr) minmax(0,1.3fr); gap:24px; padding:18px 0; border-top:1px solid var(--line); }
.block-faq dt { color:var(--amber); font:700 11px ui-monospace,SFMono-Regular,Menlo,monospace; text-transform:uppercase; }
.block-faq dd { margin:0; color:#c2cbc6; line-height:1.7; }
.video-card { margin:26px 0 8px; border:1px solid var(--line); background:#121719; }
.video-stage { position:relative; overflow:hidden; aspect-ratio:16/9; background:#080b0c; }
.video-stage > img,.video-stage > iframe { display:block; width:100%; height:100%; border:0; object-fit:cover; }
.video-stage > img { opacity:.68; }
.video-play { position:absolute; inset:50% auto auto 50%; transform:translate(-50%,-50%); display:flex; align-items:center; gap:9px; padding:13px 18px; color:#171b1d; background:var(--amber); border:1px solid #171b1d; cursor:pointer; font:700 11px ui-monospace,SFMono-Regular,Menlo,monospace; text-transform:uppercase; }
.video-play:hover { background:#ffd16f; }
.video-play:focus-visible { outline:3px solid var(--ink); outline-offset:3px; }
.video-caption { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:0!important; padding:14px; }
.video-caption .player-action { padding:8px 11px; font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace; }
.video-caption small { color:var(--steel); font:10px ui-monospace,SFMono-Regular,Menlo,monospace; }
.analytics-consent { position:fixed; z-index:20; right:1rem; bottom:1rem; max-width:31rem; padding:1rem; border:1px solid var(--line); background:#12171a; box-shadow:0 1rem 3rem #0009; color:var(--ink); }
.analytics-consent[hidden] { display:none; }
.analytics-consent p { margin:0 0 .8rem; line-height:1.5; }
.analytics-consent div { display:flex; flex-wrap:wrap; gap:.65rem; justify-content:flex-end; }
.analytics-consent button { border:1px solid var(--amber); padding:.6rem .85rem; background:transparent; color:var(--ink); font:700 10px ui-monospace,SFMono-Regular,Menlo,monospace; cursor:pointer; text-transform:uppercase; }
.analytics-consent button:last-child { background:var(--amber); color:#14110a; }
footer { padding:26px 4vw; display:flex; justify-content:space-between; color:var(--steel); border-top:1px solid var(--line); font:10px ui-monospace,SFMono-Regular,Menlo,monospace; }
.footer-guide-index { flex:1 1 auto; min-width:0; overflow-x:auto; }
footer > span { flex:0 0 auto; }
@media(max-width:760px) { .site-header { padding-block:18px; flex-direction:column; align-items:flex-start; gap:16px; } nav { width:100%; overflow:auto; } .command-strip { grid-template-columns:1fr; } .command-strip span { border-right:0; border-bottom:1px solid var(--line); } .tactical-visual img { aspect-ratio:16/10; } h1 { font-size:40px; } .article-section { padding:22px; grid-template-columns:54px minmax(0,1fr); gap:16px; } .section-index { font-size:24px; } h2 { font-size:24px; } .block-faq .faq-item { grid-template-columns:1fr; gap:8px; } .block-comparison th,.block-comparison td { padding:10px; } .video-caption { align-items:flex-start; flex-direction:column; } footer { flex-direction:column; gap:10px; } }
