
:root{
  --bg:#F6F3EA;--bg2:#E9E3D3;--card:#FFFFFF;--ink:#1E2A24;--muted:#5A6159;
  --jungle:#1F5139;--lava:#2E6B4F;--sun:#F2C14E;--leaf:#5CC27A;--sky:#4F9BE8;--berry:#8DA88F;
  --line:#D3CCBA;--shadow:0 1px 3px rgba(20,30,25,.14);--r:12px;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --bg:#121815;--bg2:#1A221D;--card:#222C26;--ink:#F6F3EA;--muted:#B5BEB2;--line:#070A08;--shadow:0 1px 3px rgba(20,30,25,.14);--jungle:#8FD0A8}}
:root[data-theme="dark"]{--bg:#121815;--bg2:#1A221D;--card:#222C26;--ink:#F6F3EA;--muted:#B5BEB2;--line:#070A08;--shadow:0 1px 3px rgba(20,30,25,.14);--jungle:#8FD0A8}

*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font:400 17px/1.55 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;overflow-x:hidden}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.5;z-index:-1;
  background-image:radial-gradient(circle at 20% 30%,rgba(92,194,122,.10) 0 120px,transparent 121px),radial-gradient(circle at 85% 70%,rgba(255,201,60,.12) 0 160px,transparent 161px)}
a{color:inherit}
h1,h2,h3,.f{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;font-weight:700;letter-spacing:.2px;line-height:1.1}
.wrap{max-width:1120px;margin:0 auto;padding:0 16px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:var(--sun);padding:8px;z-index:9}

/* header */
.top{position:sticky;top:0;z-index:20;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.top .wrap{display:flex;align-items:center;gap:14px;height:62px}
.brand{display:flex;align-items:center;gap:8px;text-decoration:none;font:700 24px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;white-space:nowrap}
.brand svg{width:38px;height:38px;flex:none}
.nav{margin-left:auto;display:flex;gap:6px;align-items:center}
.nav a{text-decoration:none;font-weight:800;padding:7px 12px;border-radius:999px}
.nav a:hover{background:var(--bg2)}
.nav .pill{background:var(--sun);border:1px solid var(--line);box-shadow:0 1px 3px rgba(20,30,25,.14);color:#1E2A24}
@media (max-width:640px){.nav .hide-s{display:none}.brand{font-size:21px}}

/* buttons, chips, cards */
.btn{display:inline-flex;align-items:center;gap:8px;font:700 17px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;text-decoration:none;padding:12px 20px;border-radius:14px;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--lava);color:#fff;cursor:pointer;transition:transform .12s,box-shadow .12s}
.btn:hover{transform:translate(-2px,-2px);box-shadow:0 1px 3px rgba(20,30,25,.14)}
.btn.alt{background:var(--card);color:var(--ink)}
.chip{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:14px;padding:4px 11px;border-radius:999px;border:1px solid var(--line);background:var(--card)}
.chip.meat{background:#FFD3CC;color:#1E2A24}.chip.plant{background:#D9F2C4;color:#1E2A24}.chip.fish{background:#D2E6FB;color:#1E2A24}.chip.mix{background:#FFF1C2;color:#1E2A24}
.chip.cousin{background:var(--sun);color:#1E2A24}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);box-shadow:var(--shadow)}

/* hero */
.hero{padding:44px 0 26px;text-align:center}
.hero h1{font-size:clamp(38px,7vw,74px);margin:10px 0 12px}
.hero h1 em{font-style:normal;color:var(--lava)}
.hero p.lead{font-size:clamp(18px,2.4vw,22px);max-width:720px;margin:0 auto 22px;color:var(--muted);font-weight:700}
.parade{display:flex;justify-content:center;gap:4px;flex-wrap:wrap;margin:6px auto 4px;max-width:900px}
.parade a{display:block;width:clamp(64px,10vw,104px);transition:transform .15s}
.parade a:hover{transform:translateY(-6px) rotate(-3deg)}
.parade img{width:100%;height:auto;display:block}
.search{display:flex;max-width:560px;margin:0 auto;position:relative}
.search input{width:100%;font:700 18px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:15px 18px 15px 50px;border-radius:16px;border:1px solid var(--line);box-shadow:var(--shadow);background:var(--card);color:var(--ink)}
.search svg{position:absolute;left:16px;top:50%;transform:translateY(-50%)}
.results{position:absolute;top:100%;left:0;right:0;margin-top:8px;z-index:30;text-align:left;max-height:360px;overflow:auto;display:none}
.results a{display:flex;align-items:center;gap:10px;padding:6px 12px;text-decoration:none;font-weight:800}
.results a:hover,.results a.on{background:var(--bg2)}
.results img{width:44px;height:44px}
.results small{color:var(--muted);font-weight:700;margin-left:auto}

.stats{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:28px 0 6px}
.stat{padding:12px 18px;text-align:center;min-width:150px}
.stat b{display:block;font:700 30px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:var(--jungle)}
.stat span{font-weight:800;color:var(--muted);font-size:14px}

section{padding:34px 0}
.sec-h{text-align:center;margin-bottom:22px}
.sec-h h2{font-size:clamp(28px,4.4vw,42px);margin:0 0 6px}
.sec-h p{margin:0;color:var(--muted);font-weight:700}
.kicker{display:inline-block;font:700 15px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;background:var(--leaf);color:#123;border:1px solid var(--line);padding:3px 12px;border-radius:999px;transform:none}

/* group tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.tile{text-decoration:none;padding:10px 10px 12px;text-align:center;transition:transform .12s,box-shadow .12s;position:relative;cursor:pointer;font:inherit;color:inherit}
.tile:hover{transform:translate(-2px,-2px);box-shadow:0 1px 3px rgba(20,30,25,.14)}
.tile img{width:96px;height:96px;display:block;margin:0 auto}
.tile b{display:block;font:700 18px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
.tile span{font-size:13px;font-weight:800;color:var(--muted)}
.tile.on{background:var(--sun);color:#1E2A24}.tile.on span{color:#1E2A24}
.tile .cz{position:absolute;top:-10px;right:-6px;font-size:11px;padding:2px 8px}

/* timeline */
.eras{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
@media (max-width:760px){.eras{grid-template-columns:1fr}}
.era{padding:18px;position:relative;overflow:hidden}
.era h3{font-size:28px;margin:0 0 2px}
.era .ma{font-weight:800;color:var(--muted)}
.era p{margin:8px 0 10px}
.era .row{display:flex;gap:2px}
.era .row img{width:56px;height:56px}
.era{text-decoration:none;color:#1E2A24;transition:transform .12s,box-shadow .12s}.era:hover{transform:translate(-2px,-2px);box-shadow:0 1px 3px rgba(20,30,25,.14)}
.era.c-af{background:#FFE0B8}.era.c-as{background:#FFD3CC}.era.c-eu{background:#E6DCFB}.era.c-na{background:#D2E6FB}.era.c-sa{background:#D9F2C4}.era.c-oc{background:#FFF1C2}.era.c-sea{background:#CFEAFF}
.eras.conts7{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.era h3 span{font-size:30px}

.promise{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:14px}
.promise .card{padding:18px}
.promise h3{margin:0 0 6px;font-size:22px}
.promise p{margin:0;color:var(--muted);font-weight:700}

/* atlas */
.filterbar{position:sticky;top:62px;z-index:10;background:var(--bg);padding:12px 0;border-bottom:2px dashed color-mix(in srgb,var(--line) 30%,transparent)}
.filterbar .row{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.filterbar input{flex:1;min-width:200px;font:700 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink)}
.filterbar select{font:700 15px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:10px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink)}
@media (max-width:640px){.filterbar{position:static}}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:12px;margin-top:16px}
.dc{display:block;text-decoration:none;padding:8px 10px 12px;text-align:center;transition:transform .12s,box-shadow .12s}
.dc:hover{transform:translate(-2px,-2px);box-shadow:0 1px 3px rgba(20,30,25,.14)}
.dc img{width:110px;height:110px;display:block;margin:0 auto}
.dc b{display:block;font:700 17px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;word-break:break-word}
.dc span{font-size:13px;font-weight:800;color:var(--muted)}
.more{display:block;margin:20px auto 0}
.count{font-weight:800;color:var(--muted);margin:10px 0 0}

/* dino page */
.crumbs{font-weight:800;font-size:14px;color:var(--muted);padding-top:16px}
.crumbs a{text-decoration:none}
.dhero{display:grid;grid-template-columns:minmax(220px,360px) 1fr;gap:28px;align-items:center;padding:16px 0 10px}
@media (max-width:760px){.dhero{grid-template-columns:1fr;text-align:center}.dhero .chips{justify-content:center}}
.dhero .pic{background:var(--card);border:1px solid var(--line);border-radius:28px;box-shadow:var(--shadow);padding:10px;aspect-ratio:1;display:grid;place-items:center;position:relative}
.dhero .pic img{width:100%;height:100%}
.dhero h1{font-size:clamp(36px,6vw,64px);margin:6px 0 4px;word-break:break-word}
.say{font-weight:800;color:var(--muted);font-size:18px}
.say b{color:var(--jungle)}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.intro{font-size:19px;font-weight:700;max-width:640px}
.quick{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:14px;margin:20px 0}
.q{padding:14px 16px}
.q .lab{font:700 14px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:var(--muted);text-transform:uppercase;letter-spacing:.6px}
.q .val{font:700 22px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;margin-top:2px}
.q small{display:block;font-weight:700;color:var(--muted);margin-top:2px}
.tl{padding:18px}
.tlbar{position:relative;height:42px;border-radius:12px;overflow:hidden;display:flex;border:1px solid var(--line);margin:12px 0 8px}
.tlbar div{display:grid;place-items:center;font:700 13px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24}
.tlbar .t{background:#FFE0B8}.tlbar .j{background:#D9F2C4}.tlbar .k{background:#D2E6FB}
.tlbar .me{position:absolute;top:0;bottom:0;background:var(--lava);opacity:.85;border-left:1px solid var(--line);border-right:1px solid var(--line);min-width:6px}
.tlaxis{display:flex;justify-content:space-between;font-size:12px;font-weight:800;color:var(--muted)}
.size{padding:18px}
.size svg{width:100%;height:auto;display:block}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:14px}
.fact{padding:16px 18px;position:relative}
.fact:nth-child(3n+1){transform:rotate(-.6deg)}.fact:nth-child(3n+2){transform:rotate(.5deg)}
.fact .n{font:700 34px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:var(--lava);line-height:1}
.fact p{margin:6px 0 0;font-weight:700}
.src{display:inline-block;font:800 11px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;vertical-align:super;text-decoration:none;background:var(--bg2);border:1px solid var(--line);border-radius:6px;padding:0 5px;margin-left:3px;color:var(--ink)}
.myth{background:var(--sun);color:#1E2A24;padding:18px}
.myth h3{margin:0 0 6px}
.nerd{padding:20px}
.nerd h2{margin:0 0 10px}
.nerd dl{display:grid;grid-template-columns:max-content 1fr;gap:6px 18px;margin:0}
.nerd dt{font-weight:800;color:var(--muted)}
.nerd dd{margin:0;font-weight:700;word-break:break-word}
@media (max-width:560px){.nerd dl{grid-template-columns:1fr}.nerd dd{margin-bottom:8px}}
.sources ol{padding-left:22px;margin:8px 0}
.sources li{margin:4px 0;font-weight:700;word-break:break-word}
.sorry{font-weight:700;color:var(--muted);font-size:15px}
.kin{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:10px}
.kin .dc img{width:84px;height:84px}
.note{border:2px dashed var(--line);border-radius:14px;padding:12px 16px;font-weight:700;background:color-mix(in srgb,var(--card) 60%,transparent)}
.soon{padding:22px;display:flex;gap:18px;align-items:center;flex-wrap:wrap;background:var(--jungle);color:#fff}
.soon h2{margin:0 0 4px;color:#fff}.soon p{margin:0;font-weight:700;opacity:.9}

footer{margin-top:40px;padding:30px 0 50px;border-top:1px solid var(--line);font-weight:700;color:var(--muted);font-size:15px}
footer .wrap{display:grid;gap:8px}
footer a{font-weight:800}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ===== v2: make it fun ===== */
.scene{position:relative;overflow:hidden;background:linear-gradient(180deg,#F6F3EA 0%,#F6F3EA 55%,#EFEADD 100%);color:#fff;border-bottom:1px solid var(--line)}
.scene .stars{position:absolute;inset:0;background-image:radial-gradient(2px 2px at 10% 20%,#fff9 50%,transparent 51%),radial-gradient(1.5px 1.5px at 30% 12%,#fff8 50%,transparent 51%),radial-gradient(2px 2px at 70% 18%,#fff9 50%,transparent 51%),radial-gradient(1.5px 1.5px at 85% 8%,#fff7 50%,transparent 51%),radial-gradient(1.5px 1.5px at 55% 6%,#fff8 50%,transparent 51%),radial-gradient(2px 2px at 92% 30%,#fff6 50%,transparent 51%);animation:tw 4s ease-in-out infinite alternate}
@keyframes tw{to{opacity:.4}}
.scene .moon{position:absolute;right:8%;top:40px;width:70px;height:70px;border-radius:50%;background:#FFF1C2;box-shadow:0 0 40px #FFE08A88}
.scene .volcano{position:absolute;left:-40px;bottom:70px;width:min(46vw,520px);opacity:.95}
.scene .volcano .glow{animation:lava 2.4s ease-in-out infinite alternate}
@keyframes lava{from{opacity:.55}to{opacity:1}}
.scene .smoke{animation:smoke 6s ease-in-out infinite}
@keyframes smoke{0%{transform:translateY(0);opacity:.0}30%{opacity:.5}100%{transform:translateY(-60px) scale(1.4);opacity:0}}
.scene .ferns{position:absolute;right:-20px;bottom:60px;width:min(40vw,420px)}
.scene .wrap{position:relative;z-index:2}
.scene .hero{padding:56px 0 30px}
.scene .hero h1{color:#F2C14E;text-shadow:none;font-size:clamp(42px,8vw,92px);transform:none}
.scene .hero h1 em{color:#fff;text-shadow:none}
.scene .hero p.lead{color:var(--muted)}
.scene .kicker{background:#F2C14E;color:#1E2A24}
.bubble{display:inline-block;background:#fff;color:#1E2A24;font:700 18px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:8px 16px;border-radius:18px;border:1px solid var(--line);position:relative;transform:none;margin-bottom:8px}
.bubble:after{content:"";position:absolute;left:30px;bottom:-12px;border:10px solid transparent;border-top-color:#1E2A24}
.ground{position:relative;height:120px;margin-top:10px;z-index:2}
.ground:before{content:"";position:absolute;left:0;right:0;bottom:0;height:34px;background:#E9E3D3;border-top:1px solid var(--line);background-image:radial-gradient(circle at 20px 18px,#E9E3D3 6px,transparent 7px);background-size:60px 34px}
.walk{position:absolute;bottom:26px;left:0;display:flex;gap:30px;width:max-content;animation:walk 60s linear infinite}
.walk a{display:block;width:96px;height:96px;flex:none}
.walk img{width:100%;height:100%}
@keyframes walk{from{transform:translateX(-50%)}to{transform:translateX(100vw)}}
.walk:hover{animation-play-state:paused}
.scene .search input{border-color:#1E2A24;box-shadow:0 1px 3px rgba(20,30,25,.14)}
.scene .stats .stat{background:#ffffff14;border-color:#F2C14E;box-shadow:0 1px 3px rgba(20,30,25,.14);color:#fff}
.scene .stats .stat b{color:#F2C14E}.scene .stats .stat span{color:#D9F2C4}
.tile{background:var(--c,var(--card));color:#1E2A24}
.tile span{color:#1E2A24;opacity:.75}
.tile:nth-child(4n+1){transform:none}.tile:nth-child(4n+3){transform:none}
.tile:hover img{animation:wig .5s ease-in-out}
@keyframes wig{25%{transform:none}75%{transform:none}}
.prints{height:28px;background-image:radial-gradient(ellipse 7px 9px at 12px 14px,#1E2A2422 98%,transparent),radial-gradient(circle 3px at 5px 4px,#1E2A2422 98%,transparent),radial-gradient(circle 3px at 12px 2px,#1E2A2422 98%,transparent),radial-gradient(circle 3px at 19px 4px,#1E2A2422 98%,transparent);background-size:70px 28px;margin:10px 0}

/* dino page: trading card */
.dcard{position:relative;margin-top:14px;border:1px solid var(--line);border-radius:30px;box-shadow:0 1px 3px rgba(20,30,25,.14);overflow:hidden;background:var(--c);color:#1E2A24}
.dcard:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,#ffffff22 0 18px,transparent 18px 36px);pointer-events:none}
.dcard .in{position:relative;display:grid;grid-template-columns:minmax(220px,380px) 1fr;gap:24px;align-items:center;padding:22px}
@media (max-width:760px){.dcard .in{grid-template-columns:1fr;text-align:center}.dcard .chips{justify-content:center}}
.dcard .pic{background:#fff;border:1px solid var(--line);border-radius:26px;aspect-ratio:1;display:grid;place-items:center;padding:8px;box-shadow:inset 0 -18px 0 #F6F3EA}
.dcard .pic img{width:100%;height:100%}
.dcard h1{font-size:clamp(38px,6.5vw,72px);margin:4px 0;color:#fff;text-shadow:none;word-break:break-word}
.dcard .no{display:inline-block;font:700 15px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;background:#1E2A24;color:#F2C14E;padding:4px 12px;border-radius:999px}
.dcard .say,.dcard .say b{color:#1E2A24}
.dcard .intro{color:#1E2A24}
.dcard .note{background:#ffffffaa;color:#1E2A24}
.photo{background:#fff;border:1px solid var(--line);border-radius:8px;padding:12px 12px 16px;box-shadow:0 1px 3px rgba(20,30,25,.14);transform:none;max-width:760px;margin:0 auto;color:#1E2A24}
.photo img{width:100%;height:auto;display:block;border-radius:4px;background:#eee}
.photo figcaption{font-weight:700;font-size:14px;color:#5A6159;margin-top:10px}
.photo .tag{position:absolute;margin:-26px 0 0 -26px;background:#2E6B4F;color:#fff;font:700 15px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:5px 12px;border-radius:999px;border:1px solid var(--line);transform:none}
.q{border-width:3px}
.q:nth-child(4n+1){background:#FFE0B8}.q:nth-child(4n+2){background:#D9F2C4}.q:nth-child(4n+3){background:#D2E6FB}.q:nth-child(4n+4){background:#FFE0EC}
.q,.q .val{color:#1E2A24}.q .lab,.q small{color:#4A524A}
.fact:nth-child(4n+1){background:#FFF1C2}.fact:nth-child(4n+2){background:#D9F2C4}.fact:nth-child(4n+3){background:#D2E6FB}.fact:nth-child(4n+4){background:#FFE0EC}
.fact,.fact p{color:#1E2A24}
.tlbar{height:54px}
.tlbar .me{background:none;border:none;opacity:1;display:flex;justify-content:center}
.tlbar .me:before{content:"";position:absolute;inset:0;background:#2E6B4F;opacity:.85;border-left:1px solid var(--line);border-right:1px solid var(--line)}
.tlbar .me img{position:relative;width:46px;height:46px;margin-top:2px;flex:none}

.search svg{color:var(--muted);z-index:1}

/* quiz */
.qz-hero{max-width:760px;margin:40px auto 10px;padding:clamp(22px,4vw,44px);color:var(--ink);position:relative;z-index:2}
.qz-hero h1{font-size:clamp(40px,7vw,72px);margin:12px 0 6px;color:#2E6B4F;text-shadow:none}
.qz-hero .lead{font-size:clamp(17px,2.2vw,20px);font-weight:700;margin:10px 0 16px}
.qz-faces{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 22px}
.qz-faces img{width:64px;height:64px}
.qz-faces img:nth-child(odd){transform:none}.qz-faces img:nth-child(even){transform:none translateY(4px)}
.qz-go{font-size:20px;padding:16px 32px;border-radius:999px}
.fine{font-weight:700;color:var(--muted);font-size:15px}
.qz-dlg{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;border:1px solid var(--line);border-radius:26px;box-shadow:0 1px 3px rgba(20,30,25,.14);padding:22px 24px 20px;width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;background:#fff;color:#1E2A24}
.qz-dlg::backdrop{background:rgba(7,31,25,.7)}
.qz-top{display:flex;justify-content:space-between;align-items:center;font-weight:800;color:#5A6159;font-size:15px}
.qz-x{width:42px;height:42px;border:1px solid var(--line);border-radius:12px;background:#F6F3EA;font-size:24px;line-height:1;cursor:pointer;color:#1E2A24;padding:0}
.qz-bar{height:12px;background:#D9F2C4;border:1px solid var(--line);border-radius:999px;margin:12px 0 18px;overflow:hidden}
.qz-bar i{display:block;height:100%;background:#2E6B4F;transition:width .25s}
.qz-dlg h2{font:700 clamp(24px,5vw,32px)/1.15 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;margin:0 0 16px}
.qz-opts{display:grid;gap:12px}
.qz-opts button{font:800 18px/1.25 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;text-align:left;color:#1E2A24;background:#FFF1C2;border:1px solid var(--line);border-radius:16px;padding:16px 18px;box-shadow:0 1px 3px rgba(20,30,25,.14);cursor:pointer}
.qz-opts button:nth-child(2){background:#D9F2C4}.qz-opts button:nth-child(3){background:#D2E6FB}
@media (hover:hover){.qz-opts button:hover{transform:translate(-1px,-1px);box-shadow:0 1px 3px rgba(20,30,25,.14)}}
.qz-opts button.on{background:#2E6B4F;color:#fff}
.qz-back{margin-top:16px;border:0;background:none;color:#5A6159;font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;cursor:pointer;text-decoration:underline;padding:6px 0}
.qz-results{max-width:900px;margin:30px auto}
#pm-top{display:flex;gap:22px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:24px;box-shadow:0 1px 3px rgba(20,30,25,.14);padding:20px;margin:6px 0 26px}
#pm-top img{width:140px;height:140px;flex:0 0 auto}
#pm-top h3{font:700 clamp(30px,6vw,48px)/1.05 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;margin:0 0 6px}
#pm-top p{margin:0 0 12px;font-size:18px;font-weight:700}
#pm-share{display:grid;grid-template-columns:minmax(0,400px) minmax(0,420px);gap:28px;align-items:start;justify-content:center;margin:0 0 32px}
#pm-canvas{width:100%;height:auto;border:1px solid var(--line);border-radius:18px;box-shadow:0 1px 3px rgba(20,30,25,.14);background:#0E3B2E}
.pm-btns{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-content:start}
.pm-btns #pm-native{grid-column:1/-1;justify-content:center}
.pm-more{grid-column:1/-1}.pm-more summary{list-style:none;cursor:pointer;letter-spacing:2px}.pm-more summary::-webkit-details-marker{display:none}
.pm-more-g{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:12px}.pm-btns #pm-msg{grid-column:1/-1;margin:0}
.pm-b{display:flex;align-items:center;justify-content:center;text-align:center;min-height:52px;box-sizing:border-box;font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24;background:#fff;border:1px solid var(--line);border-radius:999px;padding:11px 18px;box-shadow:0 1px 3px rgba(20,30,25,.14);cursor:pointer;text-decoration:none}
#pm-friend{background:#F2C14E;color:#1E2A24;border:1px solid var(--line);border-radius:16px;padding:12px 16px;font-weight:800;margin:0 0 16px;display:flex;gap:12px;align-items:center}
#pm-friend img{width:56px;height:56px}
@media (max-width:760px){#pm-top{flex-direction:column;text-align:center}#pm-share{grid-template-columns:1fr;justify-items:center}#pm-canvas{max-width:360px}.pm-btns{width:100%;max-width:420px}}
@media (max-width:600px){.qz-dlg{width:100vw;max-width:100vw;height:100dvh;max-height:100dvh;margin:0;border-radius:0;border:0;box-shadow:none;padding:18px 18px 28px}}
.quizband{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:22px;background:#2E6B4F;color:#fff}
.quizband h2{margin:0 0 4px;color:#fff;text-shadow:none}.quizband p{margin:0;font-weight:700}
.quizband .imgs{display:flex}.quizband .imgs img{width:70px;height:70px;margin-right:-10px}
#pm-friend[hidden],[hidden]{display:none!important}

.q .val.sm{font-size:17px;line-height:1.25}

/* tip jar: Feed the T. rex */
.tipjar{display:flex;gap:24px;align-items:center;flex-wrap:wrap;padding:24px;background:#FFF1C2;color:#1E2A24}
.tipjar h2{font-size:clamp(28px,4vw,40px);margin:8px 0 6px;color:#1E2A24}.tipjar p{font-weight:700;margin:0 0 14px}
.tj-pic{position:relative;width:200px;flex:none;margin:0 auto}.tj-pic img{display:block;width:150px;height:150px}
.tj-pic .lunch{position:absolute;right:0;bottom:-6px;width:90px;animation:jiggle 2.4s ease-in-out infinite}
@keyframes jiggle{0%,80%,100%{transform:rotate(0)}85%{transform:none}90%{transform:none}95%{transform:none}}
.tj-txt{flex:1;min-width:240px}
.tipmini{display:flex;gap:14px;align-items:center;padding:14px 18px;text-decoration:none;background:#FFF1C2;color:#1E2A24;font-weight:700;flex-wrap:wrap}
.tipmini span:nth-child(2){flex:1;min-width:200px}.tipmini .btn{padding:8px 16px;font-size:16px}
.tipfloat{position:fixed;right:14px;bottom:14px;z-index:40;display:flex;align-items:center;gap:4px;background:#F2C14E;color:#1E2A24;border:1px solid var(--line);border-radius:999px;box-shadow:0 1px 3px rgba(20,30,25,.14);padding:2px 14px 2px 4px;font:700 15px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;text-decoration:none}
.tipfloat img{width:40px;height:40px}
.tipfloat:hover{transform:translate(-1px,-1px)}
@media print{.tipfloat{display:none}}

.photo{position:relative}.photo .tag{position:absolute;top:-14px;left:-10px;margin:0;z-index:2}.photo.ai{transform:none}.photo.ai .tag{background:#8DA88F}

/* phone header: one line, no wrapping */
.nav a{white-space:nowrap}
.nav .pill .sm{display:none}
@media (max-width:640px){
  .top .wrap{gap:8px}
  .brand{font-size:19px;gap:6px}.brand svg{width:30px;height:30px}
  .nav{gap:2px}.nav a{font-size:15px;padding:6px 8px}
  .nav .pill{padding:5px 11px;box-shadow:0 1px 3px rgba(20,30,25,.14)}
  .nav .pill .lg{display:none}.nav .pill .sm{display:inline}
}
@media (max-width:360px){.brand{font-size:0}.brand svg{width:32px;height:32px}}
.scene .search input{background:#fff;color:#1E2A24}.scene .search svg{color:#5A6159}
@media (max-width:640px){.tipfloat{font-size:13px;padding:1px 10px 1px 2px;right:10px;bottom:10px}.tipfloat img{width:32px;height:32px}}

/* three-stripe menu (same idea as Furry Diary): phones and tablets get the button, everything is in the panel */
#dwm-btn{display:none;align-items:center;justify-content:center;width:48px;height:48px;flex:0 0 auto;margin-left:auto;background:#F2C14E;color:#1E2A24;border:1px solid var(--line);border-radius:14px;box-shadow:0 1px 3px rgba(20,30,25,.14);cursor:pointer;padding:0}
#dwm-btn:active{transform:translate(2px,2px);box-shadow:0 1px 3px rgba(20,30,25,.14)}
#dwm-btn:focus-visible,#dwm a:focus-visible,#dwm button:focus-visible,#dwm summary:focus-visible{outline:3px solid #2E6B4F;outline-offset:2px}
#dwm{position:fixed;top:10px;left:10px;right:10px;z-index:10000;max-height:calc(100dvh - 20px);overflow:auto;display:none;background:#fff;color:#1E2A24;border:1px solid var(--line);border-radius:24px;box-shadow:0 1px 3px rgba(20,30,25,.14);padding:14px 16px 18px;font:700 18px/1.3 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
#dwm.open{display:block;animation:dwmIn .16s ease-out}
@keyframes dwmIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
#dwm-shade{position:fixed;inset:0;z-index:9999;background:rgba(7,31,25,.55);display:none}#dwm-shade.open{display:block}
#dwm .dwm-top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:8px}
#dwm .dwm-brand{display:flex;align-items:center;gap:8px;font:700 22px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;text-decoration:none;color:inherit}
#dwm .dwm-brand svg{width:32px;height:32px}
#dwm .dwm-x{width:44px;height:44px;border:1px solid var(--line);border-radius:12px;background:#F6F3EA;font-size:26px;line-height:1;cursor:pointer;color:#1E2A24}
#dwm .dwm-links{display:flex;flex-direction:column}
#dwm .dwm-links>a,#dwm .dwm-groups summary{display:block;text-decoration:none;color:inherit;padding:13px 6px;border-bottom:2px dashed #D9F2C4;font:700 21px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;cursor:pointer}
#dwm .dwm-links>a:hover,#dwm .dwm-groups summary:hover{background:#F6F3EA}
#dwm .dwm-groups summary{list-style:none}#dwm .dwm-groups summary::-webkit-details-marker{display:none}
#dwm .dwm-groups summary::after{content:" \25BE";font-size:.8em}#dwm .dwm-groups[open] summary::after{content:" \25B4"}
#dwm .dwm-groups div{display:grid;grid-template-columns:1fr 1fr;gap:2px;padding:6px 0 10px}
#dwm .dwm-sub{text-decoration:none;color:#4A524A;padding:8px 10px;border-radius:10px;font-size:16px}
#dwm .dwm-sub:hover{background:#F6F3EA}
#dwm .dwm-cta{display:block;text-align:center;text-decoration:none;margin:16px 0 4px;background:#2E6B4F;color:#fff;padding:14px;border-radius:999px;font:700 18px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;border:1px solid var(--line);box-shadow:0 1px 3px rgba(20,30,25,.14)}
@media (min-width:600px){#dwm{left:auto;width:420px}}
@media (max-width:1024px){header.top .nav{display:none!important}#dwm-btn{display:inline-flex}}
.dcard .chip{background:#fff;color:#1E2A24;border-color:#1E2A24}.dcard .chip.meat{background:#FFD3CC}.dcard .chip.plant{background:#D9F2C4}.dcard .chip.fish{background:#D2E6FB}.dcard .chip.mix,.dcard .chip.cousin{background:#FFF1C2}

.tlbar .p{background:#E6DCFB}

/* language picker (desktop nav) */
.langpick{position:relative}
.langpick summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:4px;font-weight:800;padding:7px 10px;border-radius:999px}
.langpick summary::-webkit-details-marker{display:none}
.langpick summary:hover{background:var(--bg2)}
.langlist{position:absolute;right:0;top:calc(100% + 8px);z-index:60;background:#fff;color:#1E2A24;border:1px solid var(--line);border-radius:16px;box-shadow:0 1px 3px rgba(20,30,25,.14);padding:8px;display:grid;grid-template-columns:repeat(3,max-content);gap:2px;max-height:70vh;overflow:auto}
.langlist a{text-decoration:none;padding:7px 10px;border-radius:10px;font-weight:700;font-size:15px;white-space:nowrap}
.langlist a:hover,.langlist a[aria-current]{background:#F6F3EA}
.footlang{display:flex;flex-wrap:wrap;gap:4px 10px;align-items:center}.footlang a{font-weight:700;font-size:14px}

/* AI sticker icons (webp): they can't blink like the drawn SVGs, so they bob and wiggle instead */
.dcard .pic img[src*=".webp"]{object-fit:contain;transform-origin:50% 90%;animation:dwbob 3.4s ease-in-out infinite}
@keyframes dwbob{0%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-6px) rotate(-1.5deg)}60%{transform:translateY(0) rotate(1deg)}}
.dcard .pic:hover img[src*=".webp"]{animation:wig .5s ease-in-out}
.dc:hover img[src*=".webp"],.parade a:hover img,.quizband:hover .imgs img{animation:wig .5s ease-in-out}
.walk img[src*=".webp"]{animation:dwstep .6s ease-in-out infinite alternate}
@keyframes dwstep{from{transform:translateY(0) rotate(-2deg)}to{transform:translateY(-4px) rotate(2deg)}}
img[src*=".webp"]{object-fit:contain}

/* Most asked questions (accordion) */
.faq{display:grid;gap:12px;max-width:860px;margin:0 auto}
.qa{padding:0;overflow:hidden}
.qa summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:12px;padding:14px 18px;font-family:var(--fh,inherit);font-weight:800;font-size:1.12rem;line-height:1.3}
.qa summary::-webkit-details-marker{display:none}
.qa summary:after{content:"+";margin-left:auto;font-size:1.6rem;line-height:1;color:var(--lava);transition:transform .2s}
.qa[open] summary:after{transform:none}
.qa .qm{flex:none;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--sun);border:1px solid var(--line);color:#1E2A24;font-weight:900;font-size:1.1rem}
.qa:nth-child(3n+2) .qm{background:var(--leaf)}.qa:nth-child(3n) .qm{background:var(--sky);color:#fff}
.qa p{margin:0;padding:0 18px 16px 64px;font-size:1.05rem;line-height:1.55}
.qa[open]{box-shadow:6px 6px 0 var(--lava)}
@media (max-width:600px){.qa p{padding-left:18px}}

/* size in kid terms */
.kidmath{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}
.kidmath span{display:flex;align-items:center;gap:8px;background:#FFF6D8;color:#1E2A24;border:1px solid var(--line);border-radius:999px;padding:7px 14px 7px 8px;font-weight:800;box-shadow:0 1px 3px rgba(20,30,25,.14)}
.kidmath span:nth-child(2){background:#E6DCFB}.kidmath span:nth-child(3){background:#D9F2C4}
.kidmath i{font-style:normal;font-size:1.35rem;line-height:1}

/* compare with me */
.cmpme{margin-top:18px;background:#FFF6D8;color:#1E2A24;border:3px dashed #1E2A24;border-radius:20px;padding:16px 18px}
.cmpme h3{margin:0 0 10px;font-size:1.25rem}
.cmpme form{display:flex;flex-wrap:wrap;gap:12px;align-items:flex-end}
.cmpme label{display:flex;flex-direction:column;gap:4px;font-weight:800;font-size:.95rem}
.cmpme label span{display:flex;align-items:center;gap:6px}
.cmpme input{width:96px;font:inherit;font-size:1.1rem;padding:8px 10px;border:1px solid var(--line);border-radius:12px;background:#fff;color:#1E2A24}
.cmpme .btn{margin:0}
.cm-out{margin-top:12px}
.cm-out p{margin:6px 0;font-weight:800;font-size:1.1rem}
.cm-row{display:flex;align-items:center;gap:10px;margin:6px 0}
.cm-row span{flex:none;width:110px;font-weight:800;font-size:.9rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cm-bar{height:22px;border:1px solid var(--line);border-radius:11px}
.cm-bar.me{background:#8DA88F}.cm-bar.it{background:#2E6B4F}
.cmpme .fine{margin:10px 0 0;font-size:.85rem;opacity:.75}
.cm-units{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;margin:0 0 10px}
.cm-units button{font:inherit;font-weight:800;font-size:.9rem;padding:6px 14px;border:0;background:#fff;color:#1E2A24;cursor:pointer}
.cm-units button[aria-pressed="true"]{background:#1E2A24;color:#FFF6D8}
.cmpme input[name=ft],.cmpme input[name=in]{width:64px}

/* Ask Rex */
.askrex{padding:18px 20px;background:linear-gradient(135deg,#E6F7EE,#FFF6D8);color:#1E2A24}
.ar-head{display:flex;gap:14px;align-items:center}
.ar-head img{flex:none;animation:dwbob 3.4s ease-in-out infinite}
.ar-head h2{margin:0;font-size:1.4rem}.ar-head p{margin:4px 0 0;font-size:.95rem;opacity:.8}
.askrex form{display:flex;gap:10px;margin-top:14px}
.askrex input{flex:1;min-width:0;font:inherit;font-size:1.05rem;padding:10px 14px;border:1px solid var(--line);border-radius:14px;background:#fff;color:#1E2A24}
.askrex .btn{margin:0}
.ar-out:empty{display:none}
.ar-out{margin-top:12px}
.ar-q{margin:0 0 8px auto;max-width:85%;width:fit-content;background:#1E2A24;color:#fff;padding:8px 14px;border-radius:16px 16px 4px 16px;font-weight:700}
.ar-a{margin:0;max-width:90%;width:fit-content;background:#fff;border:1px solid var(--line);padding:10px 14px;border-radius:16px 16px 16px 4px;font-weight:700;font-size:1.05rem;line-height:1.5}
.ar-left{margin:6px 0 0;font-size:.85rem;opacity:.7}
.askrex .fine{margin:12px 0 0;font-size:.82rem;opacity:.72}

/* floating buttons: Ask Rex (AI helper) + Feed Rex (tip jar) */
.tipfloat{display:none}
.fabs{position:fixed;right:14px;bottom:14px;z-index:40;display:flex;flex-direction:column;align-items:flex-end;gap:8px}
.fab{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:999px;box-shadow:0 1px 3px rgba(20,30,25,.14);padding:3px 16px 3px 4px;color:#1E2A24;text-decoration:none;font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;line-height:1.05}
.fab b{display:block;font-weight:700;font-size:15px}
.fab small{display:block;font:600 11px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;opacity:.75}
.fab:hover{transform:translate(-1px,-1px)}
.fab-feed{background:#F2C14E}
.fab-feed img{width:36px;height:36px}
.fab-ask{background:#B9F0D2}
.fab-ic{display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:#fff;border:1px solid var(--line);font-size:18px}
@media print{.fabs{display:none}}
@media (max-width:640px){.fabs{right:10px;bottom:10px;gap:6px}.fab{padding:2px 12px 2px 3px}.fab b{font-size:13px}.fab small{font-size:10px}.fab-feed img,.fab-ic{width:30px;height:30px}}

/* Oskar 4 Oct: centre things on wide screens, incl. the last row of tiles (tip jar stays left) */
.tiles{display:flex;flex-wrap:wrap;justify-content:center}
.tiles>*{flex:0 0 calc((100% - 70px)/6);min-width:0}
@media (max-width:1000px){.tiles>*{flex-basis:calc((100% - 42px)/4)}}
@media (max-width:720px){.tiles>*{flex-basis:calc((100% - 28px)/3)}}
@media (max-width:480px){.tiles>*{flex-basis:calc((100% - 14px)/2)}}
.era{text-align:center}.era .row{justify-content:center}
.promise .card{text-align:center}
.soon{text-align:center;justify-content:center;flex-direction:column}
.soon>div{flex:none!important}
.kin{display:flex;flex-wrap:wrap;justify-content:center}
.kin>*{flex:0 0 calc((100% - 50px)/6);min-width:0}
@media (max-width:1000px){.kin>*{flex-basis:calc((100% - 30px)/4)}}
@media (max-width:720px){.kin>*{flex-basis:calc((100% - 20px)/3)}}
@media (max-width:480px){.kin>*{flex-basis:calc((100% - 10px)/2)}}
footer .wrap{text-align:center}
footer .footlang{justify-content:center}
.size .szh{margin:18px 0 8px;font-size:1.15rem}
.size .szh:first-of-type{margin-top:4px}
.hnote{margin:4px 0 0;font-size:.85rem;opacity:.7;text-align:center}
.wrow{display:flex;flex-direction:column;align-items:center;gap:6px;padding:6px 0}
.wicons{font-size:34px;line-height:1.1;text-align:center;letter-spacing:2px;max-width:560px}
.wicons .half{font-style:normal;opacity:.45}
.wrow b{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;font-size:1.1rem}

/* quiz result: big card on desktop, centred (Oskar: at least 600 px) */
@media (min-width:761px){.qz-results{max-width:1060px}#pm-share{grid-template-columns:minmax(0,620px);justify-content:center}.pm-btns{width:100%}}
#pm-top{max-width:1030px;margin-left:auto;margin-right:auto}
.qz-results>.kicker{text-align:center}
.brand img{width:44px;height:44px;flex:none;object-fit:contain;transform:scaleX(-1)}
.dwm-brand img{width:36px;height:36px;object-fit:contain;transform:scaleX(-1)}
@media (max-width:640px){.brand img{width:36px;height:36px}}
@media (max-width:360px){.brand{font-size:0}}
.cm-ex{font-size:.9rem!important;font-weight:700!important;opacity:.75;font-style:italic}
.qz-results h2{text-align:center}
.fab-ask{background:#E6DCFB}
.fab-ask img,.fab-feed img{width:36px;height:36px;object-fit:contain}
@media (max-width:640px){.fab-ask img,.fab-feed img{width:30px;height:30px}}
.tj-pic img{object-fit:contain}
/* long names never break mid-word: the font shrinks with the name length */
.dcard h1{word-break:normal;overflow-wrap:normal;font-size:clamp(26px,calc(6.5vw / var(--k,1)),calc(72px / var(--k,1)))}
/* Fula: one entry, opens a second choice of variants */
.langlist details.llgroup{grid-column:1/-1}
.langlist details.llgroup>summary{list-style:none;cursor:pointer;padding:7px 10px;border-radius:10px;font-weight:700;font-size:15px;white-space:nowrap}
.langlist details.llgroup>summary::-webkit-details-marker{display:none}
.langlist details.llgroup>summary:hover,.langlist details.llgroup[open]>summary{background:#F6F3EA}
.langlist details.llgroup a{display:inline-block;margin-left:14px}

/* ===== quiz v2 (4 Oct): Yes/No answers, "My 5 superpowers" + "My top 5 NO-NOs" lists, play again button ===== */
.qz-opts.qz-yn{grid-template-columns:1fr 1fr}
.qz-opts.qz-yn button{text-align:center;font-size:22px;padding:20px 12px}
.qz-lists{display:grid;grid-template-columns:1fr;gap:18px;max-width:1030px;margin:0 auto 22px}
@media (min-width:700px){.qz-lists{grid-template-columns:1fr 1fr}}
.qz-list{background:#fff;color:#1E2A24;border:1px solid var(--line);border-radius:22px;box-shadow:0 1px 3px rgba(20,30,25,.14);padding:18px 18px 12px}
.qz-list h3{font:700 22px/1.2 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;margin:0 0 12px;text-transform:uppercase;letter-spacing:.5px}
.qz-good{background:#EAF8DF}.qz-good h3{color:#1F5139}
.qz-bad{background:#FFEDE8}.qz-bad h3{color:#E0336B}
.qz-list ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.qz-list li{display:flex;align-items:center;gap:12px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:8px 12px;font-weight:800;font-size:17px;line-height:1.25}
.qz-list li .e{flex:none;width:40px;height:40px;display:grid;place-items:center;font-size:24px;border-radius:50%;background:#FFF1C2;border:1px solid var(--line)}
.qz-bad li:first-child{background:#2E6B4F;color:#fff}
.qz-list li em{display:block;font:700 12px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;font-style:normal;text-transform:uppercase;letter-spacing:.5px;color:#FFF1C2}
.qz-again-top{text-align:center;margin:0 0 30px}

/* ===== Top speed + Dino TOP lists (agent "tops", Oskar 4 Oct) ===== */
.spd{display:grid;gap:8px;margin:6px 0 4px}
.spd-r{display:grid;grid-template-columns:44px 1fr;grid-template-areas:"i t" "i b";column-gap:10px;align-items:center}
.spd-i{grid-area:i;font-size:30px;line-height:1;text-align:center}.spd-i img{width:44px;height:44px;object-fit:contain;display:block}
.spd-t{grid-area:t;font-weight:700;font-size:15px}.spd-t>span{white-space:nowrap}.spd-t b{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
.spd-b{grid-area:b;height:16px;background:var(--bg2);border-radius:999px;overflow:hidden;border:1px solid var(--line)}
.spd-b i{display:block;height:100%;background:#4F9BE8;border-radius:999px}
.spd-r.me .spd-b i{background:#2E6B4F}.spd-r.me .spd-t b{color:#2E6B4F}
.topband{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:22px;background:#4F9BE8;color:#fff}
.topband h2{margin:0 0 4px;color:#fff;text-shadow:none}.topband p{margin:0;font-weight:700}
.topband .imgs{display:flex}.topband .imgs img{width:70px;height:70px;margin-right:-10px}
.topband:hover .imgs img{animation:wig .5s ease-in-out}
.tp-pic{display:block;width:100%;max-width:230px;height:auto;margin:0 auto}
.tp-lt{display:flex;gap:18px;flex-wrap:wrap;align-items:center;padding:20px;background:#FFF1C2;color:#1E2A24}
.tp-lt>div:first-child{flex:1;min-width:240px}.tp-lt h2{margin:0 0 6px}.tp-lt p{margin:0;font-weight:700}
.tp-lt-pics{display:flex;gap:10px;flex:1;min-width:260px}.tp-lt-pics svg{background:#fff;border:1px solid var(--line);border-radius:14px;padding:6px}
.tp-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.tp-card{display:flex;flex-direction:column;gap:4px;padding:14px;text-decoration:none;transition:transform .12s,box-shadow .12s}
.tp-card:hover{transform:translate(-2px,-2px);box-shadow:0 1px 3px rgba(20,30,25,.14)}
.tp-card .tp-pic{max-width:180px;background:#fff;border-radius:12px}
.tp-card>b{font-size:24px;margin-top:6px}.tp-card>span{font-weight:700;color:var(--muted)}
.tp-card small{font-weight:700;color:var(--muted)}
.tp-3{display:flex;margin-top:4px}.tp-3 img{width:52px;height:52px;object-fit:contain;margin-right:-6px}
.tp-hero{padding:20px 0 6px}
.tp-ex{display:flex;gap:18px;align-items:center;flex-wrap:wrap;padding:18px;background:#FFF1C2;color:#1E2A24}
.tp-ex .tp-pic{flex:0 1 230px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:6px}
.tp-ex>div{flex:1;min-width:230px}.tp-ex h1{font-size:clamp(30px,5.5vw,52px);margin:8px 0}.tp-ex p{margin:0;font-weight:700}
.tp-more{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:14px 0}
.tp-more .chip{text-decoration:none}.tp-more .chip.on{background:var(--sun);color:#1E2A24}
.tp-h2{font-size:clamp(24px,4vw,34px);margin:22px auto 10px;max-width:860px}
.tp-list{list-style:none;margin:0 auto;padding:0;display:grid;gap:10px;max-width:860px}
.tp-row{display:grid;grid-template-columns:40px minmax(0,1fr) auto;grid-template-areas:"r n v" "r b b";column-gap:10px;row-gap:4px;align-items:center;
  background:var(--card);border:1px solid var(--line);border-radius:16px;box-shadow:0 1px 3px rgba(20,30,25,.14);padding:8px 12px}
.tp-rk{grid-area:r;font:700 22px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;text-align:center;color:var(--muted)}
.tp-top .tp-rk{color:#1E2A24;background:var(--sun);border:1px solid var(--line);border-radius:999px;width:36px;height:36px;line-height:32px}
.tp-n{grid-area:n;display:flex;align-items:center;gap:8px;text-decoration:none;min-width:0}
.tp-n img{width:52px;height:52px;object-fit:contain;flex:none}
.tp-n span{min-width:0}.tp-n b{display:block;font:700 18px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;overflow-wrap:break-word}.tp-n small{display:block;font-weight:700;color:var(--muted);font-size:13px}
.tp-c{font-size:11px;padding:0 7px;margin-left:4px;vertical-align:1px;white-space:nowrap;display:inline-block;line-height:1.5}
.tp-v{grid-area:v;text-align:right;font-weight:700}.tp-v b{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;font-size:16px;white-space:nowrap}.tp-v small{display:block;color:var(--muted);font-size:13px}
.tp-est{display:block;font-size:12px;color:var(--muted)}
.tp-bar{grid-area:b;height:14px;background:var(--bg2);border-radius:999px;overflow:hidden;border:1px solid var(--line)}
.tp-bar i{display:block;height:100%;background:#2E6B4F;border-radius:999px}
.tp-ratio .tp-row{grid-template-columns:40px minmax(0,1fr) 132px;grid-template-areas:"r n s" "r v s"}.tp-ratio .tp-v{text-align:left}
.tp-lh{grid-area:s;width:132px;height:auto;max-height:140px;align-self:end}
.tp-ev{columns:2;column-gap:24px;padding-left:18px}@media (max-width:560px){.tp-ev{columns:1}}
.tp-fine{text-align:center;max-width:720px;margin:20px auto}
@media (max-width:520px){
  .tp-row{grid-template-columns:28px minmax(0,1fr);grid-template-areas:"r n" "r v" "r b";row-gap:2px;padding:7px 10px}
  .tp-v{text-align:left;display:flex;flex-wrap:wrap;gap:0 8px;align-items:baseline}.tp-v b{white-space:normal;font-size:15px}.tp-est{display:inline}
  .tp-ratio .tp-row{grid-template-columns:28px minmax(0,1fr);grid-template-areas:"r n" "r v" "r s"}
  .tp-ratio .tp-v{display:block}.tp-lh{width:150px;max-height:110px;justify-self:start}
  .tp-n b{font-size:16px}.tp-rk{font-size:17px}.tp-top .tp-rk{width:28px;height:28px;line-height:24px;font-size:16px}
  .tp-n img{width:44px;height:44px}
}

/* Ask Rex picker on pages without a dino (Oskar 5 Oct) */
.askpick{position:fixed;inset:0;z-index:60;background:rgba(20,30,28,.55);display:flex;align-items:flex-end;justify-content:center;padding:16px}
.askpick[hidden]{display:none}
.askpick-box{position:relative;width:100%;max-width:520px;max-height:85vh;overflow:auto;padding:20px 18px 18px;border-radius:22px}
.askpick-x{position:absolute;top:8px;right:10px;border:0;background:none;font-size:30px;line-height:1;cursor:pointer;color:inherit}
.askpick .ar-head{display:flex;gap:12px;align-items:center;margin-bottom:12px}.askpick .ar-head h2{margin:0}.askpick .ar-head p{margin:2px 0 0;opacity:.75}
.askpick-q{width:100%;box-sizing:border-box;font-size:18px;padding:12px 14px;border-radius:14px;border:1px solid var(--line)}
.askpick-res a,.askpick-fam a{display:flex;align-items:center;gap:10px;padding:8px 6px;font-weight:700;text-decoration:none;color:inherit}
.askpick-res a img{width:40px;height:40px}
.askpick-fam{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}
.askpick-fam a{flex-direction:column;text-align:center;font-size:14px;border-radius:14px}.askpick-fam a:hover,.askpick-res a:hover{background:rgba(255,201,60,.25)}
@media(min-width:700px){.askpick{align-items:center}}
.askpick-fam span{overflow-wrap:anywhere;font-size:13px;max-width:100%}
/* one size card: length, weight, height, top speed (Oskar 5 Oct) */
.qsize{grid-column:span 2;display:grid;grid-template-columns:1fr 1fr;gap:12px 18px;align-content:start}
.qsize .qrow{min-width:0}
.qsize .qrow+.qrow{border:0}
.qsize .val{font-size:20px}
@media(max-width:520px){.qsize{grid-column:1/-1}}
/* What did it eat? (Oskar 5 Oct) + clickable Ate chip */
.qeat{grid-column:1/-1;display:flex;gap:16px;align-items:center}
.qeat .eat-em{font-size:34px;line-height:1.1;letter-spacing:2px;flex:0 0 auto;max-width:40%}
.qeat .eat-a{font-weight:700;font-size:17px;line-height:1.4;margin-top:4px}
a.chip{text-decoration:none;color:inherit;cursor:pointer}a.chip:hover{filter:brightness(.95);transform:translateY(-1px)}
@media(max-width:520px){.qeat{flex-direction:column;align-items:flex-start}.qeat .eat-em{max-width:none}}
/* search results readable in the dark hero and above the dino parade (Oskar 5 Oct) */
.search{z-index:40}.results{z-index:50;background:#fff}.results,.results a{color:#1E2A24}
/* quick facts: 3 tidy columns on desktop (Lived, Fossils, Length / Weight, Height, Speed) */
@media(min-width:860px){.quick{grid-template-columns:repeat(3,1fr)}}
.imp2{font-weight:700;opacity:.75;font-size:.8em}
/* compare with YOU: two standing bars like a height chart on the wall (Oskar 5 Oct) */
.cm-cols{display:flex;gap:28px;align-items:flex-end;height:190px;padding:46px 8px 0;margin:8px 0 6px;border-bottom:1px solid var(--line)}
.cm-c{flex:0 0 96px;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;height:100%;position:relative}
.cm-c b{position:absolute;bottom:-44px;font-size:.9rem;white-space:nowrap;max-width:140px;overflow:hidden;text-overflow:ellipsis}
.cm-c small{position:absolute;bottom:-62px;font-weight:700;opacity:.75}
.cm-v{width:64px;border:1px solid var(--line);border-bottom:0;border-radius:12px 12px 0 0;position:relative}
.cm-v.me{background:#8DA88F}.cm-v.it{background:#2E6B4F}
.cm-v img{position:absolute;width:64px;height:64px;left:50%;transform:translateX(-50%);top:-62px}
.cm-out .cm-cols+p{margin-top:70px}
.cm-pre{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px}
.cm-pre button{font:800 14px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:7px 14px;border-radius:999px;border:1px solid var(--line);background:#fff;color:#1E2A24;cursor:pointer}
.cm-pre button:hover{background:#F2C14E}
/* sticker pictures in the weight row and bubbles (Oskar 5 Oct) */
.wicons img{width:32px;height:32px;object-fit:contain;vertical-align:middle;margin:0 1px}
.wicons .half img{opacity:1}
.kidmath i img{width:30px;height:30px;object-fit:contain;display:block}
/* legal pages (5 Oct 2026) */
.legal{max-width:760px;margin:24px auto;padding:24px 28px;line-height:1.6}
.legal h1{font-size:1.8rem;margin-top:0}.legal h2{font-size:1.2rem;margin-top:1.6em}
.legal table{border-collapse:collapse;width:100%;font-size:.92rem;display:block;overflow-x:auto}
.legal th,.legal td{border:1px solid #cfe3dc;padding:6px 8px;text-align:left;vertical-align:top}
.legal ul{padding-left:1.2em}
/* RTL pages (ar, ur, fa, ps, he): the hero parade overflowed sideways (5 Oct 2026) */
html,body{overflow-x:clip}

/* compare-with-me, filled out (Oskar 5 Oct): line-up of known things, nose-to-tail view, figure grid, dino card */
.cm-cols{gap:14px;overflow:visible}
.cm-c{flex:1 1 0;min-width:46px;max-width:none}
.cm-v{width:min(64px,82%)}
.cm-c b{white-space:normal;overflow-wrap:anywhere;text-align:center;line-height:1.1;font-size:.82rem;bottom:-48px;width:100%;max-width:none;height:2.3em;display:flex;align-items:flex-start;justify-content:center}
.cm-c small{bottom:-66px;font-size:.78rem}
.cm-out .cm-cols+p{margin-top:84px}
.cm-em{position:absolute;left:50%;transform:translateX(-50%);top:-40px;font-size:32px;line-height:1}
@media (max-width:560px){.cm-cols{gap:6px}.cm-v img{width:48px;height:48px;top:-46px}.cm-em{font-size:24px;top:-30px}.cm-c b{font-size:.7rem}}
.cm-len,.cm-grid{margin-top:18px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:12px 14px}
.cm-len h4,.cm-grid h4{margin:0 0 8px;font-size:1.05rem}
.cm-len .cm-row span{width:150px;display:flex;align-items:center;gap:6px}
.cm-len .cm-row small{flex:none;font-weight:700;opacity:.75;font-size:.8rem}
.cm-len .cm-bar{flex:0 1 auto;min-width:6px}
.cm-ic{font-style:normal;font-size:20px;width:26px;text-align:center;flex:none}
.cm-ic img{width:26px;height:26px;vertical-align:middle}
.cm-figs{display:flex;flex-wrap:wrap;gap:3px 2px;max-height:260px;overflow:hidden}
.cm-figs svg{flex:none}
.cm-cap{font-size:.85rem!important;font-weight:700!important;opacity:.75;margin:8px 0 0!important}
.cm-card{margin-top:18px;display:flex;gap:14px;align-items:center;background:linear-gradient(135deg,#F2C14E,#FF7EB6 55%,#8DA88F);border:1px solid var(--line);border-radius:20px;padding:14px 16px;color:#1E2A24;box-shadow:0 1px 3px rgba(20,30,25,.14);max-width:520px}
.cm-card-pic{flex:none;width:84px;height:84px;background:#FFF6D8;border:1px solid var(--line);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:44px}
.cm-card-pic img{width:70px;height:70px}
.cm-card-k{font-weight:900;font-size:.85rem;text-transform:uppercase;letter-spacing:.06em}
.cm-out .cm-card-f{margin:4px 0;font-size:1.15rem;line-height:1.25}
.cm-card-u{font-weight:800;font-size:.8rem;opacity:.8}
.cm-out .cm-card-t{font-size:.85rem;font-weight:700;opacity:.75;margin:8px 0 0}

/* quiz result: the dino's own superpower chip (Oskar 7 Oct) */
#pm-top .qz-own{display:inline-block;margin:6px 0 10px;padding:6px 14px;border-radius:999px;background:#F2C14E;color:#1E2A24;font-weight:800}

/* toddler picture quiz (Oskar 8 Oct) */
.qz-tinyb{display:block;margin:12px auto 0;background:#D9F2C4!important;color:#1E2A24!important}
.qz-opts.qz-pics{grid-template-columns:1fr 1fr;gap:14px}
.qz-opts.qz-pics button{text-align:center;padding:10px 4px;aspect-ratio:1/1;max-height:300px;display:flex;align-items:center;justify-content:center;border-radius:24px}
.qz-pics button span{font-size:clamp(64px,24vw,140px);line-height:1}
.qz-pics button span.many{font-size:clamp(34px,11vw,66px);letter-spacing:-2px}
/* dino battle (Oskar 8 Oct) */
.bt-hero{text-align:center}.bt-faces{display:flex;align-items:center;justify-content:center;gap:10px}.bt-faces img:last-child{transform:scaleX(-1)}
.bt-vs,.bt-mid{font:700 28px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#2E6B4F;-webkit-text-stroke:1px #1E2A24}
.bt-arena{margin-top:18px}
.bt-modes{display:flex;gap:8px;justify-content:center;margin-bottom:14px}
.bt-modes button{font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:10px 16px;border-radius:999px;border:1px solid var(--line);background:#fff;color:#1E2A24;cursor:pointer}
.bt-modes button.on{background:#1E2A24;color:#fff}
.bt-teams{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:start}
.bt-mid{align-self:center}
.bt-team h3{text-align:center;margin:0 0 8px;font-size:16px}.bt-red h3{color:#E0336B}.bt-blue h3{color:#2F6FB5}
.bt-slots{display:grid;gap:8px}
.bt-slot{display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border-radius:18px;border:2.5px dashed #1E2A24;background:#FFF8E5;cursor:pointer;font:800 14px/1.2 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24;min-height:116px;justify-content:center}
.bt-red .bt-slot{background:#FFE3DC}.bt-blue .bt-slot{background:#DCEBFB}
.bt-slot.full{border-style:solid}.bt-slot img{width:72px;height:72px;object-fit:contain}.bt-blue .bt-slot img{transform:scaleX(-1)}
.bt-plus{font:700 40px/1 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
.bt-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin:16px 0 0}
#bt-go:disabled{opacity:.45;cursor:default}
.bt-dlg .qz-top{gap:8px}.bt-dlg input{flex:1;font:700 17px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:10px 14px;border-radius:999px;border:1px solid var(--line);min-width:0}
.bt-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(104px,1fr));gap:8px;margin-top:10px;max-height:70vh;overflow:auto}
.bt-it{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:14px;border:2px solid #DCD2F2;background:#fff;cursor:pointer;font:800 13px/1.15 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24;position:relative}
.bt-it span{font-weight:600;font-size:11px;color:#5B7268}.bt-it.lock{opacity:.55}.bt-it.lock::after{content:"\1F512";position:absolute;top:4px;right:6px;font-size:13px}
#bt-res{margin-top:22px}
.bt-win{text-align:center;border-radius:22px;padding:16px;border:1px solid var(--line);background:#FFF1C2}.bt-win.t0{background:#FFE3DC}.bt-win.t1{background:#DCEBFB}
.bt-win h2{margin:6px 0 0;font-size:30px}.bt-wimgs img{width:96px;height:96px;object-fit:contain}
.bt-bars{margin:14px 0}.bt-pl{font-weight:800;margin:0 0 6px}
.bt-bar{display:grid;grid-template-columns:90px 1fr;align-items:center;gap:8px;margin:6px 0;font-weight:800;font-size:14px}
.bt-bar i{display:block;height:18px;border-radius:9px;border:1px solid var(--line)}.bt-bar.t0 i{background:#2E6B4F}.bt-bar.t1 i{background:#4F9BE8}
.bt-why{list-style:none;padding:0;margin:0;display:grid;gap:8px}
.bt-why li{display:flex;gap:10px;align-items:flex-start;background:#fff;border:2px solid #DCD2F2;border-radius:14px;padding:10px 12px;font-weight:700}
.bt-why .e{font-size:22px;line-height:1}
.bt-boom .bt-win{animation:btboom .6s ease-out}
@keyframes btboom{0%{transform:scale(.6) rotate(-4deg);opacity:0}60%{transform:scale(1.06) rotate(2deg);opacity:1}100%{transform:none}}
@media (prefers-reduced-motion:reduce){.bt-boom .bt-win{animation:none}}

/* Oskar 8 Oct: bars measured inside their own track (big phone fonts squeezed them), scale figures stay small (.size svg made one giant blob) */
.cm-track{flex:1 1 auto;min-width:0}.cm-track .cm-bar{min-width:6px;box-sizing:border-box}
.size .cm-figs svg,.cm-figs svg{flex:none;width:13px;height:21px;display:inline-block}
.cm-len .cm-row span{width:auto;max-width:46%;min-width:0;flex:0 1 auto}

/* toddler quiz box under the big quiz (Oskar 8 Oct: own block, cuter) */
.qz-tinybox{max-width:760px;margin:18px auto 26px;text-align:center;padding:26px 20px 30px;border-radius:36px;border:1px solid var(--line);box-shadow:0 1px 3px rgba(20,30,25,.14);
  background:radial-gradient(circle at 12% 18%,#fff 0 6px,transparent 7px),radial-gradient(circle at 88% 30%,#fff 0 5px,transparent 6px),radial-gradient(circle at 75% 85%,#fff 0 7px,transparent 8px),linear-gradient(160deg,#FFE1F0,#FFF4C7 60%,#DDF4FF)}
.qz-tinybox h2{font:700 clamp(28px,6vw,40px)/1.1 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#FF6FAE;text-shadow:none;margin:10px 0 6px}
.qz-tinybox p{font:800 17px/1.4 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24;margin:0 0 18px}
.qz-tinyem{display:flex;justify-content:center;gap:10px;font-size:clamp(34px,8vw,46px)}
.qz-tinyem span{display:inline-block;animation:qzhop 2.4s ease-in-out infinite}.qz-tinyem span:nth-child(2){animation-delay:.2s}.qz-tinyem span:nth-child(3){animation-delay:.4s}.qz-tinyem span:nth-child(4){animation-delay:.6s}.qz-tinyem span:nth-child(5){animation-delay:.8s}
@keyframes qzhop{0%,60%,100%{transform:translateY(0) rotate(0)}30%{transform:translateY(-10px) rotate(-6deg)}}
.qz-tinygo{font:700 22px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24;background:#D9FF5C;border:1px solid var(--line);border-radius:999px;padding:14px 34px;box-shadow:0 1px 3px rgba(20,30,25,.14);cursor:pointer}
.qz-tinygo:active{transform:translate(2px,2px);box-shadow:0 1px 3px rgba(20,30,25,.14)}
@media (prefers-reduced-motion:reduce){.qz-tinyem span{animation:none}}

/* battle teaser on the quiz page (Oskar 8 Oct) */
.qz-btbox{display:block;max-width:760px;margin:0 auto 30px;text-align:center;padding:22px 20px 26px;border-radius:36px;border:1px solid var(--line);box-shadow:0 1px 3px rgba(20,30,25,.14);background:linear-gradient(135deg,#FFD9CF 0 50%,#D6E8FB 50% 100%);color:#1E2A24;text-decoration:none}
.qz-btimgs{display:flex;align-items:center;justify-content:center;gap:12px}.qz-btimgs b{font:700 30px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#2E6B4F;-webkit-text-stroke:1px #1E2A24}
.qz-btbox h2{font:700 clamp(26px,5.5vw,36px)/1.1 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;margin:8px 0 6px}
.qz-btbox p{font:800 17px/1.4 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;margin:0 0 16px}
.qz-btgo{display:inline-block;font:700 22px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#fff;background:#2E6B4F;border:1px solid var(--line);border-radius:999px;padding:12px 34px;box-shadow:0 1px 3px rgba(20,30,25,.14)}
#bt-res{scroll-margin-top:96px}
.topband.bt-band{background:linear-gradient(135deg,#E9573F 0 50%,#2F6FB5 50% 100%)!important}
/* dino race (Oskar 8 Oct) */
.rc-flag{font-size:56px;line-height:1}
.rc-slots{display:grid;grid-template-columns:1fr 1fr;gap:8px}
#rc-res{scroll-margin-top:96px;margin-top:20px}
.rc-track{margin-top:18px;position:relative;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:repeating-linear-gradient(90deg,#C9E7B5 0 40px,#BFE0AA 40px 80px)}
.rc-lane{position:relative;height:84px;border-bottom:3px dashed #fff}.rc-lane:last-child{border-bottom:0}
.rc-lane.you{background:rgba(255,216,77,.35)}
.rc-name{position:absolute;left:8px;top:4px;font:800 12px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24;background:rgba(255,255,255,.8);border-radius:8px;padding:1px 6px;z-index:2;max-width:60%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rc-run{position:absolute;left:4px;bottom:4px;width:64px;height:64px;will-change:transform}
.rc-run img{width:64px;height:64px;object-fit:contain;animation:rchop .35s ease-in-out infinite alternate}
.rc-kid{font-size:48px;line-height:64px;display:inline-block;animation:rchop .3s ease-in-out infinite alternate}
.rc-mode{position:absolute;right:-6px;top:-4px;font-style:normal;font-size:18px}
.rc-fin{position:absolute;right:4px;top:50%;transform:translateY(-50%);font-size:26px}
.rc-place{position:absolute;right:36px;top:4px;font-size:22px}
.rc-count{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font:700 72px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#2E6B4F;-webkit-text-stroke:3px #1E2A24;background:rgba(255,255,255,.35);z-index:5}
@keyframes rchop{from{transform:translateY(0)}to{transform:translateY(-6px)}}
.rc-kid{transform:none}
.rc-win{background:#FFF1C2}.rc-bigkid{font-size:80px;line-height:1}
.rc-list{list-style:none;padding:0;margin:14px 0;display:grid;gap:8px}
.rc-list li{display:flex;gap:10px;align-items:center;background:#fff;border:2px solid #DCD2F2;border-radius:14px;padding:8px 10px}
.rc-list li.you{background:#FFF6D5}
.rc-list img{width:52px;height:52px;object-fit:contain;flex:none}.rc-list .rc-kid{font-size:40px;line-height:52px;animation:none;width:52px;text-align:center;flex:none}
.rc-list b{display:block;font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}.rc-list span{font-size:13px;font-weight:700;color:#5A6159}.rc-list em{display:block;font-style:normal;font-weight:800;font-size:13px;color:#1F5139}
.rc-medal{font-size:26px;width:30px;text-align:center;flex:none;color:#1E2A24!important}
@media (prefers-reduced-motion:reduce){.rc-run img,.rc-kid{animation:none}}
.qz-rcbox{background:linear-gradient(160deg,#D9F2C4,#FFF4C7)}.qz-rcbox .qz-btgo{background:#5CC27A}

/* Oskar 8 Oct: phones in dark mode had light text on these light boxes. Inside them, use the light-mode ink. */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) :is(.chip.meat,.chip.plant,.chip.fish,.chip.mix,.era.t,.era.j,.era.k,.tlbar .t,.tlbar .j,.tlbar .k,.scene .kicker,.bubble,.dcard .pic,.photo,.q:nth-child(4n+1),.q:nth-child(4n+2),.q:nth-child(4n+3),.q:nth-child(4n+4),.fact:nth-child(4n+1),.fact:nth-child(4n+2),.fact:nth-child(4n+3),.fact:nth-child(4n+4),.qz-dlg,.qz-x,.qz-bar,.qz-opts button,.qz-opts button:nth-child(2),.qz-opts button:nth-child(3),.pm-b,#pm-friend,.tipjar,.tipmini,.tipfloat,.scene .search input,#dwm-btn,#dwm,#dwm .dwm-x,#dwm .dwm-links>a:hover,#dwm .dwm-groups summary:hover,#dwm .dwm-sub:hover,.dcard .chip,.dcard .chip.meat,.dcard .chip.plant,.dcard .chip.fish,.dcard .chip.mix,.dcard .chip.cousin,.tlbar .p,.langlist,.langlist a:hover,.langlist a[aria-current],.kidmath span,.kidmath span:nth-child(2),.kidmath span:nth-child(3),.cmpme,.cmpme input,.cm-units button,.askrex,.askrex input,.ar-a,.fab-feed,.fab-ask,.fab-ic,.langlist details.llgroup>summary:hover,.langlist details.llgroup[open]>summary,.qz-list,.qz-good,.qz-bad,.qz-list li,.qz-list li .e,.tp-lt,.tp-lt-pics svg,.tp-card .tp-pic,.tp-ex,.tp-ex .tp-pic,.results,.cm-pre button,.cm-pre button:hover,.cm-len,.cm-grid,.cm-card-pic,#pm-top .qz-own,.qz-tinyb,.bt-modes button,.bt-slot,.bt-red .bt-slot,.bt-blue .bt-slot,.bt-it,.bt-win,.bt-win.t0,.bt-win.t1,.bt-why li,.qz-tinybox,.qz-tinygo,.qz-btbox,.rc-track,.rc-win,.rc-list li,.rc-list li.you,.qz-rcbox){--ink:#1E2A24;--muted:#5A6159;color:#1E2A24}}
:root[data-theme="dark"] :is(.chip.meat,.chip.plant,.chip.fish,.chip.mix,.era.t,.era.j,.era.k,.tlbar .t,.tlbar .j,.tlbar .k,.scene .kicker,.bubble,.dcard .pic,.photo,.q:nth-child(4n+1),.q:nth-child(4n+2),.q:nth-child(4n+3),.q:nth-child(4n+4),.fact:nth-child(4n+1),.fact:nth-child(4n+2),.fact:nth-child(4n+3),.fact:nth-child(4n+4),.qz-dlg,.qz-x,.qz-bar,.qz-opts button,.qz-opts button:nth-child(2),.qz-opts button:nth-child(3),.pm-b,#pm-friend,.tipjar,.tipmini,.tipfloat,.scene .search input,#dwm-btn,#dwm,#dwm .dwm-x,#dwm .dwm-links>a:hover,#dwm .dwm-groups summary:hover,#dwm .dwm-sub:hover,.dcard .chip,.dcard .chip.meat,.dcard .chip.plant,.dcard .chip.fish,.dcard .chip.mix,.dcard .chip.cousin,.tlbar .p,.langlist,.langlist a:hover,.langlist a[aria-current],.kidmath span,.kidmath span:nth-child(2),.kidmath span:nth-child(3),.cmpme,.cmpme input,.cm-units button,.askrex,.askrex input,.ar-a,.fab-feed,.fab-ask,.fab-ic,.langlist details.llgroup>summary:hover,.langlist details.llgroup[open]>summary,.qz-list,.qz-good,.qz-bad,.qz-list li,.qz-list li .e,.tp-lt,.tp-lt-pics svg,.tp-card .tp-pic,.tp-ex,.tp-ex .tp-pic,.results,.cm-pre button,.cm-pre button:hover,.cm-len,.cm-grid,.cm-card-pic,#pm-top .qz-own,.qz-tinyb,.bt-modes button,.bt-slot,.bt-red .bt-slot,.bt-blue .bt-slot,.bt-it,.bt-win,.bt-win.t0,.bt-win.t1,.bt-why li,.qz-tinybox,.qz-tinygo,.qz-btbox,.rc-track,.rc-win,.rc-list li,.rc-list li.you,.qz-rcbox){--ink:#1E2A24;--muted:#5A6159;color:#1E2A24}
.rc-list .rc-medal{font-size:26px;color:#1E2A24}
.rc-me{display:grid;gap:10px;margin-bottom:14px;padding:12px;border-radius:18px;background:#FFF6D5;color:#1E2A24;border:1px solid var(--line)}
.rc-sex{display:flex;gap:8px}.rc-sex button{flex:1;font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:10px;border-radius:999px;border:1px solid var(--line);background:#fff;color:#1E2A24;cursor:pointer}.rc-sex button.on{background:#1E2A24;color:#fff}
.rc-me label{font-weight:800;display:flex;flex-wrap:wrap;align-items:center;gap:8px}.rc-me select{font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:6px 10px;border-radius:10px;border:1px solid var(--line);background:#fff;color:#1E2A24}
.rc-sp input{width:100%;accent-color:#2E6B4F}.rc-me small{font-weight:700;color:#5A6159}
/* race lanes by kind (Oskar 8 Oct): land green, flyers cloudy sky, swimmers deep water; YOU stays yellow */
.rc-track{background:#C9E7B5}
.rc-lane.land{background:repeating-linear-gradient(90deg,#BFE3A6 0 40px,#B2DB97 40px 80px)}
.rc-lane.air{background:radial-gradient(ellipse 60px 18px at 20% 35%,rgba(255,255,255,.9),transparent 70%),radial-gradient(ellipse 80px 20px at 70% 60%,rgba(255,255,255,.85),transparent 70%),linear-gradient(180deg,#CFEAFF,#EEF8FF)}
.rc-lane.sea{background:radial-gradient(circle at 15% 70%,rgba(255,255,255,.35) 0 3px,transparent 4px),radial-gradient(circle at 55% 30%,rgba(255,255,255,.3) 0 4px,transparent 5px),linear-gradient(180deg,rgba(64,140,214,.75),rgba(22,82,160,.9))}
.rc-lane.sea .rc-name{background:rgba(255,255,255,.9)}
.dw-confetti{position:fixed;inset:0;pointer-events:none;z-index:10050;overflow:hidden}
.dw-confetti i{position:absolute;top:-24px;display:block;border-radius:2px;animation:dwconf linear forwards}
@keyframes dwconf{0%{transform:translate(0,0) rotate(0)}100%{transform:translate(var(--dx),110vh) rotate(var(--r))}}
.rc-myspeed{font:800 17px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24}
.rc-with{font:800 18px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}.rc-with input{width:24px;height:24px;accent-color:#2E6B4F}
.rc-me.off .rc-sex,.rc-me.off label:not(.rc-with),.rc-me.off .rc-myspeed{display:none}
/* Oskar 8 Oct: only Feed Rex left, smaller so it covers less */
.fab-feed{transform:scale(.82);transform-origin:right bottom}
/* UX pass (Oskar 8 Oct): one segmented switch style for battle modes and boy/girl, compact YOU row in the race */
.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;background:#fff;box-shadow:0 1px 3px rgba(20,30,25,.14)}
.seg button,.bt-modes .seg button{border:0;border-radius:0;background:transparent;padding:9px 14px;font:800 15px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24;cursor:pointer;white-space:nowrap}
.seg button+button{border-left:1px solid var(--line)}
.seg button.on,.bt-modes .seg button.on{background:#1E2A24;color:#fff}
#rc-mebox{margin-bottom:10px}
.rc-mecard{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:10px 12px;border-radius:18px;border:1px solid var(--line);background:#FFF6D5;color:#1E2A24}
.rc-age{display:inline-flex;align-items:center;gap:6px}.rc-age b{font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;min-width:44px;text-align:center}
.rc-age button{width:32px;height:32px;border-radius:50%;border:1px solid var(--line);background:#fff;color:#1E2A24;font:800 18px/1 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;cursor:pointer}
.rc-mekmh{margin-left:auto;font:800 14px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#5A6159}
.rc-mex{border:0;background:none;color:#1E2A24;font:700 24px/1 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;cursor:pointer;padding:0 4px}
.rc-meoff{width:100%;padding:12px;border-radius:18px;border:2.5px dashed #1E2A24;background:transparent;color:inherit;font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;cursor:pointer}
.rc-mecard .seg button{font-size:22px;padding:4px 14px;line-height:1.2}.rc-mecard{flex-wrap:nowrap;gap:8px}
.rc-mecard .seg{flex:none}.rc-mecard .seg button{padding:4px 10px}.rc-mekmh{white-space:nowrap;font-size:13px}.rc-age{flex:none;gap:4px}.rc-age button{width:28px;height:28px;font-size:16px}.rc-age b{min-width:38px}
.pro-cta{margin:14px 0 0;padding:12px 14px;border-radius:16px;border:2.5px dashed #1E2A24;background:#FFF6D5;color:#1E2A24;font-weight:800;text-align:center}.pro-cta a{display:inline-block;margin-top:6px;background:#2E6B4F;color:#fff;border:1px solid var(--line);border-radius:999px;padding:6px 16px;text-decoration:none}
.pro-cta.web-free{border-style:solid;background:#E6F6DC}
/* sticker album (Oskar 8 Oct) */
.al-book{font-size:56px;line-height:1}.al-count{font:800 20px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;margin:6px 0}
.al-bar{height:16px;border:1px solid var(--line);border-radius:9px;background:#fff;overflow:hidden;margin:6px 0 10px}.al-bar i{display:block;height:100%;background:linear-gradient(90deg,#F2C14E,#2E6B4F)}
.al-chips{display:flex;gap:6px;overflow-x:auto;padding:2px 2px 10px;scrollbar-width:thin}
.al-chips button{flex:none;font:800 13px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:7px 12px;border-radius:999px;border:1px solid var(--line);background:#fff;color:#1E2A24;cursor:pointer;white-space:nowrap}
.al-chips button.on{background:#1E2A24;color:#fff}
.al-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:8px}
.al-st{display:flex;flex-direction:column;align-items:center;gap:2px;padding:8px 4px;border-radius:16px;border:2px dashed #B9CFC4;background:#F3F8F5;color:#6B8579;font:800 12px/1.15 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;text-align:center;text-decoration:none;position:relative}
.al-st img{width:72px;height:72px;object-fit:contain;filter:brightness(0) opacity(.18)}
.al-st.got{border:1px solid var(--line);background:#FFF6D5;color:#1E2A24;box-shadow:0 1px 3px rgba(20,30,25,.14)}.al-st.got img{filter:none}
.al-st.lock img{filter:brightness(0) opacity(.35)}.al-st.lock::after{content:"\1F512";position:absolute;top:4px;right:6px;font-size:14px}
.al-empty{text-align:center;font-weight:800;padding:14px}
.dw-stk{position:fixed;left:50%;bottom:22px;transform:translateX(-50%);z-index:10060;background:#F2C14E;color:#1E2A24;border:1px solid var(--line);border-radius:999px;padding:10px 18px;font:800 16px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;box-shadow:0 1px 3px rgba(20,30,25,.14);text-decoration:none;animation:dwstk 3.2s ease forwards}
@keyframes dwstk{0%{opacity:0;transform:translate(-50%,30px)}10%,80%{opacity:1;transform:translate(-50%,0)}100%{opacity:0;transform:translate(-50%,10px)}}
.qz-albox{background:linear-gradient(160deg,#FFF1C2,#FFD9E8)}.qz-albox .qz-btgo{background:#8DA88F}

/* Oskar 8 Oct: race hero had too much empty space -> dinos run to the flag */
.rc-hero{text-align:center}.rc-flag{display:none}
.rc-herorun{position:relative;height:84px;max-width:520px;margin:0 auto 8px;overflow:hidden;border-bottom:4px dashed #cfe6d9}
.rc-herorun .fl{position:absolute;right:2px;bottom:0;font-size:46px;line-height:1;z-index:2}
.rc-herorun img{position:absolute;bottom:2px;left:-80px;width:60px;height:60px;animation:rchero 5s linear infinite,rcbob .3s ease-in-out infinite alternate}
.rc-herorun img:nth-of-type(2){width:42px;height:42px;animation-duration:3.8s,.22s;animation-delay:-1.4s,0s}
.rc-herorun img:nth-of-type(3){width:76px;height:76px;animation-duration:6.5s,.4s;animation-delay:-3.6s,0s}
@keyframes rchero{to{left:100%}}@keyframes rcbob{to{transform:translateY(-6px)}}
@media (prefers-reduced-motion:reduce){.rc-herorun img{animation:none}.rc-herorun img:nth-of-type(1){left:12%}.rc-herorun img:nth-of-type(2){left:40%}.rc-herorun img:nth-of-type(3){left:58%}}

/* Oskar 8 Oct v2: race hero = mini track (sky / land / sea, same colours as the race), dinos run to the finish line */
.rc-herorun{height:auto;max-width:560px;border:1px solid var(--line);border-radius:18px;margin:0 auto 14px;box-shadow:0 1px 3px rgba(20,30,25,.14)}
.rc-herorun .ln{position:relative;height:50px;overflow:hidden;border-bottom:2px dashed rgba(255,255,255,.8)}.rc-herorun .ln.sea{border-bottom:0}
.rc-herorun .ln.air{background:radial-gradient(ellipse 50px 12px at 25% 40%,rgba(255,255,255,.95),transparent 70%),radial-gradient(ellipse 60px 14px at 75% 65%,rgba(255,255,255,.9),transparent 70%),linear-gradient(180deg,#CFEAFF,#EEF8FF)}
.rc-herorun .ln.land{background:repeating-linear-gradient(90deg,#BFE3A6 0 30px,#B2DB97 30px 60px)}
.rc-herorun .ln.sea{background:radial-gradient(circle at 20% 70%,rgba(255,255,255,.4) 0 3px,transparent 4px),radial-gradient(circle at 60% 30%,rgba(255,255,255,.35) 0 3px,transparent 4px),linear-gradient(180deg,rgba(64,140,214,.75),rgba(22,82,160,.9))}
.rc-herorun .fin{position:absolute;right:26px;top:0;bottom:0;width:14px;background:repeating-conic-gradient(#1E2A24 0 25%,#fff 0 50%) 0 0/14px 14px;z-index:3;opacity:.9}
.rc-herorun img{width:44px;height:44px;bottom:3px;animation:rchero 4.6s linear infinite,rcbob .28s ease-in-out infinite alternate}
.rc-herorun img.big{width:50px;height:50px;animation-duration:5.4s,.36s;animation-delay:-2.2s,0s}
.rc-herorun .air img{bottom:4px;animation:rchero 5s linear infinite,rcfly 1.2s ease-in-out infinite alternate;animation-delay:-1s,0s}
.rc-herorun .sea img{bottom:2px;animation:rchero 6s linear infinite,rcswim 1.6s ease-in-out infinite alternate;animation-delay:-3.5s,0s}
.rc-herorun img:nth-of-type(2),.rc-herorun img:nth-of-type(3){width:50px;height:50px}
@keyframes rcfly{from{transform:translateY(-4px) rotate(-4deg)}to{transform:translateY(4px) rotate(4deg)}}
@keyframes rcswim{from{transform:translateY(2px) rotate(3deg)}to{transform:translateY(-3px) rotate(-3deg)}}
@media (prefers-reduced-motion:reduce){.rc-herorun img{animation:none!important;left:30%}.rc-herorun img.big{left:55%}}
/* quiz hero: centred, the dino faces do a wave */
.qz-main{text-align:center}.qz-main .qz-faces{justify-content:center}
.qz-main .qz-faces img{animation:qzwave 2.6s ease-in-out infinite}
.qz-main .qz-faces img:nth-child(2){animation-delay:.12s}.qz-main .qz-faces img:nth-child(3){animation-delay:.24s}.qz-main .qz-faces img:nth-child(4){animation-delay:.36s}
.qz-main .qz-faces img:nth-child(5){animation-delay:.48s}.qz-main .qz-faces img:nth-child(6){animation-delay:.6s}.qz-main .qz-faces img:nth-child(7){animation-delay:.72s}.qz-main .qz-faces img:nth-child(8){animation-delay:.84s}
@keyframes qzwave{0%,45%,100%{translate:0 0}22%{translate:0 -14px}}
.qz-main .qz-go{animation:qzpulse 2.6s ease-in-out infinite}@keyframes qzpulse{0%,70%,100%{scale:1}80%{scale:1.07}}
/* battle: the two dinos head-butt, VS pops (hero + quiz-page block) */
.bt-faces img,.qz-btbox:not(.qz-rcbox):not(.qz-albox) .qz-btimgs img{animation:btl 2.2s ease-in-out infinite}
.bt-faces img:last-child,.qz-btbox:not(.qz-rcbox):not(.qz-albox) .qz-btimgs img:last-of-type{animation-name:btr}
@keyframes btl{0%,50%,100%{translate:0 0;rotate:0deg}68%{translate:-6px 0;rotate:-6deg}78%{translate:16px 0;rotate:10deg}88%{translate:0 0;rotate:0deg}}
@keyframes btr{0%,50%,100%{translate:0 0;rotate:0deg}68%{translate:6px 0;rotate:6deg}78%{translate:-16px 0;rotate:-10deg}88%{translate:0 0;rotate:0deg}}
.bt-vs,.qz-btbox:not(.qz-rcbox) .qz-btimgs b{display:inline-block;animation:btvs 2.2s ease-in-out infinite}
@keyframes btvs{0%,70%,100%{scale:1;rotate:0deg}80%{scale:1.45;rotate:-10deg}90%{scale:1;rotate:0deg}}
/* race block: dinos run on the spot, flag waves; album: book wiggles */
.qz-rcbox .qz-btimgs img{animation:rcbob2 .3s ease-in-out infinite alternate}.qz-rcbox .qz-btimgs img:last-of-type{animation-delay:.15s}
@keyframes rcbob2{to{translate:0 -6px}}
.qz-rcbox .qz-btimgs span{display:inline-block;transform-origin:10% 90%;animation:rcflag 1.2s ease-in-out infinite alternate}@keyframes rcflag{from{rotate:-8deg}to{rotate:8deg}}
.qz-albox .qz-btimgs span{display:inline-block;animation:alwig 3s ease-in-out infinite}@keyframes alwig{0%,80%,100%{rotate:0deg}85%{rotate:-8deg}90%{rotate:8deg}95%{rotate:-4deg}}
@media (prefers-reduced-motion:reduce){.qz-main .qz-faces img,.qz-main .qz-go,.bt-faces img,.bt-vs,.qz-btimgs img,.qz-btimgs b,.qz-btimgs span{animation:none!important}}

/* Oskar 8 Oct: dino picture quiz (ages 3-6) block + rounds; age badges */
.qz-age{display:inline-block;font:700 14px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;background:#1E2A24;color:#fff;border-radius:999px;padding:3px 14px;margin:10px 0 2px}
.qz-dinobox{background:linear-gradient(135deg,#DDF4CF 0%,#FFF3C4 55%,#D6ECFF 100%)}.qz-dinobox h2{color:#2E9B5F}
.qz-tinyem img{display:inline-block;width:clamp(46px,11vw,60px);height:auto;animation:qzhop 2.4s ease-in-out infinite}
.qz-tinyem img:nth-child(2){animation-delay:.2s}.qz-tinyem img:nth-child(3){animation-delay:.4s}.qz-tinyem img:nth-child(4){animation-delay:.6s}.qz-tinyem img:nth-child(5){animation-delay:.8s}
.qz-dinobox .qz-tinygo{background:#7FD8A6}
.qz-opts.qz-pics button.dn{flex-direction:column;gap:4px;padding:8px}
.qz-pics button.dn img{width:86%;max-width:220px;height:auto;aspect-ratio:1/1;object-fit:contain}
.qz-pics button.dn small{font:700 13px/1.1 system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;color:#1E2A24;opacity:.75;word-break:break-word}
@media (prefers-reduced-motion:reduce){.qz-tinyem img{animation:none}}

/* Oskar 8 Oct: battle + race box had no gap between the border and the text */
.bt-arena{padding:clamp(16px,3.5vw,30px)}

/* Oskar 8 Oct: Fun tab uses our own T. rex sticker instead of the confetti emoji */
.nav a.nav-fun{display:inline-flex;align-items:center;gap:4px}.nav-fun img{width:26px;height:26px;margin:-4px 0;transition:transform .2s}.nav-fun:hover img{transform:none scale(1.15)}
/* Oskar 8 Oct: badges + daily surprise stickers */
.dw-stk.badge{background:#B9A6FF}
.al-badges{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin:14px 0 6px}
.al-bdg{font:700 15px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif;padding:6px 12px;border-radius:999px;border:2px dashed #9DB7AC;color:#7C918A;background:#F3F7F5;filter:grayscale(1)}
.al-bdg.on{border:1px solid var(--line);background:#D9FF5C;color:#1E2A24;filter:none;box-shadow:0 1px 3px rgba(20,30,25,.14)}
.al-surp{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 14px;margin:12px 0 4px}
.al-surp span{font:800 15px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
.al-hero{text-align:center}
/* Oskar 8 Oct: dark mode (iPad) - the chosen "2 vs 2" button was dark green on the dark page and vanished */
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]) .seg{background:#fff;border-color:#fff}:root:not([data-theme="light"]) .seg button.on,:root:not([data-theme="light"]) .bt-modes .seg button.on{background:#2E6B4F;color:#fff}}
:root[data-theme="dark"] .seg{background:#fff;border-color:#fff}:root[data-theme="dark"] .seg button.on,:root[data-theme="dark"] .bt-modes .seg button.on{background:#2E6B4F;color:#fff}

/* dino badges: sticker that grows; locked = grey shadow */
.al-bdg{display:inline-flex;align-items:center;gap:4px;padding:4px 12px 4px 6px}.al-bdg img{width:30px;height:30px;filter:grayscale(1) brightness(1.3);opacity:.45}
.al-bdg.on img{filter:none;opacity:1}

/* results: tap a dino to open its page */
a.bt-win{display:block;color:inherit;text-decoration:none;cursor:pointer}a.bt-win:hover{transform:translateY(-2px)}
a.dl{color:inherit;text-decoration:none}a.dl b{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}
.bt-wimgs a.dl img,.rc-list a.dl img{transition:transform .15s}.bt-wimgs a.dl:hover img,.rc-list a.dl:hover img{transform:scale(1.1) rotate(-4deg)}

/* dino picture quiz on phones: the two dinos stacked and big (Oskar 8 Oct: half the screen was empty) */
@media (max-width:640px){.qz-opts.qz-pics.qz-dino{grid-template-columns:1fr;gap:16px}
.qz-opts.qz-pics.qz-dino button.dn{aspect-ratio:auto;max-height:none;padding:10px}
.qz-pics.qz-dino button.dn img{width:auto;height:min(28vh,250px);max-width:92%}.qz-pics.qz-dino button.dn small{font-size:16px}}

/* Venom Wiki additions */
.dz{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:13px}
.dz-dots{display:inline-flex;gap:3px}.dz-dots i{width:10px;height:10px;border-radius:50%;border:1px solid var(--line);background:var(--card)}
.dz.d1 .dz-dots i.on{background:#7BD389}.dz.d2 .dz-dots i.on{background:#F2C14E}.dz.d3 .dz-dots i.on{background:#FFC93C}.dz.d4 .dz-dots i.on{background:#FF8A3D}.dz.d5 .dz-dots i.on{background:#E0336B}
.dc .dz{display:flex;justify-content:center;margin-top:4px}
.dz.big{display:grid;grid-template-columns:auto 1fr;column-gap:10px;align-items:center;margin:12px 0 6px;padding:10px 14px;border:1px solid var(--line);border-radius:14px;background:var(--card);box-shadow:var(--shadow);text-decoration:none;color:var(--ink)}
.dz.big .dz-dots i{width:16px;height:16px}.dz.big b{font:700 18px system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}.dz.big small{grid-column:1/-1;color:var(--muted);font-weight:700;margin-top:4px}
.dz.big.d5{background:#FFE0EC}.dz.big.d4{background:#FFE6D6}
.chip.how{background:#E6DCFB;color:#1E2A24}
.conts{display:flex;flex-wrap:wrap;gap:8px}
.cont{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;border-radius:14px;border:1px solid var(--line);text-decoration:none;font-weight:800;opacity:.35;background:var(--card)}
.cont span{font-size:22px}.cont.on{opacity:1;background:#F2C14E;color:#1E2A24;box-shadow:0 1px 3px rgba(20,30,25,.14)}
.vhow{display:flex;gap:14px;align-items:flex-start;padding:12px 14px;border:2.5px dashed var(--line);border-radius:14px;margin-bottom:6px}
.vhow .vh-em{font-size:38px;line-height:1}.vhow p{margin:2px 0 0}
.venom p{max-width:760px}.av{font-weight:800;background:#E3F9C2;color:#1E2A24;border-radius:12px;padding:8px 12px;display:inline-block}
.safe{margin-top:18px;padding:14px 18px;background:#FFF6D8;color:#1E2A24}.safe h3{margin:0 0 6px}.safe ul{margin:0;padding-left:20px}.safe li{margin:4px 0;font-weight:700}.safe .fine{color:#4A524A}
.dzlist{display:grid;gap:10px;margin:12px 0}.dzrow{display:flex;gap:12px;align-items:flex-start}.dzrow p{margin:2px 0 0}
.safety ol li{margin:8px 0}
.tp-emo{font-size:44px;display:block;text-align:center;margin:4px 0}.tp-emo.big{font-size:72px;margin:0 10px}
.tp-v .dz{margin-right:4px}
.ident ul{margin:0 0 8px;padding-left:22px}.ident li{margin:5px 0;font-weight:700}
.fa{margin-top:16px;padding:14px 18px;border:1px solid var(--line);border-radius:14px;background:#FFE0EC;color:#1E2A24}.fa h3{margin:0 0 6px}.fa p{margin:6px 0}
.fa ul{margin:4px 0;padding-left:20px}.fa li{margin:5px 0;font-weight:700}

/* field-guide look (Oskar 9 Oct: not Halloween) */
body{font-family:system-ui,-apple-system,'Segoe UI',Roboto,Helvetica,Arial,sans-serif}
.scene{background:var(--bg)!important;color:var(--ink)!important;border-bottom:1px solid var(--line)!important}
.scene .stars,.scene .moon,.scene .ferns,.ground:before,.bubble,.prints{display:none!important}
.scene .hero h1,.scene .hero h1 em{color:var(--ink)!important;font-size:clamp(34px,6vw,60px)!important;font-weight:800;letter-spacing:-.5px}
.scene .hero h1 em{color:#B3261E!important;font-style:normal}
.scene .lead,.scene p{color:var(--ink)}
.scene .stats .stat{background:var(--card)!important;border-color:var(--line)!important;color:var(--ink)!important}
.scene .stats .stat b{color:var(--jungle)!important}.scene .stats .stat span{color:var(--muted)!important}
.scene .kicker,.kicker{background:#E9E3D3;color:var(--ink);border-color:var(--line);font-weight:700;letter-spacing:.3px}
h1,h2,h3,.f{font-weight:800;letter-spacing:-.2px}
.tile{background:var(--card)!important;border-left:6px solid var(--c,var(--line))!important}
.dcard{background:var(--card)!important;border-top:8px solid var(--c,var(--jungle))!important}
.dcard h1{color:var(--ink)!important}
.photo{transform:none!important}
.quizband{background:var(--jungle)}
.btn{border-radius:10px}
.card{border-radius:12px}
