:root { --bg:#f6f5f2; --card:#fff; --ink:#1d1d1b; --mute:#6b6a66; --line:#e3e1dc; --accent:#2f6b4f; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.5 system-ui, sans-serif; }
.wrap { max-width:1100px; margin:0 auto; padding:24px 16px 48px; }
h1 { font-size:1.6rem; margin:0 0 20px; }
a { color:inherit; }
.grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(200px, 1fr)); gap:16px; }
.card { background:var(--card); border:1px solid var(--line); border-radius:10px; overflow:hidden;
  text-decoration:none; display:flex; flex-direction:column; }
.card:hover { border-color:var(--accent); }
.card .pic { aspect-ratio:1; background:#fff; display:flex; align-items:center; justify-content:center; }
.card img { width:100%; height:100%; object-fit:contain; }
.none { color:var(--mute); }
.card .txt { padding:10px 12px 12px; border-top:1px solid var(--line); }
.card .t { font-weight:600; }
.card .p { color:var(--accent); font-weight:600; }
.back { display:inline-block; margin-bottom:16px; color:var(--mute); }
.item { display:grid; grid-template-columns:minmax(0, 3fr) minmax(0, 2fr); gap:32px; align-items:start; }
@media (max-width:760px) { .item { grid-template-columns:1fr; } }
.big { background:#fff; border:1px solid var(--line); border-radius:10px; aspect-ratio:1; display:flex; }
.big img { width:100%; height:100%; object-fit:contain; }
.thumbs { display:flex; flex-wrap:wrap; gap:8px; margin-top:8px; }
.thumbs a { width:72px; height:72px; background:#fff; border:1px solid var(--line); border-radius:6px; overflow:hidden; }
.thumbs a.on { border-color:var(--accent); border-width:2px; }
.thumbs img { width:100%; height:100%; object-fit:contain; }
table { border-collapse:collapse; margin:12px 0 16px; }
th, td { text-align:left; padding:4px 16px 4px 0; vertical-align:top; }
th { color:var(--mute); font-weight:normal; }