/* v1.5: quick-use wheel, gifts, docks */
#pie{position:absolute;inset:0;z-index:40;pointer-events:none}
#pie.sticky{pointer-events:auto;background:rgba(10,18,28,.28);backdrop-filter:blur(2px)}
#pie *{pointer-events:none}
#pie.sticky .ps,#pie.sticky .plock,#pie.sticky .ppick,#pie.sticky .ppick *{pointer-events:auto}
#pie.hidden{display:none}
#pie .pring{position:absolute;width:0;height:0}
#pie .pring::before{content:"";position:absolute;left:-150px;top:-150px;width:300px;height:300px;border-radius:50%;background:radial-gradient(circle,rgba(20,34,46,.78) 0 34%,rgba(24,40,54,.55) 35% 72%,rgba(24,40,54,0) 73%);box-shadow:0 0 0 1px rgba(255,255,255,.08) inset}
#pie .ps{position:absolute;left:0;top:0;width:52px;height:52px;border-radius:50%;background:var(--panel);border:1.5px solid rgba(255,255,255,.18);display:flex;align-items:center;justify-content:center;transition:transform .12s,border-color .12s,background .12s,box-shadow .12s;backdrop-filter:blur(6px)}
#pie .ps em{font-style:normal;font-size:25px}
#pie .ps i{position:absolute;right:-3px;bottom:-3px;min-width:18px;height:18px;border-radius:9px;background:var(--teal);color:#06202a;font:700 11px var(--font);font-style:normal;display:flex;align-items:center;justify-content:center;padding:0 4px}
#pie .ps u{position:absolute;left:2px;top:-2px;font:700 9.5px var(--font);color:var(--ink-dim);text-decoration:none}
#pie .ps.empty{opacity:.45;border-style:dashed}
#pie .ps.out{opacity:.4;filter:grayscale(.7)}
#pie .ps.hot{border-color:var(--teal);background:rgba(80,200,200,.28);box-shadow:0 0 18px rgba(92,220,220,.55);z-index:2}
#pie .ps.pick{border-color:var(--gold,#ffd86b);box-shadow:0 0 16px rgba(255,216,107,.6)}
#pie .pc{position:absolute;left:-50px;top:-24px;width:100px;height:48px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font:500 12px var(--font);color:var(--ink-dim);line-height:1.25}
#pie .pc b{color:var(--ink);font-size:13px}
#pie .plock{position:absolute;left:-15px;top:30px;width:30px;height:30px;border-radius:50%;border:1px solid rgba(255,255,255,.2);background:var(--panel);font-size:15px;padding:0;cursor:pointer}
#pie .plock:hover{border-color:var(--teal)}
#pie .ppick{position:absolute;transform:translate(-50%,-50%);display:grid;grid-template-columns:repeat(2,150px);gap:6px;padding:10px;border-radius:16px;background:rgba(18,30,42,.94);border:1px solid var(--line);z-index:5;backdrop-filter:blur(10px)}
#pie .ppick button{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:var(--ink);font:500 13px var(--font);cursor:pointer;text-align:left}
#pie .ppick button:hover,#pie .ppick button.on{border-color:var(--teal);background:rgba(80,200,200,.18)}
#pie .ppick em{font-style:normal;font-size:18px}
.wheelgrid{display:grid;grid-template-columns:1fr 1fr;gap:4px 14px}
.wheelgrid .set{margin:4px 0}
#regionBanner{position:absolute;left:50%;top:92px;transform:translateX(-50%);font:italic 600 22px var(--font);color:#f3f7ee;text-shadow:0 2px 10px rgba(0,0,0,.6);letter-spacing:.04em;opacity:0;pointer-events:none;z-index:12}
#regionBanner.on{animation:regfade 4.2s ease both}
@keyframes regfade{0%{opacity:0;transform:translate(-50%,-6px)}15%{opacity:1;transform:translate(-50%,0)}75%{opacity:1}100%{opacity:0}}
.maplegend{display:flex;flex-wrap:wrap;gap:6px 14px;margin-top:8px;font-size:12px;color:var(--ink-dim)}
.maplegend i{display:inline-block;width:11px;height:11px;border-radius:3px;margin-right:5px;vertical-align:-1px}
.baitnote{font-size:11px;margin-top:4px;color:#b9e6a8}
.baitnote.dim{color:var(--ink-dim);opacity:.7}
.cookjob{margin:12px 0 4px;padding:10px 12px;border-radius:12px;background:rgba(255,160,70,.12);border:1px solid rgba(255,170,90,.35);font-size:13.5px}
.cookjob .bar2{margin-top:8px}.cookjob .bar2 i{transition:none}
#rigBar{position:absolute;left:50%;bottom:150px;transform:translateX(-50%);min-width:260px;padding:12px 18px;border-radius:16px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(8px);text-align:center;pointer-events:none;z-index:12}
#rigBar.hidden{display:none}
#rigBar .rt{font:600 14px var(--font);margin-bottom:8px}
#rigBar .rb{height:9px;border-radius:6px;background:rgba(255,255,255,.12);overflow:hidden}
#rigBar .rb i{display:block;height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--gold))}
#rigBar .rh{font-size:11px;color:var(--ink-dim);margin-top:6px}
#rodHp{font-style:normal;opacity:.85}#rodHp.mid,#lineTxt.mid{color:#ffcf6b}#rodHp.lo,#lineTxt.lo{color:#ff8a7a}
.hpline{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:12px;color:var(--ink-dim)}
.hpline .bar2{flex:1;max-width:160px;height:7px}.hpline b{color:var(--ink);font-weight:600;min-width:60px}
.hpline .bar2 i.mid{background:#ffcf6b}.hpline .bar2 i.lo{background:#ff7a6a}
.dpslots{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dpslot{border:1px solid var(--line);border-radius:12px;padding:8px;background:rgba(255,255,255,.04);text-align:center}
.dpslot img{width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:6px;background:#2a2118}.dpslot img.wait{opacity:.3}
.dpslot .dpempty{aspect-ratio:4/5;display:flex;align-items:center;justify-content:center;border:1px dashed var(--line);border-radius:6px;color:var(--ink-dim);font-size:12px}
.dpslot .pcap{font-size:11.5px;margin:5px 0}.dpslot .pbtn{display:flex;flex-direction:column;gap:5px}.dpslot .pbtn .btn{padding:6px 8px;font-size:12.5px}
.pondlist{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.pondlist span{padding:4px 10px;border-radius:999px;background:rgba(80,200,200,.12);border:1px solid rgba(80,200,200,.3);font-size:12.5px}.pondlist i{font-style:normal;color:var(--ink-dim)}
.fcard .lb{position:absolute;left:6px;top:6px;font-size:14px}
/* ---- v1.6: blackjack, arm wrestling, pub wall */
.bjchips{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}
.bjtable{background:radial-gradient(ellipse at 50% 40%,#2f7a50,#1f4a32);border:2px solid #5b3f26;border-radius:18px;padding:12px 14px;margin-top:8px}
.bjrow{display:flex;align-items:center;gap:12px;margin:8px 0}.bjl{width:84px;font-size:12.5px;color:#d8f2e0}.bjl i{font-style:normal;opacity:.8}
.bhand{display:flex;gap:6px;flex-wrap:wrap}
.bcard{width:44px;height:62px;border-radius:7px;background:#f6f1e3;color:#1f1f26;display:flex;flex-direction:column;align-items:center;justify-content:center;font:700 17px var(--font);box-shadow:0 2px 6px rgba(0,0,0,.35)}
.bcard i{font-style:normal;font-size:20px;line-height:1}.bcard.red{color:#c0262d}
.bcard.back{background:repeating-linear-gradient(45deg,#3a4a8f 0 6px,#2d3a73 6px 12px);border:2px solid #f6f1e3}
.bjbet{text-align:right;color:#ffe9a0;font-size:13px;margin-top:4px}
.bjres{margin:10px 0 0;padding:10px 12px;border-radius:12px;font-weight:700;text-align:center}
.bjres.win,.bjres.blackjack{background:rgba(90,220,140,.18);color:#9ff0bd}.bjres.lose{background:rgba(255,110,90,.16);color:#ffb0a0}.bjres.push{background:rgba(255,255,255,.08)}
.dpslots.pub4{grid-template-columns:repeat(2,1fr)}
#wrest{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);z-index:30;pointer-events:none}
#wrest.hidden{display:none}
#wrest *{pointer-events:none}
.wcard{min-width:330px;padding:18px 22px;border-radius:20px;background:rgba(18,28,40,.88);border:1px solid var(--line);backdrop-filter:blur(10px);text-align:center}
.wtop{display:flex;justify-content:space-between;align-items:center;font:600 14px var(--font);margin-bottom:10px}.wtop b{font-size:26px;color:var(--gold)}
.wtracks{display:flex;justify-content:center;gap:34px;height:260px}
.wtrack{position:relative;width:86px;border-radius:14px;background:linear-gradient(#173a52,#0f2a3e);border:1px solid rgba(255,255,255,.15)}
.wlab{position:absolute;left:0;right:0;top:-22px;font-size:12px;color:var(--ink-dim)}
.wzone{position:absolute;left:8px;right:34px;background:rgba(120,230,150,.28);border:2px solid #7ee0a0;border-radius:8px;transform:translateY(-50%);transition:background .1s}
.wzone.in{background:rgba(120,255,160,.55)}.wzone.opp{border-color:#ffb36b;background:rgba(255,179,107,.25)}
.wfish{position:absolute;left:30px;font-size:24px;transform:translateY(-50%)}
.wmeter{position:absolute;right:6px;top:8px;bottom:8px;width:14px;border-radius:8px;background:rgba(255,255,255,.12);overflow:hidden;display:flex;align-items:flex-end}
.wmeter i{display:block;width:100%;height:0;background:linear-gradient(0deg,var(--teal),var(--gold))}
.wcard .whint{font-size:12px;color:var(--ink-dim);margin-top:12px;max-width:310px}
.wres{font:700 30px var(--font);margin:6px 0}.wsub{font-size:13px;color:var(--ink-dim)}

/* ---- v1.6: login footer + the changelog letter */
.login-foot{margin-top:16px;display:flex;flex-direction:column;align-items:center;gap:10px}
.chbtn{padding:9px 22px;border-radius:999px;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.07);color:var(--ink);font:600 13px var(--font);letter-spacing:.12em;cursor:pointer;transition:transform .12s,border-color .15s,background .15s}
.chbtn:hover{border-color:var(--gold);background:rgba(255,216,107,.12);transform:translateY(-1px)}
.verchip{display:inline-flex;align-items:center;gap:7px;padding:4px 12px;border-radius:999px;background:rgba(0,0,0,.25);font-size:12px;color:var(--ink-dim)}
.verchip i{width:8px;height:8px;border-radius:50%;background:#58e0a0;box-shadow:0 0 8px #58e0a0}
#changelog{position:fixed;inset:0;z-index:90;display:flex;align-items:center;justify-content:center;background:rgba(4,12,20,.62);backdrop-filter:blur(4px);animation:fadein .2s ease}
#changelog.out{opacity:0;transition:opacity .18s}
@keyframes fadein{from{opacity:0}to{opacity:1}}
.letter{position:relative;width:min(640px,94vw);max-height:88vh;display:flex;flex-direction:column;border-radius:10px 10px 18px 18px;background:linear-gradient(180deg,#f4e8cb,#ead9b4);color:#3a2a18;box-shadow:0 24px 70px rgba(0,0,0,.55),inset 0 0 70px rgba(150,100,40,.22);animation:pop .35s cubic-bezier(.2,1.3,.4,1)}
.letter::before{content:"";position:absolute;inset:7px;border:1px solid rgba(120,80,30,.35);border-radius:6px;pointer-events:none}
.chx{position:absolute;right:12px;top:10px;width:34px;height:34px;border-radius:50%;border:1px solid rgba(90,60,25,.4);background:rgba(255,255,255,.35);color:#4a3320;font-size:16px;cursor:pointer;z-index:2}
.chx:hover{background:#fff}
.lhead{padding:24px 30px 8px;text-align:center}
.lhead .seal{width:44px;height:44px;margin:0 auto 6px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#d9594a,#a02e22);display:flex;align-items:center;justify-content:center;font-size:22px;box-shadow:0 3px 8px rgba(0,0,0,.35)}
.lhead h2{margin:0;font:700 26px var(--font);color:#4a2f14}.lhead p{margin:4px 0 0;font-size:13.5px;color:#6b5230}
.lbody{overflow-y:auto;padding:8px 30px 26px;scrollbar-width:thin;scrollbar-color:rgba(58,42,24,.38) transparent}
.lentry{margin-top:18px;padding-top:14px;border-top:1px dashed rgba(120,80,30,.45)}
.lentry:first-child{border-top:0;margin-top:8px}
.lver{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;margin-bottom:8px}
.vn{font:700 22px var(--font);color:#a02e22}.vname{font:600 15px var(--font);color:#5b3f1f}.vdate{margin-left:auto;font-size:12px;color:#8a6d45}
.vbadge{padding:2px 9px;border-radius:999px;background:#2f7a50;color:#eafff3;font:600 11px var(--font);letter-spacing:.04em}.vbadge.soon{background:#a8682a}
.lentry ul{list-style:none;margin:0;padding:0}
.lentry li{display:flex;gap:10px;padding:5px 0;line-height:1.4}
.lentry li .li{width:26px;text-align:center;font-size:18px}
.lentry li b{display:block;font-weight:700;color:#3a2a18}.lentry li span:not(.li){display:block;font-size:13.5px;color:#5a452a}
.lentry.latest li b{color:#7a1f16}
.lsign{margin:22px 0 4px;text-align:center;font:italic 600 15px var(--font);color:#7a5a30}
@media (max-width:520px){.lhead{padding:20px 18px 6px}.lbody{padding:8px 18px 22px}}

/* ---- v1.7: diving HUD */
#diveHud{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:7px;pointer-events:none;z-index:12}
#diveHud.hidden{display:none}
#diveHud .dh-top{padding:4px 14px;border-radius:999px;background:var(--panel);border:1px solid var(--line);font:600 13px var(--font);backdrop-filter:blur(8px)}
#diveHud .dh-air{display:flex;align-items:center;gap:10px;padding:8px 16px;border-radius:16px;background:var(--panel);border:1px solid var(--line);backdrop-filter:blur(8px);min-width:300px}
#diveHud .dh-l{font:600 13px var(--font);color:#bff1ff}
#diveHud .dh-bar{flex:1;height:10px;border-radius:6px;background:rgba(255,255,255,.14);overflow:hidden}
#diveHud .dh-bar i{display:block;height:100%;width:100%;background:linear-gradient(90deg,#4fe3d0,#6fc4ff);transition:width .12s}
#diveHud .dh-bar i.mid{background:linear-gradient(90deg,#ffd24a,#ffb347)}#diveHud .dh-bar i.lo{background:linear-gradient(90deg,#ff7a6a,#ff4a4a)}
#diveHud b{font:700 14px var(--font);min-width:38px;text-align:right}
#diveHud .dh-keys{font-size:12px;color:var(--ink-dim);text-shadow:0 1px 4px rgba(0,0,0,.6)}
#diveHud.alarm .dh-air{animation:alarm .6s ease-in-out infinite alternate}
@keyframes alarm{from{box-shadow:0 0 0 0 rgba(255,80,70,.0)}to{box-shadow:0 0 18px 3px rgba(255,80,70,.6)}}