:root{
  --bg:#05090d;
  --bg2:#091018;
  --panel:#0b1219;
  --panel2:#0f1821;
  --panel3:#111d27;
  --line:#22313e;
  --line-soft:#17232d;
  --text:#edf3f7;
  --muted:#8b9aa7;
  --muted2:#647481;
  --blue:#4aa8f2;
  --blue2:#88ccff;
  --blue-dim:#173b57;
  --red:#d9454d;
  --red-dark:#511a20;
  --green:#46d0a5;
  --gold:#d2b078;
  --shadow:0 18px 54px rgba(0,0,0,.38);
  --sidebar:228px;
  --topbar:68px;
  --radius:3px;
}
*{box-sizing:border-box}
html{background:var(--bg);scrollbar-color:#253544 #070c11}
body{margin:0;min-height:100vh;background:radial-gradient(circle at 70% -10%,rgba(39,83,117,.18),transparent 38%),var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif}
button,input{font:inherit}
button{color:inherit}
img{display:block;max-width:100%}
::selection{background:rgba(74,168,242,.28)}

.shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr);grid-template-rows:var(--topbar) minmax(0,1fr);background:linear-gradient(180deg,rgba(4,9,13,.97),rgba(3,7,10,.99))}
.topbar{grid-column:1/-1;display:grid;grid-template-columns:var(--sidebar) minmax(0,1fr) auto;align-items:center;height:var(--topbar);border-bottom:1px solid var(--line);background:rgba(5,10,14,.94);backdrop-filter:blur(15px);position:sticky;top:0;z-index:50}
.brand{height:100%;display:flex;flex-direction:column;justify-content:center;padding:0 23px;border-right:1px solid var(--line)}
.brand-main{font-family:"Barlow Condensed",sans-serif;font-size:29px;font-weight:700;line-height:.85;letter-spacing:.055em;text-transform:uppercase}
.brand-main span{color:#9a222a}
.brand-sub{font-size:7px;letter-spacing:.47em;color:#a4afb7;margin-top:8px}
.topbar-center{padding-left:26px;display:flex;align-items:center;gap:28px;min-width:0}
.topbar-motto{font-family:"Libre Baskerville",serif;font-size:9px;letter-spacing:.28em;color:#768793;text-transform:uppercase;white-space:nowrap}
.topbar-location{margin-left:auto;border-left:1px solid var(--line-soft);padding-left:24px;display:none}
.topbar-location strong{display:block;font:600 10px "Barlow Condensed";letter-spacing:.18em}.topbar-location small{font-size:8px;color:var(--muted2);letter-spacing:.12em}
.topbar-actions{height:100%;display:flex;align-items:center;gap:4px;padding:0 18px}
.icon-btn{border:0;background:transparent;color:#92a0ab;width:40px;height:40px;display:grid;place-items:center;cursor:pointer;border-radius:2px;font-size:17px;position:relative}
.icon-btn:hover{color:#fff;background:rgba(255,255,255,.04)}
.notify-dot{position:absolute;right:6px;top:5px;min-width:16px;height:16px;padding:0 4px;border-radius:9px;background:var(--red);color:#fff;font-size:9px;display:grid;place-items:center;font-weight:700}
.mini-player{height:46px;display:grid;grid-template-columns:38px 118px;gap:10px;align-items:center;margin-left:7px;padding-left:15px;border-left:1px solid var(--line)}
.mini-avatar{width:38px;height:38px;object-fit:cover;border:1px solid #385064}
.mini-name{font:600 13px "Barlow Condensed";letter-spacing:.06em}.mini-level{font-size:8px;color:var(--muted);letter-spacing:.12em;margin-top:2px}.xp-line{height:3px;margin-top:7px;background:#26323c;overflow:hidden}.xp-line>span{display:block;height:100%;width:62%;background:linear-gradient(90deg,#2d7fc0,var(--blue))}

.sidebar{grid-column:1;grid-row:2;background:linear-gradient(180deg,rgba(7,13,18,.98),rgba(4,9,13,.99));border-right:1px solid var(--line);position:sticky;top:var(--topbar);height:calc(100vh - var(--topbar));display:flex;flex-direction:column;z-index:30}
.nav{padding:16px 0}.nav-btn{width:100%;height:65px;border:0;border-left:3px solid transparent;background:transparent;color:#8d9aa5;display:flex;align-items:center;gap:15px;padding:0 22px;cursor:pointer;text-align:left;transition:.16s ease}
.nav-btn:hover{color:#dfe9ef;background:rgba(255,255,255,.025)}
.nav-btn.active{color:#fff;border-left-color:var(--blue);background:linear-gradient(90deg,rgba(24,92,139,.43),rgba(9,28,42,.32));box-shadow:inset 0 1px rgba(96,184,250,.08),inset 0 -1px rgba(96,184,250,.05)}
.nav-btn.story-active{border-left-color:var(--red);background:linear-gradient(90deg,rgba(110,29,34,.48),rgba(28,12,15,.2))}
.nav-icon{width:24px;height:24px;display:grid;place-items:center;color:#a8b4bd;font-size:20px;opacity:.95}.nav-label{font:500 15px "Libre Baskerville",serif}
.sidebar-footer{margin-top:auto;padding:24px 22px 30px;border-top:1px solid var(--line-soft);min-height:185px;background:radial-gradient(circle at 10% 100%,rgba(62,101,128,.16),transparent 58%)}
.sidebar-footer strong{display:block;font:500 9px "Libre Baskerville",serif;letter-spacing:.24em;color:#718490;line-height:1.8;text-transform:uppercase}.sidebar-footer small{display:block;margin-top:24px;font-size:6px;letter-spacing:.35em;color:#53636f;line-height:1.8;text-transform:uppercase}

.main{grid-column:2;grid-row:2;min-width:0;padding:18px 20px 26px;overflow:hidden}
.page-grid{width:min(100%,1480px);margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) 304px;gap:18px;align-items:start}
.content-col{min-width:0;display:flex;flex-direction:column;gap:14px}
.right-col{display:flex;flex-direction:column;gap:12px;min-width:0}
.card{background:linear-gradient(180deg,rgba(12,20,27,.97),rgba(7,13,18,.97));border:1px solid var(--line);box-shadow:var(--shadow);border-radius:var(--radius);overflow:hidden}
.card.flat{box-shadow:none}.card-pad{padding:16px}.section-label{font:600 10px "Barlow Condensed";letter-spacing:.28em;text-transform:uppercase;color:#aab8c2}.section-label.blue{color:#83c9fb}.section-label.red{color:#ef6870}

/* OVERVIEW */
.hero{position:relative;min-height:330px;display:flex;align-items:flex-end;border:1px solid #263845;overflow:hidden;background:#0b1117}
.hero-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 48%;filter:saturate(.85) contrast(1.06)}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,9,13,.96) 0%,rgba(4,9,13,.74) 22%,rgba(4,9,13,.18) 56%,rgba(4,9,13,.2) 100%),linear-gradient(0deg,rgba(4,9,13,.86),transparent 45%)}
.hero-copy{position:relative;z-index:2;padding:30px 30px 28px;max-width:525px}.hero-copy h1{margin:6px 0 8px;font:700 clamp(48px,5.4vw,78px)/.9 "Barlow Condensed";letter-spacing:.03em;text-transform:uppercase;text-shadow:0 5px 24px rgba(0,0,0,.45)}.hero-copy p{max-width:390px;margin:0;color:#c5cfd6;font:400 14px/1.55 "Libre Baskerville",serif}
.mission-card{display:grid;grid-template-columns:150px minmax(0,1fr) 245px;min-height:148px}.mission-art{width:100%;height:100%;object-fit:cover;filter:saturate(.7) brightness(.85)}.mission-info{padding:20px 20px;border-right:1px solid var(--line)}.mission-info h2{margin:4px 0 8px;font:600 28px/1 "Barlow Condensed";letter-spacing:.04em;text-transform:uppercase}.mission-info p{margin:0;color:#9eabb4;font:400 12px/1.65 "Libre Baskerville",serif}.mission-action{padding:20px;display:flex;flex-direction:column;justify-content:center;gap:10px}.objective{display:flex;gap:12px;align-items:center;color:#c8d2d9;font:500 12px "Libre Baskerville",serif}.objective-ico{font-size:25px;color:#a9bac6}
.primary-btn,.choice-btn{border:1px solid #3e7fab;background:linear-gradient(180deg,#246ea5,#164b73);box-shadow:inset 0 1px rgba(255,255,255,.12),0 0 20px rgba(61,155,225,.14);padding:13px 16px;cursor:pointer;color:#fff;font:600 11px "Barlow Condensed";letter-spacing:.16em;text-transform:uppercase;transition:.15s ease}.primary-btn:hover{filter:brightness(1.12)}
.row-title{display:flex;align-items:center;gap:14px;margin-top:1px}.row-title::after{content:"";height:1px;flex:1;background:var(--line)}.row-title small{font-size:8px;color:#627581;letter-spacing:.2em;text-transform:uppercase}
.area-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.area-card{border:1px solid #2b3c49;background:#081017;overflow:hidden;cursor:pointer;transition:.16s ease}.area-card:hover{border-color:#46677e;transform:translateY(-2px);box-shadow:0 12px 34px rgba(0,0,0,.32)}.area-image{aspect-ratio:2.25/1;overflow:hidden;background:#0a1117}.area-image img{width:100%;height:100%;object-fit:cover;filter:saturate(.78)}.area-body{padding:12px 13px 13px;display:flex;align-items:center;gap:12px}.area-body>div{min-width:0}.area-name{font:600 19px "Libre Baskerville",serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.area-sub{font-size:7px;color:#72828f;text-transform:uppercase;letter-spacing:.16em;margin-top:6px}.area-arrow{margin-left:auto;width:34px;height:34px;border:1px solid #304552;display:grid;place-items:center;color:#b7c8d3}
.status-panel{padding:0}.profile-head{padding:13px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:9px}.rank-star{width:28px;height:28px;display:grid;place-items:center;background:linear-gradient(#356a97,#17334a);border:1px solid #4e7696;color:#fff}.profile-head-text{min-width:0;flex:1}.profile-head-text strong{font:600 17px "Barlow Condensed";letter-spacing:.04em}.profile-head-text small{display:block;color:#8b9aa6;font-size:8px;letter-spacing:.15em}.profile-head .level{font:500 11px "Libre Baskerville",serif;color:#c7d1d8}.profile-photo{position:relative;aspect-ratio:1.15/1;background:#0b1116;overflow:hidden;border-bottom:1px solid var(--line)}.profile-photo img{width:100%;height:100%;object-fit:cover;object-position:center 35%;filter:saturate(.82) contrast(1.05)}.profile-photo::after{content:"SAME PEOPLE.\A DIFFERENT NIGHT.";white-space:pre;position:absolute;right:12px;top:18px;color:rgba(220,228,233,.66);font:500 8px/1.6 "Libre Baskerville",serif;letter-spacing:.23em;text-transform:uppercase;text-align:right}.status-list{padding:10px 16px 13px;display:flex;flex-direction:column;gap:10px}.stat-row{display:grid;grid-template-columns:22px 1fr auto;grid-template-rows:auto 5px;column-gap:8px;align-items:center}.stat-row .ico{grid-row:1/3;font-size:17px;color:#d4dde3}.stat-label{font:600 9px "Barlow Condensed";letter-spacing:.12em;color:#9fadb7}.stat-value{font:500 12px "Libre Baskerville",serif}.bar{grid-column:2/3;height:5px;background:#17232c;border:1px solid #31414d;overflow:hidden}.bar span{display:block;height:100%;background:linear-gradient(90deg,#2d8dd1,#60bdf5)}.bar.green span{background:linear-gradient(90deg,#1d9574,#52e3b4)}.bar.red span{background:linear-gradient(90deg,#a42b34,#e44c56)}
.quick-panel{padding:14px 14px 16px}.quick-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:10px}.quick-btn{border:1px solid #293a47;background:#0c151c;padding:10px 4px;display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;color:#b8c5ce}.quick-btn:hover{border-color:#42627a;color:#fff}.quick-btn span{font-size:21px}.quick-btn small{font:600 7px "Barlow Condensed";letter-spacing:.07em;text-transform:uppercase}
.quote-panel{padding:17px;text-align:center;color:#788a96;font:500 8px/1.65 "Libre Baskerville",serif;letter-spacing:.17em;text-transform:uppercase}

/* STORY */
.page-title{display:flex;align-items:end;justify-content:space-between;padding:7px 6px 0}.page-title h1{margin:4px 0 0;font:600 clamp(42px,5vw,68px)/.9 "Libre Baskerville",serif;letter-spacing:-.035em}.umbrella-mark{font:600 10px "Libre Baskerville",serif;letter-spacing:.18em;color:#d8dce0;text-transform:uppercase;text-align:right}.umbrella-mark span{display:block;color:#7d8b95;font-size:7px;margin-top:6px;letter-spacing:.22em}.story-hero{position:relative;min-height:288px;border:1px solid var(--line);overflow:hidden}.story-hero img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover;object-position:center;filter:saturate(.87) contrast(1.03)}.story-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(4,8,12,.92),transparent 58%)}.story-title{position:absolute;left:20px;bottom:18px;z-index:2}.story-title h2{margin:5px 0 0;font:700 50px/1 "Libre Baskerville",serif;letter-spacing:-.025em}.briefing{padding:14px 18px 17px}.briefing h3{font:700 17px/1.3 "Libre Baskerville",serif;margin:5px 0 7px}.briefing p{margin:0;color:#a3afb7;font:400 12px/1.65 "Libre Baskerville",serif}.objectives{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:15px}.objective-card{border:1px solid #263844;background:rgba(8,15,20,.85);padding:12px;display:grid;grid-template-columns:26px 1fr;gap:9px}.objective-card b{font:700 13px "Libre Baskerville",serif}.objective-card p{font-size:10px;line-height:1.5;margin:4px 0 0}.obj-number{width:24px;height:24px;border:1px solid #526471;border-radius:50%;display:grid;place-items:center;font-size:10px;color:#c5d0d7}.choices{display:grid;grid-template-columns:1fr 1fr;gap:12px}.choice-btn{min-height:72px;font:700 20px "Libre Baskerville",serif;letter-spacing:.02em}.choice-btn span{display:block;font:500 8px "Barlow Condensed";letter-spacing:.23em;margin-top:7px;color:#cbd6dd}.choice-btn.red{border-color:#a33339;background:linear-gradient(180deg,#571a1e,#311014)}.choice-btn.red:hover{background:linear-gradient(180deg,#702126,#3a1115)}.choice-btn.blue{background:linear-gradient(180deg,#183d56,#102a3d)}
.contact-card{padding:12px}.contact-inner{border:1px solid var(--line);padding:10px;display:grid;grid-template-columns:112px 1fr;gap:12px}.contact-inner img{width:112px;height:183px;object-fit:cover;object-position:center top}.contact-copy strong{font:700 17px "Libre Baskerville",serif}.contact-copy small{display:block;margin-top:7px;color:#a8b5bd;font:500 9px/1.6 "Libre Baskerville",serif;letter-spacing:.06em}.contact-copy .corp{margin-top:17px;color:#e3e7e9;font:600 9px/1.4 "Barlow Condensed";letter-spacing:.12em}.contact-copy q{display:block;margin-top:18px;color:#9da9b1;font:italic 10px/1.6 "Libre Baskerville",serif}.rewards{padding:14px}.reward-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.reward{border:1px solid #273844;padding:11px;display:flex;gap:9px;align-items:center}.reward .big{font-size:24px;color:var(--gold)}.reward strong{font:700 14px "Libre Baskerville",serif}.reward small{display:block;color:#808f99;font-size:7px;letter-spacing:.09em;margin-top:3px}.access-reward{display:grid;grid-template-columns:95px 1fr;gap:12px;margin-top:10px;border-top:1px solid var(--line-soft);padding-top:13px}.access-reward img{width:90px;height:130px;object-fit:cover}.access-reward h4{font:700 15px "Libre Baskerville",serif;margin:8px 0}.access-reward p{font:400 10px/1.6 "Libre Baskerville",serif;color:#9ba7af;margin:0}

/* CHARACTER */
.character-layout{width:min(100%,1540px);margin:0 auto;display:grid;grid-template-columns:minmax(510px,.95fr) minmax(610px,1.12fr);gap:14px;align-items:stretch;min-height:calc(100vh - var(--topbar) - 44px)}
.character-stage{border:1px solid var(--line);background:radial-gradient(circle at 52% 20%,rgba(45,77,99,.22),transparent 40%),linear-gradient(180deg,#0a1218,#060b0f);overflow:hidden;min-height:780px;display:grid;grid-template-rows:auto minmax(0,1fr)}
.character-meta{position:relative;z-index:4;padding:18px 18px 14px;border-bottom:1px solid var(--line-soft);background:linear-gradient(90deg,rgba(9,17,23,.98),rgba(9,17,23,.83) 62%,rgba(9,17,23,.32));box-shadow:0 14px 35px rgba(0,0,0,.2)}
.character-meta h1{font:600 38px/1 "Libre Baskerville",serif;margin:5px 0 11px;letter-spacing:.01em}.character-ident{display:flex;align-items:end;justify-content:space-between;gap:18px}.character-meta h2{font:700 24px/1 "Libre Baskerville",serif;margin:0}.character-meta h3{font:500 12px "Libre Baskerville",serif;margin:6px 0 0;color:#d3d8dc}.character-meta p{margin:0 4px 1px 0;text-align:right;font:italic 10px/1.5 "Libre Baskerville",serif;color:#98a8b3;white-space:nowrap}
.character-showcase{min-height:0;display:grid;grid-template-columns:112px minmax(270px,1fr) 112px;gap:14px;padding:14px 16px 0;align-items:stretch;background:linear-gradient(90deg,rgba(6,12,16,.35),transparent 18%,transparent 82%,rgba(6,12,16,.35))}
.character-art{position:relative;min-width:0;overflow:hidden;display:flex;align-items:flex-end;justify-content:center;background:radial-gradient(circle at 50% 24%,rgba(78,111,132,.18),transparent 38%),#091017;border-left:1px solid rgba(48,70,84,.5);border-right:1px solid rgba(48,70,84,.5)}
.character-art::before{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(180deg,rgba(5,10,14,.06),transparent 18%,transparent 77%,rgba(5,10,14,.4)),linear-gradient(90deg,rgba(5,10,14,.36),transparent 14%,transparent 86%,rgba(5,10,14,.36))}
.character-img{height:100%;width:100%;object-fit:cover;object-position:center top;filter:saturate(.82) contrast(1.03);position:relative;z-index:1}
.character-floor{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:8px 10px;background:linear-gradient(180deg,transparent,rgba(4,9,13,.92));font:500 6px "Libre Baskerville",serif;letter-spacing:.1em;color:#657985;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.equip-col{position:relative;z-index:5;display:flex;flex-direction:column;justify-content:space-between;padding:4px 0 20px;min-width:0}.equip-slot{width:100%;background:transparent}.equip-img{height:92px;border:1px solid #314653;background:#0b1218;display:grid;place-items:center;overflow:hidden;box-shadow:inset 0 0 24px rgba(0,0,0,.28)}.equip-img img{width:100%;height:100%;object-fit:cover}.equip-slot.active .equip-img{border-color:#357db0;box-shadow:0 0 18px rgba(46,145,215,.13),inset 0 0 22px rgba(31,92,132,.18)}.equip-slot b{display:block;margin-top:5px;font:600 8px "Libre Baskerville",serif;letter-spacing:.02em}.equip-slot small{display:block;color:#7f8d97;font:400 7px/1.35 "Libre Baskerville",serif;margin-top:2px}
.progress-panel{border:1px solid var(--line);background:linear-gradient(180deg,rgba(10,18,24,.98),rgba(6,11,15,.98));min-width:0;overflow:hidden}.tabs{display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid var(--line)}.tab-btn{height:51px;border:0;border-right:1px solid var(--line-soft);background:transparent;color:#8d9ba5;cursor:pointer;font:600 10px "Libre Baskerville",serif;letter-spacing:.02em}.tab-btn.active{color:#fff;background:linear-gradient(180deg,rgba(24,75,109,.42),rgba(13,35,51,.36));box-shadow:inset 0 -2px var(--blue)}.progress-body{padding:16px}.level-row{display:grid;grid-template-columns:auto 1fr auto;gap:15px;align-items:center;padding-bottom:14px;border-bottom:1px solid var(--line)}.level-row strong{font:700 27px "Libre Baskerville",serif}.level-row span{font:500 14px "Libre Baskerville",serif}.level-bar{height:8px;background:#13202a;border:1px solid #2c3e4b}.level-bar i{display:block;width:62%;height:100%;background:linear-gradient(90deg,#2b7db9,#57b5ef)}.skill-head{display:flex;justify-content:space-between;align-items:center;padding:13px 0 8px}.skill-head h3{font:600 14px "Libre Baskerville",serif;margin:0}.skill-points{color:#f16a70;font:600 17px "Libre Baskerville",serif}.skill-list{display:flex;flex-direction:column;gap:6px}.skill-row{display:grid;grid-template-columns:42px minmax(120px,1fr) 32px minmax(112px,150px) 32px;align-items:center;border:1px solid #2a3e4c;background:#0a1218;min-height:56px;padding:5px 7px}.skill-ico{font-size:23px;color:#dce7ed}.skill-info b{font:700 13px "Libre Baskerville",serif}.skill-info small{display:block;color:#7e8e99;font-size:9px;margin-top:3px}.skill-num{font:700 18px "Libre Baskerville",serif;text-align:center}.segments{display:grid;grid-template-columns:repeat(12,1fr);gap:3px}.segments i{height:10px;background:#263541}.segments i.on{background:#4e9dd6}.skill-add{width:28px;height:28px;border:1px solid #355061;background:#0d1921;cursor:pointer;color:#b7c7d1;font-size:18px}.skill-add:hover{border-color:#5d94b8;color:#fff}.faction-prog{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}.faction-prog h3{font:600 13px "Libre Baskerville",serif;margin:0 0 10px}.rank-flow{display:grid;grid-template-columns:1fr 24px 1fr 24px 1fr;align-items:center}.rank-card{min-height:96px;border:1px solid #293d49;display:grid;place-items:center;text-align:center;padding:8px;background:#091117}.rank-card.active{border-color:#3d8ac1;background:linear-gradient(180deg,#0f3148,#0a1d2a);box-shadow:0 0 20px rgba(50,143,207,.11)}.rank-card .rank-symbol{font-size:26px}.rank-card b{display:block;font:700 11px "Libre Baskerville",serif;margin-top:5px}.rank-card small{font:400 8px/1.45 "Libre Baskerville",serif;color:#87959e}.rank-arrow{text-align:center;color:#55a8df}.inventory{margin-top:14px;border-top:1px solid var(--line);padding-top:12px}.inventory-head{display:flex;justify-content:space-between;align-items:center}.inventory-head h3{font:600 14px "Libre Baskerville",serif;margin:0}.inventory-head small{color:#82909a}.inv-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:6px;margin-top:10px}.inv-item{min-width:0;border:1px solid #293c48;background:#091117;padding:5px;text-align:center;position:relative;overflow:hidden}.inv-item img{width:100%;height:67px;object-fit:cover}.inv-item .count{position:absolute;right:6px;top:56px;font:600 11px "Libre Baskerville",serif;text-shadow:0 1px 2px #000}.inv-item b{display:block;font:500 7px/1.3 "Libre Baskerville",serif;color:#9aa8b1;margin-top:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

@media(max-width:1160px){:root{--sidebar:190px}.nav-btn{padding:0 16px}.nav-label{font-size:13px}.page-grid{grid-template-columns:1fr}.right-col{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.status-panel{grid-row:span 2}.mission-card{grid-template-columns:130px 1fr 220px}.character-layout{grid-template-columns:1fr}.character-stage{min-height:720px}.progress-panel{min-height:0}.character-showcase{grid-template-columns:108px minmax(260px,1fr) 108px}}
@media(max-width:820px){:root{--sidebar:68px;--topbar:62px}.brand{padding:0 10px}.brand-main{font-size:22px}.brand-sub,.topbar-motto,.mini-name,.mini-level,.xp-line{display:none}.topbar{grid-template-columns:var(--sidebar) 1fr auto}.topbar-center{padding-left:13px}.mini-player{grid-template-columns:36px;width:52px;padding-left:8px}.nav-btn{padding:0;justify-content:center}.nav-label{display:none}.sidebar-footer{display:none}.main{padding:12px}.page-grid{display:block}.right-col{display:grid;grid-template-columns:1fr;margin-top:12px}.hero{min-height:310px}.mission-card{grid-template-columns:100px 1fr}.mission-action{grid-column:1/-1;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr auto}.area-grid{grid-template-columns:1fr}.area-image{aspect-ratio:3/1}.page-title{align-items:flex-start;gap:10px}.page-title h1{font-size:38px}.umbrella-mark{display:none}.objectives{grid-template-columns:1fr}.choices{grid-template-columns:1fr}.contact-inner{grid-template-columns:90px 1fr}.contact-inner img{width:90px;height:145px}.character-stage{min-height:690px}.character-showcase{grid-template-columns:88px minmax(230px,1fr) 88px;gap:10px;padding-inline:10px}.equip-img{height:74px}.character-meta h1{font-size:31px}.character-meta p{display:none}.progress-body{padding:10px}.skill-row{grid-template-columns:36px 1fr 28px 92px 30px}.skill-info small{display:none}.inv-grid{grid-template-columns:repeat(3,1fr)}.generic-grid{grid-template-columns:1fr}.topbar-actions>.icon-btn:nth-child(-n+2){display:none}}
@media(max-width:560px){.hero-copy{padding:24px 19px}.hero-copy h1{font-size:46px}.hero-copy p{font-size:11px}.mission-card{grid-template-columns:1fr}.mission-art{height:110px}.mission-info{border-right:0}.mission-action{display:flex}.right-col{display:flex}.quick-grid{grid-template-columns:repeat(2,1fr)}.character-stage{min-height:620px}.equip-col{display:none}.character-showcase{grid-template-columns:1fr;padding:10px 10px 0}.character-meta p{display:none}.character-layout{display:block}.progress-panel{margin-top:12px}.tabs{grid-template-columns:repeat(2,1fr)}.skill-row{grid-template-columns:34px 1fr 30px 28px}.segments{display:none}.rank-flow{grid-template-columns:1fr}.rank-arrow{display:none}.rank-card{margin-bottom:6px}.inv-grid{grid-template-columns:repeat(2,1fr)}}
/* V3.2 inventory/equipment interaction */
.equip-slot{border:0;color:inherit;text-align:left;font:inherit;cursor:pointer;padding:0}.equip-slot.empty .equip-img{border-style:dashed;opacity:.58}.empty-slot{font:300 34px Inter,sans-serif;color:#55758a}.equip-slot:hover .equip-img{border-color:#5c8faf;box-shadow:0 0 14px rgba(71,155,210,.13)}
.gear-state{position:absolute;z-index:4;left:10px;right:10px;bottom:28px;display:flex;flex-wrap:wrap;gap:4px;justify-content:center;pointer-events:none}.gear-state span{font:600 6px Inter,sans-serif;letter-spacing:.06em;text-transform:uppercase;color:#a9bbc6;background:rgba(4,10,14,.76);border:1px solid rgba(67,96,113,.65);padding:4px 6px;backdrop-filter:blur(3px)}
.inv-item{cursor:pointer;color:inherit;font:inherit}.inv-item:hover{border-color:#4f809f;background:#0d1820}.inv-item.equipped{border-color:#337cad;box-shadow:inset 0 0 20px rgba(46,131,188,.12)}.inv-item small{display:block;margin-top:3px;color:#607582;font:500 6px Inter,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.equipped-tag{position:absolute;left:4px;top:4px;background:#154d70;border:1px solid #337fad;color:#d8f0ff;padding:2px 4px;font:700 5px Inter,sans-serif;letter-spacing:.08em}

/* V3.2.1 interaction layer hotfix */
.modal{
  position:fixed;
  inset:0;
  z-index:10000;
  display:grid;
  place-items:center;
  padding:24px;
  background:rgba(1,5,8,.78);
  backdrop-filter:blur(6px);
}
.modal[hidden]{display:none!important}
.modal-card{
  width:min(520px,calc(100vw - 32px));
  border:1px solid #355064;
  background:linear-gradient(180deg,rgba(12,24,32,.99),rgba(5,11,15,.99));
  box-shadow:0 26px 80px rgba(0,0,0,.62),inset 0 1px rgba(255,255,255,.035);
  padding:22px;
  color:#e9eef1;
}
.modal-card.red{border-color:#73343a;box-shadow:0 26px 80px rgba(0,0,0,.62),0 0 28px rgba(144,35,45,.11)}
.modal-card h2{margin:8px 0 9px;font:700 26px/1.1 "Libre Baskerville",serif;letter-spacing:.01em}
.modal-card p{margin:0;color:#93a4af;font:400 12px/1.7 Inter,sans-serif}
.modal-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:20px;padding-top:14px;border-top:1px solid var(--line)}
.modal-btn{min-width:108px;height:38px;border:1px solid #3e7699;background:linear-gradient(180deg,#173e58,#102c40);color:#edf7ff;cursor:pointer;font:700 10px Inter,sans-serif;letter-spacing:.12em}
.modal-btn:hover{filter:brightness(1.12)}
.modal-btn.ghost{border-color:#354754;background:#0a1218;color:#aebbc4}
.modal-btn.red{border-color:#9a4148;background:linear-gradient(180deg,#61252a,#3d171b)}

.toast{
  position:fixed;
  z-index:10050;
  right:22px;
  bottom:22px;
  max-width:min(430px,calc(100vw - 32px));
  transform:translateY(16px);
  opacity:0;
  pointer-events:none;
  border:1px solid #355b73;
  background:rgba(7,17,23,.97);
  box-shadow:0 16px 44px rgba(0,0,0,.5);
  color:#dce8ef;
  padding:11px 14px;
  font:600 10px/1.5 Inter,sans-serif;
  letter-spacing:.03em;
  transition:opacity .16s ease,transform .16s ease;
}
.toast.show{opacity:1;transform:translateY(0)}

.equip-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:14px}
.equip-pick{display:grid;grid-template-columns:68px 1fr;gap:10px;align-items:center;border:1px solid #2c4555;background:#091219;color:#e7edf1;padding:7px;text-align:left;cursor:pointer}
.equip-pick:hover{border-color:#4b8ab2;background:#0d1b24}
.equip-pick img{width:68px;height:58px;object-fit:cover;border:1px solid #233744;background:#03080b}
.equip-pick b{display:block;font:700 10px "Libre Baskerville",serif}
.equip-pick small{display:block;color:#738a98;font:500 7px Inter,sans-serif;margin-top:4px;text-transform:uppercase;letter-spacing:.06em}
.equip-empty-note{color:#748894;font:500 10px/1.6 Inter,sans-serif;padding:12px 0}

@media(max-width:560px){
  .modal{padding:12px}.modal-card{padding:17px}.modal-card h2{font-size:21px}.modal-actions{display:grid;grid-template-columns:1fr 1fr}.modal-btn{width:100%}.equip-picker{grid-template-columns:1fr}
}

/* V3.3 — Character & Visual Equipment Update */
.character-v33{width:min(100%,1540px);margin:0 auto;display:grid;grid-template-columns:205px minmax(510px,.95fr) minmax(620px,1.22fr);gap:12px;align-items:stretch;min-height:calc(100vh - var(--topbar) - 44px)}
.character-info-panel{border:1px solid var(--line);background:linear-gradient(180deg,#0a131a,#070d12);padding:18px 16px;min-width:0;box-shadow:var(--shadow)}
.character-info-panel h1{font:700 35px/1 "Libre Baskerville",serif;margin:6px 0 12px}.character-info-panel h2{font:700 24px/1 "Libre Baskerville",serif;margin:0}.char-rank{font:600 10px/1.5 "Libre Baskerville",serif;color:#b9c6ce;margin-top:6px}.char-quote{font:italic 10px/1.55 "Libre Baskerville",serif;color:#8ea0ac;margin:18px 0 22px}
.char-survival{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:7px 0}.mini-stat{display:grid;grid-template-columns:24px 1fr auto;gap:8px;align-items:center;min-height:38px;color:#90a1ac}.mini-stat span{font-size:15px;color:#7da8c3}.mini-stat b{font:600 9px Inter,sans-serif;letter-spacing:.08em}.mini-stat strong{font:600 11px Inter,sans-serif;color:#eef4f7}
.char-info-box{border:1px solid #263b49;background:#081017;margin-top:16px;padding:12px}.char-info-box dl{display:grid;grid-template-columns:1fr 1fr;gap:7px 10px;margin:12px 0 0}.char-info-box dt{font:600 7px Inter,sans-serif;color:#5f87a1;letter-spacing:.08em}.char-info-box dd{margin:0;font:500 8px Inter,sans-serif;color:#afbec7;text-align:right}
.v33-stage{min-height:780px;display:block}.v33-showcase{height:100%;min-height:780px;grid-template-columns:118px minmax(270px,1fr) 118px;padding:12px 12px 0}.v33-art{align-items:stretch;overflow:hidden;background:radial-gradient(circle at 48% 28%,rgba(74,107,130,.23),transparent 40%),#070d12}.character-renderer{position:relative;width:100%;height:100%;min-height:760px;display:flex;align-items:flex-end;justify-content:center;overflow:hidden}.base-character{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;filter:saturate(.86) contrast(1.04)}
.visual-layer{position:absolute;z-index:5;object-fit:contain;pointer-events:none;filter:drop-shadow(0 5px 10px rgba(0,0,0,.45)) saturate(.9)}
.layer-backpack{z-index:3;width:31%;right:10%;top:27%;opacity:.95}.layer-torso{z-index:7;width:44%;left:28%;top:28%;opacity:.96}.layer-melee{z-index:8;width:22%;left:14%;top:49%;transform:rotate(12deg)}.layer-weapon{z-index:9;width:26%;left:12%;top:48%;transform:rotate(-4deg)}.layer-head{z-index:10;width:31%;left:34%;top:9%;opacity:.96}.layer-accessory{z-index:11;width:13%;right:28%;top:31%}
.visual-hint{position:absolute;z-index:20;left:12px;bottom:12px;padding:5px 7px;border:1px solid #2e5268;background:rgba(4,12,17,.78);font:700 6px Inter,sans-serif;letter-spacing:.1em;color:#78b8df;pointer-events:none}
.v33-progress{min-height:780px}.v33-progress .progress-body{padding:14px}.v33-inventory{margin-top:12px}.inventory-head-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}.inventory-head-row>.inventory-head{min-width:130px}.inv-filters{display:flex;gap:3px;flex-wrap:wrap}.inv-filter{border:1px solid transparent;background:transparent;color:#64849a;height:27px;padding:0 9px;cursor:pointer;font:700 6px Inter,sans-serif;letter-spacing:.08em}.inv-filter:hover{color:#b9d4e5}.inv-filter.active{border-color:#3679a5;color:#d9f1ff;background:#0e3047}
.v33-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:7px}.v33-grid .inv-item{min-height:107px}.v33-grid .inv-item img{height:68px}.inv-item.selected{outline:1px solid #5eb8ef;outline-offset:-2px;background:#0c1a23;box-shadow:inset 0 0 24px rgba(46,139,201,.16)}
.inventory-actions{margin-top:9px;padding-top:9px;border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(150px,1fr) auto;gap:10px;align-items:center}.selected-copy{min-width:0}.selected-copy b{display:block;font:700 9px "Libre Baskerville",serif;color:#dbe6ec}.selected-copy small{display:block;margin-top:3px;color:#687e8c;font:500 7px/1.4 Inter,sans-serif;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.action-buttons{display:flex;gap:5px}.action-buttons button{height:31px;border:1px solid #314957;background:#091219;color:#9babb4;padding:0 11px;cursor:pointer;font:700 7px Inter,sans-serif;letter-spacing:.08em}.action-buttons button:hover{border-color:#527e99;color:#fff}.action-buttons button.primary{border-color:#4087b2;background:#0f3147;color:#e4f4ff}
@media(max-width:1400px){.character-v33{grid-template-columns:175px minmax(450px,.92fr) minmax(560px,1.15fr)}.character-info-panel h1{font-size:30px}.v33-showcase{grid-template-columns:100px minmax(240px,1fr) 100px}.equip-img{height:78px}.v33-grid{grid-template-columns:repeat(4,minmax(0,1fr))}}
@media(max-width:1180px){.character-v33{grid-template-columns:1fr 1fr}.character-info-panel{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px}.character-info-panel>.section-label,.character-info-panel>h1,.character-info-panel>h2,.character-info-panel>.char-rank,.character-info-panel>.char-quote{grid-column:1}.char-survival{grid-column:2;grid-row:1/7}.char-info-box{grid-column:3;grid-row:1/7;margin-top:0}.v33-stage,.v33-progress{min-height:710px}.v33-showcase,.character-renderer{min-height:690px}.inventory-actions{grid-template-columns:1fr}.action-buttons{flex-wrap:wrap}}
@media(max-width:900px){.character-v33{display:block}.character-info-panel{display:block;margin-bottom:12px}.v33-stage{min-height:680px}.v33-showcase{min-height:680px}.character-renderer{min-height:660px}.v33-progress{margin-top:12px}.v33-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:560px){.character-info-panel{padding:14px}.v33-stage{min-height:560px}.v33-showcase{grid-template-columns:1fr;min-height:560px}.v33-art{min-height:540px}.character-renderer{min-height:540px}.v33-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.inventory-head-row{display:block}.inv-filters{margin-top:8px}.action-buttons{display:grid;grid-template-columns:repeat(2,1fr)}.action-buttons button{width:100%}}


/* V3.4.7 — clean character page layout reset */

/* Main page: info / equipment+character / progression */
.character-v33{
  width:min(100%, 1650px);
  margin:0 auto;
  display:grid;
  grid-template-columns:210px minmax(720px,1.08fr) minmax(560px,.92fr);
  gap:16px;
  align-items:stretch;
  min-height:calc(100vh - var(--topbar) - 42px);
}

.character-info-panel{
  border:1px solid var(--line);
  background:linear-gradient(180deg,#0a131a,#070d12);
  padding:17px 15px;
  min-width:0;
  box-shadow:var(--shadow);
}
.character-info-panel h1{
  font:700 31px/1 "Libre Baskerville",serif;
  margin:6px 0 10px;
  white-space:nowrap;
}
.character-info-panel h2{font:700 23px/1 "Libre Baskerville",serif;margin:0}
.char-rank{font:600 9px/1.5 "Libre Baskerville",serif;color:#b9c6ce;margin-top:6px}
.char-quote{font:italic 10px/1.55 "Libre Baskerville",serif;color:#8ea0ac;margin:18px 0 22px}

/* Character/equipment stage */
.v33-stage{
  min-height:820px;
  border:0;
  background:transparent;
  box-shadow:none;
}
.v33-showcase{
  height:100%;
  min-height:820px;
  display:grid;
  grid-template-columns:105px minmax(500px,1fr) 105px;
  gap:14px;
  padding:0;
  align-items:stretch;
  background:transparent;
}
.equip-col{
  position:relative;
  z-index:5;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:6px 0 8px;
  min-width:0;
}
.equip-slot{
  width:100%;
  border:0;
  padding:0;
  background:transparent;
  color:inherit;
  text-align:left;
  cursor:pointer;
}
.equip-img{
  height:92px;
  border:1px solid #314653;
  background:#0b1218;
  display:grid;
  place-items:center;
  overflow:hidden;
  box-shadow:inset 0 0 24px rgba(0,0,0,.28);
}
.equip-img img{width:100%;height:100%;object-fit:cover}
.equip-slot.empty .equip-img{border-style:dashed;opacity:.58}
.equip-slot.active .equip-img{border-color:#357db0;box-shadow:0 0 18px rgba(46,145,215,.13),inset 0 0 22px rgba(31,92,132,.18)}
.empty-slot{font:300 32px Inter,sans-serif;color:#55758a}
.equip-slot b{
  display:block;
  margin-top:5px;
  font:600 8px "Libre Baskerville",serif;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.equip-slot small{
  display:block;
  color:#7f8d97;
  font:400 7px/1.3 "Libre Baskerville",serif;
  margin-top:2px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* Central preview: one coherent character box. */
.v33-art{
  position:relative;
  min-width:0;
  min-height:820px;
  overflow:hidden;
  display:flex;
  align-items:stretch;
  justify-content:center;
  background:#071018;
  border:1px solid rgba(48,70,84,.68);
  box-shadow:inset 0 0 0 1px rgba(9,22,30,.5);
}
.v33-art::before{display:none}
.character-renderer{
  position:relative;
  width:100%;
  height:100%;
  min-height:820px;
  overflow:hidden;
}
.server-rendered-character{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center bottom;
  filter:saturate(.88) contrast(1.05);
  animation:portraitSwap .18s ease-out both;
}
@keyframes portraitSwap{
  from{opacity:.48;filter:saturate(.7) contrast(1.02)}
  to{opacity:1;filter:saturate(.88) contrast(1.05)}
}
.character-renderer .visual-layer{display:none!important}
.visual-hint,.render-state-badge{display:none!important}

/* Progress/inventory stays intact but slightly tighter. */
.v33-progress{min-height:820px;min-width:0}
.v33-progress .tabs{min-height:45px}
.v33-progress .progress-body{padding:11px}
.v33-grid{grid-template-columns:repeat(4,minmax(90px,1fr));gap:7px}
.v33-grid .inv-item{min-width:0}

/* Responsive desktop tuning */
@media(max-width:1550px){
  .character-v33{
    grid-template-columns:195px minmax(660px,1.04fr) minmax(520px,.9fr);
  }
  .v33-showcase{
    grid-template-columns:98px minmax(455px,1fr) 98px;
  }
}
@media(max-width:1380px){
  .character-v33{
    grid-template-columns:185px minmax(590px,1fr) minmax(485px,.88fr);
  }
  .v33-showcase{
    grid-template-columns:92px minmax(405px,1fr) 92px;
    gap:12px;
  }
  .v33-grid{grid-template-columns:repeat(3,minmax(90px,1fr))}
}
@media(max-width:1180px){
  .character-v33{
    grid-template-columns:1fr 1fr;
  }
  .character-info-panel{
    grid-column:1/-1;
  }
  .v33-showcase{
    grid-template-columns:88px minmax(390px,1fr) 88px;
  }
  .v33-stage,.v33-progress{min-height:720px}
  .v33-art,.character-renderer{min-height:700px}
}
@media(max-width:900px){
  .character-v33{display:block}
  .character-info-panel{margin-bottom:12px}
  .v33-progress{margin-top:12px}
  .v33-showcase{grid-template-columns:76px minmax(320px,1fr) 76px}
}
@media(max-width:560px){
  .equip-col{display:none}
  .v33-showcase{grid-template-columns:1fr}
  .v33-art,.character-renderer{min-height:560px}
  .v33-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}