@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Newsreader:opsz,wght@6..72,400;6..72,500;6..72,600&display=swap');

:root { color-scheme: light; --ink:#202a28; --muted:#677571; --paper:#f5f4ef; --card:#fffefa; --line:#d9ddd4; --accent:#d3ef56; --danger:#9a3d2d; --good:#365e48; --warn:#8b6419; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Georgia, 'Times New Roman', serif; }
.shell { width:min(920px, calc(100% - 40px)); margin:0 auto; padding:72px 0 96px; }
.intro { max-width:680px; margin-bottom:42px; }
.section-mark { margin:0 0 18px; color:var(--muted); font:500 11px/1.3 'DM Mono', monospace; letter-spacing:.16em; }
h1 { margin:0; font-size:clamp(42px, 8vw, 78px); font-weight:500; letter-spacing:-.055em; line-height:.95; }
.lede { margin:22px 0 0; max-width:600px; color:var(--muted); font-size:20px; line-height:1.45; }
.form-card, .login-card { padding:36px; background:var(--card); border:1px solid var(--line); box-shadow:12px 14px 0 rgba(32,42,40,.06); }
.form-card { display:grid; gap:28px; }
.field { display:grid; gap:9px; }
label { font-size:18px; line-height:1.3; }
input, textarea { width:100%; border:1px solid #bac4bb; border-radius:0; background:#fffffb; color:var(--ink); font:16px/1.5 Georgia, 'Times New Roman', serif; padding:13px 14px; }
input:focus, textarea:focus { outline:3px solid rgba(211,239,86,.8); outline-offset:2px; border-color:var(--ink); }
textarea { min-height:150px; resize:vertical; }
.hint, .privacy-note, .detail-date { margin:0; color:var(--muted); font:12px/1.5 'DM Mono', monospace; }
.privacy-note { text-align:center; }
button { border:1px solid var(--ink); background:var(--accent); color:var(--ink); padding:14px 18px; cursor:pointer; font:500 13px 'DM Mono', monospace; letter-spacing:.03em; }
button:hover { background:#e0f986; }
.button-quiet { background:transparent; border-color:var(--line); }
.alert { padding:12px 14px; font:13px/1.4 'DM Mono', monospace; }
.alert-error { border-left:4px solid var(--danger); background:#fcebe6; color:var(--danger); }
.field-error { margin:0; color:var(--danger); font:12px/1.4 'DM Mono', monospace; }
.confirmation { padding:80px 0; max-width:680px; }
.text-link, .back-link { display:inline-block; margin-top:28px; color:var(--ink); font:500 13px 'DM Mono', monospace; text-decoration:underline; text-underline-offset:4px; }
.login-card { max-width:560px; margin:40px auto; }
.login-card form { display:grid; gap:22px; margin-top:32px; }
.admin-header { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:42px; }
.admin-header h1 { font-size:clamp(40px, 7vw, 64px); }
.admin-summary { display:flex; align-items:baseline; gap:14px; padding:22px 0; border-top:1px solid var(--ink); border-bottom:1px solid var(--line); }
.admin-summary strong { font-size:48px; font-weight:500; letter-spacing:-.05em; }
.admin-summary span { color:var(--muted); font:12px 'DM Mono', monospace; }
.submission-list { margin-top:16px; }
.submission-row { display:flex; justify-content:space-between; gap:24px; align-items:center; padding:22px 0; color:var(--ink); border-bottom:1px solid var(--line); text-decoration:none; }
.submission-row:hover { background:rgba(211,239,86,.16); padding-left:12px; padding-right:12px; }
.submission-row strong, .submission-row span { display:block; }
.submission-row strong { font-size:22px; font-weight:500; }
.submission-row div:first-child span { margin-top:5px; color:var(--muted); font:11px 'DM Mono', monospace; }
.row-status { display:flex; align-items:center; gap:8px; color:var(--muted); font:12px 'DM Mono', monospace; text-align:right; }
.status { padding:5px 7px; border:1px solid currentColor; font-size:10px; }
.status-good { color:var(--good); }
.status-warn { color:var(--warn); }
.empty-state { margin-top:40px; padding:40px 0; border-top:1px solid var(--ink); }
.empty-state h2 { margin:0; font-size:32px; font-weight:500; }
.empty-state p { color:var(--muted); font-size:18px; }
.back-link { margin:0 0 44px; text-decoration:none; }
.detail-header { padding-bottom:28px; border-bottom:1px solid var(--ink); }
.detail-header h1 { font-size:clamp(42px, 8vw, 76px); }
.detail-date { margin-top:18px; }
.detail-grid { display:grid; grid-template-columns:repeat(3, 1fr); gap:1px; background:var(--line); border-bottom:1px solid var(--line); }
.answer { min-height:260px; padding:24px; background:var(--card); }
.answer h2 { margin:0 0 20px; font:500 12px/1.4 'DM Mono', monospace; text-transform:uppercase; letter-spacing:.05em; }
.answer p { margin:0; white-space:pre-wrap; font-size:18px; line-height:1.5; }
.detail-status { display:flex; align-items:center; gap:18px; padding:26px 0; font:13px 'DM Mono', monospace; }
.detail-status .section-mark { margin:0; }
@media (max-width:680px) { .shell { width:min(100% - 24px, 560px); padding-top:42px; } .form-card, .login-card { padding:22px; } .detail-grid { grid-template-columns:1fr; } .submission-row { align-items:flex-start; flex-direction:column; gap:12px; } .row-status { text-align:left; flex-wrap:wrap; } .admin-header { align-items:flex-start; flex-direction:column; } .detail-status { align-items:flex-start; flex-direction:column; gap:10px; } }