:root{--bg:#f7f7f5;--fg:#1d1d1f;--muted:#6b6b70;--card:#fff;--line:#e4e4e0;--blue:#2f6fed;--gray:#c8c8c4;--pink:#ff6b81;--yellow:#ffc107;--green:#1f9d55;--r:18px}
@media (prefers-color-scheme:dark){:root{--bg:#121214;--fg:#f2f2f2;--muted:#9a9aa0;--card:#1c1c20;--line:#2c2c32;--blue:#6f9bff}}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--fg);font-family:system-ui,-apple-system,"Hiragino Sans","Noto Sans JP",sans-serif;-webkit-text-size-adjust:100%}
main{max-width:620px;margin:0 auto;padding:28px 18px 12px;min-height:calc(100vh - 56px)}
a{color:var(--blue)}
.hero{text-align:center;margin:8px 0 26px}
.hero img{width:150px;height:150px;border-radius:34px;box-shadow:0 8px 28px rgba(0,0,0,.10)}
.hero h1{font-size:clamp(2rem,9vw,2.7rem);margin:16px 0 4px;letter-spacing:-.02em;font-weight:900}
.hero h1 span{color:var(--blue)}
.hero p{color:var(--muted);margin:0;font-size:1.02rem}
.dots{display:flex;justify-content:center;gap:8px;margin:14px 0 0}
.dots i{width:10px;height:10px;border-radius:50%;display:block}
.games{display:grid;gap:14px}
.game{display:flex;gap:16px;align-items:center;background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px;text-decoration:none;color:inherit;transition:transform .12s,box-shadow .12s}
.game:hover{transform:translateY(-2px);box-shadow:0 10px 24px rgba(0,0,0,.08)}
.game:active{transform:scale(.98)}
.game img{width:76px;height:76px;border-radius:18px;flex:none}
.game b{display:block;font-size:1.25rem;letter-spacing:-.01em}
.game small{display:block;color:var(--muted);margin-top:3px;line-height:1.5}
.game .go{margin-left:auto;font-size:1.4rem;color:var(--blue);font-weight:800}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;line-height:1.75}
h2{font-size:1.4rem}
.btn{display:inline-block;margin:18px 0;padding:10px 18px;border-radius:12px;border:1px solid var(--line);text-decoration:none;color:inherit;font-weight:700}
footer{text-align:center;font-size:.8rem;color:var(--muted);padding:14px}
footer a{color:var(--muted)}

.daily-note{font-size:.85rem;font-weight:700;color:var(--blue,#2f6fed);margin-top:6px}
/* ISSEN */
.hero img.mark{width:132px;height:132px;border-radius:0;box-shadow:none}
.hero h1 span{font-size:.45em;margin-left:.4em;color:var(--muted);font-weight:800;letter-spacing:.1em}
.game.soon{opacity:.7;cursor:default}
.game.soon:hover{transform:none;box-shadow:none}
.soon-icons{display:flex;gap:4px;flex:none;width:76px;flex-wrap:wrap}
.soon-icons i{width:36px;height:36px;border-radius:10px;color:#fff;font-style:normal;font-weight:800;display:flex;align-items:center;justify-content:center;font-size:1.05rem}
.about{margin-top:22px}
.about h2{margin:4px 0 8px;font-size:1.15rem}
.about p{margin:0 0 8px;font-size:.95rem}
/* 入口の見出し：書道風の「一閃」（莫大毛筆フォント Bold・SIL OFL の文字の形をSVGにしたもの） */
.hero h1.brand{display:flex;flex-direction:column;align-items:center;gap:6px;margin:4px 0 10px}
.hero h1.brand img.mark{width:72px;height:72px}
.hero h1.brand .brush{width:min(78vw,340px);height:auto;color:var(--fg);display:block}
.hero h1.brand .en{font-size:1rem;letter-spacing:.5em;margin:2px 0 0 .5em;color:var(--muted);font-weight:800}