:root { --paper: #f2ece0; --ink: #1c1a17; --mute: #766d5f; --line: #bfb299; --red: #b23b25; }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 14px/1.65 "IBM Plex Sans KR", "Malgun Gothic", sans-serif; word-break: keep-all; overflow-wrap: anywhere; }
.sheet { max-width: 900px; margin: auto; padding: 36px 28px 60px; }
.sheet-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 28px; }
.sheet-toolbar a { color: var(--ink); font-weight: 600; }
.sheet-toolbar button { min-height: 44px; padding: 10px 20px; font: inherit; border: 0; background: var(--red); color: #fffaf1; border-radius: 24px; cursor: pointer; }
:focus-visible { outline: 2px solid var(--red); outline-offset: 4px; }
.sheet-head { display: flex; align-items: center; gap: 18px; border-bottom: 2px solid var(--ink); padding-bottom: 18px; }
.seal { position: relative; flex: none; width: 48px; height: 48px; display: grid; place-items: center; background: var(--red); color: #fffaf1; border-radius: 5px; font: 900 28px "Noto Serif KR", serif; transform: rotate(-3deg); }
.seal[data-r]::after { content: attr(data-r); position: absolute; top: 100%; color: var(--mute); font: 10px/1.5 "IBM Plex Sans KR", sans-serif; }
h1 { margin: 0; font: 900 27px/1.25 "Noto Serif KR", serif; }
h1 small { display: block; margin-top: 6px; font: 13px/1.4 "IBM Plex Sans KR", sans-serif; color: var(--mute); }
h2 { font: 700 20px/1.5 "Noto Serif KR", serif; margin: 32px 0 12px; }
h3 { font-size: 14px; margin: 0 0 5px; }
.sheet-hint, .sheet-block > p { font-size: 12px; color: var(--mute); }
.sheet-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.sheet-block { margin: 12px 0; break-inside: avoid; }
.sheet-grid .sheet-block { margin: 0; }
.sheet-block > p { margin: 0 0 5px; }
.write-field { min-height: 68px; padding: 10px; border: 1px solid var(--line); background: #fffaf1; white-space: pre-wrap; overflow-wrap: anywhere; }
.decision-book { list-style: none; padding: 0; border-top: 1px solid var(--line); }
.decision-book li { display: grid; grid-template-columns: 100px 1fr; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); break-inside: avoid; }
.decision-book li > span { color: var(--mute); font-size: 12px; }
.decision-book p { margin: 0; }
.decision-book small { display: block; color: var(--red); font-size: 11px; }
.needs-review { color: var(--red); }
table { width: 100%; border-collapse: collapse; margin: 10px 0; }
th, td { text-align: left; padding: 8px 10px; border: 1px solid var(--line); }
th { font-size: 12px; }
.sheet-rules { padding-left: 22px; }
.sheet-rules li { margin-bottom: 6px; }
.sheet-foot { border-top: 1px solid var(--line); padding-top: 16px; color: var(--mute); font-size: 12px; }
rt { font: 10px/1 "IBM Plex Sans KR", sans-serif; color: var(--mute); }
@media(max-width: 640px) { .sheet { padding: 24px 16px 40px; } .sheet-grid { grid-template-columns: 1fr; } h1 { font-size: 22px; } .decision-book li { grid-template-columns: 1fr; gap: 4px; } }
@page { size: A4; margin: 16mm; }
@media print {
  body { background: white; font-size: 11px; }
  .sheet { max-width: none; padding: 0; }
  .sheet-toolbar, .site-footer { display: none !important; }
  h1 { font-size: 22px; } h2 { margin-top: 16px; font-size: 17px; break-after: avoid; }
  h3 { font-size: 12px; break-after: avoid; }
  .sheet-grid { grid-template-columns: 1fr 1fr; }
  .write-field { background: white; min-height: 42px; padding: 6px; }
  .case-sheet { break-before: page; }
  .decision-book li { grid-template-columns: 80px 1fr; padding: 6px 0; }
  table, .sheet-rules { break-inside: avoid; }
  .sheet-hint, .sheet-block > p, .sheet-foot { font-size: 10px; }
}