/* ===== Fart Together theme — sunny lagoon, lime fart clouds, chunky cartoon outlines ===== */
:root{
  --c-bg:#0a3866;
  --c-panel:#0f4c86;
  --c-panel2:#145a9a;
  --c-panel3:#1b6bb2;
  --c-text:#ffffff;
  --c-muted:#b7dcf8;
  --c-accent:#b6f01f;
  --c-accent-text:#16300a;
  --ft-ink:#062546;
  --ft-sky:#7fd3ff;
  --ft-sky2:#3fb1f2;
  --ft-lime:#b6f01f;
  --ft-lime-hi:#dcff5c;
  --ft-lime-lo:#7cc404;
  --ft-orange:#ff9a3d;
  --ft-orange-hi:#ffbf6e;
  --ft-peach:#ffc9a0;
  --ft-pink:#ff9db3;
  --hub-gold:#ffb04a;
  --hub-line:rgba(6,37,70,.85);
  --hub-line-2:rgba(6,37,70,.95);
  --hub-r:20px;
  --hub-glow:0 0 0 3px var(--ft-lime),0 10px 0 var(--ft-ink);
  --ft-pop:0 5px 0 var(--ft-ink);
  --ft-hl:inset 0 2px 0 rgba(255,255,255,.14);
  --ft-cloud:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 34 26'%3E%3Cpath d='M9 22a6.5 6.5 0 0 1-1.3-12.9A8 8 0 0 1 22.6 6.4 6 6 0 0 1 29 15a4.4 4.4 0 0 1-1.6 7z' fill='%23b6f01f' stroke='%23062546' stroke-width='2.6' stroke-linejoin='round'/%3E%3Ccircle cx='13' cy='12' r='2' fill='%23e4ff7a'/%3E%3C/svg%3E");
}

/* ---------- page background: deep lagoon with soft ripples ---------- */
body.tpl-hub{
  background-color:var(--c-bg);
  background-image:
    radial-gradient(900px 420px at 50% -120px,rgba(127,211,255,.35),transparent 70%),
    url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='60' viewBox='0 0 160 60'%3E%3Cpath d='M0 20q20-10 40 0t40 0 40 0 40 0M0 50q20-10 40 0t40 0 40 0 40 0' fill='none' stroke='%23ffffff' stroke-opacity='.045' stroke-width='3' stroke-linecap='round'/%3E%3C/svg%3E"),
    linear-gradient(180deg,#0c4a86 0%,#0a3866 45%,#082d55 100%);
  background-attachment:fixed,scroll,fixed;
  color:var(--c-text);
}
body.tpl-hub a{color:var(--ft-lime);}
body.tpl-hub a:hover{color:var(--ft-lime-hi);}
body.tpl-hub ::selection{background:var(--ft-lime);color:var(--ft-ink);}
body.tpl-hub :focus-visible{outline:3px solid var(--ft-lime);outline-offset:2px;}

/* ---------- top bar: bright sky like the game's capsule art ---------- */
body.tpl-hub .header{
  background:linear-gradient(180deg,#8fdbff 0%,#4cbcf6 55%,#2aa3ec 100%);
  border-bottom:4px solid var(--ft-ink);
  box-shadow:0 6px 0 rgba(6,37,70,.35);
}
body.tpl-hub .header .logo img{filter:drop-shadow(0 3px 0 rgba(6,37,70,.55));}
body.tpl-hub .text-logo{color:#fff;text-shadow:2px 2px 0 var(--ft-ink),-2px 2px 0 var(--ft-ink),2px -2px 0 var(--ft-ink),-2px -2px 0 var(--ft-ink),0 4px 0 var(--ft-ink);}
body.tpl-hub .text-logo b{color:var(--ft-lime);}
body.tpl-hub .search-input{
  background:#fff;color:var(--ft-ink);
  border:3px solid var(--ft-ink);
  box-shadow:inset 0 3px 0 rgba(6,37,70,.12),0 4px 0 rgba(6,37,70,.45);
  font-weight:700;
  max-width:none;
}
body.tpl-hub .search-input::placeholder{color:#5a7fa3;font-weight:600;}
body.tpl-hub .search-input:focus{border-color:var(--ft-ink);box-shadow:0 0 0 4px rgba(182,240,31,.75),0 4px 0 rgba(6,37,70,.45);}
body.tpl-hub .btn-search{top:3px;right:3px;width:36px;height:36px;background:var(--ft-lime);border:2px solid var(--ft-ink);}
body.tpl-hub .btn-search:hover{background:var(--ft-lime-hi);}
body.tpl-hub .btn-search::before{background:var(--ft-ink);}
body.tpl-hub .hub-random{
  background:linear-gradient(180deg,var(--ft-orange-hi),var(--ft-orange));
  color:var(--ft-ink);
  border:3px solid var(--ft-ink);
  border-radius:14px;
  box-shadow:0 4px 0 var(--ft-ink);
  font-weight:900;
  transition:transform .15s,box-shadow .15s;
}
body.tpl-hub .hub-random:hover{background:linear-gradient(180deg,#ffd08e,var(--ft-orange-hi));color:var(--ft-ink);border-color:var(--ft-ink);transform:translateY(-2px);box-shadow:0 6px 0 var(--ft-ink);}
body.tpl-hub .hub-random:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ft-ink);}
body.tpl-hub .hub-random svg{color:var(--ft-ink);}
body.tpl-hub .btn-menu{background:#fff;border:3px solid var(--ft-ink);box-shadow:0 3px 0 var(--ft-ink);}
body.tpl-hub .btn-menu .hamburger span{background:var(--ft-ink);height:3px;}

/* ---------- left rail: colorful bubble icons ---------- */
body.tpl-hub .header .menu nav{background:linear-gradient(180deg,#0f4c86,#0a3866);border-right:4px solid var(--ft-ink);}
body.tpl-hub .header .menu ul li a{padding:0 7px;height:50px;font-weight:800;color:#fff;border-radius:14px;}
body.tpl-hub .header .menu ul li a:hover,body.tpl-hub .header .menu ul li:hover > a{background:rgba(255,255,255,.1);color:#fff;}
body.tpl-hub .header .menu ul li a .menu-icon{
  flex:0 0 auto;box-sizing:content-box;width:20px;height:20px;padding:5px;
  border:2px solid var(--ft-ink);border-radius:12px;
  background:var(--ft-lime);color:var(--ft-ink);
  box-shadow:0 3px 0 var(--ft-ink);
  stroke-width:2.4;
  transition:transform .15s;
}
body.tpl-hub .header .menu > nav > ul > li:nth-child(4n+2) > a .menu-icon{background:var(--ft-orange);}
body.tpl-hub .header .menu > nav > ul > li:nth-child(4n+3) > a .menu-icon{background:var(--ft-sky);}
body.tpl-hub .header .menu > nav > ul > li:nth-child(4n+4) > a .menu-icon{background:var(--ft-pink);}
body.tpl-hub .header .menu ul li a:hover .menu-icon{transform:translateY(-2px) rotate(-6deg);}
body.tpl-hub .header .menu .dropdown_first li a{color:var(--c-muted);height:38px;padding:0 13px;}
body.tpl-hub .header .menu .dropdown_first li a:hover{color:var(--ft-lime);background:rgba(255,255,255,.08);}
@media (min-width:1024px){
  body.tpl-hub .header .menu nav:hover,body.tpl-hub .header .menu nav:focus-within{box-shadow:10px 0 0 rgba(6,37,70,.35);}
}

/* ---------- shared panel look: cartoon sticker ---------- */
body.tpl-hub .game-offer__window,
body.tpl-hub .similiar-games,
body.tpl-hub .character-games,
body.tpl-hub .game-offer__description,
body.tpl-hub .hub-info{
  border:3px solid var(--ft-ink) !important;
  border-radius:var(--hub-r) !important;
  box-shadow:var(--ft-hl),0 7px 0 var(--ft-ink) !important;
}
body.tpl-hub .similiar-games,body.tpl-hub .character-games,body.tpl-hub .game-offer__description{background:var(--c-panel);}
body.tpl-hub .hub-merged .hub-info{border:0 !important;box-shadow:none !important;border-radius:0 !important;border-bottom:3px dashed rgba(127,211,255,.35) !important;}

/* ---------- section titles: white, ink-outlined, fart-cloud marker ---------- */
body.tpl-hub .block-title,
body.tpl-hub .block-title h1,
body.tpl-hub .hub-info__title,
body.tpl-hub .game-offer__description h2{
  color:#fff;font-weight:900;
  text-shadow:2px 2px 0 var(--ft-ink),-2px 2px 0 var(--ft-ink),2px -2px 0 var(--ft-ink),-2px -2px 0 var(--ft-ink),0 2px 0 var(--ft-ink),2px 0 0 var(--ft-ink),-2px 0 0 var(--ft-ink),0 -2px 0 var(--ft-ink),0 5px 0 var(--ft-ink);
  letter-spacing:.005em;
}
body.tpl-hub .block-title *{font-weight:900;}
body.tpl-hub .similiar-games .block-title::before,
body.tpl-hub .character-games .block-title::before{
  width:34px;height:26px;border-radius:0;
  background:var(--ft-cloud) center/contain no-repeat;
}

/* ---------- player ---------- */
body.tpl-hub .game-offer__window{background:#0a3866;}
body.tpl-hub .player-overlay::before{filter:blur(22px) brightness(.85) saturate(1.35);}
body.tpl-hub .player-overlay::after{background:radial-gradient(60% 55% at 50% 115%,rgba(182,240,31,.35),transparent),radial-gradient(75% 75% at 50% 45%,transparent,rgba(6,37,70,.55));}
body.tpl-hub .player-overlay-image img{
  border:4px solid #fff;border-radius:26px;
  box-shadow:0 0 0 4px var(--ft-ink),0 10px 0 4px var(--ft-ink),0 26px 40px -10px rgba(0,0,0,.6);
}
body.tpl-hub .player-overlay-name{
  font-weight:900;color:#fff;
  text-shadow:3px 3px 0 var(--ft-ink),-3px 3px 0 var(--ft-ink),3px -3px 0 var(--ft-ink),-3px -3px 0 var(--ft-ink),0 3px 0 var(--ft-ink),3px 0 0 var(--ft-ink),-3px 0 0 var(--ft-ink),0 -3px 0 var(--ft-ink),0 7px 0 var(--ft-ink);
}
body.tpl-hub .player-overlay__start{
  background:linear-gradient(180deg,var(--ft-lime-hi) 0%,var(--ft-lime) 55%,var(--ft-lime-lo) 100%) !important;
  color:var(--ft-ink) !important;
  border:4px solid var(--ft-ink) !important;
  border-radius:999px !important;
  box-shadow:inset 0 3px 0 rgba(255,255,255,.55),0 7px 0 var(--ft-ink) !important;
  font-weight:900 !important;text-transform:uppercase;letter-spacing:.04em;
  text-shadow:0 1px 0 rgba(255,255,255,.5);
  animation:ft-bob 2.4s ease-in-out infinite;
}
body.tpl-hub .player-overlay__start:hover{transform:translateY(-3px) scale(1.04);box-shadow:inset 0 3px 0 rgba(255,255,255,.55),0 0 0 8px rgba(182,240,31,.35),0 10px 0 var(--ft-ink) !important;animation-play-state:paused;}
body.tpl-hub .player-overlay__start:active{transform:translateY(4px);box-shadow:inset 0 3px 0 rgba(255,255,255,.55),0 2px 0 var(--ft-ink) !important;}
@keyframes ft-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-4px)}}
body.tpl-hub .hub-bar{background:var(--c-panel);border-top:3px solid var(--ft-ink);}
body.tpl-hub .hub-bar__name{font-weight:900;}
body.tpl-hub .hub-ibtn,body.tpl-hub .btn-fullscreen,body.tpl-hub .like-dislike{
  background:var(--c-panel2);color:#fff;border:3px solid var(--ft-ink);border-radius:14px;box-shadow:0 3px 0 var(--ft-ink);
}
body.tpl-hub .hub-ibtn:hover,body.tpl-hub .btn-fullscreen:hover{background:var(--ft-lime);color:var(--ft-ink);border-color:var(--ft-ink);}
body.tpl-hub .like-dislike hr{background:rgba(6,37,70,.9);}
body.tpl-hub .ld-btn{color:#fff;}
body.tpl-hub .ld-btn:hover,body.tpl-hub .ld-btn.active{color:var(--ft-lime);}
body.tpl-hub .hub-toast{background:var(--ft-lime);color:var(--ft-ink);border:3px solid var(--ft-ink);box-shadow:0 4px 0 var(--ft-ink);}

/* ---------- game cards ---------- */
body.tpl-hub .game-card,
body.tpl-hub .similiar-games .game-card{
  background:var(--c-panel2);
  border:3px solid var(--ft-ink);
  border-radius:18px;
  box-shadow:var(--ft-pop);
  transition:transform .18s,box-shadow .18s;
}
body.tpl-hub .game-card:hover{transform:translateY(-5px) rotate(-1deg);border-color:var(--ft-ink);box-shadow:var(--hub-glow);}
body.tpl-hub .game-card .thumb{border-bottom:3px solid var(--ft-ink);}
body.tpl-hub .game-card .name{font-weight:900;}
body.tpl-hub .game-card .name a{color:#fff;}
body.tpl-hub .game-card:hover .name a{color:var(--ft-lime);}

/* ---------- right column tiles ---------- */
body.tpl-hub .character-games__list ul li a{border:3px solid var(--ft-ink);border-radius:16px;box-shadow:0 4px 0 var(--ft-ink);}
body.tpl-hub .character-games__list ul li a:hover{border-color:var(--ft-ink);transform:translateY(-4px) rotate(1deg);box-shadow:var(--hub-glow);}
body.tpl-hub .character-name{background:linear-gradient(180deg,transparent,rgba(6,37,70,.92));}
body.tpl-hub .character-name span{font-weight:900;text-shadow:0 2px 0 var(--ft-ink);}
body.tpl-hub .character-games__list li a:hover .character-name{background:linear-gradient(180deg,transparent,rgba(124,196,4,.95));}
body.tpl-hub .character-games__list li a:hover .character-name span{color:var(--ft-ink);text-shadow:0 1px 0 rgba(255,255,255,.4);}

/* ---------- info card: stats + tags ---------- */
body.tpl-hub .hub-info__img img{border:3px solid var(--ft-ink);border-radius:20px;box-shadow:0 5px 0 var(--ft-ink);}
body.tpl-hub .hub-stats{background:var(--c-panel2);border:3px solid var(--ft-ink);border-radius:14px;box-shadow:0 4px 0 var(--ft-ink);}
body.tpl-hub .hub-stat{border-right:3px solid var(--ft-ink);}
body.tpl-hub .hub-stat:last-child{border-right:0;}
body.tpl-hub .hub-info .hub-stat b,body.tpl-hub .hub-info .hub-stat b a{color:#fff;}
body.tpl-hub .hub-stat b a:hover{color:var(--ft-lime);}
body.tpl-hub .hub-stat small{color:var(--ft-sky);}
body.tpl-hub .hub-tags li{padding:0 !important;}
body.tpl-hub .hub-tags li::before{display:none !important;}
body.tpl-hub .hub-tags a{background:var(--ft-orange);color:var(--ft-ink) !important;border:3px solid var(--ft-ink);box-shadow:0 3px 0 var(--ft-ink);font-weight:900;text-decoration:none !important;}
body.tpl-hub .hub-tags li:nth-child(3n+2) a{background:var(--ft-sky);}
body.tpl-hub .hub-tags li:nth-child(3n+3) a{background:var(--ft-pink);}
body.tpl-hub .hub-tags a:hover{background:var(--ft-lime);color:var(--ft-ink);border-color:var(--ft-ink);transform:translateY(-2px);}
body.tpl-hub .hub-tags em{color:var(--ft-ink);opacity:.7;font-weight:900;}
body.tpl-hub .hub-pill{background:var(--ft-lime);color:var(--ft-ink);border:3px solid var(--ft-ink);box-shadow:0 3px 0 var(--ft-ink);}

/* ---------- article text ---------- */
body.tpl-hub .game-offer__description{color:#fff;}
body.tpl-hub .game-offer__description p,
body.tpl-hub .game-offer__description ul,
body.tpl-hub .game-offer__description ol{color:#e3f2ff;}
body.tpl-hub .game-offer__description a{color:var(--ft-lime);text-decoration-color:rgba(182,240,31,.5);text-decoration-thickness:2px;}
body.tpl-hub .game-offer__description b,body.tpl-hub .game-offer__description strong{color:var(--ft-peach);}
body.tpl-hub .game-offer__description h2{
  display:flex;align-items:center;gap:12px;
  border-left:0;padding-left:0;
}
body.tpl-hub .game-offer__description h2::before{
  content:"";flex:none;width:40px;height:30px;
  background:var(--ft-cloud) center/contain no-repeat;
  filter:drop-shadow(0 3px 0 var(--ft-ink));
}
body.tpl-hub .game-offer__description h3{
  color:var(--ft-orange-hi);
  text-shadow:2px 2px 0 var(--ft-ink),-2px 2px 0 var(--ft-ink),2px -2px 0 var(--ft-ink),-2px -2px 0 var(--ft-ink),0 4px 0 var(--ft-ink);
}
body.tpl-hub .game-offer__description ul li::before{
  left:.05em;top:.42em;width:.72em;height:.72em;border-radius:50%;transform:none;
  background:radial-gradient(circle at 35% 35%,var(--ft-lime-hi),var(--ft-lime) 60%,var(--ft-lime-lo));
  border:2px solid var(--ft-ink);
}
body.tpl-hub .game-offer__description ol{counter-reset:ft;list-style:none;padding-left:0;}
body.tpl-hub .game-offer__description ol > li{counter-increment:ft;position:relative;padding-left:2.2em;margin:.55em 0;}
body.tpl-hub .game-offer__description ol > li::before{
  content:counter(ft);position:absolute;left:0;top:.05em;
  width:1.55em;height:1.55em;display:flex;align-items:center;justify-content:center;
  background:var(--ft-orange);color:var(--ft-ink);border:2px solid var(--ft-ink);border-radius:50%;
  box-shadow:0 2px 0 var(--ft-ink);font:900 .82em/1 var(--hub-font);
}
body.tpl-hub .game-offer__description img{border:3px solid var(--ft-ink);border-radius:18px;box-shadow:0 6px 0 var(--ft-ink);}
body.tpl-hub .game-offer__description table{background:var(--c-panel2);border:3px solid var(--ft-ink);border-radius:16px;box-shadow:0 5px 0 var(--ft-ink);}
body.tpl-hub .game-offer__description th,body.tpl-hub .game-offer__description td{border-bottom:2px solid rgba(6,37,70,.7);}
body.tpl-hub .game-offer__description thead th,body.tpl-hub .game-offer__description thead td,body.tpl-hub .game-offer__description .pp-table-head{background:var(--ft-lime);color:var(--ft-ink);font-weight:900;}
body.tpl-hub .game-offer__description table th[scope=row]{background:#0d4378;color:var(--ft-sky);font-weight:900;border-right:2px solid rgba(6,37,70,.7);}
body.tpl-hub .game-offer__description table tr:nth-child(even) td{background:rgba(255,255,255,.05);}
body.tpl-hub .game-offer__description .pp-rule,
body.tpl-hub .game-offer__description .pp-tip,
body.tpl-hub .game-offer__description .pp-quote,
body.tpl-hub .game-offer__description .pp-faq-item,
body.tpl-hub .game-offer__description .pp-controls{
  border:3px solid var(--ft-ink) !important;border-radius:16px;box-shadow:0 5px 0 var(--ft-ink);
}
body.tpl-hub .game-offer__description .pp-quote{background:var(--c-panel2);border-left:10px solid var(--ft-orange) !important;color:#fff;}
body.tpl-hub .game-offer__description .pp-quote p{color:#fff;}
body.tpl-hub .game-offer__description .pp-quote::before{color:var(--ft-orange);}
body.tpl-hub .game-offer__description .pp-tip{background:rgba(182,240,31,.12);border-left:10px solid var(--ft-lime) !important;}
body.tpl-hub .game-offer__description .pp-tip::before{background-color:var(--ft-lime);}
body.tpl-hub .game-offer__description .pp-rule{background:rgba(127,211,255,.12);}
body.tpl-hub .game-offer__description .pp-faq-item{background:var(--c-panel2);}
body.tpl-hub .game-offer__description .pp-faq-item::before{color:var(--ft-lime);}
body.tpl-hub .game-offer__description .pp-controls li b,body.tpl-hub kbd{background:#fff;color:var(--ft-ink);border:2px solid var(--ft-ink);box-shadow:0 3px 0 var(--ft-ink);border-radius:9px;}
body.tpl-hub .game-offer__description .pp-toc{background:var(--c-panel2);border:3px solid var(--ft-ink);border-radius:16px;box-shadow:0 5px 0 var(--ft-ink);}
body.tpl-hub .game-offer__description .pp-toc li::before{background:var(--ft-sky);}
body.tpl-hub .game-offer__description hr,body.tpl-hub .pp-rule-line{height:4px;border-radius:4px;background:repeating-linear-gradient(90deg,var(--ft-lime) 0 14px,transparent 14px 24px);opacity:.6;}
body.tpl-hub .game-offer__description .breadcrumbs{border-bottom:3px dashed rgba(127,211,255,.35);}
body.tpl-hub .game-offer__description .breadcrumbs a{color:var(--ft-sky);}
body.tpl-hub .game-offer__description .breadcrumbs a:hover{color:var(--ft-lime);}

/* ---------- pagination ---------- */
body.tpl-hub .pagination li a,body.tpl-hub .pagination li span{background:var(--c-panel2);color:#fff;border:3px solid var(--ft-ink);border-radius:12px;box-shadow:0 3px 0 var(--ft-ink);}
body.tpl-hub .pagination li.active a,body.tpl-hub .pagination li.active span,body.tpl-hub .pagination li a:hover{background:var(--ft-lime);color:var(--ft-ink);}

/* ---------- footer: sandy-orange bank like the river edges ---------- */
body.tpl-hub .footer{
  position:relative;
  background:linear-gradient(180deg,#0b3c6e,#072a4f);
  border-top:4px solid var(--ft-ink);
  box-shadow:inset 0 6px 0 rgba(127,211,255,.12);
}
body.tpl-hub .footer .privacy a{color:var(--c-muted);font-weight:800;}
body.tpl-hub .footer .privacy a:hover{color:var(--ft-lime);}
body.tpl-hub .footer .foot-note,body.tpl-hub .footer .foot-disclaimer{color:var(--c-muted);}
body.tpl-hub .footer .foot-disclaimer{border-top:2px dashed rgba(127,211,255,.25);}

/* ---------- back-to-top + scrollbars ---------- */
.to-top{background:var(--ft-lime) !important;color:var(--ft-ink) !important;border:3px solid var(--ft-ink) !important;box-shadow:0 4px 0 var(--ft-ink) !important;}
.to-top:hover{background:var(--ft-lime-hi) !important;}
body.tpl-hub ::-webkit-scrollbar{background:#072a4f;}
body.tpl-hub ::-webkit-scrollbar-thumb{background:var(--ft-sky2);border:2px solid #072a4f;}

/* ---------- mobile ---------- */
@media (max-width:767px){
  body.tpl-hub .player-overlay-name{text-shadow:2px 2px 0 var(--ft-ink),-2px 2px 0 var(--ft-ink),2px -2px 0 var(--ft-ink),-2px -2px 0 var(--ft-ink),0 2px 0 var(--ft-ink),2px 0 0 var(--ft-ink),-2px 0 0 var(--ft-ink),0 -2px 0 var(--ft-ink),0 4px 0 var(--ft-ink);}
  body.tpl-hub .block-title,body.tpl-hub .block-title h1,body.tpl-hub .hub-info__title,body.tpl-hub .game-offer__description h2{text-shadow:2px 2px 0 var(--ft-ink),-2px 2px 0 var(--ft-ink),2px -2px 0 var(--ft-ink),-2px -2px 0 var(--ft-ink),0 3px 0 var(--ft-ink);}
  body.tpl-hub .game-card,body.tpl-hub .similiar-games .game-card{border-radius:14px;}
  body.tpl-hub .game-offer__description h2::before{width:32px;height:24px;}
  body.tpl-hub .player-overlay__start{padding:13px 30px !important;min-width:170px !important;}
}
@media (prefers-reduced-motion:reduce){body.tpl-hub .player-overlay__start{animation:none;}}