/* Hackopedia by BlastWave: home page styles */
/* Concept B — "Print Edition". BlastWave Brand Guidelines 2025.
   60% white · 30% BlastWave grey #414042 · 10% gold #B79B5E / red #AA0E1D.
   Gold + white = safety, the verified record. Red = threat and the gaps. */
:root{
  --white:#ffffff;--tint:#f3f3f3;--tint2:#e9e8e8;--rule:#dcdbda;
  --gray:#414042;--gray-dn:#38373a;--ink:#414042;--soft:#5e5d60;--muted:#7a797c;
  --gold:#B79B5E;--gold-lt:#C9AD74;--gold-soft:#E6DCC4;--gold-ink:#8a6f35;
  --red:#AA0E1D;--red-lt:#CC222B;
  --corner:0 0 30px 0;
  --font:"Roboto Condensed","Arial Narrow",Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--white)}
body{margin:0;background:var(--white);color:var(--ink);font-family:var(--font);font-weight:300;font-size:18px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit}
h1,h2,h3,b,strong{letter-spacing:-.01em}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px;position:relative}
@media (max-width:600px){.wrap{padding:0 16px}}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;z-index:200;background:var(--gray);color:#fff;padding:8px 12px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.label{font-size:13px;font-weight:400;letter-spacing:.14em;text-transform:uppercase}

/* ---------- header ---------- */
.top{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.92);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-top:4px solid var(--red);transition:box-shadow .3s}
.top.solid{box-shadow:0 1px 0 var(--rule),0 10px 30px -20px rgba(65,64,66,.5)}
.top .wrap{display:flex;align-items:center;gap:24px;height:70px}
.brand{display:flex;align-items:center;gap:6px;text-decoration:none;flex:none}
.brand img{height:52px;width:auto;margin-left:-14px}
.brand span{font-weight:700;letter-spacing:.16em;font-size:15px;color:var(--red);border-left:1px solid var(--rule);padding-left:14px}
.top nav{margin-left:auto;display:flex;gap:22px;white-space:nowrap}
.top nav a{text-decoration:none;color:var(--soft);position:relative;padding:4px 0}
.top nav a::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.top nav a:hover{color:var(--gray)}.top nav a:hover::after{transform:none}
@media (max-width:1120px){.top nav{display:none}}
.top .cta{flex:none;text-decoration:none;color:#fff;background:var(--gray);padding:9px 16px;border-radius:var(--corner);font-weight:700;transition:background .2s}
.top .cta:hover{background:var(--gold)}
@media (max-width:1120px){.top .cta{margin-left:auto}}
@media (max-width:420px){.brand span{display:none}}

/* ---------- hero ---------- */
.hero{position:relative;padding:64px 0 90px;overflow:hidden}
/* the brand's 6-column document grid, drawn in */
.docgrid{position:absolute;inset:0;pointer-events:none;z-index:0}
.docgrid .wrap{height:100%;display:grid;grid-template-columns:repeat(6,1fr);gap:24px}
.docgrid i{border-left:1px solid rgba(65,64,66,.07);border-right:1px solid rgba(65,64,66,.07);transform:scaleY(0);transform-origin:top;animation:col 1.4s cubic-bezier(.2,.7,.2,1) forwards}
.docgrid i:nth-child(2){animation-delay:.08s}.docgrid i:nth-child(3){animation-delay:.16s}.docgrid i:nth-child(4){animation-delay:.24s}.docgrid i:nth-child(5){animation-delay:.32s}.docgrid i:nth-child(6){animation-delay:.4s}
@keyframes col{to{transform:none}}
.hero .wrap.main{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:40px;align-items:center;z-index:1}
@media (max-width:960px){.hero .wrap.main{grid-template-columns:minmax(0,1fr)}}
.ftab{position:relative;display:inline-flex;align-items:center;gap:12px;background:var(--red);color:#fff;padding:9px 22px 9px 0;border-radius:var(--corner);font-size:16px;letter-spacing:.09em;text-transform:uppercase;font-weight:400}
.ftab::before{content:"";position:absolute;top:0;bottom:0;right:100%;width:100vw;background:var(--red)}
.hero h1{font-weight:800;font-size:clamp(44px,7vw,96px);line-height:1.02;margin:28px 0 22px;color:var(--gray);text-wrap:balance}
.hero h1 .w{display:inline-block;opacity:0;transform:translateY(.4em);animation:rise .9s cubic-bezier(.2,.7,.2,1) forwards}
.hero h1 em{font-style:normal;color:var(--gold);position:relative}
.hero h1 em::after{content:"";position:absolute;left:0;right:0;bottom:.1em;height:.055em;background:var(--gold);transform:scaleX(0);transform-origin:left;animation:draw 1s 1.2s cubic-bezier(.2,.7,.2,1) forwards}
.hero h1 .threat{color:var(--red)}
@keyframes rise{to{opacity:1;transform:none}}
@keyframes draw{to{transform:scaleX(1)}}
.lede{font-size:clamp(18px,1.7vw,21px);max-width:52ch;color:var(--soft);margin:0 0 30px;opacity:0;animation:rise 1s .7s forwards}
.lede b{color:var(--gray);font-weight:700}
.ctas{display:flex;flex-wrap:wrap;gap:12px;opacity:0;animation:rise 1s .9s forwards}
.btn{display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:14px;padding:15px 24px;border-radius:var(--corner);transition:transform .2s,background .2s,color .2s}
.btn svg{width:16px;height:16px;transition:transform .3s}
.btn:hover svg{transform:translateX(4px)}
.btn.gold{background:var(--gold);color:#fff}
.btn.gold:hover{background:var(--gold-ink);transform:translateY(-2px)}
.btn.line{border:1.5px solid var(--gray);color:var(--gray)}
.btn.line:hover{background:var(--gray);color:#fff}

/* the deck of print pages */
.deck{position:relative;height:520px;perspective:1400px}
@media (max-width:960px){.deck{height:440px;margin-top:10px}}
@media (max-width:520px){.deck{height:360px}}
.sheet{position:absolute;left:50%;top:50%;width:min(330px,62vw);aspect-ratio:480/621;margin:0;transform-origin:50% 100%;transition:transform .9s cubic-bezier(.2,.7,.2,1),box-shadow .6s,opacity .6s;text-decoration:none;display:block}
.sheet img{width:100%;height:100%;display:block;background:#fff;box-shadow:0 30px 60px -25px rgba(65,64,66,.55),0 0 0 1px rgba(65,64,66,.08)}
.sheet .cap{position:absolute;left:0;bottom:-64px;font-size:14px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--soft);opacity:0;transition:opacity .4s;white-space:nowrap;transform:rotate(2deg);transform-origin:0 0}
.deck{margin-bottom:40px}

.sheet[data-pos="0"] .cap{opacity:1}
.sheet[data-pos="0"]{transform:translate(-50%,-50%) rotate(-2deg);z-index:3}
.sheet[data-pos="1"]{transform:translate(-44%,-52%) rotate(5deg);z-index:2}
.sheet[data-pos="2"]{transform:translate(-56%,-49%) rotate(-9deg);z-index:1}
.sheet.out{transform:translate(40%,-60%) rotate(18deg)!important;opacity:0;z-index:4}
.deck:hover .sheet[data-pos="0"]{transform:translate(-50%,-52%) rotate(0)}
.deck:hover .sheet[data-pos="1"]{transform:translate(-8%,-48%) rotate(9deg)}
.deck:hover .sheet[data-pos="2"]{transform:translate(-92%,-47%) rotate(-12deg)}
@media (max-width:520px){.deck:hover .sheet[data-pos="1"]{transform:translate(-30%,-48%) rotate(8deg)}.deck:hover .sheet[data-pos="2"]{transform:translate(-70%,-47%) rotate(-10deg)}}
.deck-note{position:absolute;right:0;top:0;display:flex;gap:6px;z-index:5}
.deck-note button{width:10px;height:10px;border-radius:50%;border:0;background:var(--rule);padding:0;cursor:pointer;transition:background .3s,transform .3s}
.deck-note button.on{background:var(--red);transform:scale(1.3)}

/* ---------- kinetic band ---------- */
.kband{background:var(--gray);overflow:hidden;padding:26px 0;position:relative}
.ktrack{display:flex;width:max-content;gap:0;will-change:transform}
.ktrack span{font-size:clamp(48px,8vw,104px);font-weight:800;line-height:1;text-transform:uppercase;letter-spacing:-.01em;padding:0 34px;white-space:nowrap;color:transparent;-webkit-text-stroke:1.5px rgba(255,255,255,.35)}
.ktrack span.v{-webkit-text-stroke-color:var(--gold-lt)}
.ktrack span.v.fill{color:var(--gold-lt);-webkit-text-stroke:0}
.ktrack span.r{-webkit-text-stroke-color:#d9454f}
.ktrack span.dot{-webkit-text-stroke:0;color:var(--gold);padding:0 10px}

/* ---------- sections ---------- */
section{position:relative;padding:110px 0}
@media (max-width:600px){section{padding:72px 0}}
.tinted{background:var(--tint)}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:var(--red);margin:0 0 14px;display:flex;align-items:center;gap:12px}
.eyebrow b{background:var(--red);color:#fff;font-weight:700;padding:3px 9px;border-radius:0 0 8px 0;letter-spacing:.1em}
h2{font-weight:800;font-size:clamp(34px,4.8vw,60px);line-height:1;margin:0 0 18px;color:var(--gray);text-wrap:balance}
h2 em{font-style:normal;color:var(--gold)}
h2 .threat{color:var(--red)}
.intro{color:var(--soft);max-width:60ch;margin:0 0 44px;font-size:19px}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .9s cubic-bezier(.2,.7,.2,1),transform .9s cubic-bezier(.2,.7,.2,1)}
.reveal.in{opacity:1;transform:none}

/* numbers */
.nums{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) minmax(0,1.5fr);border-top:2px solid var(--gray)}
@media (max-width:900px){.nums{grid-template-columns:repeat(3,minmax(0,1fr))}.num.waffle{grid-column:1/-1}}
@media (max-width:520px){.nums{grid-template-columns:minmax(0,1fr)}}
.num{padding:26px 24px 26px 0;border-bottom:1px solid var(--rule)}
.num+.num{padding-left:24px;border-left:1px solid var(--rule)}
@media (max-width:520px){.num+.num{padding-left:0;border-left:0}}
.num .k{font-size:12px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--gold-ink)}
.num b{display:block;font-size:clamp(56px,6.5vw,92px);font-weight:800;line-height:.95;color:var(--gray);margin:10px 0 8px;font-variant-numeric:tabular-nums}
.num span.d{color:var(--soft);font-size:16px}
.num.waffle .k{color:var(--red)}
.num.waffle b{color:var(--red)}
.num.waffle b small{font-size:.4em;color:var(--muted);font-weight:400}
.squares{display:grid;grid-template-columns:repeat(15,1fr);gap:4px;margin:12px 0 10px;max-width:420px}
.squares i{aspect-ratio:1;background:var(--tint2);border-radius:0 0 3px 0;transition:background .3s,transform .3s}
.squares i.on{background:var(--red);transform:scale(1.04)}
.squares i.vic{box-shadow:inset 0 0 0 1px var(--rule)}
.legend{display:flex;flex-wrap:wrap;gap:14px;font-size:14px;color:var(--soft)}
.legend i{display:inline-block;width:11px;height:11px;margin-right:6px;vertical-align:-1px;border-radius:0 0 3px 0}

/* grading rail */
.grades{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin-top:40px}
@media (max-width:860px){.grades{grid-template-columns:minmax(0,1fr)}}
.grade{padding:20px 22px;color:#fff;position:relative;overflow:hidden}
.grade:last-child{border-radius:var(--corner)}
.grade.v{background:var(--gold)}
.grade.c{background:var(--tint2);color:var(--gray)}
.grade.u{background:var(--red)}
.grade h3{margin:0 0 4px;font-size:22px;font-weight:800;display:flex;align-items:center;gap:10px}
.grade p{margin:0;font-size:16px;opacity:.95}
.grade svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round}
.grade svg *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1s .4s}
.grade.in svg *{stroke-dashoffset:0}
.grade::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(255,255,255,.25) 50%,transparent 70%);transform:translateX(-100%)}
.grade.in::after{animation:sheen 1.4s .6s ease-out}
@keyframes sheen{to{transform:translateX(100%)}}

/* editions: editorial index */
.edx{list-style:none;margin:0;padding:0;border-top:2px solid var(--gray)}
.edx li{border-bottom:1px solid var(--rule)}
.edx a{display:grid;grid-template-columns:70px minmax(0,1fr) auto 200px 40px;gap:20px;align-items:center;padding:22px 10px;text-decoration:none;position:relative;transition:background .35s,color .35s,padding .35s}

.edx .no{font-size:14px;font-weight:700;color:var(--red);letter-spacing:.08em}
.edx b{font-size:clamp(28px,4vw,52px);font-weight:800;line-height:1;color:var(--gray);transition:color .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.edx .yrs{font-size:15px;color:var(--muted);letter-spacing:.06em}
.edx .strip{display:flex;gap:3px;align-items:flex-end;height:30px}
.edx .strip i{flex:1;background:var(--rule);border-radius:0 0 2px 0;transform:scaleY(0);transform-origin:bottom;transition:transform .6s cubic-bezier(.3,1.4,.5,1),background .35s}
.edx li.in .strip i{transform:none}
.edx .strip i.has{background:var(--red)}
.edx .arr{width:40px;height:40px;border-radius:50%;border:1.5px solid var(--gray);display:grid;place-items:center;transition:all .35s}
.edx .arr svg{width:16px;height:16px;stroke:var(--gray);transition:stroke .35s}
.edx a:hover{background:var(--gray);padding-left:24px}
.edx a:hover b{color:#fff;transform:translateX(6px)}
.edx a:hover .yrs{color:#c9c7c3}
.edx a:hover .strip i:not(.has){background:rgba(255,255,255,.18)}
.edx a:hover .arr{background:var(--gold);border-color:var(--gold);transform:rotate(-45deg)}
.edx a:hover .arr svg{stroke:#fff}
@media (max-width:760px){.edx a{grid-template-columns:62px minmax(0,1fr) 40px;gap:12px;padding:18px 6px}.edx a .yrs,.edx a .strip{display:none}.edx b{font-size:26px}}
.peek{position:fixed;left:0;top:0;width:240px;aspect-ratio:4/3;pointer-events:none;z-index:40;opacity:0;transform:translate(0,-100%) scale(.85) rotate(-3deg);transform-origin:0 100%;transition:opacity .25s,transform .35s cubic-bezier(.2,.7,.2,1);border-radius:var(--corner);overflow:hidden;box-shadow:0 30px 60px -25px rgba(0,0,0,.6)}
.peek.on{opacity:1;transform:translate(0,-100%) scale(1) rotate(-3deg)}
.peek .im{position:absolute;inset:0;background-size:cover;background-position:center;filter:grayscale(1) contrast(1.15)}
.peek .tn{position:absolute;inset:0;background:var(--gold);mix-blend-mode:multiply;opacity:.7}
.peek .gl{position:absolute;inset:0;background:var(--gray);display:grid;place-items:center}
.peek .gl svg{width:60%;stroke:var(--gold-lt);fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
@media (hover:none){.peek{display:none}}

/* filmstrip of files */
.film-head{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:26px}
.film-ctl{display:flex;gap:8px}
.film-ctl button{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--gray);background:#fff;cursor:pointer;display:grid;place-items:center;transition:all .25s}
.film-ctl button:hover{background:var(--gray)}.film-ctl button:hover svg{stroke:#fff}
.film-ctl svg{width:18px;height:18px;stroke:var(--gray);fill:none;stroke-width:2.4}
.film{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;padding:6px 24px 30px;margin:0 -24px;cursor:grab;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.film::-webkit-scrollbar{display:none}
@media (max-width:600px){.film{margin:0 -16px;padding:6px 16px 30px}}
.film.drag{cursor:grabbing;scroll-snap-type:none}
.film.drag a{pointer-events:none}
.yearmark{flex:none;width:120px;scroll-snap-align:start;display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:6px;border-left:2px solid var(--gray);padding-left:14px}
.yearmark b{font-size:46px;font-weight:800;line-height:1;color:var(--gray)}
.yearmark span{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.fc{flex:none;width:250px;min-height:250px;scroll-snap-align:start;background:#fff;text-decoration:none;display:flex;flex-direction:column;border-radius:var(--corner);box-shadow:0 0 0 1px var(--rule);transition:transform .3s,box-shadow .3s;position:relative;overflow:hidden}
.fc:hover{transform:translateY(-6px);box-shadow:0 0 0 1px var(--rule),0 24px 40px -24px rgba(65,64,66,.55)}
.fc .tb{align-self:flex-start;background:var(--red);color:#fff;font-size:12px;letter-spacing:.1em;padding:5px 12px 5px 14px;border-radius:0 0 12px 0}
.fc .bd{padding:14px 18px 18px;display:flex;flex-direction:column;flex:1}
.fc .ed{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);font-weight:700}
.fc b{font-size:20px;line-height:1.15;color:var(--gray);margin:6px 0 10px}
.fc .st{margin-top:auto;font-size:14.5px;color:var(--soft);border-top:1px solid var(--rule);padding-top:10px}
.fc::after{content:"";position:absolute;left:0;bottom:0;height:3px;width:100%;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .4s}
.fc:hover::after{transform:none}
.filmbar{height:3px;background:var(--rule);margin-top:6px;position:relative;overflow:hidden}
.filmbar i{position:absolute;left:0;top:0;bottom:0;background:var(--gray);width:20%;transition:transform .1s linear}

/* ledger */
.ledger-tools{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:16px}
.search{flex:1 1 280px;position:relative}
.search input{width:100%;font:inherit;font-size:17px;color:var(--gray);background:#fff;border:1.5px solid var(--rule);border-radius:var(--corner);padding:13px 18px 13px 46px;transition:border-color .2s,box-shadow .2s}
.search input:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 4px rgba(183,155,94,.18)}
.search svg{position:absolute;left:17px;top:50%;transform:translateY(-50%);width:18px;height:18px;stroke:var(--muted);fill:none;stroke-width:2}
select{font:inherit;font-size:16px;color:var(--gray);background:#fff;border:1.5px solid var(--rule);padding:12px 14px;border-radius:0 0 14px 0}
.count{font-size:14px;color:var(--muted);letter-spacing:.06em}
.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;min-width:720px;font-size:16px}
th{text-align:left;background:var(--gray);color:#fff;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;padding:0}
th:last-child{border-radius:0 0 14px 0}
th button{all:unset;cursor:pointer;display:flex;align-items:center;gap:6px;padding:12px 14px;width:100%;box-sizing:border-box}
th button:focus-visible{outline:2px solid var(--gold);outline-offset:-2px}
th button::after{content:"↕";opacity:.4;font-size:12px}
th[aria-sort="ascending"] button::after{content:"↑";opacity:1;color:var(--gold-lt)}
th[aria-sort="descending"] button::after{content:"↓";opacity:1;color:var(--gold-lt)}
td{padding:13px 14px;border-bottom:1px solid var(--rule);vertical-align:top;color:var(--soft)}
tbody tr{transition:background .2s}
tbody tr:hover{background:#faf8f3}
td.f{font-weight:700;color:var(--red);white-space:nowrap}
td a{color:var(--gray);font-weight:700;text-decoration:none;background:linear-gradient(var(--gold),var(--gold)) 0 100%/0 2px no-repeat;transition:background-size .3s}
td a:hover{background-size:100% 2px}
tr.hide{display:none}

/* method */
.method{background:var(--gray);color:#e8e6e2;position:relative;overflow:hidden}
.method .docgrid i{border-color:rgba(255,255,255,.05);animation:none;transform:none}
.method .wrap{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:48px;align-items:end;z-index:1}
@media (max-width:860px){.method .wrap{grid-template-columns:minmax(0,1fr)}}
.method h2{color:#fff}
.method h2 em{color:var(--gold-lt)}
.method .eyebrow{color:var(--gold-lt)}
.method p{color:#d6d4cf;font-size:19px;max-width:54ch}
.method .btn.gold:hover{background:var(--gold-lt);color:var(--gray)}
.cite{font-size:15px;background:rgba(255,255,255,.06);border-left:4px solid var(--gold);padding:16px 18px;color:#fff;overflow-wrap:anywhere}
.cite small{display:block;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-lt);margin-bottom:6px}

footer{background:var(--gray-dn);color:#bdbab5;padding:48px 0 70px;font-size:15px;position:relative}
footer .wrap{display:flex;flex-wrap:wrap;gap:24px 40px;justify-content:space-between;align-items:flex-start}
footer nav{display:flex;flex-wrap:wrap;gap:10px 20px}
footer a{text-decoration:none}footer a:hover{color:#fff}
footer img{height:64px;margin-left:-18px}
.pgnum{position:absolute;left:0;bottom:0;background:var(--red);color:#fff;font-weight:700;padding:8px 22px 8px 24px;border-radius:0 18px 0 0;font-size:15px}


/* ---------- motion layer ---------- */
.progress{position:fixed;left:0;top:0;height:4px;width:100%;background:var(--gold);transform-origin:0 50%;transform:scaleX(0);z-index:60}
/* rolling digits, like a mechanical counter */
.odo{display:inline-flex;overflow:hidden;line-height:1;height:1em;vertical-align:top}
.odo .dg{display:inline-block;height:1em;overflow:hidden}
.odo .rl{display:flex;flex-direction:column;transition:transform 2.2s cubic-bezier(.15,.75,.15,1)}
.odo .rl span{height:1em;line-height:1;display:block}
/* headings word by word, gold words underline themselves */
.split .wd{display:inline-block;opacity:0;transform:translateY(.55em);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1);transition-delay:calc(var(--i) * 60ms)}
.split.in .wd{opacity:1;transform:none}
.split em,.split .threat{background:linear-gradient(currentColor,currentColor) 0 96%/0 4px no-repeat;transition:background-size 1s cubic-bezier(.2,.7,.2,1) .8s}
.split.in em,.split.in .threat{background-size:100% 4px}
/* eyebrow number badges flip in */
.eyebrow b{display:inline-block;transform:rotateX(90deg);transition:transform .6s cubic-bezier(.3,1.5,.5,1) .1s}
.eyebrow.in b{transform:none}
/* hero: tab slides in from the edge, the deck floats */
.ftab{transform:translateX(-110%);animation:slidein .9s cubic-bezier(.2,.7,.2,1) .05s forwards}
@keyframes slidein{to{transform:none}}
.deck{animation:float 7s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.btn.gold svg{animation:nudge 1.8s ease-in-out infinite}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
/* numbers: rules draw themselves */
.nums{border-top:0;position:relative}
.nums::before{content:"";position:absolute;left:0;right:0;top:0;height:2px;background:var(--gray);transform:scaleX(0);transform-origin:left;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.nums.in::before{transform:none}
.num{opacity:0;transform:translateY(18px);transition:opacity .7s,transform .7s cubic-bezier(.2,.7,.2,1)}
.nums.in .num{opacity:1;transform:none}
.nums.in .num:nth-child(2){transition-delay:.15s}.nums.in .num:nth-child(3){transition-delay:.3s}.nums.in .num:nth-child(4){transition-delay:.45s}
.squares i.on{animation:pop .4s cubic-bezier(.3,1.6,.5,1)}
@keyframes pop{from{transform:scale(.3)}}
.grade.reveal:nth-child(2){transition-delay:.12s}.grade.reveal:nth-child(3){transition-delay:.24s}
/* edition rows slide in one after another; names wipe in */
.edx li{opacity:0;transform:translateX(-30px);transition:opacity .7s,transform .7s cubic-bezier(.2,.7,.2,1)}
.edx li.in{opacity:1;transform:none}
.edx li b{clip-path:inset(0 100% 0 0);transition:clip-path 1s cubic-bezier(.2,.7,.2,1) .2s,color .35s,transform .45s cubic-bezier(.2,.7,.2,1)}
.edx li.in b{clip-path:inset(0 0 0 0)}
.edx .arr{transition:all .35s}
.edx li.in .arr{animation:spinin .7s cubic-bezier(.3,1.4,.5,1) .5s both}
@keyframes spinin{from{transform:rotate(-180deg) scale(.4);opacity:0}}
/* filmstrip cards rise as they arrive */
.fc,.yearmark{opacity:0;transform:translateY(24px);transition:opacity .6s,transform .6s cubic-bezier(.2,.7,.2,1),box-shadow .3s}
.fc.in,.yearmark.in{opacity:1;transform:none}
.fc.in:hover{transform:translateY(-6px)}
.yearmark b{display:inline-block}
.yearmark.in b{animation:yr .8s cubic-bezier(.3,1.4,.5,1)}
@keyframes yr{from{transform:translateY(40%);opacity:0}}
/* ledger rows cascade */
tbody tr{animation:rowin .5s cubic-bezier(.2,.7,.2,1) both;animation-delay:calc(var(--r,0) * 25ms)}
@keyframes rowin{from{opacity:0;transform:translateY(8px)}}
.ledger-wait tbody tr{animation:none;opacity:0}
/* method: citation types itself */
.cite .tt::after{content:"";display:inline-block;width:.5em;height:1em;background:var(--gold-lt);margin-left:2px;vertical-align:-2px;animation:caret .8s steps(1) infinite}
.cite .tt.done::after{display:none}
@keyframes caret{50%{opacity:0}}
.method .docgrid i{transform:scaleY(0);transition:transform 1.4s cubic-bezier(.2,.7,.2,1)}
.method.in .docgrid i{transform:none}
.method.in .docgrid i:nth-child(2){transition-delay:.1s}.method.in .docgrid i:nth-child(3){transition-delay:.2s}.method.in .docgrid i:nth-child(4){transition-delay:.3s}.method.in .docgrid i:nth-child(5){transition-delay:.4s}.method.in .docgrid i:nth-child(6){transition-delay:.5s}
.pgnum{transform:translateX(-100%);transition:transform .8s cubic-bezier(.2,.7,.2,1)}
footer.in .pgnum{transform:none}


@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;transition-delay:0s!important;animation-delay:0s!important}
  .reveal,.num,.edx li,.fc,.yearmark{opacity:1;transform:none}
}

/* ===== Concept D: Concept C's layout in Concept B's colours ===== */
:root{--ink:#F0EEED;--soft:#DAD7D2;--muted:#BDBAB5;--rule:rgba(240,238,237,.14);--tint:#38373a;--tint2:#545356;
  --b-up:#4a494c;--b-up2:#545356;--b-down:#38373a;--red-txt:#E8656D;--w:#F0EEED;
  --noise:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .55 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
html,body{background:#414042}
body::after{content:"";position:fixed;inset:0;background-image:var(--noise);opacity:.07;pointer-events:none;z-index:100;mix-blend-mode:overlay}
.top{background:rgba(65,64,66,.9)}
.top.solid{box-shadow:0 1px 0 rgba(240,238,237,.12),0 10px 30px -20px rgba(0,0,0,.6)}
.brand span{color:var(--w);border-left-color:rgba(240,238,237,.14)}
.top nav a{color:var(--muted)}.top nav a:hover{color:var(--w)}
.top .cta{background:var(--gold-lt);color:#414042}.top .cta:hover{background:var(--gold-soft);color:#414042}
.hero{background:radial-gradient(900px 420px at 85% 20%,rgba(183,155,94,.16),transparent 70%)}
.docgrid i{border-color:rgba(240,238,237,.06)}
.hero h1{color:var(--w)}.hero h1 em{color:var(--gold-lt)}.hero h1 em::after{background:var(--gold-lt)}.hero h1 .threat{color:var(--red-txt)}
.lede b{color:var(--w)}
.btn.gold{background:var(--gold-lt);color:#414042}.btn.gold:hover{background:#DCCDA8;color:#414042}
.btn.line{border-color:rgba(240,238,237,.4);color:var(--w)}.btn.line:hover{background:rgba(240,238,237,.1);color:var(--w)}
.sheet img{box-shadow:0 30px 60px -25px rgba(0,0,0,.75),0 0 0 1px rgba(0,0,0,.2)}
.deck-note button{background:rgba(240,238,237,.25)}.deck-note button.on{background:var(--red-lt)}
/* ticker from Concept B */
.ticker{border-block:1px solid var(--rule);background:var(--b-down);overflow:hidden;position:relative}
.ticker::before,.ticker::after{content:"";position:absolute;top:0;bottom:0;width:80px;z-index:2;pointer-events:none}
.ticker::before{left:0;background:linear-gradient(90deg,var(--b-down),transparent)}
.ticker::after{right:0;background:linear-gradient(-90deg,var(--b-down),transparent)}
.track{display:flex;width:max-content;animation:slide 90s linear infinite}
.ticker:hover .track{animation-play-state:paused}
.track a{display:flex;align-items:center;gap:10px;padding:14px 26px;white-space:nowrap;text-decoration:none;font-size:15px;color:var(--muted);border-right:1px solid var(--rule);transition:color .2s}
.track a:hover{color:var(--w)}
.track b{color:var(--gold-lt);font-weight:700;letter-spacing:.06em}
.track i{width:7px;height:7px;border-radius:50%;flex:none;background:var(--red-lt);animation:blink 2.6s ease-in-out infinite}
.track a:nth-child(3n) i{animation-delay:.8s}.track a:nth-child(3n+1) i{animation-delay:1.6s}
@keyframes slide{to{transform:translateX(-50%)}}
@keyframes blink{0%,100%{opacity:1;box-shadow:0 0 0 0 rgba(204,34,43,.6)}50%{opacity:.55;box-shadow:0 0 0 5px rgba(204,34,43,0)}}
/* sections */
.tinted{background:var(--b-down)}
.eyebrow{color:var(--gold-lt)}
h2{color:var(--w)}h2 em{color:var(--gold-lt)}h2 .threat{color:var(--red-txt)}
.nums::before{background:rgba(240,238,237,.55)}
.num .k{color:var(--gold-lt)}.num b{color:var(--w)}
.num.waffle .k,.num.waffle b{color:var(--red-txt)}
.squares i{background:#545356}.squares i.on{background:var(--red-lt)}
.grade.v{background:var(--gold)}.grade.c{background:#545356;color:var(--w)}
.edx{border-top-color:rgba(240,238,237,.5)}
.edx b{color:var(--w)}.edx .no{color:var(--red-txt)}
.edx .strip i{background:rgba(240,238,237,.15)}.edx .strip i.has{background:var(--red-lt)}
.edx .arr{border-color:rgba(240,238,237,.4)}.edx .arr svg{stroke:var(--w)}
.edx a:hover{background:#4a494c}.edx a:hover .yrs{color:var(--soft)}
.edx a:hover .arr{background:var(--gold-lt);border-color:var(--gold-lt)}.edx a:hover .arr svg{stroke:#414042}
/* illustrations: gold line art, one red element (brand: analogous images carry a red component) */
.edx a{grid-template-columns:64px 70px minmax(0,1fr) auto 200px 40px}
.edx .ic{width:64px;height:48px;display:block}
.ill{width:100%;height:100%;fill:none;stroke:var(--gold-lt);stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.ill .r{stroke:var(--red-txt)}
.edx .ill *{stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.6s cubic-bezier(.4,.1,.2,1) .4s}
.edx li.in .ill *{stroke-dashoffset:0}
.edx a:hover .ic{transform:scale(1.12) rotate(-3deg)}.edx .ic{transition:transform .4s cubic-bezier(.3,1.4,.5,1)}
@media (max-width:760px){.edx a{grid-template-columns:48px 56px minmax(0,1fr) 40px}.edx .ic{width:48px;height:36px}}
.peek{width:300px;aspect-ratio:4/3}
.peek .gl{background:radial-gradient(240px 160px at 70% 20%,rgba(183,155,94,.28),transparent 70%),#38373a;padding:22px;display:block}
.peek .gl .ill{stroke-width:2.6}
.peek .ill.draw *{stroke-dasharray:1;stroke-dashoffset:1;animation:drawin 1.1s cubic-bezier(.4,.1,.2,1) forwards}
.peek .ill.draw .r{animation-delay:.5s}
@keyframes drawin{to{stroke-dashoffset:0}}
/* filmstrip */
.film-ctl button{background:transparent;border-color:rgba(240,238,237,.4)}.film-ctl svg{stroke:var(--w)}
.film-ctl button:hover{background:var(--gold-lt);border-color:var(--gold-lt)}.film-ctl button:hover svg{stroke:#414042}
.yearmark{border-left-color:var(--gold-lt)}.yearmark b{color:var(--w)}
.fc{background:#4a494c;box-shadow:0 0 0 1px rgba(240,238,237,.08)}
.fc:hover,.fc.in:hover{background:#545356;box-shadow:0 0 0 1px rgba(240,238,237,.14),0 24px 40px -24px rgba(0,0,0,.7)}
.fc .ed{color:var(--gold-lt)}.fc b{color:var(--w)}.fc .st{color:var(--soft)}
.filmbar i{background:var(--gold-lt)}
/* ledger */
.search input,select{background:#4a494c;color:var(--w);border-color:rgba(240,238,237,.14)}
.search input::placeholder{color:#9c9a97}.search svg{stroke:var(--muted)}
.search input:focus{border-color:var(--gold-lt);box-shadow:0 0 0 4px rgba(201,173,116,.2)}
th{background:#2f2e31}
th[aria-sort] button::after{color:var(--gold-lt)}
td{color:var(--soft)}td a{color:var(--w)}td.f{color:var(--red-txt)}
tbody tr:hover{background:rgba(240,238,237,.05)}
/* method: the gold band from Concept B */
.method{background:var(--gold);color:#fff}
.method .docgrid i{border-color:rgba(65,64,66,.12)}
.method h2{color:#fff}.method h2 em{color:#414042}
/* underlines always match the colour of the text they sit under */
.top nav a::after{background:currentColor}
td a{background-image:linear-gradient(currentColor,currentColor)}
.method .eyebrow{color:var(--red)}
.method p{color:#fff;font-weight:400}
.method .btn.gold{background:#414042;color:#F0EEED}.method .btn.gold:hover{background:#2f2e31;color:#F0EEED}
.cite{background:rgba(65,64,66,.88);border-left-color:#fff}
.cite small{color:var(--gold-lt)}
.progress{background:var(--gold-lt)}

/* ===== D: no red text; red only as underlines and blocks ===== */
.peek .ill .r,.edx .ill .r{stroke:var(--red-lt)}
/* text */
.edx .no,h2 .threat,.hero h1 .threat,.num.waffle .k,.num.waffle b,td.f{color:var(--gold-lt)}
.method .eyebrow{color:#414042}
.method h2 em{color:#414042}
.ctas{gap:10px}.ctas .btn{padding:15px 18px}
@media (max-width:1100px) and (min-width:961px){.ctas .btn{font-size:13px;padding:14px 14px}}

/* anniversaries */
#anniv{background:#38373a}
.anns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
@media (max-width:820px){.anns{grid-template-columns:minmax(0,1fr)}}
.ann{position:relative;display:grid;grid-template-columns:150px minmax(0,1fr);gap:24px;align-items:start;padding:0 28px 28px;background:#4a494c;border-radius:0 0 30px 0;text-decoration:none;overflow:hidden;isolation:isolate;transition:transform .35s cubic-bezier(.2,.7,.2,1),background .3s,box-shadow .3s;opacity:0;transform:translateY(24px)}
.ann.in{opacity:1;transform:none}
.ann.in:hover{transform:translateY(-6px);background:#545356;box-shadow:0 30px 50px -30px rgba(0,0,0,.7)}
.ann .when{grid-column:1/-1;align-self:start;justify-self:start;background:var(--red);color:#fff;font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;padding:7px 14px 7px 16px;margin:0 0 4px -28px;border-radius:0 0 14px 0}
.ann.next .when{background:var(--gold-lt);color:#414042}
.cal{background:#F0EEED;color:#414042;border-radius:0 0 22px 0;overflow:hidden;text-align:center;box-shadow:0 20px 30px -18px rgba(0,0,0,.6)}
.cal .mo{background:#2f2e31;color:var(--gold-lt);font-size:14px;letter-spacing:.16em;text-transform:uppercase;font-weight:700;padding:8px 0}
.cal .dy{font-size:64px;font-weight:800;line-height:1;padding:10px 0 2px}
.cal .yr{font-size:13px;letter-spacing:.12em;color:#76757a;padding-bottom:10px}
.ann .yrs{display:block;font-size:clamp(34px,4vw,52px);font-weight:800;line-height:1;color:var(--gold-lt);margin:2px 0 8px}
.ann .rel{font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-weight:700;color:var(--soft)}
.ann b.t{display:block;font-size:22px;line-height:1.2;color:#F0EEED;margin:10px 0 6px}
.ann .meta{font-size:15px;color:var(--soft);line-height:1.45}
.ann .meta i{font-style:normal;color:var(--gold-lt)}
.ann .ill{position:absolute;right:-18px;bottom:-12px;width:46%;z-index:-1;opacity:.14;fill:none;stroke:var(--gold-lt);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.ann .ill .r{stroke:var(--red-lt)}
.ann .go{position:absolute;top:16px;right:16px;width:40px;height:40px;border-radius:50%;border:1.5px solid rgba(240,238,237,.4);display:grid;place-items:center;transition:all .3s}
.ann .go svg{width:15px;height:15px;stroke:#F0EEED}
.ann:hover .go{background:var(--gold-lt);border-color:var(--gold-lt);transform:rotate(-45deg)}.ann:hover .go svg{stroke:#414042}
.cal{transform:rotate(-4deg);transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.ann:hover .cal{transform:rotate(0) scale(1.04)}
.ann.in .cal .dy{animation:flip .8s cubic-bezier(.3,1.4,.5,1) .3s both}
@keyframes flip{from{transform:rotateX(90deg);opacity:0}}
@media (max-width:480px){.ann{grid-template-columns:100px minmax(0,1fr);gap:16px;padding:0 18px 22px}.ann .when{margin-left:-18px}.cal .dy{font-size:44px}}
@media (prefers-reduced-motion:reduce){.ann{opacity:1;transform:none}}
/* alternate section grounds after the reorder: grey, dark, grey, dark, grey */
#anniv.tinted{background:transparent}
section[aria-labelledby="nh"]{background:#38373a}
#editions.tinted{background:transparent}
section[aria-labelledby="fh"]{background:#38373a}
#ledger.tinted{background:transparent}

/* ===== Light theme (toggle, bottom right). Same layout; white ground, grey type, darker gold for text ===== */
html[data-theme="light"]{--ink:#414042;--soft:#5e5d60;--muted:#6f6e71;--rule:#dcdbda;--tint:#f3f3f3;--tint2:#e9e8e8;--b-up:#ffffff;--b-up2:#f3f3f3;--b-down:#f3f3f3;--w:#414042;--gtx:#8a6f35;--gill:#B79B5E}
html[data-theme="light"],html[data-theme="light"] body{background:#ffffff}
html[data-theme="light"] body::after{display:none}
html[data-theme="light"] :focus-visible{outline-color:#8a6f35}
html[data-theme="light"] .top{background:rgba(255,255,255,.92)}
html[data-theme="light"] .top.solid{box-shadow:0 1px 0 var(--rule),0 10px 30px -20px rgba(65,64,66,.35)}
html[data-theme="light"] .brand span{color:#414042;border-left-color:var(--rule)}
html[data-theme="light"] .top nav a{color:var(--soft)}html[data-theme="light"] .top nav a:hover{color:#414042}
html[data-theme="light"] .hero{background:radial-gradient(900px 420px at 85% 20%,rgba(183,155,94,.14),transparent 70%)}
html[data-theme="light"] .docgrid i{border-color:rgba(65,64,66,.07)}
html[data-theme="light"] .hero h1,html[data-theme="light"] .lede b,html[data-theme="light"] h2,html[data-theme="light"] .num b,html[data-theme="light"] .edx b,html[data-theme="light"] .edx a:hover b,html[data-theme="light"] .yearmark b,html[data-theme="light"] .fc b,html[data-theme="light"] td a,html[data-theme="light"] .ann b.t{color:#414042}
html[data-theme="light"] .method h2{color:#fff}
/* gold text: the darker brand gold, readable on white */
html[data-theme="light"] .hero h1 em,html[data-theme="light"] h2 em,html[data-theme="light"] .eyebrow,html[data-theme="light"] .num .k,html[data-theme="light"] .track b,html[data-theme="light"] .fc .ed,html[data-theme="light"] .edx .no,html[data-theme="light"] h2 .threat,html[data-theme="light"] .hero h1 .threat,html[data-theme="light"] .num.waffle .k,html[data-theme="light"] .num.waffle b,html[data-theme="light"] td.f,html[data-theme="light"] .ann .yrs,html[data-theme="light"] .ann .meta i{color:var(--gtx)}
html[data-theme="light"] .method h2 em,html[data-theme="light"] .method .eyebrow{color:#414042}
html[data-theme="light"] .btn.line{border-color:#414042;color:#414042}html[data-theme="light"] .btn.line:hover{background:#414042;color:#fff}
html[data-theme="light"] .sheet img{box-shadow:0 30px 60px -25px rgba(65,64,66,.5),0 0 0 1px rgba(65,64,66,.1)}
html[data-theme="light"] .deck-note button{background:#dcdbda}html[data-theme="light"] .deck-note button.on{background:var(--red)}
html[data-theme="light"] .track a{color:var(--soft)}html[data-theme="light"] .track a:hover{color:#414042}
html[data-theme="light"] .nums::before{background:#414042}
html[data-theme="light"] .squares i{background:#e9e8e8}html[data-theme="light"] .squares i.on{background:var(--red)}
html[data-theme="light"] .grade.c{background:#e9e8e8;color:#414042}
html[data-theme="light"] .edx{border-top-color:#414042}
html[data-theme="light"] .edx .strip i{background:#dcdbda}html[data-theme="light"] .edx .strip i.has{background:var(--red)}
html[data-theme="light"] .edx .arr{border-color:#414042}html[data-theme="light"] .edx .arr svg{stroke:#414042}
html[data-theme="light"] .edx a:hover{background:#f3f3f3}html[data-theme="light"] .edx a:hover .yrs{color:var(--soft)}
html[data-theme="light"] .edx a:hover .strip i:not(.has){background:#d3d2d0}
html[data-theme="light"] .edx a:hover .arr{background:var(--gold-lt);border-color:var(--gold-lt)}
html[data-theme="light"] .ill,html[data-theme="light"] .peek .gl svg{stroke:var(--gill)}
html[data-theme="light"] .peek .gl{background:radial-gradient(240px 160px at 70% 20%,rgba(183,155,94,.22),transparent 70%),#f3f3f3}
html[data-theme="light"] .peek{box-shadow:0 30px 60px -25px rgba(65,64,66,.45),0 0 0 1px #e6e4e1}
html[data-theme="light"] .film-ctl button{background:#fff;border-color:#414042}html[data-theme="light"] .film-ctl svg{stroke:#414042}
html[data-theme="light"] .film-ctl button:hover{background:var(--gold-lt);border-color:var(--gold-lt)}
html[data-theme="light"] .fc{background:#fff;box-shadow:0 0 0 1px var(--rule)}
html[data-theme="light"] .fc:hover,html[data-theme="light"] .fc.in:hover{background:#fff;box-shadow:0 0 0 1px var(--rule),0 24px 40px -24px rgba(65,64,66,.45)}
html[data-theme="light"] .search input,html[data-theme="light"] select{background:#fff;color:#414042;border-color:var(--rule)}
html[data-theme="light"] .search input::placeholder{color:#8a898c}
html[data-theme="light"] .search input:focus{border-color:var(--gold);box-shadow:0 0 0 4px rgba(183,155,94,.18)}
html[data-theme="light"] th{background:#414042}
html[data-theme="light"] tbody tr:hover{background:#faf8f3}
/* section grounds: white, pale grey, white, pale grey, white */
html[data-theme="light"] #anniv.tinted,html[data-theme="light"] #editions.tinted,html[data-theme="light"] #ledger.tinted{background:transparent}
html[data-theme="light"] section[aria-labelledby="nh"],html[data-theme="light"] section[aria-labelledby="fh"]{background:#f3f3f3}
/* anniversaries */
html[data-theme="light"] .ann{background:#f3f3f3}
html[data-theme="light"] .ann.in:hover{background:#ecebea;box-shadow:0 30px 50px -30px rgba(65,64,66,.4)}
html[data-theme="light"] .cal{background:#fff;box-shadow:0 16px 28px -16px rgba(65,64,66,.45),0 0 0 1px #e6e4e1}
html[data-theme="light"] .ann .ill{stroke:var(--gill);opacity:.2}
html[data-theme="light"] .ann .go{border-color:rgba(65,64,66,.4)}html[data-theme="light"] .ann .go svg{stroke:#414042}
html[data-theme="light"] .ann:hover .go{background:var(--gold-lt);border-color:var(--gold-lt)}
/* logo for a white header */
.brand img.lt{display:none}
html[data-theme="light"] .brand img.dk{display:none}html[data-theme="light"] .brand img.lt{display:block}

/* ===== theme toggle ===== */
.themer{position:fixed;right:20px;bottom:20px;z-index:90;display:inline-flex;align-items:center;gap:8px;font:700 13px/1 "Roboto Condensed","Arial Narrow",Arial,sans-serif;letter-spacing:.1em;text-transform:uppercase;padding:12px 16px 12px 13px;border:0;border-radius:0 0 18px 0;cursor:pointer;background:#F0EEED;color:#414042;box-shadow:0 14px 30px -12px rgba(0,0,0,.6),0 0 0 1px rgba(0,0,0,.08);transition:background .25s,color .25s,transform .25s}
.themer:hover{background:#C9AD74;color:#414042;transform:translateY(-2px)}
.themer svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}
.themer .mo{display:none}
html[data-theme="light"] .themer{background:#414042;color:#F0EEED;box-shadow:0 14px 30px -12px rgba(65,64,66,.55)}
html[data-theme="light"] .themer:hover{background:#C9AD74;color:#414042}
html[data-theme="light"] .themer .su{display:none}html[data-theme="light"] .themer .mo{display:block}
@media (max-width:600px){.themer{right:14px;bottom:14px;padding:12px}.themer .tx{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}}
html.theming,html.theming *,html.theming *::before,html.theming *::after{transition:background-color .35s,color .35s,border-color .35s,fill .35s,stroke .35s!important}
@media print{.themer{display:none}}