@font-face{font-family:Exo;src:url(Exo-Regular.ttf)}@font-face{font-family:Exo;src:url(Exo-ExtraBold.ttf);font-weight:800}
#workshop-legends{--cyan:#29e0ff;--amber:#ffa61f;border:0;padding:0;background:transparent;color:#eef7fa;width:min(760px,calc(100vw - 20px));max-width:none;max-height:calc(100dvh - 16px);font:16px Exo,system-ui;overflow:auto;color-scheme:dark}
#workshop-legends::backdrop{background:#000c}
#workshop-legends *{box-sizing:border-box}
.legend-frame{position:relative;border:9px solid #374b53;outline:1px solid #8b9a9d;outline-offset:-5px;background:linear-gradient(110deg,#101f27,#08131b);padding:18px 22px 14px;box-shadow:inset 0 0 0 2px #060b0d,inset 0 2px 6px #9cb5b530,0 12px 60px #000}
.legend-frame:before,.legend-frame:after{content:'';display:block;height:5px;background:repeating-linear-gradient(120deg,#c38930 0 8px,#162129 8px 19px);opacity:.65}
.legend-frame header{text-align:center;padding:13px 0 0}.legend-frame h1{font-size:clamp(20px,3.5vw,31px);font-weight:800;letter-spacing:.08em;margin:0;color:#edf6f8}.subtitle{font-size:12px;letter-spacing:.26em;color:var(--cyan);margin:6px 0 0}.board-status{min-height:20px;font-size:12px;color:#bdced3;text-align:center;margin:7px 0}
.legend-rows{list-style:none;padding:0;margin:0;display:grid;gap:5px}.legend-row{position:relative;isolation:isolate;display:grid;grid-template-columns:40px minmax(0,1fr) 120px;align-items:center;gap:12px;height:39px;padding:0 14px;background:linear-gradient(#142c36,#0a1a24);border:1px solid #29444f;box-shadow:inset 0 1px #6fbec315;overflow:hidden;animation:settle .35s ease-out both;animation-delay:calc(var(--row)*20ms)}
.legend-row:first-child{height:58px;border-color:#a27732;background:linear-gradient(100deg,#382d19,#171d20);box-shadow:inset 3px 0 var(--amber),0 0 14px #ffab2020}.rank{font-weight:800;color:#6b9daf;font-size:17px}.legend-row:first-child .rank{color:var(--amber)}.legend-row:first-child .rank:before{content:'♛';display:block;font-size:16px;line-height:15px}.legend-row:nth-child(2){border-left:3px solid #bfced6}.legend-row:nth-child(3){border-left:3px solid #c98b5f}.name{font-weight:800;white-space:pre;min-width:0;unicode-bidi:plaintext}.score{text-align:right;font-weight:800;font-variant-numeric:tabular-nums;color:var(--cyan);font-size:20px}.legend-row:first-child .score{color:var(--amber);font-size:25px}
.legend-frame footer{display:flex;gap:10px;justify-content:center;margin:12px 0}.legend-frame button{font:800 14px Exo,system-ui;min-height:44px;padding:9px 17px;border:1px solid #4e7b8b;background:#153440;color:#f4fbff;cursor:pointer}.legend-frame button:hover{background:#245060;border-color:var(--cyan)}.legend-frame button:active{transform:translateY(1px);background:#0b222d}.legend-frame button:focus-visible,.legend-frame input:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}.legend-frame button:disabled{opacity:.5;cursor:default}.legend-frame .primary{border-color:#d39837;background:#79521b}.legend-frame form{display:grid;gap:12px;max-width:440px;margin:18px auto}.legend-frame input{font:20px Exo,system-ui;background:#050e14;color:#fff;border:1px solid #4c7f8b;padding:12px;width:100%;min-width:0}.character-count{text-align:right;color:#91a9b3}.name-validation{font-size:13px;color:#ffcf7e;margin:0;min-height:18px}.claim-score{text-align:center;color:var(--amber);font-weight:800;font-size:23px;margin:18px 0}.new-entry{outline:2px solid var(--cyan);outline-offset:-2px;animation:insert-row .5s ease-out}.new-entry:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(100deg,transparent 35%,#8df5ff55 50%,transparent 65%);transform:translateX(110%);animation:sweep .85s ease-out}.new-entry:before{content:'';position:absolute;left:38px;top:50%;width:3px;height:3px;background:#ffd780;box-shadow:-20px -12px #ffd780,8px -16px #fff,20px 8px #ffb335,-10px 13px #ffd780;animation:sparks .65s ease-out both;pointer-events:none}
@keyframes insert-row{from{transform:translateX(-16px);opacity:0}to{transform:none;opacity:1}}@keyframes settle{from{transform:translateY(4px);opacity:.6}to{transform:none;opacity:1}}@keyframes sweep{from{transform:translateX(-110%)}to{transform:translateX(110%)}}@keyframes sparks{from{transform:scale(.3);opacity:1}to{transform:scale(1.7);opacity:0}}
#workshop-legends.reduced *,#workshop-legends.reduced *:before,#workshop-legends.reduced *:after{animation:none!important}.reduced .new-entry:before,.reduced .new-entry:after{display:none}
@media(prefers-reduced-motion:reduce){#workshop-legends *,#workshop-legends *:before,#workshop-legends *:after{animation:none!important}.new-entry:before,.new-entry:after{display:none}}
@media(max-width:540px){.legend-frame{padding:10px 10px 8px;border-width:6px}.legend-row{grid-template-columns:23px minmax(0,1fr) 76px;gap:6px;padding:0 8px;height:37px}.name{font-size:14px}.score{font-size:16px}.legend-row:first-child .score{font-size:19px}.legend-frame footer{flex-wrap:wrap}.legend-frame button{padding:8px 12px}.legend-frame h1{letter-spacing:.03em}}
@media(max-height:680px){.legend-frame{padding-top:7px;padding-bottom:5px}.legend-frame header{padding-top:6px}.legend-frame h1{font-size:21px}.legend-row{height:calc((100dvh - 204px)/10);min-height:23px}.legend-row:first-child{height:calc((100dvh - 204px)/10 + 12px);min-height:33px}.legend-rows{gap:3px}.legend-frame footer{margin:7px 0}.board-status{margin:4px 0}.legend-row:first-child .rank:before{display:none}}
@media(max-height:450px){.legend-frame{border-width:4px;padding:4px 12px}.legend-frame h1{font-size:18px}.legend-frame header{padding-top:3px}.subtitle{font-size:10px;margin-top:2px}.board-status{min-height:16px;font-size:11px;margin:3px 0}.board-status:empty{display:none}.legend-rows{gap:2px}.legend-row{height:calc((100dvh - 180px)/10 - 2px);min-height:17px}.legend-row:first-child{height:calc((100dvh - 180px)/10 + 8px);min-height:27px}.legend-row .score,.legend-row .rank,.legend-row .name{font-size:13px}.legend-row:first-child .score{font-size:17px}.legend-frame footer{margin:5px 0}}
/* Supplied Workshop Legends v1 art; all type and controls remain live. */
.legend-frame{isolation:isolate;border:0;outline:0;background:none;box-shadow:none;padding:36px 60px 30px}
.legend-frame:before{position:absolute;inset:0;z-index:-1;width:auto;height:auto;opacity:1;background:none;border:72px solid transparent;border-image:url(leaderboard-art/leaderboard_frame.png) 192 fill / 72px stretch}
.legend-frame:after{display:none}.legend-frame header{padding:0}.legend-frame h1{font-size:27px;letter-spacing:.04em}.legend-row{height:36px;background:none;border:0;box-shadow:none;grid-template-columns:32px minmax(0,1fr) 145px;gap:12px;padding:0 12px;animation-duration:.18s;animation-delay:0s}.legend-row:first-child{height:54px;background:none;border:0;box-shadow:none}.legend-row:before{content:'';position:absolute;inset:0;z-index:-2;border:9px solid transparent;border-image:url(leaderboard-art/leaderboard_row_inset.png) 20 fill / 9px stretch;background:none;box-shadow:none;animation:none;transform:none;opacity:1;width:auto;height:auto}.legend-row:first-child:after{content:'';position:absolute;inset:0;z-index:-1;border:10px solid transparent;border-image:url(leaderboard-art/champion_row_trim.png) 24 / 10px stretch;background:none;transform:none;animation:none}.legend-row:nth-child(2),.legend-row:nth-child(3){border:0}.rank{position:relative;font-size:14px}.legend-row:nth-child(-n+3) .rank{padding-top:17px;line-height:16px}.legend-row:nth-child(-n+3) .rank:before{content:'';display:block;position:absolute;left:-2px;top:-4px;width:24px;height:24px;background:url(leaderboard-art/rank_one_crown.png) center/contain no-repeat}.legend-row:nth-child(2) .rank:before{background-image:url(leaderboard-art/rank_two_silver.png);width:20px;height:20px;top:-1px}.legend-row:nth-child(3) .rank:before{background-image:url(leaderboard-art/rank_three_copper.png);width:20px;height:20px;top:-1px}.name{font-weight:400;white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.1;font-size:16px}.score{font-size:19px}.legend-row:first-child .score{font-size:22px}.new-entry{outline:none;animation:none}.row-highlight{position:absolute;inset:0;border:8px solid transparent;border-image:url(leaderboard-art/new_entry_highlight.png) 16 / 8px stretch;z-index:-1;pointer-events:none}.row-sweep,.row-sparks{display:none}.celebrate{animation:insert-row .18s ease-out}.celebrate .row-sweep{display:block;position:absolute;inset:0;z-index:-1;background:url(leaderboard-art/new_entry_sweep.png) center/auto 100% no-repeat;transform:translateX(110%);animation:sweep .42s ease-out}.celebrate .row-sparks{display:block;position:absolute;left:-3px;top:50%;width:42px;height:42px;margin-top:-21px;z-index:1;background:url(leaderboard-art/placement_sparks_005.png) center/contain no-repeat;animation:art-sparks .5s steps(1) both;pointer-events:none}.new-entry:after{display:none}.new-entry:first-child:after{display:block}
@keyframes art-sparks{0%{background-image:url(leaderboard-art/placement_sparks_000.png)}16.67%{background-image:url(leaderboard-art/placement_sparks_001.png)}33.33%{background-image:url(leaderboard-art/placement_sparks_002.png)}50%{background-image:url(leaderboard-art/placement_sparks_003.png)}66.67%{background-image:url(leaderboard-art/placement_sparks_004.png)}83.33%,100%{background-image:url(leaderboard-art/placement_sparks_005.png)}}
#workshop-legends.reduced .row-sweep,#workshop-legends.reduced .row-sparks{display:none}#workshop-legends.reduced .legend-row:before,#workshop-legends.reduced .legend-row:first-child:after{display:block}
@media(prefers-reduced-motion:reduce){.row-sweep,.row-sparks{display:none!important}.legend-row:before,.legend-row:first-child:after{display:block}}
@media(max-width:540px){.legend-frame{padding:30px 27px 24px}.legend-frame:before{border-width:36px;border-image-width:36px}.legend-frame h1{font-size:21px}.legend-row{height:44px;grid-template-columns:22px minmax(0,1fr) 102px;gap:6px;padding:0 8px}.legend-row:first-child{height:60px}.name{font-size:14px}.score{font-size:13px}.legend-row:first-child .score{font-size:14px}.legend-row .rank{font-size:12px}.legend-row:nth-child(-n+3) .rank:before{width:20px;height:20px;top:-2px}}
@media(max-height:680px) and (min-width:541px){.legend-frame{padding-top:26px;padding-bottom:24px}.legend-row{height:calc((100dvh - 230px)/10);min-height:20px}.legend-row:first-child{height:calc((100dvh - 230px)/10 + 12px);min-height:30px}.legend-frame h1{font-size:22px}}
@media(max-height:450px){.legend-frame{padding:18px 36px}.legend-frame:before{border-width:36px;border-image-width:36px}.legend-frame h1{font-size:18px}.legend-row{height:calc((100dvh - 190px)/10 - 2px);min-height:16px}.legend-row:first-child{height:calc((100dvh - 190px)/10 + 8px);min-height:26px}.legend-row:nth-child(-n+3) .rank{padding-top:0}.legend-row:nth-child(-n+3) .rank:before{display:none}.legend-row .name,.legend-row .score{font-size:12px}}
@media(min-width:541px) and (min-height:681px){.legend-frame{padding-top:60px;padding-bottom:50px}}
