/* Account, navigation and notification refinements. Uses the app's theme tokens. */
html[data-theme] #drawer .drawer-foot{display:flex;flex-direction:column;align-items:center;gap:10px;height:100px}
html[data-theme] #drawer .sidebar-assets{width:100%;display:flex;justify-content:center;margin:0;padding:0}
html[data-theme] #drawer .assetseg{margin-inline:auto;width:auto;justify-content:center}
html[data-theme] #drawer .drawer-socials{display:flex;justify-content:center;gap:7px;margin:0;padding:0;width:auto}
html[data-theme] #drawer .drawer-socials a{width:32px;height:32px;min-height:32px;flex:0 0 32px}
#railToggle span{display:none!important}
@media(min-width:1080px){body:not(.rail-collapsed) #railToggle{visibility:hidden;pointer-events:none}body.rail-collapsed #drawer .drawer-socials{flex-direction:column;gap:7px}body.rail-collapsed #drawer .sidebar-assets{display:none!important}}
#drawer [data-feature=scanner] svg,#drawer [data-feature=pons] svg{width:21px;height:21px;flex-shrink:0}
.scanner-emblem svg{stroke-width:1.2}
.grad-toast{left:auto!important;right:16px;animation:grad-lifetime 4s linear both}
.grad-card .grad-close{position:relative;width:28px;height:28px;border-radius:50%}
.grad-card .grad-close .grad-countdown{position:absolute;inset:0;width:28px;height:28px;transform:rotate(-90deg);stroke:var(--accent);stroke-width:1.3}
.grad-countdown circle{stroke-dasharray:100;stroke-dashoffset:100;animation:grad-ring 4s linear forwards}
@keyframes grad-ring{to{stroke-dashoffset:0}}
@keyframes grad-lifetime{0%{opacity:0;transform:translateY(8px)}5%,92%{opacity:1;transform:translateY(0)}100%{opacity:0;transform:translateY(4px)}}
@media(max-width:600px){.grad-toast{right:12px}}
@media(prefers-reduced-motion:reduce){.grad-toast{animation:none}.grad-countdown circle{animation:none;stroke-dashoffset:0}}
#view-profile .prof-layout{display:block;max-width:1080px}#view-profile .prof-side{display:none}
#view-profile .prof-body{max-width:960px;gap:0}
#view-profile .prof-hero{padding:20px;border:1px solid var(--line);margin:0 0 20px;gap:16px}#view-profile .prof-big{width:64px;height:64px}
#view-profile .prof-id h2{font-size:26px}#view-profile .prof-since{margin-bottom:0}
.profile-usage{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 20px}
.experience-meter{display:flex;flex-direction:column;gap:9px;padding:20px;border:1px solid var(--line);border-radius:20px;background:var(--control-panel)}
.experience-label,.experience-meter small{color:var(--muted);font:400 13px/1.5 var(--display)}
.experience-value{font:500 24px/1.2 var(--display);color:var(--ink)}
.experience-meter progress{appearance:none;width:100%;height:6px;overflow:hidden;border:0;border-radius:9px;background:var(--line);accent-color:var(--accent);margin:6px 0}
.experience-meter progress::-webkit-progress-bar{background:var(--line)}.experience-meter progress::-webkit-progress-value{background:var(--accent);border-radius:9px}
.experience-meter progress::-moz-progress-bar{background:var(--accent);border-radius:9px}
.experience-link{font-size:13px;color:var(--ink-2);width:fit-content;margin-top:auto}
.reward-card{padding:24px!important;margin:0 0 20px;background:var(--control-panel)!important;border-radius:22px!important}
.reward-card h3{font:500 20px/1.3 var(--display);margin:0 0 8px}.reward-card .prof-p{margin:0 0 20px}
.reward-reveal{display:flex;flex-direction:column;gap:8px;margin:0 0 18px}.reward-reveal strong{font:500 28px/1.3 var(--display)}
.reward-reveal>span:last-child,.reward-reveal small,.reward-note,.reward-details{font:400 13px/1.5 var(--display);color:var(--muted)}
.reward-content>.experience-meter{margin-bottom:18px;max-width:500px}.reward-claim{min-width:150px}.reward-note{margin:10px 0 18px}
.reward-details{border-top:1px solid var(--line);padding-top:14px}.reward-details summary{cursor:pointer;color:var(--ink-2)}
.reward-odds{display:grid;grid-template-columns:1fr auto;gap:7px;max-width:460px}.reward-odds dd{margin:0;color:var(--ink)}
.profile-edit summary{cursor:pointer;font-size:16px}.profile-edit .prof-form{margin-top:20px}
#view-tiers .tiers-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:12px}
#tiersGrid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-block:24px}
#tiersGrid .experience-tier{padding:20px 16px;border:1px solid var(--line);border-radius:20px;background:var(--control-panel);display:flex;flex-direction:column;min-width:0}
#tiersGrid .experience-tier.mine{border-color:var(--accent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--accent) 12%,transparent)}
.tier-top{display:flex;align-items:center;justify-content:space-between;gap:6px;flex-wrap:wrap}.tier-top h2{font:500 20px/1.3 var(--display);margin:0}
.tier-current{font:400 10px/1.5 var(--display);padding:2px 7px;border:1px solid var(--line);border-radius:20px;color:var(--ink-2)}
.tier-hold{font:400 12px/1.5 var(--display);color:var(--muted);margin:10px 0 20px}
.tier-allowance{display:flex;flex-direction:column;gap:4px}.tier-allowance strong{font:400 32px/1.1 var(--display)}.tier-allowance span{font-size:12px;color:var(--muted)}
.tier-includes{padding:16px 0 0!important;margin:18px 0 0!important;border-top:1px solid var(--line);list-style:none;font-size:12px;line-height:1.6;display:flex;flex-direction:column;gap:8px}
.tier-includes li:before{display:none!important}.tier-simple-note{grid-column:1/-1;font-size:14px;line-height:1.6}.tier-simple-note h3{font-size:18px;margin:0}.tier-simple-note p{color:var(--muted);max-width:900px}
#view-tiers .tiers-note{display:none}#tiersMatrix{font-size:13px}#tiersMatrix th,#tiersMatrix td{padding:12px}
@media(max-width:1050px){#tiersGrid,#view-tiers .tiers-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.profile-usage{grid-template-columns:1fr}.experience-meter,.reward-card{padding:18px!important}#tiersGrid,#view-tiers .tiers-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.tier-top h2{font-size:18px}.tier-allowance strong{font-size:28px}#tiersGrid .experience-tier{padding:16px 12px}}