:root { --ink:#14213d; --muted:#607089; --surface:#fff; --bg:#f5f8fc; --primary:#157f5b; --danger:#b42318; }
* { box-sizing:border-box; }
body { margin:0; background:var(--bg); color:var(--ink); font:16px/1.55 system-ui,-apple-system,"Microsoft YaHei",sans-serif; }
.header { min-height:64px; display:flex; justify-content:space-between; align-items:center; padding:0 max(5vw,24px); background:#fff; border-bottom:1px solid #e7edf5; }
.brand { color:var(--ink); font-weight:800; font-size:1.15rem; text-decoration:none; }
nav { display:flex; gap:18px; align-items:center; } nav a,.link-button { color:var(--primary); text-decoration:none; }
.inline { display:inline; }.link-button { border:0;background:none;padding:0;font:inherit;cursor:pointer; }
.container { width:min(1200px,92vw); margin:36px auto 64px; }
.hero { display:flex; gap:28px; align-items:center; justify-content:space-between; margin-bottom:30px; padding:30px; border-radius:18px; color:#fff; background:linear-gradient(120deg,#114b5f,#157f5b); }
h1 { margin:.1em 0; line-height:1.25; }.hero p { margin:.5em 0 0; opacity:.9; }.hero .muted { color:#effff7; }
.upload { min-width:min(100%,360px); display:grid; gap:10px; padding:16px; background:rgba(255,255,255,.14); border-radius:12px; }.upload input { color:#fff; }.upload label { font-size:.9rem; }
button,.button { display:inline-block; border:0; border-radius:8px; padding:10px 15px; color:#fff; background:var(--primary); font:inherit; font-weight:650; text-decoration:none; cursor:pointer; }.secondary-button { display:inline-block; border:1px solid #b8c5d6; border-radius:8px; padding:9px 14px; color:var(--ink); background:#fff; font-weight:650; text-decoration:none; }.save-tip { max-width:220px; color:var(--muted); font-size:.85rem; }.danger { background:var(--danger); }
.gallery { display:grid; grid-template-columns:repeat(auto-fill,minmax(210px,1fr)); gap:18px; }.card { overflow:hidden; border-radius:12px; background:var(--surface); box-shadow:0 3px 14px #17345a12; }.card img { width:100%; aspect-ratio:1; display:block; object-fit:cover; }.card-meta { min-height:68px; display:flex; flex-direction:column; padding:10px 12px; overflow:hidden; }.card-meta span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.card-meta small,.muted { color:var(--muted); }
.notice { margin:0 0 18px; padding:12px 15px; border-radius:9px; background:#e7f6ed; color:#07562f; }.notice.error { background:#fff0ef; color:#a52318; }.empty { padding:50px; text-align:center; color:var(--muted); background:#fff; border-radius:12px; }.pagination { justify-content:center; margin-top:28px; }.photo-page { background:#fff; border-radius:14px; overflow:hidden; }.full-image { display:block; max-width:100%; max-height:72vh; margin:auto; background:#121926; }.photo-actions { display:flex; align-items:center; flex-wrap:wrap; gap:14px; padding:18px 22px; }.photo-actions div { margin-right:auto; }.photo-actions p { margin:.3rem 0; color:var(--muted); }.table-wrap { overflow:auto; background:#fff; border-radius:12px; }table { width:100%; border-collapse:collapse; }th,td { padding:12px 14px; border-bottom:1px solid #edf0f5; text-align:left; }code { font-size:.8rem; }
.admin-login { width:min(100%,420px); margin:70px auto; padding:28px; border-radius:14px; background:#fff; }.admin-login form { display:grid; gap:12px; margin-top:24px; }.admin-login input { padding:10px; border:1px solid #d7e0eb; border-radius:8px; font:inherit; }.admin-thumb { width:64px; height:48px; object-fit:cover; border-radius:5px; vertical-align:middle; }
@media (max-width:680px) { .header { padding:0 20px; }.user { display:none; }.hero { align-items:stretch; flex-direction:column; padding:24px; }.container { margin-top:20px; }.gallery { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }.card-meta { font-size:.9rem; }.photo-actions { align-items:flex-start; flex-direction:column; }.photo-actions div { margin-right:0; } }