.skin-picker{--sp-accent:var(--accent,#2c655b);--sp-surface:var(--accent-surface,#dce4cf);--sp-ease:var(--ease,cubic-bezier(.23, 1, .32, 1));margin:8px 0 28px}.skin-picker-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 16px;display:flex}.community-panel .skin-picker-head h3{margin:0}.skin-picker-bar{flex-wrap:wrap;align-items:center;gap:12px;margin:12px 0 16px;display:flex}.skin-segment{border:1px solid var(--pencil);background:var(--paper);border-radius:6px 10px 5px 8px;grid-auto-columns:1fr;grid-auto-flow:column;padding:3px;display:inline-grid;position:relative}.skin-segment:before{content:"";background:var(--sp-surface);width:calc(50% - 3px);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--sp-accent) 45%, transparent);transition:transform .28s var(--sp-ease);border-radius:4px 7px 3px 6px;position:absolute;top:3px;bottom:3px;left:3px}.skin-segment[data-kind=cape]:before{transform:translate(100%)}.community-panel .skin-segment button{min-height:2.5rem;color:var(--muted);background:0 0;border:0;border-radius:4px;justify-content:center;align-items:baseline;gap:6px;padding:4px 18px;transition:color .16s;display:inline-flex;position:relative}.community-panel .skin-segment button[aria-pressed=true]{color:var(--sp-accent)}.community-panel .skin-segment button:active:not(:disabled){opacity:1}.skin-segment small{font-variant-numeric:tabular-nums;opacity:.8;min-width:1.5ch;font-size:calc(1rem + 1px)}.skin-search{flex:15rem;align-items:center;min-width:0;display:flex;position:relative;margin:0!important}.skin-search svg{z-index:1;width:16px;height:16px;color:var(--muted);pointer-events:none;position:absolute;top:50%;left:12px;translate:0 -50%}.community-panel .skin-picker .skin-search input[type=search]{width:100%;margin:0;padding-left:36px}.skin-picker-body{grid-template-columns:minmax(210px,270px) minmax(0,1fr);align-items:start;gap:18px;display:grid}.skin-stage{border:1px solid var(--pencil);background:radial-gradient(120% 75% at 50% 32%,#fffdf7 0%,#f2eee2 70%,#e9e4d4 100%);border-radius:5px 9px 4px 7px;gap:4px;padding:14px;display:grid;position:sticky;top:12px}.skin-stage-view{aspect-ratio:4/5;cursor:var(--cursor-grab,grab);touch-action:none;position:relative}.skin-stage-view:active{cursor:var(--cursor-grabbing,grabbing)}.skin-stage-view:after{content:"";pointer-events:none;background:radial-gradient(closest-side,#454c3d2e,#0000);border-radius:50%;height:7%;position:absolute;bottom:5%;left:22%;right:22%}.skin-stage-view canvas{z-index:1;width:100%;height:100%;transition:opacity .22s var(--sp-ease);outline:none;position:absolute;inset:0}.skin-stage-view[data-loading] canvas{opacity:.35}.skin-stage-view[data-fallback]{cursor:var(--cursor-default,default);place-items:center;display:grid}.skin-stage-view[data-fallback] .skin-thumb{width:40%;height:auto}.skin-stage-info{justify-items:start;gap:2px;display:grid}.community-panel .skin-stage h4{overflow-wrap:anywhere;margin:4px 0 0;font-size:calc(1.7rem + 1px);line-height:1.1}.community-panel .skin-stage .community-meta{margin:0 0 6px}.community-panel .skin-stage .skin-wear{width:100%}.community-panel .skin-stage :is(.saved,.error){margin:8px 0 0;font-size:calc(1.15rem + 1px);line-height:1.35}.skin-stage .saved{transition:opacity .2s var(--sp-ease), transform .2s var(--sp-ease)}@starting-style{.skin-stage .saved{opacity:0;transform:translateY(4px)}}.skin-grid{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:var(--border) transparent;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));align-content:start;gap:10px;max-height:min(64vh,36rem);padding:10px 4px 18px;display:grid;overflow-y:auto;mask-image:linear-gradient(#0000 0,#000 10px calc(100% - 18px),#0000 100%)}.community-panel .skin-card{border:1px solid var(--border);background:var(--paper);min-width:0;color:inherit;text-align:center;transition:border-color .16s ease, background-color .16s ease, box-shadow .16s ease, transform .14s var(--sp-ease);border-radius:5px 9px 4px 7px;justify-items:center;gap:6px;padding:12px 6px 8px;display:grid;position:relative}.community-panel .skin-card:active:not(:disabled){opacity:1;transform:scale(.97)}.community-panel .skin-card[aria-selected=true]{border-color:var(--sp-accent);background:var(--sp-surface);box-shadow:inset 0 0 0 1px var(--sp-accent)}.community-panel .skin-card:focus-visible{outline:2px solid var(--sp-accent);outline-offset:2px}.skin-card[data-worn]:after{content:"✓";background:var(--sp-accent);color:#fffdf7;border-radius:50%;place-items:center;width:1.25rem;height:1.25rem;font:700 calc(.8rem + 1px)/1 system-ui,sans-serif;display:grid;position:absolute;top:5px;right:5px}.skin-thumb{width:40px;height:80px;image-rendering:pixelated;transition:opacity .22s var(--sp-ease), transform .2s var(--sp-ease);display:block}.skin-thumb[data-kind=cape]{width:50px}.skin-thumb[data-state=idle],.skin-card[data-skeleton] .skin-thumb{background:color-mix(in srgb, var(--border) 45%, transparent);border-radius:4px}.skin-thumb[data-state=error]{opacity:.3}.skin-card-name{text-overflow:ellipsis;white-space:nowrap;max-width:100%;font-size:calc(1.1rem + 1px);line-height:1.25;overflow:hidden}.skin-card[data-skeleton]{animation:1.4s ease-in-out infinite skin-skeleton}.skin-card[data-skeleton] .skin-card-name{background:color-mix(in srgb, var(--border) 35%, transparent);border-radius:3px;width:70%}@keyframes skin-skeleton{50%{opacity:.55}}@media (hover:hover) and (pointer:fine){.community-panel .skin-card:hover{border-color:var(--pencil)}.skin-card:hover .skin-thumb[data-state=ready]{transform:translateY(-2px)}}.skin-picker-empty{border:1px dashed var(--border);border-radius:5px 9px 4px 7px;justify-items:start;gap:4px;padding:18px;display:grid}@media (width<=720px){.skin-picker-body{grid-template-columns:minmax(0,1fr)}.skin-stage{grid-template-columns:minmax(120px,40%) minmax(0,1fr);align-items:center;column-gap:14px;position:static}.skin-stage>:is(.saved,.error){grid-column:1/-1}.community-panel .skin-stage h4{font-size:calc(1.4rem + 1px)}.skin-grid{grid-template-columns:repeat(auto-fill,minmax(84px,1fr));max-height:min(26rem,55dvh)}}@media (prefers-reduced-motion:reduce){.skin-segment:before,.community-panel .skin-card,.skin-thumb,.skin-stage .saved{transition:opacity .16s,border-color .16s,background-color .16s;transform:none!important}.skin-card[data-skeleton]{animation:none}}:is(.auth-screen,.settings-screen,.page) .remember-session{user-select:none;max-width:100%;min-height:2.75rem;transition:opacity .16s var(--ease);gap:.65rem;font-size:calc(1.1rem + 1px);line-height:1.5;display:inline-flex;position:relative}:is(.auth-screen,.settings-screen,.page) .remember-session input{opacity:0;z-index:1;background:0 0;border:0;outline:none;width:100%;height:100%;min-height:0;margin:0;padding:0;position:absolute;inset:0}.remember-session-control{width:1.5rem;height:1.5rem;color:var(--accent);pointer-events:none;transition:opacity .12s var(--ease);border-radius:4px;flex-shrink:0;place-items:center;display:grid;position:relative}.remember-session-frame{width:100%;height:100%;position:absolute;inset:0}.remember-session-outline{fill:var(--paper);stroke:var(--pencil);transition:fill .16s,stroke .16s}.remember-session-pencil{stroke:var(--pencil);opacity:.55}.remember-session-control .remember-session-check{opacity:0;width:.75rem;height:.75rem;transition:opacity .12s var(--ease);position:relative}.remember-session input:checked+.remember-session-control .remember-session-outline{fill:var(--accent-surface);stroke:var(--accent)}.remember-session input:checked+.remember-session-control .remember-session-check{opacity:1}.remember-session input:focus-visible+.remember-session-control{outline:2px solid var(--accent);outline-offset:3px}.remember-session:has(input:disabled){cursor:var(--cursor-disabled);opacity:.6}:is(.auth-screen,.settings-screen,.page) .remember-session input:disabled{cursor:var(--cursor-disabled)}.remember-session input:active:not(:disabled)+.remember-session-control{opacity:.65}@media (hover:hover) and (pointer:fine){.remember-session input:hover:not(:disabled)+.remember-session-control .remember-session-outline{stroke:var(--accent)}}@media (prefers-contrast:more){.remember-session-outline{stroke:var(--ink);stroke-width:1.8px}}@media (forced-colors:active){.remember-session-control{forced-color-adjust:none;color:highlighttext}.remember-session-outline{fill:canvas;stroke:canvastext}.remember-session-pencil{stroke:canvastext}.remember-session input:checked+.remember-session-control .remember-session-outline{fill:highlight;stroke:highlight}.remember-session input:focus-visible+.remember-session-control{outline-color:highlight}.remember-session:has(input:disabled){opacity:1;color:graytext}.remember-session input:disabled+.remember-session-control{color:graytext}.remember-session input:disabled+.remember-session-control .remember-session-outline{fill:canvas;stroke:graytext}.remember-session input:disabled+.remember-session-control .remember-session-pencil{stroke:graytext}}@media (prefers-reduced-motion:reduce){:is(.auth-screen,.settings-screen,.page) .remember-session,.remember-session-control,.remember-session-outline,.remember-session-control .remember-session-check{transition:none}}.community-panel{--paper:#fffdf7;--ink:#292c28;--pencil:#69745e;--muted:#65705d;--border:#69745e50;border-top:1px solid var(--border);margin-top:32px;padding-top:24px;font-size:calc(1.2rem + 1px)}.community-panel[data-embedded]{border-top:0;margin-top:0;padding-top:0}.community-heading,.community-card-heading{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:12px;display:flex}.community-panel h2{margin:0;font-size:calc(2rem + 1px)}.community-panel h3{margin:0 0 12px;font-size:calc(1.6rem + 1px)}.community-tabs{flex-wrap:wrap;gap:8px;margin:20px 0;display:flex}.community-tabs button{color:inherit;background:0 0;border-bottom:2px solid #0000;padding:8px 12px}.community-tabs button[aria-pressed=true]{border-bottom-color:var(--pencil);background:#69745e14}.community-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.community-card,.community-form{border:1px solid var(--pencil);background:var(--paper);border-radius:5px 9px 4px 7px;min-width:0;margin-bottom:16px;padding:18px}.community-panel p{margin:8px 0 16px}.community-panel label{margin:10px 0 6px;font-size:calc(1.3rem + 1px);display:block}.community-panel:not([data-embedded]) :is(input:not([type=checkbox]),select),.community-panel textarea{width:100%;font:inherit;color:inherit;border:1px solid var(--pencil);background:var(--paper);border-radius:3px 6px;padding:10px}.community-panel textarea{resize:vertical;min-height:110px}.community-panel select{margin-bottom:16px}.community-panel .form-actions{flex-wrap:wrap;gap:10px;margin-top:16px;display:flex}.community-panel button{cursor:var(--cursor-pointer,pointer);font:inherit}.community-panel .secondary{isolation:isolate;color:inherit;--button-fill:#fffdf7;background:0 0;border:0;padding:12px 20px;position:relative}.community-panel .sketch-button-frame{z-index:-1;width:100%;height:100%;position:absolute;inset:0}.community-panel button:disabled{opacity:.55;cursor:var(--cursor-disabled,default)}.community-panel :focus-visible{outline:2px solid var(--pencil);outline-offset:3px}.community-panel[data-embedded] :is(input:not([type=checkbox],[type=radio]),select,textarea):focus-visible{outline:none}.community-panel[data-embedded] textarea:focus{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent)}.community-meta{color:var(--muted);font-size:calc(1.1rem + 1px)}p.community-meta{flex-wrap:wrap;gap:4px 16px;display:flex}.community-message,.community-panel .inbox-message{white-space:pre-wrap;overflow-wrap:anywhere}.community-panel .inbox-facts{color:var(--muted,#65695f);flex-wrap:wrap;gap:4px 16px;margin:6px 0;padding:0;list-style:none;display:flex}.community-panel .inbox-facts li{align-items:center;gap:6px;display:inline-flex}.community-panel .inbox-facts svg{width:.85em;height:.85em}.community-panel .inbox-facts li[data-warn]{color:var(--warning-text,#8e3733)}.community-panel .error{color:#8c3833}.community-panel .saved{color:#454c3d}.community-preview{align-items:center;gap:12px;margin:12px 0;display:flex}.community-preview img{object-fit:contain;width:80px;height:80px;image-rendering:pixelated}.community-card[data-unread=true]{border-left-width:4px}.community-thread{border-left:2px solid var(--border);margin-bottom:16px;padding-left:14px}.community-panel .remember-session{align-items:center;gap:10px;display:flex}@media (width<=640px){.community-grid{grid-template-columns:minmax(0,1fr)}.community-card,.community-form{padding:14px}}.profile-tabs{border-bottom:1px solid #454c3d30;flex-wrap:wrap;gap:1rem;margin:20px 0 26px;padding-bottom:16px;display:flex}.profile-tabs .nav{min-height:2.25rem;font-size:calc(1.2rem + 1px)}[role=tabpanel][hidden]{display:none}.tickets{--t-accent:var(--accent,#2c655b);--t-surface:var(--accent-surface,#dce4cf);--t-ease:var(--ease,cubic-bezier(.23, 1, .32, 1));transition:opacity .2s var(--t-ease), transform .2s var(--t-ease)}@starting-style{.tickets{opacity:0;transform:translate(12px)}.tickets[data-back]{transform:translate(-12px)}}.tickets-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px 16px;margin-bottom:12px;display:flex}.ticket-list{border:1px solid var(--pencil);background:var(--paper);border-radius:5px 9px 4px 7px;margin:0;padding:0;list-style:none;overflow:hidden}.ticket-list li+li{border-top:1px solid var(--border)}.community-panel .ticket-row{width:100%;color:inherit;text-align:left;background:0 0;border:0;border-radius:0;gap:2px;padding:12px 16px;transition:background-color .16s;display:grid}.community-panel .ticket-row:active:not(:disabled){opacity:1;background:#69745e1f}@media (hover:hover) and (pointer:fine){.community-panel .ticket-row:hover{background:#69745e12}}.ticket-row[data-status=answered]{box-shadow:inset 3px 0 var(--t-accent)}.ticket-row[data-status=closed]{color:var(--muted)}.ticket-row-line{justify-content:space-between;align-items:baseline;gap:12px;min-width:0;display:flex}.ticket-row-title,.ticket-row-preview{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.ticket-row-title{font-weight:600}.ticket-row-preview{color:var(--muted);font-size:calc(1.1rem + 1px)}.ticket-row time{color:var(--muted);font-variant-numeric:tabular-nums;flex-shrink:0;font-size:calc(1.05rem + 1px)}.ticket-status{border:1px solid var(--border);white-space:nowrap;border-radius:999px;flex-shrink:0;padding:0 8px;font-size:calc(1rem + 1px);line-height:1.5}.ticket-status[data-status=answered]{border-color:var(--t-accent);background:var(--t-surface);color:var(--t-accent)}.community-panel .ticket-back{color:var(--t-accent);text-decoration:underline 1px var(--border);text-underline-offset:.2em;background:0 0;border:0;border-radius:0;padding:4px 0}.tickets .ticket-back+h3{overflow-wrap:anywhere;margin:6px 0 4px}.community-panel .ticket-thread header p{align-items:center;margin:0 0 12px}.community-thread.ticket-messages{overscroll-behavior:contain;border:1px solid var(--border);background:#69745e0a;border-radius:6px;flex-direction:column;gap:10px;max-height:min(50vh,26rem);margin:0;padding:12px;display:flex;overflow-y:auto}.ticket-message{border:1px solid var(--border);background:var(--paper);border-radius:4px 12px 12px;align-self:flex-start;max-width:85%;padding:8px 12px}.ticket-message[data-author=player]{background:var(--t-surface);border-radius:12px 4px 12px 12px;align-self:flex-end}.community-panel .ticket-message p{margin:2px 0 0}.ticket-message[data-fresh]{transition:opacity .2s var(--t-ease), transform .2s var(--t-ease)}@starting-style{.ticket-message[data-fresh]{opacity:0;transform:translateY(6px)}}.ticket-composer{flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:10px;margin-top:12px;display:flex}.community-panel .ticket-composer textarea{resize:vertical;flex:16rem;min-width:0;min-height:3rem;max-height:10rem}@supports (field-sizing:content){.community-panel .ticket-composer textarea{field-sizing:content;resize:none}}@media (prefers-reduced-motion:reduce){.tickets,.ticket-message[data-fresh]{transform:none!important}}.community-panel:not([data-embedded]) .primary{isolation:isolate;color:inherit;--button-fill:#dce4cf;background:0 0;border:0;padding:12px 20px;font-weight:600;position:relative}.community-panel:not([data-embedded]) .empty-state{text-align:center;flex-direction:column;align-items:center;gap:6px;padding:28px 12px;display:flex}.community-panel:not([data-embedded]) .empty-state-mark{border:1px solid var(--pencil);color:#2c655b;background:#dce4cf;border-radius:45% 52% 47% 50%;place-items:center;width:52px;height:52px;display:grid}.community-panel:not([data-embedded]) .empty-state-mark svg{width:20px;height:20px}.community-panel:not([data-embedded]) .empty-state h3{margin:4px 0 0}.community-panel:not([data-embedded]) .empty-state p{max-width:30rem;color:var(--muted);margin:0}@property --tint{syntax:"<color>";inherits:true;initial-value:#f0a030}.cosmetics-panel{--rarity:#9aa39a;--c-outline:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 60' preserveAspectRatio='none' fill='none'%3E%3Cpath d='M6 4Q224 2 593 4Q597 4 596 10L597 50Q598 56 590 55Q252 58 7 56Q3 56 4 49L3 12Q2 5 6 4Z' stroke='%2369745e' stroke-width='1' vector-effect='non-scaling-stroke'/%3E%3Cpath d='M14 2Q244 4 586 2M1 18L2 44M16 58Q290 55 583 58' stroke='%23949c88' stroke-width='.6' stroke-linecap='round' vector-effect='non-scaling-stroke' opacity='.55'/%3E%3C/svg%3E");--c-outline-focus:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 600 60' preserveAspectRatio='none' fill='none'%3E%3Cpath d='M6 4Q224 2 593 4Q597 4 596 10L597 50Q598 56 590 55Q252 58 7 56Q3 56 4 49L3 12Q2 5 6 4Z' stroke='%232c655b' stroke-width='2' vector-effect='non-scaling-stroke'/%3E%3Cpath d='M14 2Q244 4 586 2M1 18L2 44M16 58Q290 55 583 58' stroke='%232c655b' stroke-width='.6' stroke-linecap='round' vector-effect='non-scaling-stroke' opacity='.55'/%3E%3C/svg%3E");min-width:0;max-width:100%;color:var(--text);overflow-wrap:anywhere;font-size:calc(1.2rem + 1px);line-height:1.3}.cosmetics-panel.page{max-width:var(--page-width)}.cosmetics-panel *,.cosmetics-panel :before,.cosmetics-panel :after{box-sizing:border-box}.cosmetics-panel :is(ul,ol){margin:0;padding:0;list-style:none}.cosmetics-panel :focus-visible:not(h1,h2){outline:2px solid var(--accent);outline-offset:2px}.cosmetics-sr{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.cosmetics-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:6px 16px;margin-bottom:1rem;display:flex}.cosmetics-head h2{letter-spacing:-.02em;margin:0;font:600 calc(2.8rem + 1px)/1.02 Caveat,cursive}.cosmetics-wallet{flex-wrap:wrap;align-items:stretch;gap:.5rem;display:flex}.cosmetics-wallet-chip{border:1px solid var(--pencil);background:var(--paper);min-width:5.5rem;box-shadow:var(--shadow-card);border-radius:7px 11px 6px 10px;align-content:center;padding:.2rem .85rem;line-height:1.1;display:grid}.cosmetics-wallet-chip small{color:var(--muted);font-size:calc(.95rem + 1px)}.cosmetics-wallet-chip strong{color:var(--ink);font-variant-numeric:tabular-nums;font-size:calc(1.35rem + 1px)}.cosmetics-wallet .primary.small{min-height:3rem}.cosmetics-banner{z-index:5;position:sticky;top:0}.cosmetics-error,.cosmetics-notice{border-left:3px solid var(--warning-text);background:var(--paper);color:var(--warning-text);box-shadow:var(--shadow-pop);animation:banner-in var(--spring-duration) var(--spring) both, fade-in .2s var(--ease-out) both;border-radius:0 6px 6px 0;margin:0 0 .75rem;padding:.4rem .8rem}.cosmetics-notice{border-left-color:var(--accent);color:var(--accent)}@keyframes banner-in{0%{translate:0 -8px}}.cosmetics-panel .cosmetics-input{background:#fbf9f1b3 var(--c-outline) center / 100% 100% no-repeat;width:100%;min-width:0;min-height:2.75rem;color:inherit;font:inherit;box-shadow:none;border:0;border-radius:5px;outline:none;padding:3px 12px;font-size:calc(1.15rem + 1px);display:block}.cosmetics-panel .cosmetics-input:focus,.cosmetics-panel .cosmetics-input:focus-visible{background-color:var(--paper);background-image:var(--c-outline-focus);outline:none}.cosmetics-panel .cosmetics-input[aria-invalid=true]{box-shadow:inset 0 0 0 1.5px var(--warning-text)}.cosmetics-panel .cosmetics-input::placeholder{color:var(--quiet,#74796d)}.cosmetics-panel .cosmetics-select,.cosmetics-select::picker(select){appearance:base-select}.cosmetics-panel .cosmetics-select{cursor:var(--cursor-pointer,pointer);justify-content:space-between;align-items:center;gap:.5rem;padding-right:10px;display:flex}.cosmetics-select::picker-icon{content:"";width:1rem;height:1rem;transition:rotate var(--spring-duration) var(--spring);background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none'%3E%3Cpath d='M3 5Q5 8 8 11Q10 8 13 5' stroke='%2369745e' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M4 5L8 10L12 5' stroke='%2369745e' stroke-width='.6' opacity='.5'/%3E%3C/svg%3E") 50%/contain no-repeat;flex:none}.cosmetics-select:open::picker-icon{rotate:180deg}.cosmetics-select::picker(select){border:1.5px solid var(--ink);background:var(--paper);color:#303b2d;max-height:min(340px,60vh);box-shadow:var(--shadow-pop);opacity:0;transform-origin:top;scrollbar-width:thin;scrollbar-color:#b5c6a4 transparent;transition:opacity .12s var(--ease-exit), scale .14s var(--ease-exit), translate .14s var(--ease-exit), display .14s allow-discrete, overlay .14s allow-discrete;border-radius:5px 9px 4px 7px;margin-top:4px;padding:5px;overflow-y:auto;translate:0 -6px;scale:.96}.cosmetics-select:open::picker(select){opacity:1;transition:opacity .18s var(--ease-out), scale var(--spring-duration) var(--spring), translate var(--spring-duration) var(--spring), display .14s allow-discrete, overlay .14s allow-discrete;translate:0;scale:1}@starting-style{.cosmetics-select:open::picker(select){opacity:0;translate:0 -6px;scale:.96}}.cosmetics-select option{min-height:2.3rem;font:inherit;cursor:var(--cursor-pointer,pointer);transition:background-color .14s var(--ease-out);border-radius:4px 6px 3px 5px;align-items:center;gap:.55rem;padding:4px 10px;font-size:calc(1.15rem + 1px);line-height:1.15;display:flex}.cosmetics-select option::checkmark{color:var(--accent);order:1;margin-left:auto}.cosmetics-select option:checked{background:var(--accent-surface);color:var(--accent)}.cosmetics-select option:focus-visible{outline:1px dashed var(--accent);outline-offset:-3px}.cosmetics-select option[data-rarity]:before{content:"";background:var(--rarity);border-radius:50%;flex:none;width:.7rem;height:.7rem;box-shadow:0 0 0 1px #303b2d40}@media (hover:hover) and (pointer:fine){.cosmetics-select option:hover{background:var(--accent-surface)}}.cosmetics-art{aspect-ratio:1;background:radial-gradient(circle at 50% 38%, color-mix(in srgb, var(--rarity) 38%, #fffdf7) 0%, color-mix(in srgb, var(--rarity) 14%, #f5f2e9) 75%);border-radius:6px;width:100%;display:block;position:relative;overflow:hidden}.cosmetics-art img{object-fit:contain;width:100%;height:100%;display:block}.cosmetics-art-icon{color:color-mix(in srgb, var(--rarity) 70%, #303b2d);opacity:.85;margin:auto;position:absolute;inset:0;width:46%!important;height:46%!important}.cosmetics-rarity{border:1px solid var(--rarity);background:color-mix(in srgb, var(--rarity) 20%, #fffdf7);color:#303b2d;white-space:nowrap;border-radius:22px 19px 23px 18px;padding:0 .55rem;font-size:calc(1rem + 1px);line-height:1.35;display:inline-block}.case-shelf{grid-template-columns:repeat(auto-fit,minmax(12.5rem,1fr));gap:.85rem;margin-bottom:1.15rem;display:grid}.case-cover{border:1px solid var(--pencil);border-radius:var(--radius-card);background:radial-gradient(120% 85% at 50% 0%, color-mix(in oklab, var(--tint) 36%, var(--paper)) 0%, color-mix(in oklab, var(--tint) 8%, var(--paper)) 62%, var(--paper) 100%);min-width:0;color:var(--ink);font:inherit;text-align:center;box-shadow:var(--shadow-card);transition:transform var(--spring-duration) var(--spring), box-shadow .26s var(--ease-out), border-color .2s var(--ease-out), opacity .16s var(--ease-out);justify-items:center;gap:.1rem;padding:.85rem .7rem .75rem;display:grid;position:relative}.case-cover-name{text-wrap:balance;max-width:100%;margin-top:.35rem;font:600 calc(1.5rem + 1px)/1.05 Caveat,cursive}.case-cover-meta{color:var(--muted);font-size:calc(1rem + 1px)}.case-cover:after{content:"";border:solid var(--ink);background:var(--paper);width:1rem;height:1rem;transition:scale var(--spring-bouncy-duration) var(--spring-bouncy);border-width:0 1.5px 1.5px 0;border-radius:0 0 4px;position:absolute;bottom:-.55rem;left:50%;translate:-50%;rotate:45deg;scale:0}.case-cover[aria-selected=true]{z-index:1;border:1.5px solid var(--ink);box-shadow:3px 5px 0 color-mix(in oklab, var(--tint) 45%, transparent);transform:translateY(-3px)}.case-cover[aria-selected=true]:after{scale:1}.case-cover:active{opacity:1;transition-duration:90ms,.26s,.2s,.16s;transform:translateY(-1px)scale(.97)}.case-cover:focus-visible{outline:2px solid var(--accent);outline-offset:3px}@media (hover:hover) and (pointer:fine){.case-cover:hover{box-shadow:3px 6px 0 color-mix(in oklab, var(--tint) 40%, transparent);opacity:1;transform:translateY(-4px)}.case-cover:hover .case-fan-card[data-place=left]{translate:-112% 2px;rotate:-17deg}.case-cover:hover .case-fan-card[data-place=right]{translate:12% 2px;rotate:17deg}.case-cover:hover .case-fan-card[data-place=front]{translate:-50% -5px;scale:1.05}}.case-fan{width:100%;height:7rem;display:block;position:relative}.case-fan-card{transform-origin:50% 100%;width:5.4rem;transition:translate var(--spring-duration) var(--spring), rotate var(--spring-duration) var(--spring), scale var(--spring-duration) var(--spring);position:absolute;bottom:0;left:50%;translate:-50%}.case-fan-card .cosmetics-art{border-radius:8px;box-shadow:0 0 0 1px #303b2d24,0 8px 16px -10px #1c2119}.case-fan-card[data-place=left]{translate:-96% 4px;rotate:-11deg;scale:.86}.case-fan-card[data-place=right]{translate:-4% 4px;rotate:11deg;scale:.86}.case-fan-card[data-place=front]{width:6.2rem}.case-stage{isolation:isolate;border:1.5px solid var(--ink);background:radial-gradient(70% 120% at 16% 45%, color-mix(in oklab, var(--tint) 34%, var(--paper)) 0%, color-mix(in oklab, var(--tint) 9%, var(--paper)) 58%, var(--paper) 100%);box-shadow:4px 6px 0 color-mix(in oklab, var(--tint) 28%, #69745e22);transition:--tint .7s var(--ease-out);border-radius:8px 14px 7px 12px;padding:1.5rem 1.75rem;position:relative;overflow:clip}.case-stage:before{content:"";z-index:-1;pointer-events:none;opacity:.5;background:radial-gradient(circle at 12% 18%,#fff 0 1.5px,#0000 2.5px),radial-gradient(circle at 34% 82%,#fff 0 1px,#0000 2px),radial-gradient(circle at 6% 70%,#fff 0 1px,#0000 2px),radial-gradient(circle at 40% 10%,#fff 0 1px,#0000 2px);position:absolute;inset:0}.case-stage-inner{animation:fade-in .26s var(--ease-out) both;grid-template-columns:minmax(0,20rem) minmax(0,1fr);align-items:center;gap:1.5rem 2rem;display:grid}.case-stage-art{position:relative}.case-stage-art:before{content:"";z-index:-1;background:radial-gradient(closest-side, color-mix(in oklab, var(--tint) 60%, transparent), transparent);filter:blur(6px);border-radius:50%;position:absolute;inset:8% 4% 0}.case-stage .case-fan{height:16.5rem}.case-stage .case-fan-card{width:10.5rem;animation:fan-deal var(--spring-bouncy-duration) var(--spring-bouncy) backwards;animation-delay:calc(sibling-index() * 70ms - 70ms)}.case-stage .case-fan-card[data-place=front]{width:12.5rem;animation:fan-deal var(--spring-bouncy-duration) var(--spring-bouncy) .14s backwards, fan-float 4.2s ease-in-out 1.2s infinite alternate}.case-stage .case-fan-card[data-place=left]{translate:-86% 4px}.case-stage .case-fan-card[data-place=right]{translate:-14% 4px}.case-stage .case-fan-card .cosmetics-art{border-radius:12px;box-shadow:0 0 0 1px #303b2d30,0 18px 30px -16px #1c2119}@media (hover:hover) and (pointer:fine){.case-stage-art:hover .case-fan-card[data-place=left]{translate:-98%;rotate:-15deg}.case-stage-art:hover .case-fan-card[data-place=right]{translate:-2%;rotate:15deg}}@keyframes fan-deal{0%{opacity:0;translate:-50% 3rem;rotate:0deg;scale:.7}}@keyframes fan-float{to{transform:translateY(-6px)rotate(-1.2deg)}}.case-stage-info{min-width:0}.case-stage-info>*{animation:panel-in var(--spring-soft-duration) var(--spring-soft) both, fade-in .24s var(--ease-out) both;animation-delay:calc(sibling-index() * 45ms)}.case-stage-info h2{color:var(--ink);letter-spacing:-.01em;text-wrap:balance;margin:0;font:600 calc(2.7rem + 1px)/1 Caveat,cursive}.case-stage-desc{max-width:34rem;color:var(--text);text-wrap:pretty;margin:.5rem 0 0;font-size:calc(1.15rem + 1px);line-height:1.45}.case-cta{flex-wrap:wrap;align-items:center;gap:.75rem;margin-top:1.15rem;display:flex}.case-cta .primary{--button-fill:color-mix(in oklab, var(--tint) 28%, #eef0e2)}.case-open{min-height:3.7rem;padding-inline:1.9rem;font-size:1.7rem}.case-open:after{content:"";z-index:0;pointer-events:none;clip-path:inset(0 round 6px);animation:cta-shine 5.5s var(--ease-out) 1.6s infinite;background:linear-gradient(105deg,#0000 35%,#ffffff8c 50%,#0000 65%) -150% 0/250% 100% no-repeat;border-radius:6px;position:absolute;inset:4px}@keyframes cta-shine{0%,72%{background-position:-150% 0}to{background-position:150% 0}}.case-note{color:var(--warning-text);margin:.55rem 0 0;font-size:calc(1.08rem + 1px)}.case-pity{grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem 1.4rem;max-width:32rem;margin-top:1.25rem;display:grid}.cos-meter{min-width:0}.cos-meter-head{color:var(--ink);flex-wrap:wrap;justify-content:space-between;gap:0 .5rem;font-size:calc(1.05rem + 1px);line-height:1.25;display:flex}.cos-meter-hint{color:var(--muted)}.cos-meter-bar{border:1px solid var(--pencil);background:var(--paper);border-radius:6px 8px 5px 7px;height:.7rem;margin-top:.3rem;position:relative;overflow:hidden}.cos-meter-bar>i{border-left:1px dashed var(--pencil);background:color-mix(in oklab, var(--accent) 12%, transparent);position:absolute;top:0;bottom:0;right:0}.cos-meter-bar>span{background:repeating-linear-gradient(135deg, var(--accent) 0 5px, #3b7d70 5px 8px);transform-origin:0;scale:var(--fill) 1;transition:scale var(--spring-soft-duration) var(--spring-soft);position:absolute;inset:0}@starting-style{.cos-meter-bar>span{scale:0 1}}.case-contents{margin-top:2.4rem}.case-tier+.case-tier{margin-top:1.4rem}.case-tier-head{border-bottom:2px solid color-mix(in oklab, var(--rarity) 45%, transparent);flex-wrap:wrap;align-items:baseline;gap:.25rem .7rem;margin-bottom:.7rem;padding-bottom:.4rem;display:flex}.case-tier-chance{color:var(--ink);font-variant-numeric:tabular-nums;font:700 calc(1.45rem + 1px)/1 Caveat,cursive}.case-tier-chance[data-changed]{color:var(--accent)}.case-tier-count{margin-left:auto}.case-tier-grid{grid-template-columns:repeat(auto-fill,minmax(7.6rem,1fr));gap:.7rem;display:grid}.case-tier[data-rarity=legendary] .case-tier-grid{grid-template-columns:repeat(auto-fill,minmax(12rem,1fr))}.case-tier[data-rarity=epic] .case-tier-grid{grid-template-columns:repeat(auto-fill,minmax(9.5rem,1fr))}.case-tier[data-rarity=legendary] .cos-tile{box-shadow:0 0 0 1px color-mix(in oklab, var(--rarity) 40%, transparent), 0 10px 26px -14px var(--rarity)}.case-rules{border-top:1px dashed var(--border);color:var(--muted);grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem 1.6rem;font-size:calc(1.05rem + 1px);line-height:1.45;display:grid;margin-top:2.2rem!important;padding-top:1.2rem!important}.case-rules strong{color:var(--ink);margin-bottom:.15rem;font:600 calc(1.35rem + 1px)/1.15 Caveat,cursive;display:block}.cos-tile{border:1px solid color-mix(in oklab, var(--pencil) 55%, transparent);border-bottom:3px solid var(--rarity);background:var(--paper);width:100%;min-width:0;height:100%;color:var(--text);font:inherit;text-align:left;box-shadow:var(--shadow-card);border-radius:6px 9px 5px 8px;flex-direction:column;gap:.15rem;padding:.4rem .4rem .5rem;display:flex;position:relative}.cos-tile .cosmetics-art{margin-bottom:.25rem}button.cos-tile{transition:transform var(--spring-duration) var(--spring), box-shadow .24s var(--ease-out), border-color .2s var(--ease-out), background-color .2s var(--ease-out)}@media (hover:hover) and (pointer:fine){button.cos-tile:hover{box-shadow:var(--shadow-lift);opacity:1;transform:translateY(-3px)rotate(-.6deg)}}button.cos-tile:active{opacity:1;transition-duration:90ms;transform:scale(.96)}.cos-tile[aria-pressed=true]{border-color:var(--accent);background:var(--accent-surface);box-shadow:0 0 0 1.5px var(--accent), var(--shadow-lift)}.cos-tile:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.cos-tile-name{-webkit-line-clamp:2;min-height:2.2em;color:var(--ink);-webkit-box-orient:vertical;font-size:calc(1.12rem + 1px);font-weight:600;line-height:1.1;display:-webkit-box;overflow:hidden}.cos-tile-meta{color:var(--muted);margin-top:auto;font-size:calc(.98rem + 1px);line-height:1.2}.cos-tile-price{color:var(--accent);font-variant-numeric:tabular-nums;margin-top:auto;font:700 calc(1.4rem + 1px)/1 Caveat,cursive}.cos-tile-flag{background:var(--accent);color:var(--paper);border-radius:22px 19px 23px 18px;padding:0 .45rem;font-size:calc(.92rem + 1px);line-height:1.45;position:absolute;top:.55rem;left:.55rem;rotate:-4deg;box-shadow:1px 2px #0002}.cos-inventory .cos-tile:not([data-owned]) .cosmetics-art{filter:grayscale(.8);opacity:.55}.cos-inventory .cos-tile:not([data-owned]) .cos-tile-name{color:var(--muted)}.cos-tile-skeleton{border-radius:6px 9px 5px 8px;height:12rem}.cos-toolbar{flex-wrap:wrap;align-items:center;gap:.6rem .7rem;margin-bottom:1.1rem;display:flex}.cosmetics-panel .cos-toolbar .cosmetics-input{flex:11rem;width:auto}.cosmetics-panel .cos-toolbar .cos-search{flex:3 14rem}.cos-toolbar .segmented{flex:none}.cos-split{grid-template-columns:minmax(0,1fr) 18.5rem;align-items:start;gap:1.1rem;display:grid}.cos-grid{grid-template-columns:repeat(auto-fill,minmax(8.4rem,1fr));gap:.7rem;display:grid}.cos-detail{border:1px solid var(--pencil);border-radius:var(--radius-card);background:var(--paper);min-width:0;box-shadow:var(--shadow-card);animation:detail-in var(--spring-soft-duration) var(--spring-soft) both, fade-in .22s var(--ease-out) both;gap:.1rem;padding:1rem 1.05rem 1.1rem;display:grid;position:sticky;top:.75rem}@keyframes detail-in{0%{translate:10px}}.cos-detail>.cosmetics-art{width:100%;max-width:10.5rem;box-shadow:0 14px 26px -18px var(--rarity);animation:art-pop var(--spring-bouncy-duration) var(--spring-bouncy) both;border-radius:10px;margin:0 auto .75rem}@keyframes art-pop{0%{rotate:-2deg;scale:.88}}.cos-detail h3{color:var(--ink);text-wrap:balance;margin:0;font:600 calc(1.75rem + 1px)/1.1 Caveat,cursive}.cos-tags{flex-wrap:wrap;gap:.35rem;display:flex;margin:.5rem 0 .55rem!important}.cos-tag{background:var(--paper);color:var(--ink);border:1px solid #69745e90;border-radius:22px 19px 23px 18px;padding:0 .55rem;font-size:calc(1rem + 1px);line-height:1.35;display:inline-block}.cos-desc{color:var(--text);text-wrap:pretty;margin:0 0 .7rem;font-size:calc(1.08rem + 1px);line-height:1.4}.cos-actions{gap:.55rem;display:grid}.cos-actions>:is(.primary,.secondary){width:100%}.cos-actions .meta{margin:0;font-size:calc(1.02rem + 1px)}.cos-actions .link-button{justify-self:start}.cos-facts{border-top:1px dashed var(--border);color:var(--muted);gap:.1rem;margin:.3rem 0 0;padding-top:.55rem;font-size:calc(1rem + 1px);display:grid}.cos-facts>div{flex-wrap:wrap;gap:0 .4rem;display:flex}.cos-facts dt:after{content:":"}.cos-facts dd{color:var(--ink);margin:0}.cos-sell summary{min-height:2.4rem;color:var(--accent);text-decoration:underline 1px var(--border);text-underline-offset:.2em;cursor:var(--cursor-pointer,pointer);transition:text-decoration-color .2s var(--ease-out);align-items:center;gap:.4rem;font:500 calc(1.3rem + 1px)/1 Caveat,cursive;list-style:none;display:inline-flex}.cos-sell summary::-webkit-details-marker{display:none}.cos-sell summary:after{content:"";width:.55rem;height:.55rem;transition:rotate var(--spring-duration) var(--spring), translate var(--spring-duration) var(--spring);border:1.5px solid;border-width:0 1.5px 1.5px 0;translate:0 -2px;rotate:45deg}.cos-sell[open] summary:after{translate:0 2px;rotate:225deg}.cos-sell summary:hover{text-decoration-color:currentColor}.cos-sell::details-content{height:0;transition:height var(--spring-soft-duration) var(--spring-soft), content-visibility var(--spring-soft-duration) allow-discrete;overflow:clip}.cos-sell[open]::details-content{height:auto}.cos-sell form{gap:.35rem;padding:.35rem 0 .2rem;display:grid}.cos-sell label{color:var(--ink);font-size:calc(1.05rem + 1px)}.cos-sell .meta{margin:0;font-size:calc(1rem + 1px)}.cos-subtitle{color:var(--ink);align-items:baseline;gap:.6rem;margin:0 0 .55rem;font:600 calc(1.5rem + 1px)/1.1 Caveat,cursive;display:flex}.cos-subtitle .meta{font-family:inherit;font-size:calc(1.05rem + 1px);font-weight:400}.cos-worn{margin-bottom:1.2rem}.cos-worn ul{flex-wrap:wrap;gap:.5rem;display:flex}.cos-worn li{border:1px solid var(--pencil);border-left:3px solid var(--rarity);background:var(--paper);min-width:0;max-width:100%;box-shadow:var(--shadow-card);border-radius:5px 10px 5px 9px;align-items:center;gap:.6rem;padding:.3rem .75rem .3rem .3rem;display:flex}.cos-worn li .cosmetics-art{border-radius:5px;flex:none;width:2.7rem}.cos-worn-text{min-width:0;line-height:1.15;display:grid}.cos-worn-text strong{color:var(--ink);text-overflow:ellipsis;white-space:nowrap;font-size:calc(1.08rem + 1px);font-weight:600;overflow:hidden}.cos-worn-text small{color:var(--muted);font-size:calc(.95rem + 1px)}.cos-worn .link-button{min-height:1.8rem;font-size:1.1rem}.cos-empty-actions{flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem 1.2rem;margin-top:.9rem;display:flex}.cos-price{color:var(--accent);font-variant-numeric:tabular-nums;margin:.1rem 0 0;font:700 calc(2.3rem + 1px)/1 Caveat,cursive}.cos-detail>.meta{margin:.15rem 0 .7rem;font-size:calc(1.02rem + 1px)}.cos-history{border-top:1px dashed var(--border);margin-top:.9rem;padding-top:.7rem}.cos-history h4{color:var(--ink);margin:0 0 .25rem;font:600 calc(1.35rem + 1px)/1.1 Caveat,cursive}.cos-history .meta{margin:0;font-size:calc(1.02rem + 1px)}.cos-spark{width:100%;height:3.2rem;color:var(--accent);margin:.4rem 0;display:block}.cos-sales li{border-bottom:1px dashed #69745e40;justify-content:space-between;gap:.5rem;padding:.15rem 0;font-size:calc(1.05rem + 1px);display:flex}.cos-pager{flex-wrap:wrap;justify-content:center;align-items:center;gap:.75rem;margin-top:1rem;display:flex}.cosmetics-skeleton{grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem;display:grid}.cosmetics-skeleton .skeleton{height:10.5rem}.cosmetics-skeleton .is-stage{grid-column:1/-1;height:20rem}.cosmetics-dialog{width:min(560px,100vw - 32px);max-width:none;max-height:min(86vh,780px);color:var(--text);opacity:0;transition:opacity .15s var(--ease-exit), scale .18s var(--ease-exit), translate .18s var(--ease-exit), display .18s allow-discrete, overlay .18s allow-discrete;background:0 0;border:0;padding:0;font-size:calc(1.2rem + 1px);line-height:1.3;overflow:visible;translate:0 12px;scale:.96}.cosmetics-dialog[open]{opacity:1;transition:opacity .2s var(--ease-out), scale var(--spring-duration) var(--spring), translate var(--spring-duration) var(--spring), display .18s allow-discrete, overlay .18s allow-discrete;display:flex;translate:0;scale:1}@starting-style{.cosmetics-dialog[open]{opacity:0;translate:0 12px;scale:.96}}.cosmetics-dialog::backdrop{backdrop-filter:blur();transition:background-color .18s var(--ease-out), backdrop-filter .18s var(--ease-out), display .18s allow-discrete, overlay .18s allow-discrete;background:#1f251c00}.cosmetics-dialog[open]::backdrop{backdrop-filter:blur(3px);background:#1f251ccc}@starting-style{.cosmetics-dialog[open]::backdrop{backdrop-filter:blur();background:#1f251c00}}.cosmetics-dialog-sheet{border:1.5px solid var(--ink);background:var(--paper);border-radius:8px 14px 7px 12px;flex-direction:column;width:100%;min-height:0;display:flex;overflow:hidden;box-shadow:5px 6px #454c3d33,0 30px 70px -24px #000c}.cosmetics-dialog-head{background:repeating-linear-gradient(0deg, transparent 0 23px, #69745e14 23px 24px), var(--background,#f5f2e9);border-bottom:1px dashed #69745e70;justify-content:space-between;align-items:center;gap:12px;padding:16px 20px 12px;display:flex}.cosmetics-dialog-head h3{margin:0;font:600 calc(2rem + 1px)/1.1 Caveat,cursive}.cosmetics-close{border:1.5px solid var(--ink);background:var(--paper);width:2.5rem;height:2.5rem;color:var(--ink);font:inherit;transition:transform var(--spring-duration) var(--spring), background-color .16s var(--ease-out);border-radius:6px 11px 5px 10px;flex:none;place-items:center;padding:0;font-size:1.2rem;display:grid}.cosmetics-close:hover{background:var(--accent-surface);opacity:1}.cosmetics-close:active{opacity:1;transition-duration:90ms,.16s;transform:scale(.92)rotate(-8deg)}.cosmetics-dialog-body{overscroll-behavior:contain;scrollbar-gutter:stable;gap:10px;min-height:0;padding:14px 20px 22px;display:grid;overflow-y:auto}.cosmetics-dialog-body>*{margin:0}.cosmetics-wallet-summary{grid-template-columns:1.4fr 1fr 1fr;gap:10px;display:grid}.cosmetics-wallet-summary>div{background:#fffdf7;border:1px solid #69745e70;border-radius:6px 10px 5px 9px;padding:8px 12px}.cosmetics-wallet-summary p{margin:2px 0 0}.cosmetics-topups{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;display:grid}.cosmetics-rules-title{color:var(--ink);font:600 calc(1.4rem + 1px)/1.1 Caveat,cursive;margin:6px 0 0!important}.cosmetics-big{color:var(--accent);font-variant-numeric:tabular-nums;font-size:calc(2.4rem + 1px);font-weight:700;line-height:1}.cosmetics-stat{color:var(--ink);font-variant-numeric:tabular-nums;font-size:calc(1.9rem + 1px);font-weight:700;line-height:1}.cosmetics-notice-box{background:var(--background,#f5f2e9);border-left:3px solid #b48e7b;padding:8px 12px}.cosmetics-rules li{margin:6px 0;padding-left:14px;position:relative}.cosmetics-rules li:before{content:"•";position:absolute;left:0}.case-opening{overscroll-behavior:contain;background:radial-gradient(70% 62% at 50% 40%, color-mix(in oklab, var(--tint) 40%, #1b211d) 0%, #151a17 72%);color:#fbf9f1;width:100vw;max-width:none;height:100dvh;max-height:none;font:inherit;opacity:0;transition:opacity .18s var(--ease-exit), display .2s allow-discrete, overlay .2s allow-discrete;border:0;margin:0;padding:1.5rem;font-size:calc(1.2rem + 1px);line-height:1.3;position:fixed;inset:0;overflow-y:auto}.case-opening[open]{opacity:1;transition:opacity .3s var(--ease-out), display .2s allow-discrete, overlay .2s allow-discrete;display:grid}@starting-style{.case-opening[open]{opacity:0}}.case-opening::backdrop{background:#101411}.case-opening :focus-visible{outline-offset:3px;outline:2px solid #fff}.opening{text-align:center;flex-direction:column;align-items:center;gap:.85rem;width:min(100%,60rem);margin:auto;display:flex;position:relative}.opening-kicker{color:color-mix(in oklab, var(--tint) 40%, #fbf9f1);letter-spacing:.04em;margin:0;font-size:calc(1.15rem + 1px)}.opening-title{color:#fbf9f1;margin:0;font:600 calc(2.4rem + 1px)/1.05 Caveat,cursive}.opening-sub{color:#d8dccd;margin:-.5rem 0 0}.opening-reel{width:100%;height:13.5rem;animation:reel-in var(--spring-soft-duration) var(--spring-soft) both, fade-in .26s var(--ease-out) both;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 14% 86%,#0000);mask-image:linear-gradient(90deg,#0000,#000 14% 86%,#0000)}@keyframes reel-in{0%{translate:0 1.5rem;scale:.96}}.opening-strip{will-change:transform;align-items:center;gap:.75rem;padding:0 .75rem;display:flex;position:absolute;inset:0 auto 0 0}.reel-card{width:8.4rem;transition:scale var(--spring-bouncy-duration) var(--spring-bouncy), opacity .32s var(--ease-out), filter .32s var(--ease-out);flex:none}.reel-card .cosmetics-art{border-radius:9px;box-shadow:0 10px 22px -12px #000}.reel-card:after{content:"";background:var(--rarity);height:4px;box-shadow:0 0 10px var(--rarity);border-radius:2px;margin:7px 14% 0;display:block}.opening[data-phase=win] .reel-card:not([data-win]){opacity:.25;filter:saturate(.3)}.reel-card[data-win]{scale:1.13}.reel-card[data-win] .cosmetics-art{box-shadow:0 0 0 2px var(--rarity), 0 0 30px 4px color-mix(in oklab, var(--rarity) 60%, transparent)}.opening-marker{background:linear-gradient(#ffe58a00,#ffe58a 22% 78%,#ffe58a00);width:2px;position:absolute;top:0;bottom:0;left:50%;translate:-1px;box-shadow:0 0 14px 2px #ffe58a80}.opening-marker:before,.opening-marker:after{content:"";border:9px solid #0000;position:absolute;left:50%;translate:-50%}.opening-marker:before{border-top-color:#ffe58a;border-bottom-width:0;top:0}.opening-marker:after{border-top-width:0;border-bottom-color:#ffe58a;bottom:0}.opening-prize{isolation:isolate;flex-direction:column;align-items:center;gap:.55rem;display:flex;position:relative}.opening-glow{z-index:-1;width:0;height:0;position:absolute;top:8rem;left:50%}.opening-glow:before{content:"";aspect-ratio:1;background:radial-gradient(closest-side, color-mix(in oklab, var(--rarity) 55%, transparent), transparent);width:24rem;animation:fade-in .6s var(--ease-out) both;border-radius:50%;position:absolute;translate:-50% -50%}.opening-rays{aspect-ratio:1;background:repeating-conic-gradient(from 0deg, color-mix(in oklab, var(--rarity) 50%, transparent) 0 7deg, transparent 7deg 20deg);width:38rem;max-width:160vw;animation:rays-in .9s var(--ease-out) both, spin 20s linear infinite;border-radius:50%;position:absolute;translate:-50% -50%;-webkit-mask-image:radial-gradient(circle,#000 0%,#0000 66%);mask-image:radial-gradient(circle,#000 0%,#0000 66%)}@keyframes rays-in{0%{opacity:0;scale:.4}}@keyframes spin{to{rotate:360deg}}.opening-sparks i{background:color-mix(in oklab, var(--rarity) 65%, #fff);width:7px;height:7px;box-shadow:0 0 8px var(--rarity);--a:calc(sibling-index() * 30deg);animation:spark 1.1s var(--ease-out) .12s both;border-radius:50%;margin:-3.5px;position:absolute}.opening-sparks i:nth-child(2n){width:4px;height:4px;margin:-2px;animation-duration:1.4s}@keyframes spark{0%{transform:rotate(var(--a)) translateY(-3.5rem) scale(1.3);opacity:0}12%{opacity:1}to{transform:rotate(var(--a)) translateY(-13rem) scale(.2);opacity:0}}.opening-card{width:16rem;max-width:70vw;animation:prize-in var(--spring-bouncy-duration) var(--spring-bouncy) both}.opening-card .cosmetics-art{box-shadow:0 0 0 2px var(--rarity), 0 0 50px 6px color-mix(in oklab, var(--rarity) 55%, transparent), 0 30px 60px -20px #000;border-radius:14px}.opening-prize[data-rarity=legendary] .opening-card .cosmetics-art{animation:1.8s ease-in-out .6s infinite alternate legend-glow}@keyframes prize-in{0%{opacity:0;transform:perspective(900px)rotateY(75deg)scale(.5)}}@keyframes legend-glow{to{box-shadow:0 0 0 2px var(--rarity), 0 0 80px 18px color-mix(in oklab, var(--rarity) 75%, transparent), 0 30px 60px -20px #000}}.opening-name{color:#fbf9f1;text-wrap:balance;margin:.4rem 0 0;font:600 calc(2.4rem + 1px)/1.05 Caveat,cursive}.opening-tags{flex-wrap:wrap;justify-content:center;gap:.4rem;display:flex}.opening-desc{color:#d8dccd;text-wrap:pretty;max-width:34rem;margin:0;font-size:calc(1.15rem + 1px);line-height:1.4}.opening-prize>:is(.opening-name,.opening-tags,.opening-desc){animation:panel-in var(--spring-soft-duration) var(--spring-soft) both, fade-in .26s var(--ease-out) both}.opening-prize>.opening-name{animation-delay:.18s}.opening-prize>.opening-tags{animation-delay:.24s}.opening-prize>.opening-desc{animation-delay:.3s}.opening-chip{color:#fbf9f1;white-space:nowrap;background:#fbf9f11a;border:1px solid #fbf9f140;border-radius:22px 19px 23px 18px;padding:0 .6rem;font-size:calc(1rem + 1px);line-height:1.4}.opening-chip.is-shards{color:#3a3220;background:#e7d9b8;border-color:#0000}.opening-chip.is-guarantee{background:var(--accent);color:#fff;border-color:#0000}.opening-deck{perspective:1200px;grid-template-columns:repeat(5,minmax(0,9.6rem));justify-content:center;gap:.8rem;width:100%;display:grid}.flip{height:14.5rem;animation:deal var(--spring-duration) var(--spring) both;animation-delay:calc(sibling-index() * 45ms - 45ms)}@keyframes deal{0%{opacity:0;translate:0 -30vh;rotate:-14deg;scale:.6}}.flip-inner{width:100%;height:100%;transform-style:preserve-3d;transition:rotate var(--spring-bouncy-duration) var(--spring-bouncy);position:relative}.flip[data-open] .flip-inner{rotate:y 180deg}.flip-back,.flip-front{backface-visibility:hidden;border-radius:10px;position:absolute;inset:0}.flip-back{background:radial-gradient(circle at 50% 50%, #fbf9f122 0 2.2rem, transparent 2.3rem), repeating-linear-gradient(45deg, color-mix(in oklab, var(--tint) 55%, #262c28) 0 8px, color-mix(in oklab, var(--tint) 42%, #1b1f1c) 8px 16px);border:1.5px solid #fbf9f150;place-items:center;display:grid;box-shadow:0 12px 24px -14px #000}.flip-back span{color:#fbf9f1c0;border:1.5px solid #fbf9f170;border-radius:46% 54% 48% 52%;place-items:center;width:3.6rem;height:3.6rem;font:700 calc(2.4rem + 1px)/1 Caveat,cursive;display:grid}.flip[data-charge] .flip-back{animation:.52s ease-in-out infinite alternate charge}@keyframes charge{0%{box-shadow:0 0 0 2px var(--rarity), 0 0 18px 2px var(--rarity)}to{box-shadow:0 0 0 2px var(--rarity), 0 0 46px 12px var(--rarity);scale:1.04}}.flip-front{border-bottom:4px solid var(--rarity);color:#303b2d;box-shadow:0 0 20px color-mix(in oklab, var(--rarity) 50%, transparent);background:#fbf9f1;flex-direction:column;align-items:center;gap:.25rem;padding:.45rem;display:flex;overflow:hidden;rotate:y 180deg}.flip-front .cosmetics-art{border-radius:7px;width:100%}.flip-front strong{-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:calc(1.05rem + 1px);line-height:1.05;display:-webkit-box;overflow:hidden}.flip-front .cosmetics-rarity,.flip-front .opening-chip{font-size:calc(.9rem + 1px)}.flip[data-best] .flip-front{box-shadow:0 0 0 2px var(--rarity), 0 0 40px 8px color-mix(in oklab, var(--rarity) 65%, transparent)}.opening-actions{animation:panel-in var(--spring-soft-duration) var(--spring-soft) .2s both, fade-in .26s var(--ease-out) .2s both;flex-wrap:wrap;justify-content:center;gap:.7rem;margin-top:.5rem;display:flex}.opening .primary{--button-fill:color-mix(in oklab, var(--tint) 30%, #e3ead6)}.opening .secondary{--button-fill:#fbf9f1}.opening-error{color:#ffb4a8;margin:0}.opening-flash{z-index:2;pointer-events:none;background:radial-gradient(circle at 50% 42%, #fff 0%, color-mix(in oklab, var(--rarity) 70%, #fff) 35%, transparent 75%);animation:flash .9s var(--ease-out) forwards;position:fixed;inset:0}@keyframes flash{0%{opacity:.9}to{opacity:0}}@media (width<=860px){.cos-split{grid-template-columns:minmax(0,1fr)}.cos-detail{position:static}.case-stage-inner,.case-rules{grid-template-columns:minmax(0,1fr)}.opening-deck{grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem}.flip{height:13rem}}@media (width<=520px){.cosmetics-panel{font-size:calc(1.1rem + 1px)}.case-shelf{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.case-fan{height:5.2rem}.case-fan-card{width:4rem}.case-fan-card[data-place=front]{width:4.6rem}.case-stage{padding:1.1rem}.case-stage .case-fan{height:12rem}.case-stage .case-fan-card{width:7.5rem}.case-stage .case-fan-card[data-place=front]{width:9rem}.case-pity{grid-template-columns:minmax(0,1fr)}.cos-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.opening-deck{grid-template-columns:repeat(3,minmax(0,1fr))}.opening-reel{height:9.5rem}.reel-card{width:6.8rem}.cosmetics-topups{grid-template-columns:repeat(2,minmax(0,1fr))}.cosmetics-wallet-summary{grid-template-columns:minmax(0,1fr)}.cosmetics-dialog-head,.cosmetics-dialog-body{padding-inline:12px}}@media (prefers-reduced-motion:reduce){.cosmetics-panel *,.cosmetics-panel :before,.cosmetics-panel :after,.cosmetics-dialog::backdrop,.cosmetics-select::picker(select){transition:none!important;animation:none!important}.opening-flash,.opening-rays,.opening-sparks{display:none}}.cosmetics-panel[data-mode=website]{--paper:#fbf9f1;--ink:#454c3d;--pencil:#69745e;--text:#292c28;--muted:#65695f;--border:#c3c8b6;--accent:#2c655b;--accent-surface:#dce4cf;--warning-text:#8e3733;--background:#f5f2e9;--spring:cubic-bezier(.34, 1.3, .64, 1);--spring-duration:.42s;--spring-bouncy:cubic-bezier(.34, 1.56, .64, 1);--spring-bouncy-duration:.56s;--spring-soft:cubic-bezier(.22, 1, .36, 1);--spring-soft-duration:.52s;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-exit:cubic-bezier(.4, 0, 1, 1);--radius-card:6px 10px 5px 9px;--shadow-card:2px 3px 0 #69745e18;--shadow-lift:4px 6px 0 #2c655b22;--shadow-pop:3px 4px 0 #69745e25, 0 22px 44px -24px #303b2d66}.cosmetics-panel[data-mode=website] :is(.primary,.secondary){isolation:isolate;color:#303b2d;--button-fill:#dce4cf;cursor:pointer;background:0 0;border:0;justify-content:center;align-items:center;gap:.6rem;min-height:3rem;padding:.5rem 1.2rem;font:600 1.35rem/1 Caveat,cursive;display:inline-flex;position:relative}.cosmetics-panel[data-mode=website] .secondary{--button-fill:#f5f2e9;font-weight:500}.cosmetics-panel[data-mode=website] :is(.primary,.secondary).small{min-height:2.6rem;padding:.4rem 1rem;font-size:1.25rem}.cosmetics-panel[data-mode=website] :is(.primary,.secondary):disabled{opacity:.45;cursor:not-allowed}.cosmetics-panel[data-mode=website] .sketch-button-frame{z-index:-1;pointer-events:none;width:100%;height:100%;position:absolute;inset:0;overflow:visible}.cosmetics-panel[data-mode=website] .link-button{min-height:2rem;color:var(--accent);text-decoration:underline 1px var(--border);text-underline-offset:.2em;cursor:pointer;background:0 0;border:0;align-items:center;padding:.2rem 0;font:500 1.2rem/1 Caveat,cursive;display:inline-flex}.cosmetics-panel[data-mode=website] .tabs{border-bottom:1px solid #454c3d30;flex-wrap:wrap;gap:.25rem 1rem;margin:16px 0 20px;padding-bottom:8px;display:flex}.cosmetics-panel[data-mode=website] .tabs>button{min-height:2.25rem;color:var(--muted);cursor:pointer;background:0 0;border:0;padding:.5rem .35rem;font:500 1.3rem/1 Caveat,cursive}.cosmetics-panel[data-mode=website] .tabs>button[aria-selected=true]{color:var(--accent);text-underline-offset:6px;text-decoration:underline 2px #7da394}.cosmetics-panel[data-mode=website] .segmented{border:1px solid var(--pencil);background:var(--paper);border-radius:7px 11px 6px 10px;flex-wrap:wrap;gap:4px;padding:3px;display:inline-flex}.cosmetics-panel[data-mode=website] .segmented>button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:5px;padding:4px 12px}.cosmetics-panel[data-mode=website] .segmented>button[aria-checked=true]{background:var(--accent-surface);color:var(--accent);font-weight:700}.cosmetics-panel[data-mode=website] .card{border:1px solid var(--pencil);border-radius:var(--radius-card);background:var(--paper);padding:1.1rem 1.25rem}.cosmetics-panel[data-mode=website] :is(.meta,.section-head .meta){color:var(--muted);font-size:calc(1.05rem + 1px)}.cosmetics-panel[data-mode=website] .section-head{flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:.4rem 1rem;margin-bottom:.8rem;display:flex}.cosmetics-panel[data-mode=website] .section-head h2{margin:0;font:600 calc(1.9rem + 1px)/1.15 Caveat,cursive}.cosmetics-panel[data-mode=website] .empty-state{text-align:center;flex-direction:column;align-items:center;gap:6px;padding:24px 12px;display:flex}.cosmetics-panel[data-mode=website] .empty-state-mark{border:1px solid var(--pencil);background:var(--accent-surface);width:52px;height:52px;color:var(--accent);border-radius:45% 52% 47% 50%;place-items:center;display:grid}.cosmetics-panel[data-mode=website] .empty-state-mark svg{width:20px;height:20px}.cosmetics-panel[data-mode=website] .empty-state h3{margin:4px 0 0}.cosmetics-panel[data-mode=website] .empty-state p{max-width:30rem;color:var(--muted);margin:0}.cosmetics-panel[data-mode=website] .skeleton{background:#d9dfce;border-radius:4px 6px 3px 5px}@keyframes panel-in{0%{transform:translateY(8px)}}@keyframes fade-in{0%{opacity:0}}@font-face{font-family:Caveat;src:url(/fonts/caveat.ttf)format("truetype");font-weight:400 700;font-display:swap}:root{color:#292c28;color-scheme:light;background:#f5f2e9}*{box-sizing:border-box}[hidden]{display:none!important}body{min-width:280px;margin:0;font-size:1.35rem;line-height:1.5}header{justify-content:space-between;align-items:center;gap:1rem;max-width:74rem;margin:auto;padding:1.5rem 2rem;display:flex}a{color:#454c3d;text-underline-offset:.2em}.brand{align-items:center;gap:.65rem;font-weight:700;text-decoration:none;display:flex}main{max-width:64rem;margin:auto;padding:2rem 2rem 4rem}h1{text-wrap:balance;margin:.5rem 0 1.5rem;font-size:clamp(2.5rem,6vw,4rem);line-height:1.1}h2{margin:0 0 1rem;font-size:2rem;line-height:1.1}p{text-wrap:pretty;max-width:65ch}.eyebrow{letter-spacing:.1em;font-size:1rem}#status{min-height:2rem}#login{max-width:30rem}label{margin-top:1rem;display:block}input,select,button{font:inherit;color:inherit;max-width:100%}input,select{background:#fffdf7;border:1px solid #69745e;border-radius:.3rem;width:100%;padding:.55rem .75rem}input[type=file]{font-size:1rem}.file-help{margin:1rem 0 .5rem;font-size:1.15rem}.dropzone{color:#454c3d;background:#fffdf7;border:1.5px dashed #69745e;border-radius:.4rem;flex-direction:column;align-items:center;gap:.3rem;width:100%;padding:1.25rem .75rem;display:flex}.dropzone:hover,.dropzone.dragging{background:#e8e8dc;border-style:solid}.dropzone.dragging{outline:2px solid #69745e}.file-name{overflow-wrap:anywhere;max-width:100%}.pick-file{text-underline-offset:.2em;font-size:1.15rem;text-decoration:underline}.has-file{border-style:solid}.field-label{margin-top:1rem}.dropdown{margin-top:.2rem;position:relative}.dropdown-toggle{text-align:left;color:#292c28;background:#fffdf7;border-color:#69745e;justify-content:space-between;align-items:center;gap:.5rem;width:100%;padding:.55rem .75rem;display:flex}.dropdown-toggle svg{flex-shrink:0}.dropdown-toggle[aria-expanded=true] svg{transform:rotate(180deg)}.dropdown-options{z-index:2;background:#fffdf7;border:1px solid #69745e;border-radius:.4rem;padding:.3rem;position:absolute;top:calc(100% + .4rem);left:0;right:0;box-shadow:0 6px 18px #292c2818}.dropdown-options button{color:#292c28;text-align:left;background:0 0;border:0;justify-content:space-between;align-items:center;gap:.5rem;width:100%;padding:.55rem .65rem;display:flex}.dropdown-options button:hover,.dropdown-options button:focus-visible,.dropdown-options button[aria-selected=true]{background:#e8e8dc}.dropdown-options button[aria-selected=false] span{visibility:hidden}button{color:#fffdf7;cursor:pointer;background:#454c3d;border:1px solid #454c3d;border-radius:.3rem;padding:.55rem 1.15rem}button.secondary{color:#454c3d;background:0 0}button:disabled{opacity:.55;cursor:not-allowed}:focus-visible{outline-offset:0;outline:3px solid #69745e}#login button{margin-top:1.5rem}.player-row{justify-content:space-between;align-items:center;gap:1rem;display:flex}.player-row h2{overflow-wrap:anywhere;margin:0}.textures{grid-template-columns:repeat(2,minmax(0,1fr));gap:2rem;margin-top:2rem;display:grid}.texture{border:1px solid #69745e;border-radius:.5rem;flex-direction:column;min-width:0;padding:1.5rem;display:flex}.preview{background:#e8e8dc;border-radius:.3rem;justify-content:center;align-items:center;height:10rem;display:flex}.preview img{image-rendering:pixelated;width:auto;max-width:100%;height:100%;max-height:100%}.actions{flex-wrap:wrap;gap:.75rem;margin-top:auto;padding-top:1.5rem;display:flex}#png-help{font-size:1.15rem}@media (width<=640px){header,main{padding-inline:1rem}.textures{grid-template-columns:1fr}.texture{padding:1rem}}
