@font-face{font-family:"Ubuntu Site";src:url("/f/ubuntu-regular.woff2?v=8c8eae7f") format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"Ubuntu Site";src:url("/f/ubuntu-bold.woff2?v=e545ac8f") format("woff2");font-weight:700;font-display:swap}
@font-face{font-family:"Symbols Site";src:url("/f/symbols.woff2?v=11c59f32") format("woff2");font-display:block}
:root,[data-theme=mocha]{color-scheme:dark;--yellow:#f9e2af;--red:#f38ba8;--text:#cdd6f4;--subtext1:#bac2de;--subtext0:#a6adc8;--surface1:#45475a;--surface0:#313244;--base:#1e1e2e;--mantle:#181825;--crust:#11111b}
[data-theme=macchiato]{color-scheme:dark;--yellow:#eed49f;--red:#ed8796;--text:#cad3f5;--subtext1:#b8c0e0;--subtext0:#a5adcb;--surface1:#494d64;--surface0:#363a4f;--base:#24273a;--mantle:#1e2030;--crust:#181926}
[data-theme=frappe]{color-scheme:dark;--yellow:#e5c890;--red:#e78284;--text:#c6d0f5;--subtext1:#b5bfe2;--subtext0:#a5adce;--surface1:#51576d;--surface0:#414559;--base:#303446;--mantle:#292c3c;--crust:#232634}
[data-theme=latte]{color-scheme:light;--yellow:#df8e1d;--red:#d20f39;--text:#4c4f69;--subtext1:#5c5f77;--subtext0:#6c6f85;--surface1:#bcc0cc;--surface0:#ccd0da;--base:#eff1f5;--mantle:#e6e9ef;--crust:#dce0e8}
:root{--sun:color-mix(in oklab,var(--yellow) 50%,#ffd000);--yellow-text:var(--yellow);--ink:var(--crust);--on-red:var(--crust)}
[data-theme=latte]{--sun:color-mix(in oklab,var(--yellow) 45%,#ffc800);--yellow-text:color-mix(in oklab,var(--yellow) 58%,#000);--ink:#11111b;--on-red:#fff}
*,*::before,*::after{box-sizing:border-box}
body{margin:0;padding:.2rem .1rem;background:var(--crust);color:var(--text);font:400 1rem/1.5 "Ubuntu Site",Ubuntu,"Segoe UI",system-ui,sans-serif}
a{color:var(--yellow-text);text-underline-offset:.2em}
:focus-visible{outline:2px solid var(--yellow);outline-offset:2px;border-radius:4px}
.vh{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.ico{font-family:"Symbols Site";font-weight:400;font-size:1.2rem;line-height:1}
svg.ico{display:inline-block;flex:none;width:1em;height:1em;vertical-align:-.2em;fill:currentColor;overflow:visible}
.sprite{position:absolute;width:0;height:0;overflow:hidden}
h2{margin:0;font-size:1.35rem;line-height:1.25}
.head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin:0 0 .6rem}
.live{display:inline-flex;align-items:center;gap:.4rem;padding:.1rem .65rem;border-radius:999px;background:var(--red);color:var(--on-red);font-size:.85rem;font-weight:700;text-decoration:none}
.dot{width:.55rem;height:.55rem;border-radius:50%;background:currentColor}
.row{list-style:none;margin:0;padding:.2rem .2rem .5rem;display:grid;grid-auto-flow:column;grid-auto-columns:15rem;gap:1rem;overflow-x:auto;scrollbar-width:thin}
.game{display:grid;gap:.45rem;color:var(--text);text-decoration:none}
.ban{position:relative;display:block;aspect-ratio:460 / 215;border-radius:8px;overflow:hidden;background:var(--surface0)}
.game .ban{box-shadow:0 0 0 3px var(--sun)}
.game.old .ban{box-shadow:none}
.ban img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .2s,filter .2s}
.ban.tall img{position:absolute;inset:0;object-fit:contain}
.ban.tall img.blur{object-fit:cover;filter:blur(14px) brightness(.65);transform:scale(1.25)}
.game.old .ban img{filter:grayscale(1) brightness(.75)}
.game.old .ban.tall img.blur{filter:grayscale(1) blur(14px) brightness(.5)}
.game.old:hover .ban img:not(.blur){filter:grayscale(.4)}
.game:hover .ban img:not(.blur){transform:scale(1.03)}
.game:hover .name{text-decoration:underline}
.name{overflow:hidden;font-size:.92rem;font-weight:700;line-height:1.3;white-space:nowrap;text-overflow:ellipsis}
.game.old .name{color:var(--subtext0);font-weight:400}
.mark{position:absolute;left:.45rem;bottom:.45rem;padding:.05rem .45rem;border-radius:6px;background:var(--crust);color:var(--text);font-size:.72rem;font-weight:700}
.onair{position:absolute;top:.45rem;left:.45rem;padding:.1rem .5rem;border-radius:6px;background:var(--red);color:var(--on-red);font-size:.75rem;font-weight:700}
.hint{margin:.35rem 0 0;font-size:.85rem;color:var(--subtext0)}
.empty{margin:0;color:var(--subtext1)}
.detail{position:fixed;inset:0;z-index:5;display:none;overflow:auto;padding:.2rem .1rem .6rem;background:var(--crust)}
.detail:target{display:block}
.detail h2{margin:0 0 .45rem;font-size:1.3rem;line-height:1.25}
.d-close{display:grid;place-items:center;flex:none;width:2.4rem;height:2.4rem;border-radius:999px;background:var(--surface0);color:var(--text);text-decoration:none}
.d-close:hover{background:var(--sun);color:var(--ink)}
.d-body{display:grid;grid-template-columns:auto minmax(0,1fr);gap:1.1rem;align-items:start}
.d-top{display:flex;align-items:flex-start;gap:.55rem}
.d-art{display:block;width:14rem;max-width:100%;border-radius:8px}
.d-art:hover .ban img:not(.blur){filter:brightness(.85)}
.talk .cnt{height:1.25rem;width:auto;margin-left:-.15rem}
.badges{display:flex;flex-wrap:wrap;gap:.35rem;margin:0 0 .55rem}
.badge{display:inline-flex;align-items:center;gap:.4rem;padding:.1rem .55rem;border-radius:6px;background:var(--surface0);font-size:.8rem;font-weight:700}
.badge.now{background:var(--sun);color:var(--ink)}
.badge.live{background:var(--red);color:var(--on-red)}
.flag{width:1.1rem;height:.75rem;border-radius:2px;background:linear-gradient(#0057b7 50%,#ffd700 50%);box-shadow:0 0 0 1px rgb(0 0 0 / .35)}
.about{margin:0;max-width:44rem}
.src{margin:.3rem 0 0;font-size:.8rem;color:var(--subtext0)}
.stores{list-style:none;display:flex;flex-wrap:wrap;gap:.5rem;margin:.85rem 0 0;padding:0}
.store{display:inline-flex;align-items:center;gap:.5rem;min-height:2.5rem;padding:.35rem 1.05rem .35rem .85rem;border:2px solid var(--surface1);border-radius:999px;background:var(--base);color:var(--text);font-weight:700;text-decoration:none}
.store:hover{border-color:var(--sun)}
.store.minor{font-weight:400;color:var(--subtext1)}
@media (max-width:30rem){.row{grid-auto-columns:13rem}.d-body{grid-template-columns:minmax(0,1fr)}.d-art{width:auto;flex:1}}