:root{
  --bg:#14120e;--bg2:#1c1913;--panel:#221e16;--line:#3a3325;
  --paper:#ece1c6;--muted:#b7aa8a;--brass:#c39a45;--brass-d:#8f6d28;
  --red:#c2452f;--blue:#4a78ad;
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,serif;
  --sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:72px}
html,body{overflow-x:clip}body{margin:0;background:var(--bg);color:var(--paper);font:17px/1.65 var(--sans);-webkit-font-smoothing:antialiased}
a{color:var(--brass)}a:hover{color:#e0b964}
img{max-width:100%;display:block}
.skip{position:absolute;left:-999px;top:8px;background:var(--brass);color:#000;padding:8px 12px;z-index:50}
.skip:focus{left:8px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px clamp(14px,4vw,40px);background:rgba(20,18,14,.94);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:10px;color:var(--paper);text-decoration:none;font:700 19px/1 var(--serif);letter-spacing:.02em}
.brand-mark{width:26px;height:26px;border-radius:6px;background:var(--bg2);border:1.5px solid var(--brass);position:relative;flex:none}
.brand-mark::before{content:"";position:absolute;left:8px;top:4px;width:2px;height:16px;background:var(--brass)}
.brand-mark::after{content:"";position:absolute;left:10px;top:4px;width:9px;height:7px;background:var(--red);clip-path:polygon(0 0,100% 50%,0 100%)}
.nav{display:flex;gap:4px}
.nav a{color:var(--muted);text-decoration:none;font-size:15px;padding:8px 10px;border-radius:6px}
.nav a:hover{color:var(--paper);background:var(--panel)}

.hero{max-width:1120px;margin:0 auto;padding:26px clamp(14px,4vw,40px) 14px}
.eyebrow{margin:0 0 4px;color:var(--brass);font:600 12px/1 var(--sans);letter-spacing:.18em;text-transform:uppercase}
h1{margin:0;font:700 clamp(34px,6vw,56px)/1.05 var(--serif);letter-spacing:-.01em}
.lede{margin:10px 0 0;color:var(--muted);font-size:18px;max-width:60ch}

.stage-wrap{max-width:1120px;margin:0 auto;padding:6px clamp(14px,4vw,40px) 0}
.stage{position:relative;aspect-ratio:16/10;background:#0c0b08;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:0 18px 50px rgba(0,0,0,.45)}
.stage iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:#0c0b08}
.cover{position:absolute;inset:0;cursor:pointer}
.cover img{width:100%;height:100%;object-fit:cover;filter:blur(2.5px) brightness(.75);transform:scale(1.04)}
.cover-shade{position:absolute;inset:0;background:radial-gradient(ellipse at center,rgba(20,18,14,.55),rgba(20,18,14,.88))}
.cover-ui{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;padding:16px}
.play{display:inline-flex;align-items:center;gap:12px;background:var(--brass);color:#1a1409;border:0;border-radius:8px;padding:16px 30px;font:700 clamp(17px,2.6vw,22px)/1 var(--serif);letter-spacing:.02em;cursor:pointer;box-shadow:0 0 0 3px rgba(195,154,69,.25),0 10px 28px rgba(0,0,0,.5);transition:transform .15s,background .15s}
.play:hover{background:#d5ac56;transform:translateY(-2px)}
.play:focus-visible,.act:focus-visible,a:focus-visible,summary:focus-visible,button:focus-visible{outline:3px solid #fff;outline-offset:2px}
.play-tri{width:0;height:0;border-left:14px solid #1a1409;border-top:9px solid transparent;border-bottom:9px solid transparent}
.cover-hint{margin:0;color:var(--paper);font-size:15px;opacity:.85}

.loader{position:absolute;inset:0;display:none;flex-direction:column;align-items:center;justify-content:center;gap:18px;background:var(--bg2)}
[data-gf-state="loading"] .loader{display:flex}
.loader p{margin:0;color:var(--muted);font:600 17px var(--serif)}
.march{display:flex;gap:6px}
.march i{width:clamp(14px,3.2vw,26px);height:clamp(18px,4vw,32px);border-radius:3px;background:#2b2619;border:1px solid var(--line);animation:step 1.2s infinite ease-in-out}
.march i:nth-child(odd){--c:var(--red)}.march i:nth-child(even){--c:var(--blue)}
.march i:nth-child(1){animation-delay:0s}.march i:nth-child(2){animation-delay:.1s}.march i:nth-child(3){animation-delay:.2s}.march i:nth-child(4){animation-delay:.3s}.march i:nth-child(5){animation-delay:.4s}.march i:nth-child(6){animation-delay:.5s}.march i:nth-child(7){animation-delay:.6s}.march i:nth-child(8){animation-delay:.7s}.march i:nth-child(9){animation-delay:.8s}.march i:nth-child(10){animation-delay:.9s}
@keyframes step{0%,70%,100%{background:#2b2619;transform:none}25%{background:var(--c);transform:translateY(-8px)}}
@media (prefers-reduced-motion:reduce){.march i{animation:none;background:var(--brass-d)}html{scroll-behavior:auto}}

.bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 0}
.act{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px;background:var(--panel);color:var(--paper);border:1px solid var(--line);border-radius:8px;font:600 15px var(--sans);cursor:pointer}
.act:hover{border-color:var(--brass)}
.act b{font-weight:700;color:var(--muted);min-width:1ch}
.act[aria-pressed="true"]{background:#3a1f19;border-color:var(--red);color:#ffb7a6}
.act[aria-pressed="true"] svg{color:var(--red)}
.fs{margin-left:auto}
.msg{color:var(--muted);font-size:14px}

.cols{max-width:1120px;margin:18px auto 0;padding:0 clamp(14px,4vw,40px) 60px;display:grid;grid-template-columns:minmax(0,1fr) 250px;gap:44px;align-items:start}
.prose{min-width:0;max-width:760px}
.prose section{padding-top:30px}
.prose h2{margin:0 0 12px;font:700 clamp(26px,4vw,34px)/1.15 var(--serif);color:var(--paper)}
.prose h3{margin:26px 0 8px;font:700 20px/1.3 var(--serif);color:var(--brass)}
.prose p{margin:0 0 14px}
.prose li{margin-bottom:6px}
.prose ul,.prose ol{padding-left:22px;margin:0 0 14px}
.steps{list-style:none;counter-reset:s;padding:0!important}
.steps li{counter-increment:s;position:relative;padding:12px 14px 12px 56px;margin-bottom:8px;background:var(--panel);border:1px solid var(--line);border-radius:8px}
.steps li::before{content:counter(s);position:absolute;left:14px;top:50%;transform:translateY(-50%);width:30px;height:38px;border-radius:5px;background:var(--bg);border:1.5px solid var(--brass);color:var(--brass);font:700 18px/35px var(--serif);text-align:center}
.table-wrap{overflow-x:auto;margin:0 0 14px;border:1px solid var(--line);border-radius:8px}
table{border-collapse:collapse;width:100%;min-width:320px}
th,td{padding:9px 14px;text-align:left;border-bottom:1px solid var(--line)}
thead th{background:var(--panel);color:var(--brass);font:600 13px var(--sans);letter-spacing:.08em;text-transform:uppercase}
tbody th{font-weight:600}
tbody tr:last-child th,tbody tr:last-child td{border-bottom:0}

details{border:1px solid var(--line);border-radius:8px;margin-bottom:8px;background:var(--panel)}
summary{cursor:pointer;padding:14px 16px;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:12px}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";color:var(--brass);font-size:22px;line-height:1}
details[open] summary::after{content:"\2212"}
details p{margin:0;padding:0 16px 16px;color:var(--muted)}

.side{position:sticky;top:76px}
.side-h{margin:0 0 8px;color:var(--brass);font:600 12px var(--sans);letter-spacing:.16em;text-transform:uppercase}
.side ol{list-style:none;margin:0 0 22px;padding:0;border-left:2px solid var(--line)}
.side li a{display:block;padding:6px 14px;color:var(--muted);text-decoration:none;font-size:15px}
.side li a:hover{color:var(--paper);border-left:2px solid var(--brass);margin-left:-2px}
.side-box{background:var(--panel);border:1px solid var(--line);border-radius:8px;padding:14px 16px}
dl{margin:0;font-size:14px}dt{color:var(--muted);margin-top:8px}dd{margin:0;color:var(--paper)}

.comments .c-intro{color:var(--muted)}
.cform{display:grid;gap:10px;margin-bottom:22px}
.cform input,.cform textarea{width:100%;background:var(--bg2);color:var(--paper);border:1px solid var(--line);border-radius:8px;padding:12px;font:inherit}
.cform input::placeholder,.cform textarea::placeholder{color:#8b7f64}
.cform-row{display:flex;gap:12px;align-items:center}
.post{background:var(--brass);color:#1a1409;border:0;border-radius:8px;min-height:44px;padding:0 22px;font:700 15px var(--sans);cursor:pointer}
.post:hover{background:#d5ac56}
.cmsg{color:var(--muted);font-size:14px}
.replying{display:none;margin:0;color:var(--muted);font-size:14px}
.cform[data-gf-replying] .replying{display:block}
.link{background:none;border:0;color:var(--brass);cursor:pointer;font:600 14px var(--sans);padding:6px 0}
.c{padding:14px 0;border-top:1px solid var(--line)}
.c header{display:flex;flex-wrap:wrap;gap:8px;align-items:baseline;font-size:14px}
.c time{color:var(--muted);margin-left:auto}
.c p{margin:6px 0 2px;overflow-wrap:anywhere}
.own{display:none;background:var(--brass);color:#1a1409;border-radius:4px;padding:1px 7px;font:700 11px var(--sans);letter-spacing:.06em;text-transform:uppercase}
[data-gf-owner] .own{display:inline-block}
[data-gf-owner]{border-left:3px solid var(--brass);padding-left:12px}
.to{color:var(--muted)}
.replies{margin-left:18px}
.r{border-top:1px dashed var(--line)}
[data-gf-comments][data-gf-empty]::before{content:"No comments yet. Be the first: which setup do you trust, and where do you hide your Flag?";display:block;color:var(--muted);padding:14px 0;border-top:1px solid var(--line)}
[data-gf-comments][data-gf-off]::before{content:"Comments are closed.";display:block;color:var(--muted)}

.doc{max-width:760px;margin:0 auto;padding:40px clamp(14px,4vw,40px) 70px}
.doc h1{font-size:clamp(30px,5vw,44px);margin-bottom:18px}
.doc h2{font:700 24px var(--serif);margin:30px 0 8px}
.doc p,.doc li{color:#d9ceb2}

.foot{border-top:1px solid var(--line);background:var(--bg2)}
.foot-in{max-width:1120px;margin:0 auto;padding:28px clamp(14px,4vw,40px);font-size:14px;color:var(--muted)}
.foot-brand{margin:0 0 6px;font:700 18px var(--serif);color:var(--paper)}
.foot-note{max-width:70ch;margin:0 0 10px}
.foot-links{margin:0 0 6px}
.foot-copy{margin:0}

@media (max-width:900px){
  .cols{grid-template-columns:minmax(0,1fr)}
  .side{display:none}
  .nav a:nth-child(-n+2){display:none}
}
@media (max-width:700px){
  body{font-size:16.5px}
  .stage-wrap{padding-left:0;padding-right:0}
  .stage{aspect-ratio:4/5;border-radius:0;border-left:0;border-right:0}
  .bar{padding:10px clamp(14px,4vw,40px)}
  .act span{display:none}
  .act.fs span,.act:first-child span{display:inline}
  .nav{display:none}
}