:root{ --coral:#FF7A4D; --navy:#1E2A4A; --cream:#FAF4E6; --ink:#21262e; --muted:#5d6b7a; }
*{ box-sizing:border-box; }
body{ margin:0; font-family:-apple-system,"Helvetica Neue","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif; color:var(--ink); line-height:1.55; }
a{ color:var(--coral); }

/* Simple centered card pages (thanks / confirm / unsubscribe) */
.center{ min-height:100vh; background:var(--navy); display:flex; align-items:center; justify-content:center; padding:24px; }
.center .card{ background:#fff; max-width:480px; width:100%; border-radius:16px; padding:40px 32px; text-align:center; }
.center .crane{ font-size:34px; }
.center h1{ color:var(--navy); font-size:26px; margin:8px 0 6px; }
.center p{ color:var(--muted); font-size:16px; }
.center .btn{ display:inline-block; background:var(--coral); color:#fff; font-weight:800; text-decoration:none; padding:14px 24px; border-radius:12px; margin-top:14px; }
.center a.handle{ color:var(--coral); font-weight:700; text-decoration:none; }

/* Admin */
.admin{ background:#f4f1e9; min-height:100vh; }
.admin .bar{ background:var(--navy); color:var(--cream); padding:14px 22px; display:flex; gap:18px; align-items:center; }
.admin .bar a{ color:#cdd6e4; text-decoration:none; font-weight:600; font-size:15px; }
.admin .bar a.brand{ color:var(--cream); font-weight:800; font-size:17px; }
.admin .bar a:hover{ color:var(--coral); }
.admin .wrap{ max-width:1000px; margin:0 auto; padding:24px 22px 60px; }
.admin h1{ color:var(--navy); font-size:24px; margin:8px 0 18px; }
.admin h2{ color:var(--navy); font-size:16px; text-transform:uppercase; letter-spacing:1px; margin:26px 0 10px; }

.cards{ display:flex; gap:14px; flex-wrap:wrap; }
.stat{ background:#fff; border-radius:12px; padding:16px 20px; min-width:120px; flex:1; border-left:5px solid var(--coral); }
.stat .n{ font-size:30px; font-weight:800; color:var(--navy); }
.stat .l{ color:var(--muted); font-size:13px; text-transform:uppercase; letter-spacing:.5px; }

table.grid{ width:100%; border-collapse:collapse; background:#fff; border-radius:12px; overflow:hidden; font-size:14.5px; }
table.grid th{ background:var(--navy); color:var(--cream); text-align:left; padding:10px 12px; font-size:13px; }
table.grid td{ padding:10px 12px; border-bottom:1px solid #eee; vertical-align:top; }
table.grid tr:nth-child(even) td{ background:#faf7f0; }

.pill{ display:inline-block; padding:2px 9px; border-radius:999px; font-size:12px; font-weight:700; }
.pill.published{ background:#e6f4ea; color:#1e7a3d; }
.pill.rendered{ background:#fff1e8; color:#c2510a; }
.pill.archived,.pill.unsubscribed{ background:#eee; color:#777; }
.pill.confirmed{ background:#e6f4ea; color:#1e7a3d; }
.pill.pending{ background:#fdf3d6; color:#9a7b12; }
.tag{ display:inline-block; background:#eef1f6; color:#41506a; border-radius:6px; padding:1px 7px; font-size:12px; margin:1px; }

.filters{ display:flex; gap:8px; flex-wrap:wrap; margin-bottom:14px; }
.filters input, .filters select{ padding:8px 10px; border:1px solid #d8d2c2; border-radius:8px; font-size:14px; }
.btn-coral{ background:var(--coral); color:#fff; border:0; border-radius:8px; padding:8px 16px; font-weight:700; cursor:pointer; text-decoration:none; }
.btn-ghost{ background:#fff; color:var(--navy); border:1px solid #d8d2c2; border-radius:8px; padding:8px 14px; text-decoration:none; font-weight:600; }
.flash{ background:#e6f4ea; color:#1e7a3d; padding:10px 14px; border-radius:8px; margin-bottom:14px; }
.field{ margin:12px 0; }
.field label{ display:block; font-weight:700; color:var(--navy); margin-bottom:4px; font-size:14px; }
.field input, .field select, .field textarea{ width:100%; padding:10px 12px; border:1px solid #d8d2c2; border-radius:8px; font-size:15px; }