/* SmilhY Dice v4.8 — reference-inspired premium Level System */
.levels-screen{color:#eef5ff;padding-bottom:30px}
.levels-glass{background:linear-gradient(130deg,rgba(25,32,49,.90),rgba(8,16,27,.97));border:1px solid rgba(108,133,175,.3);box-shadow:0 15px 42px rgba(0,0,0,.25),inset 0 1px 0 rgba(255,255,255,.08);border-radius:19px;backdrop-filter:blur(13px)}
.levels-kicker{font-size:11px;font-weight:900;letter-spacing:.12em;color:#bba8ff}
.levels-hero{display:flex;gap:20px;justify-content:space-between;align-items:center;padding:28px 34px;margin-bottom:18px;position:relative;overflow:hidden;background:radial-gradient(circle at 80% 30%,rgba(102,84,250,.35),transparent 38%),linear-gradient(125deg,#101931,#1c1a48 70%,#0b162b)}
.levels-hero h1{font-size:clamp(35px,4.4vw,56px);font-weight:900;letter-spacing:-.05em;margin:8px 0 12px;color:#fff}.levels-hero p{font-size:13px;line-height:1.6;max-width:570px;color:#bacbee}
.levels-hero-badge{font-size:65px;position:relative;filter:drop-shadow(0 0 30px rgba(142,95,255,.45));min-width:105px;text-align:center}.levels-hero-badge span{position:absolute;font-weight:900;font-size:12px;color:#d6c4ff;left:50%;bottom:0;transform:translateX(-50%)}
.levels-grid{display:grid;grid-template-columns:minmax(0,1.07fr) minmax(0,.93fr);gap:18px;align-items:start}
.levels-tiers,.levels-my-progress,.levels-next{padding:20px}
.levels-side{display:flex;flex-direction:column;gap:16px;min-width:0}
.levels-panel-header{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.levels-panel-header h2{font-size:22px;color:#fff;margin:5px 0 0}
.levels-note{font-size:10px;color:#a6b4cd;font-weight:800}.levels-panel-desc{font-size:11px;color:#a1b5d1;margin:9px 0 15px}
.levels-tier-list{max-height:655px;overflow-y:auto;overflow-x:hidden;padding-right:5px;scrollbar-width:thin;scrollbar-color:#45577d transparent}
.levels-tier{border:1px solid rgba(104,122,158,.24);border-radius:14px;overflow:hidden;background:rgba(9,20,29,.62);margin-bottom:12px}
.levels-tier-title{display:flex;gap:12px;align-items:center;min-height:62px;padding:11px 14px;background:linear-gradient(95deg,rgba(76,96,114,.17),rgba(59,58,115,.13))}
.levels-tier-title strong{font-weight:850;font-size:13px}.levels-tier-range{margin-left:auto;font-size:10px;color:#9aacc8}
.levels-tier-icon{font-size:25px;color:#ffc673;text-shadow:0 0 10px rgba(255,170,76,.4)}
.levels-row{display:grid;grid-template-columns:1fr 1fr auto;gap:9px;align-items:center;border-top:1px solid rgba(105,130,164,.1);padding:10px 14px;min-height:35px;font-size:11px;color:#e1e9f7;font-variant-numeric:tabular-nums}
.levels-row:nth-child(odd){background:rgba(255,255,255,.018)}.levels-row.is-unlocked{background:rgba(37,236,146,.06)}.levels-row-head{color:#819cb9;font-weight:900;font-size:9px;letter-spacing:.065em;background:rgba(20,37,46,.5)}
.levels-row>span:last-child{text-align:right}
.levels-current{display:flex;align-items:center;gap:16px;margin-top:25px;margin-bottom:22px}.levels-muted{font-size:10px;color:#8ba5c2;font-weight:900;letter-spacing:.09em}.levels-current h3{color:#ffbd62;font-size:22px;margin:5px 0}.levels-current strong{font-size:13px;color:#e5eaf4}
.levels-crest{width:82px;height:82px;flex-shrink:0;border-radius:25px;display:grid;place-items:center;background:radial-gradient(circle at 38% 28%,#ffe9a1,#b57027 55%,#58320d);color:#ffe6ad;border:3px solid #f5b94f;box-shadow:0 0 0 6px rgba(251,170,69,.10),0 10px 24px rgba(0,0,0,.3),inset 0 3px 12px rgba(255,255,255,.28);font-size:44px;text-shadow:0 1px 7px #48341a}
.levels-xp-line{display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px;font-size:12px;margin-bottom:10px}
.levels-xp-line strong:last-child{font-variant-numeric:tabular-nums}
.levels-progress-bar{height:12px;background:rgba(85,106,133,.2);border-radius:99px;overflow:hidden;border:1px solid rgba(113,140,190,.14)}
.levels-progress-bar>div{height:100%;width:0;background:linear-gradient(90deg,#41e982,#0bdc91);border-radius:99px;box-shadow:0 0 20px rgba(17,243,135,.54);transition:width .5s ease}
.levels-next-line{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:12px 0 22px;font-size:11px;color:#bbcadb}.levels-next-line span:first-child{color:#f9b14e;font-weight:800}
.levels-summary{display:flex;gap:20px;justify-content:space-between;padding:19px 0;border-top:1px solid rgba(125,143,181,.16);border-bottom:1px solid rgba(125,143,181,.16)}
.levels-summary>div{display:flex;flex-direction:column;gap:5px}.levels-summary small{font-size:10px;color:#8ea2c6}.levels-summary strong{font-size:15px;color:#fff;font-variant-numeric:tabular-nums}
.levels-reward-line{display:flex;flex-direction:column;gap:8px;padding:18px 0 3px}.levels-reward-line span{font-size:11px;color:#9cafc9}.levels-reward-line strong{font-size:22px;color:#ffe082}
.levels-login-btn{margin-top:15px;width:100%;height:45px}
.levels-upcoming-list{margin-top:18px;display:flex;flex-direction:column;gap:10px}.levels-milestone{display:flex;align-items:center;gap:12px;padding:9px 11px;border-radius:12px;background:rgba(15,26,39,.70);border:1px solid rgba(100,122,167,.16)}
.levels-small-icon{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;border-radius:13px;color:#ffd496;background:radial-gradient(circle at top,#935d32,#442810 68%);font-size:24px}
.levels-milestone-copy{display:flex;flex:1;min-width:0;flex-direction:column;gap:5px}.levels-milestone-copy strong{font-size:12px;color:#ffe1ab}.levels-milestone-copy small{font-size:10px;color:#90a6c6}
.levels-claim{cursor:pointer;min-height:36px;min-width:70px;border-radius:10px;border:1px solid rgba(203,171,83,.38);background:rgba(95,81,44,.22);font-size:11px;font-weight:900;color:#ffe098;padding:0 11px}
.levels-claim:not(:disabled):hover{background:rgba(164,134,70,.35)}.levels-claim:disabled{cursor:not-allowed;opacity:.55}
.levels-placeholder,.levels-action-note,.levels-footnote{color:#92a8c9;font-size:11px;line-height:1.6}.levels-action-note{margin:17px 3px 0}.levels-action-note.is-error{color:#ff99ae}.levels-footnote{margin:19px 2px}
@media(max-width:820px){.levels-grid{grid-template-columns:1fr}.levels-tier-list{max-height:430px}.levels-hero{padding:22px}}
@media(max-width:500px){.levels-hero{padding:20px}.levels-hero h1{font-size:36px}.levels-hero-badge{font-size:44px;min-width:58px}.levels-hero p{font-size:11px}.levels-tiers,.levels-my-progress,.levels-next{padding:15px}.levels-current h3{font-size:18px}.levels-crest{width:67px;height:67px;font-size:32px;border-radius:20px}}
