@font-face{font-family:Noto;src:url('fonts/NotoSansKR-Variable.woff2');font-weight:100 900}
:root{--ink:#26231f;--muted:#726d66;--accent:var(--nn-category-work-accent);--surface:#faf9f6;--line:#e7e0d7;--label-bg:#f3eee7;--notebook-paper:var(--surface)}
*{box-sizing:border-box}body{margin:0;font-family:Noto,'Noto Sans KR',sans-serif;color:var(--ink);word-break:keep-all;overflow-wrap:break-word;background:var(--nn-texture-paper),var(--surface)}
h1,h2,p,ol,ul,figure{margin:0}h1{font-size:26pt;font-weight:700;line-height:1.2;color:var(--accent);letter-spacing:-.035em;text-wrap:balance}h2{font-size:15pt;line-height:1.4;margin-bottom:2mm}p,li{ text-wrap:pretty}ol,ul{padding-left:6mm}ol>li+li{margin-top:2mm}p+p{margin-top:1em}a{color:var(--accent)}
.eyebrow{font-size:11pt;color:var(--muted);letter-spacing:.12em;margin:0 0 1mm;line-height:1.4}.chip{display:inline-block;border:1px solid var(--accent);border-radius:999px;padding:0 2mm;background:var(--label-bg);font-size:11.5pt;color:var(--accent);line-height:1.6;letter-spacing:0}
.sheet{position:relative;background:var(--nn-texture-paper),var(--surface);box-shadow:none;scroll-margin-top:80px}header,footer{display:flex;justify-content:space-between;align-items:center;font-size:11pt;color:var(--muted);border-bottom:1px solid var(--line)}header span:first-child{letter-spacing:.12em}footer{border:0;border-top:1px solid var(--line)}
.page-body{display:flex;flex-direction:column;gap:5mm}.slot{width:100%;flex:none;min-width:0}.slot:not(.title){border-top:1px solid var(--line);padding-top:3mm}.ink{width:100%;min-width:0}.steps,.memo,.cover-note{font-size:12pt;line-height:1.7}.steps p,.memo p{font-size:12pt;line-height:1.7;margin-bottom:1em}.caption-check{font-size:12pt;line-height:1.7}.caption-check:has(.ink:empty){display:none}.request{font-size:11.5pt;line-height:1.6;padding:4mm;background:var(--surface);border:0!important;border-left:3px solid var(--accent)!important;border-radius:8px;box-shadow:none}.request p+p{margin-top:.5lh}.request h2{font-size:11.5pt}.request .copy{float:right;margin:0 0 3mm 3mm}.request ol{font-size:12pt;line-height:1.7}
.check{font-size:11.5pt;line-height:1.6;background:var(--label-bg);border:1px solid var(--line)!important;border-radius:8px;padding:4mm!important;box-shadow:none}.check li+li{margin-top:1mm}.check ul,.send-check{list-style:'✓  ';padding-left:5mm}.inline-check{margin-top:4mm}.send-check{font-size:11.5pt;margin-top:3mm}.nn-surface-sheet{box-shadow:none}.check .ink{height:auto}
.visual,.pair{display:flex;align-items:stretch;justify-content:center;gap:3mm;height:100%}.capture{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;min-width:0;min-height:0;flex:1;margin:0;padding:0;transform:none;border:0;background:none;box-shadow:none}.frame{display:block;position:relative;min-width:0;min-height:0;max-width:100%}.capture img{display:block;max-width:100%;object-fit:contain;transform:none;cursor:zoom-in}.capture figcaption{align-self:stretch;letter-spacing:.05em;font-size:10pt;white-space:nowrap}.diagram .frame,.diagram img{width:100%;height:auto}.pin{position:absolute;z-index:3;width:6mm;height:6mm;border-radius:50%;background:var(--accent);color:var(--nn-editor-white);font:600 11pt/6mm Noto;text-align:center;transform:translate(-50%,-50%);pointer-events:none}.target{position:absolute;border:2px solid var(--accent);border-radius:8px;pointer-events:none;z-index:2}
.result{width:60%;align-self:center;padding-top:3mm}.result>.ink{height:100%;display:flex;gap:3mm}.result .frame{flex:1;min-height:0;display:flex;align-items:flex-start;justify-content:center;width:100%}.result img{height:100%;max-height:100%;width:100%;object-fit:contain;object-position:top}.cover-image{width:70%;align-self:center}.cover-image .ink{display:flex;gap:3mm;height:105mm}.cover-image .capture{width:50%}.cover-image .frame{height:100%;width:100%}.cover-image img{height:100%;width:100%;object-fit:contain}.phone-pair>.capture{width:50%;flex:1}.phone-pair img{width:100%;max-height:118.5mm}.phone-labels{width:50%;font-size:12pt;line-height:1.7;align-self:center}.side-check{width:100%}.side-check>.ink{align-items:flex-start}.side-check>.ink>.capture,.side-check>.ink>.check{width:50%;flex:1}.side-check>.ink>.check{height:auto}.photo-grid{width:100%}.photo-grid .ink{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3mm}.photo-grid img{width:100%;height:auto}.five-results .ink{display:flex;gap:2mm}.five-results .capture{width:20%}.five-results .frame{width:100%}.five-results img{width:100%;height:auto}.glossary table{border-collapse:collapse;width:100%;font-size:12pt;line-height:1.5}th,td{text-align:left;vertical-align:top;padding:.65mm 2mm;border-bottom:1px solid var(--line)}th{width:30%;font-weight:600}tr:first-child th{background:var(--label-bg);color:var(--accent);font-weight:700}.filename{font:inherit}.mobile-break{display:none}.progress{position:sticky;top:0;z-index:10;display:flex;justify-content:center;flex-wrap:wrap;gap:12px;padding:14px;background:var(--nn-texture-paper),var(--surface);border-bottom:1px solid var(--line)}.progress a{font-size:15px;text-decoration:none;padding:4px 8px;border-radius:8px}.progress a[aria-current]{background:var(--accent);color:white}#status{position:fixed;right:12px;bottom:12px;background:var(--surface);z-index:20}.zoom-dialog{padding:20px;max-width:96vw;max-height:96vh;border:1px solid var(--line);border-radius:8px;background:var(--surface)}.zoom-dialog img{display:block;max-width:88vw;max-height:82vh;object-fit:contain}.zoom-dialog button{margin-bottom:8px}.zoom-dialog::backdrop{background:#26231fa8}.compare-view{position:relative;width:100%;aspect-ratio:326/457;overflow:hidden}.compare-view>img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.compare-view .after{clip-path:inset(0 0 0 var(--split,50%))}.compare-view input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;touch-action:pan-y}.compare-view::after{content:'';position:absolute;pointer-events:none;left:var(--split,50%);top:0;bottom:0;border-left:3px solid var(--accent)}.compare-control{font-size:14px;color:var(--accent)}
@page{size:A4;margin:0}
@media print{.progress,#status,.copy,.compare-control,.compare-view,.zoom-dialog{display:none!important}.spread{display:contents}main{padding:0}.sheet{width:210mm;height:297mm;break-after:page;overflow:hidden}header,footer{position:absolute;left:16mm;width:178mm;height:8mm}header{top:18mm}footer{top:271mm}.page-body{position:absolute;left:16mm;top:30mm;width:178mm;height:237mm;gap:0;display:block}.slot{position:absolute}.diary-photo,.diary-photo__frame{margin:0;padding:0;border:0;background:none;box-shadow:none;transform:none}.diary-photo__frame::before,.diary-photo__frame::after{display:none}.step-big{display:none}.check input{display:none}.check label{display:contents}.result .capture{height:100%}.diagram .visual{height:100%}.diagram .frame{height:100%}.diagram img{height:100%;width:100%;object-fit:contain}.five-results .frame{height:auto}.five-results img{height:auto}.check ul{list-style:'✓  '}}
@media screen{main{max-width:1600px;padding:20px;margin:auto}.spread{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;margin:24px 0;align-items:start}.spread:first-child,.spread:has(#page-20){display:block;max-width:850px;margin:24px auto}.sheet{padding:24px;border:1px solid var(--line);border-radius:8px;min-width:0}header,footer{font-size:12px;gap:12px;padding:8px 0}header span:last-child{max-width:52%;text-align:right}footer{margin-top:24px}.page-body{padding-top:20px;gap:24px}.slot{position:relative!important;top:auto!important;left:auto!important;height:auto!important}.title .eyebrow{font-size:15px}h1{font-size:30px;line-height:1.35}.steps,.memo,.cover-note,.request,.check,.caption-check,.request ol{font-size:17px;line-height:1.7}.steps p,.memo p{font-size:17px}.request,.check{padding:18px!important}.chip{font-size:16px}.glossary table{font-size:16px}.result{width:100%}.result>.ink{height:auto}.result img{height:auto;max-height:none}.result .frame{display:block}.result .capture{width:50%}.result .eyebrow{white-space:normal;font-size:14px}.cover-image{width:70%}.cover-image .ink{height:330px}.cover-image img{height:330px}.photo-grid .ink{grid-template-columns:repeat(4,minmax(0,1fr))}.phone-pair img{max-height:none}.check ul{list-style:none;padding:0}.check label{display:flex;gap:8px;align-items:flex-start;cursor:pointer}.check input{accent-color:var(--accent);width:20px;height:20px;flex:none;margin-top:5px}.check label:has(input:checked){text-decoration:line-through;color:var(--muted)}.step-big{font-size:44px;font-weight:700;color:var(--accent);margin-right:10px;vertical-align:middle}.diagram .capture,.result .capture,.cover-image .capture{padding:10px;background:var(--nn-texture-paper),var(--label-bg);border:1px solid var(--line);border-radius:8px;transform:none;margin:12px 0}.diary-photo__frame{padding:0;background:none;border:0;box-shadow:none;transform:none}.diary-photo__frame::before,.diary-photo__frame::after{top:-17px;width:35px;height:16px;pointer-events:none}.diary-photo__frame::before{left:0}.diary-photo__frame::after{right:0}.capture{overflow:visible}.capture:after{content:'';width:10px;height:24px;border:2px solid var(--accent);border-radius:8px;transform:rotate(22deg);position:absolute;right:3px;top:-13px;font-size:18px;pointer-events:none}.compare-view{display:block}.compare-view img{cursor:ew-resize}ol>li+li{margin-top:8px}.check li+li{margin-top:8px}}
@media screen and (max-width:899px){main{padding:0 12px 20px}.spread{display:flex;flex-direction:column;gap:20px}.sheet{width:100%;padding:20px 16px}.page-body{gap:20px}h1{font-size:28px}.mobile-break{display:block}.progress{gap:2px;padding:8px 4px}.progress a{font-size:13px;padding:4px 6px}.cover-image{width:100%}.cover-image .ink,.cover-image img{height:260px}.photo-grid .ink{grid-template-columns:repeat(2,minmax(0,1fr))}.five-results .eyebrow{font-size:12px;letter-spacing:0}.five-results .capture{padding:0}.five-results .capture:after{display:none}.request .copy{float:none;display:block;margin:0 0 16px}.side-check>.ink{flex-direction:column}.side-check>.ink>.capture,.side-check>.ink>.check{width:100%}.step-big{font-size:38px}header{font-size:11px}.result .capture{padding:5px}.phone-labels{font-size:16px}}
/* Common print flow spacing uses 1mm separators; type sizes stay approved. */
@media print{.slot:not(.title){padding-top:1mm}.check{padding:4mm!important}.request{padding:4mm!important}.steps p,.memo p{margin-bottom:1em}.glossary table{line-height:1.3}.glossary th,.glossary td{padding:.35mm 2mm}.glossary th{width:25%}.check .chip{white-space:nowrap}.side-check>.ink>.capture{flex:1}.side-check>.ink>.check{flex:1.2;min-width:0}.side-check .chip{white-space:nowrap}.photo-grid .ink{grid-template-columns:repeat(2,minmax(0,1fr))}.photo-grid img{max-height:47mm;width:100%;object-fit:contain}.cover-image .capture img{height:105mm}.cover-image .capture:first-child img{object-fit:cover}}

.side-check .check>.ink{display:block;height:auto}.side-check .check .chip{white-space:nowrap}.cover-image .capture:first-child img{object-fit:contain}

/* A20b: annotations follow the rendered bitmap, never the allocated slot. */
.annotated{aspect-ratio:var(--image-ratio);height:auto!important;align-self:flex-start;flex:none!important}
.annotated img{width:100%!important;height:auto!important}.leaders{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:2}
.phone-pair .annotated{width:auto;max-width:100%;height:auto!important}.phone-labels{position:relative;align-self:stretch}.phone-labels p{position:absolute;margin:0;top:67%;font-size:11pt}.phone-labels p+p{top:83%}
.final-pair .ink{display:flex;justify-content:center;gap:3mm;height:100%}.final-pair .capture{flex:0 1 auto;height:100%;width:auto}.final-pair .frame{height:calc(100% - 6mm);width:auto}.final-pair img{height:100%;width:auto;max-width:100%;object-fit:contain}
.cover-image .ink{height:75mm}.cover-image .capture{flex:0 1 auto;width:auto}.cover-image .frame{height:75mm;width:auto}.cover-image img{height:75mm!important;width:auto!important;max-width:100%;object-fit:contain}.cover-image{margin-top:7mm}
@media print{#page-2 .diagram{width:165mm!important;left:6.5mm!important}.phone-pair .annotated{width:calc(118.5mm * 375 / 812);max-height:118.5mm}.phone-pair .annotated img{max-height:118.5mm}.cover-image{margin-top:0}.cover-image .ink{height:75mm}.result .frame{display:block;height:100%}.result img{height:100%;width:100%;object-fit:contain}.compare-control{display:none!important}}
@media screen{html{scroll-padding-top:var(--progress-height,100px)}.sheet{scroll-margin-top:var(--progress-height,100px)}.progress{position:relative;top:auto}.cover-image .ink{height:auto;align-items:start}.cover-image .frame{height:220px}.cover-image img{height:220px!important}.final-pair .ink{height:420px}.phone-pair .annotated{width:100%;max-width:100%}.phone-labels p{font-size:14px}.compare-control{margin-top:12px}.compare-control button{margin-bottom:12px}.compare-control:not(.is-open) .compare-view{display:none}.result:has(.compare-control.is-open)>.ink{display:none}}
@media screen and (max-width:899px){.photo-grid .ink{gap:8px;grid-template-columns:repeat(2,minmax(0,1fr))}.photo-grid .capture{padding:0;margin:0}.photo-grid .frame{width:100%}.photo-grid img{width:100%}.cover-image .frame{height:160px}.cover-image img{height:160px!important}.cover-image .capture{padding:0;margin:0}.final-pair .ink{height:280px}.final-pair .capture{padding:0}.pin{width:18px;height:18px;font-size:11px;line-height:18px}}

.photo-grid .capture{width:100%!important}.photo-grid .frame{width:100%}.photo-grid img{width:100%}
@media screen{.progress{position:sticky;top:0}.sheet{scroll-margin-top:calc(var(--progress-height,100px) + 16px)}}

@media print{.cover-image .ink,.cover-image .frame{height:82mm}.cover-image img,.cover-image .capture img{height:82mm!important}}

/* A20c: end below the input border; 1.2mm endpoint. */
.endpoint{position:absolute;width:1.2mm;height:1.2mm;border-radius:50%;background:var(--accent);transform:translate(-50%,-50%);z-index:2;pointer-events:none}
#page-5 .result .pair{align-items:stretch}#page-5 .result .frame{height:100%}#page-5 .result img{height:100%;object-position:top}
@media screen{#page-5 .result .frame{height:300px}#page-5 .result img{width:100%;height:100%;object-fit:contain}}

/* Equal bitmap heights and top baselines without stretching. */
#page-5 .result .capture:first-child{flex:0.6533066132}#page-5 .result .capture:last-child{flex:1.2307692308}#page-5 .result .frame{height:auto;flex:none;width:100%}#page-5 .result img{width:100%;height:auto;max-height:none}#page-5 .result .pair{align-items:flex-start}

/* A20e: shared image-and-check layout; annotations stay in bitmap coordinates. */
#page-14 .phone-labels{align-self:flex-start;min-width:0}
#page-14 .phone-labels p{position:static;transform:none!important;margin:0;font-size:12pt}
#page-14 .phone-label-list{margin-bottom:4mm}
#page-14 .inline-check{margin-top:0}
@media print{
 #page-14 .phone-pair{align-items:flex-start}
 #page-14 .phone-pair>.capture{flex:0 0 auto;width:calc(var(--phone-height) * 375 / 812)}
 #page-14 .phone-pair .annotated{width:100%;max-height:none}
 #page-14 .phone-pair img{max-height:none}
 #page-14 .phone-labels{flex:1;width:auto}
}
@media screen{
 #page-14 .phone-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:12px;align-items:start}
 #page-14 .phone-pair>.capture,#page-14 .phone-labels{width:100%;min-width:0}
 #page-14 .phone-labels p{font-size:17px;line-height:1.7}
 #page-14 .phone-labels .check{padding:12px!important}
}

@media screen{#page-14 .phone-labels .check label>span{min-width:0;overflow-wrap:anywhere}}

/* A20f: stack phone notes below the image on narrow screens only. */
@media screen and (max-width:899px){
 #page-14 .phone-pair{grid-template-columns:minmax(0,1fr)}
 #page-14 .phone-labels{width:100%}
 #page-15 .side-check>.ink{flex-direction:column}
 #page-15 .side-check>.ink>.capture,#page-15 .side-check>.ink>.check{width:100%;flex:auto}
}