@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@400;500;600;700;800;900&display=swap');
:root{color-scheme:dark;--bg:#080d1b;--ink:#eef3ff;--muted:#a8b3cc;--accent:#87a9ff}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'Noto Sans KR',sans-serif}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}.room{min-height:100svh;position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column}.art{position:absolute;z-index:-3;inset:0 0 0 32%;overflow:hidden}.art img{width:100%;height:100%;object-fit:cover;object-position:center 32%}.shade{position:absolute;inset:0;z-index:-2;background:linear-gradient(90deg,#080d1b 0%,rgba(8,13,27,.96) 23%,rgba(8,13,27,.76) 40%,rgba(8,13,27,.08) 66%),linear-gradient(0deg,rgba(8,13,27,.9),transparent 24%,transparent 83%,rgba(8,13,27,.28))}header,footer{display:flex;justify-content:space-between;align-items:center;margin:0 5%;z-index:1}header{padding:35px 0}.wordmark{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.16em;font-size:15px}.wordmark:first-letter{color:var(--accent)}.edition{font-size:12px;letter-spacing:.18em;color:#ced8f0}.profile{width:650px;max-width:55%;margin:auto 0 auto 10%;padding:62px 0 45px}.eyebrow{font-size:12px;letter-spacing:.23em;font-weight:600;color:var(--accent);display:flex;align-items:center;gap:12px}.eyebrow span{height:1px;width:32px;background:var(--accent)}h1{font-size:clamp(32px,3.35vw,54px);letter-spacing:-.055em;line-height:1.35;margin:24px 0 42px;font-weight:800}h1>span{color:#e1e9fc}.identity{display:flex;align-items:center;gap:19px}.avatar{width:76px;height:76px;object-fit:cover;object-position:50% 22%;border-radius:50%;border:2px solid #a7c0ff;box-shadow:0 0 0 6px #8badff0b}.identity h2{font-size:23px;letter-spacing:.025em;margin:0 0 5px;font-weight:700}.identity h2 span{font-size:19px;color:var(--accent);margin-left:5px}.identity p{font-size:14px;color:var(--muted);margin:0}.bio{font-size:16px;line-height:1.95;color:#b6c1d9;margin:27px 0 21px}.tags{display:flex;gap:9px}.tags span{font-size:12px;letter-spacing:.09em;color:#a5b8e3;border:1px solid #839cdb2d;border-radius:4px;padding:6px 11px;background:#24335224}.socials{display:flex;gap:10px;margin-top:35px;flex-wrap:wrap}.socials a{display:flex;align-items:center;gap:10px;padding:14px 15px;background:#101a2e9e;border:1px solid #899cc033;color:#e5ecff;border-radius:7px;cursor:pointer;font:500 14px 'Noto Sans KR',sans-serif;transition:background .2s,border-color .2s,transform .2s;backdrop-filter:blur(12px)}.socials a:hover{background:#233759bd;border-color:#91b0ff;transform:translateY(-3px)}.socials svg{width:17px;height:17px;fill:currentColor}.socials .stroke{fill:none;stroke:currentColor;stroke-width:1.7}.arrow{color:#9babce;margin-left:6px}.link-note{font-size:12px;color:#8e9ab3;margin:12px 0 0;min-height:20px}.side-note{position:absolute;left:3%;top:48%;writing-mode:vertical-rl;transform:rotate(180deg);letter-spacing:.2em;font-size:12px;color:#7281a0}.art-caption{position:absolute;bottom:105px;right:5%;text-align:right;text-shadow:0 2px 20px #000}.art-caption>span{font-size:21px;letter-spacing:.14em}.art-caption small{display:block;color:#b7c8ee;font-size:10px;letter-spacing:.22em;margin-top:12px}footer{font-size:12px;color:#8b99b5;padding:22px 0 26px;border-top:1px solid #829cc51b;gap:18px}.star{margin-left:16px;color:var(--accent)}:focus-visible{outline:2px solid var(--accent);outline-offset:5px}@media(min-width:1700px){.profile{margin-left:14%}}@media(max-width:1000px){.profile{max-width:65%;margin-left:8%}.art{left:22%}.shade{background:linear-gradient(90deg,#080d1b 0%,#080d1be8 25%,#080d1b9c 50%,#080d1b15 100%),linear-gradient(0deg,#080d1b,transparent 50%)}.art-caption{display:none}.side-note{display:none}}@media(max-width:650px){header{padding:25px 0}.edition{font-size:10px;letter-spacing:.1em}.room{min-height:100svh}.art{inset:0 0 auto 0;height:650px}.art img{object-position:58% 18%;opacity:.85}.shade{background:linear-gradient(0deg,#080d1b 0%,#080d1b 16%,#080d1be8 35%,#080d1b6b 65%,#080d1b08 85%,#080d1b30 100%)}.profile{max-width:none;width:auto;margin:220px 7% 0;padding:30px 0 26px}.eyebrow{font-size:10px;letter-spacing:.17em}h1{font-size:34px;margin:20px 0 29px}.avatar{width:64px;height:64px}.identity h2{font-size:21px}.identity p{font-size:14px}.identity{gap:16px}.bio{margin-top:24px}.socials{gap:8px;margin-top:26px}.socials a{padding:13px 12px;gap:8px;font-size:14px}.socials .arrow{display:none}footer{margin:0 7%;font-size:11px;align-items:flex-end}footer>span:last-child{max-width:180px;text-align:right}.star{margin-left:6px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}

h1{font-size:clamp(27px,2.5vw,40px);line-height:1.55;word-break:keep-all}.tags{flex-wrap:wrap;max-width:530px}.tags span{font-size:14px;letter-spacing:0}.tags small{font-size:12px;color:#a8b3cc;margin-left:5px}@media(max-width:650px){h1{font-size:clamp(23px,5.9vw,34px)}.tags{gap:8px}}

/* Keep the nickname and game servers together beside the portrait. */
.identity{align-items:flex-start;gap:22px}.avatar{width:82px;height:82px;flex-shrink:0;object-position:50% 16%}.identity-text{min-width:0;padding-top:2px}.identity h2{margin-bottom:12px}.identity .games{display:grid;grid-template-columns:max-content max-content;column-gap:19px;row-gap:7px;font-size:14px;line-height:1.65;color:#c3cfea}.games>span{white-space:nowrap}.games small{font-size:14px;color:#95a6c8;margin-left:3px}.bio{margin-top:29px}.socials{margin-top:28px}h1{font-size:clamp(32px,3.1vw,48px);line-height:1.45;margin-bottom:36px}
@media(max-width:650px){.identity{gap:17px}.avatar{width:64px;height:64px}.identity h2{margin-bottom:9px}.identity .games{display:flex;flex-wrap:wrap;gap:5px 13px}.games>span{white-space:normal;word-break:keep-all}h1{font-size:clamp(29px,7.4vw,42px);margin-bottom:29px}.bio{margin-top:25px}}

.identity .games{display:flex;flex-direction:column;gap:7px}.games>.game-row{display:flex;flex-wrap:wrap;gap:5px 16px;white-space:normal}.game-row>span{white-space:nowrap}.socials{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));max-width:370px}.socials .arrow{margin-left:auto}@media(max-width:650px){.identity{flex-wrap:wrap}.identity-text{flex:1 1 240px}.identity .games{gap:7px}.games>.game-row{gap:5px 12px}.socials{max-width:370px}}

/* Dawn artwork spans the page; the portrait has its own image. */
:root{--bg:#101329;--accent:#b7b9ff;--muted:#bbc0d9}.art{inset:0}.art img{object-position:70% center;opacity:1}.shade{background:linear-gradient(90deg,rgba(12,16,37,.88) 0%,rgba(16,20,43,.74) 28%,rgba(19,22,46,.42) 46%,rgba(19,22,46,.03) 67%),linear-gradient(0deg,rgba(9,12,29,.9),transparent 28%,transparent 83%,rgba(12,15,33,.18))}.profile{max-width:49%;text-shadow:0 2px 16px #080d1b55}.avatar{object-fit:cover;object-position:50% 29%;border-color:#d2ccff;box-shadow:0 0 0 6px #b4b4ff15,0 8px 26px #090b2255}.identity h2{color:#fff}.bio{color:#e0e1ef}.identity .games{color:#dddff1}.games small{color:#bcc1df}.socials a{background:#191c3e8c;border-color:#c5bfff38}.socials a:hover{background:#34355fcb;border-color:#d2c8ff}.art-caption{bottom:101px;right:5%;text-shadow:0 2px 16px #080d1bcc}.art-caption>span{font-family:Georgia,'Times New Roman',serif;font-size:clamp(21px,2vw,30px);letter-spacing:.025em}.art-caption small{font-size:14px;letter-spacing:.035em;color:#dddced;margin-top:10px}footer{color:#c1c4da}
@media(min-width:651px) and (max-width:1000px){.profile{max-width:57%;margin-left:7%}.art img{object-position:67% center}.art-caption{display:block;bottom:83px;max-width:35%}.art-caption>span{font-size:21px}.art-caption small{font-size:13px;line-height:1.7}}
@media(max-width:650px){.art{inset:0 0 auto;height:570px}.art img{object-position:76% center;opacity:1}.shade{background:linear-gradient(180deg,rgba(16,19,41,.12) 0px,rgba(16,19,41,.04) 230px,rgba(16,19,41,.83) 390px,#101329 560px)}.profile{max-width:none;margin:265px 7% 0;padding-top:25px}.avatar{object-position:50% 29%}.art-caption{display:block;position:relative;right:auto;bottom:auto;max-width:none;margin:5px 7% 30px;text-align:left}.art-caption>span{font-size:23px}.art-caption small{font-size:14px;margin-top:8px}.identity-text{flex-basis:240px}footer{font-size:12px}}

.identity .avatar{display:block;width:96px;height:96px;min-width:96px;aspect-ratio:1;flex:0 0 96px;object-fit:cover;object-position:center;border:2px solid #d2ccff;image-rendering:auto}@media(max-width:650px){.identity .avatar{width:80px;height:80px;min-width:80px;flex-basis:80px}}

/* Restrained armory markings retain the dawn palette. */
.wordmark,.edition,.eyebrow,.side-note{font-family:'Courier New',monospace}.wordmark{letter-spacing:.1em;gap:11px}.reticle{width:23px;height:23px;flex-shrink:0;color:var(--accent);vertical-align:middle}.edition{border:1px solid #b7b9ff55;border-left:3px solid #b7b9ff99;padding:9px 12px;letter-spacing:.09em}.eyebrow>span{width:24px;height:12px;background:none;border-left:2px solid var(--accent);border-top:2px solid var(--accent)}.rank-mark{display:inline-flex;flex-direction:column;gap:3px;vertical-align:middle;transform:translateY(-3px)}.rank-mark i{display:block;width:12px;height:7px;border-left:2px solid var(--accent);border-top:2px solid var(--accent);transform:rotate(45deg)}.socials a{border-radius:2px}.star .reticle{width:16px;height:16px}.art-caption{border-right:2px solid #c7c5ff88;padding-right:16px}.side-note{letter-spacing:.14em}header{gap:16px;flex-wrap:wrap}@media(max-width:650px){header{align-items:flex-start;gap:12px}.wordmark{font-size:14px;letter-spacing:.06em}.wordmark .reticle{width:20px;height:20px}.edition{font-size:10px;padding:6px 8px}.eyebrow{font-size:12px;letter-spacing:.08em}.art-caption{border-right:0;border-left:2px solid #c7c5ff88;padding-left:14px;padding-right:0}}

.wordmark,.edition,.eyebrow,.side-note{font-family:'Noto Sans KR',Arial,sans-serif}.wordmark{font-weight:800;letter-spacing:.055em}.edition{font-size:12px;font-weight:600;letter-spacing:.065em}.eyebrow{font-size:13px;font-weight:700;letter-spacing:.09em}.side-note{font-size:12px;font-weight:500;letter-spacing:.11em}.eyebrow>span{display:block;width:26px;height:2px;border:0;background:var(--accent);flex-shrink:0}@media(max-width:650px){.wordmark{font-size:14px;letter-spacing:.035em}.edition{font-size:12px;letter-spacing:.035em}.eyebrow{font-size:12px;letter-spacing:.065em}}

.military-mark{display:inline-block;flex-shrink:0;color:var(--accent);vertical-align:middle}.identity h2 .dog-tags{width:28px;height:30px;margin-left:8px;vertical-align:-6px}.eyebrow .crossed-rifles{width:29px;height:29px}.eyebrow{gap:12px}@media(max-width:650px){.identity h2 .dog-tags{width:26px;height:28px}.eyebrow .crossed-rifles{width:27px;height:27px}}

.identity h2 .tank-mark{width:44px;height:28px;margin-left:9px;vertical-align:-5px}.eyebrow .ammo-mark{width:33px;height:30px}.eyebrow{gap:13px}@media(max-width:650px){.identity h2 .tank-mark{width:40px;height:26px}.eyebrow .ammo-mark{width:31px;height:28px}}

.identity h2 .tank-mark{width:54px;height:29px;vertical-align:-5px}@media(max-width:650px){.identity h2 .tank-mark{width:50px;height:27px}}

/* Align all marks using layout rather than text baseline offsets. */
.wordmark,.eyebrow,.identity h2,.farewell{display:flex;align-items:center}.wordmark{gap:11px}.eyebrow{gap:13px}.identity h2{gap:10px;line-height:1.35}.identity h2 .nickname{font:inherit;color:inherit;margin:0}.identity h2 .tank-mark{display:block;width:66px;height:auto;margin:0;vertical-align:initial;transform:none;flex:0 0 66px}.wordmark .reticle,.eyebrow .ammo-mark{display:block;margin:0;vertical-align:initial;transform:none}.farewell{gap:12px;line-height:1.5}.farewell .star{display:flex;align-items:center;justify-content:center;margin:0;flex:0 0 16px;line-height:1}.farewell .reticle{display:block;width:16px;height:16px;margin:0;vertical-align:initial}footer{align-items:center}@media(max-width:650px){.identity h2 .tank-mark{width:60px;flex-basis:60px;height:auto;margin:0;vertical-align:initial}footer{align-items:center}footer>.farewell{max-width:none;text-align:right;gap:9px}.farewell>span:first-child{word-break:keep-all}}

.identity h2 .sniper-mark{display:block;width:80px;height:auto;flex:0 0 80px;margin:0;transform:none;vertical-align:initial}@media(max-width:650px){.identity h2 .sniper-mark{width:74px;flex-basis:74px}}

.identity h2 .sniper-mark{width:112px;height:auto;flex:0 0 112px;object-fit:contain;opacity:1}@media(max-width:650px){.identity h2 .sniper-mark{width:100px;flex-basis:100px}}

.identity h2{gap:8px}.identity h2 .sniper-mark{width:3.2em;flex:0 0 3.2em;height:auto;align-self:center;margin:0;transform:none}@media(max-width:650px){.identity h2{gap:7px}.identity h2 .sniper-mark{width:3.2em;flex-basis:3.2em}}


/* Paint the illustration directly on the page, without negative layers. */
.room{background-color:#101329;background-image:linear-gradient(90deg,rgba(12,16,37,.88) 0%,rgba(16,20,43,.74) 28%,rgba(19,22,46,.42) 46%,rgba(19,22,46,.03) 67%),linear-gradient(0deg,rgba(9,12,29,.9),transparent 28%,transparent 83%,rgba(12,15,33,.18)),url("background-dawn.jpg");background-size:cover;background-position:center,center,70% center;background-repeat:no-repeat;isolation:auto}.room>header,.room>.profile,.room>.art-caption,.room>footer,.room>.side-note{z-index:1}
@media(max-width:650px){.room{background-image:linear-gradient(180deg,rgba(16,19,41,.12) 0px,rgba(16,19,41,.04) 230px,rgba(16,19,41,.83) 390px,#101329 560px),url("background-dawn.jpg");background-size:100% 570px,auto 570px;background-position:top center,76% top;background-repeat:no-repeat}}

/* Visitor readout and shared game columns. */
.visitor-counter{display:flex;flex-direction:column;align-items:flex-end;gap:12px;margin-left:auto;font-size:12px;font-weight:600;letter-spacing:.065em;color:#ced8f0;font-variant-numeric:tabular-nums}
.visitor-counter .edition{white-space:nowrap;margin-right:20px}
.visitor-total{white-space:nowrap;padding-right:2px;color:#c1c4da;font-size:11px}
.side-note{top:50%;transform:translateY(-50%) rotate(180deg)}
.identity .games{display:grid;grid-template-columns:max-content max-content;gap:7px 24px;margin:0;font-size:14px;line-height:1.65;color:#dddff1}
.games>a{display:block;white-space:nowrap;text-decoration:underline;text-decoration-color:#b7b9ff40;text-underline-offset:4px;transition:color .2s,text-decoration-color .2s}
.games>a:hover,.games>a:focus-visible{color:#fff;text-decoration-color:#d2ccff}
@media(max-width:650px){.visitor-counter{gap:9px;font-size:11px}.visitor-counter .edition{font-size:11px;margin-right:12px}.visitor-total{font-size:10px}.identity .games{column-gap:20px;font-size:13px}.games small{font-size:12px;margin-left:2px}.identity-text{flex-basis:100%}}
@media(max-width:360px){.identity .games{column-gap:12px;font-size:12px}.games small{font-size:11px}}

/* Matching counter frames and equal game-link buttons. */
.visitor-counter .edition,.visitor-counter .visitor-total{border:1px solid #b7b9ff55;border-left:3px solid #b7b9ff99;padding:9px 12px;font-size:12px;font-weight:600;letter-spacing:.065em;color:#ced8f0;line-height:1.5}
.identity-text{flex:1;min-width:0}
.identity .games{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%;max-width:320px;font-size:12px;line-height:1.6}
.games>a{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:0 3px;min-width:0;min-height:34px;padding:5px 7px;border:1px solid #c5bfff38;border-radius:2px;background:#191c3e8c;text-align:center;white-space:normal;word-break:keep-all;text-decoration:none;backdrop-filter:blur(12px);transition:background .2s,border-color .2s,color .2s}
.games>a small{font-size:12px;margin:0;white-space:nowrap}
.games>a:hover,.games>a:focus-visible{background:#34355fcb;border-color:#d2c8ff;color:#fff}
@media(max-width:650px){.visitor-counter .edition,.visitor-counter .visitor-total{font-size:11px;padding:6px 8px;letter-spacing:.035em}.identity-text{flex:1 1 100%}.identity .games{gap:6px;font-size:12px;max-width:320px}.games>a{min-height:34px;padding:5px 6px}}
@media(max-width:360px){.identity .games{font-size:12px}.games>a small{font-size:11px}}

/* Official game icons, kept compact alongside each label. */
.games>a{flex-wrap:nowrap;gap:4px;padding:5px 6px}
.games .game-icon{display:block;width:14px;height:14px;flex:0 0 14px;object-fit:contain;border-radius:2px}
.games .game-label{min-width:0;line-height:1.6;letter-spacing:-.025em;word-break:keep-all}
.games>a .game-label small{font-size:10px;margin-left:2px;white-space:nowrap;letter-spacing:0}

/* Muted lavender treatment preserves the marks' tonal detail. */
.games .game-icon{filter:grayscale(1) sepia(1) saturate(1.6) hue-rotate(190deg);opacity:.78;transition:opacity .2s}
.games>a:hover .game-icon,.games>a:focus-visible .game-icon{opacity:1}

/* White, background-free game marks match the social icons. */
.games .game-icon{width:18px;height:18px;flex-basis:18px;filter:none;opacity:1;border-radius:0}
.games>a{gap:4px;padding-left:5px;padding-right:5px}