/* Editorial refinement: restrained color, generous rhythm, image-led profiles. */
:root{--bg:#090f15;--panel:#111b24;--ink:#e8edf0;--muted:#98a8b5;--blue:#a4d6eb;--gold:#cbb184;--line:#c4d8e51a;--ease:cubic-bezier(.22,.61,.36,1)}
body{font-weight:400;line-height:1.85;text-rendering:optimizeLegibility}::selection{background:#8dc5dd55;color:white}h1,h2,h3{word-break:keep-all;text-wrap:balance}p{word-break:keep-all;overflow-wrap:anywhere}h2{font-size:clamp(32px,3.2vw,48px);font-weight:700;letter-spacing:-.045em;line-height:1.4}.section{padding-top:120px;padding-bottom:120px}.section-label{display:flex;align-items:center;gap:18px;color:#8397a5;font-size:12px;letter-spacing:.2em;margin-bottom:42px}.section-label:before{content:'';width:28px;height:1px;background:#91b5c877;flex-shrink:0}.eyebrow{color:#a2bac8;font-size:12px;letter-spacing:.16em}.section-heading{margin-bottom:46px}.section-heading>p{max-width:390px;line-height:1.9}.intro-grid{gap:90px;align-items:center}.intro-grid>div{max-width:540px}.intro-grid em{color:#a7d5e6}.history{margin-top:80px;padding-top:36px}.history-list{gap:44px 22px}.history-list li{padding-right:14px}.history-list p{font-size:15px}.history-list h3{font-size:18px}.history-date{font-weight:500;font-variant-numeric:tabular-nums}.history-heading h3{font-weight:500;font-size:20px}
header{padding-inline:max(36px,calc((100vw - 1260px)/2));border-bottom-color:#c3d6e514}.brand{font-size:19px;letter-spacing:-.055em}.brand span{margin-top:5px;font-size:9px;letter-spacing:.22em}nav{gap:32px}nav a{position:relative;color:#c4d0d9;transition:color .2s}nav a:after{content:'';position:absolute;left:0;bottom:-8px;width:100%;height:1px;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}nav a:hover:after,nav a:focus-visible:after{transform:scaleX(1)}header.scrolled{background:#09121bf0;border-bottom-color:#c0d7e51a;box-shadow:0 8px 35px #0002}.hero h1{font-weight:800;letter-spacing:-.075em}.hero h1>span{color:#a6d3e7}.hero-line{font-size:17px;color:#c1cbd1;letter-spacing:.015em}.hero-copy .eyebrow{color:#bbd4e1}.hero-bottom{bottom:37px;font-size:12px}.primary,.outline,.text-link{transition:background .25s,color .25s,border-color .25s}.primary{background:#d9e7ed;padding:15px 25px}.primary:hover{background:#f3f8fb}.text-link{border-bottom-color:#9ec4d744}.text-link:hover{border-color:var(--blue)}.outline{border-color:#8ca5b455}.outline:hover{background:#aecddd0c;border-color:#b3d5e4}.tabs{gap:8px;margin-bottom:28px}.tabs button{border-color:transparent;border-bottom-color:#aec8d72b;padding:10px 20px;color:#93a8b7}.tabs button:hover{color:#e5f0f6;background:#c0ddee08}.tabs button[aria-pressed=true]{background:#a9c6d812;color:#dcebf3;border-color:#9fc1d63d;border-bottom-color:#afcfdf}.faction-stage{height:560px;border:1px solid var(--line)}.faction-copy{width:355px;right:55px;bottom:55px}.faction-copy h3{font-weight:600;letter-spacing:.04em}.faction-copy>p:not(.eyebrow){line-height:1.95}.faction-copy .eyebrow{font-size:12px;line-height:1.8}.bestiary{padding-block:85px;background:#070d13}.monster-stage{border:1px solid var(--line);background:#0d161f}.monster-copy{padding:38px}.monster-en{color:#a6bccb;font-size:12px;letter-spacing:.22em}.monster-copy h3{font-size:36px;font-weight:600}.monster-copy>p:not(.eyebrow){color:#bcc9d2}.monster-select{gap:12px;margin-top:20px}.monster-button{transition:border-color .25s,background .25s}.monster-button[aria-pressed=true]{border-color:#a5cbdc;background:#a1c7de0c}.monster-button img{transition:opacity .3s,transform .6s var(--ease)}.monster-button:hover img{transform:scale(1.025)}
.character-grid{gap:38px 25px}.character-card{border-bottom:1px solid var(--line);padding-bottom:20px;--faction-accent:#a4c8d9}.character-card[data-faction='타이탄']{--faction-accent:#b4c1b5}.character-card[data-faction='9TH']{--faction-accent:#b9b2cc}.portrait{aspect-ratio:3/4;border:1px solid #b2cbd812;isolation:isolate}.portrait img{transition:transform .85s var(--ease),filter .5s;filter:saturate(.94)}.portrait:after{inset:45% 0 0;background:linear-gradient(transparent,#07101a66);pointer-events:none}.card-index{position:absolute;left:14px;top:14px;z-index:2;padding:4px 8px;background:#07111bc7;font-size:11px;letter-spacing:.08em;color:#d0dfe7;opacity:0;transform:translateY(-4px);transition:opacity .25s,transform .3s}.card-title{font-size:22px;position:relative;padding-top:5px;margin-top:14px}.card-title:before{content:'';position:absolute;top:-15px;left:0;width:100%;height:2px;background:var(--faction-accent);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}.card-title b{font-weight:500;letter-spacing:-.025em}.card-title>span{font-size:22px;transition:color .25s,transform .35s}.character-card p{font-size:13px;color:#8fa4b3;margin-top:6px}.character-card:is(:hover,:focus-visible) .portrait img{transform:scale(1.035);filter:saturate(1)}.character-card:is(:hover,:focus-visible) .card-index{opacity:1;transform:none}.character-card:is(:hover,:focus-visible) .card-title:before{transform:scaleX(1)}.character-card:is(:hover,:focus-visible) .card-title>span{color:var(--faction-accent);transform:translate(2px,-2px)}
dialog{border-color:#96b4c338;box-shadow:0 40px 150px #000b;scrollbar-width:thin;scrollbar-color:#405764 #0d1721}dialog::backdrop{background:#02080dcc;backdrop-filter:blur(12px)}dialog[open]{animation:dialogArrive .3s var(--ease)}.close{background:#08121bd9;border-color:#bdd3df33;width:38px;height:38px;transition:background .2s,transform .2s}.close:hover{background:#1f3343;transform:rotate(90deg)}.character-dialog[open]{width:min(1080px,calc(100vw - 48px));grid-template-columns:1.08fr 1fr;overflow:auto;background:#101a24}.detail-portrait{position:relative;min-height:640px;background:#060c12;overflow:hidden}.detail-portrait>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 22%}.detail-portrait:after{content:'';position:absolute;inset:70% 0 0;background:linear-gradient(transparent,#071019d9);pointer-events:none}.portrait-caption{position:absolute;bottom:25px;left:26px;right:26px;z-index:1;display:flex;justify-content:space-between;gap:15px;font-size:10px;letter-spacing:.19em;color:#d6e4ec}.detail-copy{padding:80px 44px 44px;min-width:0;align-self:center}.detail-copy h2{font-size:54px;font-weight:600;letter-spacing:-.055em;margin:12px 0 14px}.detail-copy #detail-group{display:flex;gap:12px;align-items:center}.detail-copy #detail-group:before{content:'';width:20px;height:1px;background:#acc8d7}.detail-copy #detail-role{font-size:14px;color:#b3c6d2}.detail-copy>p.muted{font-size:16px;line-height:2;margin:32px 0 36px}.character-soundtrack{margin-top:36px;padding-top:26px}.character-soundtrack h3{font-weight:500;font-size:18px;margin:12px 0 18px}.character-soundtrack .eyebrow{font-size:10px;color:#839ba9}.character-track{gap:14px;padding:12px;background:#a3bed208;border:1px solid #a9c7d71f;transition:background .25s,border-color .25s}.character-track>img{width:46px;height:54px;object-fit:cover;object-position:50% 20%}.character-track>span:first-of-type{flex:1;min-width:0;font-size:14px;overflow-wrap:anywhere}.character-track>span:last-child{display:grid;place-items:center;width:32px;height:32px;border:1px solid #9bbdce44;border-radius:50%;font-size:11px;flex-shrink:0}.character-track:hover{background:#a4c5d714;border-color:#aacbd255}.character-music-empty{background:none;padding:15px 0;border:0;color:#8295a3;font-size:14px}
.mini-player{left:50%;right:auto;bottom:18px;transform:translateX(-50%);width:min(540px,calc(100% - 32px));height:76px;padding:11px 17px;background:#0d1923f2;border:1px solid #b5ccda30;border-radius:9px;box-shadow:0 12px 45px #0008;gap:18px;isolation:isolate;overflow:hidden}.mini-player>#mini-expand{min-width:0;flex:1;padding:0;gap:13px}.mini-player>#mini-expand>span{min-width:0}.mini-player img{width:46px;height:50px;object-fit:cover;object-position:center 20%;border-radius:3px}.mini-player b{font-weight:500;font-size:14px;line-height:1.5;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:330px}.mini-player small{display:block;line-height:1.5;font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mini-player>div:not(.mini-progress){gap:12px;flex-shrink:0}.mini-player #mini-play{width:38px;height:38px;display:grid;place-items:center;border:1px solid #bad7e35c;border-radius:50%;font-size:15px}.mini-player #mini-list{font-size:22px;width:30px}.mini-player>.mini-progress{position:absolute;left:0;right:0;bottom:0;height:2px;display:block;background:#526b791c}.mini-progress i{display:block;height:100%;background:#a4d6eb;transform:scaleX(0);transform-origin:left;transition:transform .25s linear}.music-playing .mini-player{border-color:#aacede55}
.player-dialog[open]{width:min(1020px,calc(100vw - 48px));grid-template-columns:.9fr 1.1fr;max-height:min(90svh,840px);background:#0e1822;overflow:auto}.player-art{padding:42px;justify-content:flex-start;background:linear-gradient(150deg,#172632,#0a121b);position:sticky;top:0;align-self:start;min-width:0}.player-art>img{width:100%;aspect-ratio:4/5;object-fit:cover;object-position:center 20%;box-shadow:0 20px 40px #0005}.player-art .album-caption{display:flex;justify-content:space-between;gap:14px;margin-top:24px}.player-art .album-caption>span{font-size:10px;letter-spacing:.12em;margin:0;color:#9cb0bd}.player-content{padding:50px 32px 28px;min-width:0}.player-content h2{font-size:clamp(23px,2.2vw,31px);font-weight:500;letter-spacing:-.035em;line-height:1.4;text-align:left;margin:18px 0 10px;overflow-wrap:anywhere}.player-content .muted{font-size:13px;margin-bottom:24px}.player-kicker{display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:.2em}.playing-bars{display:flex;align-items:center;gap:3px;height:16px}.playing-bars i{height:4px;width:2px;background:#a4d6eb}.music-playing .playing-bars i{animation:musicBars .9s ease-in-out infinite alternate}.music-playing .playing-bars i:nth-child(2){animation-delay:-.4s}.music-playing .playing-bars i:nth-child(3){animation-delay:-.65s}.music-playing .playing-bars i:nth-child(4){animation-delay:-.2s}.player-controls{margin:22px 0}.player-controls button{font-size:18px;color:#a2b5c3;min-height:40px}.player-controls #play{background:#d6e7ed;color:#0b1722;border:0;width:56px;height:56px;font-size:18px}.player-controls #play:hover{background:#f1f8fc}.player-controls button[aria-pressed=true]{color:#d9ecf7;background:#9fc7da14;border-radius:4px}.volume{font-size:11px;color:#93a7b5}.time{font-variant-numeric:tabular-nums;font-size:12px}.track-list-heading{display:flex;justify-content:space-between;align-items:center;margin-top:32px;padding:20px 0 14px;border-top:1px solid var(--line);font-size:13px;color:#c3d3dd}.track-list-heading>span:last-child{font-size:10px;letter-spacing:.15em;color:#7d94a3}.track-row{display:flex;align-items:center;gap:14px;padding:13px 10px;border-bottom:1px solid #b4cad711;transition:background .2s}.track-number{font-size:11px;color:#718b9b;min-width:19px;font-variant-numeric:tabular-nums}.track-info{flex:1;min-width:0}.track-info strong{display:block;font-size:14px;font-weight:400;line-height:1.5;overflow-wrap:anywhere}.track-info small{display:block;font-size:12px;color:#8b9fac;line-height:1.5;margin-top:3px}.track-play{font-size:10px;color:#a8c7d7;opacity:0;transition:opacity .2s}.track-row:hover{background:#a4c5d70a}.track-row.active{background:#9bc7dd0d;box-shadow:inset 2px 0 #aacdde;color:#dcecf5}.track-row.active .track-number{color:#c1dfed}.track-row:is(:hover,.active,:focus-visible) .track-play{opacity:1}#audio-error{margin-top:14px;font-size:12px}
.start-card{min-height:380px;border:1px solid var(--line)}.start-card>div{bottom:32px;left:32px;right:32px}.start-card h3{font-weight:500;letter-spacing:.02em}.ost-section{gap:100px}.ost-section>img{box-shadow:0 30px 80px #0005;border:1px solid #a4c1d022}.ost-section h2{font-weight:600}.flight-shell{border-color:#8eafc238}.flight-toolbar button[aria-pressed=true]{background:#bdcfd9;color:#0b1720;border-color:#bdcfd9}.flight-caption{color:#849baa}.archive-panel-head{background:#152330}.archive-open .archive-record{border-color:#a8bdc448;box-shadow:0 15px 45px #0009}footer{padding-bottom:145px;color:#9daebb}
@keyframes dialogArrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes musicBars{from{height:4px}to{height:15px}}
@media(max-width:1000px){.section{padding-block:90px}.intro-grid{gap:45px}.character-grid{gap:32px 20px}.detail-copy{padding:65px 30px 35px}.detail-copy h2{font-size:44px}.detail-portrait{min-height:610px}.player-art{padding:28px}.player-content{padding:48px 26px 25px}.ost-section{gap:50px}header{padding-inline:28px}}
@media(max-width:700px){.section{padding:72px 24px}.section-label{font-size:11px;margin-bottom:30px;gap:12px}.section-heading{margin-bottom:30px}.section-heading>p{font-size:15px}.intro-grid{gap:28px}.intro-grid p{font-size:16px}.hero-line{font-size:15px}.history{margin-top:48px}.history-list p{font-size:15px}.bestiary{padding:60px 24px}.monster-copy{padding:25px}.faction-stage{height:530px}.faction-copy{left:25px;right:25px;width:auto;bottom:30px}.character-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 14px}.character-card{padding-bottom:15px}.card-title{font-size:20px;margin-top:10px}.character-card p{font-size:12px}.card-index{font-size:9px;left:8px;top:8px}.character-dialog[open]{display:block;width:calc(100vw - 24px)}.detail-portrait{min-height:0;height:420px;max-height:57svh}.detail-portrait>img{object-position:50% 22%}.portrait-caption{left:20px;right:20px;bottom:20px;font-size:9px}.detail-copy{padding:30px 26px}.detail-copy h2{font-size:39px}.detail-copy>p.muted{margin:24px 0;line-height:1.95}.character-soundtrack{margin-top:26px;padding-top:22px}.mini-player{bottom:max(10px,env(safe-area-inset-bottom));width:calc(100% - 24px);height:70px;padding:9px 12px;gap:10px}.mini-player b{font-size:13px;max-width:none}.mini-player small{font-size:11px}.mini-player img{width:41px;height:45px}.mini-player>div:not(.mini-progress){gap:7px}.player-dialog[open]{display:block;width:calc(100vw - 24px);max-height:92svh}.player-art{position:relative;padding:30px 60px 24px;display:block}.player-art>img{max-height:260px;object-position:50% 18%;aspect-ratio:4/3}.player-art .album-caption{margin-top:15px}.player-art .album-caption>span{display:block;font-size:9px}.player-content{padding:25px}.player-content h2{font-size:26px}.track-info strong{font-size:14px}.track-row{padding:14px 8px}.track-play{opacity:1}.ost-section{gap:35px}.ost-section>img{width:80%}.start-card{min-height:320px}.hero-bottom{font-size:11px;bottom:30px}.hero-copy{padding-bottom:145px}header{padding-inline:20px}nav{gap:18px}.history-list{gap:28px}.player-art span{display:block}}
@media(hover:none){.card-index{opacity:1;transform:none}.character-card:active .portrait img{transform:scale(1.02)}.character-card:active .card-title:before{transform:scaleX(1)}}
@media(prefers-reduced-motion:reduce){dialog[open],.music-playing .playing-bars i{animation:none}.music-playing .playing-bars i{height:9px}.mini-progress i{transition:none}}
.player-lyrics{border-top:1px solid #b4cfde20;margin-top:24px;padding-top:22px;min-height:120px;text-align:center;overflow-wrap:anywhere}.lyric-current{font-size:18px;line-height:1.8;color:#e5f0f6;white-space:pre-line;word-break:keep-all;font-weight:500;letter-spacing:-.015em}.lyric-next{font-size:13px;line-height:1.8;color:#839aa9;margin-top:12px;white-space:pre-line}.player-lyrics[data-state=missing] .lyric-current,.player-lyrics[data-state=intro] .lyric-current,.player-lyrics[data-state=instrumental] .lyric-current{color:#8b9eab;font-size:14px;font-weight:400}.player-art>img{max-height:48svh}.player-art .album-caption{margin-top:18px}@media(max-width:700px){.player-lyrics{margin-top:18px;padding-top:16px;min-height:100px}.lyric-current{font-size:16px}.lyric-next{font-size:12px;margin-top:8px}.player-art{padding-inline:32px}.player-art>img{max-height:260px}}