/* Tale-World Homepage — Analytics Style V1
   Scoped to body.home-analytics, so no other page is changed. */

body.home-analytics{
  --hwa-bg:#050b11;
  --hwa-panel:#091923;
  --hwa-panel-2:#0b202c;
  --hwa-border:#214b5d;
  --hwa-border-soft:#173643;
  --hwa-gold:#d6ad5a;
  --hwa-gold-2:#f1d28d;
  --hwa-cyan:#2ee8f2;
  --hwa-text:#e8f0f3;
  --hwa-muted:#849aa5;
  background:
    radial-gradient(circle at 65% 5%,rgba(24,68,94,.32),transparent 26%),
    linear-gradient(180deg,rgba(4,11,17,.82),rgba(4,10,15,.96)),
    url('/assets/tower-epic-sky.webp') center top/cover fixed no-repeat;
  color:var(--hwa-text);
}

body.home-analytics main{overflow:hidden}
body.home-analytics .wrap{width:min(1660px,calc(100% - 32px))}

/* HERO */
body.home-analytics .home-analytics-hero{
  position:relative;
  min-height:620px;
  border-bottom:1px solid rgba(214,173,90,.34);
  background:#06111a;
  overflow:hidden;
}
body.home-analytics .home-hero-art{
  position:absolute; inset:0;
  background:url('/assets/tower-epic-sky.webp') center 32%/cover no-repeat;
  transform:scale(1.02);
  filter:saturate(.82) contrast(1.09);
}
body.home-analytics .home-hero-shade{
  position:absolute; inset:0;
  background:
    linear-gradient(90deg,rgba(3,10,15,.96) 0%,rgba(5,15,23,.83) 40%,rgba(5,15,23,.66) 66%,rgba(3,10,15,.92) 100%),
    linear-gradient(180deg,rgba(3,9,14,.22),rgba(3,9,14,.93));
}
body.home-analytics .home-hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(420px,.72fr);
  gap:44px;
  align-items:center;
  min-height:515px;
  padding:54px 0 34px;
}
body.home-analytics .home-hero-copy{max-width:860px}
body.home-analytics .home-hero-kicker{
  color:var(--hwa-cyan);
  font-size:11px;
  font-weight:900;
  letter-spacing:.17em;
  text-transform:uppercase;
  margin-bottom:13px;
}
body.home-analytics .home-hero-copy h1{
  margin:0;
  font-family:Cinzel,serif;
  font-size:clamp(52px,5.3vw,86px);
  line-height:.98;
  letter-spacing:-.03em;
  color:#f4f7f8;
  text-shadow:0 5px 35px rgba(0,0,0,.52);
}
body.home-analytics .home-hero-copy h1 span{
  color:var(--hwa-gold-2);
  text-shadow:0 0 25px rgba(214,173,90,.2);
}
body.home-analytics .home-hero-copy .hero-lead{
  max-width:760px;
  margin:23px 0 0;
  color:#a7bac3;
  font-size:15px;
  line-height:1.75;
}
body.home-analytics .hero-actions{margin-top:27px;display:flex;gap:10px;flex-wrap:wrap}
body.home-analytics .btn{
  border:1px solid #2a5061;
  border-radius:7px;
  background:#0a1b25;
  color:#c9d8df;
  padding:11px 16px;
  font-weight:800;
  font-size:11px;
  box-shadow:none;
}
body.home-analytics .btn:hover{border-color:#4a7689;background:#0d2632;color:#fff}
body.home-analytics .btn.primary{
  border-color:#a8833d;
  color:#fff5d5;
  background:linear-gradient(180deg,#62502e,#3b321f);
  box-shadow:inset 0 0 0 1px rgba(239,201,112,.18),0 0 20px rgba(214,173,90,.11);
}
body.home-analytics .btn.blue{
  border-color:#287486;
  color:#d9fbff;
  background:linear-gradient(180deg,#0e3948,#0a2632);
}
body.home-analytics .home-ip-line{
  display:flex;
  align-items:center;
  gap:9px;
  width:max-content;
  max-width:100%;
  margin-top:17px;
  padding:9px 12px;
  border:1px solid rgba(49,94,111,.68);
  border-radius:7px;
  background:rgba(4,14,21,.72);
  color:#8fa4ae;
  font-size:10px;
}
body.home-analytics .home-ip-line strong{color:#e8f0f3;font-size:11px}
body.home-analytics .home-ip-sep{color:#4f6975}
body.home-analytics .home-hero-features{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  margin-top:18px;
}
body.home-analytics .home-hero-features span{
  padding:7px 9px;
  border:1px solid rgba(31,71,87,.8);
  border-radius:999px;
  background:rgba(7,23,32,.72);
  color:#91a8b2;
  font-size:9px;
}

body.home-analytics .home-live-panel{
  position:relative;
  padding:13px;
  border:1px solid #245064;
  border-radius:10px;
  background:linear-gradient(180deg,rgba(8,25,35,.96),rgba(6,18,27,.94));
  box-shadow:0 28px 70px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.025);
}
body.home-analytics .home-live-panel:before{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(214,173,90,.035);
}
body.home-analytics .home-panel-heading{
  display:flex;align-items:center;justify-content:space-between;
  min-height:54px;padding:4px 3px 12px;border-bottom:1px solid #173643;
}
body.home-analytics .home-panel-heading span{
  display:block;color:var(--hwa-cyan);font-size:8px;font-weight:900;letter-spacing:.13em
}
body.home-analytics .home-panel-heading strong{
  display:block;margin-top:4px;font-family:Cinzel,serif;font-size:15px;color:#eef4f6
}
body.home-analytics .home-live-panel .hero-panel-logo{
  position:static;width:58px;height:58px;object-fit:contain;opacity:.96;margin:0;
}
body.home-analytics .home-live-panel .server-card{
  margin:11px 0 0;
  border:1px solid #1d4050;
  border-radius:7px;
  background:#081a24;
  padding:10px 11px;
}
body.home-analytics .home-live-panel .server-card strong{font-size:11px}
body.home-analytics .home-live-panel .server-card small{color:#778f9b;font-size:8px}
body.home-analytics .home-live-panel .hero-mini-stats{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:7px;
  margin-top:8px;
}
body.home-analytics .home-live-panel .mini-stat{
  padding:10px 8px;
  border:1px solid #1a3947;
  border-radius:7px;
  background:#071721;
  text-align:left;
}
body.home-analytics .home-live-panel .mini-stat strong{
  display:block;
  color:#f1d28d;
  font-family:Cinzel,serif;
  font-size:20px;
  line-height:1;
}
body.home-analytics .home-live-panel .mini-stat span{
  display:block;margin-top:5px;color:#728a96;font-size:8px
}
body.home-analytics .home-live-activity{
  margin-top:8px;
  padding:10px;
  border-color:#173744;
  border-radius:7px;
  background:#071721;
}
body.home-analytics .home-live-head{margin-bottom:8px}
body.home-analytics .home-live-head>div>span{color:var(--hwa-cyan)}
body.home-analytics .home-live-player{
  border-radius:6px;
  border-color:#173744;
  background:#081a24;
}
body.home-analytics .home-live-player:hover{border-color:#2a6274}

body.home-analytics .home-hero-bottom{
  position:relative;z-index:3;
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  padding-bottom:20px;
}
body.home-analytics .home-hero-bottom a{
  min-height:68px;
  display:grid;
  grid-template-columns:38px 1fr 22px;
  align-items:center;
  gap:9px;
  padding:10px 12px;
  border:1px solid #1f4656;
  border-radius:8px;
  background:linear-gradient(180deg,rgba(9,27,38,.94),rgba(7,20,29,.94));
  color:#e9f1f4;
  text-decoration:none;
  transition:.16s ease;
}
body.home-analytics .home-hero-bottom a:hover{
  transform:translateY(-2px);
  border-color:#357086;
  background:#0b2330;
}
body.home-analytics .home-hero-bottom>a>span{
  color:var(--hwa-gold-2);
  font-size:24px;
  text-align:center;
}
body.home-analytics .home-hero-bottom strong{
  display:block;font-family:Cinzel,serif;font-size:12px
}
body.home-analytics .home-hero-bottom small{
  display:block;color:#718b97;font-size:8px;margin-top:3px
}
body.home-analytics .home-hero-bottom b{color:var(--hwa-cyan);font-size:16px}

/* GLOBAL HOMEPAGE SECTION LANGUAGE */
body.home-analytics .home-analytics-section{
  position:relative;
  padding:34px 0;
  background:transparent;
}
body.home-analytics .home-analytics-section+.home-analytics-section{
  border-top:1px solid rgba(30,68,83,.35);
}
body.home-analytics .section-head{margin-bottom:14px}
body.home-analytics .section-kicker{
  color:var(--hwa-cyan);
  letter-spacing:.12em;
  font-size:9px;
}
body.home-analytics .section-title{
  margin-top:4px;
  color:#eef3f5;
  font-family:Cinzel,serif;
  font-size:clamp(22px,2vw,31px);
}
body.home-analytics .section-copy{
  color:#7e96a1;
  max-width:820px;
  font-size:10px;
  line-height:1.55;
}
body.home-analytics .text-link{color:#50dbe5;font-size:9px}

/* Portal cards => same panel language as Analytics */
body.home-analytics .d2-portal-grid{gap:9px}
body.home-analytics .portal-card{
  min-height:180px;
  border:1px solid #1d4657;
  border-radius:8px;
  background:#081923;
  box-shadow:0 14px 35px rgba(0,0,0,.2);
}
body.home-analytics .portal-card:after{
  background:linear-gradient(180deg,rgba(4,13,19,.12),rgba(5,15,22,.88));
}
body.home-analytics .portal-card:hover{
  border-color:#317087;
  box-shadow:0 18px 42px rgba(0,0,0,.28),0 0 22px rgba(46,232,242,.04);
}
body.home-analytics .portal-card-body{padding:14px}
body.home-analytics .portal-card h3{font-family:Cinzel,serif;font-size:15px}
body.home-analytics .portal-card p{font-size:9px;color:#8298a2}
body.home-analytics .portal-card-icon{color:var(--hwa-gold-2)}

/* KPI / dashboard cards */
body.home-analytics .d2-metrics{gap:8px}
body.home-analytics .d2-metric{
  min-height:104px;
  border:1px solid #1f4656;
  border-radius:8px;
  background:linear-gradient(180deg,rgba(10,28,39,.96),rgba(8,21,30,.95));
  box-shadow:0 14px 35px rgba(0,0,0,.18);
}
body.home-analytics .d2-metric span{color:#8298a2;font-size:9px}
body.home-analytics .d2-metric strong{
  color:#eef4f6;
  font-family:Cinzel,serif;
}
body.home-analytics .d2-metric small{color:#66818d}
body.home-analytics .d2-metric-link:hover{border-color:#317087}

/* Support panel */
body.home-analytics .support-goal-card{
  border:1px solid #264d5e;
  border-radius:9px;
  background:linear-gradient(135deg,rgba(12,31,42,.97),rgba(8,22,31,.96));
  box-shadow:0 18px 45px rgba(0,0,0,.23);
}
body.home-analytics .support-goal-card:before{
  background:radial-gradient(circle,rgba(214,173,90,.12),transparent 68%);
}
body.home-analytics .support-goal-kicker{color:var(--hwa-gold-2)}
body.home-analytics .support-goal-card h2{font-family:Cinzel,serif;font-size:26px}
body.home-analytics .support-goal-copy{color:#8198a3;font-size:10px}
body.home-analytics .support-goal-bar{height:10px;background:#071721;border-color:#183744}
body.home-analytics .support-goal-fill{background:linear-gradient(90deg,#29d9e3,#d6ad5a)}
body.home-analytics .support-goal-side{
  border-radius:8px;border-color:#1d4050;background:#071821
}
body.home-analytics .support-goal-percent{color:var(--hwa-gold-2)}

/* Generic panels and current cards */
body.home-analytics .panel,
body.home-analytics .d2-now,
body.home-analytics .portal-focus-card,
body.home-analytics .community-box{
  border:1px solid #1e4656;
  border-radius:8px;
  background:linear-gradient(180deg,rgba(9,25,35,.96),rgba(7,19,28,.95));
  box-shadow:0 16px 40px rgba(0,0,0,.2);
}
body.home-analytics .panel-head{border-color:#173643}
body.home-analytics .d2-now h3,
body.home-analytics .community-box h2{font-family:Cinzel,serif}
body.home-analytics .d2-now-label{color:var(--hwa-gold-2)}
body.home-analytics .d2-now-chips span{
  border-color:#244957;background:#081923;color:#8ca3ad
}

/* Top 3 / current / class / wiki/store/news */
body.home-analytics .d2-top3>article,
body.home-analytics .d2-current,
body.home-analytics .d2-class-strip>a,
body.home-analytics .d2-wiki-links>a,
body.home-analytics .d2-store-preview>*,
body.home-analytics .d2-news-grid>*{
  border-radius:8px!important;
  border-color:#1e4656!important;
}
body.home-analytics .d2-current{
  background:linear-gradient(180deg,rgba(9,25,35,.96),rgba(7,19,28,.95));
}
body.home-analytics .d2-current:hover,
body.home-analytics .d2-class-strip>a:hover,
body.home-analytics .d2-wiki-links>a:hover{
  border-color:#367185!important;
}
body.home-analytics .d2-class-strip>a{
  min-height:178px;
  box-shadow:0 14px 32px rgba(0,0,0,.2);
}
body.home-analytics .d2-class-strip>a:after{
  background:linear-gradient(180deg,rgba(4,12,18,.06),rgba(4,12,18,.88));
}
body.home-analytics .d2-wiki-links>a{background:#081923}
body.home-analytics .community-home-team img{border-color:#1b3b48}

/* Footer */
body.home-analytics .footer{
  border-top:1px solid rgba(214,173,90,.25);
  background:#050d13;
}

/* responsive */
@media(max-width:1100px){
  body.home-analytics .home-hero-grid{grid-template-columns:1fr;gap:20px;padding-top:38px}
  body.home-analytics .home-live-panel{max-width:760px}
  body.home-analytics .home-hero-bottom{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:760px){
  body.home-analytics .wrap{width:min(100% - 18px,1660px)}
  body.home-analytics .home-analytics-hero{min-height:0}
  body.home-analytics .home-hero-grid{padding-top:28px}
  body.home-analytics .home-hero-copy h1{font-size:clamp(40px,13vw,58px)}
  body.home-analytics .home-hero-copy .hero-lead{font-size:12px}
  body.home-analytics .home-live-panel .hero-mini-stats{grid-template-columns:1fr!important}
  body.home-analytics .home-hero-bottom{grid-template-columns:1fr 1fr}
}
@media(max-width:480px){
  body.home-analytics .home-hero-bottom{grid-template-columns:1fr}
}


/* ==========================================================
   Tale-World Homepage Analytics Style V1.1
   Compatibility / Layout Fix
   Neutralizes legacy homepage hero rules without touching subpages.
   ========================================================== */

body.home-analytics .home-analytics-hero{
  display:block !important;
  height:auto !important;
  min-height:0 !important;
  padding:0 !important;
}

body.home-analytics .home-analytics-hero > .home-hero-grid{
  position:relative !important;
  z-index:2 !important;
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 430px !important;
  align-items:center !important;
  gap:38px !important;

  width:min(1460px,calc(100% - 48px)) !important;
  max-width:1460px !important;
  margin:0 auto !important;
  padding:48px 0 26px !important;

  min-height:500px !important;
  float:none !important;
  inset:auto !important;
  transform:none !important;
}

body.home-analytics .home-hero-copy{
  width:auto !important;
  max-width:820px !important;
  min-width:0 !important;
  margin:0 !important;
  padding:0 !important;
  position:relative !important;
  inset:auto !important;
  transform:none !important;
  float:none !important;
}

body.home-analytics .home-hero-copy h1{
  font-size:clamp(48px,4.7vw,74px) !important;
  line-height:.98 !important;
  max-width:780px !important;
}

body.home-analytics .home-live-panel{
  position:relative !important;
  inset:auto !important;
  transform:none !important;
  float:none !important;

  width:100% !important;
  max-width:430px !important;
  min-width:0 !important;
  justify-self:end !important;

  margin:0 !important;
  padding:13px !important;
}

body.home-analytics .home-live-panel .home-panel-heading{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 110px !important;
  align-items:center !important;
  gap:12px !important;
}

body.home-analytics .home-live-panel .hero-panel-logo{
  position:static !important;
  inset:auto !important;
  transform:none !important;

  display:block !important;
  width:105px !important;
  min-width:0 !important;
  max-width:105px !important;
  height:64px !important;
  max-height:64px !important;

  margin:0 0 0 auto !important;
  object-fit:contain !important;
  aspect-ratio:auto !important;
}

/* Existing recovery-v7.css deliberately makes .hero-panel-logo huge.
   This scoped rule wins only on the redesigned start page. */
body.home-analytics .home-live-panel img.hero-panel-logo{
  width:105px !important;
  max-width:105px !important;
  height:64px !important;
  max-height:64px !important;
}

/* Quick navigation MUST sit below the two-column hero, never beside it. */
body.home-analytics .home-analytics-hero > .home-hero-bottom{
  position:relative !important;
  z-index:3 !important;
  inset:auto !important;
  transform:none !important;
  float:none !important;
  clear:both !important;

  display:grid !important;
  grid-template-columns:repeat(4,minmax(0,1fr)) !important;
  gap:9px !important;

  width:min(1460px,calc(100% - 48px)) !important;
  max-width:1460px !important;
  margin:0 auto !important;
  padding:0 0 22px !important;
}

body.home-analytics .home-analytics-hero > .home-hero-bottom > a{
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
  position:relative !important;
  inset:auto !important;
  transform:none !important;
  float:none !important;
}

/* Keep inherited .hero .wrap rules from changing either of our two wrappers. */
body.home-analytics .home-analytics-hero .home-hero-grid,
body.home-analytics .home-analytics-hero .home-hero-bottom{
  box-sizing:border-box !important;
}

/* Prevent the live-player block from pushing the status card wider. */
body.home-analytics .home-live-panel,
body.home-analytics .home-live-panel *{
  box-sizing:border-box;
}
body.home-analytics .home-live-grid,
body.home-analytics .home-live-player,
body.home-analytics .home-live-player > div{
  min-width:0 !important;
}

/* Wide monitors: keep the composition centered instead of stretching to the edges. */
@media (min-width:1500px){
  body.home-analytics .home-analytics-hero > .home-hero-grid,
  body.home-analytics .home-analytics-hero > .home-hero-bottom{
    width:min(1460px,calc(100% - 72px)) !important;
  }
}

/* Tablet */
@media (max-width:1100px){
  body.home-analytics .home-analytics-hero > .home-hero-grid{
    grid-template-columns:1fr !important;
    gap:22px !important;
    width:min(920px,calc(100% - 32px)) !important;
    padding-top:34px !important;
  }
  body.home-analytics .home-live-panel{
    justify-self:start !important;
    max-width:620px !important;
  }
  body.home-analytics .home-analytics-hero > .home-hero-bottom{
    width:min(920px,calc(100% - 32px)) !important;
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}

/* Mobile */
@media (max-width:620px){
  body.home-analytics .home-analytics-hero > .home-hero-grid,
  body.home-analytics .home-analytics-hero > .home-hero-bottom{
    width:calc(100% - 18px) !important;
  }
  body.home-analytics .home-hero-copy h1{
    font-size:clamp(40px,12vw,55px) !important;
  }
  body.home-analytics .home-live-panel .home-panel-heading{
    grid-template-columns:minmax(0,1fr) 82px !important;
  }
  body.home-analytics .home-live-panel img.hero-panel-logo{
    width:78px !important;
    max-width:78px !important;
    height:52px !important;
    max-height:52px !important;
  }
  body.home-analytics .home-analytics-hero > .home-hero-bottom{
    grid-template-columns:1fr !important;
  }
}


/* ==========================================================
   Tale-World Homepage V1.3 — YouTube Hero Background
   Video: FK5HJtlYKcU
   Nur die Startseite ist betroffen.
   ========================================================== */

body.home-analytics .home-analytics-hero .tw-youtube-bg{
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  overflow:hidden !important;
  background:#06111a !important;
  filter:none !important;
  transform:none !important;
}

body.home-analytics .tw-youtube-fallback{
  position:absolute;
  inset:0;
  z-index:0;
  background:
    linear-gradient(rgba(5,15,23,.18),rgba(5,15,23,.18)),
    url('/assets/tower-epic-sky.webp') center 32%/cover no-repeat;
}

body.home-analytics .tw-youtube-video{
  position:absolute !important;
  z-index:1 !important;
  top:50% !important;
  left:50% !important;

  /* 16:9 cover without letterboxing */
  width:177.77777778vh !important;
  min-width:100% !important;
  height:56.25vw !important;
  min-height:100% !important;

  border:0 !important;
  pointer-events:none !important;
  transform:translate(-50%,-50%) scale(1.08) !important;
  opacity:.96 !important;
  filter:saturate(.90) contrast(1.05) brightness(.70) !important;
}

body.home-analytics .home-hero-shade{
  z-index:2 !important;
  background:
    linear-gradient(90deg,
      rgba(3,10,15,.94) 0%,
      rgba(4,13,19,.76) 36%,
      rgba(4,13,19,.42) 66%,
      rgba(3,10,15,.62) 100%),
    linear-gradient(180deg,rgba(3,9,14,.12),rgba(3,9,14,.72)) !important;
}

body.home-analytics .home-analytics-hero > .home-hero-grid,
body.home-analytics .home-analytics-hero > .home-hero-bottom{
  position:relative !important;
  z-index:3 !important;
}

/* On small devices we keep the page lighter and use the normal fallback art. */
@media (max-width:760px), (prefers-reduced-motion:reduce){
  body.home-analytics .tw-youtube-video{
    display:none !important;
  }
}