/* Jinja bindings for the actual V21 components. */
html,body{overflow-x:clip;cursor:auto}
.nav-shell{position:fixed;inset:0 0 auto;height:82px;min-height:82px;width:100%;z-index:70;padding:0 34px;display:grid;grid-template-columns:205px 1fr 205px;gap:20px;transform:none;margin:0;background:linear-gradient(180deg,rgba(4,4,4,.95),rgba(4,4,4,.72) 72%,transparent);border-bottom:1px solid #ffffff30}
.brand-logo-image{width:205px;height:74px}.desktop-nav{justify-self:center;display:flex;gap:34px;margin:0;white-space:nowrap}
.desktop-nav a{font:700 11px/1.4 'IBM Plex Mono';letter-spacing:.09em;padding:25px 0;color:#aaa}
.desktop-nav a::before{font-size:9px;color:#666;margin-right:7px}.desktop-nav a.is-current,.desktop-nav a[aria-current=page]{color:#fff7a6;text-shadow:0 0 18px #f1df4547}
.desktop-nav a.is-current::after{display:none}.nav-account{justify-self:end}.nav-account a{border-radius:0;font-size:10px;background:#0004;padding:12px 15px;border:1px solid #777}
.page-shell:not(:has(.home-dashboard)){width:100%;max-width:1540px;padding:154px 5vw 70px;display:block}
.page-shell:not(:has(.home-dashboard))::before{right:-30vw;top:-28vw;width:72vw;height:72vw}
.ranking-hero,.archive-hero,.editorial-head{margin:0 0 0;display:flex;align-items:flex-start;border-bottom:1px solid #ffffff26;background:none;box-shadow:none;min-height:340px}
.manga-head>.section-index{position:absolute;top:0;left:0;color:#aaa79c;font-size:10px;font-weight:700;letter-spacing:.17em}
.manga-head>p{position:absolute;right:0;bottom:42px;max-width:380px;margin:0;font-size:13px;line-height:1.65;color:#c7c4b8}
.manga-head .page-note-wrap{width:min(650px,64%);height:205px;flex:none;margin:18px 0 16px}
.page-note h1{all:unset;display:block;color:#0c0b09;text-shadow:none}
.page-note h1::after{display:none}.page-note strong{font-size:clamp(54px,7vw,106px);font-weight:400;text-transform:uppercase;line-height:.82}
.page-note[data-title=PATCHNOTES] strong{font-size:clamp(38px,5.65vw,86px);letter-spacing:-.072em}
.kogane-hero.manga-head .kogane-balance{position:absolute;right:0;bottom:38px;width:min(290px,28%);min-width:220px;background:#090908d9;backdrop-filter:blur(8px)}
.rules-hero.manga-head>p{position:absolute;right:0;bottom:42px}
.ranking-rule{display:none}
.profile-summary{display:grid;grid-template-columns:minmax(290px,1.25fr) minmax(265px,.9fr) minmax(235px,.72fr);gap:34px;align-items:center;min-height:210px;padding:30px 0;margin:0 0 1px;background:transparent;border:0;border-bottom:1px solid #ffffff2e;box-shadow:none}
.profile-summary .profile-identity{gap:24px}.profile-summary .profile-avatar{width:118px;height:118px;border:0;border-radius:0;clip-path:none;object-fit:cover;filter:saturate(.9) contrast(1.06)}
.profile-summary .profile-title h2{font:clamp(38px,4.5vw,70px)/.9 'Archivo Black';letter-spacing:-.045em;margin:12px 0 9px;text-transform:none;overflow-wrap:anywhere}
.profile-summary .profile-title p{font:italic 15px 'Cormorant Garamond';color:#c7c5bb;margin:0}
.profile-summary .section-index{font-size:10px;font-weight:700;color:#aaa79f}
.profile-soloq-summary{min-width:0;min-height:132px;display:flex;gap:2px;padding:10px 18px 10px 12px;border-left:1px solid #ffffff24;border-right:1px solid #ffffff24;background:linear-gradient(90deg,transparent,#ffffff06,transparent)}
.profile-summary-emblem{width:110px;height:100px;margin:0 10px 0 0;object-fit:contain;flex:none}
.profile-soloq-summary small{font-size:9px;font-weight:700;letter-spacing:.15em;color:#aaa79f}
.profile-soloq-summary strong{font:28px/1 'Archivo Black';margin-top:8px;color:#f3f1e9;white-space:nowrap}
.profile-soloq-summary em{font:19px 'Archivo Black';color:var(--acid);margin-top:5px}
.profile-summary .profile-rating{border:0;border-left:1px solid #ffffff2e;padding-left:26px;min-width:0;text-align:right;background:none;align-self:center}
.profile-summary .profile-rating strong{font:76px/.88 'Archivo Black';color:#fff7a5}
.profile-summary .profile-rating span{font-size:10px;letter-spacing:.13em;color:#aaa79f;margin-bottom:8px}
.profile-summary .profile-rating small{font-size:10px;color:#bdbbb1;letter-spacing:0;margin-top:14px;line-height:1.6}
.sync-panel.manga-edit-panel{position:relative;isolation:isolate;padding:34px 42px;margin:0 0 50px;border:0;border-top:1px solid #ffffff26;background:linear-gradient(145deg,#171716,#0c0c0b);box-shadow:none;overflow:visible}
.sync-panel::after{content:'同期';position:absolute;right:0;top:-20px;font-family:serif;font-weight:900;font-size:180px;color:#ffffff07;pointer-events:none;z-index:-1}
.edit-title{display:flex;gap:14px;align-items:center;margin-bottom:24px;padding-bottom:18px;border-bottom:1px solid #ffffff26}
.edit-title>span{font:33px 'Archivo Black';color:var(--acid)}.edit-title h2{font:20px/1.2 'Archivo Black';letter-spacing:0}.edit-title small{display:block;font-size:9px;margin-top:4px;color:#96948b;letter-spacing:.13em}
.sync-panel .sync-form{display:grid;grid-template-columns:minmax(250px,.72fr) minmax(420px,1fr);gap:24px 34px;align-items:end}
.sync-panel .field{gap:10px}.sync-panel .field>span{font:700 10px 'IBM Plex Mono';color:#888;letter-spacing:.1em;text-transform:uppercase}
.sync-panel .field input{height:58px;min-height:58px;margin:0;padding:15px 14px;background:#090909;border:1px solid #ffffff29;font:16px 'Archivo Black';color:var(--paper)}
.position-slots{padding:0;gap:22px}.position-slot{display:grid;grid-template-columns:52px 1fr 28px;height:76px;padding:9px 13px;gap:12px;text-align:left;background:linear-gradient(120deg,#ffffff09,#ffffff03);border:1px solid #ffffff29}
.position-slot .role-icon{width:52px;height:52px;display:grid;place-items:center;border:1px solid #f1df4557;background:#0a0a08}
.position-slot img{width:35px;height:35px;filter:brightness(1.6)}.role-copy{display:flex;flex-direction:column;gap:2px}.role-copy>span{font:700 7px 'IBM Plex Mono';letter-spacing:.13em;color:#858278}
.position-slot .role-copy small{font:18px/1 'Archivo Black';color:#f5f2e8}.position-slot>i{font:20px 'Archivo Black';color:var(--acid);text-align:center}
.position-picker{position:relative}.position-feedback:empty{display:none}.position-menu{position:absolute;bottom:calc(100% + 10px);left:0;width:min(100%,390px);margin:0;background:#060606f7;border-color:#f1df456b;z-index:20}
.position-choice{height:64px}.position-choice img{width:29px;height:29px;filter:brightness(1.34)}
.sync-panel .sync-form>.button{grid-column:1/-1;justify-self:start;display:flex;justify-content:space-between;gap:30px;min-width:290px;width:auto;margin:0;min-height:52px;border:1px solid #fff39d;border-radius:15px;padding:16px 22px;background:var(--acid);color:#090909;font:700 12px 'IBM Plex Mono';box-shadow:0 12px 32px #f1df452e,5px 5px 0 #ffffff14}
.ranking-board{margin-top:34px}.ranking-board-title h2{font-size:22px}.ranking-board-title{padding:15px 4px 14px}.ranking-board-title h2{padding:0}.ranking-board-title p{font-size:10px}
.ranking-board .ranking-row{grid-template-columns:58px minmax(210px,1.35fr) minmax(195px,1.15fr) minmax(160px,.9fr) 110px 70px 100px;gap:18px;min-width:1100px;min-height:94px;padding:10px 12px;position:relative}
.ranking-board .ranking-header{min-height:52px;background:#0b0b0b}.ranking-board .ranking-row:not(.ranking-header):hover{background:#f1df4509;box-shadow:inset 4px 0 #f1df45;transform:none}
.ranking-board .ranking-avatar{width:54px;height:54px;flex-basis:54px;border-radius:8px;clip-path:polygon(4% 0,100% 5%,96% 100%,0 93%);filter:saturate(.9) contrast(1.06)}
.ranking-board .ranking-player b{font-size:20px}.ranking-board .ranking-player small{font-size:11px}.ranking-board .ranking-index{font-size:22px;color:#77756e}.ranking-board .ranking-rating{font-size:20px}
.ranking-board .ranking-solo{gap:10px}.ranking-board .ranking-solo img{width:50px;height:50px;flex-basis:50px;object-fit:contain}.ranking-board .ranking-solo b{font:13px/1 'Archivo Black'}
.ranking-roles{gap:7px}.ranking-roles img{width:30px;height:30px;filter:brightness(1.9) contrast(1.15)}.ranking-roles>span{font:700 10px 'IBM Plex Mono';color:#c6c4b9}
.ranking-record b{font:700 13px 'IBM Plex Mono'}.ranking-record small{font-size:8px}
.v21-rank-crop{position:relative;display:inline-grid!important;place-items:center;overflow:hidden!important;flex:none;isolation:isolate}
.v21-rank-crop>img{position:absolute;left:50%;top:50%;display:block;width:165%!important;height:165%!important;max-width:none;object-fit:contain;transform:translate(-50%,-50%) scale(1.08);filter:drop-shadow(0 10px 16px #0009) saturate(.92) contrast(1.05)}
.profile-soloq-summary .profile-summary-emblem{width:142px;height:118px;margin-left:-18px;margin-right:-8px}
.profile-summary-emblem>img{width:168%!important;height:168%!important;transform:translate(-50%,-50%) scale(1.12)}
.ranking-board .ranking-solo .table-emblem-crop{width:82px;height:70px;margin-left:-15px;margin-right:-2px}
.ranking-board .ranking-solo{gap:2px}
/* Actual cover camera, separate depth planes and atmospheric particles. */
body:has(.home-dashboard) .cg-ambient::before,body:has(.home-dashboard) .cg-ambient::after{display:none}
.page-shell:has(.home-dashboard){padding-top:0}.home-dashboard{position:relative;isolation:isolate;overflow:hidden;min-height:100svh;padding:126px 5vw 0;grid-template-rows:auto 1fr auto;background:#080808}
.home-dashboard .poster-city{position:absolute;inset:0 0 130px;z-index:-2;perspective:1250px}
.poster-city .city-image{position:absolute;inset:0;width:100%;height:100%;max-width:none}
.home-dashboard::before{inset:106px 2.5vw 166px;border-radius:28px;z-index:-1;background:linear-gradient(90deg,transparent 33.25%,#ffffff0b 33.33%,transparent 33.42%,transparent 66.58%,#ffffff0b 66.66%,transparent 66.75%)}
.home-dashboard .cg-home-core{grid-template-columns:minmax(0,1.18fr) minmax(390px,.82fr);gap:4vw;padding:35px 0 65px;align-items:center}
.home-dashboard .v21-hero-logo{width:min(760px,62vw);max-width:100%;margin:-12px 0 4px}.home-dashboard .v21-tagline{font:700 15px/1.5 'IBM Plex Mono';letter-spacing:-.035em;margin-top:20px}
.v21-hero-sub{font:11px/1.75 'IBM Plex Mono';max-width:690px;margin-top:14px;color:#c5c4bc}.v21-rules-link{display:none}
.home-dashboard .cg-home-panel{max-width:540px;border-radius:22px;transform:none;background:linear-gradient(145deg,#0c0c0cf0,#181816e0);transition:transform .35s,border-color .25s,box-shadow .25s}
.home-dashboard .cg-home-panel:hover{transform:translateY(-3px);border-color:#f1df4552;box-shadow:0 34px 100px #0009,0 0 34px #f1df4512,inset 0 1px #ffffff17}
.home-dashboard .button-launch{justify-content:center}
.home-dashboard .custom-journey{position:relative;z-index:2;min-height:130px}
.home-dashboard .live-colony{background:transparent;border:0;border-top:1px solid #ffffff24;box-shadow:none;padding:20px 0 0}
.home-dashboard #colony-roster:empty,.home-dashboard #colony-feedback:empty{display:none}
.home-dashboard #colony-join-form{justify-content:flex-start;margin-top:14px}
.home-dashboard #colony-join-form .button{width:auto;min-width:210px}
.v21-home-strip{grid-row:3;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;margin:0 -5vw;padding:25px 5vw 50px;background:#0a0a0a;border-top:1px solid #ffffff1a}
.v21-home-strip>div{padding:24px;border-top:1px solid #ffffff1c;background:linear-gradient(180deg,#ffffff09,transparent)}
.v21-home-strip>div>span{color:var(--acid);font-size:8px}.v21-home-strip strong{display:block;font:14px 'Archivo Black';margin:15px 0 6px;color:#f2f1ea}.v21-home-strip small{color:#92928d;font:10px/1.5 'IBM Plex Mono'}
.page-shell>.custom-journey{width:90%;margin:24px auto}
@media(max-width:800px){.v21-home-strip{grid-template-columns:1fr;margin:0 -20px;padding:10px 20px 70px}.v21-home-strip>div{padding:24px 0}.home-dashboard .poster-city{bottom:390px}}
.manga-particles{position:fixed;inset:0;width:100%;height:100%;z-index:55;pointer-events:none;opacity:.58;mix-blend-mode:screen}
#kogane-system{z-index:60;left:22px;right:auto;max-width:calc(100vw - 44px)}
@media(max-width:1200px){.nav-shell{grid-template-columns:155px 1fr 145px;padding-inline:22px}.brand-logo-image{width:155px}.desktop-nav{gap:20px}.desktop-nav a{font-size:10px}.profile-summary{grid-template-columns:1fr 1fr;gap:24px}.profile-summary .profile-rating{grid-row:auto;grid-column:1/-1;text-align:left;border-left:0;border-top:1px solid #ffffff24;padding:24px 0 0}.sync-panel .sync-form{grid-template-columns:1fr}.home-dashboard .cg-home-core{grid-template-columns:1fr 1fr;gap:3vw}}
@media(max-width:900px){.nav-shell{grid-template-columns:130px 1fr}.brand-logo-image{width:130px}.nav-account{display:none}.desktop-nav{gap:17px}.home-dashboard .cg-home-core{grid-template-columns:1fr;gap:32px}.home-dashboard .cg-home-panel{grid-column:1;justify-self:start;max-width:620px}.home-dashboard .v21-hero-logo{width:min(760px,90vw)}.home-dashboard .poster-city{inset:0}.manga-head .page-note-wrap{width:min(650px,85%)}.manga-head>p{position:static;margin-top:24px}.manga-head{padding-bottom:32px!important}}
@media(max-width:900px){.kogane-hero.manga-head .kogane-balance{position:static;width:100%;min-width:0;margin-top:24px}.kogane-hero.manga-head{display:grid}.rules-hero.manga-head>p{position:static}}
@media(max-width:800px){.nav-shell{height:72px;min-height:72px;grid-template-columns:1fr;padding:0 15px}.nav-shell .brand{display:none}.desktop-nav{display:flex;gap:16px;justify-content:center;max-width:100%;width:100%;overflow:auto}.desktop-nav a{font-size:9px;padding:25px 0}.desktop-nav a::before{display:none}.page-shell:not(:has(.home-dashboard)){padding:110px 18px 70px}.manga-head .page-note-wrap{width:100%;height:164px;margin-top:10px}.page-note{padding:36px 28px 24px}.page-note strong{font-size:clamp(43px,14vw,74px)}.page-note-index{left:29px}.page-note-kana{font-size:12px}.manga-head>p{position:static!important;margin-top:26px!important;font-size:12px!important}.profile-summary{grid-template-columns:1fr}.profile-summary .profile-title h2{font-size:40px}.profile-summary .profile-avatar{width:92px;height:92px}.profile-soloq-summary{grid-row:auto;border-inline:0;border-block:1px solid #ffffff24;padding:12px 0;min-height:100px}.profile-summary .profile-rating{grid-column:auto}.sync-panel.manga-edit-panel{padding:24px}.position-slots{gap:10px}.position-slot{grid-template-columns:40px 1fr 20px;padding:8px;gap:8px}.position-slot .role-icon{width:40px;height:44px}.position-slot img{width:30px;height:30px}.position-slot .role-copy small{font-size:15px}.home-dashboard{padding:102px 20px 0}.home-dashboard .cg-home-core{padding-bottom:42px}.home-dashboard .v21-hero-logo{width:100%;max-width:560px;margin:0}.home-dashboard .v21-tagline{font-size:15px}.v21-hero-sub{font-size:11px}.home-dashboard #colony-join-form .button{width:100%;min-width:0}.manga-particles{opacity:.34}#kogane-system{left:12px;bottom:78px}.edit-title h2{font-size:18px}}
@media(max-width:520px){.position-slots{grid-template-columns:1fr}.sync-panel .sync-form>.button{width:100%;min-width:0}.desktop-nav{gap:12px}.desktop-nav a{font-size:8px}.page-note[data-title=PATCHNOTES] strong{font-size:clamp(28px,9.5vw,48px)}.edit-title{gap:10px}.edit-title h2{font-size:15px}.edit-title small{font-size:8px}}
@media(prefers-reduced-motion:reduce){.page-note,.manga-speed-lines,.manga-shards i,.manga-flash,.poster-city .city-image,.poster-city .city-light{animation:none!important}.poster-city .city-camera,.poster-city .city-depth{transform:none!important}}

/* Navigation and reference role palette. */
.nav-shell{grid-template-columns:170px minmax(0,1fr) auto;gap:18px;padding-inline:26px}
.brand-logo-image{width:170px}.desktop-nav{gap:20px}.desktop-nav a{font-size:10px;letter-spacing:.04em}
.nav-account{display:flex;gap:9px;align-items:center}.nav-account a[aria-current=page],.nav-account a.is-current{color:var(--acid);border-color:#f1df4570}
.ranking-board .ranking-row:not(.ranking-header):hover{transform:none}
.position-picker .position-menu{width:470px;max-width:100%;padding:9px;gap:6px;border:1px solid #8b8228;background:#0b0b0b;overflow:visible;max-height:none;bottom:calc(100% + 12px);transition:opacity .16s,visibility .16s;transform:none}
.position-picker.is-open .position-menu{padding:9px;max-height:none;margin:0;overflow:visible}
.position-menu::after{content:'';position:absolute;width:13px;height:13px;bottom:-8px;left:var(--role-arrow,38px);background:#0b0b0b;border-right:1px solid #8b8228;border-bottom:1px solid #8b8228;transform:rotate(45deg)}
.position-picker .position-choice{height:80px;justify-content:center;gap:7px;border:1px solid #ffffff24;background:#111110;font:700 9px 'IBM Plex Mono';color:#a5a398;opacity:1}
.position-picker .position-choice img{width:36px;height:36px;filter:brightness(1.6)}
.position-picker .position-choice[aria-pressed=true]{border-color:#f1df45;background:linear-gradient(145deg,#f1df4525,#131208);color:#fff7a6}
.position-picker .position-choice[data-unavailable=true]{border-color:#279bb2;background:linear-gradient(145deg,#07566440,#081719);color:#8cdae7;opacity:1}
.position-picker .position-choice:hover{border-color:#f1df45;background:#f1df4515}
.position-picker .position-slot.is-active{border-color:#a69824;background:linear-gradient(120deg,#f1df4514,#ffffff03)}
@media(max-width:1200px){.nav-shell{grid-template-columns:125px minmax(0,1fr) auto;padding-inline:16px;gap:12px}.brand-logo-image{width:125px}.desktop-nav{gap:12px}.desktop-nav a{font-size:9px}.desktop-nav a::before{display:none}.nav-account a{padding:10px 8px;font-size:9px}}
@media(max-width:900px){.nav-shell{grid-template-columns:minmax(0,1fr) auto}.nav-shell .brand{display:none}.desktop-nav{justify-self:start;justify-content:flex-start;overflow-x:auto;max-width:100%}.nav-account{display:flex}}
@media(max-width:520px){.nav-shell{padding-inline:12px;gap:10px}.desktop-nav{gap:16px}.nav-account .logout-link{display:none}.position-picker .position-choice{height:67px;font-size:8px}.position-picker .position-choice img{width:29px;height:29px}.position-menu::after{left:30px}}

.position-picker .position-slot.is-active img{filter:brightness(1.6)}
.position-picker .position-choice[aria-pressed=true]::after{display:none}