/* Account learning UI: charcoal, worn brass and paper, matching the pixel town. */
#account-layer{position:absolute;inset:0;z-index:100;pointer-events:auto;isolation:isolate}
#account-layer>.account-overlay{width:100%;height:100%;overflow:hidden;touch-action:pan-y}
#account-layer .account-panel{max-height:100%;min-height:0;overflow:auto;overscroll-behavior:contain;touch-action:pan-y;scroll-padding-block:16px;padding-top:0;-webkit-overflow-scrolling:touch}
#account-layer .account-panel-head{position:sticky;top:0;z-index:1;background:#1b1e15;margin-inline:-20px;padding:20px 20px 10px}
.account-progress-button{display:flex;align-items:center;justify-content:center;flex:0 0 auto;min-height:44px;padding:4px 8px;border:0;border-right:1px solid #82755060;background:transparent;color:#eddfb7;cursor:pointer}
.account-badge{display:flex;flex-direction:column;gap:2px;min-width:54px;text-align:left;font-variant-numeric:tabular-nums;line-height:1.2;white-space:nowrap}
.account-badge b{font-size:12px;font-weight:700;color:#f0dfac;letter-spacing:0}
.account-badge b>span{font-size:10px;font-weight:500;color:#c1b893}
.account-badge small{font-size:9px;color:#c9c4ac}
.account-badge-track{height:2px;background:#776b433e;margin-top:2px;overflow:hidden}
.account-badge-track i{display:block;height:100%;background:#d9bd75}
.account-progress-button:focus-visible{outline:2px solid #efd395;outline-offset:-3px}
.account-progress-button:hover{background:#96814320}
.town-hud:has(.account-progress-button) .town-header>.town-identity{flex-shrink:0}
.town-hud:has(.account-progress-button) .town-header h1{white-space:nowrap}
.town-hud .town-tools:has(.account-progress-button){min-width:0}
.town-hud .town-tools:has(.account-progress-button) .wallet{min-width:0;overflow:hidden;text-overflow:ellipsis}
.account-level-badge{display:inline-block!important;flex:none;margin:3px 0 0;padding:1px 5px;border:1px solid #91805880;background:#71613b20;color:#d9c48c!important;font-size:10px!important;line-height:1.5!important;font-weight:500;letter-spacing:0;white-space:nowrap}
.account-feature-locked,[data-account-locked="true"]{cursor:pointer}
.account-feature-locked:not(.btn-primary),[data-account-locked="true"]:not(.btn-primary){border-color:#85754c8c!important;background-color:#27271a!important}
.account-feature-locked:focus-visible,[data-account-locked="true"]:focus-visible{outline:2px solid #efd395;outline-offset:-3px}
.town-hud .town-action-grid>button[data-account-locked="true"]{align-items:flex-start}
.town-hud .town-action-grid>button[data-account-locked="true"]>.game-icon{margin-top:5px;opacity:.72}
.town-hud .town-card-link[data-account-locked="true"]{flex-wrap:wrap;max-width:110px;gap:2px 4px;white-space:normal}
.town-hud .town-card-link .account-level-badge{margin:0;font-size:9px!important}
.account-overlay{background:#0d100ccb;backdrop-filter:blur(3px)}
.account-panel{width:min(590px,100%);padding:20px;background:#1b1e15;border:1px solid #9c8859;box-shadow:inset 0 0 0 3px #a58c4d16,0 8px 30px #0008;color:#ebe0c2;text-align:left;scrollbar-color:#998354 #1b1e15}
.account-panel-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 15px;padding-bottom:10px;border-bottom:1px solid #8d7a493f}
.account-panel .account-panel-head h2{margin:0;font-size:21px;line-height:1.4;letter-spacing:0}
.account-panel-head .icon-btn{min-width:44px;min-height:44px;flex:none;border:1px solid #8d7a4966;background:#11170d80;color:#dfd3b0;font-size:26px}
.account-roadmap-intro{display:flex;align-items:center;gap:16px;padding:12px;background:#10160f80;border:1px solid #8d7a494d}
.account-roadmap-intro .account-badge{min-width:78px;flex:none}
.account-roadmap-intro .account-badge b{font-size:17px}
.account-roadmap-intro .account-badge small{font-size:11px}
.account-roadmap-intro>p{margin:0;font-size:13px;color:#d6cfb1;line-height:1.6;word-break:keep-all;overflow-wrap:anywhere}
.account-xp-guide{font-size:12px;line-height:1.75;color:#cbc4a8;word-break:keep-all;overflow-wrap:anywhere;margin:14px 0 5px}
.account-guide-note{font-size:11px;line-height:1.7;color:#aaa98f;margin:6px 0 14px}
.account-roadmap{padding:0;margin:17px 0;list-style:none;border-top:1px solid #82754a5c}
.account-roadmap>li{display:grid;grid-template-columns:60px minmax(0,1fr);gap:12px;padding:15px 0;border-bottom:1px solid #82754a5c}
.account-roadmap-level{display:flex;align-items:center;flex-direction:column;gap:4px;padding-top:2px;color:#c5bb98}
.account-roadmap-level>b{font-size:15px;color:#d6c796}
.account-roadmap-level>small{font-size:10px;color:#a6a78d}
.account-roadmap>li.is-next{border-left:2px solid #d3b571;padding-left:7px;background:#8c793314}
.account-roadmap>li.is-next .account-roadmap-level>small{color:#f0d68d}
.account-roadmap>li.is-open .account-roadmap-level>small{color:#b2c294}
.account-roadmap-features{display:flex;flex-direction:column;gap:9px;min-width:0}
.account-roadmap-features h3{margin:0 0 3px;color:#eee0b8;font-size:14px;line-height:1.5;font-weight:600}
.account-roadmap-features p{margin:0;color:#bcbca2;font-size:12px;line-height:1.7;word-break:keep-all;overflow-wrap:anywhere}
.account-lock-notice{padding:8px 0 5px}
.account-lock-level{display:inline-block;border:1px solid #aa935b;background:#a38c3420;color:#ebd597;padding:4px 9px;font-size:12px}
.account-lock-notice h3{font-size:20px;color:#f0e2bc;line-height:1.5;margin:14px 0 6px}
.account-lock-notice>p{font-size:13px;line-height:1.75;color:#c3c0a4;word-break:keep-all}
.account-lock-progress{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:18px 0;padding:11px 0;border-block:1px solid #8c795249;font-size:13px;color:#d7c58f}
.account-lock-progress>b{font-weight:500;color:#ccc5a8}
.account-lock-notice>.btn-secondary{width:100%;margin-top:14px;min-height:46px;border-color:#ad92596b;background:#97803d18;color:#e8d6a5;font-size:13px}
.chronicle-body>.account-lock-notice{max-width:480px;margin:0 auto;padding:16px 0 20px}
.chronicle-tabs button .account-level-badge{display:block!important;width:max-content;margin:4px auto 0;font-size:9px!important}
.armory-wallet>.account-weapon-unlock{font-size:11px;color:#d3c391}
.account-armory-note{margin:0 0 13px;color:#c5c0a5;font-size:12px;line-height:1.7}
.account-weapon-buy-lock{background:#544926!important;border-color:#a18a55!important;color:#ebd8a5!important;box-shadow:none!important}
.account-weapon-buy-lock>.account-level-badge{margin:0 0 0 7px;font-size:11px!important;border:0;padding:0;background:none}
.account-reward{margin:14px 0;padding:12px 13px;text-align:left;border:1px solid #a48a535c;background:#84722b12;color:#e8d49d}
.account-reward>div{display:flex;justify-content:space-between;gap:10px;align-items:baseline;flex-wrap:wrap}
.account-reward b{font-size:14px;line-height:1.5;font-weight:600}
.account-reward span{font-size:12px;color:#d2c498;font-variant-numeric:tabular-nums}
.account-reward p,.account-reward>small{display:block;font-size:12px;line-height:1.7;color:#c7c4a8;margin:7px 0 0;word-break:keep-all}
.account-reward .text-btn{font-size:11px;min-height:36px;padding:3px 0 0;color:#e3c986}
@media(max-width:380px){.account-progress-button{padding:4px 5px}.account-badge{min-width:48px}.account-badge b{font-size:11px}.account-badge b>span{font-size:9px}.account-badge small{font-size:8px}.town-hud .town-tools:has(.account-progress-button){padding-left:0;gap:4px}.town-hud .town-tools:has(.account-progress-button) .wallet{font-size:11px;max-width:88px;overflow:hidden;text-overflow:ellipsis}.town-hud .town-tools:has(.account-progress-button) .wallet .game-icon{width:17px;height:17px}.town-hud:has(.account-progress-button) .town-header h1{font-size:16px}.account-panel{padding:15px}.account-roadmap>li{grid-template-columns:48px minmax(0,1fr);gap:8px}}
@media(prefers-reduced-motion:reduce){.account-progress-button,.account-badge-track i{transition:none}}
@media(max-width:380px){#account-layer .account-panel-head{margin-inline:-15px;padding:15px 15px 10px}}