.achv-track-card{border:1px solid color-mix(in oklch, var(--tier-color,var(--border)) 24%, var(--border));background:color-mix(in oklch, var(--bg-card) 78%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:var(--r-md);padding:12px 14px;position:relative}.achv-track{grid-template-columns:60px 1fr;align-items:center;gap:16px;display:grid}.achv-track-icon{--achv-art-scale:1.08;border-radius:var(--r-md);object-fit:contain;width:60px;height:60px;transform:scale(var(--achv-art-scale));filter:drop-shadow(0 0 10px var(--tier-glow))}.achv-track-icon-locked{filter:grayscale()brightness(.55);opacity:.55}.achv-track-body{min-width:0}.achv-track-title{color:var(--t1);margin:0 0 4px;font-size:13px;font-weight:800}.achv-track-hint{color:var(--t3);margin:0 0 8px;font-size:12px;line-height:1.4}.achv-bar{cursor:pointer;height:13px;list-style:none;display:block;position:relative}.achv-bar::-webkit-details-marker{display:none}.achv-bar-guest:before{content:"";position:absolute;inset:-16px 0}.achv-bar-track{background:var(--bg3);border-radius:999px;height:9px;position:absolute;top:50%;left:0;right:0;overflow:hidden;transform:translateY(-50%);box-shadow:inset 0 1px 3px #0006}.achv-bar-fill{min-width:8px;height:100%;width:var(--progress,0%);background:linear-gradient(90deg, color-mix(in oklch, var(--tier-color) 55%, black), var(--tier-color));box-shadow:0 0 10px var(--tier-glow), 0 0 3px var(--tier-glow);border-radius:999px;transition:width .9s cubic-bezier(.16,1,.3,1);position:relative;overflow:hidden}.achv-bar-fill:after{content:"";background:linear-gradient(110deg,#0000 30%,#fff9 50%,#0000 70%) 0 0/220% 100%;animation:2.6s linear infinite achv-shimmer;position:absolute;inset:0}@keyframes achv-shimmer{0%{background-position:220% 0}to{background-position:-220% 0}}.achv-bar-count{color:#fff;text-shadow:0 1px 2px #000c;font-variant-numeric:tabular-nums;letter-spacing:.1px;pointer-events:none;z-index:1;justify-content:center;align-items:center;gap:4px;font-size:9px;font-weight:800;display:flex;position:absolute;inset:0}.achv-bar-chevron{transition:transform .2s var(--ease-fn);display:inline-block}.achv-ladder[open] .achv-bar-chevron{transform:rotate(90deg)}.achv-track-rarity{color:var(--t3);font-variant-numeric:tabular-nums;text-align:center;cursor:default;justify-content:center;align-items:center;font-size:12px;font-weight:800;line-height:1.15;display:flex;position:absolute;top:12px;right:14px}@media (prefers-reduced-motion:reduce){.achv-bar-fill:after{animation:none}.achv-bar-fill{transition:none}}@media (max-width:560px){.achv-track{grid-template-columns:60px 1fr}.achv-track-card>.achv-track-rarity{display:none}.achv-track-icon,.achv-single-badge{width:60px;height:60px}}.achv-ladder{margin-top:8px}.achv-ladder-body{transition:grid-template-rows .32s var(--ease-fn);grid-template-rows:0fr;display:grid}.achv-ladder[open] .achv-ladder-body{grid-template-rows:1fr}.achv-ladder-body-inner{gap:2px;min-height:0;padding-top:10px;display:grid;overflow:hidden}@media (prefers-reduced-motion:reduce){.achv-ladder-body{transition:none}}.achv-bar-guest-label{color:var(--t3);pointer-events:none;justify-content:center;align-items:center;gap:4px;font-size:11px;font-weight:700;display:flex;position:absolute;inset:0}.achv-bar-guest:hover .achv-bar-guest-label,.achv-bar-guest:focus-visible .achv-bar-guest-label{color:var(--t1)}.achv-rank-row{border-radius:8px;align-items:center;gap:10px;padding:6px 30px 6px 8px;display:flex;position:relative}.achv-rank-row[data-unlocked=false]{opacity:.5}.achv-rank-row:hover,.achv-rank-row:focus-within{background:var(--bg-hi)}.achv-rank-icon{border-radius:var(--r-sm);object-fit:contain;flex-shrink:0;width:36px;height:36px}.achv-rank-row[data-unlocked=false] .achv-rank-icon{filter:grayscale()brightness(.62)}.achv-rank-text{min-width:0;color:var(--t2);flex:1;margin:0;font-size:12px;line-height:1.4}.achv-rank-date{color:var(--t3);white-space:nowrap;flex-shrink:0;font-size:11px}.achv-rank-star-form{position:absolute;top:2px;right:2px}.achv-rank-star-form .achv-select-btn{opacity:0;width:22px;height:22px}.achv-rank-row:hover .achv-select-btn,.achv-rank-row:focus-within .achv-select-btn,.achv-select-btn:focus-visible,.achv-select-btn[data-active=true]{opacity:1}.achv-summary-row{flex-wrap:nowrap;gap:8px;margin-bottom:20px;display:flex}.achv-summary-card{text-align:left;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--r-md);cursor:pointer;min-width:0;min-height:52px;transition:border-color .15s var(--ease-fn), background .15s var(--ease-fn);flex:1 1 0;align-items:center;gap:8px;padding:10px 12px;display:flex;position:relative}.achv-summary-card:hover:not(:disabled){border-color:var(--border2);background:var(--bg-hi)}.achv-summary-card:disabled{cursor:default;opacity:.6}.achv-summary-card-title{text-wrap:balance;flex:1;min-width:0;line-height:1.25}.achv-summary-card-soon{color:var(--t3);background:var(--bg3);border-radius:999px;padding:2px 7px;font-size:9px;font-weight:700;position:absolute;top:6px;right:8px}.achv-summary-card[data-active=true]{border-color:var(--purple);background:color-mix(in oklch, var(--purple) 14%, var(--bg-card))}@media (max-width:640px){.achv-summary-row{scroll-snap-type:x mandatory;scrollbar-width:none;-webkit-overflow-scrolling:touch;padding:0 2px 8px;overflow-x:auto}.achv-summary-row::-webkit-scrollbar{display:none}.achv-summary-card{scroll-snap-align:start;flex:0 0 148px;min-height:68px;padding:12px}.achv-summary-card-title{line-height:1.3;font-size:12px!important}}.achv-select-btn{width:32px;height:32px;color:var(--t2);cursor:pointer;transition:var(--ease);background:0 0;flex-shrink:0;justify-content:center;align-items:center;display:flex}.achv-select-btn:hover{color:#fff}.achv-select-btn:active{transform:scale(.93)}.achv-select-btn[data-active=true]{color:var(--achv-select-color,var(--purple))}.achv-featured-chip{background:var(--bg-card);border:1px solid var(--border2);color:var(--t2);border-radius:999px;align-items:center;gap:8px;padding:6px 8px 6px 12px;font-size:12px;font-weight:700;display:inline-flex}.achv-featured-chip svg:first-child{color:var(--warn);flex-shrink:0}.achv-featured-chip-remove{border-radius:var(--r-sm);background:var(--bg-hi);width:20px;height:20px;color:var(--t3);cursor:pointer;border:none;flex-shrink:0;justify-content:center;align-items:center;display:flex}.achv-featured-chip-remove:hover{background:var(--bg-hi);color:#fff}.achv-single-card{border-radius:var(--r-md);border:1px solid var(--border);background:color-mix(in oklch, var(--bg-card) 78%, transparent);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);align-items:center;gap:12px;padding:12px 14px;display:flex;position:relative}.achv-single-card[data-unlocked=true]{border-color:color-mix(in oklch, var(--purple) 24%, var(--border))}.achv-single-card[data-unlocked=false]{opacity:.7}.achv-single-card[data-unlocked=false] .achv-single-badge,.achv-single-card[data-unlocked=false] .achv-single-icon{filter:grayscale()brightness(.55)}.achv-single-card[role=button]{cursor:pointer;transition:border-color .15s var(--ease-fn)}.achv-single-card[role=button]:hover{border-color:var(--border2)}.achv-single-star-form{position:absolute;top:8px;right:8px}.achv-single-star-form .achv-select-btn{opacity:0;width:22px;height:22px}.achv-single-card:hover .achv-select-btn,.achv-single-card:focus-within .achv-select-btn,.achv-select-btn:focus-visible,.achv-single-star-form .achv-select-btn[data-active=true]{opacity:1}.achv-single-icon{color:#fff;border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;width:60px;height:60px;font-size:18px;font-weight:800;display:flex;overflow:hidden}.achv-single-badge{--achv-art-scale:1.08;border-radius:var(--r-md);object-fit:contain;width:60px;height:60px;transform:scale(var(--achv-art-scale));flex-shrink:0}@media (max-width:640px){.achv-rank-star-form .achv-select-btn,.achv-single-star-form .achv-select-btn{width:44px;height:44px}.achv-rank-star-form{top:-9px;right:-9px}.achv-single-star-form{top:1px;right:1px}}.achv-single-body{flex-direction:column;flex:1;gap:2px;min-width:0;display:flex}.achv-single-title{color:var(--t1);font-size:13px;font-weight:800}.achv-single-desc{color:var(--t3);font-size:12px}.achv-single-date{color:var(--t3);font-size:11px;font-weight:600}.achv-single-rarity{color:var(--t3);font-variant-numeric:tabular-nums;white-space:nowrap;flex-shrink:0;font-size:11px;font-weight:700}
