/* ==========================================================
   YAKUZA [SS] — V11 DESIGN SYSTEM
   Premium tactical / editorial UI. Loaded after react.css.
   ========================================================== */
:root{
  --bg:#07090c;
  --bg-elev:#0a0d11;
  --surface-1:#0d1116;
  --surface-2:#111720;
  --surface-3:#161d27;
  --surface-4:#1b2430;
  --ink:#f6f2ea;
  --ink-soft:#d9d5ce;
  --muted:#9299a3;
  --muted-2:#626b76;
  --gold:#d8a646;
  --gold-2:#f0c36a;
  --gold-dim:#8d692c;
  --red:#a23a3f;
  --green:#4eaa78;
  --blue:#6f93b8;
  --line:rgba(255,255,255,.085);
  --line-soft:rgba(255,255,255,.048);
  --line-gold:rgba(216,166,70,.32);
  --shadow:0 22px 70px rgba(0,0,0,.38);
  --shadow-soft:0 12px 30px rgba(0,0,0,.22);
  --head:'Barlow Condensed',sans-serif;
  --body:'Manrope','Inter',sans-serif;
  --max:1460px;
  --ease:cubic-bezier(.2,.75,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

html{background:var(--bg)}
body{
  background:
    radial-gradient(1100px 520px at 18% -12%,rgba(216,166,70,.075),transparent 60%),
    radial-gradient(900px 620px at 92% 8%,rgba(120,27,31,.055),transparent 62%),
    linear-gradient(180deg,#080a0d 0%,#07090c 58%,#06080a 100%);
  color:var(--ink);
  font-family:var(--body);
  font-size:14px;
  letter-spacing:-.006em;
}
body:before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-2;
  background-image:linear-gradient(rgba(255,255,255,.011) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.011) 1px,transparent 1px);
  background-size:76px 76px;
  mask-image:linear-gradient(to bottom,black,transparent 72%);
}
body:after{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.25;
  background:radial-gradient(circle at 50% 0,transparent 0 38%,rgba(0,0,0,.32) 100%);
}

/* base motion + accessibility */
button,a,.metric,.panel,.news-card,.event-card,.rank-card,.staff-card,.account-info-item,.table tbody tr,.tab,.input,.select,.textarea{
  transition:background-color .18s var(--ease),border-color .18s var(--ease),color .18s var(--ease),transform .18s var(--ease),box-shadow .18s var(--ease),opacity .18s var(--ease);
}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:2px solid rgba(216,166,70,.9);outline-offset:2px;
}
::selection{background:var(--gold);color:#08090b}
::-webkit-scrollbar{width:9px;height:9px}
::-webkit-scrollbar-track{background:#07090c}
::-webkit-scrollbar-thumb{background:#2a313b;border:2px solid #07090c;border-radius:99px}
::-webkit-scrollbar-thumb:hover{background:#3a424e}

/* shell / masthead */
.app{background:transparent;isolation:isolate}
.app:before{display:none}
.topbar{
  height:78px;background:rgba(7,9,12,.82);border-bottom:1px solid var(--line-soft);
  backdrop-filter:blur(24px) saturate(125%);-webkit-backdrop-filter:blur(24px) saturate(125%);
  box-shadow:0 1px 0 rgba(255,255,255,.015),0 14px 34px rgba(0,0,0,.16)
}
.topbar-inner{max-width:var(--max);padding:0 30px;gap:28px}
.brand{min-width:245px;gap:11px}
.brand-badge{width:43px;height:43px;filter:drop-shadow(0 6px 16px rgba(0,0,0,.35))}
.brand-mark{width:28px;height:28px;opacity:.72}
.brand-copy strong{font:800 20px/1 var(--head);letter-spacing:.075em;color:#fbf7ef}
.brand-copy span{font:700 8px/1 var(--body);letter-spacing:.24em;color:#737c87;margin-top:6px}
.desktop-nav{gap:1px}
.nav-btn{padding:0 15px;font-size:11px;letter-spacing:.115em;color:#7f8791;font-weight:800}
.nav-btn:hover{color:#d9dde2;background:rgba(255,255,255,.018)}
.nav-btn.active{color:#fff}
.nav-btn.active:after{left:15px;right:15px;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);box-shadow:0 0 14px rgba(216,166,70,.45)}
.account-btn{height:42px;padding:0 10px 0 8px;border:1px solid var(--line);background:rgba(13,17,22,.84);border-radius:10px;box-shadow:0 8px 22px rgba(0,0,0,.16)}
.account-btn:hover{border-color:rgba(216,166,70,.25);background:#121821}
.account-avatar{width:27px;height:27px;border:1px solid rgba(216,166,70,.38)}
.account-btn strong{font-size:11px;letter-spacing:.02em}
.account-menu{top:50px;width:238px;background:rgba(12,16,21,.98);border:1px solid var(--line);border-radius:12px;padding:7px;box-shadow:0 26px 80px rgba(0,0,0,.5)}
.account-menu button,.account-menu a{border-radius:8px;padding:12px;font-size:11px;letter-spacing:.04em}
.account-menu button:hover,.account-menu a:hover{background:#151b23}

.sync-strip{background:rgba(8,11,14,.82);border-bottom:1px solid var(--line-soft)}
.sync-inner{max-width:var(--max);padding:8px 30px;gap:9px;font-size:11px;letter-spacing:.055em;color:#78818c}
.sync-inner strong{font-size:11px;color:#aeb5bd;letter-spacing:.07em}
.sync-led{width:6px;height:6px;background:#4eaa78;box-shadow:0 0 0 4px rgba(78,170,120,.07),0 0 14px rgba(78,170,120,.22)}
.sync-led.running{background:var(--gold);box-shadow:0 0 0 4px rgba(216,166,70,.08),0 0 14px rgba(216,166,70,.22)}

.shell{max-width:var(--max);padding:42px 30px 112px}
.view-head{margin:4px 0 28px;align-items:flex-end}
.eyebrow{font-size:10px;letter-spacing:.21em;color:var(--gold);font-weight:800}
.view-head h1{font:800 clamp(40px,4.7vw,62px)/.94 var(--head);letter-spacing:-.025em;margin:9px 0 0;text-shadow:none}
.view-head p{max-width:760px;margin-top:10px;color:#a3abb5;font-size:14px;line-height:1.7}
.section-head{padding-left:0;margin:46px 0 17px;align-items:flex-end}
.section-head:before{display:none}
.section-head h2{font:800 29px/1 var(--head);letter-spacing:-.01em;text-shadow:none}
.section-head p{font-size:13px;line-height:1.6;color:#808994;max-width:650px}
.section-head .eyebrow{font-size:9px}

/* hero: brand-led, not generic dashboard */
.hero{
  min-height:410px;border:1px solid var(--line);border-radius:18px;
  background:
    radial-gradient(650px 320px at 18% 15%,rgba(216,166,70,.12),transparent 63%),
    linear-gradient(112deg,#111720 0%,#0c1015 56%,#0a0d11 100%);
  box-shadow:0 34px 100px rgba(0,0,0,.34);overflow:hidden;
}
.hero:before{
  background:
    linear-gradient(90deg,rgba(216,166,70,.08),transparent 24%),
    linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.016) 1px,transparent 1px);
  background-size:auto,64px 64px,64px 64px;
  mask-image:linear-gradient(90deg,black,rgba(0,0,0,.3));
}
.hero:after{content:"YAKUZA";position:absolute;right:-18px;bottom:-54px;width:auto;height:auto;background:none;color:rgba(255,255,255,.018);font:900 150px/1 var(--head);letter-spacing:.02em;pointer-events:none}
.hero-main{padding:54px 58px}
.hero-kicker{font-size:10px;letter-spacing:.22em;color:#c89a40}
.hero h1{font-size:clamp(62px,7.5vw,104px);line-height:.82;letter-spacing:-.035em;margin:18px 0 22px;color:#faf7f0}
.hero h1 em{color:var(--gold);text-shadow:0 0 42px rgba(216,166,70,.12)}
.hero p{max-width:650px;color:#aab1ba;line-height:1.72;font-size:15px}
.hero-actions{gap:9px;margin-top:27px}
.hero-side{border-left:1px solid var(--line-soft);background:rgba(4,6,8,.16);grid-template-rows:repeat(3,1fr)}
.hero-metric{padding:30px 32px;border-bottom:1px solid var(--line-soft);justify-content:center}
.hero-metric small{font-size:10px;letter-spacing:.18em;color:#69727e}
.hero-metric strong{font-size:38px;line-height:1;margin-top:9px;letter-spacing:-.015em}
.hero-metric span{font-size:12px;line-height:1.55;margin-top:5px;color:#7e8792}

/* controls */
.btn{min-height:42px;border:1px solid var(--line);border-radius:9px;padding:0 16px;background:#141a22;color:#edf0f2;font-size:10px;font-weight:800;letter-spacing:.105em;box-shadow:none}
.btn:hover{transform:translateY(-1px);border-color:rgba(255,255,255,.16);background:#19212b;box-shadow:0 10px 24px rgba(0,0,0,.18)}
.btn:active{transform:translateY(0) scale(.985)}
.btn.primary{background:linear-gradient(180deg,#e0ae4d,#c99231);border-color:#e0ae4d;color:#0a0b0d;box-shadow:0 8px 24px rgba(216,166,70,.12)}
.btn.primary:hover{background:linear-gradient(180deg,#edbd62,#d49e3b);box-shadow:0 12px 30px rgba(216,166,70,.18)}
.btn.ghost{background:rgba(255,255,255,.018)}
.btn.danger{background:rgba(162,58,63,.1);border-color:rgba(162,58,63,.35);color:#e9979a}
.btn.slim{min-height:34px;border-radius:8px;padding:0 12px;font-size:8px}

.input,.select,.textarea{
  border:1px solid var(--line);background:#0b0f14;color:#e8e9ea;border-radius:9px;
  min-height:42px;padding:0 13px;box-shadow:inset 0 1px 0 rgba(255,255,255,.012)
}
.input:hover,.select:hover,.textarea:hover{border-color:rgba(255,255,255,.13)}
.input:focus,.select:focus,.textarea:focus{border-color:rgba(216,166,70,.48);box-shadow:0 0 0 3px rgba(216,166,70,.07);background:#0d1218}
.textarea{padding:13px;line-height:1.55}
.field>span{font-size:10px;letter-spacing:.14em;color:#727b86}

/* data hierarchy */
.stat-line{border:1px solid var(--line-soft);border-radius:14px;margin-top:14px;background:rgba(13,17,22,.78);overflow:hidden;box-shadow:var(--shadow-soft)}
.stat-cell{padding:20px 24px;border-right:1px solid var(--line-soft)}
.stat-cell small,.metric small{font-size:10px;letter-spacing:.15em;color:#67717d}
.stat-cell strong,.metric strong{font-size:28px;letter-spacing:-.012em;margin-top:7px;color:#f2efe9}
.stat-cell span,.metric span{font-size:12px;line-height:1.5;color:#7b8490}
.stat-cell strong.gold,.metric strong.gold,.gold{color:var(--gold)}

.panel{border:1px solid var(--line);background:linear-gradient(180deg,rgba(17,23,32,.96),rgba(12,16,21,.96));border-radius:14px;box-shadow:0 16px 44px rgba(0,0,0,.18)}
.panel-head{min-height:52px;padding:0 18px;border-bottom:1px solid var(--line-soft)}
.panel-head strong{font-size:11px;letter-spacing:.15em;color:#d8dbe0}
.panel-head span{font-size:10px;letter-spacing:.06em;color:#68717c}
.panel-body{padding:20px}
.grid-2{gap:16px}.grid-3{gap:16px}.grid-4{gap:12px}
.metric{border:1px solid var(--line-soft);background:rgba(255,255,255,.018);border-radius:11px;padding:18px;min-height:110px;box-shadow:none}
.metric:hover{transform:translateY(-1px);border-color:rgba(216,166,70,.17);background:rgba(255,255,255,.027)}
.metric.hot{border-color:var(--line-gold);background:linear-gradient(145deg,rgba(216,166,70,.085),rgba(255,255,255,.012) 62%)}
.metric strong{font-size:26px}

.tabs{gap:6px;margin:2px 0 22px;border-bottom:1px solid var(--line-soft);padding-bottom:0}
.tab{border:0;background:transparent;color:#7f8995;min-height:43px;padding:0 13px;font-size:10px;letter-spacing:.13em;margin:0;position:relative}
.tab:hover{color:#c7ccd2;background:rgba(255,255,255,.018)}
.tab.active{background:transparent;color:#f5f1ea;box-shadow:none}
.tab.active:after{content:"";position:absolute;left:13px;right:13px;bottom:-1px;height:1px;background:var(--gold);box-shadow:0 0 12px rgba(216,166,70,.35)}

.toolbar{margin-bottom:14px;gap:9px}
.table-wrap{border:1px solid var(--line);border-radius:13px;background:#0c1015;box-shadow:0 14px 38px rgba(0,0,0,.16)}
.table th{height:43px;padding:0 15px;background:#0f141b;color:#7b8590;font-size:10px;letter-spacing:.145em;border-bottom:1px solid var(--line-soft)}
.table td{height:60px;padding:9px 15px;border-top:1px solid var(--line-soft);font-size:12px;color:#bbc1c8}
.table tbody tr:hover{background:rgba(216,166,70,.025)}
.table strong{color:#f2f3f4;font-weight:700}
.table .num{color:#d2a044}
.player-cell img{filter:drop-shadow(0 5px 12px rgba(0,0,0,.25))}

/* content cards */
.event-list,.news-grid,.rank-grid,.staff-grid{gap:14px}
.event-card,.news-card,.rank-card,.staff-card{
  border:1px solid var(--line);background:linear-gradient(180deg,#111720,#0d1218);border-radius:13px;
  box-shadow:0 12px 34px rgba(0,0,0,.13)
}
.event-card:hover,.news-card:hover,.rank-card:hover,.staff-card:hover{transform:translateY(-2px);border-color:rgba(216,166,70,.22);box-shadow:0 20px 46px rgba(0,0,0,.22)}
.event-card.active{border-color:rgba(216,166,70,.34);box-shadow:inset 0 0 0 1px rgba(216,166,70,.04),0 18px 42px rgba(0,0,0,.18)}
.event-date,.mult-badge{letter-spacing:.11em}
.news-card h3,.event-card h3{letter-spacing:-.01em}
.rank-card span{color:#6d7680}
.rank-card img{filter:drop-shadow(0 8px 18px rgba(0,0,0,.35))}

/* staff */
.staff-card{overflow:hidden}
.staff-card header{padding:18px}
.staff-card footer{border-top:1px solid var(--line-soft);background:rgba(0,0,0,.08)}
.staff-avatar-wrap{width:66px;height:66px;flex-basis:66px}
.staff-avatar,.staff-avatar-fallback{width:66px;height:66px;border-radius:13px;border-color:var(--line-soft);background:#0a0e13}
.staff-avatar.rank-main{padding:9px;background:radial-gradient(circle,rgba(216,166,70,.07),transparent 72%),#0b0f14}
.staff-rank-badge{border-radius:8px!important;border-color:rgba(216,166,70,.25)!important}
.staff-meta{color:#8a939e;font-size:11px}
.staff-rank-label{font-size:9px;letter-spacing:.15em;color:#66707b}

/* calculator */
.coop-layout{gap:16px}
.calculator .panel-body{padding:8px 20px 20px}
.calc-step{border-bottom:1px solid var(--line-soft);padding:19px 0}
.step-no{width:27px;height:27px;border-radius:8px;border:1px solid var(--line-gold);background:rgba(216,166,70,.06);color:var(--gold);font:800 13px var(--head)}
.member-summary{margin-top:12px;border:1px solid var(--line-soft);background:rgba(255,255,255,.015);border-radius:11px;padding:12px}
.member-summary img{width:48px;height:48px;filter:drop-shadow(0 6px 12px rgba(0,0,0,.3))}
.calc-result-main{padding:4px 2px 8px}
.calc-result-main h3{font-size:34px;letter-spacing:-.02em}
.progress{height:5px;border-radius:99px;background:#090c10;overflow:hidden;border:0}
.progress i{background:linear-gradient(90deg,#a97b28,#e7b85a);box-shadow:0 0 18px rgba(216,166,70,.26)}
.info-note,.warning,.success-note{border-radius:9px;border-color:var(--line-soft);font-size:9px;line-height:1.55}

/* Community / Warbox */
.community-message{border-radius:12px!important}
.warbox-grid{gap:14px!important}
.warbox-card{border-radius:14px;box-shadow:0 18px 48px rgba(0,0,0,.18)}
.warbox-open img{aspect-ratio:16/9;border-bottom:1px solid var(--line-soft)!important;transition:transform .3s var(--ease-out),filter .3s var(--ease-out)}
.warbox-card:hover .warbox-open img{transform:scale(1.012);filter:brightness(1.04)}
.warbox-card-body{padding:16px;gap:9px}
.reply-count{border-color:var(--line)!important;background:rgba(255,255,255,.025)!important;border-radius:999px!important}
.profile-modal-backdrop{backdrop-filter:blur(9px);background:rgba(2,4,6,.76)}
.profile-modal,.reply-modal{border:1px solid var(--line);border-radius:16px;background:#0e1319;box-shadow:0 35px 120px rgba(0,0,0,.6);overflow:hidden}
.warbox-thread{padding:20px}
.warbox-thread-root{gap:20px;border-bottom-color:var(--line-soft)}
.warbox-thread-root>img{border-radius:10px;border-color:var(--line-soft);background:#080b0e}
.thread-reply{border-color:var(--line-soft);background:rgba(255,255,255,.018);border-radius:10px}
.thread-compose{border-top-color:var(--line-soft);background:#0b1015}

/* My Area */
.my-profile-hero{border-radius:16px;padding:26px;background:radial-gradient(500px 220px at 10% 20%,rgba(216,166,70,.09),transparent 70%),linear-gradient(115deg,#111720,#0d1218 58%)}
.my-rank-art{width:104px;height:104px;flex-basis:104px;border-radius:18px;border-color:rgba(216,166,70,.24);background:radial-gradient(circle,rgba(216,166,70,.08),#0a0e13 68%);box-shadow:inset 0 0 40px rgba(216,166,70,.025),0 16px 35px rgba(0,0,0,.2)}
.my-rank-art img{width:84px;height:84px;filter:drop-shadow(0 10px 20px rgba(0,0,0,.4))}
.my-profile-copy h2{font-size:43px;letter-spacing:-.025em}
.profile-tags span{border:1px solid var(--line-soft);background:rgba(255,255,255,.02);border-radius:999px;padding:5px 9px;font-size:8px;color:#aab1b8}
.my-profile-fresh{border-left-color:var(--line-soft)}
.my-profile-fresh small{font-size:9px;letter-spacing:.16em}
.my-profile-fresh strong{font-size:20px}
.account-info-item{border-color:var(--line-soft);background:rgba(255,255,255,.016);border-radius:10px}
.discord-link-card.linked{border-color:rgba(78,170,120,.28);background:rgba(78,170,120,.045)}
.password-box{padding:20px}
.password-box h3{font:800 27px/1 var(--head);margin:9px 0 18px;letter-spacing:-.01em}

/* auth/login */
.auth-shell{background:radial-gradient(900px 500px at 25% 10%,rgba(216,166,70,.085),transparent 65%),#07090c}
.auth-card{border:1px solid var(--line);border-radius:18px;background:linear-gradient(180deg,rgba(17,23,32,.97),rgba(10,14,19,.98));box-shadow:0 40px 120px rgba(0,0,0,.5)}
.auth-card:before{background:linear-gradient(90deg,var(--gold),rgba(216,166,70,.1),transparent)}
.auth-brand strong{letter-spacing:.08em}
.auth-tabs button.active{color:var(--gold)}
.discord-verify{border-color:var(--line-soft);background:rgba(255,255,255,.018);border-radius:11px}

/* overlays / messages */
.empty{color:#8f98a3;font-size:12px;letter-spacing:.02em}
.flash{border-radius:10px;box-shadow:0 18px 50px rgba(0,0,0,.35)}
.admin-notification-badge{background:#ae3f44;box-shadow:0 0 0 2px #0d1116}

/* footer added in V11 */
.portal-footer{max-width:var(--max);margin:0 auto;padding:0 30px 34px;color:#555f6b}
.portal-footer-inner{border-top:1px solid var(--line-soft);padding-top:20px;display:flex;justify-content:space-between;align-items:center;gap:18px}
.portal-footer-brand{display:flex;align-items:center;gap:10px}
.portal-footer-brand img{width:24px;height:24px;object-fit:contain;opacity:.66}
.portal-footer-brand strong{font:800 12px var(--head);letter-spacing:.1em;color:#777f89}
.portal-footer-brand span,.portal-footer-meta{font-size:8px;letter-spacing:.09em;text-transform:uppercase}
.portal-footer-meta{text-align:right}

/* mobile nav becomes a deliberate bottom dock */
.mobile-nav{background:rgba(8,11,15,.94);border-top:1px solid var(--line);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);box-shadow:0 -14px 40px rgba(0,0,0,.32)}
.mobile-nav button{color:#68717c}
.mobile-nav button.active{color:#f2ede4}
.mobile-nav button.active:before{background:var(--gold)}
.mobile-nav .nav-icon{width:18px;height:18px;display:block;margin:auto}
.mobile-nav .nav-icon svg{display:block;width:100%;height:100%;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}

@media(max-width:1100px){
  .topbar-inner{padding:0 22px}.brand{min-width:210px}.brand-mark{display:none}.desktop-nav .nav-btn{padding:0 10px}
  .hero-main{padding:44px 40px}.hero-side{min-width:300px}.shell{padding-left:22px;padding-right:22px}
}
@media(max-width:820px){
  body{font-size:12px}.topbar{height:64px}.topbar-inner{padding:0 15px}.brand{min-width:0}.brand-badge{width:37px;height:37px}.brand-copy strong{font-size:17px}.brand-copy span{font-size:7px}.account-btn strong,.account-btn i{display:none}.account-btn{width:40px;padding:0;justify-content:center}.account-avatar{width:27px;height:27px}
  .sync-inner{padding:7px 15px;white-space:nowrap;overflow:auto}.sync-inner span:last-child{display:none}
  .shell{padding:26px 14px 92px}.view-head{margin:2px 0 20px}.view-head h1{font-size:40px}.view-head p{font-size:12px;line-height:1.65}.section-head{margin:34px 0 13px}.section-head h2{font-size:26px}
  .hero{display:block;min-height:0;border-radius:14px}.hero-main{padding:36px 26px 30px}.hero h1{font-size:62px;margin:15px 0 18px}.hero p{font-size:13px}.hero-side{display:grid;grid-template-columns:1fr 1fr;border-left:0;border-top:1px solid var(--line-soft);min-width:0}.hero-metric{padding:20px;border-bottom:0;border-right:1px solid var(--line-soft)}.hero-metric:last-child{border-right:0}.hero-metric strong{font-size:26px}.hero:after{font-size:92px;bottom:-30px}
  .stat-line{border-radius:12px}.stat-cell{padding:14px 13px}.stat-cell strong{font-size:21px}
  .panel,.table-wrap,.event-card,.news-card,.rank-card,.staff-card{border-radius:11px}.panel-body{padding:15px}.metric{border-radius:9px;padding:14px;min-height:94px}.metric strong{font-size:22px}
  .table-wrap{border-left:1px solid var(--line);border-right:1px solid var(--line);margin-left:0;width:100%;border-radius:11px}
  .table th,.table td{padding-left:11px;padding-right:11px}
  .portal-footer{padding:0 15px 92px}.portal-footer-inner{align-items:flex-start;flex-direction:column}.portal-footer-meta{text-align:left}
  .my-profile-hero{padding:18px}.my-rank-art{width:82px;height:82px;flex-basis:82px}.my-rank-art img{width:66px;height:66px}.my-profile-copy h2{font-size:34px}
}
@media(max-width:520px){
  .hero-main{padding:31px 21px 26px}.hero h1{font-size:54px}.hero-actions .btn{flex:1}.hero-side{grid-template-columns:1fr}.hero-metric{border-right:0;border-bottom:1px solid var(--line-soft)}.hero-metric:last-child{border-bottom:0}
  .stat-line{grid-template-columns:1fr 1fr}.stat-cell:nth-child(2){border-right:0}.stat-cell:nth-child(-n+2){border-bottom:1px solid var(--line-soft)}
  .grid-3{grid-template-columns:1fr}.profile-detail-stats{grid-template-columns:1fr 1fr}.view-head h1{font-size:36px}
  .tabs{margin-left:-2px;margin-right:-2px}.tab{padding:0 10px}.tab.active:after{left:10px;right:10px}
  .input{min-width:0;width:100%}.select{min-width:0;width:100%}.toolbar-left,.toolbar-right{width:100%}.toolbar-left>*,.toolbar-right>*{flex:1}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}


/* V11.02 — Rankings, calculadora robusta e zoom Warbox */
.calc-freshness-note{margin:0 0 16px;font-size:12px;line-height:1.55;color:#aeb7c1}
.ranking-source{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:-6px 0 18px;color:var(--muted);font-size:12px}.ranking-source span{font-weight:700;color:#cbd2da}.ranking-source b{font-weight:600}.ranking-source a{margin-left:auto;color:var(--gold);font-size:11px;font-weight:800;letter-spacing:.05em}
.ranking-podium{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin:0 0 18px}.podium-card{min-height:176px;padding:20px;border:1px solid var(--line-soft);border-radius:14px;background:linear-gradient(145deg,#11171d,#0c1014);display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-end;gap:6px;position:relative;overflow:hidden;transition:transform .18s var(--ease-out),border-color .18s var(--ease-out)}.podium-card:hover{transform:translateY(-2px);border-color:rgba(215,154,24,.4)}.podium-card.first{background:linear-gradient(145deg,rgba(215,154,24,.15),#0e1216);border-color:rgba(215,154,24,.38)}.podium-card img{position:absolute;inset:14px 14px auto auto;max-width:58%;max-height:74px;object-fit:contain;opacity:.9}.podium-card small{color:var(--gold);font-weight:900;letter-spacing:.08em}.podium-card strong{font:800 25px var(--head);color:#f5f6f7}.podium-card b{font-size:14px}.podium-card span{color:var(--muted);font-size:11px}
.warbox-thread-image{position:relative;width:100%;padding:0;border:1px solid var(--line-soft);border-radius:10px;background:#080b0e;overflow:hidden;cursor:zoom-in}.warbox-thread-image img{display:block;width:100%;max-height:420px;object-fit:contain;background:#080b0e}.warbox-thread-image span{position:absolute;right:10px;bottom:10px;padding:7px 9px;border-radius:999px;background:rgba(5,7,9,.82);border:1px solid rgba(255,255,255,.12);color:#fff;font-size:9px;font-weight:800;letter-spacing:.07em;opacity:.75}.warbox-thread-image:hover span{opacity:1}
.image-lightbox{position:fixed;inset:0;z-index:120;background:rgba(0,0,0,.93);display:flex;align-items:center;justify-content:center;padding:28px;cursor:zoom-out}.image-lightbox img{max-width:min(96vw,1600px);max-height:92vh;object-fit:contain;box-shadow:0 24px 100px rgba(0,0,0,.75);cursor:default}.image-lightbox-close{position:fixed;right:22px;top:18px;width:44px;height:44px;border:1px solid rgba(255,255,255,.18);border-radius:50%;background:rgba(15,18,22,.9);color:#fff;font-size:27px;cursor:pointer}
@media(max-width:820px){.mobile-nav{grid-template-columns:repeat(6,1fr)}.ranking-podium{grid-template-columns:1fr}.ranking-source a{margin-left:0;width:100%}.image-lightbox{padding:10px}.image-lightbox-close{right:10px;top:10px}}

/* V11.03 — filtros e coerência dos rankings */
.ranking-filters{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 10px;padding:12px;border:1px solid var(--line-soft);border-radius:12px;background:rgba(13,17,21,.76)}
.ranking-filter-main{display:flex;align-items:center;gap:8px;flex-wrap:wrap;flex:1}.ranking-filter-main .input{min-width:220px;flex:1}.ranking-filter-main .select{min-width:155px}.ranking-filter-main .compact-select{min-width:130px}
.filter-check{display:flex;align-items:center;gap:8px;min-height:40px;padding:0 12px;border:1px solid var(--line-soft);border-radius:9px;background:#0d1115;color:#cbd2da;font-size:11px;font-weight:800;letter-spacing:.04em;text-transform:uppercase;cursor:pointer}.filter-check input{accent-color:var(--gold)}
.ranking-count{margin:0 0 10px;color:var(--muted);font-size:11px;font-weight:650}
@media(max-width:820px){.ranking-filters{align-items:stretch}.ranking-filter-main{display:grid;grid-template-columns:1fr}.ranking-filter-main .input,.ranking-filter-main .select,.ranking-filter-main .compact-select{width:100%;min-width:0}.filter-check{width:100%;justify-content:center}}


/* V11.04 — ranking global por métrica + Minha Área expandida */
.ranking-meta-row{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:10px 0 12px}
.ranking-order{font-size:10px;font-weight:800;letter-spacing:.08em;color:var(--gold);text-transform:uppercase}
.global-rank-cell{display:inline-flex;align-items:center;gap:10px;white-space:nowrap;font-weight:700}
.global-rank-cell img{width:34px;height:34px;object-fit:contain;filter:drop-shadow(0 3px 8px rgba(0,0,0,.35))}
.my-rank-progress{margin-top:15px;max-width:520px}.my-rank-progress-head{display:flex;justify-content:space-between;gap:14px;margin-bottom:7px;color:var(--muted);font-size:11px}.my-rank-progress-head b{color:var(--gold)}
.progress-track{height:7px;background:#090c0f;border:1px solid var(--line-soft);overflow:hidden}.progress-track span{display:block;height:100%;background:linear-gradient(90deg,#a66b0d,var(--gold));transition:width .35s var(--ease)}.progress-track.large{height:9px;margin-top:14px}
.my-progress-panel{margin-top:14px}.my-progress-grid{display:grid;grid-template-columns:1.35fr repeat(3,1fr);gap:10px}.progress-highlight{grid-row:span 2;border:1px solid rgba(216,159,53,.26);background:linear-gradient(135deg,rgba(216,159,53,.08),rgba(255,255,255,.012));padding:18px;border-radius:10px;display:flex;flex-direction:column;justify-content:center;min-height:180px}.progress-highlight small{font-size:9px;font-weight:800;letter-spacing:.1em;color:var(--muted-2)}.progress-highlight strong{font:800 27px/1.05 var(--head);margin-top:8px}.progress-highlight>span{font-size:12px;color:var(--muted);margin-top:7px}.progress-highlight>b{font:800 18px var(--head);color:var(--gold);margin-top:8px}.my-progress-grid>.metric{min-height:84px}
@media(max-width:900px){.ranking-meta-row{align-items:flex-start;flex-direction:column}.my-progress-grid{grid-template-columns:1fr 1fr}.progress-highlight{grid-column:1/-1;grid-row:auto;min-height:150px}}
@media(max-width:520px){.global-rank-cell img{width:28px;height:28px}.my-progress-grid{grid-template-columns:1fr}.progress-highlight{grid-column:auto}.ranking-order{font-size:9px}}

/* V11.10 — recuperação de senha */
.auth-recovery-link{border:0;background:transparent;color:#c5a052;padding:5px 0;font-size:9px;font-weight:850;letter-spacing:.07em;cursor:pointer}.auth-recovery-link:hover{color:#f0c36a;text-decoration:underline}.recovery-head{display:grid;gap:5px;margin:20px 0 14px;padding:14px;border:1px solid var(--line-soft);border-radius:11px;background:rgba(255,255,255,.018)}.recovery-head strong{font-size:11px;letter-spacing:.07em}.recovery-head span{color:#89939f;font-size:10.5px;line-height:1.5}.auth-card .btn.ghost+.btn.ghost{margin-top:8px}

/* ==========================================================
   V11.22 — identidade YAKUZA unificada • portal logado
   ========================================================== */
:root{
  --bg:#07090c!important;
  --panel:#0d1116!important;
  --panel-2:#121720!important;
  --line:rgba(255,255,255,.085)!important;
  --line-soft:rgba(255,255,255,.055)!important;
  --ink:#f2eee6!important;
  --muted:#a7afb8!important;
  --muted-2:#7d8792!important;
  --gold:#d7a33a!important;
  --gold-2:#f0c260!important;
  --red:#cf6e6e!important;
}
body{background:#07090c!important;color:#f2eee6!important;line-height:1.5!important}
.app{background:
  radial-gradient(circle at 12% 0,rgba(127,33,29,.16),transparent 28%),
  radial-gradient(circle at 82% 8%,rgba(215,163,58,.055),transparent 24%),
  linear-gradient(180deg,#07090c,#090b0e 58%,#07090c)!important;
  position:relative;
}
.app:before{content:"";position:fixed;inset:0;pointer-events:none;background-image:linear-gradient(rgba(255,255,255,.01) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.008) 1px,transparent 1px);background-size:48px 48px;opacity:.65;mask-image:linear-gradient(to bottom,#000,transparent 92%);z-index:0}
.topbar,.sync-strip,.shell{position:relative;z-index:1}
.topbar{height:78px!important;background:rgba(6,8,10,.93)!important;border-bottom:1px solid rgba(215,163,58,.14)!important;box-shadow:0 14px 34px rgba(0,0,0,.2)!important}
.brand-badge{width:46px!important;height:46px!important;filter:drop-shadow(0 8px 18px rgba(127,33,29,.32))}
.brand-mark{opacity:.8}.brand-copy strong{font-size:20px!important;color:#f2eee6!important}.brand-copy span{color:#927b65!important;font-size:9px!important}
.nav-btn{font-size:12.5px!important;color:#aab2bb!important}.nav-btn:hover,.nav-btn.active{color:#f5f1e9!important}.nav-btn.active:after{background:linear-gradient(90deg,#d7a33a,#7f211d)!important;height:2px!important}
.account-btn{min-height:42px!important;border-color:rgba(215,163,58,.18)!important;background:linear-gradient(145deg,#10141a,#0b0e12)!important;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px)}
.account-menu{border-color:rgba(215,163,58,.18)!important;background:#0b0f14!important}
.sync-strip{background:#0a0d11!important;border-bottom-color:rgba(255,255,255,.055)!important}.sync-inner{font-size:11.5px!important;color:#9fa8b1!important}.sync-inner strong{color:#e9e5de!important}
.shell{padding-top:36px!important}.view-head{padding:0 0 22px!important;border-bottom:1px solid rgba(215,163,58,.11)!important;margin-bottom:26px!important}.view-head h1{font-size:46px!important;color:#f2eee6!important;letter-spacing:-.015em!important}.view-head p{font-size:14px!important;line-height:1.7!important;color:#abb3bc!important}.eyebrow{color:#d7a33a!important;font-size:10.5px!important}
.panel{background:linear-gradient(155deg,rgba(16,20,26,.97),rgba(9,12,16,.97))!important;border-color:rgba(255,255,255,.085)!important;box-shadow:0 18px 44px rgba(0,0,0,.15)!important}.panel-head{min-height:54px!important;border-bottom-color:rgba(255,255,255,.065)!important}.panel-head strong{font-size:12px!important;color:#ece8e1!important}.panel-head span{font-size:11px!important;color:#8f99a4!important}
.stat-line{border-color:rgba(215,163,58,.14)!important;background:linear-gradient(180deg,#0e1217,#0b0e12)!important}.stat-cell{padding:22px 24px!important;border-right-color:rgba(255,255,255,.07)!important}.stat-cell small,.metric small{font-size:10px!important;color:#8d97a1!important}.stat-cell strong,.metric strong{font-size:29px!important;color:#f2eee6!important}.stat-cell span,.metric span,.metric .sub{font-size:11px!important;color:#9ba5af!important}
.tabs{border-bottom-color:rgba(215,163,58,.12)!important;gap:7px!important}.tab{min-height:44px!important;padding:0 18px!important;border-color:rgba(255,255,255,.08)!important;background:#0d1116!important;color:#9ca5af!important;font-size:10.5px!important;clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px)}.tab.active{background:linear-gradient(145deg,rgba(215,163,58,.12),rgba(127,33,29,.08))!important;border-color:rgba(215,163,58,.35)!important;color:#f2eee6!important;box-shadow:inset 0 -2px 0 #d7a33a!important}
.btn{min-height:44px!important;border-color:rgba(255,255,255,.10)!important;background:#10151b!important;color:#ece8e1!important;font-size:11px!important;clip-path:polygon(7px 0,100% 0,100% calc(100% - 7px),calc(100% - 7px) 100%,0 100%,0 7px);transition:transform .15s ease,border-color .15s ease,background .15s ease}.btn:hover{transform:translateY(-1px)!important;border-color:rgba(215,163,58,.38)!important;background:#141a21!important}.btn.primary{background:linear-gradient(120deg,#efc25e,#d39a31)!important;border-color:#e2b452!important;color:#140d05!important}.btn.primary:hover{background:linear-gradient(120deg,#f4cb70,#dfa53c)!important}.btn.ghost{background:#0c1015!important}
.input,.select,.textarea{border-color:rgba(255,255,255,.09)!important;background:#090d12!important;color:#e9e5de!important;font-size:12.5px!important}.input:focus,.select:focus,.textarea:focus{border-color:rgba(215,163,58,.48)!important;box-shadow:0 0 0 2px rgba(215,163,58,.07)!important}.field>span{font-size:9.5px!important;color:#8d97a1!important}
.table-wrap{border-color:rgba(255,255,255,.08)!important;background:#0c1015!important}.table th{height:45px!important;padding:0 15px!important;background:#0f141a!important;color:#84909c!important;font-size:10px!important}.table td{height:62px!important;padding:10px 15px!important;border-top-color:rgba(255,255,255,.06)!important;color:#d1d7dd!important;font-size:12.5px!important}.table tbody tr:hover{background:rgba(215,163,58,.035)!important}.table strong{color:#f1ede6!important}.table .num,.gold{color:#d7a33a!important}
.metric{border-color:rgba(255,255,255,.075)!important;background:linear-gradient(150deg,#10151b,#0c1015)!important}.metric.hot{border-color:rgba(215,163,58,.24)!important;background:linear-gradient(145deg,rgba(215,163,58,.09),rgba(127,33,29,.045),#0d1116 68%)!important}

/* Página CLÃ: mesma assinatura visual da landing */
.route-membros .view-head{min-height:150px;padding:28px 320px 28px 28px!important;border:1px solid rgba(215,163,58,.15)!important;background:
  linear-gradient(90deg,rgba(127,33,29,.14),rgba(10,13,17,.92) 44%),
  url('/static/yakuza-strip') right 36px center/260px auto no-repeat,
  #0b0f14!important;position:relative;overflow:hidden}.route-membros .view-head:after{content:"";position:absolute;left:0;top:0;width:42%;height:2px;background:linear-gradient(90deg,#d7a33a,#7f211d,transparent)}.route-membros .view-head h1{font-size:58px!important}.route-membros .view-head p{max-width:680px!important}.route-membros .stat-line{margin-top:18px!important;box-shadow:0 20px 45px rgba(0,0,0,.14)}.route-membros .stat-cell:first-child{background:linear-gradient(145deg,rgba(215,163,58,.08),rgba(127,33,29,.025))}.route-membros .player-cell img{filter:drop-shadow(0 4px 9px rgba(0,0,0,.35))}

/* Landing: reforço de legibilidade solicitado */
.public-preview-v3 .public-nav-btn{height:44px!important;padding:0 20px!important;font-size:11px!important;letter-spacing:.075em!important}.public-preview-v3 .public-hero-topline span,.public-preview-v3 .public-hero-topline b{font-size:10px!important}.public-preview-v3 .public-hero-copy{font-size:16px!important;line-height:1.78!important;color:#c0c6cd!important}.public-preview-v3 .public-live-stat small{font-size:10px!important}.public-preview-v3 .public-live-stat span{font-size:11.5px!important;color:#a6afb8!important}.public-preview-v3 .public-section-kicker{font-size:10px!important}.public-preview-v3 .public-leader-row small,.public-preview-v3 .public-diesel-row small,.public-preview-v3 .public-officers>small{font-size:9px!important}.public-preview-v3 .public-leader-row strong,.public-preview-v3 .public-diesel-row strong{font-size:18px!important}.public-preview-v3 .public-leader-row span,.public-preview-v3 .public-diesel-row span{font-size:11.5px!important;line-height:1.5!important;color:#aeb6be!important}.public-preview-v3 .public-officer-list span{font-size:10.5px!important;padding:7px 9px!important}.public-preview-v3 .public-widget-member b{font-size:13px!important}.public-preview-v3 .public-widget-member small{font-size:9px!important;color:#98a4b0!important}.public-preview-v3 .public-feature span{font-size:13px!important;line-height:1.55!important}.public-preview-v3 .public-teaser-card>p{font-size:12px!important;line-height:1.6!important}.public-preview-v3 .public-spoiler-list li{font-size:14.5px!important}.public-preview-v3 .preview-veil small{font-size:12px!important;line-height:1.55!important}
@media(max-width:980px){.route-membros .view-head{padding-right:28px!important;background:linear-gradient(90deg,rgba(127,33,29,.14),rgba(10,13,17,.95))!important}.route-membros .view-head h1{font-size:46px!important}}

/* V11.23 — correções finais após V11.22 (arquivo carregado por último) */
.topbar{position:sticky!important;z-index:300!important}.account-wrap{position:relative!important;z-index:320!important}.account-menu{z-index:500!important;pointer-events:auto!important}.sync-strip{position:relative!important;z-index:20!important}.shell{position:relative!important;z-index:1!important}
.auth-gate{background:radial-gradient(circle at 10% 45%,rgba(92,20,24,.24),transparent 34%),linear-gradient(135deg,#07090b 0%,#0b0d10 58%,#07090b 100%)!important}.auth-visual{position:relative;overflow:hidden;background:radial-gradient(circle at 14% 55%,rgba(139,39,31,.15),transparent 35%),repeating-linear-gradient(135deg,transparent 0 53px,rgba(215,163,58,.018) 54px 55px),#090b0e!important}.auth-visual:after{content:"";position:absolute;left:5%;right:9%;top:28%;height:190px;background:url('/static/yakuza-strip') center/contain no-repeat;opacity:.18;filter:saturate(.85) drop-shadow(0 20px 30px rgba(0,0,0,.4));pointer-events:none}.auth-brand,.auth-copy{position:relative;z-index:2}.auth-copy h1{font-size:clamp(72px,8vw,132px)!important;letter-spacing:-.035em!important}.auth-copy h1 em{color:#d8a33b!important}.auth-copy p{max-width:620px;font-size:15px!important;line-height:1.75!important;color:#aab2bd!important}.auth-panel{background:linear-gradient(180deg,#080a0d,#0a0d11)!important;border-left:1px solid rgba(215,163,58,.12)!important}.auth-card{border-color:rgba(215,163,58,.18)!important;background:linear-gradient(145deg,#11151b,#0b0e12)!important;box-shadow:0 34px 90px rgba(0,0,0,.45)!important}.auth-card h2{font-size:34px!important}.auth-tabs button.active{color:#e3ad42!important;border-color:rgba(215,163,58,.5)!important;background:rgba(215,163,58,.055)!important}.auth-form .primary{background:linear-gradient(120deg,#efc25e,#d19a31)!important;color:#100b04!important;box-shadow:0 12px 32px rgba(215,163,58,.14)!important}
.route-rankings .shell{isolation:isolate}.route-rankings .shell:before{content:"";position:fixed;left:50%;top:185px;width:min(950px,72vw);height:290px;transform:translateX(-50%);background:url('/static/logo-text') center/contain no-repeat;opacity:.028;filter:grayscale(1);pointer-events:none;z-index:-1}.route-rankings .shell>*{position:relative;z-index:1}