:root{--ink:#161716;--paper:#f3f1eb;--warm:#e5e1d8;--accent:#8f3b39;--muted:#77746d;--zoom:100%}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{margin:0;color:var(--ink);background:var(--paper);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif}
a{color:inherit}
.hero{min-height:72svh;display:grid;grid-template-columns:minmax(0,1fr) minmax(250px,420px);gap:clamp(30px,7vw,96px);align-items:center;padding:clamp(28px,6vw,88px);background:#111312;color:#f6f3ea}
.eyebrow{margin:0 0 18px;color:#c9857e;font-size:10px;font-weight:700;letter-spacing:.23em;text-transform:uppercase}
h1{margin:0;font:500 clamp(49px,8vw,108px)/.9 Georgia,serif;letter-spacing:-.045em}
.intro{max-width:620px;margin:25px 0 0;font:400 clamp(18px,2vw,24px)/1.5 Georgia,serif;color:#ddd9d0}
.actions{display:flex;flex-wrap:wrap;gap:9px;margin-top:30px}
.button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:0 17px;border:1px solid rgba(255,255,255,.27);background:transparent;color:white;text-decoration:none;font-size:10px;font-weight:720;letter-spacing:.13em;text-transform:uppercase;cursor:pointer}
.button.primary{background:var(--accent);border-color:var(--accent)}
.cover{display:block;width:100%;box-shadow:0 26px 70px rgba(0,0,0,.48)}
.guide{padding:38px max(22px,calc((100vw - 980px)/2));background:var(--warm);border-bottom:1px solid #ccc7bc}
.guide h2{margin:0 0 10px;font:500 clamp(27px,4vw,45px)/1.05 Georgia,serif;letter-spacing:-.025em}
.guide p{max-width:760px;margin:0;color:#56534d;line-height:1.62}
.toolbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:center;gap:7px;padding:9px max(10px,env(safe-area-inset-left));background:rgba(17,19,18,.96);color:#fff;border-bottom:1px solid rgba(255,255,255,.13);backdrop-filter:blur(14px)}
.toolbar button,.toolbar a{height:39px;border:1px solid rgba(255,255,255,.2);background:transparent;color:white;padding:0 12px;font:700 11px/1 system-ui;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;cursor:pointer}
.toolbar button:hover,.toolbar a:hover{background:rgba(255,255,255,.09)}
.mag-language{height:38px;min-width:104px;border:1px solid rgba(255,255,255,.24);padding:0 24px 0 9px;background:#1a2723;color:#fff;font:700 12px/1 Arial,sans-serif;cursor:pointer}
#counter{min-width:70px;text-align:center;font:600 11px/1 system-ui;color:#d6d3cb}
.reader{max-width:1040px;margin:0 auto;padding:40px 20px 95px}
.page{position:relative;margin:0 0 clamp(34px,7vw,78px);scroll-margin-top:70px}
.page-head{display:flex;justify-content:space-between;align-items:end;max-width:850px;margin:0 auto 9px;color:var(--muted);font-size:9px;letter-spacing:.14em;text-transform:uppercase}
.page-head strong{color:var(--ink)}
.page-window{max-width:850px;margin:auto;overflow:auto;overscroll-behavior-inline:contain;background:#d2cec5;box-shadow:0 16px 46px rgba(24,23,20,.17);scrollbar-color:var(--accent) transparent}
.page-window img{display:block;width:var(--zoom);max-width:none;height:auto;transition:width .2s ease;cursor:zoom-in}
.page-translation{display:none;position:absolute;z-index:3;inset:29px 50% 0 auto;transform:translateX(50%);width:min(850px,100%);overflow:auto;margin:0;background:rgba(247,237,216,.97);color:#142a24;border-top:5px solid #9e2637;padding:clamp(18px,4vw,38px);text-align:left;box-shadow:0 16px 46px rgba(24,23,20,.17)}
.page-translation>span{display:block;color:#9e2637;font:800 11px/1.2 Arial,sans-serif;letter-spacing:.13em;text-transform:uppercase}
.page-translation h2{margin:9px 0 12px;font:600 clamp(25px,4vw,38px)/1 Georgia,serif}
.page-translation p{margin:0;font:400 clamp(16px,2.3vw,19px)/1.58 Georgia,serif;max-width:68ch}
.translation-en .page-translation{display:block}
body[data-year="2025"] .page:nth-child(3) .page-window img{clip-path:inset(1.45% 0 0);margin-top:-1.45%}
body.zoomed .page-window img{cursor:zoom-out}
.toc{position:fixed;inset:0;z-index:40;display:none;place-items:center;padding:18px;background:rgba(12,13,12,.74);backdrop-filter:blur(9px)}
.toc.open{display:grid}
.toc-card{width:min(560px,100%);max-height:88svh;overflow:auto;padding:26px;background:#f7f4ec;box-shadow:0 25px 90px rgba(0,0,0,.38)}
.toc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:18px}.toc h2{margin:0;font:500 30px/1 Georgia,serif}.toc-close{width:38px;height:38px;border:0;background:var(--ink);color:#fff;font-size:20px}
.toc-list{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:#d4d0c6;border:1px solid #d4d0c6}
.toc-list a{display:grid;place-items:center;min-height:52px;background:#f7f4ec;text-decoration:none;font-size:12px}.toc-list a:hover{background:#ebe6dc}.toc-list b{color:var(--accent)}
footer{padding:42px 22px 66px;text-align:center;background:var(--ink);color:#d7d4cc}footer strong{display:block;margin-bottom:10px;font:500 27px/1 Georgia,serif}footer a{color:#fff}
:is(body[data-year="2025"],body[data-year="2023"]){--paper:#fff;--warm:#fff;background:#fff}
:is(body[data-year="2025"],body[data-year="2023"]) .hero{background:#fff;color:var(--ink);border-bottom:1px solid #ddd}
:is(body[data-year="2025"],body[data-year="2023"]) .hero .intro{color:#555}
:is(body[data-year="2025"],body[data-year="2023"]) .button{border-color:#b8b8b8;color:var(--ink)}
:is(body[data-year="2025"],body[data-year="2023"]) .button.primary{background:var(--ink);border-color:var(--ink);color:#fff}
:is(body[data-year="2025"],body[data-year="2023"]) .guide{background:#fff;border-bottom:1px solid #ddd}
:is(body[data-year="2025"],body[data-year="2023"]) .toolbar{background:rgba(255,255,255,.96);color:var(--ink);border-bottom:1px solid #d9d9d9}
:is(body[data-year="2025"],body[data-year="2023"]) .toolbar button,:is(body[data-year="2025"],body[data-year="2023"]) .toolbar a{border-color:#cfcfcf;color:var(--ink)}
:is(body[data-year="2025"],body[data-year="2023"]) .toolbar button:hover,:is(body[data-year="2025"],body[data-year="2023"]) .toolbar a:hover{background:#f1f1f1}
:is(body[data-year="2025"],body[data-year="2023"]) #counter{color:#666}
:is(body[data-year="2025"],body[data-year="2023"]) .reader,:is(body[data-year="2025"],body[data-year="2023"]) .page-window,:is(body[data-year="2025"],body[data-year="2023"]) .toc-card,:is(body[data-year="2025"],body[data-year="2023"]) .toc-list a{background:#fff}
body[data-year="2025"] .toc-list{grid-template-columns:repeat(2,minmax(0,1fr));background:#ddd;border-color:#ddd}
body[data-year="2025"] .toc-list a{display:flex;justify-content:flex-start;gap:12px;min-height:54px;padding:10px 14px;font:13px/1.25 Georgia,serif}
body[data-year="2025"] .toc-list b{flex:0 0 24px;font:700 10px/1 system-ui}
:is(body[data-year="2025"],body[data-year="2023"]) footer{background:#fff;color:#666;border-top:1px solid #ddd}
:is(body[data-year="2025"],body[data-year="2023"]) footer a{color:var(--ink)}
body[data-year="2023"] .toc-list{grid-template-columns:repeat(2,minmax(0,1fr))}
body[data-year="2023"] .toc-list a{display:flex;justify-content:flex-start;gap:12px;min-height:54px;padding:10px 14px;font:13px/1.25 Georgia,serif}
body[data-year="2023"] .toc-list b{flex:0 0 24px;font:700 10px/1 system-ui}
@media(max-width:700px){.hero{grid-template-columns:1fr;min-height:auto;padding:42px 22px 38px}.cover{width:min(72vw,330px);justify-self:center;order:-1}h1{font-size:51px}.intro{font-size:18px}.actions{display:grid}.guide{padding:34px 22px}.toolbar{justify-content:space-between;gap:2px}.toolbar button,.toolbar a{padding:0 6px}.mag-language{min-width:88px;padding-left:7px;font-size:11px}.hide-mobile{display:none}.reader{padding:26px 0 80px}.page{margin-bottom:38px}.page-head{padding:0 13px}.page-window{width:100%;box-shadow:none}.page-translation{top:29px;border-left:12px solid #f7edd8;border-right:12px solid #f7edd8;box-shadow:none}.toc-list{grid-template-columns:repeat(3,1fr)}body[data-year="2025"] .toc-list,body[data-year="2023"] .toc-list{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.page-window img{transition:none}}