/* novelco.app のページ（トップ・サポート）。色はアプリの色の決まり（lib/design/tokens.dart）にそろえる */
:root{--paper:#faf8f3;--card:#fff;--ink:#1e1b18;--ink2:#4e4943;--ink3:#625c53;--hair:#cfc8ba;--accent:#233a63;--accent-soft:#e5eaf3;color-scheme:light}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){--paper:#1d1b19;--card:#272421;--ink:#f3efe8;--ink2:#c9c2b7;--ink3:#b3aca1;--hair:#45403a;--accent:#9db3dd;--accent-soft:#26304a;color-scheme:dark}}
:root[data-theme="dark"]{--paper:#1d1b19;--card:#272421;--ink:#f3efe8;--ink2:#c9c2b7;--ink3:#b3aca1;--hair:#45403a;--accent:#9db3dd;--accent-soft:#26304a;color-scheme:dark}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font:16px/1.9 "Zen Kaku Gothic New",-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif}
a{color:var(--accent)}
.mincho{font-family:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif}
header,main,footer{max-width:640px;margin:0 auto;padding-inline:20px}
header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-block:18px;flex-wrap:wrap}
.brand{font-size:22px;letter-spacing:.04em;color:var(--ink);text-decoration:none}
.brand b{color:var(--accent);font-weight:inherit}
header nav{display:flex;gap:16px;font-size:14px}
header nav a{color:var(--ink2);text-decoration:none}
header nav a:hover{color:var(--accent)}
main{padding-block:24px 64px}
.hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding-block:28px 12px}
.hero img{width:112px;height:112px;border-radius:26px;border:1px solid var(--hair)}
.hero h1{font-size:clamp(26px,6vw,34px);line-height:1.5;font-weight:500;margin:0;text-wrap:balance}
.hero h1 span{display:inline-block}
.hero p{margin:0;color:var(--ink2);max-width:30em}
.soon{display:inline-block;margin-top:6px;padding:6px 14px;border-radius:999px;background:var(--accent-soft);color:var(--accent);font-size:14px}
.shots{display:flex;gap:12px;justify-content:safe center;margin:28px 0 8px;overflow-x:auto;padding-bottom:6px;scroll-snap-type:x mandatory}
.shots figure{margin:0;flex:0 0 auto;width:min(186px,56vw);scroll-snap-align:center;text-align:center}
.shots img{display:block;width:100%;height:auto;border-radius:18px;border:1px solid var(--hair)}
.shots figcaption{font-size:13px;color:var(--ink3);margin-top:8px}
h2{font-size:18px;font-weight:500;margin:48px 0 12px;padding-bottom:6px;border-bottom:1px solid var(--hair)}
h3{font-size:16px;margin:28px 0 4px}
.features{list-style:none;padding:0;margin:0;display:grid;gap:12px}
.features li{background:var(--card);border:1px solid var(--hair);border-radius:12px;padding:14px 16px}
.features strong{display:block;font-weight:500}
.features span{color:var(--ink2);font-size:15px}
.contact{background:var(--card);border:1px solid var(--hair);border-radius:12px;padding:14px 16px;margin-top:12px}
.lang{font-size:14px;color:var(--ink3)}
section+section{margin-top:56px}
footer{border-top:1px solid var(--hair);color:var(--ink3);font-size:13px;padding-block:20px 32px;display:flex;flex-wrap:wrap;gap:8px 16px}
footer a{color:var(--ink3)}
