:root{
  --lcd:#8a9a5b; --lcd-dark:#2b3a1e; --shell:#2a3fa0; --shell-dark:#1e2b7a;
  --yellow:#e8c020; --led-red:#d33; --led-green:#3c3; --btn-green:#7bb661;
  --ink:#1a1a1a; --paper:#f4f1e6; --muted:#5a5a4a;
  --maxw:1080px;
  --mono: ui-monospace, "SFMono-Regular", "Menlo", "Consolas", monospace;
  --sans: system-ui, -apple-system, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  --pixel: "Press Start 2P", var(--mono); /* 字体文件由 Task 5/6 接入，未加载时回退等宽 */
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--ink);background:var(--paper);line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--shell)}
.pixel{font-family:var(--pixel);line-height:1.4;letter-spacing:.02em}

/* 顶部导航 */
.site-nav{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;
  gap:1rem;padding:.6rem 1rem;background:var(--shell);color:#fff}
.brand{font-family:var(--mono);font-weight:700;color:#fff;text-decoration:none;letter-spacing:.15em}
.brand-dots{opacity:.6}
.nav-links{display:flex;align-items:center;gap:1rem}
.nav-links a{color:#fff;text-decoration:none}
.lang-switch{display:inline-flex;border:2px solid #fff;border-radius:4px;overflow:hidden}
.lang-switch button{background:transparent;color:#fff;border:0;padding:.2rem .55rem;font:inherit;cursor:pointer}
.lang-switch button[aria-pressed="true"]{background:#fff;color:var(--shell)}

/* Hero */
.hero{max-width:var(--maxw);margin:0 auto;padding:2rem 1rem;display:grid;gap:2rem;
  grid-template-columns:1fr;align-items:center}
.hero-copy h1{font-size:clamp(1.6rem,6vw,2.6rem);color:var(--shell-dark);margin:.2rem 0}
.hero-tagline{font-size:1.15rem;font-weight:600;margin:.4rem 0}
.hero-sub{color:var(--muted);margin:.2rem 0 1rem}
.cta-row{display:flex;flex-wrap:wrap;gap:.75rem}
.hero-device{display:flex;justify-content:center}
.device-shot{max-width:280px;border-radius:14px;box-shadow:0 10px 30px rgba(0,0,0,.25)}

/* 按钮（仿实体键） */
.btn{display:inline-block;padding:.7rem 1.1rem;border-radius:8px;text-decoration:none;font-weight:700;
  color:var(--lcd-dark);box-shadow:0 4px 0 rgba(0,0,0,.25);transition:transform .05s,box-shadow .05s}
.btn:active{transform:translateY(3px);box-shadow:0 1px 0 rgba(0,0,0,.25)}
.btn-yellow{background:var(--yellow)}
.btn-green{background:var(--btn-green);color:#12240a}

/* 特性卡片 */
.features,.shots{max-width:var(--maxw);margin:0 auto;padding:2rem 1rem}
.features h2,.shots h2{color:var(--shell-dark);font-size:clamp(1.2rem,4vw,1.6rem)}
.card-grid{display:grid;gap:1rem;grid-template-columns:1fr}
.card{background:var(--lcd);color:var(--lcd-dark);border:3px solid var(--lcd-dark);border-radius:6px;padding:1rem}
.card h3{margin:.1rem 0 .4rem;font-family:var(--mono)}

/* 截图画廊 */
.shot-gallery{display:grid;gap:1rem;grid-template-columns:repeat(2,1fr)}
.shot-gallery img{border-radius:10px;border:1px solid #ddd}

/* 页脚 */
.site-footer{background:var(--shell-dark);color:#dfe3ff;text-align:center;padding:1.5rem 1rem;margin-top:2rem}
.site-footer a{color:#fff}

/* 长正文页（隐私/支持） */
.doc{max-width:760px;margin:0 auto;padding:2rem 1rem}
.doc h1{color:var(--shell-dark)}
.doc h2{color:var(--shell-dark);margin-top:1.6rem;border-bottom:2px dotted var(--lcd);padding-bottom:.2rem}
.doc a{word-break:break-word}

/* 桌面断点：Task 6 会补更多响应式与视觉细节 */
@media(min-width:760px){
  .hero{grid-template-columns:1.1fr .9fr}
  .card-grid{grid-template-columns:repeat(2,1fr)}
  .shot-gallery{grid-template-columns:repeat(4,1fr)}
}

/* 自托管像素字体（无文件时此 @font-face 无效、自动回退等宽） */
@font-face{
  font-family:"Press Start 2P";
  src:url("../fonts/press-start-2p.ttf") format("truetype");
  font-display:swap;
}
/* 英文界面标题用像素字；中文界面(html[lang^=zh])标题回退中文黑体保证字形 */
html[lang^="zh"] .pixel{font-family:var(--sans);letter-spacing:normal}

/* LCD 屏扫描线质感（用于 hero 设备与卡片） */
.device-shot,.card{position:relative}
.hero-device{position:relative}
.hero-device::after{
  content:"";position:absolute;inset:0;pointer-events:none;border-radius:14px;
  background:repeating-linear-gradient(to bottom, rgba(0,0,0,.06) 0 2px, transparent 2px 4px);
  mix-blend-mode:multiply;
}
/* 点阵分隔线母题（章节标题下） */
.features h2::after,.shots h2::after{
  content:"·····································";
  display:block;color:var(--lcd);font-family:var(--mono);overflow:hidden;white-space:nowrap;opacity:.7
}

/* 更大屏的排版收敛 */
@media(min-width:1024px){ .device-shot{max-width:320px} }

/* 尊重减少动效 */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
  .hero-device::after{background:none}
}