/* Homepage-only UI: theme toggle, dark theme, splash, mobile section trimming. */
.site-header nav{margin-left:auto}
.theme-toggle{display:grid;place-items:center;width:44px;height:44px;min-height:44px;padding:0;font:900 22px/1 Impact,sans-serif;letter-spacing:.02em;color:var(--brand-ink);background:var(--comic-yellow,#ffce83);border:2px solid var(--comic-ink);box-shadow:3px 3px 0 var(--comic-ink);cursor:pointer;white-space:nowrap}
.theme-toggle:hover{translate:0 -2px}
.theme-toggle:focus-visible{outline:3px solid var(--brand-coral);outline-offset:4px}

.player-note{font-size:16px;line-height:1.55;margin:0 0 16px;padding:12px 16px;border:3px solid var(--comic-ink);background:var(--brand-paper);color:var(--brand-ink);box-shadow:4px 4px 0 var(--comic-ink)}
.player-note b{color:#a7332d}

[data-theme=dark]{color-scheme:dark}
[data-theme=dark] body{color:var(--brand-paper);background:radial-gradient(circle,#f3ecd90d 1px,transparent 1.2px) 0 0/7px 7px,var(--brand-navy)}
[data-theme=dark] :is(.section-heading>p,.catalog-status,.site-footer,.site-footer p){color:#c6cfdd}
[data-theme=dark] .section-heading h2,[data-theme=dark] .site-footer .brand{color:var(--brand-paper)}
[data-theme=dark] :is(.section-heading h2 span,.site-footer .brand span){color:var(--brand-coral)}
[data-theme=dark] .site-footer{border-top-color:#f3ecd955}
[data-theme=dark] .site-footer a{color:var(--brand-paper)}
[data-theme=dark] :is(.site-header,.video-card,.games .game-card,.subscriber-counter,.comic-panel,.journey-strip,.player-note){box-shadow:7px 7px 0 #000}
[data-theme=dark] .site-header{border-color:#f3ecd955}

.splash{display:none}
.show-splash .splash{display:grid;place-items:center;position:fixed;inset:0;z-index:100;pointer-events:none;background:var(--brand-navy);animation:splash-out .45s ease-in .85s forwards}
.splash-inner{display:grid;justify-items:center;gap:14px;position:relative;animation:splash-pop .55s cubic-bezier(.16,1,.3,1) both}
.splash-inner img{width:84px;height:84px;border:3px solid var(--comic-ink);box-shadow:5px 5px 0 #000;border-radius:16px}
.splash-inner strong{font:900 clamp(30px,7vw,52px)/1 Impact,sans-serif;color:var(--brand-paper);letter-spacing:.03em;text-shadow:3px 3px 0 #000}
.splash-inner strong span{color:var(--brand-coral)}
.splash-ball{position:absolute;top:-34px;right:-30px;width:30px;height:30px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#ffb37a,#e8682c 60%,#b8481a);border:2px solid var(--comic-ink);animation:splash-bounce .42s ease-in infinite alternate}
@keyframes splash-pop{from{opacity:0;scale:.7;rotate:-6deg}to{opacity:1;scale:1;rotate:0deg}}
@keyframes splash-bounce{from{translate:0 -18px}to{translate:0 22px}}
@keyframes splash-out{to{opacity:0;visibility:hidden}}

@media(max-width:650px){
  .site-header .nav-story,#kanal{display:none!important}
  .site-header .theme-toggle{order:1;margin-left:auto}
  .site-header.nav-enhanced .nav-toggle{order:2;margin-left:0}
  .site-header nav{order:3}
  .player-note{font-size:15px}
}
@media(prefers-reduced-motion:reduce){.show-splash .splash{display:none}}
@media(max-width:380px){.theme-toggle{width:38px;font-size:18px}.site-header.nav-enhanced{column-gap:6px}.site-header .nav-toggle{padding:8px 7px}}
/* Video cards keep their hover wiggle running until the pointer leaves (skipped while a player is open). */
@media(hover:hover) and (prefers-reduced-motion:no-preference){
  .video-card:not(:has(.video-player>iframe)):hover{animation:button-hover .65s ease-in-out infinite}
  .video-card:hover .video-launch:hover{animation:none}
}
.featured-image picture{display:block}
.comments-panel .comment-source{margin:30px 0 0}
.comment-source{display:flex;align-items:center;flex-wrap:wrap;gap:6px 10px}
.comment-yt{display:inline-flex;flex-shrink:0;padding:2px;text-decoration:none}
.comment-yt img{display:block;width:90px;height:auto}