/* v11: warm paper panels, team colours and compact action labels. */
.shop-launch{display:flex;align-items:center;gap:14px;background:var(--cream);color:var(--ink);border:0;padding:12px 16px;font-size:11px;font-weight:900;margin-left:auto}.shop-launch b{color:#9c7114;white-space:nowrap}.shop-launch kbd{background:var(--ink);color:var(--cream);border:0}header .textbutton{margin-left:0}.shop-hud{position:absolute;left:28px;top:78px;pointer-events:auto;border:1px solid #fff9;background:#f7f3e6;color:#26251f;padding:9px 12px;font-weight:900;font-size:12px}.shop-hud kbd{margin-left:8px;background:#222;color:#fff;border:0}
.paper-overlay{position:absolute;inset:0;z-index:15;background:#0c102bb0;backdrop-filter:blur(5px);display:flex;align-items:center;justify-content:center;padding:24px;color:#24251f;text-shadow:none}.paper-window{background:#faf6e9;background-image:radial-gradient(#c4bba11c .6px,transparent .6px);background-size:3px 3px;box-shadow:0 28px 100px #05091980;border:1px solid #fbf7e9}.shop-window{width:min(1160px,94vw);height:min(790px,90vh);display:flex;flex-direction:column}.paper-header{display:flex;align-items:center;gap:20px;padding:17px 20px;background:#191c1e;color:#f8f4e6;flex-shrink:0}.paper-header h2{font-size:27px;letter-spacing:-1px;line-height:1.1;margin:0;font-weight:900}.paper-eyebrow{display:block;color:#c6bfae;font-size:9px;letter-spacing:2px;margin-bottom:7px}.collection-count{font-size:10px;letter-spacing:1px;border:1px dashed #bcb5a666;padding:8px 10px;margin-left:auto;white-space:nowrap}.coin-balance{font-size:25px;color:#f2c65e;white-space:nowrap}.coin-balance b{color:#fff8e8;font-variant-numeric:tabular-nums}.paper-close{width:40px;height:40px;flex-shrink:0;color:#20231e;background:#fbf6e7;border:0;font-size:30px;line-height:1;font-weight:700}.paper-close:hover{background:#d7ff3f}.shop-body{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:22px;padding:18px 20px 10px;min-height:0;flex:1}.catalog-column{min-height:0;display:flex;flex-direction:column}.catalog-intro{display:flex;justify-content:space-between;gap:10px;font-size:10px;letter-spacing:1px;border-bottom:1px solid #b5ad993e;padding-bottom:13px;color:#817d72}.catalog-intro strong{color:#292b24}#itemCatalog{overflow:auto;scrollbar-width:thin;scrollbar-color:#b7ad98 #ede8dc;padding:0 10px 16px 0}.rarity-group{padding-top:20px}.rarity-heading{border-left:5px solid var(--rarity);padding-left:11px;margin-bottom:12px}.rarity-heading h3{font-size:20px;letter-spacing:-.5px;margin:0 0 5px}.rarity-heading span{font-size:11px;color:#79776e}.rarity-heading span b{color:#31322b}.catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.catalog-card{background:color-mix(in srgb,var(--rarity) 10%,#f3eee2);border:1px solid color-mix(in srgb,var(--rarity) 26%,transparent);min-width:0}.catalog-art{height:105px;background:radial-gradient(ellipse at 50% 100%,color-mix(in srgb,var(--rarity) 32%,transparent),transparent 80%);padding:10px;position:relative}.catalog-art:after{content:'';position:absolute;inset:8px;border:1px solid color-mix(in srgb,var(--rarity) 24%,transparent);pointer-events:none}.catalog-art .item-art{filter:drop-shadow(0 8px 7px #26333a20)}.catalog-copy{padding:10px}.catalog-copy h4{font-size:13px;margin:0 0 5px;letter-spacing:-.3px}.catalog-copy>span{font-size:10px;color:#74746c}.catalog-copy p{font-size:10px;line-height:1.45;color:#66695f;min-height:43px;margin:7px 0}.ownership{display:inline-block;background:#f9f6ee;font-size:9px;padding:5px 7px;letter-spacing:.3px}.ownership.owned{background:#bff1d6;color:#174f37}.rarity-group:first-child .catalog-grid{grid-template-columns:1fr}.rarity-group:first-child .catalog-card{display:flex;align-items:center;background:linear-gradient(110deg,#431b34,#191d28);color:#fff2df;min-height:150px}.rarity-group:first-child .catalog-art{width:44%;height:155px;flex-shrink:0}.rarity-group:first-child .catalog-copy h4{font-size:28px}.rarity-group:first-child .catalog-copy p,.rarity-group:first-child .catalog-copy>span{color:#dfbfd3}.rarity-group:first-child .ownership{color:#24231d}.roll-column{overflow:auto;scrollbar-width:thin;background:#eae5d94f;padding:14px;min-height:0}.spin-heading>span{font-size:9px;letter-spacing:1.6px;color:#76776d}.spin-heading h3{font-size:23px;letter-spacing:-.7px;margin:8px 0 16px}.roll-window{overflow:hidden;height:122px;position:relative;background:#222834;border:1px solid #363a42}.roll-window:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#151d2b99,transparent 25%,transparent 75%,#151d2b99);pointer-events:none}.roll-pointer{position:absolute;z-index:2;left:50%;transform:translateX(-50%);top:-3px;font-size:24px;color:#d7ff3f;text-shadow:0 2px 5px #000}.roll-track{display:flex;gap:8px;height:100%;padding:12px 0;will-change:transform}.item-card{width:128px;flex-shrink:0;border-bottom:3px solid var(--rarity);background:#f7f3e6;color:#252a2a;display:flex;flex-direction:column;align-items:center;padding:5px}.item-card .item-art{width:90px;height:65px}.item-card b{font-size:10px}.roll-result{min-height:174px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:15px 5px}.roll-result>.item-art{width:100px;height:75px;margin:4px}.result-kicker{font-size:9px;letter-spacing:1.5px;font-weight:900;color:#7d8376;margin-bottom:8px}.roll-result>b{font-size:20px;letter-spacing:-.6px}.roll-result p{font-size:11px;color:#727769;line-height:1.5;margin:8px 0 0;max-width:270px}.spin-button{border:1px solid #fff;background:#d7ff3f;color:#1b251b;width:100%;padding:17px 8px;font-size:14px;font-weight:900;box-shadow:0 3px #7b932c;letter-spacing:.3px}.spin-button:hover{background:#e3ff7b}.spin-button:disabled{background:#d8d6c5;color:#8a8c80;box-shadow:none;cursor:default}.roll-cost{text-align:center;font-size:10px;line-height:1.8;color:#76796b;margin:11px 0 16px}.guarantees{border-top:1px solid #b5ad9952;padding-top:14px}.guarantees h4{font-size:10px;letter-spacing:1.3px;margin:0 0 13px}.pity-row{margin-bottom:12px}.pity-row>span{display:flex;justify-content:space-between;font-size:10px;color:#77796d;margin-bottom:6px}.pity-row b{color:#343a30}.pity-row>div{background:#d7d4c7;height:6px}.pity-row i{display:block;height:100%;transition:width .3s}.guarantees>p{font-size:9px;color:#838476;line-height:1.6}.shop-foot{display:flex;flex-direction:column;gap:5px;padding:10px 20px 14px;border-top:1px solid #b5ad992b;font-size:10px;line-height:1.5;color:#74786b}.shop-foot b{font-weight:400;color:#353c30}.reward-pop{animation:reward-in .45s ease-out}@keyframes reward-in{from{transform:scale(.9);opacity:.5}to{transform:scale(1);opacity:1}}
.stats-overlay{position:absolute;inset:0;z-index:8;display:flex;align-items:center;justify-content:center;pointer-events:none;color:#24251f;padding:20px;background:#10172d26}.stats-window{width:min(850px,86vw);max-height:88vh;overflow:auto;scrollbar-width:thin}.stats-window .paper-header{padding:16px 20px}.stats-window .paper-header h2{font-size:25px}.stats-window .paper-close{pointer-events:auto;width:32px;height:32px;font-size:24px}.stats-window .paper-header>span{font-size:9px;letter-spacing:1px;margin-left:auto;color:#b6b9ad}.stats-team h3{display:flex;align-items:center;gap:10px;font-size:20px;margin:0;padding:13px 20px;background:#e8e4d9}.stats-team h3 i{width:10px;height:10px;background:var(--team)}.stats-team h3 span{color:#b7a188;margin:0 4px}.stats-team table{width:100%;border-collapse:collapse;table-layout:fixed}.stats-team th:first-child{width:42%;text-align:left;padding-left:20px}.stats-team th{font-size:10px;font-weight:400;color:#918f83;padding:9px 4px}.stats-team td{border-top:1px dashed #d8d2c260;text-align:center;font-size:21px;font-weight:800;padding:10px 4px;font-variant-numeric:tabular-nums}.stats-team td.zero{color:#d2cfc2}.stats-team td:first-child{display:flex;align-items:center;text-align:left;gap:11px;padding-left:20px;font-size:14px}.stats-team td small{display:block;font-size:8px;font-weight:400;letter-spacing:.5px;margin-top:4px;color:#8c8f80}.player-badge{display:grid;place-items:center;width:31px;height:34px;background:color-mix(in srgb,var(--team) 18%,#f1eee4);border-bottom:3px solid var(--team);font-size:13px;color:#3b433b;flex-shrink:0}.stats-team .you{background:#d8f1d6a6}.stats-foot{display:flex;justify-content:space-between;gap:10px;padding:12px 20px;font-size:9px;color:#858979;border-top:1px solid #d6d0c4}.stats-foot kbd{color:#fbf7e7;background:#22251e;border:0}.stats-shortcut{pointer-events:auto;position:absolute;left:28px;bottom:200px;background:#1b201fe8;color:#f7f3e6;border:1px solid #efe8d780;font-size:10px;padding:8px;font-weight:700}.stats-shortcut kbd{background:#faf3e4;color:#25251c;margin-left:7px;border:0}
/* Compact reference: individual right-aligned labels, no enclosing panel. */
.controls.compact-controls{top:auto;bottom:68px;right:20px;width:auto;max-width:220px;max-height:calc(100vh - 195px);padding:0;border:0;border-radius:0;background:none;backdrop-filter:none;overflow:auto;pointer-events:none;text-shadow:none}.compact-controls .quick-key{display:flex;justify-content:flex-end;gap:0;margin:0 0 5px;align-items:stretch;font-size:12px}.quick-key span{background:#eee6c4b8;color:#22281f;padding:6px 8px;font-weight:800}.quick-key kbd{background:#20241c;border:4px solid #eee6c4b8;background-clip:padding-box;color:#fff9ea;font-size:10px;border-radius:0;padding:3px 5px;min-width:28px;text-align:center}.quick-key:nth-child(3n+1) span{background:#fff9e9}.quick-key:nth-child(3n+1) kbd{border-color:#fff9e9}.quick-key:nth-child(8){margin-top:13px}.compact-controls>small{font-size:7px;margin-top:9px;color:#eee9d6;text-shadow:0 1px 3px #000;text-align:right}.controls.compact-controls .quick-key span{font-size:12px}#pickupNotice{right:210px}#matchReward{color:#d7ff3f!important}
@media(max-height:780px){.paper-overlay{padding:14px}.shop-window{height:94vh}.paper-header{padding:12px 16px}.shop-body{padding:12px 16px 6px}.roll-result{min-height:145px}.roll-result>.item-art{height:55px}.roll-column{padding:10px}.stats-team td{padding-top:7px;padding-bottom:7px;font-size:18px}.stats-team h3{padding:10px 20px}.stats-team td:first-child{font-size:12px}.stats-window{max-height:94vh}.controls.compact-controls{bottom:60px}.compact-controls .quick-key{margin-bottom:4px}.quick-key span{padding:4px 7px}.quick-key kbd{padding:1px 4px}.shop-foot{font-size:9px}}
@media(max-width:950px){.shop-body{grid-template-columns:minmax(0,1fr) 290px;gap:12px}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shop-launch{padding:10px;font-size:10px;gap:8px}.paper-header{gap:12px}.collection-count{display:none}.coin-balance{margin-left:auto}.catalog-intro{font-size:8px}.controls.compact-controls{right:12px;max-width:170px}.controls.compact-controls .quick-key span{font-size:10px}.quick-key kbd{font-size:9px}.stats-team th:first-child{width:37%}.stats-team th{font-size:9px}.stats-shortcut{left:14px;bottom:170px;font-size:9px}.shop-hud{left:14px}.paper-header h2{font-size:23px}}
@media(max-width:650px){.shop-window{width:96vw;height:96vh}.paper-overlay{padding:6px}.shop-body{display:flex;flex-direction:column;overflow:auto;min-height:0}.catalog-column{order:2;min-height:auto}.roll-column{order:1;flex-shrink:0;overflow:visible}.roll-result{min-height:125px}.roll-result>.item-art{height:48px}#itemCatalog{overflow:visible}.catalog-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.shop-foot{padding:9px 12px;font-size:8px}.paper-header{padding:12px;gap:10px}.paper-header h2{font-size:22px}.paper-eyebrow{font-size:7px}.coin-balance{font-size:20px}.paper-close{width:32px;height:32px}.shop-launch{gap:8px;margin-left:auto}.shop-launch kbd{display:none}header{gap:10px}header .brand{font-size:17px}header .textbutton{font-size:8px}.stats-overlay{padding:8px}.stats-window{width:98vw}.stats-window .paper-header{padding:12px}.stats-window .paper-header h2{font-size:19px}.stats-window .paper-header>span{font-size:7px}.stats-team th:first-child{width:36%;padding-left:10px}.stats-team td:first-child{padding-left:10px;gap:6px;font-size:10px}.stats-team td{font-size:16px}.player-badge{width:22px;height:27px;font-size:10px}.stats-team td small{font-size:6px}.stats-team th{font-size:8px}.stats-team h3{font-size:16px;padding:10px}.stats-foot{font-size:7px;padding:10px}.controls.compact-controls{top:auto;bottom:58px;right:8px;width:auto;max-height:calc(100vh - 220px);max-width:140px}.controls.compact-controls .quick-key span{font-size:9px}.quick-key kbd{font-size:8px}.stats-shortcut{bottom:auto;top:120px;left:12px;font-size:8px}.shop-hud{top:78px;font-size:10px}#pickupNotice{right:160px}}
@media(prefers-reduced-motion:reduce){.reward-pop{animation:none}.pity-row i{transition:none}}

.model-preview{object-fit:contain;filter:drop-shadow(0 8px 7px #26333a28)}

.stats-overlay{pointer-events:auto}

/* Spin reveal lives at the viewport center, above the shop. */
.spin-overlay{position:fixed;z-index:25;background:#090e22c9;backdrop-filter:blur(9px);padding:16px}
.spin-window{width:min(760px,100%);max-height:calc(100dvh - 32px);overflow:auto;scrollbar-width:thin}
.spin-window .paper-header{justify-content:space-between}
.spin-stage{padding:28px}
.spin-stage .roll-window{height:166px}
.spin-stage .roll-track{padding:18px 0}
.spin-stage .item-card .item-art{width:116px;height:100px}
.spin-stage .roll-pointer{font-size:30px;top:-6px}
.spin-stage .roll-result{height:208px;min-height:208px;padding:18px 8px}
.spin-stage .roll-result>.item-art{width:130px;height:100px;margin:0}
.spin-stage .roll-result>b{font-size:27px}
.spin-stage .roll-result p{max-width:100%}
.spin-stage>.spin-button{display:block;max-width:300px;margin:0 auto}
@media(max-width:650px){.spin-overlay{padding:10px}.spin-window{max-height:calc(100dvh - 20px)}.spin-stage{padding:16px}.spin-stage .roll-result>b{font-size:23px}}
@media(max-height:600px){.spin-stage{padding:12px}.spin-stage .roll-window{height:118px}.spin-stage .item-card .item-art{height:60px}.spin-stage .roll-track{padding:10px 0}.spin-stage .roll-result{height:145px;min-height:145px;padding:8px}.spin-stage .roll-result>.item-art{height:50px}.spin-stage>.spin-button{padding:12px}}
/* A separate reveal language for each rarity; finite, no screen flashes. */
.spin-overlay .spin-window{transition:box-shadow .35s,border-color .35s}
.spin-overlay[data-reveal] .spin-window{border-color:var(--reward-color);box-shadow:0 0 0 1px var(--reward-color),0 18px 90px #05091999,0 0 55px color-mix(in srgb,var(--reward-color) 30%,transparent)}
.spin-overlay[data-reveal] .paper-eyebrow{color:var(--reward-color)}
.spin-overlay[data-reveal] .roll-pointer{color:var(--reward-color)}
#centerRollResult{position:relative;isolation:isolate}
#centerRollResult:before,#centerRollResult:after{content:'';position:absolute;pointer-events:none;z-index:-1;left:50%;top:46%;opacity:0}
.spin-overlay[data-reveal] #centerRollResult:before{width:210px;height:130px;margin:-65px 0 0 -105px;background:radial-gradient(ellipse,color-mix(in srgb,var(--reward-color) 28%,transparent),transparent 70%);opacity:1}
.spin-overlay[data-reveal] #centerRollResult>.item-art{animation:reward-lift .6s cubic-bezier(.2,.8,.2,1) both;filter:drop-shadow(0 7px 12px color-mix(in srgb,var(--reward-color) 45%,transparent))}
.spin-overlay[data-reveal="common"] #centerRollResult>.item-art{animation:reward-lift .35s ease-out both}
.spin-overlay[data-reveal="uncommon"] #centerRollResult:after,.spin-overlay[data-reveal="rare"] #centerRollResult:after,.spin-overlay[data-reveal="epic"] #centerRollResult:after,.spin-overlay[data-reveal="mythic"] #centerRollResult:after{width:120px;height:120px;margin:-60px 0 0 -60px;border:2px solid var(--reward-color);border-radius:50%;animation:reward-ring .9s ease-out both}
.spin-overlay[data-reveal="rare"] #centerRollResult>.item-art{animation:reward-rise .8s cubic-bezier(.16,1,.3,1) both}
.spin-overlay[data-reveal="epic"] #centerRollResult:before,.spin-overlay[data-reveal="mythic"] #centerRollResult:before{width:220px;height:180px;margin:-90px 0 0 -110px;background:repeating-conic-gradient(from 0deg,transparent 0deg 22deg,color-mix(in srgb,var(--reward-color) 30%,transparent) 23deg 30deg);mask-image:radial-gradient(ellipse,#000,transparent 70%);animation:reward-rays 2.4s ease-out both}
.spin-overlay[data-reveal="epic"] #centerRollResult>.item-art{animation:reward-epic 1s cubic-bezier(.16,1,.3,1) both}
.spin-overlay[data-reveal="mythic"] #centerRollResult:before{background:repeating-conic-gradient(transparent 0deg 14deg,#ffcf6859 15deg 20deg,#ff39714d 21deg 27deg);animation-duration:3.2s;width:280px;height:200px;margin:-100px 0 0 -140px}
.spin-overlay[data-reveal="mythic"] #centerRollResult:after{border-color:#e9b948;box-shadow:0 0 20px #ff397166;animation-duration:1.3s}
.spin-overlay[data-reveal="mythic"] #centerRollResult>.item-art{animation:reward-mythic 1.35s cubic-bezier(.16,1,.3,1) both}
.spin-overlay[data-reveal="mythic"] .spin-window{box-shadow:0 0 0 1px #ffcf68,0 0 90px #ff39714d,0 18px 90px #05091999}
.reward-sparks{position:absolute;inset:0;pointer-events:none;z-index:-1;overflow:hidden}
.reward-sparks i{position:absolute;left:50%;top:46%;width:4px;height:4px;border-radius:1px;background:var(--reward-color);opacity:0;animation:reward-spark 1.15s ease-out var(--delay) both}
.spin-overlay[data-reveal="mythic"] .reward-sparks i:nth-child(2n){background:#d89c20;width:5px;height:5px;animation-duration:1.8s}
@keyframes reward-lift{from{opacity:0;transform:translateY(10px) scale(.9)}to{opacity:1;transform:none}}
@keyframes reward-rise{from{opacity:0;transform:translateY(24px) scale(.7)}to{opacity:1;transform:none}}
@keyframes reward-epic{from{opacity:0;transform:translateY(20px) rotate(-14deg) scale(.55)}65%{opacity:1;transform:rotate(4deg) scale(1.1)}to{transform:none}}
@keyframes reward-mythic{from{opacity:0;transform:translateY(30px) rotate(-20deg) scale(.3)}55%{opacity:1;transform:translateY(-8px) rotate(7deg) scale(1.2)}to{transform:none}}
@keyframes reward-ring{from{opacity:.7;transform:scale(.35)}to{opacity:0;transform:scale(1.8)}}
@keyframes reward-rays{from{opacity:0;transform:rotate(-50deg) scale(.5)}25%{opacity:.9}to{opacity:.45;transform:rotate(35deg) scale(1)}}
@keyframes reward-spark{0%{opacity:0;transform:translate(0,0) scale(.3)}15%{opacity:1}to{opacity:0;transform:translate(var(--dx),var(--dy)) rotate(140deg) scale(.25)}}
@media(prefers-reduced-motion:reduce){.spin-overlay .spin-window{transition:none}.spin-overlay[data-reveal] #centerRollResult>.item-art,.spin-overlay[data-reveal] #centerRollResult:before,.spin-overlay[data-reveal] #centerRollResult:after,.reward-sparks i{animation:none}.spin-overlay[data-reveal] #centerRollResult:after,.reward-sparks{display:none}}

/* Owned items require explicit approval before entering the match box pool. */
.item-activation{display:block;width:100%;margin-top:10px;padding:10px 8px;border:1px solid #55704c;background:#fffef7;color:#263e29;font:inherit;font-size:11px;font-weight:800;cursor:pointer;border-radius:5px}.item-activation[aria-pressed="true"]{background:#29462d;color:#fffef2}.item-activation:focus-visible{outline:3px solid #80a850;outline-offset:3px}.unlock-hint{display:block;font-size:11px;color:#6d7469;margin-top:10px}.active-pool-hint{background:#e7eddb;border-left:3px solid #506f39;padding:12px;font-size:13px;line-height:1.5;color:#293f2a}.training-guide{position:absolute;top:135px;left:24px;width:300px;padding:18px;background:rgba(14,26,33,.94);border:1px solid #73854b;border-top:3px solid #d7ff3f;pointer-events:auto;color:#eef3e7}.training-guide>span{font-size:10px;letter-spacing:1.5px;color:#d7ff3f}.training-guide>strong{display:block;font-size:22px;margin:8px 0}.training-guide p{font-size:12px;line-height:1.6;color:#becbc7}.training-guide>div{display:flex;gap:5px}.training-guide button{background:#293b40;color:#f6ffeb;border:1px solid #56685f;padding:8px 5px;cursor:pointer;font-size:10px}.training-guide small{display:block;font-size:10px;color:#c2d388;margin-top:10px}@media(max-width:800px){.training-guide{top:115px;left:10px;width:230px;padding:10px}.training-guide>strong{font-size:16px}.training-guide p{max-height:60px;overflow:auto}}
