:root { color-scheme: light; --ink:#232030; --plum:#5b2a72; --paper:#faf8fc; --lavender:#f3edf8; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Yu Gothic",Meiryo,sans-serif; font-size:17px; line-height:1.9; }
main { max-width:880px; margin:auto; padding:40px 28px 64px; }
header { margin-bottom:32px; }
h1 { color:var(--plum); font-size:clamp(1.75rem,5vw,2.7rem); line-height:1.5; margin:12px 0 24px; }
h2 { font-size:1.3rem; color:var(--plum); margin:0 0 12px; line-height:1.6; }
p { margin:12px 0; }
.eyebrow { font-size:.9rem; letter-spacing:.06em; font-weight:bold; color:var(--plum); }
section { padding:28px; margin:22px 0; background:white; border:1px solid #b8607f; border-radius:14px; }
.note { padding:20px 24px; background:var(--lavender); border-radius:12px; }
.note p { margin-bottom:0; }
.example { background:var(--lavender); padding:12px 16px; border-radius:8px; }
label { display:block; margin:14px 0 6px; font-weight:bold; }
textarea { width:100%; border:1px solid var(--plum); border-radius:6px; padding:12px; font:inherit; line-height:1.7; resize:vertical; color:var(--ink); background:white; }
textarea:focus, a:focus-visible, input:focus-visible { outline:3px solid var(--plum); outline-offset:3px; }
.checks label { font-weight:normal; padding:8px 0; }
input[type="checkbox"] { width:20px; height:20px; vertical-align:middle; margin:0 10px 0 0; accent-color:var(--plum); }
a { color:var(--plum); text-underline-offset:4px; overflow-wrap:anywhere; }
footer { margin-top:36px; padding-top:28px; border-top:2px solid var(--plum); }
small { font-size:.85rem; }
@media(max-width:520px) { main { padding:24px 16px 40px; } h1 { font-size:1.5rem; } section { padding:20px 16px; } .note { padding:16px; } }
@media print { body { background:white; font-size:11pt; } main { padding:0; max-width:none; } h1 { font-size:24pt; } section { padding:12px 16px; margin:12px 0; break-inside:avoid; } textarea { resize:none; min-height:50px; overflow:visible; } footer { break-inside:avoid; } .note { padding:12px; } }