/* ===== SwampRealms: Evolution: mobile game shell =====
   Loaded after styles.css and ui.css. Scoped to body.evo-app / #evo / .evo-*.
   Layout (portrait): [HUD floating on the swamp] / swamp / bottom sheet with the active panel / app tab bar.
   Desktop shows the same phone-shaped game centred on a dark backdrop. Landscape and full screen on wide screens put the swamp left and the sheet right. */
body.evo-app{background:#030706;overscroll-behavior:none}
body.evo-app::before{background:radial-gradient(700px 420px at 50% -80px,#0f3a2f 0,transparent 70%),
 repeating-linear-gradient(90deg,#4ee6b406 0 1px,transparent 1px 46px),repeating-linear-gradient(0deg,#4ee6b406 0 1px,transparent 1px 46px)}
body.evo-app .tabbar,body.evo-app .betabadge{display:none}
@media(max-width:639px){body.evo-app{padding-bottom:0}}
body.evo-app footer{margin-top:28px}
#evo{display:block;max-width:none;padding:0;margin:0;text-align:left}
/* ---- the game frame ---- */
.evo-stage{--avail:calc(100dvh - var(--evo-top,64px) - 28px);position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;width:min(100%,460px);height:var(--avail);min-height:540px;margin:14px auto 0;
 overflow:hidden;border-radius:26px;background:#04090a;border:1px solid #4ee6b440;box-shadow:0 0 0 1px #000,0 0 60px -14px var(--mint),0 30px 70px -20px #000;text-align:left;isolation:isolate}
@media(min-width:521px){.evo-stage{width:min(100%,460px,calc(var(--avail) * .553))}}
@media(max-width:520px){.evo-stage{--avail:calc(100dvh - var(--evo-top,64px));width:100%;margin:0;border-radius:0;border-width:1px 0 0}}
.evo-stage button{font-family:inherit}
/* ---- swamp ---- */
.evo-scene{position:relative;width:min(100%,calc(var(--avail) * .47 * 1.1765));aspect-ratio:400/340;justify-self:center;overflow:hidden;background:#06100d;touch-action:manipulation;-webkit-user-select:none;user-select:none}
.evo-scene::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:repeating-linear-gradient(0deg,#0000 0 2px,#0000001c 2px 3px),radial-gradient(ellipse at 50% 45%,transparent 55%,#000c 100%),linear-gradient(180deg,transparent 90%,#04090acc 100%)}
.evo-art,.evo-art svg{position:absolute;inset:0;width:100%;height:100%;display:block;z-index:1}
.evo-hot{position:absolute;z-index:3;padding:0;border:0;background:none;cursor:pointer;border-radius:50%;-webkit-tap-highlight-color:transparent}
.evo-hot:focus-visible,.evo-cr:focus-visible,.evo-ibtn:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
/* tap spots: percent of the 400x340 picture */
.evo-hq{left:3%;top:37%;width:30%;height:35%}
.evo-p1{left:51%;top:51%;width:23%;height:23%}
.evo-p2{left:77%;top:53%;width:20%;height:21%}
.evo-hot.can::after{content:attr(data-tip);position:absolute;left:50%;top:-6px;transform:translateX(-50%);padding:2px 9px;border-radius:999px;background:var(--gold);color:#1a1405;font:900 11px Nunito,sans-serif;letter-spacing:.06em;text-transform:uppercase;box-shadow:0 0 14px -2px var(--gold);animation:evoBob 1.2s ease-in-out infinite}
.evo-hot.flash{animation:evoFlash .7s ease-out}
.evo-crs{position:absolute;inset:0;z-index:4;pointer-events:none}
.evo-cr{position:absolute;pointer-events:auto;padding:0;border:0;background:none;cursor:pointer;display:grid;justify-items:center;-webkit-tap-highlight-color:transparent}
.evo-cr-art{display:block;width:100%;filter:drop-shadow(0 4px 6px #000a) drop-shadow(0 0 7px var(--aura,transparent));transform-origin:50% 90%;animation:evoIdle 3.2s ease-in-out infinite}
.evo-cr-art svg{display:block;width:100%;height:auto}
.evo-cr-tip{white-space:nowrap;margin-top:-4px;padding:1px 8px;border-radius:999px;background:#04110ccc;border:1px solid var(--mint-line);color:var(--mint-soft);font:900 10px Nunito,sans-serif;letter-spacing:.08em;text-transform:uppercase;pointer-events:none}
.evo-cr.hop .evo-cr-art{animation:evoHop .35s var(--ease-spring)}
.evo-cr:active .evo-cr-art{transform:scale(.92)}
/* HUD floating on the swamp */
.evo-hud{position:absolute;z-index:8;left:10px;right:10px;top:max(10px,env(safe-area-inset-top,0px));display:flex;align-items:flex-start;justify-content:space-between;gap:10px;pointer-events:none}
.evo-hud>*{pointer-events:auto}
.evo-res{position:relative;display:grid;grid-template-columns:auto 1fr;align-items:center;gap:0 10px;padding:6px 14px 7px 7px;border-radius:18px;background:linear-gradient(160deg,#07120fe6,#030806d9);border:1px solid #4ee6b455;box-shadow:0 0 22px -8px var(--mint),inset 0 0 18px -10px var(--mint);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
.evo-orb{grid-row:1/3;flex:none;width:44px;height:44px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0,#b9ffe9 22%,#4ee6b4 55%,#0e6b52 100%);box-shadow:0 0 20px -2px #4ee6b4,0 0 0 2px #04110c inset;animation:evoOrb 3s ease-in-out infinite}
.evo-orb.sm{width:14px;height:14px;box-shadow:0 0 8px -1px #4ee6b4;vertical-align:-2px;margin-right:5px;animation:none}
.evo-count{position:relative;display:grid;line-height:1.05}
#evoEss{display:inline-block;transform-origin:0 60%}
.evo-count small{font:900 9.5px Nunito,sans-serif;letter-spacing:.16em;text-transform:uppercase;color:#9fe9d2b3}
.evo-count b{font:900 28px/1.05 Nunito,sans-serif;color:#eafff8;text-shadow:0 0 16px #4ee6b4cc;font-variant-numeric:tabular-nums}
.evo-chips{display:flex;gap:6px;margin-top:3px}
.evo-rate,.evo-mult{padding:1px 8px;border-radius:999px;font:900 11px Nunito,sans-serif;font-variant-numeric:tabular-nums;white-space:nowrap}
.evo-rate{background:#4ee6b41f;border:1px solid #4ee6b455;color:var(--mint)}
.evo-rate.off{color:var(--muted);opacity:.7}
.evo-mult{background:#f2c14e1a;border:1px solid #f2c14e55;color:var(--gold)}
.evo-ibtns{display:grid;gap:8px}
.evo-ibtn{display:grid;place-items:center;width:42px;height:42px;padding:0;border-radius:14px;background:linear-gradient(160deg,#07120fe6,#030806d9);border:1px solid #4ee6b455;color:var(--mint-soft);cursor:pointer;text-decoration:none;box-shadow:0 0 18px -8px var(--mint);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);-webkit-tap-highlight-color:transparent;transition:transform .15s,box-shadow .2s}
.evo-ibtn:active{transform:scale(.92)}
.evo-ibtn svg{width:20px;height:20px}
#evoStage:not(.fs) #fsb .ex,#evoStage.fs #fsb .en{display:none}
/* feedback */
.evo-float{position:absolute;z-index:6;pointer-events:none;transform:translate(-50%,0);font:900 18px/1 Nunito,sans-serif;font-style:normal;text-shadow:0 2px 6px #000,0 0 10px currentColor;animation:evoRise 1.1s ease-out forwards}
.evo-float.gold{color:#ffd978}
.evo-float.mint{color:#9ff5d6;font-size:13px;opacity:.9}
.evo-spark{position:absolute;z-index:6;width:8px;height:8px;margin:-4px;border-radius:50%;background:#ffe9a0;box-shadow:0 0 10px 2px #f2c14e;pointer-events:none;animation:evoSpark .85s ease-out forwards}
.evo-toast{position:absolute;left:50%;bottom:22px;z-index:9;max-width:90%;transform:translate(-50%,12px);padding:8px 16px;border-radius:12px;background:#04110cf2;border:1px solid #4ee6b455;color:var(--mint-soft);font:800 13px/1.3 Nunito,sans-serif;text-align:center;opacity:0;pointer-events:none;transition:opacity .25s,transform .25s;box-shadow:0 0 22px -8px var(--mint)}
.evo-toast.show{opacity:1;transform:translate(-50%,0)}
.evo-toast.good{border-color:#f2c14e99;color:#ffe9a8;box-shadow:0 0 24px -6px var(--gold)}
.evo-dash{animation:evoDash 6s linear infinite}
.evo-shroom{animation:evoPulse 2.6s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.evo-fly{animation:evoFly 5s ease-in-out infinite}
.evo-mist{animation:evoMist 14s ease-in-out infinite alternate}
.evo-ring{animation:evoSpin 40s linear infinite;transform-box:fill-box;transform-origin:50% 50%}
.evo-egg.inc{animation:evoWob 2.2s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.evo-egg.ready{animation:evoPulse 1.2s ease-in-out infinite}
@keyframes evoRise{0%{opacity:0;margin-top:6px}15%{opacity:1}100%{opacity:0;margin-top:-52px}}
@keyframes evoSpark{0%{opacity:1;transform:translate(0,0) scale(1)}100%{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.3)}}
@keyframes evoHop{0%{transform:translateY(0) scale(1)}40%{transform:translateY(-10px) scale(1.08,.94)}100%{transform:translateY(0) scale(1)}}
@keyframes evoIdle{0%,100%{transform:scale(1,1)}50%{transform:scale(1.03,.97)}}
@keyframes evoFlash{0%{box-shadow:0 0 0 0 #f2c14ecc}100%{box-shadow:0 0 0 28px #f2c14e00}}
@keyframes evoBob{0%,100%{transform:translate(-50%,0)}50%{transform:translate(-50%,-4px)}}
@keyframes evoPulse{0%,100%{filter:brightness(1)}50%{filter:brightness(1.35)}}
@keyframes evoFly{0%,100%{transform:translate(0,0);opacity:.2}50%{transform:translate(10px,-12px);opacity:1}}
@keyframes evoMist{from{transform:translateX(-12px)}to{transform:translateX(24px)}}
@keyframes evoDash{to{stroke-dashoffset:-60}}
@keyframes evoSpin{to{transform:rotate(360deg)}}
@keyframes evoWob{0%,100%{transform:rotate(0)}25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}
@keyframes evoOrb{0%,100%{box-shadow:0 0 20px -2px #4ee6b4,0 0 0 2px #04110c inset}50%{box-shadow:0 0 30px 2px #4ee6b4,0 0 0 2px #04110c inset}}
/* ---- bottom sheet: the active panel ---- */
.evo-sheet{position:relative;z-index:5;min-height:0;display:grid;grid-template-rows:auto minmax(0,1fr);margin-top:-16px;border-radius:22px 22px 0 0;background:linear-gradient(180deg,#0b1814,#050b09 60%);border-top:1px solid #4ee6b466;box-shadow:0 -14px 30px -10px #000,0 -1px 22px -8px var(--mint)}
.evo-grip{justify-self:center;width:44px;height:4px;margin:8px 0 4px;border-radius:99px;background:#4ee6b44d}
.evo-pane{min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;display:grid;gap:10px;align-content:start;padding:6px 12px 16px;scrollbar-width:thin;scrollbar-color:#4ee6b455 transparent}
.evo-pane[hidden]{display:none}
/* cards: HUD style with neon corner brackets */
.evo-card{--c:#4ee6b4;position:relative;display:grid;grid-template-columns:auto 1fr;gap:8px 12px;align-items:center;padding:12px;border-radius:12px;background:linear-gradient(160deg,#0e1c17,#070d0b);border:1px solid #4ee6b426}
.evo-card::before{content:"";position:absolute;inset:-1px;border-radius:12px;pointer-events:none;background:
 linear-gradient(var(--c),var(--c)) 0 0/14px 2px,linear-gradient(var(--c),var(--c)) 0 0/2px 14px,linear-gradient(var(--c),var(--c)) 100% 0/14px 2px,linear-gradient(var(--c),var(--c)) 100% 0/2px 14px,
 linear-gradient(var(--c),var(--c)) 0 100%/14px 2px,linear-gradient(var(--c),var(--c)) 0 100%/2px 14px,linear-gradient(var(--c),var(--c)) 100% 100%/14px 2px,linear-gradient(var(--c),var(--c)) 100% 100%/2px 14px;background-repeat:no-repeat;opacity:.85}
.evo-card.locked{opacity:.7;border-style:dashed;--c:#6b8a7e}
.evo-card.empty{border-style:dashed;background:#4ee6b406;--c:#4ee6b480}
.evo-card.done{--c:#f2c14e;border-color:#f2c14e44;box-shadow:0 0 22px -12px var(--gold)}
.evo-card.done h3::after{content:"\2713";margin-left:8px;color:var(--gold)}
.evo-card:not(:has(.evo-ic,.evo-cav)){grid-template-columns:1fr}
.evo-info{min-width:0}
.evo-info h3{margin:0 0 3px;font:900 15px/1.2 Nunito,sans-serif;letter-spacing:.04em;text-transform:uppercase;color:var(--text)}
.evo-info h3 em{margin-left:6px;font:900 10px Nunito,sans-serif;font-style:normal;letter-spacing:.12em;color:var(--gold)}
.evo-info p{margin:0;font-size:13px;line-height:1.35;color:var(--muted)}
.evo-pips{display:flex;gap:4px;margin-top:6px}
.evo-pips i{width:22px;height:5px;border-radius:2px;background:#4ee6b422;box-shadow:inset 0 0 0 1px #4ee6b433}
.evo-pips i.on{background:linear-gradient(90deg,#1c9d7a,#4ee6b4);box-shadow:0 0 8px -1px var(--mint)}
.evo-card.done .evo-pips i.on{background:linear-gradient(90deg,#c18a17,#f2c14e);box-shadow:0 0 8px -1px var(--gold)}
.evo-act{grid-column:1/-1;display:grid;gap:6px}
.evo-stage .btn{width:100%;min-height:44px;padding:8px 14px;border-radius:12px;font-size:13.5px;letter-spacing:.08em;text-transform:uppercase}
.evo-stage .btn.ready{animation:evoReady 1.6s ease-in-out infinite}
@keyframes evoReady{0%,100%{box-shadow:0 0 26px -8px var(--gold)}50%{box-shadow:0 0 30px -2px var(--gold)}}
.evo-c{display:inline-block;margin-left:6px;padding-left:10px;border-left:1.5px solid #0004;font-variant-numeric:tabular-nums}
.evo-bar2{height:6px;border-radius:99px;background:#04110c;border:1px solid #4ee6b433;overflow:hidden}
.evo-bar2 i{display:block;height:100%;width:0;background:linear-gradient(90deg,#1c9d7a,#4ee6b4);box-shadow:0 0 10px var(--mint);transition:width .25s}
.evo-need{margin:0;font:800 11.5px Nunito,sans-serif;letter-spacing:.04em;color:var(--muted);text-align:center}
.evo-ic{width:46px;height:46px;border-radius:12px;background:#07110d center/60% no-repeat;border:1px solid #4ee6b440;box-shadow:inset 0 0 14px -8px var(--mint)}
.evo-ic.hq{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f2c14e' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M3 12l9-8 9 8'/%3E%3Cpath d='M5 11v9h14v-9'/%3E%3Cpath d='M10 20v-5h4v5'/%3E%3C/svg%3E")}
.evo-ic.patch{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234ee6b4' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M4 12a8 7 0 0116 0z'/%3E%3Cpath d='M12 12v8'/%3E%3C/svg%3E")}
.evo-ic.lock{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a9b8b0' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 018 0v3'/%3E%3C/svg%3E")}
.evo-ic.plot{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fd36a' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M12 20v-8'/%3E%3Cpath d='M12 12c-4 0-6-3-6-6 4 0 6 2 6 6zM12 14c4 0 6-3 6-6-4 0-6 2-6 6z'/%3E%3C/svg%3E")}
.evo-ic.egg{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23a9b8b0' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M12 3c4 0 7 6 7 11a7 7 0 01-14 0c0-5 3-11 7-11z'/%3E%3C/svg%3E")}
.evo-ic.ready{border-color:var(--gold);box-shadow:0 0 16px -2px var(--gold)}
.evo-cav{width:76px;height:76px;border-radius:14px;background:radial-gradient(circle at 50% 60%,#1b4a3a,#07110d);border:1px solid var(--aura,#4ee6b440);box-shadow:0 0 18px -6px var(--aura,transparent) inset;overflow:hidden}
.evo-cav svg{display:block;width:100%;height:100%}
.evo-stats{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:4px}
.evo-stats li{display:flex;justify-content:space-between;gap:10px;font-size:13px;color:var(--muted)}
.evo-stats b{color:var(--mint-soft);font-variant-numeric:tabular-nums}
.evo-goals{list-style:none;margin:8px 0 10px;padding:0;display:grid;gap:6px}
.evo-goals li{display:flex;align-items:center;gap:9px;font-size:13px;color:var(--muted)}
.evo-goals i{flex:none;width:18px;height:18px;border-radius:50%;border:1.5px solid #4ee6b440}
.evo-goals li.ok{color:var(--text)}
.evo-goals li.ok i{background:var(--gold) center/12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1405' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E");border-color:var(--gold)}
.evo-win{color:var(--gold)!important;font-weight:800}
.evo-fine{margin:2px 2px 0;font-size:12px;color:var(--muted)}
.evo-link{padding:0;border:0;background:none;color:var(--mint);font:800 12px Nunito,sans-serif;text-decoration:underline;cursor:pointer}
/* ---- app tab bar ---- */
.evo-nav{position:relative;z-index:6;display:grid;grid-template-columns:repeat(3,1fr);padding:4px 6px calc(6px + env(safe-area-inset-bottom,0px));background:#04090af8;border-top:1px solid #4ee6b440}
.evo-nav button{position:relative;display:grid;justify-items:center;gap:2px;padding:7px 0 5px;border:0;border-radius:12px;background:none;color:#9fb9afb3;font:900 10.5px Nunito,sans-serif;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:color .2s,transform .15s}
.evo-nav button:active{transform:scale(.94)}
.evo-nav svg{width:25px;height:25px}
.evo-nav button[aria-selected=true]{color:var(--mint-soft);text-shadow:0 0 12px #4ee6b4aa}
.evo-nav button[aria-selected=true] svg{filter:drop-shadow(0 0 6px #4ee6b4)}
.evo-nav button[aria-selected=true]::before{content:"";position:absolute;top:-5px;left:50%;width:30px;height:3px;margin-left:-15px;border-radius:0 0 4px 4px;background:var(--mint);box-shadow:0 0 12px var(--mint)}
/* ---- full screen (GameFS adds .fs to #evoStage and .fs-on to <html>) ---- */
#evoStage.fs{position:fixed;inset:0;z-index:2147483000;width:auto;max-width:none;height:100dvh;min-height:0;margin:0;border:0;border-radius:0;--avail:100dvh;--evo-top:0px;
 padding:env(safe-area-inset-top,0px) env(safe-area-inset-right,0px) 0 env(safe-area-inset-left,0px)}
/* wide screens in full screen, and phones on their side: swamp left, sheet and tab bar right */
@media(orientation:landscape){#evoStage.fs{grid-template-columns:minmax(0,1.5fr) minmax(320px,1fr);grid-template-rows:minmax(0,1fr) auto}
 #evoStage.fs .evo-scene{grid-row:1/3;width:min(100%,calc(var(--avail) * 1.1765));align-self:center}
 #evoStage.fs .evo-sheet{margin-top:0;border-radius:0;border-top:0;border-left:1px solid #4ee6b466}
 #evoStage.fs .evo-nav{grid-column:2}}
@media(orientation:landscape) and (max-height:520px){
 .evo-stage{grid-template-columns:minmax(0,1.5fr) minmax(300px,1fr);grid-template-rows:minmax(0,1fr) auto;min-height:0;--avail:calc(100dvh - var(--evo-top,64px))}
 .evo-scene{grid-row:1/3;width:min(100%,calc(var(--avail) * 1.1765));align-self:center}
 .evo-sheet{margin-top:0;border-radius:0;border-top:0;border-left:1px solid #4ee6b466}
 .evo-nav{grid-column:2}
 .evo-stage{width:100%;margin:0;border-radius:0}}
@media(prefers-reduced-motion:reduce){.evo-cr-art,.evo-cr.hop .evo-cr-art,.evo-egg.inc,.evo-egg.ready,.evo-dash,.evo-shroom,.evo-fly,.evo-mist,.evo-ring,.evo-orb,.evo-hot.can::after,.evo-stage .btn.ready{animation:none}.evo-float{animation-duration:.01s}}

/* ===== Stage 3: Living Swamp (day/night, fireflies, mutations, lantern, journal) ===== */
.evo-chips{flex-wrap:wrap}
.evo-tint{position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;transition:opacity 4s}
.evo-tint.t-day{background:linear-gradient(180deg,#d6f5a8,#6fb06a);mix-blend-mode:screen}
.evo-tint.t-dusk{background:linear-gradient(180deg,#ff9a5a,#9a3f78);mix-blend-mode:screen}
.evo-tint.t-night{background:#0b1c4a;mix-blend-mode:multiply}
.evo-tint.t-dawn{background:linear-gradient(180deg,#ffc8a8,#7fd6c8);mix-blend-mode:screen}
.evo-scene[data-ph=day] .t-day{opacity:.3}.evo-scene[data-ph=dusk] .t-dusk{opacity:.28}.evo-scene[data-ph=night] .t-night{opacity:.32}.evo-scene[data-ph=dawn] .t-dawn{opacity:.24}
.evo-scene[data-ph=night] .evo-shroom{filter:brightness(1.4) drop-shadow(0 0 4px #4ee6b4)}
.evo-phase,.evo-fz{padding:1px 8px;border-radius:999px;font:900 11px Nunito,sans-serif;white-space:nowrap}
.evo-phase{background:#6df0ff14;border:1px solid #6df0ff44;color:#bff5ff}
.evo-fz{background:#f2c14e2e;border:1px solid #f2c14e;color:#ffe9a8}
.evo-fz[hidden]{display:none}
.evo-wisp{position:absolute;z-index:7;left:var(--x0);top:var(--y);width:48px;height:48px;margin:-24px 0 0 -24px;padding:0;border:0;background:none;cursor:pointer;animation:evoWisp var(--dur,7s) linear forwards;-webkit-tap-highlight-color:transparent}
.evo-wisp i{position:absolute;left:50%;top:50%;width:13px;height:13px;margin:-6.5px;border-radius:50%;background:#f4ffb0;box-shadow:0 0 10px 4px #d6ff7a,0 0 26px 10px #8ef7d655;animation:evoBob 1.3s ease-in-out infinite}
.evo-wisp.gold i{width:18px;height:18px;margin:-9px;background:#fff3b0;box-shadow:0 0 12px 5px #ffd35a,0 0 34px 14px #f2c14e88}
@keyframes evoWisp{to{left:var(--x1)}}
@keyframes evoBob{50%{transform:translateY(-9px) scale(1.12)}}
.evo-lamp{animation:evoBob 3s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.m-glow{--c:#4ee6b4}.m-grip{--c:#ff9f1c}.m-lucky{--c:#f2c14e}.m-night{--c:#b57cff}
.evo-mut{display:inline-block;margin-top:6px;padding:2px 9px;border-radius:999px;font:900 11px Nunito,sans-serif;border:1px solid var(--c,#4ee6b433);color:var(--c,var(--muted));background:#0006}
.evo-mdesc{margin:4px 0 0;font-size:12px;color:var(--muted)}
.evo-mdot{position:absolute;right:6%;top:4%;width:11px;height:11px;border-radius:50%;background:var(--c);box-shadow:0 0 8px var(--c);border:1.5px solid #04110c;pointer-events:none}
.evo-goals small{display:block;font-size:11.5px;color:var(--muted)}
.evo-pick{position:absolute;inset:0;z-index:20;display:grid;place-items:center;padding:16px;background:#020706e6;backdrop-filter:blur(3px)}
.evo-pick[hidden]{display:none}
.evo-pick-box{width:100%;max-width:340px;display:grid;gap:10px;padding:16px;border-radius:18px;background:linear-gradient(180deg,#0b1814,#050b09);border:1px solid #4ee6b466;box-shadow:0 0 40px -10px var(--mint)}
.evo-pick-box h3{margin:0;font-size:18px;color:var(--mint-soft)}
.evo-pick-box p{margin:0;font-size:13px;color:var(--muted)}
.evo-opt{display:grid;gap:3px;text-align:left;padding:12px 14px;min-height:56px;border-radius:14px;background:#07110d;border:1px solid var(--c,#4ee6b455);color:var(--text);cursor:pointer}
.evo-opt b{font-size:15px;color:var(--c,#9ff5d6)}
.evo-opt span{font-size:12.5px;color:var(--muted)}
.evo-opt:focus-visible{outline:3px solid var(--gold);outline-offset:2px}
.evo-ic.lamp{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f2c14e' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M12 21V10'/%3E%3Crect x='8' y='3' width='8' height='7' rx='2'/%3E%3Cpath d='M9 21h6'/%3E%3C/svg%3E")}
.evo-ic.fert{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237fd36a' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Cpath d='M4 19c2-6 6-9 16-10-1 8-5 11-12 11'/%3E%3Cpath d='M4 19c3-3 6-5 9-6'/%3E%3C/svg%3E")}
@media(prefers-reduced-motion:reduce){.evo-wisp i,.evo-lamp{animation:none}.evo-tint{transition:none}}

/* ===== Stage 3.5: design polish (calmer HUD, cleaner cards, tile stats) ===== */
.evo-res{padding:5px 13px 6px 6px;border-radius:16px;box-shadow:0 6px 18px -8px #000,inset 0 0 0 1px #ffffff08}
.evo-orb{width:38px;height:38px}
.evo-count small{font-size:10px;letter-spacing:.08em;text-transform:none;color:#9fe9d2cc;font-weight:800}
.evo-count b{font-size:26px}
.evo-chips{margin-top:2px;gap:5px}
.evo-rate,.evo-mult{padding:0 7px;font-size:11px;line-height:17px}
.evo-ibtn{width:40px;height:40px;border-radius:13px;box-shadow:0 6px 16px -8px #000}
.evo-status{position:absolute;left:10px;top:calc(max(10px,env(safe-area-inset-top,0px)) + 68px);z-index:8;display:flex;gap:6px;pointer-events:none}
.evo-phase,.evo-fz{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;line-height:15px;background:#04110ccc;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.evo-phase::before{content:"";width:9px;height:9px;border-radius:50%;background:#ffd978;box-shadow:0 0 8px #ffd978}
.evo-scene[data-ph=night] .evo-phase::before{background:#dfeaff;box-shadow:inset -3px -1px 0 #7f8fc8,0 0 8px #aebbf0}
.evo-scene[data-ph=dusk] .evo-phase::before,.evo-scene[data-ph=dawn] .evo-phase::before{background:#ff9a6a;box-shadow:0 0 8px #ff9a6a}
.evo-fz{animation:evoReady 1.2s ease-in-out infinite}
.evo-toast{bottom:46px}
/* sheet + cards: quiet glass, one accent edge instead of corner brackets */
.evo-sheet{border-radius:24px 24px 0 0;background:linear-gradient(180deg,#0c1a15,#050b09 55%)}
.evo-pane{gap:9px;padding:6px 12px 18px}
.evo-card{padding:13px;border-radius:16px;background:linear-gradient(165deg,#0f1d18,#08100d);border:1px solid #4ee6b41f;box-shadow:inset 3px 0 0 var(--c)}
.evo-card::before{display:none}
.evo-card.locked{opacity:.62;box-shadow:none;border-style:dashed}
.evo-card.done{box-shadow:inset 3px 0 0 var(--gold)}
.evo-card.done h3::after{display:none}
.evo-info h3{display:flex;align-items:center;flex-wrap:wrap;gap:4px 8px;font-size:15.5px;letter-spacing:0;text-transform:none}
.evo-info h3 em{margin:0;padding:1px 8px;border-radius:999px;background:#f2c14e1c;border:1px solid #f2c14e44;font-size:10.5px;letter-spacing:.02em;line-height:15px}
.evo-card.done h3 em{background:#f2c14e2e}
.evo-info p{font-size:12.8px;line-height:1.4}
.evo-stage .btn{min-height:42px;border-radius:13px;font-size:14px;letter-spacing:.01em;text-transform:none}
.evo-stage .btn:disabled:not(.ghost){background:#10201a;color:#cfe7dd;border:1px solid #4ee6b433;box-shadow:none;text-shadow:none}
.evo-stage .btn.ghost:disabled{opacity:.7}
.evo-c{border-left-color:#0003}
.evo-stage .btn:disabled .evo-c{border-left-color:#4ee6b433;color:var(--gold)}
.evo-need{font-size:11.5px;letter-spacing:0}
.evo-ic{width:44px;height:44px;border-radius:13px}
.evo-cav{width:70px;height:70px;border-radius:16px}
.evo-nav{background:#050b09;border-top:1px solid #4ee6b426}
.evo-nav button{font-size:11px;letter-spacing:.03em;text-transform:none;font-weight:800}
.evo-nav button[aria-selected=true]::before{top:-4px;width:26px;margin-left:-13px}
/* realm: stat tiles and journal badges */
.evo-tiles{display:grid;grid-template-columns:repeat(2,1fr);gap:8px}
.evo-tile{display:grid;gap:2px;padding:11px 13px;border-radius:14px;background:linear-gradient(165deg,#0f1d18,#08100d);border:1px solid #4ee6b41f}
.evo-tile b{font:900 22px/1.1 Nunito,sans-serif;color:var(--text);font-variant-numeric:tabular-nums}
.evo-tile.mint b{color:var(--mint)}.evo-tile.gold b{color:var(--gold)}
.evo-tile span{font-size:12px;color:var(--muted)}
.evo-badges{list-style:none;margin:10px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,1fr);gap:7px}
.evo-badges li{display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;padding:8px 10px;border-radius:12px;background:#050c09;border:1px dashed #4ee6b426;color:var(--muted);font-size:12.5px;font-weight:800;line-height:1.2}
.evo-badges i{width:20px;height:20px;border-radius:50%;border:1.5px solid #4ee6b440}
.evo-badges small{display:block;margin-top:1px;font-size:10.5px;font-weight:600;color:#f6eedb80}
.evo-badges li.ok{border:1px solid #f2c14e66;background:#f2c14e12;color:var(--text)}
.evo-badges li.ok i{background:var(--gold) center/12px no-repeat url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%231a1405' stroke-width='3.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5 9-10'/%3E%3C/svg%3E");border-color:var(--gold)}
@media(max-width:340px){.evo-badges,.evo-tiles{grid-template-columns:1fr}}
.evo-pick-box{border-radius:20px}
.evo-tiles{margin:0;padding:0;text-align:left}.evo-tile{text-align:left;align-content:center}.evo-tile b,.evo-tile span{text-align:left}

/* ===== Stage 4: Realms, cinematics, live atmosphere, daily gift, next-goal pill ===== */
/* 4 tabs + a dot when something in that tab is ready */
.evo-nav{grid-template-columns:repeat(5,1fr)}
.evo-nav button.dot::after{content:"";position:absolute;top:4px;left:calc(50% + 9px);width:9px;height:9px;border-radius:50%;background:var(--gold);box-shadow:0 0 8px var(--gold);border:1.5px solid #050b09;animation:evoReady 1.4s ease-in-out infinite}
/* live particle canvas sits between the art and the day/night tint */
.evo-fx{position:absolute;inset:0;z-index:1;width:100%;height:100%;pointer-events:none;display:block}
/* each realm re-colours the game chrome */
.evo-stage{--bc:#4ee6b4}
.evo-stage[data-bio=ember]{--mint:#ff9a4d;--mint-soft:#ffd8b4;--mint-line:#ff8a3d55;--bc:#ff8a3d}
.evo-stage[data-bio=frost]{--mint:#7fd6ff;--mint-soft:#dff6ff;--mint-line:#7fd6ff55;--bc:#7fd6ff}
.evo-stage[data-bio=ember],.evo-stage[data-bio=frost]{border-color:color-mix(in srgb,var(--bc) 45%,transparent);box-shadow:0 0 0 1px #000,0 0 60px -14px var(--bc),0 30px 70px -20px #000}
.evo-stage[data-bio=ember] :is(.evo-res,.evo-ibtn,.evo-goal),.evo-stage[data-bio=frost] :is(.evo-res,.evo-ibtn,.evo-goal){border-color:color-mix(in srgb,var(--bc) 40%,transparent)}
.evo-stage[data-bio=ember] :is(.evo-nav,.evo-card,.evo-tile),.evo-stage[data-bio=frost] :is(.evo-nav,.evo-card,.evo-tile){border-color:color-mix(in srgb,var(--bc) 24%,transparent)}
.evo-stage[data-bio=ember] .evo-card:not(.done):not(.locked),.evo-stage[data-bio=frost] .evo-card:not(.done):not(.locked){box-shadow:inset 3px 0 0 var(--bc)}
.evo-stage[data-bio=ember] .evo-orb:not(.sm){background:radial-gradient(circle at 35% 30%,#fff3b0 0,#ffc46b 22%,#ff7a2a 55%,#7a1608 100%);box-shadow:0 0 20px -2px #ff7a2a,0 0 0 2px #1a0805 inset}
.evo-stage[data-bio=frost] .evo-orb:not(.sm){background:radial-gradient(circle at 35% 30%,#fff 0,#dff6ff 22%,#7fd6ff 55%,#16507a 100%);box-shadow:0 0 20px -2px #7fd6ff,0 0 0 2px #04101a inset}
.evo-stage[data-bio=ember] .evo-count b{text-shadow:0 0 16px #ff8a3dcc}.evo-stage[data-bio=frost] .evo-count b{text-shadow:0 0 16px #7fd6ffcc}
.evo-stage[data-bio=ember] .evo-bar2 i,.evo-stage[data-bio=ember] .evo-pips i.on{background:linear-gradient(90deg,#c24a14,#ffa24d)}
.evo-stage[data-bio=frost] .evo-bar2 i,.evo-stage[data-bio=frost] .evo-pips i.on{background:linear-gradient(90deg,#2a86b8,#9fe3ff)}
.evo-stage[data-bio=ember] .evo-card.done .evo-pips i.on,.evo-stage[data-bio=frost] .evo-card.done .evo-pips i.on{background:linear-gradient(90deg,#c18a17,#f2c14e)}
.evo-scene[data-bio=ember] .evo-wisp i{background:#fff0b0;box-shadow:0 0 10px 4px #ffb347,0 0 26px 10px #ff6a1f55}
.evo-scene[data-bio=frost] .evo-wisp i{background:#f0fcff;box-shadow:0 0 10px 4px #9fe3ff,0 0 26px 10px #7fd6ff55}
.evo-scene[data-bio=ember] .evo-tint.t-day{background:linear-gradient(180deg,#ffd0a0,#a8502a)}
.evo-scene[data-bio=frost] .evo-tint.t-day{background:linear-gradient(180deg,#e6fbff,#7fb8d6)}
/* landmark tap spot (other realms) */
.evo-lm{left:60%;top:28%;width:32%;height:46%;display:none}
.evo-scene:not([data-bio=swamp]) .evo-lm{display:block}
.evo-scene:not([data-bio=swamp]) :is(.evo-hq,.evo-p1,.evo-p2){display:none}
/* realm art animations */
.evo-plume{animation:evoPlume 2.4s ease-in-out infinite;transform-box:fill-box;transform-origin:50% 100%}
.evo-lavaflow{animation:evoGlow 3.2s ease-in-out infinite alternate}
.evo-aur{animation:evoAur 9s ease-in-out infinite alternate;transform-origin:50% 0}
.evo-aur.b{animation-duration:13s;animation-delay:-4s}
.evo-glint{animation:evoTw 2.8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
.evo-beam{animation:evoTw 4s ease-in-out infinite}
@keyframes evoPlume{0%,100%{transform:scale(1,.92);filter:brightness(1)}50%{transform:scale(1.08,1.1);filter:brightness(1.3)}}
@keyframes evoGlow{from{filter:brightness(.85)}to{filter:brightness(1.4)}}
@keyframes evoAur{from{transform:translateX(-16px) skewX(-4deg);opacity:.7}to{transform:translateX(16px) skewX(5deg);opacity:1}}
@keyframes evoTw{0%,100%{opacity:.25;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}
/* creatures feel alive */
.evo-cr::before{content:"";position:absolute;left:10%;right:10%;bottom:4%;height:11%;border-radius:50%;background:radial-gradient(#000a,transparent 70%);z-index:-1;pointer-events:none}
.evo-cr.s2 .evo-cr-art{animation:evoIdle 3.2s ease-in-out infinite,evoAuraPulse 2.4s ease-in-out infinite}
.evo-cr.wig .evo-cr-art{animation:evoWig .9s ease-in-out}
@keyframes evoWig{0%,100%{transform:rotate(0)}20%{transform:rotate(-6deg) translateY(-3px)}45%{transform:rotate(5deg) translateY(-5px)}70%{transform:rotate(-3deg)}}
@keyframes evoAuraPulse{0%,100%{filter:drop-shadow(0 4px 6px #000a) drop-shadow(0 0 6px var(--aura,#f2c14e))}50%{filter:drop-shadow(0 4px 6px #000a) drop-shadow(0 0 16px var(--aura,#f2c14e))}}
/* tab content slides in, one card after another */
.evo-pane.enter>*{animation:evoCardIn .5s var(--ease-out,ease-out) both;animation-delay:calc(var(--i,0) * 55ms)}
@keyframes evoCardIn{from{opacity:0;transform:translateY(16px) scale(.98)}to{opacity:1;transform:none}}
/* next-goal pill */
.evo-goal{position:absolute;left:10px;top:calc(max(10px,env(safe-area-inset-top,0px)) + 96px);z-index:8;max-width:calc(100% - 20px);display:flex;align-items:center;padding:5px 12px 7px;border-radius:999px;overflow:hidden;
 background:#04110ccc;border:1px solid #4ee6b455;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);color:#dffaf0;font:800 11.5px/15px Nunito,sans-serif;cursor:pointer;-webkit-tap-highlight-color:transparent;box-shadow:0 6px 16px -8px #000}
.evo-goal[hidden]{display:none}
.evo-goal span{position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.evo-goal i{position:absolute;left:0;bottom:0;height:3px;width:var(--p,0%);background:var(--bc,#4ee6b4);box-shadow:0 0 8px var(--bc,#4ee6b4);transition:width .25s}
.evo-goal.ready{border-color:var(--gold);color:#ffe9a8;animation:evoReady 1.4s ease-in-out infinite}
.evo-goal.ready i{background:var(--gold);box-shadow:0 0 8px var(--gold)}
.evo-goal:active{transform:scale(.97)}
/* travel wipe + zone title */
.evo-iris{position:absolute;inset:0;z-index:15;pointer-events:none;background:radial-gradient(circle at 50% 62%,#fff 0,var(--ic) 26%,#020706 82%);clip-path:circle(0% at 50% 62%);transition:clip-path .62s cubic-bezier(.65,0,.35,1)}
.evo-iris.in{clip-path:circle(150% at 50% 62%)}
.evo-iris.out{clip-path:circle(0% at 50% 62%);transition-duration:.7s}
.evo-zone{position:absolute;left:0;right:0;top:34%;z-index:16;pointer-events:none;display:grid;justify-items:center;gap:3px;text-align:center;animation:evoZone 3.2s ease-out both}
.evo-zone small{font:900 11px Nunito,sans-serif;letter-spacing:.22em;text-transform:uppercase;color:#fff;text-shadow:0 2px 8px #000}
.evo-zone b{font:400 34px/1.05 "Bagel Fat One",Nunito,sans-serif;color:#fff;text-shadow:0 0 22px var(--ic),0 3px 10px #000}
.evo-zone i{width:150px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,var(--ic),transparent);box-shadow:0 0 12px var(--ic)}
@keyframes evoZone{0%{opacity:0;transform:translateY(14px) scale(.96);letter-spacing:.3em}16%{opacity:1;transform:none}82%{opacity:1}100%{opacity:0;transform:translateY(-8px)}}
/* world cards */
.evo-card.world{grid-template-columns:auto 1fr}
.evo-card.world.here{border-color:color-mix(in srgb,var(--c) 55%,transparent);background:linear-gradient(165deg,color-mix(in srgb,var(--c) 14%,#0c1914),#08100d)}
.evo-wthumb{position:relative;width:72px;height:72px;border-radius:16px;overflow:hidden;border:1px solid #ffffff22;box-shadow:0 6px 16px -8px #000}
.evo-wthumb.t-swamp{background:radial-gradient(circle at 72% 24%,#effff8 0 6px,transparent 7px),radial-gradient(ellipse at 30% 78%,#4ee6b455,transparent 50%),linear-gradient(180deg,#0f2c24,#1b4a3a 55%,#0e3a30 56%,#050e0b)}
.evo-wthumb.t-ember{background:radial-gradient(circle at 24% 26%,#ffe7bd 0 5px,transparent 6px),radial-gradient(ellipse at 70% 60%,#ff7a2a99,transparent 45%),linear-gradient(180deg,#3a0f16,#8a2a12 55%,#ff6a1f 56%,#4a0e06)}
.evo-wthumb.t-frost{background:radial-gradient(ellipse at 40% 24%,#4ee6b4aa,transparent 60%),radial-gradient(ellipse at 75% 30%,#a98bff88,transparent 55%),linear-gradient(180deg,#050a24,#2d7a9a 55%,#dff6ff 56%,#3a86a8)}
.evo-wthumb.t-void{background:radial-gradient(circle at 50% 40%,#6a3cff66,transparent 60%),radial-gradient(circle at 20% 20%,#fff 0 1px,transparent 2px),radial-gradient(circle at 80% 70%,#fff 0 1px,transparent 2px),#0a0620}
.evo-wthumb .lk{position:absolute;inset:0;background:#000a url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23d5e3dc' stroke-width='2' stroke-linejoin='round' stroke-linecap='round'%3E%3Crect x='5' y='11' width='14' height='9' rx='2'/%3E%3Cpath d='M8 11V8a4 4 0 018 0v3'/%3E%3C/svg%3E") center/34% no-repeat}
.evo-lm-info{margin:6px 0 0!important;font-size:12.5px!important;color:var(--text)!important}
.evo-lm-info b{color:var(--c)}
.evo-card.gift:not(.done){border-color:#f2c14e66;background:linear-gradient(165deg,#241d0c,#0d0b05)}
/* ---------- cinematic celebration card ---------- */
.evo-cine{position:absolute;inset:0;z-index:30;display:grid;place-items:center;padding:18px;overflow:hidden;--cc:#f2c14e;background:#020706fa;background:radial-gradient(ellipse at 50% 40%,color-mix(in srgb,var(--cc) 26%,#020706) 0,#020706 74%);animation:cnIn .35s ease-out both}
.evo-cine.out{opacity:0;transition:opacity .35s;pointer-events:none}
.cn-rays{position:absolute;left:50%;top:42%;width:220%;aspect-ratio:1;border-radius:50%;pointer-events:none;background:repeating-conic-gradient(from 0deg,color-mix(in srgb,var(--cc) 34%,transparent) 0 5deg,transparent 5deg 16deg);-webkit-mask:radial-gradient(circle,#000 0,transparent 40%);mask:radial-gradient(circle,#000 0,transparent 40%);animation:cnSpin 22s linear infinite,cnFade 1s .1s both}
.cn-rays.r2{background:repeating-conic-gradient(from 8deg,color-mix(in srgb,var(--cc) 22%,transparent) 0 3deg,transparent 3deg 11deg);animation:cnSpinR 34s linear infinite,cnFade 1.2s .2s both}
.cn-ring{position:absolute;left:50%;top:42%;width:40px;height:40px;margin:-20px 0 0 -20px;border-radius:50%;border:3px solid var(--cc);box-shadow:0 0 22px var(--cc),inset 0 0 18px var(--cc);opacity:0;pointer-events:none;animation:cnRing 1.3s .15s ease-out both}
.cn-ring.r2{animation-delay:.45s;border-width:2px}
.cn-flash{position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 42%,#fff 0,color-mix(in srgb,var(--cc) 70%,#fff) 22%,transparent 62%);opacity:0;animation:cnFlash .9s .1s ease-out both}
.cn-dots{position:absolute;left:50%;top:42%;width:0;height:0;pointer-events:none}
.cn-dot{position:absolute;left:0;top:0;width:var(--s);height:var(--s);margin:calc(var(--s) / -2);border-radius:50%;background:var(--cc);box-shadow:0 0 9px var(--cc);opacity:0;animation:cnDot var(--w) calc(.35s + var(--hd,0s)) cubic-bezier(.2,.7,.3,1) both}
.cn-dot:nth-child(3n){background:#fff;box-shadow:0 0 9px #fff}
.k-hatch{--hd:1s}
.cn-body{position:relative;z-index:2;display:grid;justify-items:center;gap:8px;width:100%;max-width:320px;text-align:center}
.cn-body>*{opacity:0;animation:cnUp .6s var(--ease-out,ease-out) var(--d,.5s) both}
.cn-art{--d:.15s;display:grid;place-items:center;min-height:150px}
.cn-art svg{display:block;width:150px;height:auto;filter:drop-shadow(0 0 18px var(--aura,var(--cc)))}
.cn-art .cn-aura{display:block;animation:cnHover 3s ease-in-out infinite}
.k-evolve .cn-art{animation:cnPopIn .9s .2s var(--ease-spring,cubic-bezier(.34,1.45,.64,1)) both}
.cn-kicker{--d:.6s;margin:0;font:900 12px Nunito,sans-serif;letter-spacing:.24em;text-transform:uppercase;color:var(--cc);text-shadow:0 0 12px var(--cc)}
.cn-title{--d:.75s;margin:0;font:400 30px/1.08 "Bagel Fat One",Nunito,sans-serif;color:#fff;text-shadow:0 0 24px var(--cc),0 3px 10px #000}
.cn-sub{--d:.9s;margin:0;font:800 14px/1.35 Nunito,sans-serif;color:#e8f7f0}
.cn-sub b{font-size:22px;color:var(--cc);font-variant-numeric:tabular-nums;text-shadow:0 0 14px var(--cc)}
.cn-lines{--d:1.05s;list-style:none;margin:2px 0 0;padding:0;display:grid;gap:6px;justify-items:center}
.cn-lines li{padding:5px 12px;border-radius:999px;background:#ffffff0f;border:1px solid color-mix(in srgb,var(--cc) 40%,transparent);font:800 12.5px/1.3 Nunito,sans-serif;color:#f1fbf6;opacity:0;animation:cnUp .5s var(--ease-out,ease-out) calc(1.1s + var(--i) * .15s) both}
.cn-btns{--d:1.45s;display:grid;gap:8px;width:100%;max-width:280px;margin-top:8px}
.k-hatch .cn-kicker{--d:1.75s}.k-hatch .cn-title{--d:1.9s}.k-hatch .cn-sub{--d:2.05s}.k-hatch .cn-lines{--d:2.2s}.k-hatch .cn-btns{--d:2.5s}
.k-hatch .cn-lines li{animation-delay:calc(2.25s + var(--i) * .15s)}
.k-hatch .cn-flash{animation-delay:1.05s}.k-hatch .cn-ring{animation-delay:1.1s}.k-hatch .cn-ring.r2{animation-delay:1.4s}
.cn-egg{position:absolute;left:50%;top:6px;width:104px;margin-left:-52px;opacity:1!important;transform-origin:50% 90%;animation:cnEgg 1.15s ease-in forwards!important}
.cn-egg svg{display:block;width:100%;filter:drop-shadow(0 0 16px var(--cc))}
.cn-crack{stroke-dasharray:120;stroke-dashoffset:120;animation:cnCrack 1s .1s ease-in forwards}
.k-hatch .cn-art.cn-pop{--d:1.1s;animation:cnPopIn .8s 1.1s var(--ease-spring,cubic-bezier(.34,1.45,.64,1)) both}
.cn-orbm{display:block;width:104px;height:104px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff 0,#b9ffe9 22%,#4ee6b4 55%,#0e6b52 100%);box-shadow:0 0 60px 6px #4ee6b488,0 0 0 3px #04110c inset;animation:evoOrb 3s ease-in-out infinite}
.cn-orbm.t-ember{background:radial-gradient(circle at 35% 30%,#fff3b0 0,#ffc46b 22%,#ff7a2a 58%,#5a1306 100%);box-shadow:0 0 60px 6px #ff7a2a88,0 0 0 3px #1a0805 inset}
.cn-orbm.t-frost{background:radial-gradient(circle at 35% 30%,#fff 0,#dff6ff 22%,#7fd6ff 58%,#16507a 100%);box-shadow:0 0 60px 6px #7fd6ff88,0 0 0 3px #04101a inset}
.k-realm .cn-title{font-size:34px}
.gift-row{display:flex;gap:6px;justify-content:center;flex-wrap:wrap}
.gift-row span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;border:2px solid #f2c14e55;background:#0008;font:900 13px Nunito,sans-serif;color:#f2c14e99}
.gift-row span.done{background:#f2c14e;border-color:#f2c14e;color:#1a1405}
.gift-row span.today{border-color:#fff;color:#fff;background:radial-gradient(circle,#f2c14e66,#0008);box-shadow:0 0 18px #f2c14e;animation:cnBeat 1s ease-in-out infinite}
.gift-row span:last-child{width:40px;height:40px;font-size:17px}
.evo-cine .btn{min-height:46px}
.evo-cine.calm .cn-rays,.evo-cine.calm .cn-ring,.evo-cine.calm .cn-flash,.evo-cine.calm .cn-dots,.evo-cine.calm .cn-egg{display:none}
.evo-cine.calm *,.evo-cine.calm{animation:none!important}
.evo-cine.calm .cn-body>*,.evo-cine.calm .cn-lines li{opacity:1}
@keyframes cnIn{from{opacity:0}to{opacity:1}}
@keyframes cnUp{from{opacity:0;transform:translateY(16px) scale(.97)}to{opacity:1;transform:none}}
@keyframes cnFade{from{opacity:0}to{opacity:1}}
@keyframes cnSpin{from{transform:translate(-50%,-50%) rotate(0)}to{transform:translate(-50%,-50%) rotate(360deg)}}
@keyframes cnSpinR{from{transform:translate(-50%,-50%) rotate(360deg)}to{transform:translate(-50%,-50%) rotate(0)}}
@keyframes cnRing{0%{opacity:.95;transform:scale(.3)}100%{opacity:0;transform:scale(15)}}
@keyframes cnFlash{0%{opacity:0}18%{opacity:.95}100%{opacity:0}}
@keyframes cnDot{0%{opacity:1;transform:rotate(var(--a)) translateY(0) scale(1)}100%{opacity:0;transform:rotate(var(--a)) translateY(calc(var(--d) * -1)) scale(.2)}}
@keyframes cnPopIn{0%{opacity:0;transform:scale(.2) rotate(-12deg)}60%{opacity:1;transform:scale(1.14) rotate(3deg)}100%{opacity:1;transform:none}}
@keyframes cnHover{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes cnBeat{0%,100%{transform:scale(1)}50%{transform:scale(1.14)}}
@keyframes cnEgg{0%{transform:rotate(0) scale(.9);opacity:0}10%{opacity:1;transform:rotate(0) scale(1)}25%{transform:rotate(-8deg)}40%{transform:rotate(9deg)}55%{transform:rotate(-12deg) scale(1.03)}70%{transform:rotate(13deg) scale(1.05)}85%{transform:rotate(-14deg) scale(1.1)}100%{transform:rotate(0) scale(1.35);opacity:0}}
@keyframes cnCrack{to{stroke-dashoffset:0}}
@media(prefers-reduced-motion:reduce){.evo-plume,.evo-lavaflow,.evo-aur,.evo-glint,.evo-beam,.evo-cr.s2 .evo-cr-art,.evo-goal.ready,.evo-nav button.dot::after,.evo-zone{animation:none}.evo-pane.enter>*{animation:none}.evo-iris{transition:none}}
@media(max-width:340px){.cn-title{font-size:25px}.evo-zone b{font-size:28px}}

.evo-card.world.avail{border-color:color-mix(in srgb,var(--c) 45%,transparent)}
.evo-scene[data-bio=ember][data-ph=day] .t-day,.evo-scene[data-bio=frost][data-ph=day] .t-day{opacity:.1}

/* ===== Stage 5: Boss Battles ===== */
.evo-bthumb{width:64px;height:58px;flex:none;border-radius:14px;display:grid;place-items:center;background:radial-gradient(circle at 50% 60%,color-mix(in srgb,var(--c) 38%,#06100d),#06100d);border:1px solid color-mix(in srgb,var(--c) 55%,transparent)}
.evo-bthumb svg{width:52px;height:48px}
.evo-card.boss.locked .evo-bthumb{filter:grayscale(1) brightness(.6)}
.evo-bt{position:absolute;inset:0;z-index:22;display:grid;place-items:center;padding:12px;background:#020706f0;backdrop-filter:blur(3px)}
.evo-bt[hidden]{display:none}
.evo-bt-box,.evo-bt-fight{width:100%;max-width:360px;display:grid;gap:9px;padding:14px;border-radius:18px;background:linear-gradient(180deg,#0b1814,#050b09);border:1px solid color-mix(in srgb,var(--bc,#4ee6b4) 60%,transparent);box-shadow:0 0 40px -10px var(--bc,#4ee6b4);max-height:100%;overflow:auto}
.evo-bt-box h3{margin:0;text-align:center;font-size:20px;color:#fff}
.evo-bt-tag{margin:0;text-align:center;font-size:13px;color:var(--muted)}
.evo-bt-pic{width:130px;margin:0 auto}.evo-bt-pic svg{width:100%;filter:drop-shadow(0 0 14px var(--bc))}.evo-bt-pic.lost{filter:grayscale(.8)}
.evo-bt-facts{margin:0;padding:0 0 0 18px;display:grid;gap:4px;font-size:13px;color:#f6eedbcc}
.evo-bt-facts b{color:var(--gold,#f2c14e)}
.evo-bt-box .btn.on{box-shadow:0 0 0 2px var(--gold,#f2c14e)}
.evo-bt-top{display:flex;align-items:center;gap:10px;font-size:15px;color:#fff}.evo-bt-top b{flex:1}.evo-bt-top span{font-weight:900;color:var(--gold,#f2c14e)}
.evo-bt-x{width:34px;height:34px;border-radius:10px;border:1px solid #ffffff30;background:#ffffff10;color:#fff;font-size:18px;cursor:pointer}
.evo-bt-bar{position:relative;height:20px;border-radius:10px;overflow:hidden;background:#ffffff14;border:1px solid #ffffff20}
.evo-bt-bar i{position:absolute;inset:0 auto 0 0;width:100%;transition:width .12s linear}
.evo-bt-bar.hp i{background:linear-gradient(90deg,#d63a3a,#ff7a5c)}.evo-bt-bar.co i{background:linear-gradient(90deg,#2fb6e6,#4ee6b4)}.evo-bt-bar.co{height:14px}
.evo-bt-bar span{position:absolute;inset:0;display:grid;place-items:center;font:900 10.5px Nunito,sans-serif;letter-spacing:.1em;text-transform:uppercase;color:#fff;text-shadow:0 1px 3px #000}
.evo-bt-art{position:relative;display:block;width:100%;aspect-ratio:200/150;padding:0;border:0;border-radius:16px;background:radial-gradient(circle at 50% 70%,color-mix(in srgb,var(--bc) 30%,#06100d),#050b09);cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;overflow:hidden}
.evo-bt-art svg{width:84%;margin:0 auto;display:block;filter:drop-shadow(0 0 12px var(--bc));transition:transform .08s}
.evo-bt-art:active svg{transform:scale(.95)}
.evo-bt-art.wind svg{animation:btShake .12s infinite;filter:drop-shadow(0 0 18px #ff3b3b)}
.evo-bt-art.stun svg{filter:grayscale(.7) drop-shadow(0 0 14px #f2c14e);animation:btWob .4s infinite}
.evo-bt-art.hit{animation:btHit .35s}
.evo-bt-weak{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:radial-gradient(circle,#fff 0,#ffe08a 35%,#ff9f1c 70%,transparent 72%);box-shadow:0 0 18px #ffb43c;animation:btPulse .5s infinite alternate;cursor:pointer}
.evo-bt-weak[hidden],.evo-bt-warn[hidden]{display:none}
.evo-bt-warn{position:absolute;left:0;right:0;top:6px;text-align:center;font:900 16px Nunito,sans-serif;letter-spacing:.12em;color:#ff5a5a;text-shadow:0 0 10px #000}
.evo-bt-dodge{width:100%;font-size:18px;padding:14px}
.evo-bt-hint{margin:0;text-align:center;font-size:12.5px;color:var(--muted)}
.evo-bt-f{position:absolute;pointer-events:none;font:900 18px Nunito,sans-serif;color:#fff;text-shadow:0 2px 4px #000;animation:btFloat .8s ease-out forwards}
.evo-bt-f.crit{color:#ffd24a;font-size:24px}.evo-bt-f.bad{color:#ff6b6b}.evo-bt-f.good{color:#4ee6b4}
.cn-boss svg{width:150px;filter:drop-shadow(0 0 16px currentColor)}
@keyframes btShake{0%{transform:translate(-2px,1px)}50%{transform:translate(2px,-1px)}100%{transform:translate(-1px,-2px)}}
@keyframes btWob{50%{transform:rotate(3deg)}}
@keyframes btHit{0%{box-shadow:inset 0 0 0 0 #f00}30%{box-shadow:inset 0 0 40px 8px #ff2d2d}100%{box-shadow:inset 0 0 0 0 #f00}}
@keyframes btPulse{to{transform:scale(1.18)}}
@keyframes btFloat{to{transform:translateY(-34px);opacity:0}}
@media (prefers-reduced-motion:reduce){.evo-bt-art.wind svg,.evo-bt-art.stun svg,.evo-bt-weak{animation:none}}

/* boss polish */
.evo-card.boss{grid-template-columns:auto 1fr;box-shadow:inset 3px 0 0 var(--c)}
.evo-card.boss .evo-act{grid-column:1/-1}
.evo-card.boss .evo-act .btn{width:100%}
.evo-card.boss.done{box-shadow:inset 3px 0 0 var(--gold,#f2c14e)}
.evo-card.boss:not(.locked) .evo-bthumb{box-shadow:0 0 18px -6px var(--c)}
.evo-bt-box{animation:btIn .25s ease-out}
@keyframes btIn{from{transform:translateY(12px) scale(.97);opacity:0}}
.evo-bt .btn{width:100%;box-sizing:border-box;margin:0}
.evo-bt [data-tonic]{display:grid;gap:3px;justify-items:center;line-height:1.2}
.evo-bt .evo-c{display:inline-flex;align-items:center;gap:5px;font-weight:900}
.evo-bt .evo-orb.sm{display:inline-block;width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#fff,#4ee6b4 55%,#1b8a68)}
.evo-bt-dodge.ready{background:linear-gradient(#ff7a6a,#d63a3a);color:#fff;border-color:#ff9a8a;animation:btPulse .35s infinite alternate}
.evo-bt-dodge:disabled{opacity:.45}

/* Stage 6: Rebirth */
.evo-card.rebirth{--c:#c9a8ff}
.evo-card.rebirth.gift:not(.done){border-color:#c9a8ff88;background:linear-gradient(165deg,#1d1530,#0a0812)}
.evo-perks{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:8px}
.evo-perks li{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:9px 10px;border-radius:12px;background:#ffffff08;border:1px solid #c9a8ff22}
.evo-perks span{display:grid;gap:1px;font-size:14px;color:#fff}.evo-perks small{font-size:11.5px;color:var(--muted)}
.evo-perks .btn{flex:none;padding:8px 12px;font-size:13px}

/* Stage 7: Expeditions and Relics */
.evo-xrow{display:grid;grid-template-columns:70px 1fr auto;align-items:center;gap:8px;margin-top:8px;font-size:13px;color:#fff}.evo-xrow .btn{padding:7px 12px;font-size:13px}.evo-xrow small{color:var(--gold,#f2c14e);font-weight:900;min-width:38px;text-align:right}
.evo-xsend{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.evo-xsend .btn{flex:1 1 40%;padding:9px 10px;font-size:13px}
.evo-relics{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:8px}
.evo-relics li{display:flex;align-items:center;gap:8px;padding:8px;border-radius:12px;background:#ffffff08;border:1px dashed #ffffff22;opacity:.6}
.evo-relics li.ok{opacity:1;border:1px solid color-mix(in srgb,var(--c) 55%,transparent);background:color-mix(in srgb,var(--c) 10%,#08100d)}
.evo-relics svg,.evo-relics .q{width:30px;height:30px;flex:none}.evo-relics .q{display:grid;place-items:center;font:900 18px Nunito,sans-serif;color:#9fb9af;font-style:normal}
.evo-relics span{display:grid;gap:1px;font-size:12.5px;color:#fff;min-width:0}.evo-relics small{font-size:10.5px;color:var(--muted)}
.cn-boss.relic svg{width:90px}
.evo-perks li>span{flex:1 1 auto;min-width:0}
.evo-perks .btn{width:auto;flex:none;min-width:92px;white-space:nowrap}

/* ===== UI polish pass ===== */
/* finished cards: a small status pill instead of a big dead button, so more cards fit on screen */
.evo-card.done .evo-act .btn:disabled{width:auto;min-height:28px;padding:4px 12px;font-size:12px;border-radius:99px;opacity:.85;background:#f2c14e1f;border:1px solid #f2c14e55;color:#f2c14e;box-shadow:none;text-shadow:none}
.evo-card.done .evo-act{justify-self:start}
/* calmer rhythm */
.evo-pane{gap:8px;padding-bottom:34px}
.evo-card{padding:11px 12px}
.evo-card .evo-info p{font-size:13px;line-height:1.38}
.evo-card h3{line-height:1.25}
.evo-tab-fade,.evo-pane{-webkit-mask-image:linear-gradient(#000 calc(100% - 22px),transparent);mask-image:linear-gradient(#000 calc(100% - 22px),transparent)}
/* keyboard / switch-control focus */
.evo-stage :is(button,a):focus-visible{outline:2px solid var(--mint-soft,#c8fff4);outline-offset:2px}
/* nicer press feel everywhere */
.evo-stage .btn:not(:disabled):active{transform:translateY(1px) scale(.985)}
.evo-card{transition:border-color .25s,box-shadow .25s}
/* Journal badges and relic tiles: slightly larger tap-friendly text */
.evo-relics li,.evo-badges li{min-height:48px}
/* long names never break the layout */
.evo-info h3{overflow-wrap:anywhere}
/* boss and prep screens: keep inside the safe area on short phones */
.evo-bt-box,.evo-bt-fight{max-height:calc(100% - 8px)}
@media(max-height:700px){.evo-bt-pic{width:92px}.evo-bt-art{aspect-ratio:200/120}.evo-bt-facts{font-size:12px}}