/* Roly-Poly Panda press kit · copied as-is by tools/make_presskit.py */
:root { --bg:#f5f8f2; --card:#ffffff; --ink:#1f2b22; --muted:#56655a; --line:#dfe8db; --accent:#2f7d4a; --accent-soft:#e3f1e5; }
* { box-sizing:border-box; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.65 "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif; }
a { color:var(--accent); }
:lang(zh-Hans) { font-family:"Microsoft YaHei", "PingFang SC", "Noto Sans CJK SC", "Segoe UI", sans-serif; }
:lang(zh-Hant) { font-family:"Microsoft JhengHei", "PingFang TC", "Noto Sans CJK TC", "Segoe UI", sans-serif; }
:lang(ja) { font-family:"Yu Gothic UI", "Yu Gothic", "Hiragino Sans", "Noto Sans CJK JP", "Meiryo", sans-serif; }
:lang(ko) { font-family:"Malgun Gothic", "Apple SD Gothic Neo", "Noto Sans CJK KR", sans-serif; }
.wrap { max-width:1080px; margin:0 auto; padding:0 20px; }
.switching #page { opacity:.55; transition:opacity .2s; }

/* top bar + language menu */
header.top { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 0; }
header.top .brand { display:flex; align-items:center; gap:10px; min-width:0; font-weight:600; text-decoration:none; color:var(--ink); }
header.top .brand img { width:32px; height:32px; flex:none; }
header.top .brand span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.langs { position:relative; flex:none; }
.langs summary { list-style:none; display:flex; align-items:center; gap:8px; cursor:pointer; min-height:40px; padding:6px 14px; border:1px solid var(--line); border-radius:999px; background:var(--card); color:var(--ink); font-size:15px; -webkit-user-select:none; user-select:none; }
.langs summary::-webkit-details-marker { display:none; }
.langs summary:hover, .langs[open] summary { border-color:var(--accent); }
.langs summary:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.langs summary svg { width:16px; height:16px; flex:none; color:var(--accent); }
.langs summary span { max-width:44vw; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.lang-menu { position:absolute; z-index:10; right:0; top:calc(100% + 8px); width:min(420px, calc(100vw - 32px)); display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:2px; padding:8px; background:var(--card); border:1px solid var(--line); border-radius:14px; box-shadow:0 18px 44px rgba(30,60,40,.18); }
.lang-menu a { display:block; padding:9px 12px; border-radius:9px; color:var(--ink); text-decoration:none; font-size:15px; line-height:1.35; }
.lang-menu a:hover, .lang-menu a:focus-visible { background:var(--accent-soft); outline:none; }
.lang-menu a[aria-current] { background:var(--accent-soft); color:var(--accent); font-weight:600; box-shadow:inset 3px 0 0 var(--accent); }

/* hero */
.hero { display:grid; grid-template-columns:1.15fr 1fr; gap:28px; align-items:center; padding:12px 0 28px; }
.hero img { width:100%; height:auto; border-radius:14px; display:block; box-shadow:0 8px 28px rgba(30,60,40,.12); }
.hero h1 { font-size:30px; line-height:1.25; margin:0 0 10px; }
.hero p { margin:0 0 16px; color:var(--muted); }
.buttons { display:flex; flex-wrap:wrap; gap:10px; }
.btn { display:inline-block; padding:10px 16px; border-radius:999px; background:var(--accent); color:#fff; text-decoration:none; font-weight:600; font-size:15px; }
.btn.ghost { background:var(--accent-soft); color:var(--accent); }

/* blocks */
section.block { background:var(--card); border:1px solid var(--line); border-radius:16px; padding:24px; margin:0 0 22px; }
section.block h2 { margin:0 0 14px; font-size:22px; }
section.block .lead { font-size:17px; margin-top:0; }
.video video, .video img { width:100%; border-radius:12px; display:block; background:#000; aspect-ratio:16/9; }
.small { color:var(--muted); font-size:14px; margin:10px 0 0; }
.clips { display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:14px; }
.clips figure { margin:0; }
.clips video { width:100%; border-radius:10px; display:block; aspect-ratio:16/9; background:#eef3ec; }
figcaption { font-size:14px; color:var(--muted); margin-top:6px; }
.shots { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, 1fr)); gap:12px; }
.shot img { width:100%; height:auto; border-radius:10px; display:block; border:1px solid var(--line); }
.cal { display:grid; grid-template-columns:repeat(auto-fill, minmax(260px, 1fr)); gap:14px; }
.cal figure { margin:0; }
.pandas { display:grid; grid-template-columns:repeat(auto-fill, minmax(150px, 1fr)); gap:12px; }
.panda { display:flex; flex-direction:column; align-items:center; text-decoration:none; color:var(--muted); font-size:13px; text-align:center; background:var(--accent-soft); border-radius:12px; padding:10px; }
.panda img { width:100%; height:140px; object-fit:contain; }
.logos { display:grid; grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); gap:12px; }
.logo { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; background:#cfe6d6; border-radius:12px; padding:14px; min-height:150px; text-decoration:none; color:var(--muted); font-size:13px; }
.logo img { max-width:100%; max-height:120px; }
.cols { display:grid; grid-template-columns:minmax(0, 1fr) minmax(0, 1.3fr); gap:28px; }
.cols h3 { font-size:17px; margin:18px 0 6px; }
.cols > div > h3:first-child { margin-top:0; }
.about p { margin:0 0 8px; }
table.facts { width:100%; border-collapse:collapse; font-size:15px; }
table.facts th { text-align:left; color:var(--muted); font-weight:500; padding:6px 10px 6px 0; vertical-align:top; white-space:nowrap; }
table.facts td { padding:6px 0; overflow-wrap:anywhere; }
table.facts tr + tr { border-top:1px solid var(--line); }
table.facts .nw { white-space:nowrap; }
ul.qa { padding-left:18px; margin:6px 0 0; }
ul.qa li { margin:0 0 8px; }
.guide { margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.guide p { margin:0 0 8px; }
.guide ol { padding-left:22px; margin:6px 0 10px; }
.guide li { margin:0 0 8px; }
footer { color:var(--muted); font-size:14px; padding:6px 0 40px; }

/* root page: language list for visitors without JavaScript */
.picker { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; padding:48px 16px; text-align:center; }
.picker img { width:min(520px, 86vw); height:auto; border-radius:14px; }
.picker h1 { margin:8px 0 0; font-size:clamp(22px, 3vw, 28px); }
.picker nav { display:grid; grid-template-columns:repeat(auto-fill, minmax(min(100%, 180px), 1fr)); gap:8px; width:100%; max-width:780px; margin-top:18px; }
.picker nav a { padding:11px 12px; border-radius:10px; border:1px solid var(--line); background:var(--card); text-decoration:none; color:var(--ink); }
.picker nav a:hover { border-color:var(--accent); }

@media (max-width: 760px) {
  .hero, .cols { grid-template-columns:1fr; }
  .hero h1 { font-size:25px; }
  section.block { padding:18px; }
}
@media (max-width: 520px) {
  header.top .brand .kit { display:none; }
  .lang-menu { grid-template-columns:1fr; }
  table.facts th, table.facts td { display:block; padding:0; }
  table.facts th { padding-top:8px; font-size:13px; }
  table.facts td { padding-bottom:8px; }
}