:root{--paper:#f8f4ea;--ink:#14110d;--amber:#c46a1f;--gold:#F8B600;--gold2:#FFC531;--mint:#7CEFAA;--pink:#FF2E88;--blue:#2743EE;--mut:#6d6357;--line:#e0d7c6;--card:#fffdf7}
[data-mode="dark"]{--paper:#131017;--ink:#efe8db;--amber:#e08a3c;--mut:#a09585;--line:#2c2733;--card:#1b1721}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font:400 17px/1.65 'DM Sans',sans-serif;transition:background .9s ease,color .4s}
body::before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.35;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence baseFrequency='0.85' numOctaves='2'/%3E%3CfeColorMatrix values='0 0 0 0 0.5 0 0 0 0 0.45 0 0 0 0 0.38 0 0 0 0.04 0'/%3E%3C/filter%3E%3Crect width='120' height='120' filter='url(%23n)'/%3E%3C/svg%3E")}
a{color:var(--amber);text-decoration:none}a:hover{text-decoration:underline;color:var(--amber)}
.wrap{max-width:880px;margin:0 auto;padding:0 clamp(18px,5vw,44px);position:relative}
.topbar{display:flex;justify-content:space-between;align-items:center;padding:18px 0 6px}
.nlogo img{height:30px;width:auto;display:block}
.nright{display:flex;gap:10px;align-items:center}
.homebtn{font:600 12px 'DM Sans';letter-spacing:.08em;background:var(--ink);color:var(--gold2);padding:10px 18px;border-radius:99px;text-decoration:none}
.homebtn:hover{background:var(--blue);color:#fff;text-decoration:none}
.crumb{font:600 10.5px 'DM Sans';letter-spacing:.22em;color:var(--mut);padding:8px 0 2px}
.crumb a{color:var(--mut)}.crumb b{color:var(--ink);font-weight:600}
.mode{border:1px solid var(--line);background:var(--card);color:var(--ink);width:38px;height:38px;border-radius:50%;cursor:pointer;font-size:15px}
.sec{position:relative;padding:clamp(44px,8vw,84px) 0;border-top:1px solid var(--line)}
.rv{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1)}
.rv.in{opacity:1;transform:none}
.sec:first-of-type{border-top:none}
@media(max-width:320px){.nright {
    display: flex;
    gap: 5px;
    align-items: center;
}}
.gnum{position:absolute;top:clamp(46px,8vw,88px);left:-14px;transform:translateX(-100%);font:300 13px 'Newsreader';letter-spacing:.3em;color:var(--mut)}
@media(max-width:1080px){.gnum{position:static;transform:none;display:block;margin-bottom:14px}}
.eyebrow{font:600 11px 'DM Sans';letter-spacing:.32em;color:var(--amber);text-transform:uppercase;margin-bottom:16px}
h1{font:700 clamp(30px,4.6vw,48px)/1.08 'Bricolage Grotesque';letter-spacing:-.02em;max-width:720px}
h2{font:700 clamp(24px,3.4vw,34px)/1.12 'Bricolage Grotesque';letter-spacing:-.015em;margin-bottom:20px;text-wrap:pretty}
h2::after{content:"";display:block;width:44px;height:4px;border-radius:4px;background:var(--gold);margin-top:12px}
.sec:nth-of-type(3n) h2::after{background:var(--pink)}.sec:nth-of-type(3n+1) h2::after{background:var(--blue)}
.sec:nth-of-type(3n) .gnum{color:var(--pink)}.sec:nth-of-type(3n+1) .gnum{color:var(--blue)}.sec:nth-of-type(3n+2) .gnum{color:var(--amber)}
.herologo{height:clamp(28px,4.5vw,42px);width:auto;display:inline-block;margin-bottom:10px;background:rgba(10,10,10,.45);padding:9px 14px;border-radius:14px;backdrop-filter:blur(6px);box-shadow:0 6px 20px rgba(0,0,0,.3)}
.headword{font:500 clamp(52px,11vw,120px)/0.95 'Newsreader';letter-spacing:-.03em;margin:10px 0 8px}
.headword em{font-style:italic;background:linear-gradient(100deg,var(--gold) 10%,var(--pink) 90%);-webkit-background-clip:text;background-clip:text;color:transparent}
.pos{font:italic 400 19px 'Newsreader';color:var(--mut)}
.hero{position:relative;overflow:hidden;border-radius:26px;margin-top:26px;padding:clamp(26px,5vw,52px);color:#f3ead9;min-height:400px;display:flex;flex-direction:column;justify-content:flex-end}
.scene{position:absolute;inset:0;opacity:0;transition:opacity 1.4s ease}
.scene.on{opacity:1}
.s-mtn{background:linear-gradient(180deg,#2b3550 0%,#5a5f78 42%,#b87a4a 72%,#3c2f28 100%)}
.s-mtn::before{content:"";position:absolute;right:10%;top:12%;left:auto;width:90px;height:90px;border-radius:50%;background:radial-gradient(circle at 40% 38%,#ffe9bd,#f4b95c 70%,#d98b32);box-shadow:0 0 70px 24px rgba(255,190,100,.4)}
.s-mtn::after{content:"";position:absolute;left:0;right:0;bottom:0;height:62%;background:linear-gradient(115deg,transparent 41%,#3a3f52 41.5%,#23273a 52%,transparent 52.5%),linear-gradient(245deg,transparent 38%,#2c3145 38.5%,#191d2c 60%,transparent 60.5%),linear-gradient(118deg,transparent 47%,#171a28 47.5%,#10121d 72%,transparent 72.5%),linear-gradient(180deg,transparent 45%,#0d0f18 100%)}
.s-sea{background:linear-gradient(180deg,#d8a25f 0%,#c97a3e 34%,#20495c 58%,#0c2733 100%)}
.s-sea::before{content:"";position:absolute;left:50%;top:26%;transform:translateX(-50%);width:110px;height:110px;border-radius:50%;background:radial-gradient(circle at 42% 40%,#fff3d6,#ffd27a 60%,#f0983c);box-shadow:0 0 90px 30px rgba(255,190,110,.5)}
.s-sea::after{content:"";position:absolute;left:38%;right:38%;top:56%;bottom:8%;background:linear-gradient(180deg,rgba(255,220,160,.8),rgba(255,200,130,.12) 70%,transparent);filter:blur(4px)}
.s-sky{background:radial-gradient(1.5px 1.5px at 12% 22%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 32% 62%,#ffe9c9 50%,transparent 51%),radial-gradient(1.5px 1.5px at 55% 18%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 71% 45%,#cfe0ff 50%,transparent 51%),radial-gradient(1.5px 1.5px at 86% 27%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 44% 82%,#fff 50%,transparent 51%),radial-gradient(1px 1px at 92% 74%,#ffe9c9 50%,transparent 51%),radial-gradient(1px 1px at 8% 78%,#cfe0ff 50%,transparent 51%),linear-gradient(180deg,#090d1f 0%,#141a38 62%,#241f3a 100%)}
.s-sky::after{content:"";position:absolute;right:14%;top:18%;width:64px;height:64px;border-radius:50%;background:radial-gradient(circle at 38% 36%,#fdf6e3,#e8ddc0 65%,#cabf9e);box-shadow:0 0 60px 18px rgba(250,240,210,.25)}
.s-sky::before{content:"";position:absolute;left:18%;top:26%;width:90px;height:2px;background:linear-gradient(90deg,#fff,transparent);transform:rotate(-24deg);opacity:0;animation:shoot 6s ease-in infinite 2s}
@keyframes shoot{0%{opacity:0;transform:rotate(-24deg) translateX(0)}4%{opacity:1}12%{opacity:0;transform:rotate(-24deg) translateX(190px)}100%{opacity:0}}
.heroin{position:relative;z-index:2}
.say{display:flex;flex-wrap:wrap;align-items:center;gap:14px;margin-top:16px}
.play{position:relative;width:58px;height:58px;border-radius:50%;border:none;background:var(--gold2);color:#14110d;font-size:19px;cursor:pointer;flex:none;display:grid;place-items:center;box-shadow:0 10px 26px rgba(0,0,0,.35);transition:transform .2s}
.play::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:2px solid var(--gold2);opacity:0;animation:pring 2.6s ease-out infinite}
@keyframes pring{0%{transform:scale(.8);opacity:.7}70%{transform:scale(1.25);opacity:0}100%{opacity:0}}
.play:hover{transform:scale(1.1) rotate(-6deg)}
.ipa{font:400 15.5px 'DM Sans';color:#f3ead9;opacity:.92;line-height:1.5}
.chips{display:flex;gap:8px;margin-top:22px;flex-wrap:wrap}
.chip{font:600 11.5px 'DM Sans';letter-spacing:.08em;padding:9px 15px;border-radius:99px;border:1px solid rgba(255,255,255,.4);background:rgba(0,0,0,.25);color:#f3ead9;cursor:pointer;backdrop-filter:blur(4px)}
.chip.on{background:#f3ead9;color:#191512;border-color:#f3ead9}
.subline{font:italic 400 clamp(17px,2.2vw,21px) 'Newsreader';color:var(--mut);margin-top:14px;max-width:560px}
.wmarq{overflow:hidden;white-space:nowrap;margin-top:18px;padding:12px 0;border-top:1px dashed var(--line);border-bottom:1px dashed var(--line)}
.wmarq span{display:inline-block;font:italic 500 16px 'Newsreader';color:var(--amber);animation:wm 40s linear infinite}
@keyframes wm{to{transform:translateX(-50%)}}
.defblock{background:var(--card);border:1px solid var(--line);border-left:4px solid var(--amber);border-radius:0 20px 20px 0;padding:clamp(22px,4vw,38px);font:400 clamp(18px,2.4vw,22px)/1.6 'Newsreader';max-width:760px}
.defblock b{font-weight:600}
.defblock .hl{background:linear-gradient(transparent 58%,rgba(248,182,0,.45) 58%);padding:0 2px}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px;margin-top:8px}
.fact{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px 20px;font-size:14.5px;line-height:1.55;transition:transform .25s,box-shadow .25s}
.fact:hover{transform:translateY(-4px) rotate(-.4deg);box-shadow:0 14px 30px rgba(60,40,0,.1)}
.facts .fact:nth-child(1) b{color:var(--blue)}.facts .fact:nth-child(2) b{color:#0d8a4e}.facts .fact:nth-child(3) b{color:var(--pink)}.facts .fact:nth-child(5) b{color:var(--blue)}
.fact b{display:block;font:600 10.5px 'DM Sans';letter-spacing:.22em;color:var(--amber);text-transform:uppercase;margin-bottom:7px}
.prose{max-width:680px;font-size:clamp(16px,2vw,18px);line-height:1.75}
.prose p+p{margin-top:18px}
.dropcap::first-letter{font:500 74px/0.8 'Newsreader';color:var(--amber);float:left;padding:8px 10px 0 0}
.scale{margin-top:10px}
.scale input{width:100%;accent-color:var(--amber);height:34px;cursor:pointer}
.slabels{display:flex;justify-content:space-between;font:600 10px 'DM Sans';letter-spacing:.12em;color:var(--mut);margin-top:2px}
.snow{text-align:center;margin:22px 0 6px;min-height:96px}
.snow b{font:500 clamp(28px,4.5vw,42px) 'Newsreader';display:block;transition:color .3s}
.snow span{font:italic 400 16px 'Newsreader';color:var(--mut)}
.wlist{display:grid;gap:10px;margin-top:26px;max-width:680px}
.wlist li{display:flex;gap:14px;align-items:baseline;list-style:none;padding:10px 0;border-bottom:1px dashed var(--line);cursor:pointer}
.wlist li.on b{color:var(--amber)}
.wlist b{font:500 20px 'Newsreader';min-width:150px}
.wlist span{color:var(--mut);font-size:15px}
.syn{display:flex;flex-wrap:wrap;gap:8px;max-width:720px}
.syn span{background:var(--card);border:1px solid var(--line);border-radius:99px;padding:8px 16px;font-size:14.5px;transition:all .2s;cursor:default}
.syn span:hover{background:var(--gold2);border-color:var(--ink);transform:rotate(-1.5deg) scale(1.05)}
.syn.anti span:hover{background:var(--line);transform:none}
.syn span i{font-style:normal;color:var(--mut);font-size:12.5px}
.ex{max-width:720px;display:grid;gap:4px;counter-reset:ex}
.ex li{list-style:none;display:flex;gap:14px;align-items:flex-start;padding:13px 0;border-bottom:1px dashed var(--line);counter-increment:ex}
.ex li::before{content:counter(ex,decimal-leading-zero);font:300 13px 'Newsreader';letter-spacing:.14em;color:var(--amber);padding-top:4px}
.ex p{flex:1;font:400 17px/1.6 'Newsreader'}
.cbtn{border:1px solid var(--line);background:var(--card);color:var(--mut);border-radius:9px;width:32px;height:32px;cursor:pointer;font-size:13px;flex:none}
.cbtn:hover{color:var(--ink);background:var(--gold2);border-color:var(--ink)}
.qa{max-width:720px;display:grid;gap:26px}
.qa h3{font:500 21px 'Newsreader';margin-bottom:8px}
.qa p{color:var(--ink);opacity:.88;font-size:16px;line-height:1.7}
.langchips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.lchip{font:600 12.5px 'DM Sans';padding:9px 15px;border-radius:99px;border:1px solid var(--line);background:var(--card);color:var(--ink);cursor:pointer}
.lchip.on{background:var(--ink);color:var(--gold2);border-color:var(--ink)}
.lchip:hover{border-color:var(--gold)}
.lcard{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:clamp(20px,4vw,32px);max-width:640px;margin-bottom:30px;min-height:150px}
.lcard .lw{font:500 clamp(26px,4vw,36px) 'Newsreader';color:var(--blue)}
.lcard .lp{font:600 12px 'DM Sans';letter-spacing:.14em;color:var(--mut);text-transform:uppercase;margin:6px 0 10px}
.lcard .le{font:400 17px 'Newsreader';line-height:1.6}
table{width:100%;border-collapse:collapse;font-size:14.5px}
th{font:600 10.5px 'DM Sans';letter-spacing:.2em;text-transform:uppercase;color:var(--mut);text-align:left;padding:10px 12px;border-bottom:1.5px solid var(--line)}
td{padding:11px 12px;border-bottom:1px solid var(--line);vertical-align:top;line-height:1.55}
td:first-child{font-weight:600;white-space:nowrap}
.twrap{overflow-x:auto;border:1px solid var(--line);border-radius:16px;background:var(--card)}
.fam{display:grid;gap:12px;max-width:680px}
.fam li{list-style:none;padding:12px 0;border-bottom:1px dashed var(--line)}
.fam b{font:500 19px 'Newsreader'}
.fam span{color:var(--mut);font-size:15px}
.quiz{max-width:680px;display:grid;gap:16px}
.quiz details{background:var(--card);border:1px solid var(--line);border-radius:16px;padding:18px 20px}
.quiz summary{cursor:pointer;font:500 17.5px 'Newsreader';line-height:1.5}
.qopts{display:flex;gap:8px;margin:14px 0 4px;flex-wrap:wrap}
.qopt{font:600 13px 'DM Sans';padding:10px 16px;border-radius:12px;border:1.5px solid var(--line);background:var(--paper);color:var(--ink);cursor:pointer}
.qopt.right{background:var(--mint);border-color:#0d5c31;color:#0d3b1e}
.qopt.wrong{background:var(--pink);border-color:var(--pink);color:#fff}
.qfb{font:italic 400 15px 'Newsreader';color:var(--mut);min-height:24px;margin-top:8px}
.brand{position:relative;background:var(--ink);color:var(--paper);border-radius:24px;padding:clamp(26px,5vw,46px);max-width:720px;overflow:hidden}
.brand::before{content:"✦";position:absolute;right:26px;top:18px;font-size:30px;color:var(--gold2)}
@media(max-width:640px){.brand::before{right:10px;top:8px}}
.brand a{color:var(--gold2)}
.brand p{font:400 17.5px/1.75 'Newsreader'}
.dl{margin-top:26px;display:inline-flex;align-items:center;gap:10px;font:600 13px 'DM Sans';letter-spacing:.06em;background:var(--ink);color:var(--paper);border:none;padding:14px 22px;border-radius:99px;cursor:pointer}
.dl:hover{background:var(--blue);color:#fff;transform:translateY(-2px)}
.dl{transition:all .2s;box-shadow:3px 3px 0 var(--gold)}
.foot{padding:40px 0 60px;color:var(--mut);font-size:13px;line-height:1.7;border-top:1px solid var(--line)}
.toast{position:fixed;bottom:26px;left:50%;transform:translateX(-50%) translateY(16px);background:var(--ink);color:var(--paper);font:600 13px 'DM Sans';padding:11px 20px;border-radius:99px;opacity:0;transition:all .3s;pointer-events:none;z-index:50}
.toast.on{opacity:1;transform:translateX(-50%)}
@media(max-width:1023px){
.facts,.qa,.quiz,.fam{display:grid;grid-auto-flow:column;grid-auto-columns:84%;grid-template-columns:none;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none;max-width:none}
.facts::-webkit-scrollbar,.qa::-webkit-scrollbar,.quiz::-webkit-scrollbar,.fam::-webkit-scrollbar{display:none}
.facts>*,.qa>*,.quiz>*,.fam>*{scroll-snap-align:center}
.qa>div,.fam>li{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px}
.fam>li{border-bottom:1px solid var(--line)}
.ex{display:grid;grid-auto-flow:column;grid-auto-columns:84%;gap:14px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:6px;scrollbar-width:none;max-width:none}
.ex::-webkit-scrollbar{display:none}
.ex li{scroll-snap-align:center;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;border-bottom:1px solid var(--line);flex-direction:column}
.ex li::before{padding:0}
.wlist{max-width:none}
}
.cnav{display:none;align-items:center;gap:10px;margin-top:14px;justify-content:center}
@media(max-width:1023px){.cnav{display:flex}}
.cnav button{width:38px;height:38px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);color:var(--ink);font-size:15px;cursor:pointer}
.cnav button:active{background:var(--gold2)}
.cdots{display:flex;gap:6px}
.cdots i{width:7px;height:7px;border-radius:50%;background:var(--line);transition:all .3s}
.cdots i.on{background:var(--amber);width:20px;border-radius:99px}
.anat{display:grid;grid-template-columns:1fr auto 1fr;gap:16px;align-items:stretch;max-width:760px}
.anat .apart{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:26px}
.anat .aplus{font:300 44px 'Newsreader';color:var(--amber);align-self:center}
.anat b{font:500 clamp(30px,5vw,44px) 'Newsreader';display:block}
.anat span{color:var(--mut);font-size:14.5px;line-height:1.6;display:block;margin-top:8px}
@media(max-width:700px){.anat{grid-template-columns:1fr}.anat .aplus{text-align:center}}
.tline{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(200px,1fr);gap:0;overflow-x:auto;padding:10px 0 16px;scrollbar-width:none}
.tline::-webkit-scrollbar{display:none}
.tl{position:relative;padding:22px 18px 0 0;border-top:2px solid var(--line)}
.tl::before{content:"";position:absolute;top:-6px;left:0;width:10px;height:10px;border-radius:50%;background:var(--amber)}
.tl b{font:500 17px 'Newsreader';display:block}
.tl i{font:600 10.5px 'DM Sans';letter-spacing:.18em;color:var(--amber);font-style:normal;display:block;margin-bottom:6px}
.tl span{color:var(--mut);font-size:13.5px;line-height:1.55}
.cloud{display:flex;flex-wrap:wrap;gap:10px;max-width:760px}
.cloud span{font:400 clamp(15px,2vw,19px) 'Newsreader';background:var(--card);border:1px dashed var(--line);border-radius:12px;padding:9px 16px;transition:all .2s}
.cloud span:hover{border-style:solid;border-color:var(--amber);transform:rotate(-1deg)}
.cloud b{color:var(--amber);font-weight:500}
.dodont{display:grid;grid-template-columns:1fr 1fr;gap:16px;max-width:760px}
.dd{border-radius:20px;padding:24px;border:1px solid var(--line)}
.dd.yes{background:color-mix(in oklab,var(--mint) 14%,var(--card))}
.dd.no{background:color-mix(in oklab,var(--pink) 8%,var(--card))}
.dd h3{font:700 13px 'DM Sans';letter-spacing:.2em;margin-bottom:12px}
.dd.yes h3{color:#0d8a4e}.dd.no h3{color:var(--pink)}
.dd li{list-style:none;padding:7px 0;font-size:15px;border-bottom:1px dashed var(--line)}
@media(max-width:700px){.dodont{grid-template-columns:1fr}}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:12px;max-width:760px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:20px 14px;text-align:center}
.tile b{font:500 clamp(26px,4vw,38px) 'Newsreader';display:block;color:var(--blue)}
.tile:nth-child(2n) b{color:var(--amber)}.tile:nth-child(3n) b{color:var(--pink)}
.tile span{font:600 10px 'DM Sans';letter-spacing:.18em;color:var(--mut)}
.pq{font:italic 400 clamp(22px,3.4vw,30px)/1.4 'Newsreader';color:var(--amber);border-left:4px solid var(--gold);padding-left:22px;margin:26px 0;max-width:640px}
.versus{display:grid;grid-template-columns:1fr 1fr;gap:0;max-width:760px;border:1px solid var(--line);border-radius:22px;overflow:hidden}
.vs{padding:26px;background:var(--card)}
.vs+.vs{border-left:1px solid var(--line)}
.vs b{font:500 24px 'Newsreader';display:block;margin-bottom:8px}
.vs p{font-size:14.5px;color:var(--mut);line-height:1.65}
@media(max-width:700px){.versus{grid-template-columns:1fr}.vs+.vs{border-left:none;border-top:1px solid var(--line)}}
.check{max-width:680px;display:grid;gap:10px}
.check li{list-style:none;display:flex;gap:12px;align-items:baseline;font:400 17px 'Newsreader';padding:10px 0;border-bottom:1px dashed var(--line)}
.check li::before{content:"✦";color:var(--amber);font-size:14px}
.check li.not::before{content:"✕";color:var(--mut)}
.poem{max-width:560px;margin:0 auto;text-align:center;font:italic 400 clamp(19px,2.6vw,24px)/1.9 'Newsreader'}
.poem small{display:block;margin-top:16px;font:600 10px 'DM Sans';letter-spacing:.26em;color:var(--mut)}
.forms{max-width:720px}
@media(max-width:1023px){.tiles,.dodont{display:grid;grid-auto-flow:column;grid-auto-columns:70%;grid-template-columns:none;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px}.tiles::-webkit-scrollbar,.dodont::-webkit-scrollbar{display:none}.tiles>*,.dodont>*{scroll-snap-align:center}}
@media(prefers-reduced-motion:reduce){*{transition:none !important;animation:none !important}html{scroll-behavior:auto}}