/* Shared 2.0 visual language: ink, ivory, and warm wood. */
:root { --bg:#121413; --surface:#1b1e1c; --surface2:#252925; --gold:#e4b66f; --gold-light:#efd1a1; --gold-dim:#9c7a4f; --text:#f2eee5; --text-secondary:#c6c5bb; --text-muted:#b5b7ad; --text-dim:#a0a398; --border:#30362f; --border2:#454c42; }
body { background-image:none; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP",sans-serif; -webkit-font-smoothing:antialiased; }
header { background:rgba(18,20,19,.96); border-bottom:1px solid var(--border); box-shadow:none; }
.header-inner { max-width:1120px; padding:20px 32px; }
.title-text h1 { color:var(--text); font-size:20px; letter-spacing:-.02em; }
.title-text p { letter-spacing:0; }
.lang-bar { padding:10px 32px; }
nav a { border-color:transparent; background:none; border-radius:24px; padding:9px 13px; }
nav a.active { background:#2b3029; border-color:transparent; color:var(--text); }
a:focus-visible,summary:focus-visible { outline:2px solid var(--gold); outline-offset:4px; }
.app-icon { width:44px; height:44px; border-radius:11px; }
.hero { background:radial-gradient(ellipse at 24% 55%,#343126 0,transparent 55%),var(--bg); padding:72px 32px 88px; border-bottom:1px solid var(--border); gap:52px; }
.hero::before { display:none; }
.hero-title { max-width:1040px; font-size:clamp(32px,4.2vw,52px); color:var(--text); font-weight:600; letter-spacing:-.025em; line-height:1.45; }
.hero-content { max-width:1040px; padding:0; display:grid; grid-template-columns: minmax(220px,340px) minmax(0,1fr); gap:88px; }
.hero-screenshot { margin:0; width:100%; text-align:center; }
.hero-screenshot img { width:100%; max-width:290px; height:auto; border:1px solid #4b4c43; border-radius:32px; box-shadow:0 28px 70px #0007; }
.hero-text { min-width:0; max-width:none; }
.hero-text>p { font-size:17px; color:var(--text-secondary); line-height:1.9; }
.menu-cards { margin-top:32px; gap:0; }
.menu-card { background:none; border:0; border-top:1px solid var(--border2); border-radius:0; padding:18px 0; box-shadow:none; }
.menu-label { color:var(--text); }
.menu-desc { color:var(--text-muted); }
main { max-width:1040px; padding:64px 24px; }
.section { background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:36px; box-shadow:none; margin-bottom:24px; }
.section h2 { color:var(--text); letter-spacing:-.02em; }
.piece-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; }
.piece-item { min-width:0; background:#222720; border:1px solid var(--border); border-radius:14px; padding:20px; }
.piece-art { display:block; width:66px; height:76px; object-fit:contain; margin:0 0 18px; filter:drop-shadow(0 5px 5px #0004); }
.piece-art img { display:block; width:100%; height:100%; object-fit:contain; }
.piece-name { color:var(--text); }
.piece-name rt { color:var(--text-muted); font-size:.62em; font-weight:400; }
.piece-move { color:var(--text-muted); }
.screen-gallery { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin:24px 0 0; }
.screen-gallery figure { margin:0; min-width:0; }
.screen-gallery img { width:100%; height:auto; border:1px solid var(--border2); border-radius:20px; display:block; }
.screen-gallery figcaption { font-size:14px; color:var(--text-muted); margin-top:14px; text-align:center; }
.layout { max-width:1120px; }
.page-hero { background:var(--bg); }
footer { background:var(--bg); border-top:1px solid var(--border); }
@media(max-width:760px) {
 .header-inner { padding:16px 20px; gap:12px; } nav { gap:2px; } nav a { padding:8px 10px; }
 .hero { padding:42px 24px 52px; gap:32px; } .hero-content { grid-template-columns:1fr; gap:32px; }
 .hero-screenshot img { width:220px; } .hero-text { width:100%; } .hero-text>p { font-size:16px; }
 .store-badges { justify-content:center; } main { padding:32px 16px; } .section { padding:24px 20px; }
 .piece-list { grid-template-columns:repeat(2,minmax(0,1fr)); } .piece-item { padding:16px; }
 .screen-gallery { gap:12px; grid-template-columns:repeat(2,minmax(0,1fr)); }
 .screen-gallery figure:last-child { grid-column:1/-1; max-width:240px; justify-self:center; }
 .screen-gallery img { border-radius:14px; }
}