:root { --ink:#1e2b2e; --paper:#fffdf7; --tint:#e9f0e8; --accent:#f0a33a; --danger:#932f2f; --line:#cad5cf; --muted:#526469; }
* { box-sizing:border-box; }
html { background:#dce7df; }
body { margin:0; background:radial-gradient(circle at 87% 4%, #f7d99a 0 13%, transparent 13.1%), var(--paper); color:var(--ink); font-family:"Hiragino Sans","Yu Gothic",system-ui,sans-serif; font-size:17px; line-height:1.7; }
button,input,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:transparent; }
.shell { max-width:1060px; margin:auto; padding:28px 28px 52px; }
.masthead { display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid var(--line); padding-bottom:19px; }
.wordmark { color:var(--ink); font-size:1.3rem; font-weight:800; letter-spacing:.08em; text-decoration:none; }
.masthead p,.section-head>p { margin:0; color:var(--muted); font-size:.9rem; }
.hero { padding:76px 0 58px; max-width:760px; }
.eyebrow { margin:0 0 10px; color:#70602f; font-size:.84rem; font-weight:800; letter-spacing:.11em; }
h1,h2 { font-family:"Hiragino Mincho ProN","Yu Mincho",serif; line-height:1.2; }
h1 { margin:0; font-size:clamp(3.2rem,9vw,6.7rem); letter-spacing:-.08em; }
h1 em { color:#bf691c; font-style:normal; }
.lede { max-width:690px; margin:25px 0 26px; font-size:1.12rem; }
.rule-button,.primary,.quiet,.help-link,.urgent a { border:0; border-radius:999px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; font-weight:800; text-decoration:none; transition:transform .16s ease, box-shadow .16s ease; }
.rule-button,.primary { background:var(--ink); color:white; padding:14px 21px; box-shadow:0 5px 0 #0d1517; }
.rule-button:hover,.primary:hover,.help-link:hover,.urgent a:hover { transform:translateY(-2px); }
.rule { margin:24px 0 0; max-width:680px; padding:17px 19px; border-left:5px solid var(--accent); background:#fff6df; font-size:1.05rem; font-weight:700; }
.urgent { display:flex; align-items:center; gap:14px; padding:17px 20px; border:1px solid #e7b9b9; background:#fff4f1; color:#592020; }
.urgent strong { white-space:nowrap; }
.urgent span { flex:1; }
.urgent a { background:var(--danger); color:#fff; padding:9px 15px; }
.steps { display:grid; grid-template-columns:1fr 1.65fr; gap:42px; padding:74px 0; }
h2 { margin:0; font-size:clamp(1.8rem,4vw,2.75rem); letter-spacing:-.05em; }
ol { margin:0; padding:0; list-style:none; display:grid; gap:13px; }
li { display:flex; gap:15px; align-items:center; padding:16px; border:1px solid var(--line); background:#fff; }
li b { width:34px; height:34px; flex:0 0 34px; display:grid; place-items:center; border-radius:50%; background:var(--tint); color:#2e573b; }
.workbench,.note-panel { padding:36px; background:var(--tint); border:1px solid #c4d4c6; }
.section-head { display:flex; justify-content:space-between; gap:30px; align-items:flex-start; margin-bottom:28px; }
.section-head>p { max-width:355px; }
.form-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }
label { color:#304248; display:grid; gap:7px; font-size:.92rem; font-weight:750; }
.wide { grid-column:span 2; }
input,textarea { width:100%; border:1px solid #abbab1; border-radius:9px; background:#fffefa; color:var(--ink); padding:12px 13px; }
textarea { min-height:92px; resize:vertical; }
input:focus,textarea:focus,button:focus,a:focus { outline:3px solid #e49831; outline-offset:3px; }
.actions { display:flex; align-items:center; flex-wrap:wrap; gap:14px; margin-top:25px; }
.quiet { padding:12px 17px; border:1px solid #83938b; background:transparent; color:var(--ink); }
#status { flex:1 1 260px; margin:0; color:#40565a; font-size:.9rem; }
.note-panel { margin-top:28px; background:#fff7e5; border-color:#edc77e; }
#hold-note { min-height:380px; line-height:1.75; }
.help { margin-top:74px; display:grid; grid-template-columns:1fr 1.35fr auto; align-items:center; gap:28px; padding:28px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.help p { margin:0; }
.help-link { background:#bf691c; color:#fff; padding:13px 20px; white-space:nowrap; }
footer { max-width:800px; padding-top:28px; color:var(--muted); font-size:.82rem; }
footer p { margin:0 0 8px; }
footer a { color:#2b6353; }
@media (max-width:720px) { body { font-size:16px; } .shell { padding:20px 18px 42px; } .masthead,.section-head { align-items:flex-start; flex-direction:column; gap:8px; } .hero { padding:55px 0 40px; } .urgent { align-items:flex-start; flex-wrap:wrap; } .urgent strong { width:100%; } .steps,.help { grid-template-columns:1fr; gap:20px; padding:50px 0; } .workbench,.note-panel { margin-inline:-18px; padding:26px 18px; } .form-grid { grid-template-columns:1fr; } .wide { grid-column:auto; } .help-link { width:max-content; } }
