/* =========================================================
   Tale-World Legacy UI V2 — cinematic fantasy layer
   Visual-only overlay. Does not change API or gameplay data.
   ========================================================= */
:root{
  --tw-night:#02050b;
  --tw-ink:#07101c;
  --tw-panel:rgba(7,13,23,.86);
  --tw-panel-hi:rgba(17,28,46,.76);
  --tw-gold:#f3c969;
  --tw-gold-hi:#ffe7a1;
  --tw-violet:#9b7cff;
  --tw-blue:#67bdff;
  --tw-green:#67e8aa;
  --tw-edge:rgba(242,201,105,.20);
  --tw-edge2:rgba(112,176,255,.18);
  --tw-deep-shadow:0 28px 90px rgba(0,0,0,.48);
}

body.tw-legacy-v2{
  background:
    radial-gradient(900px 600px at 8% 18%,rgba(72,93,191,.14),transparent 64%),
    radial-gradient(850px 680px at 91% 25%,rgba(128,77,205,.11),transparent 66%),
    linear-gradient(180deg,#07101b 0%,#03070e 48%,#02050a 100%)!important;
}
body.tw-legacy-v2:before{
  background-image:
    linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px),
    radial-gradient(circle at 50% 0%,rgba(255,225,139,.08),transparent 42%)!important;
  background-size:58px 58px,58px 58px,100% 100%!important;
  opacity:.72;
}
body.tw-legacy-v2:after{
  content:"";
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    radial-gradient(420px 260px at var(--tw-mx,70%) var(--tw-my,20%),rgba(99,170,255,.055),transparent 72%),
    linear-gradient(180deg,transparent 75%,rgba(246,200,95,.025));
}

/* --- Global header: heavier fantasy/game shell --- */
body.tw-legacy-v2 .tw-global-header{
  background:
    radial-gradient(circle at 50% -250%,rgba(95,154,255,.25),transparent 42%),
    linear-gradient(180deg,rgba(2,7,15,.985),rgba(4,10,20,.94))!important;
  border-bottom-color:rgba(242,201,105,.28)!important;
  box-shadow:0 18px 50px rgba(0,0,0,.42),inset 0 -1px rgba(255,255,255,.025)!important;
}
body.tw-legacy-v2 .tw-global-header::before{
  height:2px;
  background:linear-gradient(90deg,transparent 3%,rgba(102,184,255,.38),rgba(246,200,95,.86) 48%,rgba(157,120,255,.40),transparent 97%);
}
body.tw-legacy-v2 .tw-shell-brand img{
  filter:drop-shadow(0 0 19px rgba(105,173,255,.42)) drop-shadow(0 0 9px rgba(246,200,95,.14))!important;
}
body.tw-legacy-v2 .tw-shell-menu a{color:#cbd7eb!important}
body.tw-legacy-v2 .tw-shell-menu a:hover,
body.tw-legacy-v2 .tw-shell-menu a.active{color:#fff2c7!important;text-shadow:0 0 18px rgba(246,200,95,.16)}
body.tw-legacy-v2 .tw-shell-store{
  border-radius:10px!important;
  background:linear-gradient(180deg,#ebc968 0%,#b77721 100%)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.35),0 8px 26px rgba(214,154,43,.22)!important;
}

/* --- Cinematic home hero --- */
body.tw-legacy-v2.home-analytics .home-analytics-hero{
  min-height:820px!important;
  border-bottom:1px solid rgba(242,201,105,.14);
  box-shadow:0 48px 100px rgba(0,0,0,.26);
}
body.tw-legacy-v2.home-analytics .home-hero-shade{
  background:
    radial-gradient(circle at 68% 37%,rgba(88,123,216,.13),transparent 28%),
    linear-gradient(90deg,rgba(1,4,10,.93) 0%,rgba(2,5,12,.76) 39%,rgba(2,5,12,.35) 64%,rgba(2,5,12,.69) 100%),
    linear-gradient(180deg,rgba(2,5,10,.17) 0%,rgba(2,5,10,.20) 52%,rgba(2,5,10,.94) 92%,#03070e 100%)!important;
}
body.tw-legacy-v2.home-analytics .home-hero-copy{position:relative}
body.tw-legacy-v2.home-analytics .home-hero-copy:before{
  content:"";position:absolute;left:-28px;top:-32px;width:2px;height:128px;
  background:linear-gradient(180deg,transparent,var(--tw-gold),rgba(97,183,255,.55),transparent);
  box-shadow:0 0 24px rgba(246,200,95,.25);
}
body.tw-legacy-v2.home-analytics .home-hero-kicker{
  color:#f9dda0!important;letter-spacing:.22em!important;text-shadow:0 0 20px rgba(246,200,95,.18)
}
body.tw-legacy-v2.home-analytics .home-hero-copy h1{
  max-width:880px;
  font-size:clamp(58px,7.5vw,108px)!important;
  line-height:.88!important;
  letter-spacing:-.045em!important;
  text-shadow:0 18px 55px rgba(0,0,0,.62),0 0 38px rgba(94,139,245,.08)!important;
}
body.tw-legacy-v2.home-analytics .home-hero-copy h1 span{
  background:linear-gradient(180deg,#fff9df 0%,#f9db87 42%,#d89a35 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  filter:drop-shadow(0 8px 22px rgba(141,85,14,.20));
}
body.tw-legacy-v2.home-analytics .hero-lead{font-size:17px!important;color:#ced8e9!important;max-width:700px!important}
body.tw-legacy-v2.home-analytics .home-ip-line{
  border:1px solid rgba(255,255,255,.09)!important;
  border-left-color:rgba(100,222,169,.34)!important;
  background:linear-gradient(90deg,rgba(5,13,22,.78),rgba(5,11,20,.36))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025),0 13px 34px rgba(0,0,0,.20);
}
body.tw-legacy-v2.home-analytics .home-hero-features span{
  border:1px solid rgba(255,255,255,.08)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.018))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035);
}

/* --- Buttons become game UI --- */
body.tw-legacy-v2 .btn,
body.tw-legacy-v2 .profile-action,
body.tw-legacy-v2 .tab,
body.tw-legacy-v2 .profile-tab{
  position:relative;overflow:hidden;
  border-radius:10px!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 9px 22px rgba(0,0,0,.16);
}
body.tw-legacy-v2 .btn:before{
  content:"";position:absolute;inset:2px;border:1px solid rgba(255,255,255,.04);border-radius:7px;pointer-events:none;
}
body.tw-legacy-v2 .btn.primary{
  background:linear-gradient(180deg,#f5d67d 0%,#d6a13e 56%,#a96b20 100%)!important;
  color:#1b1005!important;
  border:1px solid rgba(255,239,183,.78)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.48),0 12px 30px rgba(201,139,37,.22)!important;
}
body.tw-legacy-v2 .btn.blue{
  background:linear-gradient(180deg,rgba(86,166,242,.22),rgba(60,88,168,.14))!important;
  border-color:rgba(110,194,255,.32)!important;
}

/* --- Live/server panel: crystal frame --- */
body.tw-legacy-v2 .hero-panel,
body.tw-legacy-v2 .panel,
body.tw-legacy-v2 .card,
body.tw-legacy-v2 .content-card,
body.tw-legacy-v2 .rpg-panel{
  border-color:rgba(255,255,255,.085)!important;
  background:
    radial-gradient(circle at var(--card-x,85%) var(--card-y,0%),rgba(99,175,255,.07),transparent 33%),
    linear-gradient(180deg,rgba(16,26,43,.82),rgba(5,10,18,.94))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 22px 68px rgba(0,0,0,.30)!important;
}
body.tw-legacy-v2 .hero-panel{
  border-color:rgba(242,201,105,.27)!important;
  border-radius:22px!important;
  box-shadow:inset 0 1px rgba(255,255,255,.05),0 30px 90px rgba(0,0,0,.46),0 0 0 1px rgba(82,147,242,.04)!important;
}
body.tw-legacy-v2 .hero-panel:after{
  content:"";position:absolute;inset:9px;border:1px solid rgba(255,255,255,.035);border-radius:15px;pointer-events:none;
}
body.tw-legacy-v2 .server-card,
body.tw-legacy-v2 .mini-stat,
body.tw-legacy-v2 .home-live-activity,
body.tw-legacy-v2 .home-live-player{
  border-color:rgba(255,255,255,.085)!important;
  background:linear-gradient(180deg,rgba(255,255,255,.048),rgba(255,255,255,.016))!important;
}

/* --- Home navigation / portal cards --- */
body.tw-legacy-v2.home-analytics .home-hero-bottom{
  border:1px solid rgba(242,201,105,.16)!important;
  background:linear-gradient(180deg,rgba(8,16,28,.84),rgba(4,9,17,.93))!important;
  box-shadow:0 25px 75px rgba(0,0,0,.30),inset 0 1px rgba(255,255,255,.025)!important;
  backdrop-filter:blur(16px);
}
body.tw-legacy-v2 .portal-card{
  min-height:315px!important;
  border-radius:18px!important;
  border-color:rgba(255,255,255,.095)!important;
  box-shadow:0 24px 70px rgba(0,0,0,.32)!important;
  isolation:isolate;
}
body.tw-legacy-v2 .portal-card:before{
  content:"";position:absolute;inset:7px;z-index:3;border:1px solid rgba(255,255,255,.045);border-radius:13px;pointer-events:none;
}
body.tw-legacy-v2 .portal-card:after{
  background:
    radial-gradient(circle at var(--card-x,70%) var(--card-y,25%),rgba(119,185,255,.14),transparent 26%),
    linear-gradient(180deg,rgba(3,7,14,.02) 8%,rgba(3,7,14,.20) 43%,rgba(3,7,14,.98) 94%)!important;
}
body.tw-legacy-v2 .portal-card:hover{
  transform:translateY(-8px) scale(1.012)!important;
  border-color:rgba(242,201,105,.33)!important;
  box-shadow:0 34px 90px rgba(0,0,0,.46),0 0 36px rgba(92,146,240,.055)!important;
}
body.tw-legacy-v2 .portal-card .bgimg{opacity:.82!important;filter:saturate(1.08) contrast(1.04)}
body.tw-legacy-v2 .portal-card:hover .bgimg{opacity:.96!important;transform:scale(1.065)!important}
body.tw-legacy-v2 .portal-card-icon{
  border-radius:10px!important;border-color:rgba(242,201,105,.22)!important;
  background:linear-gradient(145deg,rgba(246,200,95,.13),rgba(72,124,220,.08))!important;
  box-shadow:0 8px 20px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.06);
}
body.tw-legacy-v2 .portal-card h3{font-size:25px!important;text-shadow:0 4px 16px rgba(0,0,0,.55)}
body.tw-legacy-v2 .portal-card .arrow{border-radius:10px!important;backdrop-filter:blur(12px)}

/* --- Section rhythm & headings --- */
body.tw-legacy-v2 .section{padding-top:96px;padding-bottom:96px}
body.tw-legacy-v2 .section:before{
  height:1px!important;
  background:linear-gradient(90deg,transparent,rgba(87,158,255,.14),rgba(242,201,105,.32),rgba(153,113,255,.14),transparent)!important;
}
body.tw-legacy-v2 .section-kicker{color:#efc970!important;letter-spacing:.21em!important}
body.tw-legacy-v2 .section-title{letter-spacing:-.025em;text-shadow:0 10px 34px rgba(0,0,0,.38)}
body.tw-legacy-v2 .section-head:before{
  content:"✦";align-self:flex-start;margin-top:1px;margin-right:-14px;color:rgba(242,201,105,.52);font-size:11px;
}

/* --- Page heroes across the website --- */
body.tw-legacy-v2 .page-hero{
  padding-top:112px!important;padding-bottom:70px!important;
  border-bottom:1px solid rgba(242,201,105,.13);
}
body.tw-legacy-v2 .page-hero:before{
  background:
    radial-gradient(circle at 76% 20%,rgba(96,151,255,.16),transparent 28%),
    linear-gradient(90deg,rgba(2,5,11,.93),rgba(3,7,14,.55) 52%,rgba(3,7,14,.86)),
    linear-gradient(180deg,rgba(4,9,17,.18),rgba(4,9,17,.98)),
    url('/assets/Background1.webp') center/cover no-repeat!important;
}
body.tw-legacy-v2 .page-hero h1{
  font-size:clamp(48px,6.4vw,82px)!important;
  letter-spacing:-.035em;
  text-shadow:0 15px 44px rgba(0,0,0,.60);
}
body.tw-legacy-v2 .page-hero .section-kicker:after{
  content:"";display:inline-block;width:44px;height:1px;margin-left:10px;vertical-align:middle;background:linear-gradient(90deg,var(--tw-gold),transparent)
}

/* --- Players / rankings: prestige-style presentation --- */
body.tw-legacy-v2.players-page .players-hero:after{
  content:"";position:absolute;left:0;right:0;bottom:0;height:130px;background:linear-gradient(transparent,#03070e);z-index:0;pointer-events:none;
}
body.tw-legacy-v2.players-page .players-hero-grid{position:relative;z-index:2}
body.tw-legacy-v2.players-page .searchbar{
  border-color:rgba(242,201,105,.18)!important;
  background:rgba(3,8,15,.72)!important;
  box-shadow:inset 0 1px rgba(255,255,255,.025),0 13px 38px rgba(0,0,0,.22);
}
body.tw-legacy-v2.players-page .stat-panel div{
  position:relative;overflow:hidden;
  border-radius:14px!important;
  border-color:rgba(255,255,255,.085)!important;
  background:linear-gradient(180deg,rgba(20,31,50,.78),rgba(7,13,23,.92))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.035),0 15px 45px rgba(0,0,0,.28)!important;
}
body.tw-legacy-v2.players-page .stat-panel div:after{
  content:"";position:absolute;right:-28px;bottom:-38px;width:85px;height:85px;border-radius:50%;background:radial-gradient(circle,rgba(246,200,95,.14),transparent 69%)
}
body.tw-legacy-v2.players-page .top3-card{
  border-radius:18px!important;
  border-color:rgba(255,255,255,.09)!important;
  background:
    radial-gradient(circle at 50% 24%,rgba(100,161,255,.12),transparent 31%),
    linear-gradient(180deg,rgba(16,28,47,.91),rgba(4,9,17,.985))!important;
  box-shadow:0 30px 90px rgba(0,0,0,.38)!important;
}
body.tw-legacy-v2.players-page .top3-card.place-first{
  border-color:rgba(242,201,105,.34)!important;
  box-shadow:0 36px 100px rgba(0,0,0,.45),0 0 45px rgba(242,201,105,.055)!important;
}
body.tw-legacy-v2.players-page .top3-card.place-first:after{
  content:"";position:absolute;inset:7px;border:1px solid rgba(246,200,95,.10);border-radius:13px;pointer-events:none;z-index:10
}
body.tw-legacy-v2.players-page .leaderboard-card{border-radius:18px!important;border-color:rgba(242,201,105,.13)!important;padding:22px!important}
body.tw-legacy-v2.players-page .table-wrap{border-color:rgba(255,255,255,.075)!important;border-radius:12px!important}
body.tw-legacy-v2.players-page th{background:rgba(255,255,255,.032)!important;color:#95a7c1!important}
body.tw-legacy-v2.players-page tbody tr{background:rgba(3,8,15,.10)}
body.tw-legacy-v2.players-page tbody tr:hover{background:linear-gradient(90deg,rgba(246,200,95,.055),rgba(94,155,246,.045))!important}
body.tw-legacy-v2.players-page .profile-shell{
  border-radius:20px!important;
  border-color:rgba(242,201,105,.23)!important;
  box-shadow:0 38px 110px rgba(0,0,0,.46)!important;
}
body.tw-legacy-v2.players-page .profile-banner{
  background:
    radial-gradient(circle at 76% 22%,rgba(104,164,255,.14),transparent 30%),
    linear-gradient(90deg,rgba(2,6,13,.98),rgba(4,9,18,.78) 49%,rgba(4,9,17,.42)),
    url('/assets/Background1.webp') center 43%/cover no-repeat!important;
}

/* --- Generic cards / tables across subpages --- */
body.tw-legacy-v2 .content-card,
body.tw-legacy-v2 .wiki-card,
body.tw-legacy-v2 .dungeon-card{
  border-radius:16px!important;
  border-color:rgba(255,255,255,.085)!important;
  box-shadow:0 18px 55px rgba(0,0,0,.23);
}
body.tw-legacy-v2 .content-card:hover,
body.tw-legacy-v2 .wiki-card:hover,
body.tw-legacy-v2 .dungeon-card:hover{
  border-color:rgba(242,201,105,.20)!important;
}
body.tw-legacy-v2 table{background:rgba(2,6,12,.25)!important}
body.tw-legacy-v2 th{color:#9cafc9!important}
body.tw-legacy-v2 .footer{
  background:
    radial-gradient(circle at 50% 0,rgba(91,139,230,.08),transparent 34%),
    linear-gradient(180deg,rgba(3,7,13,.80),#010308)!important;
  border-top-color:rgba(242,201,105,.13)!important;
}

/* --- Dynamic light sheen (coordinates set by legacy-ui-v2.js) --- */
body.tw-legacy-v2 .portal-card,
body.tw-legacy-v2 .panel,
body.tw-legacy-v2 .top3-card,
body.tw-legacy-v2 .content-card,
body.tw-legacy-v2 .rpg-panel{--card-x:75%;--card-y:0%}

@media(max-width:820px){
  body.tw-legacy-v2.home-analytics .home-analytics-hero{min-height:auto!important}
  body.tw-legacy-v2.home-analytics .home-hero-copy:before{display:none}
  body.tw-legacy-v2 .section{padding-top:68px;padding-bottom:68px}
  body.tw-legacy-v2 .page-hero{padding-top:82px!important;padding-bottom:48px!important}
  body.tw-legacy-v2 .portal-card{min-height:270px!important}
}
@media(max-width:560px){
  body.tw-legacy-v2.home-analytics .home-hero-copy h1{font-size:clamp(46px,15vw,68px)!important}
  body.tw-legacy-v2.players-page .leaderboard-card{padding:12px!important}
  body.tw-legacy-v2 .page-hero h1{font-size:clamp(40px,13vw,58px)!important}
}
@media(prefers-reduced-motion:reduce){
  body.tw-legacy-v2 *{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}
}
