.wwh-tool { margin:24px 0 32px; padding:20px; border:1px solid var(--line); border-radius:6px; background:var(--wash-sage); }
.wwh-controls { display:flex; flex-wrap:wrap; gap:12px 20px; align-items:flex-end; }
.wwh-field { flex:1 1 220px; max-width:100%; }
.wwh-field label { display:block; font-weight:700; margin-bottom:6px; }
.wwh-field select { width:100%; min-height:44px; padding:8px 10px; border:1px solid #81968d; border-radius:4px; background:#fff; color:var(--ink); font:inherit; }
.wwh-check { flex:0 0 auto; display:flex; align-items:center; gap:10px; min-height:44px; }
.wwh-check input { width:24px; height:24px; margin:0; }
.wwh-check label { margin:0; }
.wwh-hint { font-weight:600; }
.wwh-pages { list-style:none; margin:20px 0; padding:0; }
.wwh-step { display:flex; gap:20px; align-items:flex-start; flex-wrap:wrap; padding:24px; margin:0 0 14px; background:#fff; border:2px solid var(--ink); border-radius:8px; }
.wwh-step.wwh-off { display:none; }
.wwh-icon { flex:none; width:80px; height:80px; fill:none; stroke:var(--ink); stroke-width:3; stroke-linecap:round; stroke-linejoin:round; }
.wwh-body { flex:1 1 240px; min-width:0; }
.wwh-text { margin:0; line-height:1.4; overflow-wrap:break-word; }
.wwh-text[contenteditable] { outline:2px dashed var(--soft-ink); outline-offset:4px; }
.wwh-text[contenteditable]:focus-visible { outline:3px solid var(--focus); }
.wwh-s1 .wwh-text { font-size:1.5rem; } .wwh-s2 .wwh-text { font-size:2rem; } .wwh-s3 .wwh-text { font-size:2.6rem; }
.wwh-count { flex:1 0 100%; color:var(--soft-ink); font-size:.95rem; }
.wwh-box { margin-top:16px; padding:14px 16px; border:2px solid var(--soft-ink); border-radius:6px; background:var(--wash-sage); font-size:1.05rem; }
.wwh-box h3 { margin:0 0 8px; }
.wwh-box blockquote { margin:10px 0; padding-left:12px; border-left:4px solid var(--ink); }
.wwh-small { font-size:.95rem; }
.wwh-nav, .wwh-actions { display:flex; gap:12px; flex-wrap:wrap; }
.wwh-nav[hidden] { display:none; }
.wwh-tool button { min-height:44px; min-width:88px; padding:8px 18px; font:inherit; font-weight:700; border:2px solid var(--ink); border-radius:4px; background:#fff; color:var(--ink); }
.wwh-tool button:disabled { opacity:.55; cursor:default; }
.wwh-status { min-height:1.5em; font-weight:600; }
@media (max-width:480px) { .wwh-tool { padding:14px; } .wwh-step { padding:16px; } .wwh-s3 .wwh-text { font-size:2.1rem; } }
@media (prefers-reduced-motion: reduce) { .wwh-tool * { transition:none !important; animation:none !important; } }
@media print {
  @page { size:A5; margin:12mm; }
  .site-header, .site-footer, .skip-link, .breadcrumb, .page-heading, .prose > *:not(#wwh-tool), .wwh-controls, .wwh-hint, .wwh-nav, .wwh-actions, .wwh-status, .wwh-tool > h2, .wwh-tool > p { display:none !important; }
  .wwh-tool { border:0; background:none; margin:0; padding:0; display:block !important; }
  .wwh-pages { margin:0; }
  .wwh-step, .wwh-step.wwh-off { display:flex !important; flex-direction:column; justify-content:center; align-items:center; text-align:center; border:0; margin:0; padding:0; height:170mm; break-after:page; page-break-after:always; break-inside:avoid; }
  .wwh-step:last-child { break-after:auto; page-break-after:auto; }
  .wwh-icon { width:40mm; height:40mm; }
  .wwh-body { flex:0 1 auto; }
  .wwh-s1 .wwh-text, .wwh-s2 .wwh-text, .wwh-s3 .wwh-text { font-size:22pt; }
  .wwh-box { text-align:left; font-size:11pt; }
  .wwh-box a { text-decoration:none; color:inherit; }
  .wwh-count { font-size:10pt; flex:none; }
}