/* Eli's World — round 2 (client feedback 2026-10-13): profile & settings, Dream Land, Hero Hall, Treasury */
/* ── profile & settings ── */
.w-set2 .s2-scroll{position:absolute;left:0;right:0;top:96px;bottom:0;overflow-y:auto;padding:0 18px 40px;scrollbar-width:none}
.w-set2 .s2-scroll::-webkit-scrollbar{display:none}
.s2-av{display:flex;flex-direction:column;align-items:center;gap:6px;margin:4px 0 14px}
.s2-av .ph{position:relative;width:104px;height:104px;border-radius:50%;cursor:pointer}
.s2-av .ph img{width:100%;height:100%;border-radius:50%;object-fit:cover;background:#F1ECE6;box-shadow:0 0 0 4px #fff,0 0 0 6px #F6C343,0 10px 22px rgba(30,40,60,.18)}
.s2-av .cam{position:absolute;right:-2px;bottom:-2px;width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--wi);color:#fff;box-shadow:0 0 0 3px #fff}
.s2-av .cam svg{width:18px;height:18px}
.s2-av .chg{font:600 12px var(--f);color:#7A746E}
.s2-av .cid{display:flex;align-items:center;gap:6px;height:28px;padding:0 12px;border-radius:14px;background:#fff;font:700 12px var(--f);color:#7A746E;box-shadow:0 0 0 1px #ECE6DE}
.s2-av .cid b{font:700 14px var(--num);color:var(--wi);letter-spacing:.08em}
.s2-card{padding:6px 16px 14px;border-radius:22px;background:#fff;box-shadow:0 0 0 1px rgba(226,221,212,.9),0 8px 18px rgba(40,40,30,.08)}
.s2-f{position:relative;display:block;padding-top:12px}
.s2-f>span{display:block;margin:0 0 6px 2px;font:800 12.5px var(--f);color:#1B2357}
.s2-f input,.s2-f textarea{display:block;width:100%;padding:0 14px;border:0;border-radius:14px;background:#F4F0EA;font:500 14px/1.5 var(--f);color:#1B2357;outline:none;box-shadow:0 0 0 1.5px transparent inset;transition:box-shadow .2s,background .2s}
.s2-f input{height:46px}
.s2-f textarea{padding:10px 14px;resize:none}
.s2-f input:focus,.s2-f textarea:focus{background:#fff;box-shadow:0 0 0 1.5px var(--wi) inset}
.s2-f em{position:absolute;right:10px;bottom:6px;font:600 10.5px var(--f);font-style:normal;color:#A39C94}
.s2-age{display:flex;align-items:baseline;gap:6px;margin-top:10px;padding:10px 14px;border-radius:14px;background:#EEF1FF}
.s2-age span{font:700 12.5px var(--f);color:#5C6699}
.s2-age b{font:700 26px var(--num);color:var(--wi);line-height:1}
.s2-age small{margin-left:auto;font:600 11.5px var(--f);color:#7A80A6}
.s2-seg{display:flex;gap:6px;padding:4px;border-radius:16px;background:#ECE7DF}
.s2-seg button{flex:1;height:42px;border:0;border-radius:12px;background:none;font:800 14px var(--f);color:#5C5651}
.s2-seg button.on{background:#fff;color:var(--wi);box-shadow:0 2px 6px rgba(30,30,30,.12)}
.s2-save{display:block;width:100%;height:54px;margin-top:18px;border:0;border-radius:27px;background:var(--wi);color:#fff;font:800 16px var(--f);box-shadow:0 4px 0 #1A2672,0 10px 20px rgba(42,59,156,.25)}
.s2-out{display:block;width:100%;height:48px;margin-top:12px;border:0;border-radius:24px;background:#fff;color:#E8453C;font:800 15px var(--f);box-shadow:0 0 0 1.5px #F3C9C5 inset}
/* ── Hero Hall v2 ── */
.pg.w-hall2{background:#F7F2EA}
.h2-bg{position:absolute;inset:0;background:linear-gradient(180deg,#5468DA 0%,#8F86EC 22%,#D9CFF3 40%,#F4EEEA 56%,#F7F2EA 100%);overflow:hidden}
.h2-bg .cf{position:absolute;width:8px;height:13px;border-radius:2px;background:var(--c);transform:rotate(var(--r));opacity:.85;animation:h2Cf 5s ease-in-out infinite}
@keyframes h2Cf{50%{transform:rotate(calc(var(--r) + 40deg)) translateY(8px)}}
.h2-head{position:absolute;left:0;right:0;top:52px;display:flex;align-items:center;justify-content:center;gap:8px;z-index:3}
.h2-head .lg{width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff;box-shadow:0 4px 10px rgba(30,40,120,.25)}
.h2-head .lg .wlogo{width:24px;height:26px}
.h2-head b{font:800 30px var(--f);color:#1E2A7E;-webkit-text-stroke:7px #fff;paint-order:stroke fill;letter-spacing:-.01em;filter:drop-shadow(0 3px 4px rgba(30,40,120,.25))}
.h2-head img{width:46px;height:46px;object-fit:contain;filter:drop-shadow(0 3px 4px rgba(30,40,120,.25))}
.w-hall2 .hd-spk{position:absolute;z-index:4}
.h2-seg{position:absolute;left:50%;top:106px;width:232px;margin-left:-116px;height:40px;padding:4px;border-radius:20px;background:#fff;display:flex;z-index:3;box-shadow:0 4px 12px rgba(30,40,120,.18)}
.h2-seg button{position:relative;z-index:1;flex:1;border:0;background:none;font:800 13.5px var(--f);color:#5C5651;transition:color .3s}
.h2-seg button.on{color:#fff}
.h2-seg .ind{position:absolute;left:4px;top:4px;bottom:4px;width:calc(50% - 4px);border-radius:16px;background:linear-gradient(180deg,#3A5BDA,#2341BC);transition:transform .35s var(--spring)}
.h2-seg.all .ind{transform:translateX(100%)}
.h2-pod{position:absolute;left:0;width:390px;top:156px;height:206px;z-index:2}
.h2-pod .rays{position:absolute;left:50%;top:60px;width:340px;height:340px;margin:-170px;border-radius:50%;background:repeating-conic-gradient(rgba(255,255,255,.5) 0 8deg,transparent 8deg 20deg);-webkit-mask:radial-gradient(closest-side,#000 25%,transparent 70%);mask:radial-gradient(closest-side,#000 25%,transparent 70%);animation:spin 30s linear infinite}
.h2-p{position:absolute;bottom:0;cursor:pointer}
.h2-p.p1{left:135px;width:120px}.h2-p.p2{left:24px;width:104px}.h2-p.p3{left:262px;width:104px}
.h2-p .av{position:absolute;left:50%;border-radius:50%;background:#fff;padding:4px;box-shadow:0 6px 14px rgba(30,40,120,.25)}
.h2-p .av img{display:block;width:100%;height:100%;border-radius:50%;object-fit:cover;background:#EEF1FF}
.h2-p.p1 .av{width:90px;height:90px;margin-left:-45px;bottom:92px}
.h2-p.p2 .av,.h2-p.p3 .av{width:74px;height:74px;margin-left:-37px;bottom:70px}
.h2-p .cr{position:absolute;left:50%;bottom:176px;width:46px;margin-left:-23px;z-index:2;filter:drop-shadow(0 2px 3px rgba(0,0,0,.2))}
.h2-p .md{position:absolute;left:50%;z-index:3;width:32px;height:32px;margin-left:-16px;border-radius:50%;display:grid;place-items:center;font:800 16px var(--num);font-style:normal;color:#fff;box-shadow:0 0 0 3px #fff,0 3px 6px rgba(0,0,0,.2)}
.h2-p.p1 .md{bottom:78px;background:linear-gradient(180deg,#FFD563,#E9A31A)}
.h2-p.p2 .md{bottom:56px;background:linear-gradient(180deg,#E3E7EF,#9FA8BB)}
.h2-p.p3 .md{bottom:56px;background:linear-gradient(180deg,#F2B788,#C47A45)}
.h2-p .ped{position:absolute;left:0;right:0;bottom:0;border-radius:0 0 14px 14px}
.h2-p.p1 .ped{height:90px;background:linear-gradient(180deg,#FFD05A,#E9A31A)}
.h2-p.p2 .ped{height:68px;background:linear-gradient(180deg,#E6EAF2,#AAB2C4)}
.h2-p.p3 .ped{height:56px;background:linear-gradient(180deg,#F1B484,#C47A45)}
.h2-p .ped .top{position:absolute;left:0;right:0;top:-9px;height:18px;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:inset 0 -3px 0 rgba(0,0,0,.06)}
.h2-p .nm{position:absolute;left:6px;right:6px;bottom:8px;padding:4px 2px;border-radius:12px;background:#fff;text-align:center;box-shadow:0 2px 5px rgba(0,0,0,.12)}
.h2-p .nm b{display:block;font:800 12px var(--f);color:#1B2357}
.h2-p .nm span{font:700 11px var(--num);color:#2C4BC6}
.h2-list{position:absolute;left:14px;width:362px;top:372px;bottom:108px;z-index:3;display:flex;flex-direction:column;border-radius:24px;background:#fff;box-shadow:0 0 0 1px rgba(226,221,212,.9),0 10px 24px rgba(40,40,60,.12)}
.h2-lh{display:flex;align-items:center;gap:8px;padding:12px 16px 6px}
.h2-lh b{font:800 15px var(--f);color:#1E2A7E}
.h2-lh .bars{display:flex;align-items:flex-end;gap:2px;height:16px}
.h2-lh .bars i{width:5px;border-radius:2px;background:#F6C343}
.h2-lh .bars i:nth-child(1){height:7px}.h2-lh .bars i:nth-child(2){height:11px;background:#F28C28}.h2-lh .bars i:nth-child(3){height:16px;background:#E8453C}
.h2-rows{flex:1;overflow-y:auto;padding:0 8px 10px;scrollbar-width:none}
.h2-rows::-webkit-scrollbar{display:none}
.h2-row{display:flex;align-items:center;gap:8px;height:54px;margin-top:6px;padding:0 8px;border-radius:16px;background:#FBF9F6;box-shadow:0 0 0 1px #EFEAE3;animation:rise .4s var(--ease) both}
.h2-row .rk{flex:none;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;background:#EFEAE3;font:800 13px var(--num);color:#1B2357}
.h2-row .av{flex:none;width:38px;height:38px;border-radius:50%;overflow:hidden;box-shadow:0 0 0 2px #fff,0 2px 5px rgba(0,0,0,.12)}
.h2-row .av img{width:100%;height:100%;object-fit:cover}
.h2-row .mid{flex:1;min-width:0}
.h2-row .mid b{display:block;font:800 13px var(--f);color:#1B2357;margin-bottom:5px}
.h2-row .bar{display:block;height:7px;border-radius:4px;background:#ECE6DE;overflow:hidden}
.h2-row .bar i{display:block;height:100%;width:0;border-radius:4px;background:linear-gradient(90deg,#F6C343,#F28C28);transition:width 1s var(--ease)}
.h2-row .lp{flex:none;width:48px;text-align:right;font:800 14px var(--num);color:#1B2357}
.h2-row .ht{flex:none;display:flex;align-items:center;gap:4px;height:32px;padding:0 10px;border:0;border-radius:16px;background:#fff;font:700 11.5px var(--f);color:#1B2357;box-shadow:0 0 0 1px #F0D9DE,0 2px 5px rgba(0,0,0,.08)}
.h2-row .ht svg{width:16px;height:16px;color:#F05A7E}
.h2-row .ht.on{background:#FFE8EE;color:#D23F67}
.h2-row.me{background:linear-gradient(180deg,#3A5BDA,#2341BC);box-shadow:0 4px 0 #1A2F92,0 6px 14px rgba(42,59,156,.3)}
.h2-row.me .rk{background:#fff;color:#2341BC}
.h2-row.me .mid b,.h2-row.me .lp{color:#fff}
.h2-row.me .bar{background:rgba(255,255,255,.25)}
.h2-row .you{flex:none;height:26px;padding:0 10px;border-radius:13px;display:grid;place-items:center;background:#F6C343;font:800 11.5px var(--f);color:#2A2150}
.h2-inv{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;height:46px;margin-top:10px;border-radius:23px;background:#F4F6FF;border:2px dashed #9DAAE8;font:800 13.5px var(--f);color:#2C4BC6}
.h2-inv svg{width:20px;height:20px}
/* Dream Land: no bedtime button, no good/bad verdict on sleep quality */
.dr-panel{top:calc(var(--H,844px) - 214px)!important;height:94px!important}
/* ── Treasury: new top banner + an e-commerce style cart bar ── */
.tr-ban{position:absolute;left:14px;top:90px;width:362px;height:150px;border-radius:22px;overflow:hidden;background:#FFF4D6;box-shadow:0 0 0 1px rgba(236,214,160,.8),0 8px 18px rgba(200,150,40,.18)}
.tr-ban img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%}
.tr-ban .tx{position:absolute;left:16px;top:22px;width:150px}
.tr-ban b{display:block;font:800 21px/1.25 var(--f);color:#1E2A7E;-webkit-text-stroke:4px #fff;paint-order:stroke fill}
.tr-ban span{display:block;margin-top:8px;font:700 11px/1.45 var(--f);color:#8A5A12}
.w-tr .tr-tabs{top:var(--tt,250px)!important}
.tr-cart2{position:absolute;left:10px;width:370px;height:62px;z-index:6;display:flex;align-items:center;gap:10px;padding:0 8px 0 14px;border-radius:22px;background:#fff;
  box-shadow:0 0 0 1px rgba(226,221,212,.95),0 -2px 0 rgba(255,255,255,.6) inset,0 10px 24px rgba(30,40,60,.18);transition:transform .45s var(--spring)}
.tr-cart2.bump{animation:hop .5s var(--spring)}
.tr-cart2 .ci{position:relative;flex:none;width:40px;height:40px;border-radius:14px;display:grid;place-items:center;background:#EEF1FF}
.tr-cart2 .ci .mk{width:26px;height:21px;filter:brightness(0) saturate(100%) invert(19%) sepia(64%) saturate(2200%) hue-rotate(225deg)}
.tr-cart2 .ci b{position:absolute;right:-5px;top:-5px;min-width:19px;height:19px;padding:0 5px;border-radius:10px;background:#E8453C;color:#fff;font:800 11px var(--num);display:grid;place-items:center;box-shadow:0 0 0 2px #fff}
.tr-cart2.empty .ci b{background:#B8B2AA}
.tr-cart2 .tx{flex:none;display:flex;flex-direction:column;line-height:1.2}
.tr-cart2 .tx>span{font:600 11px var(--f);color:#7A746E}
.tr-cart2 .tx b{font:800 17px var(--num);color:#1B2357}
.tr-cart2 .tx b i{font-style:normal}
.tr-cart2 .tx small{font:700 11px var(--f);color:#7A746E}
.tr-cart2.over .tx b{color:#E8453C}
.tr-cart2 .th{flex:1;display:flex;justify-content:flex-end;min-width:0}
.tr-cart2 .th img{width:30px;height:30px;margin-left:-8px;border-radius:9px;object-fit:contain;background:#F7F4EF;box-shadow:0 0 0 2px #fff}
.tr-cart2 .cta{flex:none;height:46px;padding:0 18px;border:0;border-radius:16px;background:linear-gradient(180deg,#F79A3A,#E8562F);color:#fff;font:800 15px var(--f);box-shadow:0 3px 0 #C2421F,0 6px 12px rgba(232,86,47,.3)}
.tr-cart2.empty .cta{background:#D9D3CA;box-shadow:0 3px 0 #BDB6AB;color:#fff}
/* round 2b: short phones (browser toolbars showing) */
.h2-top{position:absolute;left:0;top:0;width:390px;height:372px;transform-origin:50% 0;z-index:3}
.tr-ban b{font-size:clamp(17px,4.6vw,21px)}
.tr-ban.sm span{display:none}
.tr-ban.sm .tx{top:50%;transform:translateY(-50%)}
.tr-ban .tx{width:136px}
.tr-ban span{font-size:10px}

/* Hero Hall · Life Power logic (w_hall2.js): tier ring on every avatar, level chip, pinned Eternal Legend, streak badge, note */
.av.t-sprout0{--ring:#E4E0D8}.av.t-sprout{--ring:#8FD46E}.av.t-vibrant{--ring:#5EC2F0}.av.t-guardian{--ring:#3A5BDA}.av.t-champion{--ring:#F6B500}.av.t-eternal{--ring:#F6C343}
.h2-row .av{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--ring,#fff),0 2px 5px rgba(0,0,0,.12);cursor:pointer}
.h2-p .av{box-shadow:0 0 0 3px var(--ring,#fff),0 6px 14px rgba(30,40,120,.25)}
.h2-p .av.t-champion{box-shadow:0 0 0 3px var(--ring),0 0 16px 2px rgba(246,181,0,.55),0 6px 14px rgba(30,40,120,.25)}
.h2-p .av.t-eternal{animation:h2LegP 2.4s ease-in-out infinite}
@keyframes h2LegP{0%,100%{box-shadow:0 0 0 3px #F6C343,0 6px 14px rgba(30,40,120,.25)}50%{box-shadow:0 0 0 3px #FFE08A,0 0 18px 5px rgba(246,195,67,.75),0 6px 14px rgba(30,40,120,.25)}}
.h2-row .av.t-eternal,.h2-leg .av{animation:h2Leg 2.4s ease-in-out infinite}
@keyframes h2Leg{0%,100%{box-shadow:0 0 0 2px #fff,0 0 0 4px #F6C343}50%{box-shadow:0 0 0 2px #fff,0 0 0 4px #FFE08A,0 0 12px 4px rgba(246,195,67,.7)}}
.h2-p.me .nm{background:#2341BC}.h2-p.me .nm b,.h2-p.me .nm span{color:#fff}
.h2-row .mid b{display:flex;align-items:center;gap:5px;white-space:nowrap}
.h2-row .mid .nmx{min-width:0;overflow:hidden;text-overflow:ellipsis}
.lvc{flex:none;height:16px;padding:0 6px;border-radius:8px;display:inline-grid;place-items:center;font:800 10px/1 var(--num);color:#fff;background:#9AA3B8}
.lvc.t-sprout{background:#5FB648}.lvc.t-vibrant{background:#2FA4DB}.lvc.t-guardian{background:#3A5BDA}.lvc.t-champion{background:#E9A31A}.lvc.t-eternal{background:linear-gradient(90deg,#F6C343,#F28C28)}
.h2-row.me .lvc{box-shadow:0 0 0 1.5px #fff}
.h2-row .you{display:flex;align-items:center;gap:3px;white-space:nowrap}
.h2-row .you small{font:800 10px var(--num);opacity:.8}
.h2-row.away{opacity:.62}.h2-row.away .av img{filter:grayscale(.85)}
.h2-leg{display:flex;align-items:center;gap:8px;height:54px;margin-top:6px;padding:0 10px;border-radius:16px;background:linear-gradient(90deg,#FFF6D8,#FFE9B8);box-shadow:0 0 0 1.5px #F6C343;cursor:pointer;animation:rise .4s var(--ease) both}
.h2-leg .av{flex:none;width:38px;height:38px;border-radius:50%;overflow:hidden}
.h2-leg .av img,.h2-row .av img{width:100%;height:100%;object-fit:cover}
.h2-leg .mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px}
.h2-leg .mid b{font:800 13px var(--f);color:#7A4A00}
.h2-leg .mid small{font:700 10.5px var(--f);color:#A86A00;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.h2-leg .lp{flex:none;text-align:right;font:800 14px/1.1 var(--num);color:#7A4A00}
.h2-leg .lp small{display:block;font:700 9.5px var(--num);opacity:.8}
.h2-note{margin:10px 6px 2px;font:500 11.5px/1.55 var(--f);color:#7A746E;text-align:center}
/* Daily Quest sheet: today's Life Power = base × streak multiplier */
.wq-lp{margin:4px 0 12px;padding:12px 14px;border-radius:16px;background:linear-gradient(180deg,#F4F6FF,#E9ECFA);box-shadow:0 0 0 1px #DDE2F7}
.wq-lp .h{display:flex;align-items:center;justify-content:space-between;gap:8px}
.wq-lp .h b{font:800 14px var(--f);color:var(--wink)}
.wq-lp .h em{font:800 16px var(--num);font-style:normal;color:var(--wi)}
.wq-lp .parts{display:flex;gap:6px;margin:8px 0}
.wq-lp .parts span{flex:1;padding:6px 4px;border-radius:10px;background:#fff;text-align:center;font:600 10.5px/1.35 var(--f);color:var(--wmut)}
.wq-lp .parts span b{display:block;font:800 14px var(--num);color:var(--wink)}
.wq-lp .m{font:600 12px/1.5 var(--f);color:var(--wink)}
.wq-lp .m .fire{display:inline-flex;align-items:center;gap:3px;height:22px;padding:0 8px;border-radius:11px;background:#FFE7C2;color:#B25A00;font:800 12px var(--num)}
/* the app only: delete account (small, under log out) */
.s2-del{display:block;margin:14px auto 4px;padding:6px 12px;border:0;background:none;color:#9A938C;font:700 13px var(--f);text-decoration:underline}
.s2-delin{display:block;width:100%;height:46px;padding:0 14px;border:1.5px solid #E3D9CB;border-radius:14px;font:700 16px var(--f);color:#1A1F3D;background:#fff}
/* the app only: show me in Hero Hall (a switch row in the profile card) */
.s2-tg{display:flex;align-items:center;gap:12px;margin-top:14px;padding:12px 14px;border-radius:14px;background:#F4F0EA;cursor:pointer}
.s2-tg span{flex:1;min-width:0}
.s2-tg b{display:block;font:800 13px var(--f);color:#1B2357}
.s2-tg small{display:block;margin-top:2px;font:500 11px/1.45 var(--f);color:#7A746E}
.s2-tg input{position:absolute;opacity:0;pointer-events:none}
.s2-tg i{position:relative;flex:none;width:44px;height:26px;border-radius:13px;background:#D8D0C4;transition:background .2s}
.s2-tg i::after{content:"";position:absolute;left:3px;top:3px;width:20px;height:20px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.2);transition:transform .2s}
.s2-tg input:checked+i{background:var(--wi)}
.s2-tg input:checked+i::after{transform:translateX(18px)}
/* Treasury: what I've redeemed (button + sheet) */
.tr-hist{position:absolute;left:200px;top:49px;width:32px;height:32px;padding:4px;border:0;border-radius:50%;background:#fff;box-shadow:var(--wsh);cursor:pointer}
.tr-hist img{width:100%;height:100%;object-fit:contain}
.oh-list{display:grid;gap:10px;max-height:min(60vh,460px);overflow-y:auto;padding:2px}
.oh-row{display:flex;align-items:flex-start;gap:12px;padding:10px 12px;border-radius:16px;background:#F8F5F0}
.oh-row>img{width:46px;height:46px;flex:none;object-fit:contain;border-radius:12px;background:#fff}
.oh-tx{flex:1;min-width:0}
.oh-tx b{display:block;font:800 13.5px var(--f);color:#1B2357;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.oh-tx span{display:block;font:500 11.5px var(--f);color:#7A746E}
.oh-trk,.oh-addr{display:block;margin-top:6px;padding:4px 10px;border:0;border-radius:10px;background:#fff;font:700 11.5px var(--f);color:var(--wi);cursor:pointer;box-shadow:0 0 0 1px #DCE1F6}
.oh-row em{flex:none;padding:3px 9px;border-radius:10px;font:700 11px var(--f);font-style:normal;white-space:nowrap}
