*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
:root{--px:'Press Start 2P',monospace;--pix:'Pixelify Sans','Trebuchet MS',sans-serif;--ui:Tahoma,'Trebuchet MS',Verdana,sans-serif;--tb:40px}
html,body{height:100%;overflow:hidden;background:#0a5cff;font-family:var(--ui);font-size:14px;color:#1b1b1b;user-select:none;-webkit-user-select:none;touch-action:manipulation}
[hidden]{display:none!important}
button{font-family:inherit;cursor:pointer}
h2{font-family:var(--pix);font-weight:700;font-size:22px;color:#0b3fb5;text-align:center;margin:4px 0 6px}
.sub{text-align:center;color:#444;font-size:13px;margin-bottom:12px;line-height:1.4}

/* ---------- BOOT ---------- */
#boot{position:fixed;top:0;right:0;bottom:0;left:0;z-index:100;background:#000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;transition:opacity .4s}
.boot-logo{width:120px;height:120px;border-radius:22px;object-fit:cover;box-shadow:0 0 40px #2a7bff88;animation:pop .6s cubic-bezier(.2,1.6,.4,1)}
.boot-name{font-family:var(--px);color:#fff;font-size:30px;text-shadow:3px 3px 0 #1b3fa8}
.boot-name sup{font-size:12px;color:#ff8a1f;margin-left:6px}
.boot-bar{width:190px;height:20px;border:2px solid #b2b2b2;border-radius:6px;overflow:hidden;position:relative;padding:2px}
.boot-bar i{position:absolute;top:3px;left:0;width:46px;height:10px;background:linear-gradient(#2838c7,#5979ef 40%,#2838c7) 0 0/12px 100% repeat-x;-webkit-mask:linear-gradient(90deg,#000 10px,transparent 10px) 0 0/16px 100%;mask:linear-gradient(90deg,#000 10px,transparent 10px) 0 0/16px 100%;animation:bootrun 1.6s linear infinite}
.boot-foot{position:absolute;bottom:22px;left:0;right:0;padding:0 22px;display:flex;justify-content:space-between;color:#ddd;font-size:11px}
.boot-foot span{font-family:var(--px);font-size:10px;color:#ffc61a}
@keyframes bootrun{from{transform:translateX(-50px)}to{transform:translateX(200px)}}
@keyframes pop{from{transform:scale(.3);opacity:0}to{transform:none;opacity:1}}

/* ---------- WELCOME ---------- */
#welcome{position:fixed;top:0;right:0;bottom:0;left:0;z-index:90;display:flex;flex-direction:column;background:#5a7edc;transition:opacity .4s}
.wl-top,.wl-bot{flex:0 0 14%;background:#00309c;position:relative}
.wl-top::after{content:'';position:absolute;left:0;right:0;bottom:0;height:3px;background:linear-gradient(90deg,transparent,#fff,transparent)}
.wl-bot::before{content:'';position:absolute;left:0;right:0;top:0;height:3px;background:linear-gradient(90deg,transparent,#f99736,transparent)}
.wl-bot{display:flex;align-items:center;justify-content:center;color:#cdd9ff;font-size:12px;padding:0 16px;text-align:center}
.wl-mid{flex:1;display:flex;align-items:center;justify-content:center;gap:5vw;padding:16px;background:radial-gradient(circle at 20% 20%,#91b1ef,#5a7edc 55%)}
.wl-left{text-align:right;max-width:340px}
.wl-left img{width:100%;border-radius:10px;border:3px solid #fff;box-shadow:0 6px 20px #0005}
.wl-left p{color:#fff;font-size:17px;margin-top:10px;font-style:italic}
.wl-user{display:flex;gap:12px;align-items:center;padding:12px 14px;border-radius:8px;background:linear-gradient(90deg,#00309ccc,#00309c22)}
.wl-user>img{width:64px;height:64px;border-radius:8px;border:3px solid #ffcc33;object-fit:cover}
.wl-user label{display:block;color:#fff;font-size:15px;margin-bottom:6px;font-weight:bold}
.wl-row{display:flex;gap:6px}
#nick{width:170px;height:32px;padding:0 8px;font:16px var(--ui);border:2px solid #17349b;border-radius:4px;user-select:text;-webkit-user-select:text}
.go{width:34px;height:32px;border-radius:5px;border:2px solid #fff;background:linear-gradient(#5ccd4c,#2a9a21);color:#fff;font-size:17px;font-weight:bold}
.go:active{filter:brightness(.85)}
@media(max-width:720px){.wl-mid{flex-direction:column;gap:18px}.wl-left{text-align:center;max-width:300px}}

/* ---------- DESKTOP ---------- */
#desktop{position:fixed;top:0;right:0;bottom:0;left:0;background:#2f8cff url(../assets/bg.webp) center bottom/cover no-repeat;overflow:hidden}
.task i,.sm-body i{font-style:normal}
.cloud{position:absolute;width:8px;height:8px;background:#fff;opacity:.9;pointer-events:none;
 box-shadow:8px 0 #fff,16px 0 #fff,24px 0 #fff,32px 0 #fff,40px 0 #fff,48px 0 #fff,56px 0 #fff,64px 0 #fff,
 8px -8px #fff,16px -8px #fff,24px -8px #fff,32px -8px #fff,40px -8px #fff,48px -8px #fff,56px -8px #eaf4ff,
 16px -16px #fff,24px -16px #fff,32px -16px #fff,40px -16px #fff,24px -24px #fff,32px -24px #fff,
 0 8px #d8ebff,8px 8px #d8ebff,16px 8px #d8ebff,24px 8px #d8ebff,32px 8px #d8ebff,40px 8px #d8ebff,48px 8px #d8ebff,56px 8px #d8ebff,64px 8px #d8ebff;
 animation:drift 90s linear infinite}
.c1{top:12%}.c2{top:27%;transform:scale(.7);animation-duration:130s;animation-delay:-60s}.c3{top:6%;animation-duration:170s;animation-delay:-110s}
@keyframes drift{from{left:-90px}to{left:105%}}
#brand{position:absolute;top:8px;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:8px;z-index:1;pointer-events:none}
#brand img{width:30px;height:30px;border-radius:7px;border:2px solid #fff;object-fit:cover}
#brand span{font-family:var(--px);font-size:16px;color:#ffc61a;text-shadow:2px 0 #1b3fa8,-2px 0 #1b3fa8,0 2px #1b3fa8,0 -2px #1b3fa8,3px 3px 0 #0b2470}
#icons{position:absolute;top:54px;left:10px;display:flex;flex-direction:column;flex-wrap:wrap;gap:8px;max-height:calc(100% - 110px);z-index:1}
.dicon{width:78px;padding:6px 2px;border:1px solid transparent;border-radius:3px;background:none;color:#fff;font:12px var(--ui);text-shadow:1px 1px 2px #000,0 0 3px #000;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;text-decoration:none}
.dicon i{font-style:normal;font-size:32px;filter:drop-shadow(1px 2px 0 #0006);transition:transform .15s}
.dicon:hover i{transform:scale(1.15) rotate(-6deg)}
.dicon:hover,.dicon:focus{background:#0b61ff66;border-color:#ffffff88;outline:none}
.dicon small{font-size:10px;color:#ffe680}

/* ---------- WINDOWS ---------- */
.win{position:absolute;display:none;flex-direction:column;border-radius:8px 8px 0 0;background:#0831d9;padding:0 3px 3px;box-shadow:3px 4px 14px #0007;max-height:calc(100% - var(--tb) - 14px);max-width:calc(100vw - 12px)}
.win.open{display:flex;animation:winin .18s ease-out}
.win.static{position:relative;display:flex;width:min(360px,92vw)}
@keyframes winin{from{transform:scale(.92);opacity:0}to{transform:none;opacity:1}}
.tb{flex:0 0 30px;display:flex;align-items:center;gap:6px;padding:0 4px 0 6px;border-radius:7px 7px 0 0;margin:0 -3px;
 background:linear-gradient(180deg,#0997ff,#0053ee 8%,#0050ee 40%,#0066ff 88%,#0066ff 93%,#005bff 95%,#003dd7 96%,#003dd7);cursor:default;touch-action:none}
.win:not(.top) .tb{filter:saturate(.6) brightness(1.15)}
.tb-t{flex:1;color:#fff;font:bold 13px var(--ui);text-shadow:1px 1px #0f1089;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tb button{width:22px;height:22px;border:1px solid #fff;border-radius:3px;color:#fff;font:bold 12px/1 var(--ui);background:radial-gradient(circle at 30% 30%,#5d8dff,#1648d8 70%)}
.tb button.x{background:radial-gradient(circle at 30% 30%,#f2a08a,#d2401c 70%)}
.tb button:hover{filter:brightness(1.2)}
.wb{flex:1;min-height:0;overflow:auto;background:#ece9d8;padding:12px;-webkit-overflow-scrolling:touch;overscroll-behavior:contain}
@media(max-width:720px){
  .win{left:5px!important;right:5px;top:44px!important;width:auto!important;max-height:calc(100% - var(--tb) - 50px)}
  #icons{flex-direction:row;left:0;right:0;justify-content:center;top:auto;bottom:calc(var(--tb) + 10px);max-height:none;gap:2px}
  .dicon{width:23%;max-width:84px}
  h2{font-size:19px}
}

/* XP controls */
.xb{padding:5px 12px;border:1px solid #003c74;border-radius:3px;background:linear-gradient(#fff,#ecebe5 86%,#d8d0c4);font:12px var(--ui);color:#000;box-shadow:inset -1px -1px 0 #0002;text-decoration:none;display:inline-block}
.xb:hover{box-shadow:inset 0 0 0 2px #f8b636}
.xb:active{background:linear-gradient(#d8d0c4,#ecebe5)}
.xb.big{padding:10px 16px;font:700 15px var(--pix);border-radius:5px}
.xb.gold{background:linear-gradient(#ffe36b,#ffb400);border-color:#9a6200}
.xb[disabled]{opacity:.55;cursor:default;box-shadow:none}
.xpbar{height:20px;border:1px solid #686868;border-radius:4px;background:#fff;padding:2px;box-shadow:inset 0 1px 2px #0004}
.xpbar i{display:block;height:100%;width:0;background:linear-gradient(#b6f0a5,#2ed12e 45%,#1fa81f) 0 0/100% 100%;-webkit-mask:linear-gradient(90deg,#000 8px,transparent 8px) 0 0/10px 100%;mask:linear-gradient(90deg,#000 8px,transparent 8px) 0 0/10px 100%;transition:width .15s}

/* ---------- HATCH ---------- */
#cards{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
@media(max-width:720px){#cards{grid-template-columns:repeat(2,1fr)}}
.card{position:relative;border:2px solid #fff;border-right-color:#aca899;border-bottom-color:#aca899;border-radius:6px;background:linear-gradient(#bfe2ff,#e9f6ff 60%,#b9e59a 60%,#8fd067);padding:6px 4px 8px;text-align:center;cursor:pointer;transition:transform .12s;overflow:hidden}
.card:hover{transform:translateY(-3px)}
.card:active{transform:scale(.97)}
.card .cv{position:relative;width:100%;max-width:150px;margin:0 auto;overflow:hidden;pointer-events:none}
.card .cv::before{content:'';display:block;padding-top:100%}
.card .cv canvas{position:absolute;left:0;top:0;width:100%;height:100%;max-width:none}
.card .cv.sheet canvas{width:2000%}
.card .cv.sheet.run canvas{animation:sheet 2.6s steps(20) infinite}
@keyframes sheet{to{transform:translateX(-100%)}}
.card b{display:block;font:700 15px var(--pix);color:#10307a}
.card .rar{font:9px var(--px);margin:3px 0}
.card .tp{font-size:11px;color:#234}
.card .mini{height:6px;margin:5px 8px 0;border:1px solid #6b7f95;border-radius:3px;background:#fff}
.card .mini i{display:block;height:100%;background:#2ed12e;border-radius:2px}
.card .badge{position:absolute;top:6px;left:6px;font:8px var(--px);background:#2ea82e;color:#fff;padding:3px 5px;border-radius:3px}
.card.leg{grid-column:span 2;border-color:#ffd84a;background:linear-gradient(135deg,#3a1b00,#8a5a00 40%,#ffd84a 50%,#8a5a00 60%,#3a1b00) 0 0/300% 300%;animation:shine 5s linear infinite}
.card.leg b{color:#fff;text-shadow:1px 1px #000}.card.leg .tp{color:#ffe9a8}
.card.leg .mini{border-color:#000}
@keyframes shine{to{background-position:300% 0}}
.Uncommon{color:#1d8f3a}.Rare{color:#1668e0}.Epic{color:#a02be0}.LEGENDARY{color:#ff9d00;text-shadow:1px 1px #000}
.ticker{margin-top:10px;padding:6px 8px;background:#fff;border:1px solid #7f9db9;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.play-head{display:flex;align-items:center;gap:8px}
.play-head h2{flex:1;margin:0}
.live{font-size:11px;color:#0a6b1a;white-space:nowrap}
#stageWrap{position:relative;width:100%;max-width:430px;width:min(100%,430px,52vh);margin:6px auto;border-radius:10px;overflow:hidden;cursor:pointer;touch-action:none;
 background:linear-gradient(#1f8cff,#9ad6ff 71%,#6fce3d 71%,#3f9e22);border:2px solid #7f9db9}
#stageWrap::before{content:'';display:block;padding-top:100%}
#stage{position:absolute;left:0;top:0;width:100%;height:100%;display:block}
#flash{position:absolute;top:0;right:0;bottom:0;left:0;background:#fff;opacity:0;pointer-events:none}
#hint{position:absolute;left:0;right:0;bottom:10px;text-align:center;font:12px var(--px);color:#fff;text-shadow:2px 2px #0b2470;pointer-events:none;animation:blink 1s steps(2) infinite}
@keyframes blink{50%{opacity:.2}}
.plus{position:absolute;font:12px var(--px);color:#fff;text-shadow:2px 2px #0b2470;pointer-events:none;animation:plus .7s ease-out forwards}
.plus.no{color:#ff7a7a;font-size:9px}
@keyframes plus{to{transform:translateY(-60px) scale(1.4);opacity:0}}
#p-prog{max-width:430px;margin:0 auto}
.p-stats{display:flex;justify-content:space-between;align-items:baseline;margin-top:6px}
.p-stats b{font:18px var(--px);color:#0b3fb5}
.p-stats span{font-size:13px;color:#333}
#petcard{max-width:430px;margin:0 auto;text-align:center;padding:10px;background:#fff;border:1px solid #7f9db9;border-radius:6px;animation:winin .4s}
#petcard h3{font:700 28px var(--pix);color:#10307a}
#petcard p{font-size:12px;color:#555;margin:2px 0 10px}
.pc-rar{font:10px var(--px);margin-bottom:6px}
.pc-btns{display:flex;gap:8px;justify-content:center;flex-wrap:wrap}

/* ---------- STATS / FEED ---------- */
.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}
.stats.four{grid-template-columns:repeat(4,1fr)}
@media(max-width:520px){.stats.four{grid-template-columns:1fr 1fr}}
.stat{background:#fff;border:1px solid #7f9db9;border-radius:5px;padding:8px;text-align:center}
.stat span{display:block;font-size:11px;color:#555;text-transform:uppercase;letter-spacing:.5px}
.stat b{display:block;font:700 26px var(--pix);color:#0b3fb5;line-height:1.2}
.stat em{font-style:normal;font-size:11px;color:#777}
.feed{list-style:none;background:#fff;border:1px solid #7f9db9;height:150px;overflow:hidden;padding:4px 8px;font-size:12px}
.feed li{padding:3px 0;border-bottom:1px dotted #ccd;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;animation:feedin .3s}
.feed li.me{background:#fff7c2}
@keyframes feedin{from{opacity:0;transform:translateX(-12px)}}
.board{list-style:none;background:#fff;border:1px solid #7f9db9;margin-bottom:12px}
.board li{display:flex;gap:8px;padding:4px 8px;font-size:13px;border-bottom:1px solid #eef}
.board li:nth-child(odd){background:#f3f7ff}
.board li.me{background:#fff2a8;font-weight:bold}
.board i{font-style:normal;width:26px;color:#777}
.board span{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.board b{font-family:var(--pix);color:#0b3fb5}

/* ---------- FACTORY ---------- */
.conveyor{position:relative;height:150px;margin-bottom:10px;border:1px solid #7f9db9;border-radius:5px;overflow:hidden;background:linear-gradient(#cfe8ff,#eef7ff)}
.belt{position:absolute;left:0;right:0;bottom:14px;height:16px;background:repeating-linear-gradient(90deg,#444 0 12px,#666 12px 24px);border-top:3px solid #222;border-bottom:3px solid #222;animation:belt 1s linear infinite}
@keyframes belt{to{background-position:24px 0}}
.machine{position:absolute;left:8px;bottom:30px;width:104px;z-index:2}
.funnel{width:60px;height:26px;margin:0 auto;background:#8d99a8;clip-path:polygon(0 0,100% 0,72% 100%,28% 100%);border-top:4px solid #5a6471}
.mbody{height:66px;border-radius:6px;background:linear-gradient(#5d8dff,#1648d8);border:3px solid #0b2470;display:flex;flex-wrap:wrap;align-content:center;justify-content:center;gap:5px;animation:rumble .25s infinite}
.mbody i{width:10px;height:10px;border-radius:50%;background:#2ed12e;animation:blink 1s steps(2) infinite}
.mbody i:nth-child(2){background:#ffc61a;animation-delay:.3s}.mbody i:nth-child(3){background:#ff4f4f;animation-delay:.6s}
.mbody span{width:100%;text-align:center;font:7px var(--px);color:#fff}
@keyframes rumble{50%{transform:translateY(1px)}}
.coin{position:absolute;left:52px;top:-18px;width:14px;height:14px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff3a8,#ffb400);border:2px solid #9a6200;animation:coinfall 1s ease-in forwards;z-index:1}
@keyframes coinfall{from{transform:translate(var(--dx),0)}to{transform:translate(0,58px) scale(.6)}}
.cegg{position:absolute;left:96px;bottom:30px;width:30px;height:38px;border-radius:50%/60% 60% 40% 40%;border:2px solid #0004;animation:ride 9s linear forwards;box-shadow:inset -5px -6px 0 #0002,inset 4px 4px 0 #fff6}
@keyframes ride{0%{transform:scale(.2)}6%{transform:scale(1.15)}10%{transform:none}100%{transform:translateX(560px) rotate(40deg)}}

/* ---------- BOUNTY ---------- */
#bounties{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:8px}
.bty{background:#fff;border:1px solid #7f9db9;border-radius:6px;padding:8px 6px;text-align:center}
.bty img{width:84px;height:84px;filter:brightness(0);opacity:.85;transition:filter .5s}
.bty.rev img{filter:none;opacity:1}
.bty b{display:block;font:700 15px var(--pix);color:#10307a}
.bty span{display:inline-block;margin-top:4px;font-size:11px;padding:3px 6px;border-radius:3px;background:#e2f7da;color:#176b17;font-weight:bold}
.bty.claimed span{background:#eee;color:#666;font-weight:normal}
.bty.mine{border-color:#ffb400;background:#fff9dc}
.bty.mine span{background:#ffc61a;color:#000;font-weight:bold}

/* ---------- TOKENOMICS / HOW ---------- */
.pie-row{display:flex;align-items:center;justify-content:center;gap:22px;margin:6px 0 16px;flex-wrap:wrap}
.pie{width:150px;height:150px;border-radius:50%;background:conic-gradient(#ffc61a 0 70%,#3aa0ff 70% 90%,#4caf2f 90%);display:grid;place-items:center;border:3px solid #0b2470;animation:spin 30s linear infinite}
.pie-hole{width:74px;height:74px;border-radius:50%;background:#ece9d8;border:3px solid #0b2470;display:grid;place-content:center;text-align:center;animation:spin 30s linear infinite reverse}
.pie-hole b{font:10px var(--px);color:#0b3fb5}.pie-hole span{font-size:10px;color:#555}
@keyframes spin{to{transform:rotate(360deg)}}
.legend{list-style:none;font-size:14px}
.legend li{margin:7px 0;display:flex;align-items:center;gap:8px}
.legend i{width:16px;height:16px;border:2px solid #0b2470}
.legend b{font-family:var(--pix);font-size:18px;min-width:44px}
.steps{list-style:none}
.steps li{display:flex;gap:12px;align-items:center;background:#fff;border:1px solid #7f9db9;border-radius:6px;padding:10px;margin-bottom:8px;position:relative}
.steps li:not(:last-child)::after{content:'▼';position:absolute;left:24px;bottom:-12px;color:#0b3fb5;font-size:11px;z-index:1}
.steps i{flex:0 0 40px;height:40px;border-radius:50%;background:linear-gradient(#ffe36b,#ffb400);border:2px solid #9a6200;display:grid;place-items:center;font:16px var(--px);font-style:normal;color:#5a3600}
.steps b{display:block;font:700 18px var(--pix);color:#10307a}
.steps span{font-size:12px;color:#444}

/* ---------- TASKBAR ---------- */
#taskbar{position:absolute;left:0;right:0;bottom:0;height:var(--tb);display:flex;align-items:stretch;z-index:5000;padding-bottom:env(safe-area-inset-bottom);
 background:linear-gradient(#1f2f86 0,#3165c4 3%,#3682e5 6%,#4490e6 10%,#3883e5 12%,#2b71e0 15%,#2663da 18%,#235bd6 20%,#2258d5 23%,#2157d6 38%,#245ddb 54%,#2562df 86%,#245fdc 89%,#2158d4 92%,#1d4ec0 95%,#1941a5 98%)}
#start{display:flex;align-items:center;gap:6px;padding:0 20px 0 10px;border:0;border-radius:0 12px 12px 0;color:#fff;font:italic bold 18px var(--ui);text-shadow:1px 1px 2px #0008;
 background:linear-gradient(#5ccd4c 0,#3c9d3c 10%,#2e8f2e 50%,#3aa33a 90%,#226b22);box-shadow:inset -2px 0 4px #0005}
#start:hover{filter:brightness(1.12)}
#start img{width:24px;height:24px;border-radius:5px;object-fit:cover;border:1px solid #fff}
#tasks{flex:1;display:flex;gap:3px;padding:5px 6px;min-width:0;overflow:hidden}
.task{flex:0 1 130px;min-width:34px;border:1px solid #1941a5;border-radius:3px;background:#3c81f3;color:#fff;font:12px var(--ui);padding:0 6px;text-align:left;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.task.on{background:#1e52b7;box-shadow:inset 1px 1px 3px #0008}
#tray{display:flex;align-items:center;gap:5px;padding:0 10px;color:#fff;font-size:12px;border-left:1px solid #1042af;background:linear-gradient(#0c59b9,#139ee9 8%,#18b5f2 30%,#139beb 60%,#1290e8 90%,#0d6fc1)}
.dot{width:8px;height:8px;border-radius:50%;background:#4dff4d;box-shadow:0 0 6px #4dff4d;animation:blink 1.4s steps(2) infinite}
#clock{margin-left:8px}
@media(max-width:720px){.task{flex:0 0 34px;text-align:center;padding:0}.task span{display:none}#tray .tl{display:none}#start{padding:0 12px 0 8px;font-size:16px}}

/* ---------- START MENU ---------- */
#startmenu{position:absolute;left:0;bottom:var(--tb);width:250px;z-index:5001;border:2px solid #0b3fb5;border-radius:8px 8px 0 0;background:#fff;box-shadow:3px -2px 12px #0006;overflow:hidden;animation:winin .12s}
.sm-head{display:flex;align-items:center;gap:8px;padding:8px;background:linear-gradient(#1868ce,#0e60cb 12%,#1164cf 20%,#1667cf 32%,#1b6cd3 33%,#1e70d9 47%,#2476dc 54%,#297ae0 60%,#3482e3 65%,#3786e5 77%,#428ee9 79%,#4791eb 90%,#4791eb);color:#fff;font-size:15px}
.sm-head img{width:40px;height:40px;border-radius:5px;border:2px solid #fff;object-fit:cover}
.sm-body button,.sm-body a{display:flex;align-items:center;gap:10px;width:100%;padding:7px 10px;border:0;background:none;font:13px var(--ui);color:#000;text-decoration:none;text-align:left}
.sm-body button:hover,.sm-body a:hover{background:#2f71cd;color:#fff}
.sm-body i{font-style:normal;font-size:22px;width:28px;text-align:center}
.sm-body hr{border:0;border-top:1px solid #c5c5c5;margin:3px 8px}
.sm-foot{background:linear-gradient(#4282d6,#3b85e0 3%,#418ae3 5%,#418ae3 17%,#3c87e2 21%,#3786e4 26%,#3482e3 29%,#2e7ee1 39%,#2374df 49%,#2072db 57%,#196edb 62%,#176bd8 72%,#1468d5 75%,#1165d2 83%,#0f61cb 88%);padding:6px;text-align:right}
.sm-foot button{border:0;background:none;color:#fff;font-size:12px;padding:4px 8px}
.sm-foot button:hover{background:#ffffff33}

/* ---------- LAUNCH / DIALOG / TOAST ---------- */
#launch,#dlg{position:fixed;top:0;right:0;bottom:0;left:0;z-index:8000;background:#0006;display:grid;place-items:center;padding:10px}
#launch h3{font:700 22px var(--pix);text-align:center;color:#10307a;margin-bottom:8px}
.pool{position:relative;height:170px;border:3px solid #0b2470;border-top:0;border-radius:0 0 14px 14px;overflow:hidden;background:#dff1ff}
.pool span{position:absolute;left:0;right:0;bottom:8px;text-align:center;font:9px var(--px);color:#fff;text-shadow:1px 1px #0b2470}
.water{position:absolute;left:0;right:0;bottom:0;height:8%;background:linear-gradient(#7fe0ff,#1b7fff);transition:height .2s linear}
.water::before{content:'';position:absolute;left:-10%;right:-10%;top:-8px;height:16px;background:radial-gradient(circle at 10px 0,transparent 9px,#7fe0ff 10px) 0 0/20px 16px;animation:belt .8s linear infinite}
.lcoin{position:absolute;top:-20px;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#fff3a8,#ffb400);border:2px solid #9a6200;animation:lfall .8s ease-in forwards}
@keyframes lfall{to{transform:translateY(190px) rotate(360deg)}}
.l-count{text-align:center;margin-top:10px;font-size:14px}
.l-count b{font:16px var(--px);color:#0b3fb5}
.dlg-body{display:flex;gap:12px;align-items:flex-start;font-size:13px;line-height:1.5}
.dlg-body i{font-style:normal;font-size:34px}
.dlg-btn{text-align:center;margin-top:14px}
.dlg-btn .xb{min-width:80px}
#toasts{position:fixed;right:8px;bottom:calc(var(--tb) + 10px);z-index:7000;display:flex;flex-direction:column;gap:6px;align-items:flex-end;pointer-events:none}
.toast{max-width:270px;padding:8px 12px;background:#ffffe1;border:1px solid #000;border-radius:8px;font-size:12px;box-shadow:2px 3px 6px #0005;animation:toast 5s forwards}
.toast b{display:block;margin-bottom:2px}
@keyframes toast{0%{opacity:0;transform:translateY(10px)}6%,88%{opacity:1;transform:none}100%{opacity:0}}

.next{display:flex;align-items:center;gap:8px;margin-bottom:10px;font-size:12px;white-space:nowrap}.next .xpbar{flex:1}.next .xpbar i{transition:width 1s linear}