:root{
  color-scheme:light;
  --paper:#F7F5EF; --ink:#23272E; --ink-2:#5B6069; --rule:#D8D3C7; --card:#FFFFFF;
  --pencil:#A8372B; --pencil-soft:#F4DCD8; --good:#2F6B4F; --focus:#2C5AA0;
  box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
@media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){
  color-scheme:dark; --paper:#1B1C1F; --ink:#ECE9E1; --ink-2:#A8A59C; --rule:#3A3B40; --card:#25262B;
  --pencil:#E07A6E; --pencil-soft:#4A2622; --good:#7FC9A3; --focus:#8FB3F0;
}}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;line-height:1.5}
.wrap{max-width:680px;margin:0 auto;padding:16px 16px 48px}
header{display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:8px 0 14px;border-bottom:1px solid var(--rule);margin-bottom:18px}
header h1{font-family:Georgia,serif;font-weight:600;font-size:1.5rem;margin:0;letter-spacing:-.01em}
.navlink{color:var(--ink-2);font-size:.95rem}
.card{background:var(--card);border:1px solid var(--rule);border-radius:8px;padding:16px;margin-bottom:14px}
.meta{display:flex;justify-content:space-between;gap:10px;color:var(--ink-2);font-size:.88rem;margin:0 0 10px;flex-wrap:wrap}
.ask{display:block;font-size:1.05rem;margin:4px 0 8px;font-weight:500}
.hint{color:var(--ink-2);font-size:.88rem;margin:8px 0}
textarea{width:100%;min-height:200px;padding:12px;border:1px solid var(--rule);border-radius:6px;background:var(--paper);color:var(--ink);font:inherit;font-family:Georgia,serif;line-height:1.55;resize:vertical}
.row{display:flex;gap:8px;margin-top:10px}
.btn{padding:12px 18px;background:var(--pencil);color:#fff;border:0;border-radius:6px;font:inherit;font-weight:500;cursor:pointer}
.btn:disabled{opacity:.55;cursor:default}
.linkbtn{background:none;border:0;padding:4px 2px;margin:-4px 0;color:inherit;font:inherit;text-decoration:underline;cursor:pointer}
button:focus-visible,textarea:focus-visible,a:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
.msg{min-height:1.2em;margin:10px 0 0;font-size:.92rem;color:var(--ink-2)}
.msg.err{color:var(--pencil)}
.reading h1{font-family:Georgia,serif;font-size:1.3rem;margin:0 0 10px}
.reading h2{font-size:1.05rem;margin:18px 0 6px;border-top:1px solid var(--rule);padding-top:12px}
.reading h3{font-size:.98rem;margin:14px 0 4px}
.reading p,.reading li{margin:4px 0}
.reading ul{padding-left:20px;margin:6px 0}
.reading .table{overflow-x:auto}
.reading table{border-collapse:collapse;width:100%;font-size:.88rem}
.reading th,.reading td{border:1px solid var(--rule);padding:6px;text-align:left;vertical-align:top}
footer{color:var(--ink-2);font-size:.82rem;margin-top:24px;line-height:1.45}