:root{color-scheme:dark;--bg:#07080b;--surface:#101319;--surface-2:#171b23;--text:#f8f6ef;--muted:#a9b0bc;--gold:#e8b654;--gold2:#ffe3a0;--gold-light:#ffe3a0;--gold-dark:#94631f;--line:rgba(232,182,84,.22);--good:#8ee0ac;--bad:#ff9ca5;--header:78px;--radius:24px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 18px)}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden;background:#07080b;color:var(--text);font:16px/1.55 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}body:before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(circle at 82% 8%,rgba(232,182,84,.11),transparent 28%),radial-gradient(circle at 12% 42%,rgba(255,227,160,.04),transparent 24%),#07080b}body:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,rgba(7,8,11,.2),rgba(7,8,11,.88) 38%,#07080b 88%)}body.menu-open{overflow:hidden}a{color:inherit}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}:focus-visible{outline:2px solid var(--gold-light);outline-offset:4px}.shell{width:min(1200px,calc(100% - 48px));margin-inline:auto}
.topbar{position:fixed;inset:0 0 auto;z-index:50;border-bottom:1px solid rgba(255,255,255,.07);background:linear-gradient(180deg,rgba(5,7,10,.94),rgba(5,7,10,.76));backdrop-filter:blur(18px) saturate(140%);-webkit-backdrop-filter:blur(18px) saturate(140%)}.topbar-inner{min-height:var(--header);display:flex;align-items:center;gap:20px}.brand{display:inline-flex;align-items:center;gap:12px;flex:0 0 auto;margin-inline-end:auto;color:#fff;font-size:15px;font-weight:900;letter-spacing:.16em;text-decoration:none}.brand img{width:42px;height:42px;object-fit:contain;padding:4px;border:1px solid rgba(255,220,135,.58);border-radius:50%;background:radial-gradient(circle at 35% 25%,rgba(255,228,157,.17),rgba(232,182,84,.04) 55%,transparent 56%);box-shadow:inset 0 0 18px rgba(232,182,84,.07),0 0 28px rgba(232,182,84,.10)}.brand img.tk-clan-crest{width:58px;height:58px;padding:0;border:0;border-radius:0;background:transparent;box-shadow:none;filter:drop-shadow(0 5px 12px rgba(0,0,0,.28))}.nav{display:flex;align-items:center;gap:3px}.nav a{padding:11px 12px;border-radius:12px;color:#cbd0d8;font-size:14px;font-weight:700;text-decoration:none;transition:color .2s ease,background .2s ease,transform .2s ease}.nav a:hover,.nav a.active{color:#fff;background:rgba(255,255,255,.075);transform:translateY(-1px)}.nav .nav-login{margin-left:6px;padding-inline:15px;border:1px solid rgba(232,182,84,.45);color:var(--gold-light);background:rgba(232,182,84,.08)}.languages{display:flex;gap:3px;padding:3px;border:1px solid rgba(255,255,255,.12);border-radius:11px;background:rgba(255,255,255,.05)}.languages button{min-width:34px;padding:7px 5px;border:0;border-radius:8px;color:var(--muted);background:transparent;cursor:pointer;font:800 12px/1 inherit}.languages button.active{color:#211604;background:var(--gold-light)}.menu-toggle{width:46px;height:46px;display:none;place-items:center;border:1px solid rgba(255,255,255,.13);border-radius:14px;background:rgba(255,255,255,.06);color:#fff;cursor:pointer}.mobile-nav{display:none;position:fixed!important;left:0!important;right:0!important;top:calc(var(--header) + env(safe-area-inset-top,0px))!important;bottom:0!important;width:100vw!important;height:auto!important;z-index:2147483000!important;padding:18px 20px max(28px,env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;border-top:1px solid rgba(255,255,255,.07);background:#07080b;box-shadow:0 24px 60px rgba(0,0,0,.55);isolation:isolate;-webkit-overflow-scrolling:touch;transform:none!important;opacity:1!important;visibility:visible!important}.mobile-nav.open{display:grid!important;align-content:start;grid-template-columns:1fr;gap:9px}.mobile-nav a{position:relative;z-index:1;min-height:58px;display:flex;align-items:center;padding:14px 17px;border:1px solid rgba(255,255,255,.09);border-radius:17px;background:#101319;font-size:16px;font-weight:760;text-decoration:none;pointer-events:auto}.mobile-nav a.active{border-color:rgba(232,182,84,.38);color:var(--gold-light);background:rgba(232,182,84,.09)}.mobile-nav .mobile-login{margin-top:7px;border-color:rgba(232,182,84,.38);background:rgba(232,182,84,.09)}body.menu-open .topbar{z-index:2147483001!important}body.menu-open .mobile-nav{display:grid!important;pointer-events:auto!important}body.menu-open main,body.menu-open footer{pointer-events:none!important;user-select:none}
.page-head{position:relative;padding:calc(var(--header) + 78px) 0 38px}.page-head:after{content:"";position:absolute;left:0;bottom:0;width:min(190px,28vw);height:1px;background:linear-gradient(90deg,var(--gold),transparent)}.eyebrow,.kicker{display:inline-flex;align-items:center;gap:10px;margin:0 0 16px;color:var(--gold-light)!important;font-size:12px!important;font-weight:850!important;letter-spacing:.21em!important;text-transform:uppercase}.eyebrow:before,.kicker:before{content:"";width:38px;height:1px;background:linear-gradient(90deg,transparent,var(--gold))}h1{max-width:900px;margin:0;color:#fff;font:700 clamp(46px,6.4vw,76px)/.96 Georgia,"Times New Roman",serif!important;letter-spacing:-.05em!important;text-wrap:balance;text-shadow:0 8px 36px rgba(0,0,0,.52)}.lead,.hint{max-width:760px;margin:20px 0 0;color:#cbd1da!important;font-size:18px;line-height:1.6;text-wrap:balance}.content{padding:26px 0 88px}.grid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px}
.card,.panel,.recipe-toolbar,.recipe,.way,.exact-card{position:relative;border:1px solid rgba(255,255,255,.10)!important;border-radius:26px!important;background:linear-gradient(145deg,rgba(21,25,33,.94),rgba(11,14,20,.96))!important;box-shadow:0 18px 54px rgba(0,0,0,.24)!important;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.card{grid-column:span 6;padding:28px;overflow:hidden;transition:transform .24s ease,border-color .24s ease,background .24s ease}.card:after{content:"";position:absolute;right:-72px;top:-82px;width:210px;height:210px;border-radius:50%;pointer-events:none;background:radial-gradient(circle,rgba(232,182,84,.13),transparent 67%)}.card:hover{transform:translateY(-5px);border-color:rgba(232,182,84,.52)!important}.card.full{grid-column:1/-1}.card.third{grid-column:span 4}.card h2,.card h3{position:relative;margin:0 0 10px;color:#fff}.card p{position:relative;color:var(--muted)}.icon-title{display:flex;align-items:center;gap:15px}.game-icon,.result-icon,.component img,.resource img,.exact-reward img{object-fit:contain;filter:drop-shadow(0 8px 16px rgba(0,0,0,.42))}.game-icon{width:68px;height:68px;flex:0 0 auto;padding:6px;border:1px solid var(--line);border-radius:18px;background:rgba(232,182,84,.06)}
.button{min-height:54px;display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:14px 22px;border:1px solid rgba(255,255,255,.17)!important;border-radius:14px!important;color:#fff!important;background:rgba(8,11,16,.67)!important;backdrop-filter:blur(11px);font-size:15px;font-weight:820;text-decoration:none;cursor:pointer;transition:transform .2s ease,border-color .2s ease,background .2s ease}.button:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.32)!important}.button.primary{border-color:#efc86c!important;color:#191105!important;background:linear-gradient(135deg,#ffe39b,#d39431)!important;box-shadow:0 16px 42px rgba(196,128,32,.24)}.button.primary:hover{background:linear-gradient(135deg,#ffecb6,#dda33f)!important}.button.ghost{background:rgba(255,255,255,.045)!important}.actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}
.tabs,.toc{display:flex;gap:8px;overflow:auto;padding:4px 0 14px;scrollbar-width:thin}.tab,.toc a,.filter{flex:0 0 auto;padding:10px 14px!important;border:1px solid rgba(255,255,255,.12)!important;border-radius:999px!important;background:rgba(255,255,255,.045)!important;color:#cbd0d8!important;text-decoration:none;font-weight:800;cursor:pointer}.tab:hover,.toc a:hover,.filter:hover{border-color:rgba(232,182,84,.38)!important;color:#fff!important}.tab.active,.filter.active,.toc a.active{border-color:rgba(232,182,84,.58)!important;color:#1c1306!important;background:linear-gradient(135deg,#ffe3a0,#d79b36)!important}.toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin-bottom:16px}.input,.field input,.field select,select,input[type="number"],input[type="search"],input[type="text"],textarea{min-height:46px;padding:11px 13px;border:1px solid rgba(255,255,255,.14)!important;border-radius:12px!important;background:rgba(8,11,16,.72)!important;color:#fff!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.03)}.input{flex:1;min-width:210px}.field label{color:#c7ccd4!important}.status{padding:13px 15px;border:1px solid rgba(255,255,255,.12)!important;border-radius:14px!important;color:var(--muted)!important;background:rgba(8,11,16,.58)!important}.status.good,.status.ok{border-color:rgba(117,216,156,.42)!important;color:#a2e8bb!important}.status.warn{border-color:rgba(232,182,84,.48)!important;color:#ffe1a0!important}.status.bad{border-color:rgba(255,156,165,.38)!important;color:#ffb6bd!important}
.table-wrap{overflow:auto;border:1px solid rgba(255,255,255,.10)!important;border-radius:18px!important;background:rgba(8,11,16,.48)!important}.data-table,.reward-table{width:100%;border-collapse:collapse;background:transparent!important}.data-table{min-width:560px}.data-table th,.data-table td,.reward-table th,.reward-table td{padding:13px 15px;border-bottom:1px solid rgba(255,255,255,.075)!important}.data-table th,.reward-table th{position:sticky;top:0;color:#d8dce3!important;background:rgba(14,17,23,.96)!important}.data-table td:first-child{width:74px;color:var(--gold-light);font-weight:900}.empty,.result-empty{padding:28px;border:1px dashed rgba(255,255,255,.18)!important;border-radius:18px!important;color:var(--muted)!important;background:rgba(8,11,16,.42)!important;text-align:center}.pagination{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:16px}.pagination button:disabled{opacity:.4;cursor:not-allowed}
.recipe-toolbar{padding:18px!important}.recipe{overflow:hidden}.recipe summary{background:transparent!important}.recipe-meta,.recipe-bonuses,.map-note,.note{color:var(--muted)!important}.way{border-radius:16px!important;background:rgba(7,9,13,.62)!important;box-shadow:none!important}.total{padding:20px!important;border:1px solid rgba(232,182,84,.48)!important;border-radius:18px!important;background:radial-gradient(circle at 90% 10%,rgba(232,182,84,.15),transparent 44%),rgba(8,11,16,.72)!important}.total small,.number,.go,.back,.map-open,.way-title{color:var(--gold-light)!important}.total strong{color:#ffd268!important}.row{border-bottom:1px solid rgba(255,255,255,.08)!important}.row span{color:#c4c9d2!important}.badge,.interactive-badge,.card-status{border:1px solid rgba(232,182,84,.26)!important;color:var(--gold-light)!important;background:rgba(232,182,84,.07)!important}.map-link{border:1px solid rgba(255,255,255,.10)!important;border-radius:16px!important;background:rgba(255,255,255,.035)!important;transition:border-color .2s ease,background .2s ease,transform .2s ease}.map-link:hover{transform:translateY(-2px);border-color:rgba(232,182,84,.44)!important;background:rgba(232,182,84,.055)!important}
.guide-section{scroll-margin-top:calc(var(--header) + 18px)}.guide-list{margin:12px 0 0;padding-inline-start:22px}.guide-list li+li{margin-top:8px}.inline-icon{width:32px;height:32px;object-fit:contain;vertical-align:middle}.placeholder{color:#7f8792!important}.footer{padding:32px 0 42px;border-top:1px solid rgba(255,255,255,.07);color:#858d9b}.footer-row{display:flex;align-items:center;justify-content:space-between;gap:22px;flex-wrap:wrap}.footer a{color:#c8ccd3;text-decoration:none}.footer a:hover{color:#fff}.hidden{display:none!important}.tk-legacy-site-nav{display:none!important}.tk-synthetic-header>main{padding-top:calc(var(--header) + 34px)!important}[dir="rtl"] .data-table th,[dir="rtl"] .data-table td{text-align:right}[dir="rtl"] .eyebrow{letter-spacing:0!important}
@media(max-width:1060px){.nav{display:none}.menu-toggle{display:grid}.card.third{grid-column:span 6}}
@media(max-width:680px){:root{--header:68px;--radius:20px}.shell{width:min(100% - 32px,1200px)}.topbar-inner{min-height:var(--header)}.brand{gap:9px;font-size:13px}.brand img{width:38px;height:38px}.brand img.tk-clan-crest{width:50px;height:50px}.menu-toggle{width:43px;height:43px}.languages button{min-width:32px;padding:6px 4px}.page-head{padding:calc(var(--header) + 48px) 0 26px}.eyebrow,.kicker{margin-bottom:13px;font-size:10px!important;letter-spacing:.18em!important}h1{font-size:clamp(42px,13.5vw,60px)!important;line-height:.95!important}.lead,.hint{font-size:16px}.content{padding:20px 0 58px}.card,.card.third{grid-column:1/-1;padding:20px;border-radius:20px!important}.game-icon{width:58px;height:58px}.actions .button,.toolbar .button{width:100%}.toolbar{align-items:stretch}.input{width:100%}.data-table th,.data-table td,.reward-table th,.reward-table td{padding:11px 12px}.tk-synthetic-header>main{padding-top:calc(var(--header) + 22px)!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important;animation:none!important}}


/* TK FLOWING BACKGROUND 2026-09 */
body.tk-main-theme{
  position:relative;
  background:#07080b!important;
  background-attachment:fixed!important;
}
body.tk-main-theme:before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(5,7,10,.18) 0%,rgba(5,7,10,.46) 22%,rgba(7,8,11,.82) 48%,#07080b 78%),
    radial-gradient(ellipse at 72% 8%,rgba(232,182,84,.20),transparent 34%),
    url("home/top-king-clan-hero-approved.jpg") 58% top / min(1500px,118vw) auto no-repeat,
    #07080b;
  opacity:.72;
  transform:translateZ(0);
}
body.tk-main-theme:after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 12% 28%,rgba(232,182,84,.07),transparent 30%),
    radial-gradient(ellipse at 88% 62%,rgba(255,227,160,.035),transparent 34%),
    linear-gradient(180deg,transparent 0%,rgba(7,8,11,.14) 20%,rgba(7,8,11,.56) 46%,rgba(7,8,11,.94) 86%,#07080b 100%);
}
body.tk-main-theme main,
body.tk-main-theme .content,
body.tk-main-theme .section{
  background:transparent!important;
}
body.tk-main-theme .page-head{
  isolation:isolate;
}
body.tk-main-theme .page-head:before{
  content:"";
  position:absolute;
  z-index:-1;
  left:-18vw;
  right:-18vw;
  top:0;
  bottom:-72px;
  pointer-events:none;
  background:
    radial-gradient(ellipse at 50% 18%,rgba(7,8,11,.08),transparent 34%),
    linear-gradient(180deg,rgba(7,8,11,.08),rgba(7,8,11,.20) 55%,transparent);
}
body.tk-main-theme .card,
body.tk-main-theme .panel,
body.tk-main-theme .recipe-toolbar,
body.tk-main-theme .recipe,
body.tk-main-theme .exact-card{
  background:
    radial-gradient(circle at 92% 4%,rgba(232,182,84,.10),transparent 31%),
    linear-gradient(145deg,rgba(18,22,29,.80),rgba(8,11,16,.74))!important;
  border-color:rgba(255,255,255,.11)!important;
  box-shadow:0 18px 55px rgba(0,0,0,.18)!important;
  backdrop-filter:blur(18px) saturate(120%);
  -webkit-backdrop-filter:blur(18px) saturate(120%);
}
@media(max-width:680px){
  body.tk-main-theme:before{
    background:
      linear-gradient(180deg,rgba(5,7,10,.16) 0%,rgba(5,7,10,.44) 24%,rgba(7,8,11,.80) 48%,#07080b 76%),
      radial-gradient(ellipse at 65% 4%,rgba(232,182,84,.18),transparent 30%),
      url("home/top-king-clan-hero-approved.jpg") 56% top / auto 360px no-repeat,
      #07080b;
    opacity:.68;
  }
  body.tk-main-theme:after{
    background:
      linear-gradient(180deg,rgba(7,8,11,.02) 0%,rgba(7,8,11,.18) 19%,rgba(7,8,11,.56) 38%,rgba(7,8,11,.90) 65%,#07080b 100%),
      radial-gradient(ellipse at 50% 8%,rgba(232,182,84,.08),transparent 34%);
  }
  body.tk-main-theme .page-head{
    padding:calc(var(--header) + 34px) 0 22px;
  }
  body.tk-main-theme h1{
    max-width:94%;
    font-size:clamp(34px,10.8vw,46px)!important;
    line-height:1!important;
    letter-spacing:-.045em!important;
  }
  body.tk-main-theme .lead,
  body.tk-main-theme .hint{
    margin-top:15px;
    font-size:15px!important;
    line-height:1.52;
  }
  body.tk-main-theme .content{
    padding-top:14px;
  }
  body.tk-main-theme .card,
  body.tk-main-theme .panel,
  body.tk-main-theme .recipe-toolbar,
  body.tk-main-theme .recipe,
  body.tk-main-theme .exact-card{
    border-radius:19px!important;
    background:
      radial-gradient(circle at 96% 0%,rgba(232,182,84,.09),transparent 28%),
      linear-gradient(145deg,rgba(17,21,28,.76),rgba(8,11,16,.70))!important;
  }
}

html,body{max-width:100%;overflow-x:clip}.shell{max-width:100%}
@media(max-width:680px){
  .shell{width:calc(100% - 24px)!important}
  #dashboard,.cab-panel,.cab-card,.player-stats-card,.clan-mirror,.mirror-stage,.mirror-branch-content,.mirror-ranking,.player-stat,.player-detail,.branch-grid{min-width:0!important;max-width:100%!important}
  .player-stats-card{overflow:visible!important}
  .player-summary,.player-name,.player-name strong{min-width:0!important;max-width:100%!important}
  .player-name strong{white-space:normal!important;overflow:visible!important;text-overflow:clip!important;overflow-wrap:anywhere!important}
  .branch-grid{grid-template-columns:repeat(auto-fit,minmax(min(220px,100%),1fr))!important}
  .cab-tabs{max-width:100%;overflow-x:auto;overscroll-behavior-inline:contain}
  .mirror-row{grid-template-columns:minmax(0,1fr) max-content!important}
}
@media(max-width:430px){
  .mirror-row{grid-template-columns:1fr!important}
  .mirror-row b{justify-self:start}
  .stats-head h2,.mirror-branch-head h3{overflow-wrap:anywhere}
}
