/* 현장 창구(field.egsone.com) — 키트(/shared/kit) 위에 이 파일만. 직원 앱 CSS 는 싣지 않는다. 휴대폰이 기본 폭이고 누르는 칸은 크게. */
body{background:var(--bg)}
.fd-head{position:sticky;top:0;z-index:var(--z-nav);background:var(--surface);border-bottom:1px solid var(--line)}
.fd-head-in{max-width:40rem;margin:0 auto;padding:0 1rem;height:var(--header-h);display:flex;align-items:center;gap:.75rem}
.fd-brand{display:inline-flex;align-items:center;gap:.5rem;color:var(--text);font-weight:var(--fw-bold);white-space:nowrap}
.fd-brand img{height:var(--logo-h);width:auto}
.fd-me{margin-left:auto;display:flex;align-items:center;gap:.75rem;font-size:var(--fs-label)}
.fd-me a{color:var(--text-sub)}
.fd-who{font-weight:var(--fw-semibold)}
.fd-out{margin:0}
.fd-out button{background:none;border:0;padding:0;font:inherit;color:var(--text-sub)}
.fd-main{max-width:40rem;margin:0 auto;padding:1rem 1rem 2.5rem}
.fd-title{margin:0 0 .5rem;font-size:var(--fs-page-title);font-weight:var(--fw-bold)}
.fd-sub{margin:var(--sec-gap) 0 var(--sub-head-gap);font-size:var(--fs-title);font-weight:var(--fw-semibold)}
.fd-login{max-width:24rem;margin:1.5rem auto}
/* 주 단추(키트 .btn = 흰 단추 — 업무포털 portal.css 와 같은 검정 주 단추. 현장 창구 템플릿의 btn dark 가 흰 단추로 보이던 것) */
.btn.dark{background:var(--ink);border-color:var(--ink);color:var(--on-ink)}
@media (hover:hover) and (pointer:fine){.btn.dark:not(:disabled):hover{background:var(--ink-hover);border-color:var(--ink-hover)}}
.fd-wide{display:flex;justify-content:center;width:100%;margin-bottom:.75rem}
.fd-row{display:flex;align-items:center;justify-content:space-between;gap:.75rem;margin-bottom:.5rem;color:var(--text)}
.fd-row .hint{display:block}
.fd-list{list-style:none;margin:0;padding:0}
.fd-list li{display:flex;justify-content:space-between;gap:.75rem;padding:.625rem 0;border-bottom:1px solid var(--line)}
.fd-list .hint{display:block}
.card{margin-bottom:var(--gap)}
/* 알림 띠(현장 창구 공용 — 키트에 없어 여기) */
.flash{margin:0 0 .75rem;padding:.625rem .875rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface2);font-size:var(--fs-label)}
.flash.error{border-color:var(--red-soft);background:var(--red-soft);color:var(--red-ink)}
.flash.success{border-color:var(--green-soft);background:var(--green-soft);color:var(--green-ink)}
/* 개인 링크 — 측정 사진 업로드(2026-11-03 대표 · _p_parts.html · fphoto.js) — 폴더 칸 · 칸 화면(예시 스케치) · 촬영 선택 창 */
.fp-chip{display:inline-flex;align-items:center;height:var(--chip-h);padding:0 .5rem;border-radius:var(--radius-pill);background:var(--surface2);color:var(--text-sub);font-size:var(--fs-badge);white-space:nowrap}
.fp-chip.bad{background:var(--red-soft);color:var(--red-ink)}
.fp-up{margin:.5rem 0 .75rem}
.fp-pick{position:relative;overflow:hidden}
.fp-file{position:absolute;inset:0;width:100%;height:100%;opacity:0;font-size:var(--fs-input)}
.fp-prev{list-style:none;margin:.5rem 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.fp-prev li{display:flex;flex-direction:column;align-items:flex-start;gap:.25rem}
.fp-prev img{display:block;width:100%;height:6rem;object-fit:cover;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface2)}
.fp-msg:empty{display:none}
.fp-msg.bad{color:var(--red-ink)}
.fp-go{margin-top:var(--gap)}
.fp-go-hint{margin:0 0 var(--gap)}
.fp-tiles-hint{margin:var(--head-gap) 0 0}
/* 뒤로 · 폴더 칸(사진 앱·파일 앱의 폴더 모양 — 누르면 그 폴더 화면) */
.fp-back{display:inline-flex;align-items:center;gap:.25rem;min-height:var(--hit-min);margin:0 0 .25rem;color:var(--text-sub);font-size:var(--fs-label);text-decoration:none}
.fp-back svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fp-tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(8.5rem,1fr));gap:.75rem}
.fp-tile{display:flex;flex-direction:column;align-items:center;gap:.125rem;min-width:0;padding:.75rem .5rem;border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);color:var(--text);text-align:center;text-decoration:none}
.fp-ficon{width:3.5rem;height:auto;margin-bottom:.25rem;fill:var(--accent-soft);stroke:var(--accent);stroke-width:2;stroke-linejoin:round}
/* 폴더 이름은 임시 이름(날짜_시간_판독 전)이 길어 두 줄까지 — 토큰 같은 이름이라 글자 단위 줄바꿈 */
.fp-tile-name{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;max-width:100%;overflow:hidden;word-break:break-all;font-size:var(--fs-label);font-weight:var(--fw-semibold)}
.fp-tile-meta{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:var(--fs-hint);color:var(--text-sub)}
@media (hover:hover) and (pointer:fine){.fp-tile:hover{border-color:var(--accent)}}
.fp-ftitle{word-break:break-all}
.fp-acts{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin:.75rem 0 .25rem}
.fp-acts form{margin:0}
/* 칸 화면 — 측정 구분(고르기 단추 줄과 첫 단계 사이를 띄운다) · 단계 1 전체 → 2 구역(전체 사진을 n칸으로) → 3 명판 → 기타 */
.fp-kind{display:flex;flex-direction:column;gap:.5rem;margin-bottom:var(--sec-gap);padding-bottom:var(--sec-gap);border-bottom:1px solid var(--line)}
.fp-kind .field-label{margin-bottom:0}
.fp-kind .hint{margin:0}
.fp-segs{display:flex;flex-wrap:wrap;gap:.5rem .75rem}
.fp-step{margin-bottom:var(--sec-gap)}
.fp-step>.hint{margin:0 0 .5rem}
.fp-step-h{display:flex;align-items:center;gap:.5rem;margin:0 0 var(--sub-head-gap);font-size:var(--fs-title);font-weight:var(--fw-semibold)}
.fp-no{display:inline-flex;align-items:center;justify-content:center;flex:none;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--ink);color:var(--on-ink);font-size:var(--fs-badge);font-weight:var(--fw-bold)}
.fp-step.is-done .fp-no{background:var(--green)}
.fp-slot{position:relative;display:block;width:100%;min-height:var(--hit-min);padding:0;border:2px dashed var(--line);border-radius:var(--radius-sm);background:var(--surface2);color:var(--text);font:inherit;text-align:left;overflow:hidden}
.fp-slot:disabled{cursor:default}
.fp-slot.is-on{border-style:solid}
.fp-slot.is-next{border-style:solid;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-soft)}
.fp-next{position:absolute;left:50%;bottom:.375rem;transform:translateX(-50%);display:inline-flex;align-items:center;min-height:var(--chip-h);padding:0 .625rem;border-radius:var(--radius-pill);background:var(--accent);color:var(--on-ink);font-size:var(--fs-badge);font-weight:var(--fw-semibold);white-space:nowrap;pointer-events:none}
.fp-slot:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.fp-slot-all{aspect-ratio:4/3}
.fp-slot-plate{aspect-ratio:5/3;max-width:18rem}
.fp-slot-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:var(--surface)}
.fp-slot-img.is-ex{object-fit:contain;opacity:.6}
.fp-slot-k,.fp-slot-tag{position:absolute;top:.375rem;display:inline-flex;align-items:center;min-height:var(--chip-h);padding:0 .5rem;border-radius:var(--radius-pill);background:var(--surface);font-size:var(--fs-badge);line-height:var(--lh-snug);box-shadow:var(--shadow-sm)}
.fp-slot-k{left:.375rem;max-width:calc(100% - .75rem);font-weight:var(--fw-semibold)}
.fp-slot-tag{right:.375rem;color:var(--text-sub);white-space:nowrap}
.fp-slot-tag.bad{color:var(--red-ink)}
.fp-slot .fp-chip{position:absolute;left:.375rem;bottom:.375rem}
.fp-slot .fp-chip+.fp-chip{left:auto;right:.375rem}
.fp-zones{position:relative;display:grid;aspect-ratio:var(--ar,4/3);border:1px solid var(--line);border-radius:var(--radius-sm);overflow:hidden;background:var(--surface)}
.fp-z4{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
.fp-z6{grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
.fp-zones-bg{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;opacity:.55}
.fp-zones-bg.is-sketch{opacity:.9}
.fp-zones .fp-slot{height:100%;border-width:1px;border-radius:0;background:transparent}
.fp-zones .fp-slot.is-next{z-index:1}
.fp-zones .fp-slot-k{white-space:normal;padding:.125rem .375rem}
.fp-zones .fp-slot .fp-chip+.fp-chip{display:none}
.fp-etc{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.5rem}
.fp-slot-etc,.fp-slot-add{aspect-ratio:1}
.fp-slot-add{display:flex;align-items:center;justify-content:center;padding:.25rem;text-align:center;color:var(--text-sub);font-size:var(--fs-label)}
.fp-multi-hint{margin:0 0 .75rem}
/* 촬영 선택 창(키트 .mask·.modal — 휴대폰은 아래에서 올라오는 창) */
.fp-sheet-img{display:block;width:100%;max-height:50vh;object-fit:contain;margin-bottom:.75rem;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface2)}
.fp-sheet-hint{margin:0 0 .75rem}
.fp-sheet-hint:empty{display:none}
.fp-sheet-acts .fd-wide:last-child,.fp-sheet-acts form .fd-wide{margin-bottom:0}
.fp-sheet-acts form{margin:0 0 .75rem}
@media (max-width:40em){
  .fp-sheet{align-items:flex-end;padding:0}
  .fp-sheet .fp-sheet-in{margin:0;width:100%;border-radius:var(--radius-modal) var(--radius-modal) 0 0;padding-bottom:var(--sab)}
}
.fp-note{margin:.375rem 0 0;font-size:var(--fs-hint);color:var(--text-sub)}
.fp-note.bad{color:var(--red-ink)}
.fp-add>summary{cursor:pointer;padding:.375rem 0;font-size:var(--fs-label)}
.fp-steps{margin:.25rem 0 0;padding-left:1.25rem;font-size:var(--fs-hint);color:var(--text-sub);word-break:keep-all}
.fp-steps li+li{margin-top:.25rem}
/* 재촬영 요청(3단계) — 스케치(빨간 구역 + 측정점 번호) · 다시 촬영 · 측정값 직접 입력 · 미측정 보고 */
.fp-re{border-top:1px solid var(--line);padding:.75rem 0}
.fp-re:first-of-type{border-top:0;padding-top:0}
.fp-sketch{display:block;width:100%;height:auto;margin:.5rem 0;border:1px solid var(--line);border-radius:var(--radius-sm);background:var(--surface2)}
.fp-val{display:flex;align-items:center;gap:.5rem;margin:.375rem 0}
.fp-val .input{flex:1;min-width:0}
.fp-val-k{flex:0 0 5.5rem;font-size:var(--fs-label);font-weight:var(--fw-semibold)}
