@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:ital,wght@0,600;0,700;0,800;0,900;1,700;1,800;1,900&family=Barlow:wght@400;500;600;700&family=Cinzel:wght@500;600;700;800;900&display=swap');
:root{--bg:#101216;--text:#f2f1f3;--muted:#858996;--orange:#ff982c;--purple:#d7a2fa;--line:#2d3140}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:Barlow,Arial,sans-serif}a{color:inherit;text-decoration:none}button{cursor:pointer;font:inherit}a:focus-visible,button:focus-visible{outline:2px solid var(--purple);outline-offset:5px}.profile{width:min(1120px,calc(100% - 64px));margin:auto}header{height:82px;display:flex;align-items:center;gap:30px}.wordmark{font:800 25px 'Barlow Condensed',Impact;letter-spacing:2px}.wordmark span{color:var(--purple);margin-left:12px}.header-label{color:var(--muted);font-size:9px;letter-spacing:2px}header button{margin-left:auto;border:1px solid #45404e;background:transparent;color:var(--text);font-size:10px;font-weight:700;letter-spacing:1px;padding:11px 18px}.intro{position:relative;isolation:isolate;overflow:hidden;min-height:330px;border:1px solid var(--line);background:#1d1d23}.intro-art{position:absolute;inset:0;background:url('assets/tracer.jpg') right 37%/cover;z-index:-2;opacity:.85}.intro:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#17191ff7 8%,#17191fdd 35%,#17191f12 85%);z-index:-1}.intro-content{padding:43px 40px}.eyebrow{font-size:9px;font-weight:700;letter-spacing:2.5px;color:#a3a7b3;margin:0 0 15px;display:flex;align-items:center;gap:8px}.eyebrow i{width:5px;height:5px;border-radius:50%;background:var(--purple)}h1{font:italic 900 clamp(66px,8vw,110px)/.95 'Barlow Condensed',Impact;margin:0;letter-spacing:-1px}h1>span{color:var(--purple)}.tagline{font-size:15px;color:#b7bac5;margin:15px 0 23px}.hero-chips{display:flex;flex-wrap:wrap;gap:9px}.hero-chips>span{padding:8px 11px;border:1px solid #8d60916b;color:#dfc2f3;background:#28212c94;font-size:8px;letter-spacing:1.3px;font-weight:700}.hero-chips>span:last-child{border-color:#c9863b66;color:#ffbd72;background:#34271a94}.intro-caption{position:absolute;right:24px;bottom:20px;font-size:8px;letter-spacing:2px;color:#c4c2c6}.ranks{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:23px 0}.rank-card{background:#222c44;border:1px solid #474458;padding:25px 27px 18px;position:relative;overflow:hidden;text-align:center}.rank-card:before{content:'';position:absolute;top:-1px;left:25%;width:50%;height:2px;background:var(--purple)}.open-card:before{background:var(--orange)}.card-top{display:flex;justify-content:space-between;gap:10px;align-items:center}.card-top h2{font:700 22px 'Barlow Condensed',Impact;margin:0;letter-spacing:1px}.card-top h2>span{font-size:18px;color:#b1b7cb;margin-right:7px}.rank-status{font-size:8px;letter-spacing:1.4px;color:var(--purple);font-weight:700}.top-status{color:#ffbc75}.champion-icon{height:164px;width:220px;margin:19px auto 5px;background-image:url('assets/champion-source.png');background-size:1677px 657px;background-position:-80px -94px;background-repeat:no-repeat;mask-image:radial-gradient(ellipse 73% 72% at center,#000 60%,transparent 100%);-webkit-mask-image:radial-gradient(ellipse 73% 72% at center,#000 60%,transparent 100%)}.rank-title{font:italic 800 40px/1.1 'Barlow Condensed',Impact;letter-spacing:.6px}.rank-title b{color:var(--purple);font-weight:800}.top-rank{color:#ffc67c}.top-rank b{color:var(--orange)}.rank-meta{display:flex;justify-content:center;gap:32px;margin:22px 0}.rank-meta>span{display:grid;gap:6px;color:#959fb7;font-size:8px;letter-spacing:1.4px}.rank-meta strong{color:#e5e7ef;font-size:10px;font-weight:600;letter-spacing:.6px}.speedrun{border:1px solid var(--line);border-left:3px solid var(--orange);background:#1a1c22;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:27px 30px;margin:0 0 25px}.speedrun .eyebrow{font-size:8px;margin-bottom:10px;color:#b29b84}.speedrun h2{font:italic 800 33px/1 'Barlow Condensed',Impact;margin:0}.speedrun h2>span{color:var(--orange);margin:0 10px}.clock{display:grid;text-align:right;gap:5px}.clock strong{font:italic 800 52px/.95 'Barlow Condensed',Impact;letter-spacing:2px}.clock strong>span{color:#776a5e}.clock>span{font-size:7px;letter-spacing:2px;color:var(--muted)}.hero-pool{display:grid;grid-template-columns:130px repeat(4,1fr);gap:12px;align-items:center;margin:0 0 25px}.pool-label{font-size:9px;font-weight:600;letter-spacing:2px;color:var(--muted)}.hero{height:110px;position:relative;overflow:hidden;border:1px solid #303440;background:#181c26}.hero:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#101319db,transparent 80%)}.hero img{width:100%;height:100%;object-fit:cover;object-position:67% center;transition:transform .25s}.hero:hover img{transform:scale(1.08)}.hero>span{position:absolute;z-index:1;bottom:12px;left:13px;font:700 18px 'Barlow Condensed',Impact;letter-spacing:1px}footer{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:15px 0 30px;color:#6f7585;font-size:8px;letter-spacing:.7px}footer>span{font-weight:700;color:#a2a5ad}footer b{font-weight:500;margin-left:10px;color:#656b78}footer small{font-size:8px;letter-spacing:0}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,10px);padding:12px 20px;color:#16121b;background:#e4cbf5;font-size:12px;opacity:0;pointer-events:none;transition:.2s}#toast.show{opacity:1;transform:translate(-50%,0)}@media(min-width:1600px){.profile{max-width:1180px}}@media(max-width:800px){.profile{width:calc(100% - 40px)}.header-label{display:none}.intro{min-height:300px}.intro-content{padding:36px 28px}.rank-card{padding:20px 16px 15px}.rank-status{font-size:7px}.card-top h2{font-size:19px}.rank-title{font-size:33px}.rank-meta{gap:20px}.hero-pool{grid-template-columns:repeat(4,1fr)}.pool-label{grid-column:1/-1;margin:4px 0}.hero{height:100px}.hero>span{font-size:16px;left:9px}.speedrun{padding:24px}.speedrun h2{font-size:28px}.clock strong{font-size:44px}footer{align-items:flex-start;flex-direction:column;gap:8px}.intro-caption{font-size:7px}}@media(max-width:540px){.profile{width:calc(100% - 28px)}header{height:70px}.wordmark{font-size:23px}header button{font-size:9px;padding:9px 12px}.intro-art{background-position:61% center}.intro:after{background:linear-gradient(90deg,#17191fee,#17191f80 70%,#17191f33)}.intro{min-height:295px}.intro-content{padding:35px 22px}h1{font-size:70px}.tagline{font-size:13px}.intro-caption{display:none}.ranks{grid-template-columns:1fr;gap:14px;margin:16px 0}.rank-card{padding:21px 24px 16px}.card-top h2{font-size:23px}.rank-status{font-size:8px}.champion-icon{margin-top:10px}.rank-title{font-size:38px}.rank-meta{gap:45px;margin:19px 0}.speedrun{padding:22px 20px;gap:20px;align-items:flex-start;flex-direction:column;margin-bottom:24px}.speedrun h2{font-size:33px}.clock{text-align:left}.clock strong{font-size:54px}.hero-pool{grid-template-columns:repeat(2,1fr);gap:10px}.hero{height:115px}.hero>span{font-size:20px;left:12px}footer b{margin-left:8px;font-size:7px}footer small{font-size:7px}}@media(prefers-reduced-motion:reduce){*{transition:none!important}}
.hero-pool{grid-template-columns:repeat(5,minmax(0,1fr))}.pool-label{grid-column:1/-1;margin:0 0 2px}.receipts{margin:30px 0}.receipts-heading{display:flex;justify-content:space-between;align-items:center;margin:0 0 14px}.receipts-heading h2{font:700 19px 'Barlow Condensed',Impact;letter-spacing:1.2px;margin:0}.receipts-heading>span{color:var(--muted);font-size:8px;letter-spacing:2px}.receipt-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.receipt{padding:0;background:#1a202c;border:1px solid #343b4a;overflow:hidden;text-align:left;color:var(--text)}.receipt:hover{border-color:var(--purple)}.receipt img{display:block;width:100%;height:auto}.receipt>span{display:flex;justify-content:space-between;align-items:center;padding:12px 15px;font-size:9px;letter-spacing:2px}.receipt b{color:var(--purple);font-size:16px}#run-viewer{width:min(1400px,95vw);max-width:95vw;max-height:92vh;border:1px solid #484052;padding:15px;background:#151922;color:var(--text)}#run-viewer::backdrop{background:#070a10e8}#run-viewer img{display:block;max-width:100%;max-height:calc(90vh - 80px);width:auto;height:auto;margin:auto}.viewer-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:12px}.viewer-toolbar strong{font-size:11px;letter-spacing:2px}.viewer-toolbar>div{display:flex;gap:7px}.viewer-toolbar button{padding:8px 14px;border:1px solid #3a4050;background:#232938;color:#eee;font-size:15px}.viewer-toolbar button:hover{color:var(--purple);border-color:var(--purple)}@media(max-width:800px){.hero-pool{grid-template-columns:repeat(5,minmax(0,1fr))}.hero>span{font-size:15px;left:7px}}@media(max-width:540px){.hero-pool{grid-template-columns:repeat(2,minmax(0,1fr))}.hero-pool>.hero:last-child{grid-column:1/-1}.hero>span{font-size:20px;left:12px}.receipt-grid{grid-template-columns:1fr}#run-viewer{padding:10px}}
.champion-icon{width:190px;height:164px;background-image:url('assets/champion-transparent.png');background-size:contain;background-position:center;background-repeat:no-repeat;mask-image:none;-webkit-mask-image:none}

:root{--bg:#09070e;--text:#f4edf7;--muted:#a08da8;--orange:#d94968;--purple:#c58aeb;--line:#3c274d}body{background-color:#09070e;background-image:linear-gradient(45deg,#1b112426 25%,transparent 25%,transparent 75%,#1b112426 75%),linear-gradient(45deg,#1b112426 25%,transparent 25%,transparent 75%,#1b112426 75%);background-size:100px 100px;background-position:0 0,50px 50px}.profile{max-width:1120px}.wordmark{font-family:Cinzel,Georgia,serif;font-size:21px;letter-spacing:3px}.wordmark span{color:#cf4260;font-size:28px}header{border-bottom:1px solid #3b2343;margin-bottom:20px}.header-label{color:#92749e;letter-spacing:3px}header button{border-color:#694178;color:#d7b4e3;background:#1b1026}.intro{border-color:#56305f;min-height:355px;background:#120c1d}.intro:after{background:linear-gradient(90deg,#0d0813f5 1%,#140b20a8 48%,#140b2015 85%)}.intro-art{background-image:url('assets/lelouch-banner.png');background-position:center;background-size:cover;opacity:1}.intro-content{padding:52px 40px}.intro h1{font:700 clamp(45px,6.5vw,84px)/1.1 Cinzel,Georgia,serif;letter-spacing:4px}.intro h1>span{color:#d64a72}.intro .eyebrow{color:#dfb5c6;letter-spacing:3px}.intro .eyebrow i{background:#db4768}.tagline{font-family:Cinzel,Georgia,serif;color:#cdb8d6;font-size:15px;letter-spacing:1px}.hero-chips>span{background:#291538c9;border-color:#62406e;color:#e3b7f5}.hero-chips>span:last-child{background:#331525c9;border-color:#773148;color:#efb2c5}.intro-caption{color:#d4b6df;letter-spacing:4px}.rank-card{background:linear-gradient(150deg,#21122e,#100b19 80%);border-color:#4a2b5c;padding-top:25px;padding-bottom:26px}.rank-card:before{background:#c888ed}.open-card:before{background:#cc4568}.card-top h2{font-family:Cinzel,Georgia,serif;font-size:17px;letter-spacing:1px}.card-top h2>span{color:#b38cbf}.rank-title{font-family:Cinzel,Georgia,serif;font-size:30px;letter-spacing:2px}.top-rank{color:#edc6d4}.top-rank b{color:#eb628e}.top-status{color:#e58aa5}.rank-meta{margin-bottom:0}.rank-meta>span{color:#a988b6}.rank-meta strong{color:#e8d5ed}.speedrun{background:linear-gradient(100deg,#1f102b,#130b1d);border-color:#42254f;border-left:3px solid #ad365a}.speedrun .eyebrow{color:#b28aab}.speedrun h2{font-family:Cinzel,Georgia,serif;font-size:23px}.speedrun h2>span{color:#dd719d}.clock strong{color:#ebd0ed}.clock strong>span{color:#8b4f89}.pool-label{color:#b491c4;letter-spacing:3px}.hero{border-color:#46284e;background:#170d22}.hero:after{background:linear-gradient(0deg,#120819f2,#170d2222)}.hero img{filter:saturate(.65)}.hero:hover img{filter:saturate(1)}.hero>span{color:#eedbf4}.receipts-heading h2{font-family:Cinzel,Georgia,serif;font-size:16px;letter-spacing:2px}.receipt{background:#180d22;border-color:#462b52}.receipt img{aspect-ratio:2.2/1;object-fit:contain;background:#0f0916}.receipt>span{color:#d6bce3}.receipt:hover{border-color:#b777cc}.receipt b{color:#d35382}footer{border-top:1px solid #34203c;margin-top:5px}footer>span{color:#bd9dcc}footer b{color:#946b9e}footer small{color:#725a7f}#run-viewer{background:#100a18;border-color:#6c427c}.viewer-toolbar button{background:#21102e;border-color:#5a3468}#toast{background:#dbc0ed;color:#1a0e25}.champion-icon{filter:drop-shadow(0 0 13px #b438c526)}@media(max-width:800px){.intro h1{font-size:65px}.intro-content{padding:48px 28px}.rank-title{font-size:24px}.card-top h2{font-size:15px}.speedrun h2{font-size:20px}}@media(max-width:540px){header{margin-bottom:14px}.wordmark{font-size:18px;letter-spacing:2px}.intro{min-height:320px}.intro-content{padding:48px 22px}.intro h1{font-size:48px;letter-spacing:1px}.intro-art{background-position:65% center}.intro:after{background:linear-gradient(90deg,#0e0715eb,#160b2385 65%,#15081e22)}.tagline{font-size:13px}.intro .eyebrow{font-size:8px;letter-spacing:2px}.card-top h2{font-size:18px}.rank-title{font-size:29px}.speedrun h2{font-size:22px}.rank-card{padding-bottom:24px}.hero-chips>span{font-size:7px}.receipts-heading h2{font-size:14px}}


.intro-art{background-image:url('assets/lelouch-official.jpg');background-size:auto 100%;background-position:right center;background-repeat:no-repeat;background-color:#120c1d;opacity:1}.intro:after{background:linear-gradient(90deg,#120c1d 40%,#120c1d00 76%)}.intro-content{max-width:72%}.tagline{font-family:Arial,sans-serif;font-weight:600;font-size:18px;letter-spacing:0}.intro-caption{display:none}.lelouch-quote{margin:24px 0;padding:0 0 0 18px;border-left:2px solid #b777cc;color:#d7c5e0;font:italic 17px/1.6 Georgia,serif;max-width:760px}.lelouch-quote cite{display:block;margin-top:7px;color:#9778a5;font:10px Arial,sans-serif;letter-spacing:1px}.receipt img{aspect-ratio:1.9;object-fit:contain}.receipt:nth-child(5),.receipt:nth-child(6){grid-column:1/-1}.receipt:nth-child(5) img,.receipt:nth-child(6) img{aspect-ratio:auto}footer a{color:inherit}.intro .eyebrow{font-size:10px}@media(max-width:540px){.intro-art{background-size:auto 100%;background-position:170px center}.intro:after{background:linear-gradient(90deg,#120c1dfa 5%,#120c1dca 48%,#120c1d00 80%)}.intro-content{max-width:88%;padding-left:20px}.tagline{max-width:210px;font-size:16px;line-height:1.5}.intro h1{font-size:43px}.receipt>span{font-size:8px;letter-spacing:1px}.lelouch-quote{font-size:15px}}
.intro-art{background-image:url('assets/lelouch-anime.jpg');background-size:cover;background-position:center 42%}.intro:after{background:linear-gradient(90deg,#100917f5 0%,#100917cf 35%,#10091733 72%,#10091715)}.intro-content{max-width:75%}@media(max-width:540px){.intro-art{background-size:auto 100%;background-position:60% center}.intro:after{background:linear-gradient(90deg,#100917eb,#1009178a 50%,#10091722)}.intro-content{max-width:95%}}
.wordmark{display:flex;align-items:center;gap:12px;font-size:16px;letter-spacing:1.3px}.king-mark{width:32px;height:42px;object-fit:contain;filter:drop-shadow(0 0 7px #a36bba55)}.intro h1{font-size:clamp(42px,6.3vw,76px)}.intro h1 small{display:block;margin-top:9px;font-size:.42em;letter-spacing:5px;color:#ead8f1}.ranks{grid-template-columns:repeat(3,minmax(0,1fr))}.rank-card{padding-left:20px;padding-right:20px}.card-top h2{display:flex;align-items:center;gap:8px;font-size:15px}.role-icon{width:25px;height:25px;object-fit:contain;flex-shrink:0}.tank-role{mix-blend-mode:screen}.open-role{border-radius:50%;filter:grayscale(1)}.rank-title{font-size:24px;letter-spacing:1px}.rank-status{font-size:8px}.dps-card:before{background:#d2a6ec}@media(max-width:800px){.ranks{grid-template-columns:1fr}.rank-title{font-size:30px}.card-top h2{font-size:18px}.wordmark{font-size:13px;letter-spacing:1px}.header-label{display:none}}@media(max-width:540px){.wordmark{font-size:11px;gap:8px;letter-spacing:.6px}.king-mark{width:27px;height:36px}.intro h1{font-size:44px}.intro h1 small{font-size:21px;letter-spacing:2.5px}}
.music-panel{position:fixed;right:14px;top:50%;transform:translateY(-50%);z-index:10;display:flex;align-items:center;flex-direction:column;gap:14px;padding:16px 10px;border:1px solid #62406e;border-radius:30px;background:#150c22ed;box-shadow:0 8px 30px #0008}.music-upload{cursor:pointer;text-align:center;color:#d5a5eb;font-size:24px}.music-upload span{display:block;font:7px Arial;letter-spacing:1px}.music-panel button{background:none;border:0;color:#dfbfed;cursor:pointer}.music-panel button:disabled{opacity:.35}.music-panel input[type=range]{writing-mode:vertical-lr;direction:rtl;width:20px;height:100px;accent-color:#b477d3}@media(max-width:1250px){.music-panel{top:auto;bottom:16px;right:12px;transform:none;flex-direction:row;border-radius:18px;padding:10px 14px}.music-panel input[type=range]{writing-mode:horizontal-tb;direction:ltr;width:85px;height:20px}}
