/* ViralScope Hub polish: navy + neon cyan, shared chrome, games, tools. */
:root{--bg:#f4f8fb;--fg:#07111f;--muted:#3e5568;--card:#fff;--soft:#e7f1f6;--border:#d3e2ec;--primary:#0e7490;--primary-h:#155e75;--on-primary:#fff;--good:#0f766e;--bad:#9f1239;--warn:#9a3412;--shadow:0 1px 2px rgba(7,17,31,.06),0 10px 28px rgba(7,17,31,.06);--vsh-navy:#06101c;--vsh-cyan:#22e7ff;--vsh-ink:#04121c}
:root[data-theme=dark]{--bg:#06101c;--fg:#e7f6fb;--muted:#9ec3d1;--card:#0c1c2e;--soft:#12283a;--border:#1e3d52;--primary:#22e7ff;--primary-h:#8ef6ff;--on-primary:#04121c;--good:#5eead4;--bad:#fda4af;--warn:#fdba74;--shadow:0 1px 2px rgba(0,0,0,.35)}
@media (prefers-color-scheme:dark){:root:not([data-theme=light]){--bg:#06101c;--fg:#e7f6fb;--muted:#9ec3d1;--card:#0c1c2e;--soft:#12283a;--border:#1e3d52;--primary:#22e7ff;--primary-h:#8ef6ff;--on-primary:#04121c;--good:#5eead4;--bad:#fda4af;--warn:#fdba74}}
html{scroll-behavior:smooth}
body{font-family:"Segoe UI",ui-sans-serif,system-ui,-apple-system,sans-serif;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
h1,h2,h3{text-wrap:balance;letter-spacing:-.02em}
p,.prose{text-wrap:pretty}
:focus-visible{outline:2px solid var(--vsh-cyan);outline-offset:2px}
.skip,.skip-link{position:absolute;left:12px;top:-40px;background:var(--vsh-cyan);color:var(--vsh-ink);padding:8px 12px;z-index:10000;border-radius:8px;font-weight:700}
.skip:focus,.skip-link:focus{top:12px}
.site-header{background:var(--vsh-navy);color:#e7f6fb;border-bottom:1px solid rgba(34,231,255,.28);position:sticky;top:0;z-index:40}
.site-header .logo-text,.site-header #site-nav a,.site-header .icon-btn{color:#e7f6fb}
.site-header #site-nav a:hover{background:rgba(34,231,255,.12);color:#fff}
.site-header .icon-btn{border-color:rgba(34,231,255,.35)}
.vsh-hex{color:var(--vsh-cyan);display:block;flex:0 0 auto}
.logo{display:inline-flex;align-items:center;gap:10px;color:#e7f6fb;text-decoration:none}
.site-footer,footer.site-foot{background:#041018;color:#c5dde6}
.site-footer a,footer.site-foot a{color:#8ef6ff}
.vsh-sitenav{background:#041018;border-bottom:1px solid rgba(34,231,255,.2)}
.vsh-sitenav ul{list-style:none;display:flex;flex-wrap:wrap;gap:6px 14px;margin:0 auto;padding:8px 16px;max-width:1100px}
.vsh-sitenav a{color:#d7f7ff;text-decoration:none;font-weight:650;font-size:.92rem;min-height:44px;display:inline-flex;align-items:center}
.vsh-sitenav a[aria-current="page"]{color:var(--vsh-cyan)}
@media (max-width:900px){
  header.site-header .menu-btn{display:inline-flex!important;align-items:center;justify-content:center;min-width:44px;min-height:44px}
  header.site-header #site-nav{display:none;position:absolute;left:0;right:0;top:100%;background:#07111f;border-bottom:1px solid rgba(34,231,255,.3);flex-direction:column;padding:8px 12px 14px;z-index:50;max-height:calc(100vh - 64px);overflow:auto}
  header.site-header #site-nav.open{display:flex}
  header.site-header #site-nav a{min-height:44px;display:flex;align-items:center;padding:10px 12px}
  .top .nav-toggle{display:inline-flex}
  .top-nav{display:none}
  .top-nav.open{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:100%;background:#07111f;padding:8px 12px 14px;z-index:50}
  .top-nav a{min-height:44px;display:flex;align-items:center}
}
.top{position:sticky;top:0;z-index:40;background:#06101c;color:#e7f6fb}
.hub-visual img,.shot img,img{max-width:100%;height:auto}
.hub-visual img{aspect-ratio:16/10;object-fit:cover;background:#0c1c2e}
.ad-slot:empty{display:none!important}
.ad-slot:not(:has(iframe)):not(:has(ins)):not(:has(script)){display:none!important}
.ad-rail:empty{display:none!important}
body[data-tool-cat="games"]{--bg:#06101c;--fg:#e7f6fb;--muted:#9ec3d1;--card:#0c1c2e;--soft:#12283a;--border:#1e3d52;--primary:#22e7ff;--primary-h:#8ef6ff;--on-primary:#04121c;background:#06101c;color:#e7f6fb}
body[data-tool-cat="games"] .card-box,body[data-tool-cat="games"] .tool{background:#0c1c2e;border-color:#1e3d52}
body[data-tool-cat="games"] .b2048{background:#0a2230;border:1px solid rgba(34,231,255,.35)}
body[data-tool-cat="games"] .b2048 .t{background:#102838;color:#d7f7ff;border-radius:8px;font-weight:750}
body[data-tool-cat="games"] .t2{background:#134e5e;color:#e7f6fb}
body[data-tool-cat="games"] .t4{background:#0e7490;color:#e7f6fb}
body[data-tool-cat="games"] .t8{background:#0891b2;color:#04121c}
body[data-tool-cat="games"] .t16{background:#22d3ee;color:#04121c}
body[data-tool-cat="games"] .t32{background:#67e8f9;color:#04121c}
body[data-tool-cat="games"] .t64,body[data-tool-cat="games"] .t128,body[data-tool-cat="games"] .t256,body[data-tool-cat="games"] .t512,body[data-tool-cat="games"] .t1024,body[data-tool-cat="games"] .t2048,body[data-tool-cat="games"] .tbig{background:#22e7ff;color:#04121c}
body[data-tool-cat="games"] .ttt .cell,body[data-tool-cat="games"] .chess .sq{min-height:44px}
body[data-tool-cat="games"] .game-bar .btn,body[data-tool-cat="games"] .g-tb{background:#0e7490;color:#e7f6fb;border:1px solid rgba(34,231,255,.4)}
.game-shell{max-width:100%}
.g-stage,.g-fit,.g-main{max-width:100%}
#game canvas,.game canvas{max-width:100%;height:auto;touch-action:none;border-radius:12px;background:#071422}
#game button,.g-pad button,.dpad button,.g-tb{min-height:44px;min-width:44px;touch-action:manipulation}
.dpad{display:flex;flex-direction:column;align-items:center;gap:8px;margin-top:12px}
.dpad button,.g-pad button{font-size:1.15rem}
.vsh-overlay{position:absolute;inset:0;z-index:30;display:flex;align-items:center;justify-content:center;padding:18px;background:rgba(4,12,20,.78);backdrop-filter:blur(6px)}
.g-main,.game-shell{position:relative}
.vsh-card{width:min(440px,100%);background:#0c1c2e;color:#e7f6fb;border:1px solid rgba(34,231,255,.45);border-radius:18px;padding:22px 20px 18px;box-shadow:0 18px 60px rgba(0,0,0,.35);text-align:center}
.vsh-card h2{margin:.35em 0 .2em;font-size:1.7rem}
.vsh-card p{margin:.35em 0;color:#c5e4ee}
.vsh-mark{color:#22e7ff;display:flex;justify-content:center}
.vsh-mark svg{width:54px;height:54px}
.vsh-card ol{text-align:left;margin:12px auto;padding-left:1.2em;max-width:34ch}
.vsh-card li{margin:.28em 0}
.vsh-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-top:14px}
.vsh-actions button,.vsh-go{appearance:none;border:0;cursor:pointer;background:#22e7ff;color:#04121c;font-weight:750;border-radius:999px;min-height:52px;padding:12px 22px;font-size:1.05rem}
.vsh-actions .vsh-ghost{background:transparent;color:#e7f6fb;border:1px solid rgba(34,231,255,.5)}
.vsh-best{font-variant-numeric:tabular-nums;color:#8ef6ff;font-weight:700}
.vsh-steps{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 16px;padding:0;list-style:none;counter-reset:vsh}
.vsh-steps li{counter-increment:vsh;flex:1 1 180px;background:var(--card);border:1px solid var(--border);border-radius:12px;padding:10px 12px 10px 42px;position:relative;font-size:.95rem;line-height:1.35}
.vsh-steps li:before{content:counter(vsh);position:absolute;left:10px;top:10px;width:24px;height:24px;border-radius:50%;background:#22e7ff;color:#04121c;font-weight:800;display:grid;place-items:center;font-size:.85rem}
body[data-tool-cat="games"] .vsh-steps{display:none}
.tool input,.tool select,.tool textarea,#tool input,#tool select,#tool textarea{font-size:16px}
.tool .drop,.vsh-drop{min-height:200px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;border:2px dashed #22e7ff;border-radius:18px;background:rgba(34,231,255,.06);padding:22px 16px;text-align:center;cursor:pointer}
.tool .drop .drop-title{font-size:1.25rem;font-weight:750}
.vsh-more{margin:12px 0;border:1px solid var(--border);border-radius:12px;padding:8px 12px;background:var(--soft)}
.vsh-more summary{cursor:pointer;font-weight:750;min-height:44px;display:flex;align-items:center}
.vsh-progress{margin:10px 0}
.vsh-progress[hidden]{display:none}
.vsh-progress-bar{height:8px;border-radius:99px;background:linear-gradient(90deg,#0e7490,#22e7ff);background-size:200% 100%;animation:vshload 1s linear infinite}
.vsh-progress-label{margin:.4em 0 0;font-size:.92rem}
@keyframes vshload{from{background-position:0 0}to{background-position:200% 0}}
.tool .results,.tool #result,.big-answer,.tool .stat-value{font-size:1.35rem;font-weight:700}
.tool .actions .btn,.vsh-go,#merge,#download,a[download].btn,button.vsh-go{min-height:52px;font-size:1.05rem;padding:12px 20px;border-radius:999px}
@media (max-width:720px){
  .tool .actions .btn,.vsh-go,#merge,#download,button.vsh-go{width:100%}
  .wrap{padding-left:14px;padding-right:14px}
  h1{font-size:1.7rem}
}
#tool label[class*="min-h"]{min-height:220px}
#tool .vsh-steps{margin-top:0}
.prose{max-width:68ch}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
}