@font-face{font-family:'Aether Pixel';src:url('../artist-select-r69/aether-pixel.woff2') format('woff2');font-style:normal;font-weight:400;font-display:swap}
:root{color-scheme:dark;--ink:#fff3d6;--muted:#bed0e7;--gold:#ffd36a;--cyan:#60d9f5;--navy:#071126;--blue:#244c98;--edge:#58779f;font-family:'Aether Pixel',monospace;font-size:16px}
*{box-sizing:border-box}html,body{margin:0;min-width:0;background:#050a17;color:var(--ink)}body{line-height:1.7}button,a{touch-action:manipulation;-webkit-tap-highlight-color:transparent}button{font:inherit;color:inherit;cursor:pointer}button:disabled{cursor:wait}a{color:#8ae5ff}button:focus-visible,a:focus-visible{outline:3px solid #fff;outline-offset:5px}[hidden]{display:none!important}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.artist-select{--artist-accent:#64dcff;position:relative;isolation:isolate;max-width:1320px;margin:auto;padding:24px 28px 40px;background:#081329;border-top:4px solid #345d9a;border-bottom:4px solid #19395f;min-width:0}
.artist-select[data-cursor=minji]{--artist-accent:#e9a7ed}
.stage-header{margin:0 auto 28px;text-align:center}.brand{display:block;width:min(352px,80%);height:auto;margin:0 auto 20px;image-rendering:pixelated}
.heading-rule{display:flex;align-items:center;justify-content:center;gap:24px}.heading-rule>span{height:10px;flex:1;max-width:240px;border-top:3px solid #5ba5d4;border-bottom:2px solid #244c82;box-shadow:0 2px #02050c}
h1{font-size:clamp(20px,3vw,32px);line-height:1.5;letter-spacing:.045em;text-transform:uppercase;white-space:nowrap;font-weight:400;text-shadow:3px 3px #223e87,5px 5px #02040b;margin:0}
.selection-layout{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.15fr);gap:24px;align-items:start}.selected-panel,.roster-panel{min-width:0;border:2px solid #5d82b1;background:#071125;box-shadow:0 0 0 2px #020710,0 0 0 4px #203c63,4px 5px #02050c}
.panel-caption{display:flex;justify-content:space-between;gap:16px;min-width:0;align-items:center;padding:11px 13px;background:#183767;border-bottom:3px solid #020912;color:#cde7ff;font-size:11px;line-height:1.7;letter-spacing:.04em}.panel-caption>span{min-width:0}.selected-indicator{color:var(--gold)}
.portrait-display{height:286px;position:relative;overflow:hidden;isolation:isolate;background:#111526;border-bottom:4px solid #5c6a87}
.emblem-room{position:absolute;inset:0;background:url('../../assets/secondary-pages-r24/artists-backdrop-r24.webp') center center/cover no-repeat;image-rendering:pixelated;z-index:-3}
.emblem-room:after{content:'';position:absolute;inset:0;background:#05091b70;box-shadow:inset 12px 0 #07132990,inset -12px 0 #07132990}
.room-floor{position:absolute;left:10%;right:10%;bottom:19px;height:26px;background:#10213c;border:3px solid #5c83b7;box-shadow:0 5px #040a18,0 -3px #163757,inset 0 4px #244d70;clip-path:polygon(10% 0,90% 0,100% 100%,0 100%);z-index:-1}
.portrait-window{position:relative;overflow:hidden;isolation:isolate}.selected-portrait{position:absolute;inset:30px 12% 42px;overflow:visible}.portrait-placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px}
.initials{font-size:clamp(62px,7vw,100px);line-height:1;color:#e6f5ff;letter-spacing:.025em;text-shadow:3px 0 var(--artist-accent),0 3px var(--artist-accent),6px 6px #183667,9px 9px #040713;position:relative;z-index:1}
.selected-portrait:before{content:'';position:absolute;inset:8px 12% 26px;border:2px solid #4f84ad;box-shadow:0 0 0 5px #0b1834cc,inset 0 0 0 6px #0a1630bb;clip-path:polygon(12px 0,calc(100% - 12px) 0,100% 12px,100% calc(100% - 12px),calc(100% - 12px) 100%,12px 100%,0 calc(100% - 12px),0 12px);background:#08152b99}
.portrait-pending{font-size:11px;line-height:1.7;text-align:center;color:#e7e3d7;position:relative;z-index:1;background:#091324ed;padding:4px 8px;border-top:1px solid #5279a4;border-bottom:1px solid #5279a4}
.portrait-image{display:block;position:absolute;inset:0;width:100%;height:100%;object-fit:contain;image-rendering:pixelated;z-index:2}
.room-corner{position:absolute;width:22px;height:22px;border-color:var(--artist-accent);border-style:solid;border-width:4px 0 0 4px;pointer-events:none}.room-corner-tl{left:16px;top:16px}.room-corner-tr{right:16px;top:16px;transform:rotate(90deg)}.room-corner-br{right:16px;bottom:16px;transform:rotate(180deg)}.room-corner-bl{left:16px;bottom:16px;transform:rotate(270deg)}
.character-info{padding:20px 18px 18px;border-top:2px solid #060913;min-width:0;background:#0c1a31}.info-eyebrow{margin:0 0 8px;color:var(--artist-accent);font-size:10px;letter-spacing:.05em}.character-info h2{margin:0 0 13px;font-weight:400;font-size:20px;line-height:1.7;text-transform:uppercase;color:var(--gold);text-shadow:2px 3px #020711;overflow-wrap:normal}.character-info p:not(.info-eyebrow){font-size:12px;line-height:1.9;margin:0 0 15px}.character-info .selected-roles{color:#b8cde4;font-size:10px;line-height:2}
.confirm-button{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:48px;border:2px solid #98d9ff;background:#244c86;box-shadow:inset 0 2px #6b91bd,inset 0 -3px #122744,3px 3px #020711;padding:11px 13px;font-size:12px;line-height:1.6;text-transform:uppercase}.confirm-button:hover{background:#315e9e;border-color:#fff3c9}.confirm-button:active{transform:translate(1px,1px);box-shadow:inset 0 2px #122744,1px 1px #020711}
.roster{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;padding:17px}.artist-card,.roster-slot{position:relative;min-width:0;min-height:137px;margin:0;padding:7px;border:2px solid #456da2;background:#152c51;box-shadow:inset 0 2px #2e5081,inset 0 -3px #060e21,2px 3px #010510;text-align:center;isolation:isolate}
.artist-card{display:flex;flex-direction:column;justify-content:flex-end;align-items:stretch}.artist-card:before,.roster-slot:before{content:'';position:absolute;inset:5px;border:1px solid #315781;pointer-events:none;z-index:-1}.artist-card:after{content:'';position:absolute;inset:-5px;border:3px solid transparent;pointer-events:none}.artist-card.is-current{border-color:#fff0b2;background:#234a78;box-shadow:inset 0 2px #6bb4d8,inset 0 -3px #162e4d,0 0 0 2px #13101a,0 0 0 4px #f7b93f,3px 5px #000}
.artist-card.is-current:after{border-color:#fff1a9;clip-path:polygon(0 0,28% 0,28% 5px,5px 5px,5px 28%,0 28%,0 0,100% 0,100% 28%,calc(100% - 5px) 28%,calc(100% - 5px) 5px,72% 5px,72% 0,100% 0,100% 100%,72% 100%,72% calc(100% - 5px),calc(100% - 5px) calc(100% - 5px),calc(100% - 5px) 72%,100% 72%,100% 100%,0 100%,0 72%,5px 72%,5px calc(100% - 5px),28% calc(100% - 5px),28% 100%,0 100%)}
.slot-index{position:absolute;left:7px;top:5px;color:#9bbade;font-size:9px;line-height:1.5;z-index:3}.cursor-tag{display:none;position:absolute;right:3px;top:-10px;background:var(--gold);color:#131627;border:2px solid #132038;padding:0 4px;font-size:8px;line-height:1.7;z-index:4}.is-current .cursor-tag{display:block}
.artist-card .portrait-window{height:86px;width:100%;margin:6px 0}.artist-card .initials{font-size:43px;text-shadow:2px 0 var(--artist-accent),0 2px var(--artist-accent),4px 4px #020715}.artist-card[data-artist=minji]{--artist-accent:#e9a7ed}.artist-card .portrait-placeholder{gap:0}.artist-name{font-size:12px;line-height:1.5;color:#eff9ff;padding:5px 2px 2px;border-top:1px solid #456c96}.is-current .artist-name{color:var(--gold)}
.is-vacant{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px;background:#0b1930;border-color:#253f64;box-shadow:inset 0 2px #1b3150,inset 0 -3px #030b1b,2px 3px #02050d}.is-vacant:before{border-color:#243b59;inset:13px}.vacant-mark{font-size:28px;line-height:1;color:#4c6b8f}.vacant-label{font-size:9px;line-height:1.6;color:#8fa9c5;letter-spacing:.03em}.is-vacant .slot-index{color:#708caf}
.roster-note{font-size:11px;line-height:1.8;margin:0 17px 15px;color:#b8c8dc}.input-hint{border-top:2px solid #28466b;margin:0;padding:15px 14px;font-size:11px;line-height:2.1;color:#dbe7f6;background:#0c1e39}.input-hint kbd,.back-button kbd{display:inline-block;font:inherit;color:var(--gold);border:1px solid #5f7fa8;border-bottom:3px solid #335277;background:#081327;padding:0 4px;margin-right:3px}.input-hint .keyboard-hint>span{margin:0 7px;color:#6081aa}.touch-hint{display:none}
.confirmation-strip{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:none;z-index:5;text-align:center;padding:11px 5px;background:#ffd36a;color:#081326;border-top:3px solid #fff7d5;border-bottom:4px solid #9a671d;font-size:15px;line-height:1.6;box-shadow:0 4px #071124}
.lock-mark{display:none;position:absolute;inset:auto 2px 32px;z-index:6;background:#ffe298;border-top:2px solid #fff8d8;border-bottom:2px solid #ba8c37;padding:4px 0;color:#14213a;font-size:13px;line-height:1.5}.is-locked .lock-mark{display:block}
.artist-select[data-phase=locking] .confirmation-strip{display:block;animation:confirmation-enter 440ms steps(7,end) both}.artist-select[data-phase=locking] .selected-portrait{animation:emblem-set 440ms steps(7,end) both}
@keyframes confirmation-enter{0%{transform:translate(-12px,-50%);opacity:0}15%{opacity:1}70%,100%{transform:translate(0,-50%);opacity:1}}
@keyframes emblem-set{0%{transform:translateY(0)}30%{transform:translateY(-3px)}65%,100%{transform:translateY(0)}}
.profile-view{max-width:1080px;margin:auto;animation:profile-arrive 220ms steps(5,end) both}.back-button{display:flex;align-items:center;gap:12px;min-height:48px;padding:12px 14px;margin:0 0 24px;border:2px solid #84b6e6;background:#143563;box-shadow:inset 0 2px #365987,3px 3px #020713;font-size:12px;line-height:1.7}.back-button>span{color:var(--gold)}.back-button:hover{background:#244a80;border-color:var(--gold)}.back-button kbd{font-size:10px;margin-left:8px}
.profile-frame{padding:28px;border:2px solid #78a8d4;background:#0b1a30;box-shadow:0 0 0 2px #030a17,0 0 0 4px #25496f,5px 6px #02050d}.profile-heading{display:flex;gap:26px;align-items:center;padding-bottom:25px;border-bottom:3px double #6283a6}.profile-portrait{width:146px;aspect-ratio:1;flex:none;background:#183763;border:2px solid #94b9db;box-shadow:inset 0 0 0 5px #09172f}.profile-portrait .initials{font-size:54px}.profile-portrait .portrait-placeholder{gap:12px}.profile-portrait .portrait-pending{font-size:9px;padding:3px}.profile-label{font-size:11px;color:var(--artist-accent);margin:0 0 10px;text-transform:uppercase}.profile-heading h2{font-size:clamp(18px,2.4vw,27px);font-weight:400;line-height:1.7;text-transform:uppercase;color:var(--gold);margin:0;overflow-wrap:anywhere;text-shadow:2px 3px #050b16}
.profile-content{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.3fr);gap:38px;padding-top:26px;font-size:13px;line-height:2}.profile-content p{margin:0 0 20px}.profile-roles{list-style:none;margin:0 0 24px;padding:0;display:grid;gap:6px;color:#d3e1f1}.profile-roles li:before{content:'+';color:var(--artist-accent);margin-right:12px}.profile-content h3{font-size:16px;font-weight:400;line-height:1.8;margin:0 0 23px;color:var(--gold)}.profile-content h4{font-size:14px;font-weight:400;line-height:1.9;margin:0 0 14px}.credit{padding:21px 0;border-top:2px solid #2c4c6d}.credit:last-child{padding-bottom:0}.credit .credit-qualifier{font-size:11px;color:var(--muted)}.profile-link{display:flex;justify-content:space-between;align-items:center;gap:16px;min-height:48px;padding:12px 14px;text-decoration:none;font-size:12px;line-height:1.8;background:#173b66;color:#eff9ff;border:1px solid #6ca1c7;box-shadow:inset 0 2px #294f78,inset 0 -2px #0b2441}.profile-link:hover{background:#24537f;border-color:var(--gold)}.external-mark{font-family:monospace;font-size:22px;flex:none}.minji-music{align-self:start;padding-top:20px;border-top:2px solid #355677}.minji-music p{color:var(--muted);margin:0}.noscript-note{max-width:700px;padding:20px;margin:25px auto;background:#061022;font-size:12px}
@keyframes profile-arrive{from{transform:translateY(6px);opacity:0}to{transform:translateY(0);opacity:1}}
@media(max-width:1000px){.artist-select{padding:24px 22px 32px}.selection-layout{gap:20px;grid-template-columns:minmax(0,.9fr) minmax(0,1fr)}.roster{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:15px}.artist-card,.roster-slot{min-height:126px}.artist-card .portrait-window{height:73px}.portrait-display{height:300px}.character-info h2{font-size:18px}.panel-caption{font-size:10px}}
@media(max-width:740px){.artist-select{padding:20px 18px 28px}.selection-layout{grid-template-columns:1fr;gap:24px}.selected-panel{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr)}.selected-panel>.panel-caption{grid-column:1/-1}.portrait-display{height:auto;min-height:266px;border-bottom:0;border-right:3px solid #5c6a87}.character-info{padding:16px 14px;border-top:0}.character-info h2{font-size:16px}.selected-portrait{inset:34px 9% 40px}.selected-portrait .initials{font-size:64px}.selected-portrait:before{inset:8px 0 25px}.selected-portrait .portrait-pending{font-size:10px}.room-corner{width:16px;height:16px;border-width:3px 0 0 3px}.room-corner-tl{left:10px;top:10px}.room-corner-tr{right:10px;top:10px}.room-corner-br{right:10px;bottom:10px}.room-corner-bl{left:10px;bottom:10px}.roster{grid-template-columns:repeat(4,minmax(0,1fr))}.profile-frame{padding:22px}.profile-content{gap:24px}.profile-portrait{width:110px}.profile-portrait .initials{font-size:43px}}
@media(max-width:520px){.artist-select{padding:16px 14px 26px}.stage-header{margin-bottom:24px}.brand{margin-bottom:18px}.heading-rule{gap:12px}.heading-rule>span{max-width:40px;height:8px}h1{font-size:18px}.selected-panel{display:block}.portrait-display{height:214px;min-height:0;border-right:0;border-bottom:3px solid #5c6a87}.selected-portrait{inset:26px 14% 37px}.selected-portrait .initials{font-size:72px}.selected-portrait:before{inset:4px 15% 22px}.portrait-pending{font-size:11px}.character-info{padding:16px}.character-info h2{font-size:17px;line-height:1.7;margin-bottom:10px}.character-info p:not(.info-eyebrow){font-size:12px;margin-bottom:12px}.character-info .selected-roles{font-size:11px}.panel-caption{padding:10px 11px;font-size:10px}.roster{grid-template-columns:repeat(3,minmax(0,1fr));padding:12px;gap:9px}.artist-card,.roster-slot{min-height:112px;padding:5px}.artist-card .portrait-window{height:61px}.artist-card .initials{font-size:34px}.artist-name{font-size:12px}.slot-index{font-size:9px;left:5px}.vacant-label{font-size:9px}.vacant-mark{font-size:25px}.is-vacant{gap:13px}.is-vacant:before{inset:10px}.cursor-tag{font-size:7px;top:-8px;right:0;padding:0 2px}.roster-note{font-size:11px;margin:0 12px 13px}.input-hint{font-size:11px;padding:13px 11px}.input-hint .keyboard-hint>span{margin:0 3px}.profile-frame{padding:18px}.profile-heading{gap:15px;padding-bottom:20px}.profile-portrait{width:80px}.profile-portrait .initials{font-size:32px}.profile-portrait .portrait-pending{font-size:7px}.profile-portrait .portrait-placeholder{gap:8px}.profile-label{font-size:10px}.profile-heading h2{font-size:15px}.profile-content{grid-template-columns:1fr;font-size:12px;padding-top:23px;gap:27px}.profile-content h3{font-size:14px}.profile-content h4{font-size:13px}.profile-link{font-size:11px}.back-button{font-size:11px;gap:9px}.back-button kbd{display:none}.confirmation-strip{font-size:13px}}
@media(hover:none),(pointer:coarse){.touch-hint{display:inline}.input-hint .keyboard-hint{display:none}}
@media(prefers-reduced-motion:reduce){.artist-select *,.artist-select *:before,.artist-select *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media(forced-colors:active){.emblem-room,.room-floor,.room-corner,.selected-portrait:before{display:none}.artist-select,.selected-panel,.roster-panel,.artist-card,.roster-slot,.character-info,.profile-frame,.profile-portrait,.portrait-display,.confirm-button,.back-button,.profile-link,.panel-caption,.input-hint{background:Canvas;color:CanvasText;border-color:CanvasText;box-shadow:none}.artist-card.is-current{outline:3px solid Highlight;box-shadow:none}.artist-card:before,.artist-card:after,.roster-slot:before{display:none}.initials,.artist-name,.vacant-mark,.vacant-label,.character-info h2,.profile-heading h2,.profile-content h3{color:CanvasText;text-shadow:none}.cursor-tag,.lock-mark,.confirmation-strip{background:Highlight;color:HighlightText}.portrait-pending{background:Canvas;color:CanvasText}}
