/* ============================================================
   WILDDEX — Explore. Identify. Discover.
   Theme: "a nature documentary at night" — deep forest-black
   chrome, bioluminescent leaf-green accent, brass for rarity.
   ============================================================ */
:root{
  --bg:#0a120d; --paper:#121c15; --paper-2:#16221a; --surface:#0f1912; --surface-2:#1c2a21; --card:#131e16;
  --rule:rgba(214,238,206,.17); --rule-2:rgba(214,238,206,.09);
  --ink:#eef6e9; --ink-2:#c9dabf; --muted:#8fa78f; --muted-2:#667c68;
  --ink-plate:#cfe6b8; --silhouette:#0b130d;
  --accent:#7ed957; --accent-2:#a5e97f; --accent-ink:#8fdf6a;
  --gold:#d9a441; --gold-2:#e6b95c;
  --gem:#5bc9e8; --leaf:#7ed957;
  --plate-a:#1c2b1f; --plate-b:#111e14; --plate-la:#141f17; --plate-lb:#0d1610;
  --r:10px; --r-md:12px; --r-lg:16px;
  --glow:0 0 24px rgba(126,217,87,.16);
  --ease-out:cubic-bezier(.23,1,.32,1);
  --serif:"Iowan Old Style","Palatino Linotype",Palatino,Georgia,"Times New Roman",serif;
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;
  --maxw:480px;
}
*{box-sizing:border-box;-webkit-tap-highlight-color:transparent;}
html,body{margin:0;height:100%;}
body{font-family:var(--sans);color:var(--ink);background:#060b08;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;}
button{font-family:inherit;cursor:pointer;color:inherit;} img{display:block;max-width:100%;} a{cursor:pointer;color:inherit;}
::selection{background:rgba(126,217,87,.3);}
.app{max-width:var(--maxw);margin:0 auto;min-height:100vh;min-height:100dvh;position:relative;display:flex;flex-direction:column;overflow:hidden;
  background:radial-gradient(150% 70% at 50% -12%, rgba(126,217,87,.10) 0%, transparent 52%), radial-gradient(120% 80% at 50% 116%, rgba(91,201,232,.06), transparent 60%), var(--bg);}
.view{position:relative;flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;padding-bottom:108px;}
.view::-webkit-scrollbar{display:none;}
.view.leaving{opacity:.5;transition:opacity .12s;}
.pad{padding:calc(28px + env(safe-area-inset-top)) 22px 0;}
.view>.pad>*{animation:rise .5s var(--ease-out) both;}
.view>.pad>*:nth-child(2){animation-delay:.04s;} .view>.pad>*:nth-child(3){animation-delay:.08s;} .view>.pad>*:nth-child(4){animation-delay:.12s;} .view>.pad>*:nth-child(5){animation-delay:.16s;} .view>.pad>*:nth-child(n+6){animation-delay:.18s;}
@keyframes rise{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
.boot{display:flex;flex-direction:column;align-items:center;justify-content:center;height:78vh;gap:10px;}
.boot-mark{width:54px;height:54px;border-radius:50%;border:1.5px solid var(--accent);position:relative;animation:breathe 2s var(--ease-out) infinite;box-shadow:var(--glow);}
.boot-mark::after{content:"";position:absolute;inset:9px;border-radius:50%;border:1px solid var(--rule);}
.boot-name{font-family:var(--serif);font-size:27px;font-weight:600;letter-spacing:.02em;}
.boot-sub{font-size:12px;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;}
@keyframes breathe{0%,100%{transform:scale(1);opacity:.9;}50%{transform:scale(1.05);opacity:1;}}
.tabbar{position:fixed;left:50%;transform:translateX(-50%);bottom:0;width:100%;max-width:var(--maxw);height:calc(80px + env(safe-area-inset-bottom));padding-bottom:env(safe-area-inset-bottom);background:linear-gradient(180deg,rgba(10,18,13,0),var(--bg) 44%);display:flex;align-items:flex-start;justify-content:space-around;padding-top:18px;z-index:50;}
.tab{background:none;border:none;display:flex;flex-direction:column;align-items:center;gap:5px;color:var(--muted);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;transition:color .2s;position:relative;}
.tab-badge{position:absolute;top:-2px;right:calc(50% - 18px);width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 2px var(--bg),0 0 8px rgba(126,217,87,.8);animation:claimPulse 1.6s ease-in-out infinite;}
.tab svg{width:23px;height:23px;} .tab svg path,.tab svg rect,.tab svg circle{stroke:var(--muted);}
.tab.on{color:var(--ink);} .tab.on svg path,.tab.on svg rect,.tab.on svg circle{stroke:var(--accent);}
.fab{border:none;width:58px;height:58px;margin-top:-20px;border-radius:50%;background:linear-gradient(160deg,var(--accent-2),var(--accent) 60%,#5cb944);box-shadow:0 0 0 5px var(--bg),0 10px 26px -8px rgba(126,217,87,.55);display:flex;align-items:center;justify-content:center;transition:transform .16s var(--ease-out);}
.fab:active{transform:scale(.93);} .fab svg{width:25px;height:25px;} .fab svg path,.fab svg rect,.fab svg circle{stroke:#08120b;}
.masthead{padding-top:6px;border-bottom:1px solid var(--rule);padding-bottom:16px;margin-bottom:4px;}
.mast-kicker{font-size:10.5px;letter-spacing:.32em;text-transform:uppercase;color:var(--accent-ink);}
.mast-title{font-family:var(--serif);font-size:34px;font-weight:600;line-height:1;margin:7px 0 0;}
.mast-meta{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:12px;font-size:12.5px;color:var(--ink-2);}
.mast-meta .who{color:var(--ink);} .mast-meta .num{font-family:var(--serif);}
.h-title{font-family:var(--serif);font-size:clamp(22px,5.6vw,28px);font-weight:600;margin:0;line-height:1.12;text-wrap:balance;}
.greet{font-size:11px;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;margin-top:4px;}
.back-head{display:flex;align-items:center;gap:12px;margin-bottom:16px;min-height:42px;}
.back-head>div{min-width:0;flex:1;}
.back-btn{width:40px;height:40px;border-radius:50%;background:transparent;border:1px solid var(--rule);font-size:19px;color:var(--ink);line-height:1;transition:background .2s,transform .14s var(--ease-out);}
.back-btn:active{transform:scale(.9);background:var(--surface-2);}
.section-h{display:flex;justify-content:space-between;align-items:baseline;margin:30px 2px 14px;}
.section-h h3{font-size:12px;margin:0;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2);}
.section-h a{font-size:12px;color:var(--accent-ink);}
.muted{color:var(--muted);} .small{font-size:12px;} .center{text-align:center;}
.lede{font-family:var(--serif);font-size:16px;line-height:1.5;color:var(--ink-2);margin:8px 2px 0;max-width:60ch;}
.grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px 16px;}
.spec{cursor:pointer;}
.plate{position:relative;aspect-ratio:1/1;margin:0;border-radius:var(--r);overflow:hidden;display:flex;align-items:center;justify-content:center;background:radial-gradient(125% 120% at 32% 22%, var(--plate-a), var(--plate-b));box-shadow:inset 0 0 0 1px var(--rule), inset 0 0 0 6px var(--paper-2), inset 0 0 0 7px var(--rule-2), 0 12px 28px -18px rgba(0,0,0,.8);transition:transform .45s var(--ease-out), box-shadow .4s var(--ease-out);}
.spec:active .plate{transform:scale(.975);}
@media(hover:hover){.spec:hover .plate{box-shadow:inset 0 0 0 1px var(--rule), inset 0 0 0 6px var(--paper-2), inset 0 0 0 7px var(--rule-2), 0 18px 36px -14px rgba(0,0,0,.85), var(--glow);}}
.plate.locked{background:radial-gradient(125% 120% at 32% 22%, var(--plate-la), var(--plate-lb));}
.plate .sil{width:66%;height:66%;}
.sil-specimen path{fill:var(--ink-plate);} .sil-shadow path{fill:var(--silhouette);opacity:.94;} .sil-emblem path{fill:var(--accent-ink);}
.tick{position:absolute;width:9px;height:9px;border-color:var(--rule);opacity:.7;}
.tick.tl{top:10px;left:10px;border-left:1px solid;border-top:1px solid;} .tick.tr{top:10px;right:10px;border-right:1px solid;border-top:1px solid;} .tick.bl{bottom:10px;left:10px;border-left:1px solid;border-bottom:1px solid;} .tick.br{bottom:10px;right:10px;border-right:1px solid;border-bottom:1px solid;}
.plate-no{position:absolute;bottom:9px;right:13px;font-family:var(--serif);font-size:10px;color:var(--muted);}
.spec-cap{padding:11px 2px 0;}
.spec-name{font-family:var(--serif);font-size:15px;font-weight:600;line-height:1.15;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.spec.locked .spec-name{color:var(--muted);font-style:italic;font-weight:500;}
.spec-sci{font-size:11.5px;color:var(--muted);margin-top:3px;font-style:italic;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.spec.locked .spec-sci{font-style:normal;letter-spacing:.06em;text-transform:uppercase;font-size:10px;}
.rar-tick{display:block;width:18px;height:2px;margin:9px 2px 0;border-radius:2px;}
.spec.skeleton .plate{background:linear-gradient(100deg,#101a13,#182619 40%,#101a13 80%);background-size:200% 100%;animation:sk 1.4s infinite linear;}
.spec.skeleton .spec-cap{visibility:hidden;}
@keyframes sk{to{background-position:-200% 0;}}
.rail{display:flex;gap:14px;overflow-x:auto;margin:0 -22px;padding:2px 22px 8px;} .rail::-webkit-scrollbar{display:none;} .rail .spec{flex:0 0 132px;}
.journal{border:1px solid var(--rule);border-radius:var(--r-lg);background:var(--paper);padding:18px;cursor:pointer;transition:box-shadow .3s,transform .16s var(--ease-out),border-color .2s;}
.journal:active{transform:scale(.99);}
@media(hover:hover){.journal:hover{box-shadow:0 14px 32px -22px rgba(0,0,0,.9), var(--glow);border-color:rgba(126,217,87,.35);}}
.journal .j-k{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-ink);}
.journal .j-t{font-family:var(--serif);font-size:21px;font-weight:600;margin-top:6px;}
.journal .j-s{font-size:13px;color:var(--ink-2);margin-top:5px;line-height:1.5;}
.progress{margin-top:14px;} .progress .p-row{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:7px;} .progress .p-row b{color:var(--ink);font-family:var(--serif);}
.bar{height:3px;background:var(--rule-2);position:relative;overflow:hidden;border-radius:3px;} .bar i{position:absolute;left:0;top:0;bottom:0;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:3px;transition:width .8s var(--ease-out);box-shadow:0 0 8px rgba(126,217,87,.5);}
.reg-list{display:flex;flex-direction:column;gap:14px;}
.reg-item{border:1px solid var(--rule);border-radius:var(--r-lg);overflow:hidden;background:var(--paper);cursor:pointer;transition:transform .16s var(--ease-out),box-shadow .3s,border-color .2s;}
.reg-item:active{transform:scale(.99);} @media(hover:hover){.reg-item:hover{box-shadow:0 14px 34px -22px rgba(0,0,0,.9), var(--glow);border-color:rgba(126,217,87,.35);}}
.reg-top{padding:18px 18px 0;display:flex;justify-content:space-between;align-items:flex-start;}
.reg-n{font-family:var(--serif);font-size:20px;font-weight:600;} .reg-d{font-size:12px;color:var(--muted);margin-top:3px;}
.reg-emblem{width:42px;height:42px;opacity:.7;} .reg-emblem path{fill:none;stroke:var(--accent-ink);stroke-width:1.4;}
.reg-foot{padding:14px 18px 16px;} .reg-foot .rf-row{display:flex;justify-content:space-between;align-items:baseline;font-size:12px;color:var(--muted);margin-bottom:8px;} .reg-foot .rf-row b{font-family:var(--serif);color:var(--ink);font-size:15px;}
.cat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;}
.cat-card{border:1px solid var(--rule);border-radius:var(--r-lg);background:var(--paper);padding:16px 16px 14px;cursor:pointer;transition:transform .16s var(--ease-out),box-shadow .3s,border-color .2s;display:flex;flex-direction:column;gap:10px;}
.cat-card:active{transform:scale(.98);} @media(hover:hover){.cat-card:hover{box-shadow:0 14px 30px -22px rgba(0,0,0,.9), var(--glow);border-color:rgba(126,217,87,.35);}}
.cat-emblem{width:52px;height:52px;} .cat-emblem path{fill:var(--accent-ink);} .cat-card.marine{background:#0e1c20;} .cat-card.marine .cat-emblem path{fill:var(--gem);}
.cat-label{font-family:var(--serif);font-size:16px;font-weight:600;} .cat-realm{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);}
.phead{display:flex;flex-direction:column;align-items:center;text-align:center;margin-top:6px;}
.p-monogram{width:78px;height:78px;border-radius:50%;border:1.5px solid var(--accent);display:flex;align-items:center;justify-content:center;font-family:var(--serif);font-size:30px;font-weight:600;position:relative;box-shadow:var(--glow);}
.p-monogram::after{content:"";position:absolute;inset:7px;border-radius:50%;border:1px solid var(--rule);}
.pname{font-family:var(--serif);font-size:24px;font-weight:600;margin-top:14px;}
.prank{font-size:11px;color:var(--accent-ink);letter-spacing:.14em;text-transform:uppercase;margin-top:4px;}
.pmode{font-size:11px;color:var(--muted);margin-top:8px;}
.p-ledger{display:flex;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-top:20px;}
.p-ledger .pl{flex:1;text-align:center;padding:16px 4px;border-right:1px solid var(--rule);} .p-ledger .pl:last-child{border-right:none;}
.p-ledger .v{font-family:var(--serif);font-size:22px;font-weight:600;} .p-ledger .k{font-size:9.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-top:4px;}
.ach-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px 12px;} .ach{text-align:center;}
.ach-seal{aspect-ratio:1;border-radius:50%;border:1px solid var(--rule);display:flex;align-items:center;justify-content:center;position:relative;background:var(--surface);}
.ach-seal svg{width:42%;height:42%;} .ach-seal svg path,.ach-seal svg circle{stroke:var(--muted-2);fill:none;stroke-width:1.6;}
.ach.done .ach-seal{border-color:var(--gold);background:rgba(217,164,65,.10);box-shadow:0 0 16px rgba(217,164,65,.25);} .ach.done .ach-seal svg path,.ach.done .ach-seal svg circle{stroke:var(--gold-2);}
.ach.done .ach-seal::after{content:"";position:absolute;inset:4px;border-radius:50%;border:1px solid rgba(217,164,65,.35);}
.ach-n{font-size:9.5px;color:var(--muted);margin-top:7px;line-height:1.2;} .ach.done .ach-n{color:var(--ink-2);}
.menu-row{display:flex;align-items:center;gap:12px;border-bottom:1px solid var(--rule);padding:15px 2px;} .mt{font-size:14px;} .ms{font-size:11.5px;color:var(--muted);margin-top:2px;} .menu-row button{margin-left:auto;}
.more-link{display:inline-block;margin:2px 2px 10px;font-size:12.5px;color:var(--muted);border-bottom:1px solid var(--rule);padding-bottom:1px;}
.data-note{margin:22px 2px 8px;} .data-note p{font-size:10.5px;color:var(--muted-2);line-height:1.6;}
.btn{width:100%;background:linear-gradient(160deg,var(--accent-2),var(--accent) 55%,#5cb944);color:#08120b;border:none;border-radius:12px;padding:15px;font-weight:700;font-size:14.5px;margin-top:12px;transition:transform .14s var(--ease-out),box-shadow .2s;box-shadow:0 10px 24px -12px rgba(126,217,87,.5);} .btn:active{transform:scale(.985);}
.btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--rule);box-shadow:none;font-weight:600;} .btn.accent{background:linear-gradient(160deg,var(--gold-2),var(--gold));box-shadow:0 10px 24px -12px rgba(217,164,65,.5);} .btn:disabled{opacity:.5;}
.search{width:100%;border:1px solid var(--rule);background:var(--surface);color:var(--ink);border-radius:12px;padding:13px 15px;font-size:14px;margin:6px 0 16px;outline:none;font-family:var(--sans);transition:border-color .2s,box-shadow .2s;}
.search::placeholder{color:var(--muted-2);} .search:focus{border-color:var(--accent);box-shadow:0 0 0 3px rgba(126,217,87,.16);}
.auth-screen{display:flex;flex-direction:column;align-items:center;text-align:center;padding-top:14vh;min-height:80vh;}
.auth-mark{width:64px;height:64px;border-radius:50%;border:1.5px solid var(--accent);position:relative;box-shadow:var(--glow);} .auth-mark::after{content:"";position:absolute;inset:10px;border-radius:50%;border:1px solid var(--rule);}
.auth-title{font-family:var(--serif);font-size:36px;margin:20px 0 6px;} .auth-sub{font-size:14px;color:var(--ink-2);max-width:300px;line-height:1.6;font-family:var(--serif);} .auth-form{width:100%;max-width:330px;margin-top:26px;}
.loading{display:flex;flex-direction:column;align-items:center;gap:14px;padding:40px;grid-column:1/-1;}
.spin{width:30px;height:30px;border-radius:50%;border:1.5px solid var(--rule);border-top-color:var(--accent);animation:spin .9s linear infinite;} @keyframes spin{to{transform:rotate(360deg);}}
.loading-l{font-size:11px;color:var(--muted);letter-spacing:.16em;text-transform:uppercase;}
.empty{grid-column:1/-1;text-align:center;padding:36px 18px;} .empty-rule{width:36px;height:1px;background:var(--accent);margin:0 auto 16px;}
.empty h5{margin:0 0 8px;font-size:18px;font-family:var(--serif);font-weight:600;} .empty p{font-size:13px;color:var(--muted);margin:0 auto 16px;line-height:1.6;max-width:34ch;}
.empty-inline{grid-column:1/-1;font-size:13px;color:var(--muted);line-height:1.6;padding:2px 2px 12px;font-family:var(--serif);}
.toast{position:fixed;left:50%;transform:translateX(-50%) translateY(-12px);bottom:114px;background:var(--paper-2);color:var(--ink);border:1px solid rgba(126,217,87,.4);padding:11px 20px;border-radius:11px;font-size:13px;z-index:400;opacity:0;transition:opacity .25s var(--ease-out),transform .25s var(--ease-out);max-width:300px;text-align:center;box-shadow:0 16px 40px -16px rgba(0,0,0,.8), var(--glow);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}
.entry-hero{position:relative;padding:calc(26px + env(safe-area-inset-top)) 22px 0;text-align:center;}
.entry-plate{width:min(74%,300px);aspect-ratio:1;margin:8px auto 0;border-radius:var(--r);position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(125% 120% at 32% 22%, var(--plate-a), var(--plate-b));box-shadow:inset 0 0 0 1px var(--rule), inset 0 0 0 9px var(--paper-2), inset 0 0 0 10px var(--rule-2), 0 24px 60px -28px rgba(0,0,0,.9);}
.entry-plate .sil{width:64%;height:64%;} .entry-plate .tick{width:12px;height:12px;} .entry-plate.locked{background:radial-gradient(125% 120% at 32% 22%, var(--plate-la), var(--plate-lb));}
.sp-back{position:absolute;top:calc(22px + env(safe-area-inset-top));left:18px;z-index:5;width:40px;height:40px;border-radius:50%;background:var(--paper-2);border:1px solid var(--rule);font-size:19px;color:var(--ink);}
.sp-plateno{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted);margin-top:18px;}
.sp-cn{font-family:var(--serif);font-size:clamp(27px,8vw,34px);font-weight:600;line-height:1.05;margin-top:8px;text-wrap:balance;}
.sp-sn{font-style:italic;font-family:var(--serif);font-size:15px;color:var(--ink-2);margin-top:4px;}
.sp-rarline{display:inline-flex;align-items:center;gap:8px;margin-top:14px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);} .sp-rarline i{width:8px;height:8px;border-radius:50%;}
.sp-body{padding:8px 22px 0;} .sp-rule{height:1px;background:var(--rule);margin:26px 0;}
.sp-lead{font-family:var(--serif);font-size:17px;line-height:1.62;color:var(--ink);margin:0;}
.sp-sec{margin-top:26px;} .sp-sec h4{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--accent-ink);margin:0 0 12px;font-weight:600;}
.def{display:flex;justify-content:space-between;gap:16px;padding:11px 0;border-bottom:1px solid var(--rule-2);font-size:14px;} .def:last-child{border-bottom:none;} .def .dk{color:var(--muted);} .def .dv{text-align:right;font-family:var(--serif);}
.cons{display:flex;align-items:center;gap:12px;} .cbar{display:flex;gap:4px;flex:1;} .cbar i{flex:1;height:3px;border-radius:2px;} .clabel{font-size:12px;font-family:var(--serif);}
.tax-row{display:flex;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--rule-2);font-size:13.5px;} .tax-row:last-child{border-bottom:none;}
.tax-rank{color:var(--muted);font-size:10.5px;text-transform:uppercase;letter-spacing:.1em;} .tax-name{font-family:var(--serif);}
.entry-record{border:1px solid var(--rule);border-radius:var(--r-lg);padding:18px;background:var(--paper);} .entry-record .er-h{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--gold);margin-bottom:12px;}
.ref-photo{margin-top:10px;border:1px solid var(--rule);border-radius:var(--r);overflow:hidden;background:var(--surface-2);} .ref-photo img{aspect-ratio:4/3;object-fit:cover;width:100%;height:200px;object-fit:cover;display:block;} .ref-cap{font-size:10.5px;color:var(--muted);padding:8px 12px;font-style:italic;}
.sensitive{display:flex;gap:10px;border:1px solid rgba(217,164,65,.4);background:rgba(217,164,65,.08);border-radius:var(--r);padding:13px 15px;font-size:12.5px;color:#e0c084;line-height:1.55;}
.seg{display:flex;border:1px solid var(--rule);border-radius:12px;padding:3px;margin:16px 0;background:var(--surface);}
.seg div{flex:1;text-align:center;white-space:nowrap;font-size:12.5px;padding:10px 8px;border-radius:9px;color:var(--muted);cursor:pointer;transition:color .2s,background .3s var(--ease-out);} .seg div.on{background:var(--accent);color:#08120b;font-weight:700;}
.cap-panel{margin-top:6px;}
.cap-drop{width:100%;border:1px dashed var(--rule);background:var(--paper);border-radius:var(--r-lg);padding:40px;display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--muted);transition:border-color .2s;} .cap-drop:active{border-color:var(--accent);}
.cap-drop svg{width:34px;height:34px;} .cap-drop svg path,.cap-drop svg rect,.cap-drop svg circle{stroke:var(--accent-ink);} .cap-drop span{font-size:13px;}
.cap-prev{margin-top:14px;} .cap-prev-img{width:100%;border-radius:var(--r);max-height:280px;object-fit:cover;border:1px solid var(--rule);}
.note{border:1px solid var(--rule);border-radius:var(--r);padding:14px 16px;font-size:13px;color:var(--ink-2);line-height:1.55;margin-bottom:12px;font-family:var(--serif);background:var(--surface);}
.gate-h{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);margin:20px 0 12px;}
.cand{width:100%;display:flex;align-items:center;justify-content:space-between;border:1px solid var(--rule);border-radius:12px;padding:15px 16px;margin-bottom:10px;text-align:left;background:var(--paper);transition:transform .14s var(--ease-out),border-color .2s;} .cand:active{transform:scale(.985);border-color:var(--accent);}
.cand-n{font-family:var(--serif);font-size:15px;} .cand-s{font-style:italic;font-size:12px;color:var(--muted);margin-top:2px;} .cand-score{font-family:var(--serif);font-size:16px;color:var(--accent-ink);}
.reveal{overscroll-behavior:contain;position:fixed;inset:0;z-index:500;background:rgba(3,8,5,.72);backdrop-filter:blur(4px);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:26px;}
.reveal-card{width:min(86%,330px);background:linear-gradient(175deg,var(--paper-2),var(--paper));border:1px solid var(--rule);border-radius:var(--r-lg);padding:26px 24px 24px;text-align:center;box-shadow:0 40px 90px -30px rgba(0,0,0,.9), var(--glow);animation:cardrise .55s var(--ease-out) both;}
@keyframes cardrise{from{opacity:0;transform:translateY(16px) scale(.97);}to{opacity:1;transform:none;}}
.reveal-k{font-size:10.5px;letter-spacing:.28em;text-transform:uppercase;color:var(--gold-2);}
.reveal-plate{width:62%;aspect-ratio:1;margin:14px auto 0;border-radius:var(--r);display:flex;align-items:center;justify-content:center;overflow:hidden;position:relative;background:radial-gradient(125% 120% at 32% 22%, var(--plate-a), var(--plate-b));box-shadow:inset 0 0 0 1px var(--rule), inset 0 0 0 7px var(--paper), inset 0 0 0 8px var(--rule-2);}
.reveal-plate .sil{width:64%;height:64%;filter:blur(6px);transition:filter .7s var(--ease-out);} .reveal-plate .sil path{fill:var(--silhouette);transition:fill .8s ease;}
.reveal-plate.revealed .sil{filter:blur(0);} .reveal-plate.revealed .sil path{fill:var(--ink-plate);}
.reveal-n{font-family:var(--serif);font-size:21px;font-weight:600;margin-top:16px;} .reveal-sn{font-style:italic;font-family:var(--serif);font-size:13px;color:var(--muted);margin-top:3px;}
.reveal-meta{display:flex;justify-content:center;gap:22px;margin-top:18px;padding-top:16px;border-top:1px solid var(--rule);} .reveal-meta .rm{text-align:center;} .reveal-meta .rv{font-family:var(--serif);font-size:18px;color:var(--accent-ink);} .reveal-meta .rk{font-size:9px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:3px;}
.reveal-cta{margin-top:22px;display:flex;flex-direction:column;gap:10px;} .reveal-cta a{color:var(--muted);font-size:12.5px;}
@media(min-width:520px){ .app{margin:24px auto;min-height:calc(100dvh - 48px);border-radius:18px;border:1px solid var(--rule-2);box-shadow:0 60px 140px -40px rgba(0,0,0,.9);} }
@media(prefers-reduced-motion:reduce){ *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;} }

.cand{gap:12px;}
.cand-thumb{width:74px;height:74px;border-radius:9px;background:var(--surface-2) center/cover no-repeat;border:1px solid var(--rule);flex:0 0 auto;}
.cand-main{flex:1;min-width:0;}

/* ---- Habitats (living biome dioramas) ---- */
.seg-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;}
.seg-scroll::-webkit-scrollbar{display:none;}
.seg-scroll div{flex:0 0 auto;white-space:nowrap;padding:10px 16px;}
.habitat-scene{position:relative;height:62vh;min-height:380px;border-radius:var(--r-lg);overflow-x:auto;overflow-y:hidden;border:1px solid var(--rule);margin-top:6px;box-shadow:inset 0 2px 12px rgba(0,0,0,.5), 0 18px 44px -24px rgba(0,0,0,.9);scrollbar-width:none;overscroll-behavior-x:contain;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;touch-action:pan-x;}
.habitat-scene::-webkit-scrollbar{display:none;}
.habitat-world{position:relative;height:100%;min-width:100%;}
.habitat-scene::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:40;}
.habitat-scene.day::after{background:none;}
.habitat-scene.dawn::after{background:linear-gradient(180deg,rgba(255,205,150,.16),transparent 60%);}
.habitat-scene.dusk::after{background:linear-gradient(180deg,rgba(255,150,100,.14),rgba(50,40,75,.16));}
.habitat-scene.night::after{background:linear-gradient(180deg,rgba(22,32,60,.5),rgba(15,25,48,.32));}
.habitat-scene.forest{background:linear-gradient(180deg,#d4e1e6 0%,#dfe6d6 58%,#cdd5bf 100%);}
.habitat-scene.meadow{background:linear-gradient(180deg,#dbe7ec 0%,#edf0dd 52%,#dce6cc 100%);}
.habitat-scene.wetland{background:linear-gradient(180deg,#cfe0e2 0%,#cfe0d6 55%,#b9cdb8 100%);}
.habitat-scene.reef{background:linear-gradient(180deg,#cfe2ea 0%,#a7ccd9 58%,#7fb0c2 100%);}
.habitat-scene.ocean{background:linear-gradient(180deg,#bcd6e4 0%,#7fb0c6 55%,#3f7e9c 100%);}
.habitat-scene.river{background:linear-gradient(180deg,#d4e1e6 0%,#dbe8d4 48%,#8fc3c9 100%);}
.habitat-scene.coastal{background:linear-gradient(180deg,#cfe4ec 0%,#7fb8c9 55%,#ecdfba 100%);}
.habitat-scene.savanna{background:linear-gradient(180deg,#f0d9a8 0%,#e8c184 55%,#c9a45c 100%);}
.habitat-scene.desert{background:linear-gradient(180deg,#f2c9a0 0%,#e8a87c 55%,#c98d4e 100%);}
.habitat-scene.mountain{background:linear-gradient(180deg,#cfdfe8 0%,#e6edea 52%,#7fa284 100%);}
.habitat-scene.deepsea{background:linear-gradient(180deg,#123048 0%,#0b1f33 55%,#060f1c 100%);}
.habitat-scene.deepsea.night::after,.habitat-scene.deepsea.dusk::after,.habitat-scene.deepsea.dawn::after{background:none;}
.habitat-bg{position:absolute;inset:0;}
.flora{position:absolute;transform-origin:bottom center;animation:swayp var(--sw) ease-in-out infinite;z-index:6;}
.flora svg{width:100%;height:100%;display:block;} .flora svg path{fill:#3a5a52;}
.habitat-scene.reef .flora svg path{fill:#1f6075;}
@keyframes swayp{0%,100%{transform:rotate(-2deg);}50%{transform:rotate(2deg);}}
.rays{position:absolute;inset:0;overflow:hidden;}
.rays span{position:absolute;top:-30%;height:150%;width:34%;background:linear-gradient(180deg,rgba(255,255,255,.18),transparent 70%);transform:rotate(14deg);filter:blur(10px);}
.rays span:nth-child(1){left:8%;animation:ray 14s ease-in-out infinite;}
.rays span:nth-child(2){left:44%;animation:ray 18s ease-in-out infinite 3s;}
.rays span:nth-child(3){left:74%;animation:ray 16s ease-in-out infinite 6s;}
@keyframes ray{0%,100%{opacity:.35;}50%{opacity:.7;}}
.particle{position:absolute;border-radius:50%;pointer-events:none;}
.particle.bubble{width:5px;height:5px;background:rgba(255,255,255,.5);animation:prise var(--p) linear infinite var(--pd);}
.particle.pollen{width:4px;height:4px;background:rgba(255,238,200,.75);animation:pdrift var(--p) ease-in-out infinite var(--pd);}
@keyframes prise{0%{transform:translateY(0);opacity:0;}12%{opacity:.8;}100%{transform:translateY(-260px);opacity:0;}}
@keyframes pdrift{0%,100%{transform:translate(0,0);opacity:.4;}50%{transform:translate(16px,-20px);opacity:.8;}}
.habitat-creature{position:absolute;border:none;background:none;padding:0;cursor:pointer;z-index:10;}
.habitat-creature svg{width:100%;height:100%;display:block;filter:drop-shadow(0 5px 7px rgba(20,40,60,.28));}


.habitat-creature:active{filter:brightness(.78);}
.creature-face{width:100%;height:100%;}
.roam-swim{animation:roamSwim var(--dur) ease-in-out infinite var(--delay);}
.roam-fly{animation:roamFly var(--dur) ease-in-out infinite var(--delay);}
.roam-flutter{animation:roamFlutter var(--dur) ease-in-out infinite var(--delay);}
.roam-pulse{animation:roamPulse var(--dur) ease-in-out infinite var(--delay);}
.roam-walk{animation:roamWalk var(--dur) ease-in-out infinite var(--delay);}
.roam-crawl{animation:roamCrawl var(--dur) ease-in-out infinite var(--delay);}
.roam-sway{animation:roamSway var(--dur) ease-in-out infinite var(--delay);transform-origin:bottom center;}
@keyframes roamSwim{0%{transform:translate(-74px,6px);}25%{transform:translate(-12px,-16px);}50%{transform:translate(66px,4px);}75%{transform:translate(8px,20px);}100%{transform:translate(-74px,6px);}}
@keyframes roamFly{0%,100%{transform:translate(-92px,10px);}28%{transform:translate(-2px,-22px);}52%{transform:translate(86px,-16px);}76%{transform:translate(12px,-2px);}}
@keyframes roamFlutter{0%{transform:translate(0,0);}16%{transform:translate(-11px,-9px);}34%{transform:translate(9px,-16px);}40%{transform:translate(9px,-15px);}58%{transform:translate(16px,-3px);}78%{transform:translate(3px,-13px);}100%{transform:translate(0,0);}}
@keyframes roamPulse{0%,100%{transform:translate(0,8px);}50%{transform:translate(0,-10px);}}
@keyframes roamWalk{0%,8%{transform:translate(-48px,0);}46%,54%{transform:translate(48px,0);}92%,100%{transform:translate(-48px,0);}}
@keyframes roamCrawl{0%,100%{transform:translate(-40px,0);}50%{transform:translate(40px,0);}}
@keyframes roamSway{0%,100%{transform:rotate(-3deg);}50%{transform:rotate(3deg);}}
.face-swim,.face-walk,.face-crawl{animation:faceflip var(--dur) steps(1,end) infinite var(--delay);}
@keyframes faceflip{0%,49.99%{transform:scaleX(1);}50%,100%{transform:scaleX(-1);}}
.face-pulse{animation:bell var(--dur) ease-in-out infinite var(--delay);}
@keyframes bell{0%,100%{transform:scale(1,1);}50%{transform:scale(1.06,.86);}}
.habitat-meter{margin-top:14px;}
.habitat-meter .hm-row{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin-bottom:7px;}
.habitat-meter .hm-row b{font-family:var(--serif);color:var(--ink);}
.habitat-empty{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;text-align:center;color:#243b2c;padding:24px;font-family:var(--serif);z-index:20;}
@media(prefers-reduced-motion:reduce){.habitat-creature,.flora,.rays span,.particle{animation:none!important;}}

/* ---- Habitat curation + identify-correction controls ---- */
.curate-pill{margin-left:auto;align-self:center;border:1px solid var(--rule);background:var(--card);color:var(--ink-2);font:600 12px/1 var(--sans);letter-spacing:.02em;padding:8px 15px;border-radius:999px;cursor:pointer;transition:background .18s ease,border-color .18s ease,color .18s ease;}
.curate-pill:hover{border-color:var(--accent);color:var(--accent);}
.curate-pill.on{background:var(--accent);border-color:var(--accent);color:#08120b;}
.habitat-scene.editing .habitat-creature{cursor:pointer;}
.habitat-scene.editing .habitat-creature::after{content:"";position:absolute;top:-4px;right:-4px;width:18px;height:18px;border-radius:50%;background:#c04a3d;box-shadow:0 1px 4px rgba(0,0,0,.3);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 7l10 10M17 7L7 17' stroke='white' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E");background-size:13px;background-position:center;background-repeat:no-repeat;z-index:50;}
.habitat-scene.editing .habitat-creature{animation-play-state:paused;}
.manage-bar{display:flex;align-items:center;gap:14px;margin-top:12px;min-height:20px;}
.mb-note{font-size:12px;color:var(--muted);}
.link-btn{background:none;border:none;color:var(--accent-ink);font:600 13px/1 var(--sans);cursor:pointer;padding:4px 0;}
.link-btn:hover{text-decoration:underline;}
.gate-more{display:flex;flex-wrap:wrap;gap:16px;margin-top:16px;padding-top:14px;border-top:1px solid var(--rule);}
.gate-more .alt-box{flex:1 1 100%;display:flex;gap:8px;margin-top:8px;}
.gate-more .alt-box .search{margin:0;}
.gate-more .alt-box .btn{width:auto;margin:0;white-space:nowrap;}
.reveal-undo{display:block;margin-top:6px;color:var(--muted)!important;font-size:12px;}
@media(prefers-reduced-motion:reduce){.habitat-creature,.flora,.rays span,.particle{animation:none!important;}}

/* ---- Personalized habitats (My Places) ---- */
.places-chip{font-variant:small-caps;letter-spacing:.04em;}
.habitat-places{margin-top:6px;}
.places{display:block;}
.places-intro{color:var(--muted);font-size:13px;line-height:1.55;margin:2px 0 14px;}
.place-create{width:100%;border:1.5px dashed var(--rule);background:var(--card);color:var(--accent);font:600 14px/1 var(--sans);padding:16px;border-radius:var(--r-md);cursor:pointer;transition:background .18s ease,border-color .18s ease;margin-bottom:18px;}
.place-create:hover{border-color:var(--accent);background:var(--surface);}
.places-empty{color:var(--muted);font-size:13px;text-align:center;padding:18px;font-family:var(--serif);}
.places-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px;}
.place-card{border:1px solid var(--rule);background:var(--card);border-radius:var(--r-md);overflow:hidden;cursor:pointer;padding:0;text-align:left;transition:transform .16s ease,box-shadow .16s ease;}
.place-card:hover{transform:translateY(-2px);box-shadow:0 8px 22px rgba(0,0,0,.6), var(--glow);}
.place-thumb{height:104px;background-size:cover;background-position:center;}
.place-cap{padding:10px 12px;}
.place-name{font-family:var(--serif);color:var(--ink);font-size:14px;line-height:1.2;}
.place-sub{font-size:11px;color:var(--muted);margin-top:3px;letter-spacing:.02em;}
.place-create-stage{margin-top:16px;}
.place-detected{font-size:12px;color:var(--muted);margin-bottom:10px;text-align:center;}
.place-palette{display:flex;gap:6px;margin:12px 0;}
.place-palette span{width:26px;height:26px;border-radius:6px;border:1px solid rgba(255,255,255,.12);}
.place-preview{margin-bottom:6px;}
.place-scene{position:relative;height:62vh;min-height:380px;border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--rule);box-shadow:inset 0 2px 14px rgba(0,0,0,.5), 0 18px 44px -24px rgba(0,0,0,.9);}
.place-scene.preview{height:280px;min-height:0;}
.place-bg{position:absolute;inset:0;background-size:cover;background-position:center;filter:saturate(.9) contrast(.95) brightness(1.03);}
.place-tint{position:absolute;inset:0;pointer-events:none;}
.place-scene .habitat-creature svg{filter:drop-shadow(0 0 1.5px rgba(255,255,255,.55)) drop-shadow(0 4px 7px rgba(0,0,0,.45));}
.place-scene-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:2px 0 12px;}
.place-scene-title{font-family:var(--serif);color:var(--ink);font-size:16px;flex:1;text-align:center;}
.link-btn.danger{color:#e06a5c;}

/* ---- Per-species AI illustration hero ---- */
.ai-hero{margin:0;display:flex;flex-direction:column;align-items:center;width:100%;animation:aiFade .6s var(--ease-out);}
.ai-hero img{width:min(76%,300px);aspect-ratio:1;object-fit:contain;border-radius:16px;box-shadow:0 12px 32px rgba(0,0,0,.6), var(--glow);background:var(--card);}
.ai-shimmer{margin-top:12px;font-size:12px;color:var(--muted);font-style:italic;animation:aiPulse 1.5s ease-in-out infinite;}
@keyframes aiPulse{0%,100%{opacity:.45;}50%{opacity:1;}}
@keyframes aiFade{from{opacity:0;transform:scale(.97);}to{opacity:1;transform:scale(1);}}

/* ---- Scene engine + scientific-name toggle ---- */
.scene-art{position:absolute;inset:0;}
.scene-svg{width:100%;height:100%;display:block;}
.sp-sn-toggle{display:inline-block;margin:4px auto 0;background:none;border:none;color:var(--accent-ink);font:600 12px/1.1 var(--sans);letter-spacing:.02em;cursor:pointer;padding:6px 10px;border-radius:8px;}
.sp-sn-toggle:hover{background:rgba(255,255,255,.05);}
.sp-sn-toggle.open{font-weight:500;font-style:italic;color:var(--muted);}

/* ---- Living scene motion (gentle, ambient) ---- */
.scene-cloud{animation:sceneDriftX var(--dur,52s) ease-in-out infinite alternate;animation-delay:var(--delay,0s);}
.scene-bird{animation:sceneDriftX var(--dur,34s) ease-in-out infinite alternate;animation-delay:var(--delay,0s);}
.scene-caustic{animation:sceneDriftX var(--dur,15s) ease-in-out infinite alternate;animation-delay:var(--delay,0s);}
.scene-rays{animation:sceneShimmer var(--dur,10s) ease-in-out infinite;}
.scene-sun{animation:sceneShimmer var(--dur,7s) ease-in-out infinite;}
.scene-rooted{transform-box:fill-box;transform-origin:bottom center;animation:sceneSway var(--dur,7s) ease-in-out infinite alternate;animation-delay:var(--delay,0s);}
@keyframes sceneDriftX{from{transform:translateX(calc(-1*var(--amp,18px)));}to{transform:translateX(var(--amp,18px));}}
@keyframes sceneSway{from{transform:rotate(calc(-1*var(--deg,3deg)));}to{transform:rotate(var(--deg,3deg));}}
@keyframes sceneShimmer{0%,100%{opacity:var(--o1,.4);}50%{opacity:var(--o2,.7);}}
@media(prefers-reduced-motion:reduce){.scene-cloud,.scene-bird,.scene-caustic,.scene-rays,.scene-sun,.scene-rooted{animation:none!important;}}

/* ---- AI illustration as a living habitat sprite ---- */
.creature-art{width:100%;height:100%;object-fit:contain;display:block;filter:drop-shadow(0 4px 6px rgba(20,40,60,.32));}

/* ---- Creature size control + compare view ---- */
.size-ctl{display:flex;align-items:center;gap:12px;margin-top:10px;}
.size-ctl span{font-size:12px;color:var(--muted);white-space:nowrap;}
.size-ctl input[type=range]{flex:1;accent-color:var(--accent);height:22px;}
.compare{animation:aiFade .4s var(--ease-out);}
.compare .link-btn{margin-bottom:6px;}
.compare-name{font-family:var(--serif);font-size:22px;color:var(--ink);text-align:center;line-height:1.15;}
.compare-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 0 16px;}
.cmp{margin:0;}
.cmp img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:14px;border:1px solid var(--rule);background:var(--surface-2);display:block;}
.cmp figcaption{text-align:center;font-size:12px;color:var(--muted);margin-top:6px;letter-spacing:.02em;}
.cmp-strip{display:flex;gap:8px;overflow-x:auto;padding:8px 0 4px;-webkit-overflow-scrolling:touch;}
.cmp-strip::-webkit-scrollbar{display:none;}
.cmp-thumb{flex:0 0 auto;width:66px;height:66px;border-radius:9px;background:var(--surface-2) center/cover no-repeat;border:1px solid var(--rule);cursor:pointer;}
.compare-act{display:flex;gap:10px;margin-top:16px;}
.compare-act .btn{margin:0;flex:1;}

/* ---- Calls & sounds ---- */
.sound-body audio{width:100%;margin-top:4px;height:38px;}
.sound-cred{font-size:11px;color:var(--muted);margin-top:6px;letter-spacing:.02em;}

/* ---- Photo framer (tap to focus) ---- */
.framer{display:flex;flex-direction:column;gap:12px;align-items:stretch;}
.framer-img{position:relative;display:inline-block;max-width:100%;align-self:center;line-height:0;cursor:crosshair;}
.framer-img img{max-width:100%;max-height:46vh;border-radius:12px;display:block;}
.framer-ring{position:absolute;width:64px;height:64px;border:3px solid var(--accent);border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 0 9999px rgba(3,8,5,.4);pointer-events:none;transition:left .12s,top .12s;}

/* ---- Performance: isolate scenes, hint the compositor on moving layers ---- */
.habitat-scene,.place-scene{contain:layout paint;}
.habitat-creature,.scene-cloud,.scene-bird,.scene-caustic,.scene-rooted{will-change:transform;}

/* ---- Production interaction polish: focus, touch, reduced-motion ---- */
*{-webkit-tap-highlight-color:transparent;}
button,a,[role="button"],input,select,label,summary{touch-action:manipulation;}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px;}
:focus:not(:focus-visible){outline:none;}
.search:focus-visible,.search:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px rgba(126,217,87,.20);}
.cand-score,.rv,#hm-pct,.stat-v,.stat .v{font-variant-numeric:tabular-nums;}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}}

/* ---- Per-animal selection + resize ---- */
.habitat-creature.selected{outline:2.5px solid var(--accent);outline-offset:3px;border-radius:10px;z-index:60!important;}
.animal-ctl{width:100%;}
.animal-ctl .ac-name{font-family:var(--serif);color:var(--ink);font-size:15px;margin-bottom:8px;}
.animal-ctl .ac-row{display:flex;align-items:center;gap:12px;margin-bottom:10px;}
.animal-ctl .ac-row span{font-size:12px;color:var(--muted);}
.animal-ctl .ac-row input[type=range]{flex:1;accent-color:var(--accent);height:22px;}
.animal-ctl .ac-actions{display:flex;gap:20px;}

/* ---- Connected landscape (chained photo-habitats) ---- */
.places-hint{font-size:12px;color:var(--muted);margin:2px 0 8px;text-align:center;}
.landscape{position:relative;height:62vh;min-height:380px;border-radius:var(--r-lg);overflow-x:auto;overflow-y:hidden;border:1px solid var(--rule);scrollbar-width:none;overscroll-behavior-x:contain;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;touch-action:pan-x;box-shadow:inset 0 2px 12px rgba(0,0,0,.5);background:#0c2030;}
.landscape::-webkit-scrollbar{display:none;}
.land-world{display:flex;height:100%;width:max-content;}
.land-panel{position:relative;height:100%;width:min(86vw,440px);flex:0 0 auto;overflow:hidden;}
.land-panel.seam{margin-left:-58px;-webkit-mask-image:linear-gradient(to right,transparent 0,#000 66px,#000 100%);mask-image:linear-gradient(to right,transparent 0,#000 66px,#000 100%);}
.land-label{position:absolute;left:12px;bottom:12px;z-index:55;color:#fff;font-family:var(--serif);font-size:13px;background:rgba(6,14,9,.55);padding:5px 11px;border-radius:999px;backdrop-filter:blur(3px);box-shadow:0 2px 8px rgba(0,0,0,.25);}
.landscape-card{border:1px solid var(--rule);background:var(--card);border-radius:var(--r-md);padding:16px;margin-bottom:18px;}
.landscape-card .lc-k{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
.landscape-card .lc-t{font-family:var(--serif);color:var(--ink);font-size:16px;margin:5px 0 13px;line-height:1.25;}
.landscape-card .lc-actions{display:flex;gap:10px;flex-wrap:wrap;}
.chain-strip{display:flex;flex-direction:column;gap:8px;margin:4px 0 18px;}
.chain-item{display:flex;align-items:center;gap:11px;border:1px solid var(--rule);border-radius:10px;padding:8px;background:var(--card);}
.chain-thumb{width:56px;height:40px;border-radius:6px;background-size:cover;background-position:center;flex:0 0 auto;}
.chain-name{flex:1;font-family:var(--serif);font-size:14px;color:var(--ink);min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.chain-ctrls{display:flex;gap:12px;flex:0 0 auto;}
.chain-ctrls .link-btn{font-size:16px;padding:4px 2px;}
.place-card.added{outline:2px solid var(--accent);outline-offset:-2px;}
.land-section-h{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin:14px 0 8px;}

.version-tag{text-align:center;font-size:11px;color:var(--muted-2);letter-spacing:.1em;margin-top:18px;font-variant-numeric:tabular-nums;}

/* ---- Habitat curate: drag-to-move + masthead actions ---- */
.mast-actions{display:flex;gap:8px;flex:0 0 auto;align-items:center;}
.animal-ctl .ac-hint{font-size:11px;color:var(--muted);margin-bottom:10px;}
.habitat-scene.editing .habitat-creature{touch-action:none;cursor:grab;}
.habitat-creature.dragging{animation:none!important;transform:none!important;transition:none!important;z-index:70!important;cursor:grabbing;filter:drop-shadow(0 8px 12px rgba(0,0,0,.6));}

/* ---- Photo-habitat: vector environment, biome + creature pickers ---- */
.scene-thumb{position:relative;overflow:hidden;}
.scene-thumb .scene-svg{width:100%;height:100%;display:block;}
.scene-thumb-tint{position:absolute;inset:0;pointer-events:none;}
.biome-pick{display:flex;gap:8px;flex-wrap:wrap;margin:4px 0 14px;}
.biome-chip{border:1px solid var(--rule);background:var(--card);color:var(--ink-2);font:600 12px/1 var(--sans);padding:9px 13px;border-radius:999px;cursor:pointer;transition:background .18s,color .18s;}
.biome-chip.on{background:var(--accent);color:#08120b;border-color:var(--accent);}
.creature-picker{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 4px;max-height:188px;overflow-y:auto;}
.pick-chip{display:flex;align-items:center;gap:7px;border:1px solid var(--rule);background:var(--card);border-radius:999px;padding:6px 12px 6px 7px;font-size:12px;color:var(--muted);cursor:pointer;}
.pick-chip.on{border-color:var(--accent);color:var(--ink);background:var(--surface-2);}
.pick-sil{width:22px;height:22px;display:inline-flex;flex:0 0 auto;}
.pick-sil svg{width:100%;height:100%;}
.pick-sil svg path{fill:var(--ink-plate);}
.place-scene.editing .habitat-creature{animation-play-state:paused;touch-action:none;cursor:grab;}

/* ---- App-store tactility: press feedback + native touch handling ---- */
button,.tab,.spec,.journal,.place-card,.cat-card,.cand,.habitat-creature,.pick-chip,.biome-chip{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;}
.tab{transition:color .2s,transform .12s var(--ease-out);}
.tab:active{transform:scale(.9);}
.tab svg{transition:transform .2s var(--ease-out);}
.tab.on svg{transform:translateY(-1.5px) scale(1.08);}
.fab:active{transform:scale(.92);}
.spec,.journal,.place-card,.cat-card,.reg-item{transition:transform .14s var(--ease-out),box-shadow .18s var(--ease-out);}
.spec:active,.journal:active,.place-card:active,.cat-card:active,.reg-item:active{transform:scale(.985);}

/* ---- Generated illustration shown in cards ---- */
.plate .spec-art-img{width:84%;height:84%;object-fit:contain;filter:drop-shadow(0 3px 6px rgba(20,40,60,.2));}
.entry-plate .spec-art-img{width:76%;height:76%;}

/* ---- Canonical sticker artwork ---- */
.sticker{width:100%;height:100%;display:block;overflow:visible;}
.plate .sticker{width:86%;height:86%;filter:drop-shadow(0 3px 5px rgba(0,0,0,.28));}
.entry-plate .sticker{width:82%;height:82%;filter:drop-shadow(0 5px 10px rgba(0,0,0,.32));}
.reveal-sticker{width:80%;height:80%;display:flex;align-items:center;justify-content:center;filter:blur(7px);opacity:.55;transition:filter .7s var(--ease-out),opacity .7s var(--ease-out);}
.reveal-plate.revealed .reveal-sticker{filter:blur(0);opacity:1;}
.reveal-sticker .sticker{width:100%;height:100%;}
.habitat-creature .sticker,.creature-face .sticker{width:100%;height:100%;filter:drop-shadow(0 3px 5px rgba(0,0,0,.35));}
.sticker-hero{width:min(72%,300px);margin:6px auto 0;filter:drop-shadow(0 12px 22px rgba(0,0,0,.4));animation:aiFade .5s var(--ease-out);}
.sticker-hero .sticker{width:100%;height:auto;aspect-ratio:1;}

/* ============================================================
   WILDDEX additions — HUD, quests, leaderboards, social,
   conservation impact, events
   ============================================================ */

/* ---- Explorer HUD (level + currencies) ---- */
.hud{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:14px;}
.hud-lvl{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--rule);background:var(--surface);border-radius:999px;padding:6px 12px 6px 6px;}
.hud-lvl .lv-badge{width:26px;height:26px;border-radius:50%;background:linear-gradient(160deg,var(--accent-2),var(--accent));color:#08120b;font:700 12px/26px var(--sans);text-align:center;}
.hud-lvl .lv-bar{width:52px;height:4px;border-radius:3px;background:var(--rule-2);overflow:hidden;}
.hud-lvl .lv-bar i{display:block;height:100%;background:var(--accent);border-radius:3px;}
.hud-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--rule);background:var(--surface);border-radius:999px;padding:6px 12px;font:600 12.5px/1 var(--sans);color:var(--ink);font-variant-numeric:tabular-nums;}
.hud-chip .dot{width:14px;height:14px;border-radius:50%;display:inline-block;flex:0 0 auto;}
.hud-chip.coin .dot{background:radial-gradient(circle at 35% 30%,var(--gold-2),var(--gold) 70%);box-shadow:0 0 8px rgba(217,164,65,.5);}
.hud-chip.gem .dot{background:radial-gradient(circle at 35% 30%,#9fe4f5,var(--gem) 70%);border-radius:4px;transform:rotate(45deg);box-shadow:0 0 8px rgba(91,201,232,.5);}
.hud-chip.leaf .dot{background:radial-gradient(circle at 35% 30%,var(--accent-2),#4ea63a 75%);border-radius:50% 4px 50% 50%;box-shadow:0 0 8px rgba(126,217,87,.5);}
.hud-chip .plus{color:var(--accent-ink);font-weight:700;}

/* ---- Daily challenges / quests ---- */
.quest-card{border:1px solid var(--rule);border-radius:var(--r-lg);background:var(--paper);padding:16px 18px;margin-bottom:12px;}
.quest-card .q-head{display:flex;justify-content:space-between;align-items:baseline;gap:10px;}
.quest-card .q-k{font-size:10.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-ink);}
.quest-card .q-timer{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums;}
.q-row{display:flex;align-items:center;gap:13px;padding:13px 0;border-bottom:1px solid var(--rule-2);}
.q-row:last-child{border-bottom:none;padding-bottom:2px;}
.q-ico{width:38px;height:38px;border-radius:12px;background:var(--surface-2);display:flex;align-items:center;justify-content:center;flex:0 0 auto;font-size:17px;}
.q-row.done .q-ico{background:rgba(126,217,87,.16);}
.q-main{flex:1;min-width:0;}
.q-t{font-size:13.5px;font-weight:600;color:var(--ink);line-height:1.25;}
.q-row.done .q-t{color:var(--muted);text-decoration:line-through;text-decoration-color:rgba(126,217,87,.6);}
.q-sub{display:flex;align-items:center;gap:8px;margin-top:5px;}
.q-sub .bar{flex:1;height:3px;}
.q-sub .q-n{font-size:10.5px;color:var(--muted);font-variant-numeric:tabular-nums;white-space:nowrap;}
.q-reward{flex:0 0 auto;text-align:right;}
.q-reward .q-amt{font:700 13px/1 var(--sans);color:var(--gold-2);white-space:nowrap;}
.q-reward .q-lbl{font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:3px;}
.q-claim{border:none;border-radius:999px;background:linear-gradient(160deg,var(--gold-2),var(--gold));color:#1a1206;font:700 11.5px/1 var(--sans);padding:9px 14px;box-shadow:0 6px 16px -8px rgba(217,164,65,.7);animation:claimPulse 1.6s ease-in-out infinite;}
@keyframes claimPulse{0%,100%{transform:scale(1);}50%{transform:scale(1.06);}}
.q-check{color:var(--accent);font-weight:700;font-size:15px;}
.streak-flame{display:inline-flex;align-items:center;gap:6px;color:var(--gold-2);font:700 12px/1 var(--sans);}

/* ---- Leaderboards ---- */
.lb-tabs{display:flex;gap:8px;overflow-x:auto;margin:14px -22px 16px;padding:0 22px 4px;-webkit-overflow-scrolling:touch;}
.lb-tabs::-webkit-scrollbar{display:none;}
.lb-tab{flex:0 0 auto;border:1px solid var(--rule);background:var(--surface);color:var(--muted);font:600 12px/1 var(--sans);padding:9px 14px;border-radius:999px;cursor:pointer;transition:background .18s,color .18s,border-color .18s;white-space:nowrap;}
.lb-tab.on{background:var(--accent);color:#08120b;border-color:var(--accent);}
.lb{display:flex;flex-direction:column;gap:8px;}
.lb-row{display:flex;align-items:center;gap:12px;border:1px solid var(--rule);background:var(--paper);border-radius:14px;padding:11px 14px;cursor:pointer;transition:transform .14s var(--ease-out),border-color .2s,box-shadow .2s;}
.lb-row:active{transform:scale(.985);}
@media(hover:hover){.lb-row:hover{border-color:rgba(126,217,87,.35);box-shadow:var(--glow);}}
.lb-row.me{border-color:var(--accent);background:linear-gradient(90deg,rgba(126,217,87,.10),var(--paper) 60%);cursor:default;}
.lb-rank{width:30px;text-align:center;font-family:var(--serif);font-size:15px;color:var(--muted);font-variant-numeric:tabular-nums;flex:0 0 auto;}
.lb-rank.top1{color:var(--gold-2);font-size:18px;} .lb-rank.top2{color:#c9d4dc;font-size:16px;} .lb-rank.top3{color:#c98d5a;font-size:16px;}
.lb-main{flex:1;min-width:0;}
.lb-name{font-size:13.5px;font-weight:600;color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;display:flex;align-items:center;gap:7px;}
.lb-sub{font-size:11px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lb-score{font-family:var(--serif);font-size:16px;color:var(--ink);font-variant-numeric:tabular-nums;flex:0 0 auto;}
.lb-score small{display:block;font-family:var(--sans);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);text-align:right;margin-top:2px;}

/* ---- Avatars & presence ---- */
.avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:700 15px/1 var(--sans);color:#08120b;flex:0 0 auto;position:relative;background:var(--surface-2);}
.avatar.lg{width:64px;height:64px;font-size:24px;}
.avatar .presence{position:absolute;right:-1px;bottom:-1px;width:11px;height:11px;border-radius:50%;background:#67e08a;border:2.5px solid var(--bg);}
.avatar .presence.off{background:var(--muted-2);}
.online-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#67e08a;box-shadow:0 0 6px rgba(103,224,138,.8);flex:0 0 auto;}

/* ---- Visit a player's habitat ---- */
.visit-head{display:flex;align-items:center;gap:14px;margin:6px 0 4px;}
.visit-head .vh-main{flex:1;min-width:0;}
.visit-name{font-family:var(--serif);font-size:22px;font-weight:600;line-height:1.1;}
.visit-sub{font-size:11.5px;color:var(--muted);margin-top:3px;}
.visit-stats{display:flex;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin:16px 0;}
.visit-stats .vs{flex:1;text-align:center;padding:12px 4px;border-right:1px solid var(--rule-2);}
.visit-stats .vs:last-child{border-right:none;}
.visit-stats .v{font-family:var(--serif);font-size:17px;font-weight:600;font-variant-numeric:tabular-nums;}
.visit-stats .k{font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted);margin-top:3px;}
.visit-act{display:flex;gap:10px;margin-top:14px;}
.visit-act .btn{margin:0;flex:1;}
.guest-note{font-size:11.5px;color:var(--muted);text-align:center;margin-top:12px;font-style:italic;}

/* ---- Conservation impact ---- */
.impact-card{position:relative;overflow:hidden;border:1px solid rgba(126,217,87,.4);border-radius:var(--r-lg);padding:20px;background:linear-gradient(140deg,#12291a 0%,#0e2115 55%,#102a2a 100%);box-shadow:var(--glow);}
.impact-card::after{content:"";position:absolute;right:-30px;top:-30px;width:140px;height:140px;border-radius:50%;background:radial-gradient(circle,rgba(126,217,87,.22),transparent 70%);pointer-events:none;}
.impact-k{font-size:10.5px;letter-spacing:.24em;text-transform:uppercase;color:var(--accent-2);}
.impact-t{font-family:var(--serif);font-size:22px;font-weight:600;margin-top:8px;line-height:1.2;}
.impact-t b{color:var(--accent-2);}
.impact-s{font-size:12.5px;color:var(--ink-2);margin-top:6px;line-height:1.55;}
.impact-row{display:flex;gap:10px;margin-top:14px;}
.impact-row .btn{margin:0;}

/* ---- Live events banner ---- */
.event-banner{display:flex;align-items:center;gap:13px;border:1px solid rgba(91,201,232,.35);border-radius:var(--r-lg);background:linear-gradient(120deg,#0e1c24,#10242e);padding:14px 16px;margin-bottom:14px;}
.event-banner .ev-ico{width:40px;height:40px;border-radius:12px;background:rgba(91,201,232,.14);display:flex;align-items:center;justify-content:center;font-size:19px;flex:0 0 auto;}
.event-banner .ev-t{font-size:13.5px;font-weight:700;color:var(--ink);}
.event-banner .ev-s{font-size:11.5px;color:#9fc6d4;margin-top:3px;line-height:1.4;}
.event-banner .ev-live{margin-left:auto;flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;font:700 9.5px/1 var(--sans);letter-spacing:.14em;color:#67e08a;text-transform:uppercase;}

/* ---- Friend cards ---- */
.friend-grid{display:flex;flex-direction:column;gap:10px;}
.friend-card{display:flex;align-items:center;gap:13px;border:1px solid var(--rule);background:var(--paper);border-radius:14px;padding:12px 14px;cursor:pointer;transition:transform .14s var(--ease-out),border-color .2s,box-shadow .2s;}
.friend-card:active{transform:scale(.985);}
@media(hover:hover){.friend-card:hover{border-color:rgba(126,217,87,.35);box-shadow:var(--glow);}}
.friend-main{flex:1;min-width:0;}
.friend-n{font-size:14px;font-weight:600;display:flex;align-items:center;gap:7px;}
.friend-s{font-size:11.5px;color:var(--muted);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.friend-visit{border:1px solid var(--rule);background:var(--surface);color:var(--accent-ink);font:600 11.5px/1 var(--sans);padding:8px 13px;border-radius:999px;flex:0 0 auto;}

/* ---- Connected-world panel tints (time of day) ---- */
.land-tint{position:absolute;inset:0;pointer-events:none;z-index:40;}
.land-tint.day{background:none;}
.land-tint.dawn{background:linear-gradient(180deg,rgba(255,205,150,.16),transparent 60%);}
.land-tint.dusk{background:linear-gradient(180deg,rgba(255,150,100,.14),rgba(50,40,75,.16));}
.land-tint.night{background:linear-gradient(180deg,rgba(22,32,60,.5),rgba(15,25,48,.32));}

/* ---- Weather & atmosphere layers ---- */
.weather,.weather-mist{position:absolute;inset:0;pointer-events:none;z-index:38;overflow:hidden;}
.weather span{position:absolute;top:-8%;display:block;}
.weather-rain span{width:1.5px;height:15px;background:linear-gradient(rgba(205,228,242,0),rgba(205,228,242,.55));animation:wfall var(--fd) linear infinite var(--fdel);}
.weather-snow span{width:4px;height:4px;border-radius:50%;background:rgba(255,255,255,.8);animation:wfall var(--fd) linear infinite var(--fdel);}
.weather-leaf span{width:7px;height:7px;border-radius:1px 5px 1px 5px;opacity:.8;animation:wleaf var(--fd) linear infinite var(--fdel);}
@keyframes wfall{to{transform:translate(var(--drift,0),68vh);}}
@keyframes wleaf{0%{transform:translate(0,0) rotate(0deg);}100%{transform:translate(var(--drift,20px),68vh) rotate(300deg);}}
.weather-mist span{position:absolute;left:-45%;width:72%;height:15%;background:radial-gradient(ellipse at center,rgba(255,255,255,.32),transparent 70%);filter:blur(7px);animation:wmist var(--dur,40s) linear infinite var(--delay,0s);}
@keyframes wmist{to{transform:translateX(240%);}}
@media(prefers-reduced-motion:reduce){.weather span,.weather-mist span{animation:none!important;}}

/* ---- Movement variety: alternate travel paths per behaviour ---- */
.roam-swim.alt{animation-name:roamSwimB;}
.roam-fly.alt{animation-name:roamFlyB;}
.roam-walk.alt{animation-name:roamWalkB;}
.roam-flutter.alt{animation-name:roamFlutterB;}
.roam-crawl.alt{animation-name:roamCrawlB;}
@keyframes roamSwimB{0%,100%{transform:translate(58px,-10px);}22%{transform:translate(-8px,14px);}47%{transform:translate(-70px,-4px);}72%{transform:translate(-16px,-22px);}}
@keyframes roamFlyB{0%,100%{transform:translate(80px,-6px);}30%{transform:translate(10px,16px);}55%{transform:translate(-84px,-10px);}80%{transform:translate(-8px,-24px);}}
@keyframes roamWalkB{0%,10%{transform:translate(40px,0);}44%,60%{transform:translate(-46px,0);}94%,100%{transform:translate(40px,0);}}
@keyframes roamFlutterB{0%,100%{transform:translate(0,0);}18%{transform:translate(12px,-12px);}42%{transform:translate(-8px,-18px);}60%{transform:translate(-16px,-4px);}82%{transform:translate(6px,-10px);}}
@keyframes roamCrawlB{0%,12%,100%{transform:translate(34px,0);}55%,64%{transform:translate(-36px,0);}}

/* ---- Living World: "Today in the Wild" spread ---- */
.today{border:1px solid var(--rule);border-radius:var(--r-lg);background:linear-gradient(160deg,var(--paper-2),var(--paper));padding:16px 16px 6px;margin:14px 0 2px;position:relative;overflow:hidden;}
.today::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.9;}
.today.spring::before{background:radial-gradient(120% 80% at 12% 0%,rgba(126,200,120,.14),transparent 55%);}
.today.summer::before{background:radial-gradient(120% 80% at 12% 0%,rgba(240,210,90,.14),transparent 55%);}
.today.autumn::before{background:radial-gradient(120% 80% at 12% 0%,rgba(224,140,60,.16),transparent 55%);}
.today.winter::before{background:radial-gradient(120% 80% at 12% 0%,rgba(150,190,230,.16),transparent 55%);}
.today-head{display:flex;align-items:center;gap:10px;position:relative;}
.today-when{font:700 13.5px/1 var(--sans);color:var(--ink);letter-spacing:.01em;}
.today-dot{width:4px;height:4px;border-radius:50%;background:var(--muted-2);}
.today-note{font-family:var(--serif);font-size:14.5px;line-height:1.5;color:var(--ink-2);margin:9px 2px 12px;position:relative;text-wrap:pretty;}
.today-rail{margin:0 -16px;padding:2px 16px 10px;}
.today-rail .today-card{flex:0 0 116px;}
.today-card .plate{aspect-ratio:1;}
.today-card .spec-sci{text-transform:capitalize;font-style:normal;letter-spacing:.02em;color:var(--muted);}

/* ---- Seasonal veil over land habitats ---- */
.season-veil{position:absolute;inset:0;pointer-events:none;z-index:37;mix-blend-mode:soft-light;}
.season-veil.spring{background:linear-gradient(180deg,rgba(150,220,150,.10),rgba(120,190,130,.06));}
.season-veil.summer{background:linear-gradient(180deg,rgba(255,235,160,.10),transparent 60%);}
.season-veil.autumn{background:linear-gradient(180deg,rgba(230,150,70,.14),rgba(200,120,50,.08));}
.season-veil.winter{background:linear-gradient(180deg,rgba(180,210,240,.16),rgba(150,185,225,.10));}
@media(prefers-reduced-motion:reduce){.today::before{opacity:.7;}}

/* ---- Ecosystem resources (harvest + grow habitats) ---- */
.eco-bar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0 2px;position:relative;}
.eco-chip{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--rule);background:var(--surface);border-radius:999px;padding:6px 12px 6px 8px;font:700 12.5px/1 var(--sans);color:var(--ink);font-variant-numeric:tabular-nums;}
.eco-chip .res-dot{font-size:13px;line-height:1;}
.eco-chip.seeds{border-color:rgba(217,164,65,.4);} .eco-chip.nectar{border-color:rgba(232,122,158,.4);} .eco-chip.plankton{border-color:rgba(91,201,232,.4);}
.eco-harvest{margin-left:auto;border:1px solid var(--rule);background:var(--surface);color:var(--muted);font:700 12.5px/1 var(--sans);padding:9px 15px;border-radius:999px;transition:transform .14s var(--ease-out),background .2s,color .2s,box-shadow .2s;}
.eco-harvest.ready{background:linear-gradient(160deg,var(--accent-2),var(--accent));color:#08120b;border-color:var(--accent);box-shadow:0 8px 20px -10px rgba(126,217,87,.6);animation:claimPulse 1.8s ease-in-out infinite;}
.eco-harvest.ready:active{transform:scale(.96);} .eco-harvest:disabled{opacity:.8;}
.eco-float{position:absolute;right:16px;top:-6px;font:800 18px/1 var(--sans);color:var(--accent-2);pointer-events:none;animation:ecoFloat .9s var(--ease-out) forwards;text-shadow:0 2px 8px rgba(0,0,0,.5);}
@keyframes ecoFloat{from{opacity:0;transform:translateY(6px) scale(.8);}30%{opacity:1;transform:translateY(-4px) scale(1);}to{opacity:0;transform:translateY(-26px) scale(1);}}
.grow-row{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:12px;min-height:22px;}
.grow-label{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);}
.grow-stars{display:inline-flex;gap:3px;} .grow-stars .gs{color:var(--rule);font-size:14px;} .grow-stars .gs.on{color:var(--gold-2);text-shadow:0 0 8px rgba(217,164,65,.5);}
.eco-grow{border:1px solid var(--rule);background:var(--surface);color:var(--muted);font:700 12px/1 var(--sans);padding:8px 14px;border-radius:999px;transition:transform .14s var(--ease-out),background .2s,color .2s;}
.eco-grow.ready{background:linear-gradient(160deg,var(--gold-2),var(--gold));color:#1a1206;border-color:var(--gold);box-shadow:0 8px 18px -10px rgba(217,164,65,.6);}
.eco-grow.ready:active{transform:scale(.96);} .eco-grow:disabled{opacity:.6;}
.grow-hint{font-size:11px;color:var(--muted);} .grow-max{font:700 12px/1 var(--sans);color:var(--gold-2);}

/* ---- Reveal: coin reward chip ---- */
.reveal-coins{display:inline-flex;align-items:center;gap:7px;margin-top:12px;border:1px solid rgba(217,164,65,.4);background:rgba(217,164,65,.10);border-radius:999px;padding:7px 14px;font:700 12.5px/1 var(--sans);color:var(--gold-2);font-variant-numeric:tabular-nums;}
.reveal-coins .dot{width:13px;height:13px;border-radius:50%;background:radial-gradient(circle at 35% 30%,var(--gold-2),var(--gold) 70%);box-shadow:0 0 8px rgba(217,164,65,.5);}

/* ---- Appended: gentle floating bob for lily pads / drifting surface props ---- */
.scene-bob{animation:sceneBobY var(--dur,6s) ease-in-out infinite alternate;animation-delay:var(--delay,0s);}
@keyframes sceneBobY{from{transform:translateY(calc(-1*var(--amp,3px)));}to{transform:translateY(var(--amp,3px));}}
@media(prefers-reduced-motion:reduce){.scene-bob{animation:none!important;}}
