:root{
  --bg:#f3f5f8; --card:#fff; --line:#d9dee6; --text:#1c2430; --muted:#5f6b7a;
  --primary:#1f5fbf; --primary-dark:#174a96; --ok:#1e8e4e; --warn:#c77d00; --bad:#c43b3b; --na:#6c7686;
  --radius:10px;
}
*{box-sizing:border-box}
html,body{margin:0;background:var(--bg);color:var(--text);font-family:"Malgun Gothic","맑은 고딕","Apple SD Gothic Neo","Noto Sans KR",sans-serif;font-size:14px;line-height:1.5}
button{font-family:inherit;font-size:13px;cursor:pointer;border:1px solid var(--line);background:#fff;color:var(--text);padding:6px 12px;border-radius:6px}
button:hover{background:#f0f3f8}
button.primary{background:var(--primary);border-color:var(--primary);color:#fff}
button.primary:hover{background:var(--primary-dark)}
button.danger{color:var(--bad);border-color:#e5b4b4}
button.danger:hover{background:#fbeeee}
button:disabled{opacity:.5;cursor:default}
input,select,textarea{font-family:inherit;font-size:14px;border:1px solid var(--line);border-radius:6px;padding:6px 8px;background:#fff;color:var(--text)}
input:focus,select:focus,textarea:focus{outline:2px solid #bcd0f0;border-color:var(--primary)}
textarea{resize:vertical;min-height:38px;width:100%}
.hidden{display:none !important}

/* top bar */
.topbar{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;padding:8px 16px;flex-wrap:wrap}
.topbar h1{font-size:16px;margin:0 12px 0 0;white-space:nowrap}
.topbar .spacer{flex:1}
.topbar .status{color:var(--muted);font-size:12px}

.container{max-width:1240px;margin:0 auto;padding:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px;margin-bottom:12px}
.card h2{font-size:15px;margin:0 0 10px}

/* list view */
table.list{width:100%;border-collapse:collapse}
table.list th,table.list td{border-bottom:1px solid var(--line);padding:8px 6px;text-align:left;font-size:13px}
table.list th{background:#f7f9fc;color:var(--muted);font-weight:600}
table.list tr:hover td{background:#fafcff}
.empty{color:var(--muted);padding:30px;text-align:center}
.badge{display:inline-block;padding:1px 8px;border-radius:999px;font-size:12px;font-weight:600;color:#fff;background:var(--na)}
.badge.ok{background:var(--ok)} .badge.warn{background:var(--warn)} .badge.bad{background:var(--bad)}

/* edit view */
.meta-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px}
.meta-grid label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--muted)}
.meta-grid input,.meta-grid select{width:100%}
.tabs{display:flex;gap:4px;border-bottom:2px solid var(--line);margin-bottom:12px}
.tabs button{border:none;border-radius:6px 6px 0 0;background:transparent;padding:8px 16px;font-size:14px;color:var(--muted)}
.tabs button.active{color:var(--primary);font-weight:700;box-shadow:inset 0 -2px 0 var(--primary)}
.edit-layout{display:grid;grid-template-columns:240px 1fr;gap:14px;align-items:start}
@media (max-width:900px){.edit-layout{grid-template-columns:1fr}.sidenav{position:static !important}}
.sidenav{position:sticky;top:60px}
.sidenav .score{font-size:13px;margin-bottom:10px}
.sidenav .score b{font-size:20px}
.sidenav a{display:flex;justify-content:space-between;gap:6px;padding:6px 8px;border-radius:6px;color:var(--text);text-decoration:none;font-size:13px}
.sidenav a:hover{background:#eef3fb}
.sidenav a small{color:var(--muted)}
.sidenav a.done small{color:var(--ok)}

.cat-title{font-size:15px;font-weight:700;margin:18px 0 8px;padding-left:10px;border-left:4px solid var(--primary)}
.item{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:12px 14px;margin-bottom:10px;transition:box-shadow .15s}
.item.active{box-shadow:0 0 0 2px #bcd0f0}
.item.dragover{outline:3px dashed var(--primary);outline-offset:-4px;background:#eef5ff}
.item.dragover::after{content:"여기에 놓으면 이 항목에 사진이 추가됩니다";display:block;text-align:center;color:var(--primary);font-weight:700;padding:6px 0 0}
.item.hover-target{box-shadow:0 0 0 1px #bcd0f0}
.item .q{display:flex;gap:10px}
.item .no{flex:0 0 auto;min-width:32px;height:32px;border-radius:8px;background:#eef3fb;color:var(--primary);font-weight:700;display:flex;align-items:center;justify-content:center;font-size:14px;padding:0 6px}
.item .no.must{background:#fdeeee;color:var(--bad)}
.item .text{flex:1;font-size:14px}
.item .details{margin:6px 0 0;padding-left:14px;color:var(--muted);font-size:12.5px}
.item .details li{list-style:none;margin:1px 0}
.item .row{display:flex;gap:14px;flex-wrap:wrap;margin-top:10px;align-items:flex-start}
.scores{display:flex;gap:4px;align-items:center}
.scores .lbl{font-size:12px;color:var(--muted);margin-right:4px}
.scores button{min-width:36px;padding:5px 0;font-weight:700}
.scores button.sel{background:var(--primary);color:#fff;border-color:var(--primary)}
.scores button.sel.s0,.scores button.sel.s1{background:var(--bad);border-color:var(--bad)}
.scores button.sel.s2{background:var(--warn);border-color:var(--warn)}
.scores button.sel.na{background:var(--na);border-color:var(--na)}
.finding{flex:3;min-width:280px}
.note{flex:1;min-width:160px}
.finding textarea,.note textarea{min-height:36px;overflow:hidden;resize:none;line-height:1.5}
.fld-lbl{font-size:11.5px;color:var(--muted);margin-bottom:2px}
.photos{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px;align-items:center}
.thumb{width:84px;height:84px;border-radius:6px;overflow:hidden;border:1px solid var(--line);position:relative;cursor:pointer;background:#f0f0f0}
.thumb img{width:100%;height:100%;object-fit:cover;display:block}
.thumb .cap{position:absolute;left:0;right:0;bottom:0;background:rgba(0,0,0,.55);color:#fff;font-size:10px;padding:1px 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.addphoto{width:84px;height:84px;border:1.5px dashed #b7c3d6;border-radius:6px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--primary);font-size:12px;gap:2px;background:#fafcff}
.addphoto:hover{background:#eef3fb}
.addphoto span{font-size:22px;line-height:1}
.hint{font-size:11.5px;color:var(--muted)}

/* summary tab */
.sum-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:12px}
.big{font-size:30px;font-weight:700}
.judge{font-size:18px;font-weight:700;padding:4px 12px;border-radius:8px;display:inline-block;color:#fff;background:var(--na)}
.judge.ok{background:var(--ok)}.judge.warn{background:var(--warn)}.judge.bad{background:var(--bad)}
table.sum{width:100%;border-collapse:collapse;font-size:13px}
table.sum th,table.sum td{border:1px solid var(--line);padding:5px 8px;text-align:center}
table.sum th{background:#f7f9fc}
table.sum td.l{text-align:left}

/* modal */
.modal{position:fixed;inset:0;background:rgba(0,0,0,.72);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px}
.modal .box{background:#fff;border-radius:10px;max-width:min(96vw,1000px);max-height:94vh;display:flex;flex-direction:column;overflow:hidden}
.modal img{max-width:100%;max-height:70vh;object-fit:contain;background:#111;display:block}
.modal .bar{display:flex;gap:8px;padding:10px;align-items:center;flex-wrap:wrap}
.modal .bar input{flex:1;min-width:200px}
.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background:#222;color:#fff;padding:8px 16px;border-radius:8px;font-size:13px;z-index:200;opacity:0;transition:opacity .2s;pointer-events:none}
.toast.show{opacity:1}

/* ===================== REPORT ===================== */
.report-tools{background:#fff;border-bottom:1px solid var(--line);padding:8px 16px;display:flex;gap:10px;align-items:center;flex-wrap:wrap;position:sticky;top:0;z-index:40}
.report-tools label{font-size:13px;display:flex;gap:4px;align-items:center}
.paper{background:#fff;width:210mm;min-height:297mm;margin:16px auto;padding:14mm 14mm;box-shadow:0 2px 12px rgba(0,0,0,.12);color:#000;font-size:10.5pt;line-height:1.45}
.paper h1{font-size:18pt;text-align:center;margin:0 0 4mm;letter-spacing:1px}
.paper .sub{text-align:center;color:#333;font-size:10pt;margin-bottom:6mm}
.paper h2{font-size:12.5pt;margin:7mm 0 2.5mm;padding-left:3mm;border-left:3.5pt solid #1f5fbf;break-after:avoid}
.paper table{width:100%;border-collapse:collapse;font-size:9.5pt}
.paper th,.paper td{border:1px solid #555;padding:3px 5px;vertical-align:top}
.paper th{background:#eef1f6;font-weight:700;text-align:center}
.paper td.c{text-align:center}
.paper td.num{text-align:center;font-weight:700;width:9mm}
.paper tr{break-inside:avoid}
.paper .cat td{background:#f4f6fa;font-weight:700}
.paper .det{color:#333;font-size:8.5pt;margin:2px 0 0 0;padding-left:3mm}
.paper .det div{margin:0}
.paper .photos{display:flex;flex-wrap:wrap;gap:3mm;margin:0}
.paper .ph{break-inside:avoid;text-align:center;font-size:8pt;color:#333}
.paper .ph img{display:block;border:1px solid #888;object-fit:cover}
.paper .ph.sm img{width:38mm;height:28mm}
.paper .ph.md img{width:55mm;height:41mm}
.paper .ph.lg img{width:84mm;height:63mm}
.paper .box{border:1.5px solid #333;padding:4mm;display:flex;gap:6mm;align-items:stretch;flex-wrap:wrap}
.paper .box .k{flex:1;min-width:60mm}
.paper .box .k .t{font-size:9pt;color:#444}
.paper .box .k .v{font-size:16pt;font-weight:700}
.paper .box .k .j{font-size:14pt;font-weight:700;padding:1px 8px;border:2px solid #000;display:inline-block;margin-top:2px}
.paper .j.ok{color:#1e8e4e;border-color:#1e8e4e !important}.paper .j.warn{color:#c77d00;border-color:#c77d00 !important}.paper .j.bad{color:#c43b3b;border-color:#c43b3b !important}
.paper .bad-txt{color:#c43b3b;font-weight:700}
.paper .sign{margin-top:10mm;display:flex;gap:10mm;justify-content:flex-end}
.paper .sign div{border-bottom:1px solid #000;min-width:60mm;padding:0 2mm 1mm;font-size:10pt}
.paper .foot{margin-top:6mm;font-size:8.5pt;color:#444}
.paper .rule{font-size:8.5pt;color:#333;margin-top:2mm;line-height:1.4}
.pb{break-before:page}
.paper .pre{white-space:pre-wrap;word-break:break-word}
/* 가로 평가표 서식 */
.paper.land{width:297mm;min-height:210mm}
.paper.fm{padding:10mm 10mm;font-size:9.5pt}
.paper .ph img{max-width:100%}
.paper.fm h1{font-size:14pt;text-align:left;letter-spacing:0;margin:0 0 3mm}
.paper.fm h1 span{font-size:10.5pt;font-weight:400}
.paper.fm table.form{table-layout:fixed}
.paper.fm table.form th,.paper.fm table.form td{font-size:9pt;padding:3px 5px}
.paper.fm table.info{margin-bottom:2mm}
.paper.fm table.info th{width:18mm}
.paper.fm .rule-cell{font-size:8pt;line-height:1.4;color:#222}

@media print{
  @page{size:A4;margin:12mm}
  body{background:#fff}
  .topbar,.report-tools,.no-print{display:none !important}
  .paper{width:auto;min-height:0;margin:0;padding:0;box-shadow:none}
  .paper h2{page-break-after:avoid}
  .paper tr,.paper .ph{page-break-inside:avoid}
  .pb{page-break-before:always}
}