/* ═══════════════════════════════════════════════════════════════
   modal.css — 모달 · 사진 패널 · 보관함 · 설정 화면
   ═══════════════════════════════════════════════════════════════ */

/* ─ 모달 기반 ─ */
.mw { display:none; position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:999940; align-items:center; justify-content:center; }
.mw.on { display:flex; }
.mo { background:var(--bg); border-radius:var(--radius); padding:1.25rem; width:min(300px,92vw); border:1px solid var(--bdr2); box-shadow:0 8px 32px rgba(0,0,0,.2); }
.mo h3        { font-size:13px; font-weight:600; margin-bottom:8px; }
.mo .sub      { font-size:11px; color:var(--txt2); margin-bottom:10px; }
.mo label     { font-size:11px; color:var(--txt2); display:block; margin-bottom:4px; }
.mo input[type=text],
.mo input[type=password] { width:100%; font-size:12px; padding:8px 10px; border:1px solid var(--bdr2); border-radius:var(--radius-sm); background:var(--bg); color:var(--txt); outline:none; margin-bottom:10px; font-family:inherit; }
.mo input:focus { border-color:var(--acc); }
.mo p  { font-size:12px; color:var(--txt2); margin-bottom:12px; line-height:1.5; }
.ba   { width:100%; height:110px; font-size:10px; padding:7px 9px; border:1px solid var(--bdr2); border-radius:var(--radius-sm); background:var(--bg2); color:var(--txt2); outline:none; resize:none; font-family:monospace; margin-bottom:10px; }
.cp2  { display:flex; gap:5px; margin-bottom:12px; flex-wrap:wrap; }
.cc   { width:24px; height:24px; border-radius:50%; cursor:pointer; border:2px solid transparent; }
.cc.sl { border-color:var(--txt); transform:scale(1.15); }
.mb   { display:flex; gap:6px; justify-content:flex-end; }
.mb button { padding:7px 14px; font-size:12px; border-radius:var(--radius-sm); cursor:pointer; border:1px solid var(--bdr2); background:var(--bg); color:var(--txt); font-family:inherit; }
.mb button.ok  { background:var(--txt); color:var(--bg); border-color:var(--txt); }
.mb button.dng { background:#e24b4a; color:#fff; border-color:#e24b4a; }
.cpd  { font-size:11px; color:var(--success); text-align:center; min-height:16px; margin-top:4px; }

/* ─ 사진 패널 ─ */
#php { display:none; position:fixed; inset:0; background:rgba(0,0,0,.55); z-index:999943; align-items:flex-end; justify-content:center; }
#php.on { display:flex; }
.phm  { background:var(--bg); border-radius:20px 20px 0 0; width:min(500px,100%); max-height:88vh; display:flex; flex-direction:column; overflow:hidden; box-shadow:0 -4px 32px rgba(0,0,0,.2); }
.phh  { display:flex; align-items:center; gap:8px; padding:14px 16px; border-bottom:1px solid var(--bdr); flex-shrink:0; }
.pht  { font-size:14px; font-weight:600; color:var(--txt); flex:1; }
.phw  { font-size:10px; color:#F97316; background:rgba(249,115,22,.12); padding:2px 7px; border-radius:4px; }
.phca { font-size:11px; color:var(--txt2); background:none; border:none; cursor:pointer; padding:4px 8px; border-radius:4px; font-family:inherit; }
.phx  { width:28px; height:28px; border-radius:50%; background:var(--bg2); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:14px; color:var(--txt2); }
.php2 { display:flex; align-items:center; gap:10px; padding:8px 16px; background:var(--bg2); flex-shrink:0; }
.phpb { flex:1; height:4px; background:var(--bdr); border-radius:2px; overflow:hidden; }
.phpf { height:100%; background:#F97316; border-radius:2px; transition:width .25s; }
.phpt { font-size:11px; font-weight:500; color:var(--txt); white-space:nowrap; }
.phg  { flex:1; overflow-y:auto; padding:10px; display:grid; grid-template-columns:repeat(3,1fr); gap:6px; min-height:80px; }
.phl  { grid-column:1/-1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:40px; gap:10px; color:var(--txt2); font-size:12px; }
.phl i { font-size:28px; animation:spin 1s linear infinite; }
.phe2 { grid-column:1/-1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:40px; color:var(--txt3); font-size:12px; gap:8px; }
.phe2 i { font-size:36px; opacity:.3; }
.phc  { position:relative; aspect-ratio:1; border-radius:8px; overflow:hidden; cursor:pointer; }
.phci { width:100%; height:100%; object-fit:cover; display:block; pointer-events:none; }
.phc:hover .phci { opacity:.82; }
.phbg { position:absolute; top:5px; right:5px; min-width:22px; height:22px; border-radius:11px; background:#F97316; color:#fff; font-size:11px; font-weight:700; display:flex; align-items:center; justify-content:center; padding:0 5px; pointer-events:none; }
.phrm { position:absolute; top:4px; left:4px; width:20px; height:20px; border-radius:50%; background:rgba(0,0,0,.6); color:#fff; border:none; cursor:pointer; font-size:13px; display:flex; align-items:center; justify-content:center; opacity:0; transition:opacity .15s; z-index:2; }
.phc:hover .phrm, .phrm:focus { opacity:1; }
/* W3.480: 전송 제외된 사진 — 우측 상단 번호(.phbg)가 사라지는 것 자체가 표시이므로
   별도 테두리는 넣지 않고, 사진만 살짝 어둡게 해서 "빠졌다"는 느낌만 보조로 준다. */
.phc.excl .phci { opacity:.4; }
.ph-scroll { user-select:none; }

/* W3.490: ①번 스펙 — 전송 중 사진별 상태 아이콘(대기/업로드중/완료/실패).
   JS(snPh)가 .phc[data-pid]를 찾아 data-snd 속성만 바꿔주면 아래 CSS가 알아서 아이콘을 그린다. */
.phst { position:absolute; bottom:5px; left:5px; width:20px; height:20px; border-radius:50%; display:none; align-items:center; justify-content:center; pointer-events:none; z-index:3; }
.phc[data-snd] .phci { opacity:.55; transition:opacity .2s; }
.phc[data-snd="up"] .phci,
.phc[data-snd="ok"] .phci { opacity:.9; }
.phc[data-snd] .phst { display:flex; background:rgba(0,0,0,.6); }
.phc[data-snd="wait"] .phst::after { content:'⏳'; font-size:10px; line-height:1; }
.phc[data-snd="up"] .phst::after { content:''; width:10px; height:10px; border-radius:50%; border:2px solid rgba(255,255,255,.35); border-top-color:#fff; animation:spin .7s linear infinite; }
.phc[data-snd="ok"] .phst { background:#22c55e; }
.phc[data-snd="ok"] .phst::after { content:'✓'; color:#fff; font-weight:700; font-size:12px; line-height:1; }
.phc[data-snd="fail"] .phst { background:#ef4444; }
.phc[data-snd="fail"] .phst::after { content:'!'; color:#fff; font-weight:700; font-size:12px; line-height:1; }

/* W3.490: ①번 스펙 — 전체 진행률 바. 평소엔 숨겨져 있다가(.act) 전송 시작할 때만 나타난다. */
.ph-progress-track { display:none; height:6px; border-radius:3px; background:var(--bg2); overflow:hidden; margin:0 0 10px; }
.ph-progress-track.act { display:block; }
.ph-progress-fill { height:100%; width:0%; background:#F97316; border-radius:3px; transition:width .25s ease; }

.phf  { padding:14px 16px; border-top:1px solid var(--bdr); flex-shrink:0; }
.pham { width:100%; padding:10px; background:var(--bg2); border:1px dashed var(--bdr2); border-radius:8px; font-size:12px; color:var(--txt2); cursor:pointer; display:flex; align-items:center; justify-content:center; gap:5px; margin-bottom:10px; font-family:inherit; }
.pham:hover { background:var(--bg3); }
.phsp { height:1px; background:var(--bdr); margin:8px 0; }
.phbr { display:flex; align-items:center; gap:12px; margin-bottom:12px; padding:10px 12px; background:var(--bg2); border-radius:8px; }
.phbi { flex:1; }
.phbl { font-size:13px; font-weight:500; color:var(--txt); }
.phbs { font-size:10px; color:var(--txt2); margin-top:2px; }
.phsw { position:relative; display:block; width:44px; height:24px; cursor:pointer; flex-shrink:0; }
.phsw input { position:absolute; opacity:0; width:100%; height:100%; cursor:pointer; margin:0; z-index:1; }
.phst { display:block; width:44px; height:24px; background:var(--bdr2); border-radius:12px; transition:background .2s; position:relative; }
.phst::after { content:''; position:absolute; top:2px; left:2px; width:20px; height:20px; background:#fff; border-radius:50%; transition:transform .2s; }
.phsw input:checked + .phst { background:#F97316; }
.phsw input:checked + .phst::after { transform:translateX(20px); }
.phsn { width:100%; padding:13px; background:#F97316; color:#fff; border:none; border-radius:10px; font-size:14px; font-weight:600; cursor:pointer; display:flex; align-items:center; justify-content:center; gap:8px; font-family:inherit; }
.phsn:hover:not(:disabled) { background:#EA6700; }
.phsn:disabled { opacity:.35; cursor:not-allowed; }

/* W3.480: 전체포함/전체제외 툴바 */
.ph-select-bar { display:flex; align-items:center; gap:8px; padding:8px 16px; border-bottom:1px solid var(--bdr); flex-shrink:0; flex-wrap:wrap; }
.ph-sel-btn { display:flex; align-items:center; gap:5px; padding:6px 12px; border-radius:8px; border:1px solid var(--bdr2); background:var(--bg2); color:var(--txt2); font-size:12px; font-weight:500; cursor:pointer; font-family:inherit; white-space:nowrap; }
.ph-sel-btn:hover { background:var(--bg3); }

/* ─ 보관함 ─ */
#arch { display:none; position:fixed; inset:0; background:var(--bg); z-index:999944; flex-direction:column; animation:slideUp .2s ease; }
#arch.on { display:flex; }
.ahdr  { display:flex; align-items:center; gap:10px; padding:14px 16px; border-bottom:1px solid var(--bdr); flex-shrink:0; }
.abk   { width:32px; height:32px; border-radius:50%; background:var(--bg2); border:none; cursor:pointer; display:flex; align-items:center; justify-content:center; font-size:16px; color:var(--txt2); }
.abk:hover { background:var(--bg3); }
.ahtl  { font-size:16px; font-weight:600; color:var(--txt); flex:1; }
.acsl  { font-size:12px; font-weight:500; color:#F97316; background:none; border:none; cursor:pointer; padding:5px 10px; border-radius:6px; display:none; font-family:inherit; }
.acsl.on { display:block; }
.atabs { display:flex; flex-shrink:0; border-bottom:1px solid var(--bdr); }
.atab  { flex:1; padding:11px 6px; font-size:12px; font-weight:500; color:var(--txt2); background:none; border:none; cursor:pointer; border-bottom:2px solid transparent; display:flex; align-items:center; justify-content:center; gap:5px; font-family:inherit; }
.atab.on { color:#F97316; border-bottom-color:#F97316; }
.atcnt { font-size:10px; background:var(--bg2); color:var(--txt2); padding:1px 5px; border-radius:8px; }
.atab.on .atcnt { background:rgba(249,115,22,.12); color:#F97316; }
.abdy  { flex:1; overflow-y:auto; max-width:700px; width:100%; margin:0 auto; }
.apg   { display:grid; grid-template-columns:repeat(4,1fr); gap:2px; }
.apc   { position:relative; aspect-ratio:1; overflow:hidden; background:var(--bg2); cursor:pointer; user-select:none; }
.apc .apm { width:100%; height:100%; object-fit:cover; display:block; pointer-events:none; transition:opacity .15s; }
.apc.sl .apm { opacity:.6; }
.apc.sl::after { content:''; position:absolute; inset:0; border:3px solid #F97316; pointer-events:none; }
.apck  { position:absolute; top:6px; left:6px; min-width:22px; height:22px; padding:0 5px; border-radius:999px; border:2px solid rgba(255,255,255,.9); background:rgba(0,0,0,.35); display:none; align-items:center; justify-content:center; font-size:11px; font-weight:900; color:#fff; line-height:1; }
.apg.sel .apck { display:flex; }
.apc.sl .apck  { background:#F97316; border-color:#F97316; }
.apc.sent .apm { opacity:.42; }
.apc.sent::after { content:''; position:absolute; inset:0; background:rgba(249,115,22,.18); pointer-events:none; }
.apsent { position:absolute; right:6px; top:6px; z-index:2; padding:4px 6px; border-radius:999px; background:rgba(249,115,22,.95); color:#fff; font-size:10px; font-weight:900; box-shadow:0 2px 8px rgba(0,0,0,.18); pointer-events:none; }
.alg   { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; padding:10px; }
.alc   { border:1px solid var(--bdr3); border-radius:10px; overflow:hidden; cursor:pointer; background:var(--bg); position:relative; user-select:none; display:block; text-decoration:none; }
.alc.sl { border-color:#F97316; border-width:2px; }
.alth  { aspect-ratio:16/9; overflow:hidden; background:#0f0f0f; position:relative; }
.alth img { width:100%; height:100%; object-fit:cover; display:block; }
.althp { width:100%; height:100%; display:flex; align-items:center; justify-content:center; background:var(--bg2); color:var(--txt3); font-size:24px; }
.alyp  { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:32px; height:32px; border-radius:50%; background:rgba(255,0,0,.9); display:flex; align-items:center; justify-content:center; }
.alin  { padding:8px 10px; }
.altt  { font-size:11px; font-weight:500; color:var(--txt); line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; margin-bottom:5px; }
.altg  { display:flex; flex-wrap:wrap; gap:3px; margin-bottom:4px; }
.altag { font-size:9px; color:#F97316; background:rgba(249,115,22,.1); padding:2px 5px; border-radius:3px; white-space:nowrap; }
.aldt  { font-size:9px; color:var(--txt3); }
.alck  { position:absolute; top:7px; left:7px; z-index:2; width:22px; height:22px; border-radius:50%; border:2px solid rgba(255,255,255,.9); background:rgba(0,0,0,.45); display:none; align-items:center; justify-content:center; font-size:12px; color:#fff; }
.alg.sel .alck { display:flex; }
.alc.sl .alck  { background:#F97316; border-color:#F97316; }
.aemp  { display:flex; flex-direction:column; align-items:center; justify-content:center; padding:60px 20px; color:var(--txt3); gap:10px; text-align:center; }
.aemp i { font-size:44px; opacity:.2; display:block; }
.aet   { font-size:14px; font-weight:500; color:var(--txt2); }
.aes   { font-size:12px; line-height:1.5; }
.aab   { display:none; border-top:1px solid var(--bdr); padding:12px 16px 20px; background:var(--bg); flex-shrink:0; gap:8px; align-items:center; max-width:700px; width:100%; margin:0 auto; }
.aab.on { display:flex; }
.aai   { flex:1; font-size:13px; font-weight:500; color:var(--txt); }
.aact  { padding:9px 12px; border-radius:8px; border:1px solid var(--bdr2); background:var(--bg2); color:var(--txt); font-size:12px; font-weight:500; cursor:pointer; display:flex; align-items:center; gap:4px; white-space:nowrap; font-family:inherit; }
.aact:hover { background:var(--bg3); }
.aact.dng { color:#e24b4a; border-color:rgba(226,75,74,.3); background:rgba(226,75,74,.06); }
.aact.dng:hover { background:rgba(226,75,74,.12); }

/* ─ 설정 화면 ─ */
#setup { display:none; position:fixed; inset:0; background:var(--bg); z-index:50000; overflow-y:auto; align-items:center; justify-content:center; }
#setup.on { display:flex; }
.setup-wrap { width:min(420px,96vw); padding:2rem 1rem; }
.setup-logo { text-align:center; margin-bottom:2rem; }
.setup-logo .ico { width:72px; height:72px; border-radius:20px; background:#F97316; margin:0 auto 14px; display:flex; align-items:center; justify-content:center; font-size:38px; box-shadow:0 4px 20px rgba(249,115,22,.3); }
.setup-logo h1 { font-size:26px; font-weight:700; color:var(--txt); }
.setup-logo p  { font-size:14px; color:var(--txt2); margin-top:4px; }
.setup-card    { background:var(--bg2); border-radius:20px; padding:1.5rem; border:1px solid var(--bdr); }
.setup-card h2 { font-size:13px; font-weight:600; color:var(--txt2); margin-bottom:1.25rem; text-transform:uppercase; letter-spacing:.06em; }
.sf       { margin-bottom:14px; }
.sf label { font-size:12px; color:var(--txt2); display:block; margin-bottom:5px; font-weight:500; }
.sf input { width:100%; padding:10px 12px; font-size:13px; border:1px solid var(--bdr2); border-radius:var(--radius-sm); background:var(--bg); color:var(--txt); outline:none; font-family:inherit; }
.sf input:focus { border-color:var(--acc); }
.sf select { width:100%; padding:10px 12px; font-size:13px; border:1px solid var(--bdr2); border-radius:var(--radius-sm); background:var(--bg); color:var(--txt); outline:none; font-family:inherit; }
.sf select:focus { border-color:var(--acc); }
.sf .hint { font-size:11px; color:var(--txt3); margin-top:4px; line-height:1.5; }
.btn-main { width:100%; padding:13px; background:#F97316; color:#fff; border:none; border-radius:10px; font-size:15px; font-weight:600; cursor:pointer; margin-top:8px; display:flex; align-items:center; justify-content:center; gap:8px; font-family:inherit; }
.btn-main:hover { background:#EA6700; }
.btn-local { width:100%; padding:10px; background:transparent; color:var(--txt2); border:1px solid var(--bdr2); border-radius:10px; font-size:13px; cursor:pointer; margin-top:8px; font-family:inherit; }
.btn-local:hover { background:var(--bg3); }
.setup-err  { font-size:12px; color:var(--danger); min-height:18px; text-align:center; margin-top:6px; }
.setup-div  { display:flex; align-items:center; gap:10px; margin:14px 0; }
.setup-div hr   { flex:1; border:none; border-top:1px solid var(--bdr); }
.setup-div span { font-size:11px; color:var(--txt3); }

/* ─ 모바일 보관함 반응형 ─ */
@media (max-width: 600px) {
  .apg { grid-template-columns: repeat(3, 1fr); }
  .alg { grid-template-columns: 1fr 1fr; }
}

/* ─ 로고 이미지 ─ */
.ico-img {
  width: 82px; height: 70px;
  border-radius: 20px;
  margin: 0 auto 10px;
  display: block;
  box-shadow: 0 4px 20px rgba(249,115,22,.35);
}
.logo-txt-img {
  height: 34px; width: auto;
  display: block;
  margin: 0 auto 6px;
  /* 검정 텍스트를 현재 테마 색상에 맞게 반전 */
  filter: invert(1) brightness(0.15);
}
.setup-logo-combined {
  height: 62px; width: auto;
  display: block;
  margin: 0 auto 14px;
}
.setup-logo p { font-size:13px; color:var(--txt2); margin-top:2px; }

/* ── 모바일 사진 패널 풀스크린 + 주황 테마 ── */
@media (max-width: 600px) {
  #php {
    align-items: stretch !important;
    justify-content: stretch !important;
    background: rgba(0,0,0,.6) !important;
  }
  .phm {
    border-radius: 0 !important;
    max-height: 100dvh !important;
    height: 100dvh !important;
    width: 100% !important;
  }
  /* 헤더 주황색 */
  .phh {
    background: #F97316;
    color: #fff;
  }
  .pht { color: #fff !important; }
  .phw { background: rgba(255,255,255,.25) !important; color: #fff !important; }
  .phca { color: rgba(255,255,255,.85) !important; }
  .phx {
    background: rgba(255,255,255,.2) !important;
    color: #fff !important;
    border: none !important;
  }
  /* 진행바 주황 → 흰색 */
  .php2 { background: rgba(249,115,22,.1) !important; }
  .phpf { background: #fff !important; }
  .phpb { background: rgba(255,255,255,.3) !important; }
  .phpt { color: #fff !important; }
  /* 전송 버튼 */
  .phsn {
    background: #F97316 !important;
    box-shadow: 0 2px 12px rgba(249,115,22,.4);
  }
  /* 사진 그리드 여백 */
  .phg { gap: 3px !important; padding: 3px !important; }
  .phc { border-radius: 4px !important; }
  /* 하단 영역 */
  .phf { padding-bottom: max(14px, env(safe-area-inset-bottom)) !important; }
}

/* ── 사진 패널 새 레이아웃 ── */
@media (max-width: 600px) {
  /* phm을 flex column으로 */
  .phm { display:flex; flex-direction:column; }

  /* 상단 토글 영역 */
  .ph-toggles {
    display: flex; align-items: center;
    flex-shrink: 0;
    background: var(--bg);
    border-bottom: 1px solid var(--bdr);
    padding: 0;
  }
  .ph-toggle-item {
    flex: 1; display: flex; align-items: center;
    justify-content: space-between;
    padding: 10px 14px; gap: 8px;
  }
  .ph-toggle-divider {
    width: 1px; height: 36px; background: var(--bdr);
    flex-shrink: 0;
  }
  .ph-toggle-label {
    font-size: 13px; font-weight: 500; color: var(--txt);
  }

  /* 중간 스크롤 그리드 */
  .ph-scroll {
    flex: 1 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    min-height: 0 !important;
    grid-template-columns: repeat(3, 1fr) !important;
    gap: 2px !important;
    padding: 2px !important;
    align-content: start;
  }

  /* 하단 고정 영역 */
  .ph-bottom {
    flex-shrink: 0;
    padding: 10px 14px;
    padding-bottom: max(14px, env(safe-area-inset-bottom));
    background: var(--bg);
    border-top: 1px solid var(--bdr);
    display: flex; flex-direction: column; gap: 8px;
  }

  /* phh 주황 헤더 정렬 개선 */
  .phh {
    display: flex; align-items: center;
    padding: 12px 14px; gap: 10px;
  }
  .phh .phx { order: -1; }
  .phh .pht { flex: 1; text-align: center; font-size: 15px; font-weight: 600; }

  /* 빈 상태 */
  .phe2 { grid-column: 1/-1; }
}

/* ── 그리드 최대화 레이아웃 ── */
@media (max-width: 600px) {
  /* phm flex column */
  .phm { display:flex; flex-direction:column; overflow:hidden; }

  /* 헤더 최소화 — 타이틀 absolute 중앙 */
  .phh {
    flex-shrink:0; padding:5px 10px; min-height:36px;
    position:relative; display:flex; align-items:center;
  }
  .phh .pht {
    position:absolute; left:0; right:0;
    text-align:center; font-size:13px; font-weight:600;
    pointer-events:none;
  }
  .phh .phx { width:26px; height:26px; font-size:13px; z-index:1; }
  .phh .phca { margin-left:auto; z-index:1; }

  /* 그리드 — 남은 공간 전부 */
  .ph-scroll {
    flex: 1 !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    min-height: 0 !important;
    grid-template-columns: repeat(3,1fr) !important;
    gap: 2px !important;
    padding: 2px !important;
    align-content: start;
  }
  .phc { border-radius: 0 !important; }

  /* 빈 상태 */
  .phe2 { grid-column:1/-1; background:#fff; }
  .ph-add-btn {
    width:80px; height:80px; border-radius:50%;
    background:#F97316; color:#fff;
    display:flex; align-items:center; justify-content:center;
    font-size:36px; margin-bottom:16px;
  }
  .ph-add-txt { font-size:17px; font-weight:600; color:var(--txt); margin-bottom:6px; }
  .ph-add-sub { font-size:13px; color:var(--txt3); }

  /* 하단 고정 — 화면 최하단에 딱 붙임 */
  .ph-bottom {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    background: var(--bg);
    border-top: 1px solid var(--bdr);
    padding: 10px 14px;
    padding-bottom: max(12px, env(safe-area-inset-bottom));
    display: flex; flex-direction: column; gap: 8px;
    z-index: 10;
  }
  /* 그리드가 하단 버튼 영역만큼 패딩 확보 */
  .ph-scroll { padding-bottom: 120px !important; }

  /* 토글 필 버튼 */
  .ph-toggles-row {
    display: flex; gap: 8px; flex-wrap: wrap;
  }
  .ph-tgl-pill {
    display: flex; align-items: center; gap: 5px;
    padding: 7px 14px; border-radius: 20px;
    border: 1.5px solid var(--bdr2);
    background: var(--bg2); color: var(--txt2);
    font-size: 13px; font-weight: 500; cursor: pointer;
  }
  .ph-tgl-pill.on {
    background: #FFF3E8; border-color: #F97316; color: #F97316;
  }

  /* 전송 버튼 */
  .phsn { border-radius:12px !important; font-size:15px !important; padding:14px !important; }
}

/* 토글 바 — 헤더 바로 아래 */
@media (max-width: 600px) {
  .ph-toggle-bar {
    flex-shrink: 0;
    display: flex; gap: 8px; align-items: center;
    padding: 6px 12px;
    background: var(--bg);
    border-bottom: 1px solid var(--bdr);
  }
  /* ph-scroll 하단 여백 — 전송버튼만큼 */
  .ph-scroll { padding-bottom: 80px !important; }
}

/* ═══════════════════════════════════════════════════════════════
   W3.478 — 데스크톱 웹 전용 '사진 패널(#php)' 레이아웃/디자인 개선
   위의 @media(max-width:600px) 블록들과 html.capacitor 블록은 그대로 두고,
   이 min-width:601px 블록만 새로 추가 — 모바일/앱 쪽은 전혀 영향 없음.
   - 하단 전송버튼이 잘려 보이던 문제: .ph-scroll에 min-height:0을 줘서
     flex 자식이 부모(.phm, overflow:hidden) 밖으로 밀려나지 않게 고정.
   - 가운데 정렬된 다이얼로그 형태로 바꾸고, 그림자/여백/그리드를 정돈.
   ═══════════════════════════════════════════════════════════════ */
@media (min-width: 601px) {
  #php { align-items: center; padding: 24px; }
  #php .phm {
    border-radius: 20px;
    width: min(560px, 92vw);
    max-height: min(720px, 88vh);
    box-shadow: 0 24px 64px rgba(0,0,0,.28), 0 2px 8px rgba(0,0,0,.06);
  }
  /* .phm의 실제 자식은 #phc 하나뿐이고, 헤더/그리드/전송버튼은 전부 그 안에
     렌더링된다. #phc 자체가 flex column이 아니면 .phm의 flex 레이아웃이
     자식에게 전달되지 않아 내용이 그냥 쌓여 넘치고 하단 버튼이 잘린다.
     모바일은 .ph-bottom을 position:fixed로 빼내서 이 문제를 우회하지만,
     가운데 정렬된 데스크톱 다이얼로그에서는 그 방식이 맞지 않으므로
     여기서 #phc를 진짜 flex column으로 만들어 정상적으로 고정한다. */
  #php .phm #phc {
    display: flex;
    flex-direction: column;
    flex: 1;
    min-height: 0;
    overflow: hidden;
  }
  #php .phh { padding: 18px 22px; }
  #php .pht { font-size: 15px; }
  #php .phx { width: 30px; height: 30px; transition: background .15s; }
  #php .phx:hover { background: var(--bg3); }
  #php .phca { transition: background .15s; }
  #php .phca:hover { background: var(--bg2); }

  #php .ph-scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    /* W3.488: 5칸이면 30장이 6줄이 되어 다이얼로그 높이(720px)를 넘어 스크롤이 필요했다.
       6칸으로 바꾸면 30장이 정확히 5줄로 떨어져 사진이 조금 작아지는 대신
       스크롤 없이(또는 훨씬 적은 스크롤로) 한 화면에 다 들어온다. */
    grid-template-columns: repeat(6, 1fr);
    gap: 8px;
    padding: 16px 22px;
  }
  #php .phc { border-radius: 10px; box-shadow: 0 1px 4px rgba(0,0,0,.08); }
  #php .phbg { font-size: 10px; min-width: 20px; height: 20px; }
  #php .ph-select-bar { padding: 8px 22px; }

  #php .ph-bottom {
    flex-shrink: 0;
    padding: 16px 22px;
    background: var(--bg);
    border-top: 1px solid var(--bdr);
  }
  #php .phsn { padding: 12px; border-radius: 10px; font-size: 14px; transition: background .15s, transform .1s; }
  #php .phsn:active:not(:disabled) { transform: scale(.98); }
}


/* ═══════════════════════════════════════════════════════════════
   v42 — 원본전송 토글 제거 + Android/Capacitor 하단 안전영역 보강
   ═══════════════════════════════════════════════════════════════ */
:root{ --numemo-system-nav-safe: max(34px, env(safe-area-inset-bottom)); }

/* 원본 전송은 기본값이므로, 혹시 남은 버튼이 있어도 숨김 */
.ph-tgl-pill[onclick^="tOrig"],
.ph-tgl-pill[data-role="original"]{ display:none !important; }

@media (max-width: 600px){
  html.capacitor #php .phm{
    height: 100dvh !important;
    max-height: 100dvh !important;
    border-radius: 0 !important;
    padding-bottom: var(--numemo-system-nav-safe) !important;
    box-sizing: border-box !important;
  }
  html.capacitor #php .ph-bottom{
    position: fixed !important;
    left: 0 !important; right: 0 !important;
    bottom: var(--numemo-system-nav-safe) !important;
    padding: 10px 14px 10px !important;
    background: var(--bg) !important;
    border-top: 1px solid var(--bdr) !important;
    z-index: 20020 !important;
    box-shadow: 0 -6px 18px rgba(0,0,0,.08) !important;
  }
  html.capacitor #php .ph-scroll{
    padding-bottom: calc(116px + var(--numemo-system-nav-safe)) !important;
  }
  html.capacitor #php .phsn{
    min-height: 48px !important;
    border-radius: 10px !important;
  }
  html.capacitor #numemo-cctv-btn{
    bottom: calc(18px + var(--numemo-system-nav-safe)) !important;
  }
}

/* v43 — 전역 Safe-Area 보강: 모달·업로드 시트 하단 겹침 방지 */
:root{
  --nm-safe-bottom-modal: max(0px, env(safe-area-inset-bottom));
  --nm-cap-bottom-modal: max(34px, env(safe-area-inset-bottom));
}
html.capacitor{ --nm-safe-bottom-modal: var(--nm-cap-bottom-modal); }
html.capacitor .ph-bottom{
  bottom: var(--nm-safe-bottom-modal) !important;
  padding-bottom: 12px !important;
}
html.capacitor .ph-scroll{
  padding-bottom: calc(124px + var(--nm-safe-bottom-modal)) !important;
}


/* v64: 사진/동영상 선택 패널 닫기 버튼 우측 정렬 + 터치영역 개선 */
@media (max-width: 600px) {
  .phh .phx {
    order: 99 !important;
    margin-left: auto !important;
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    min-height: 34px !important;
    font-size: 18px !important;
    border-radius: 50% !important;
    background: rgba(255,255,255,.22) !important;
    color: #fff !important;
    z-index: 2 !important;
    touch-action: manipulation;
  }
  .phh .phx:active {
    transform: scale(.96);
    background: rgba(255,255,255,.32) !important;
  }
  .phh .phca {
    order: 2 !important;
    margin-left: auto !important;
    margin-right: 6px !important;
    z-index: 2 !important;
  }
  .phh .pht {
    padding: 0 46px !important;
  }
}

/* V285-B .numemo backup progress */
#mn-bk .cpd{
  margin:10px 0 12px;
  padding:12px 14px;
  border-radius:12px;
  background:#fff7ed;
  border:1px solid #fed7aa;
  color:#9a3412;
  font-size:13px;
  line-height:1.45;
  white-space:pre-line;
}
#mn-bk .mb button.ok{min-width:132px}

/* ── V285-C: 예약업형 .numemo 백업/복원 모달 ── */
.nm-bak-modal {
  position: relative;
  width: min(520px, 92vw) !important;
  padding: 26px !important;
  border-radius: 24px !important;
  background: color-mix(in srgb, var(--bg) 96%, #fff 4%) !important;
  border: 1px solid rgba(249,115,22,.16) !important;
  box-shadow: 0 22px 70px rgba(0,0,0,.24), 0 2px 10px rgba(0,0,0,.06) !important;
}
.nm-bak-modal .nm-modal-x {
  position: absolute;
  top: 18px;
  right: 18px;
  width: 34px;
  height: 34px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--txt2);
  font-size: 20px;
  cursor: pointer;
}
.nm-bak-modal .nm-modal-x:hover { background: var(--bg2); color: var(--txt); }
.nm-modal-head {
  display: flex;
  align-items: center;
  gap: 14px;
  padding-right: 34px;
  margin-bottom: 22px;
}
.nm-modal-icon {
  width: 52px;
  height: 52px;
  border-radius: 18px;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, rgba(249,115,22,.14), rgba(249,115,22,.04));
  color: #E95F00;
  font-size: 26px;
}
.nm-bak-modal h3 {
  margin: 0 0 6px !important;
  font-size: 19px !important;
  line-height: 1.25 !important;
  font-weight: 760 !important;
  letter-spacing: -0.02em;
  color: var(--txt);
}
.nm-bak-modal .sub {
  margin: 0 !important;
  font-size: 12.5px !important;
  line-height: 1.65 !important;
  color: var(--txt2) !important;
  word-break: keep-all;
}
/* W3.91.70: 전체 계정 백업/복원 탭 버튼 */
.nm-account-tabbar {
  display: flex;
  gap: 8px;
  margin-bottom: 18px;
  padding: 4px;
  border-radius: 14px;
  background: var(--bg2, rgba(0,0,0,.04));
}
.nm-account-tab-btn {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 12px;
  border: 0;
  border-radius: 11px;
  background: transparent;
  color: var(--txt2);
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
}
.nm-account-tab-btn.is-active {
  background: var(--bg, #fff);
  color: #E95F00;
  box-shadow: 0 1px 4px rgba(0,0,0,.10);
}
/* W3.91.71: 메모판 휴지통 */
.nm-board-trash-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 340px;
  overflow-y: auto;
  margin-bottom: 4px;
}
.nm-board-trash-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 36px 12px;
  color: var(--txt2);
  font-size: 13px;
}
.nm-board-trash-empty i { font-size: 30px; opacity: .5; }
.nm-board-trash-item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 11px 12px;
  border-radius: 14px;
  background: var(--bg2, rgba(0,0,0,.03));
}
.nm-board-trash-item-color {
  width: 10px;
  height: 34px;
  border-radius: 5px;
  flex: 0 0 auto;
}
.nm-board-trash-item-info {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.nm-board-trash-item-info strong {
  font-size: 14px;
  font-weight: 780;
  color: var(--txt);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nm-board-trash-item-info span {
  font-size: 11.5px;
  color: var(--txt2);
}
.nm-board-trash-item-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex: 0 0 auto;
}
.nm-board-trash-restore {
  padding: 7px 12px !important;
  font-size: 12.5px !important;
  border-radius: 999px !important;
  display: flex;
  align-items: center;
  gap: 4px;
}
.nm-board-trash-purge {
  width: 32px;
  height: 32px;
  border: 0;
  border-radius: 50%;
  background: transparent;
  color: var(--txt2);
  font-size: 16px;
  cursor: pointer;
}
.nm-board-trash-purge:hover { background: rgba(239,68,68,.12); color: #ef4444; }
/* W3.91.72: 보안 PIN 모달 */
.nm-pin-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-bottom: 6px;
}
.nm-pin-panel[hidden] {
  display: none !important;
}
.nm-pin-label {
  font-size: 12px;
  font-weight: 800;
  color: var(--txt2);
  margin-top: 4px;
}
.nm-pin-input {
  width: 100%;
  box-sizing: border-box;
  padding: 14px 16px;
  border: 1.5px solid var(--bdr, rgba(0,0,0,.12));
  border-radius: 14px;
  font-size: 22px;
  letter-spacing: .5em;
  text-align: center;
  background: var(--bg2, rgba(0,0,0,.03));
  color: var(--txt);
}
.nm-pin-input-wide {
  font-size: 15px;
  letter-spacing: normal;
  text-align: left;
}
.nm-pin-input:focus {
  outline: none;
  border-color: #F97316;
}
/* W3.91.73: 4칸 분리 PIN 입력 박스 (구글 OTP/토스 스타일) */
.nm-pin-boxes {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin: 4px 0 2px;
}
.nm-pin-box {
  width: 52px;
  height: 60px;
  box-sizing: border-box;
  border: 1.5px solid var(--bdr, rgba(0,0,0,.14));
  border-radius: 14px;
  background: var(--bg2, rgba(0,0,0,.03));
  color: var(--txt);
  font-size: 26px;
  font-weight: 800;
  text-align: center;
  caret-color: #F97316;
  transition: border-color .12s ease, box-shadow .12s ease;
}
.nm-pin-box:focus {
  outline: none;
  border-color: #F97316;
  box-shadow: 0 0 0 3px rgba(249,115,22,.14);
}
.nm-pin-text-input {
  width: 100%;
  box-sizing: border-box;
  padding: 13px 15px;
  border: 1.5px solid var(--bdr, rgba(0,0,0,.12));
  border-radius: 14px;
  font-size: 15px;
  background: var(--bg2, rgba(0,0,0,.03));
  color: var(--txt);
}
.nm-pin-text-input:focus {
  outline: none;
  border-color: #F97316;
}
/* W3.91.74: PIN 모달의 취소/확인 버튼만 작게 + 우측 정렬 */
.nm-pin-modal .nm-bak-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}
.nm-pin-modal .nm-bak-actions button {
  height: 34px;
  padding: 0 14px !important;
  font-size: 12px !important;
  flex: 0 0 auto;
  box-shadow: none;
}
.nm-pin-modal .nm-bak-actions button i { font-size: 14px; }
/* W3.91.75: 메모판 휴지통 모달의 닫기 버튼도 동일하게 작게 + 우측 정렬 */
.nm-board-trash-modal .nm-bak-actions {
  display: flex !important;
  justify-content: flex-end !important;
  gap: 8px !important;
}
.nm-board-trash-modal .nm-bak-actions button {
  height: 34px;
  padding: 0 14px !important;
  font-size: 12px !important;
  flex: 0 0 auto;
  box-shadow: none;
}
.nm-board-trash-modal .nm-bak-actions button i { font-size: 14px; }
.nm-pin-error {
  margin: 0;
  font-size: 12.5px;
  font-weight: 700;
  color: #ef4444;
}
.nm-pin-forgot-link {
  align-self: center;
  margin-top: 4px;
  border: 0;
  background: transparent;
  color: var(--txt2);
  font-size: 12.5px;
  font-weight: 700;
  text-decoration: underline;
  cursor: pointer;
}
.nm-bak-summary {
  min-height: 0 !important;
  margin: 0 0 18px !important;
  padding: 18px 18px !important;
  text-align: left !important;
  color: var(--txt) !important;
  border: 1px solid rgba(249,115,22,.18);
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(249,115,22,.055), rgba(249,115,22,.025));
  font-size: 12.5px !important;
  line-height: 1.6;
  white-space: normal;
}
.nm-bak-row {
  display: grid;
  grid-template-columns: 28px 86px 1fr;
  align-items: center;
  gap: 8px;
  min-height: 34px;
  color: var(--txt);
}
.nm-bak-row i {
  color: #E95F00;
  font-size: 19px;
  text-align: center;
}
.nm-bak-row .k {
  font-size: 12px;
  font-weight: 670;
  color: var(--txt2);
}
.nm-bak-row .v {
  font-size: 13.5px;
  font-weight: 720;
  color: var(--txt);
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nm-bak-note {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid rgba(249,115,22,.14);
  display: flex;
  align-items: flex-start;
  gap: 9px;
  color: #D95B00;
  font-size: 12px;
  line-height: 1.65;
  word-break: keep-all;
}
.nm-bak-note i { font-size: 17px; flex: 0 0 auto; margin-top: 1px; }
.nm-bak-progress {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #D95B00;
  font-size: 12.5px;
  font-weight: 650;
  line-height: 1.55;
}
.nm-bak-progress i { font-size: 18px; }
.nm-bak-actions {
  display: grid !important;
  grid-template-columns: minmax(82px,.85fr) minmax(112px,1fr) minmax(178px,1.62fr);
  gap: 10px !important;
  justify-content: stretch !important;
}
.nm-bak-actions button {
  height: 50px;
  padding: 0 14px !important;
  border-radius: 14px !important;
  font-size: 13px !important;
  font-weight: 690 !important;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  transition: transform .12s ease, box-shadow .12s ease, background .12s ease;
}
.nm-bak-actions button:active { transform: translateY(1px); }
.nm-bak-actions button i { font-size: 18px; }
.nm-btn-ghost {
  background: var(--bg) !important;
  border: 1px solid var(--bdr2) !important;
  color: var(--txt2) !important;
}
.nm-btn-ghost:hover { background: var(--bg2) !important; color: var(--txt) !important; }
.nm-btn-primary {
  background: #181818 !important;
  border-color: #181818 !important;
  color: #fff !important;
  box-shadow: 0 8px 22px rgba(0,0,0,.18);
}
.nm-btn-primary:hover { background: #0f0f0f !important; }
.nm-restore-drop {
  margin-bottom: 12px;
  padding: 22px 18px;
  border: 1.5px dashed rgba(249,115,22,.34);
  border-radius: 18px;
  background: rgba(249,115,22,.035);
  cursor: pointer;
  text-align: center;
  color: var(--txt2);
}
.nm-restore-drop:hover { background: rgba(249,115,22,.07); border-color: rgba(249,115,22,.55); }
.nm-restore-drop i { display:block; font-size: 28px; color:#E95F00; margin-bottom: 8px; }
.nm-restore-drop strong { display:block; font-size: 13.5px; color: var(--txt); margin-bottom: 4px; }
.nm-restore-drop span { display:block; font-size: 11.5px; color: var(--txt3); }
.nm-rs-modal .ba { margin-top: 10px; }
@media (max-width: 520px) {
  .nm-bak-modal { width: min(380px, 92vw) !important; padding: 22px !important; border-radius: 20px !important; }
  .nm-modal-icon { width: 46px; height: 46px; border-radius: 16px; font-size: 23px; }
  .nm-bak-modal h3 { font-size: 17px !important; }
  .nm-bak-modal .sub { font-size: 12px !important; }
  .nm-bak-row { grid-template-columns: 24px 64px 1fr; min-height: 31px; }
  .nm-bak-row .v { font-size: 12.5px; }
  .nm-bak-actions { grid-template-columns: 1fr 1fr; }
  .nm-bak-actions .nm-btn-primary { grid-column: 1 / -1; }
  .nm-bak-actions button { height: 46px; font-size: 12.5px !important; }
}

/* ── V285-F: .numemo 복원 완료 결과/재시도 UX ── */
.nm-restore-result { display:flex; flex-direction:column; gap:14px; }
.nm-restore-result-head { display:flex; align-items:center; gap:12px; padding-bottom:2px; }
.nm-restore-result-head > i { width:38px; height:38px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:22px; background:rgba(34,197,94,.10); color:#16A34A; flex:0 0 auto; }
.nm-restore-result.warn .nm-restore-result-head > i { background:rgba(249,115,22,.12); color:#E95F00; }
.nm-restore-result-head strong { display:block; font-size:16px; font-weight:780; color:var(--txt); letter-spacing:-.02em; }
.nm-restore-result-head span { display:block; margin-top:2px; font-size:12px; color:var(--txt2); max-width:330px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.nm-restore-result-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; }
.nm-restore-result-grid div { padding:12px 10px; border:1px solid rgba(249,115,22,.14); border-radius:15px; background:rgba(255,255,255,.34); text-align:center; }
.nm-restore-result-grid span { display:block; font-size:11px; color:var(--txt3); font-weight:660; }
.nm-restore-result-grid b { display:block; margin-top:3px; font-size:14px; color:var(--txt); font-weight:780; }
.nm-restore-fail-box { border-top:1px solid rgba(249,115,22,.14); padding-top:12px; }
.nm-restore-fail-title { margin-bottom:8px; font-size:12px; font-weight:760; color:#D95B00; }
.nm-restore-fail-row { display:grid; grid-template-columns:22px minmax(0,1fr); gap:4px 8px; padding:8px 0; border-bottom:1px solid rgba(0,0,0,.055); }
.nm-restore-fail-row:last-child { border-bottom:0; }
.nm-restore-fail-no { width:22px; height:22px; border-radius:50%; background:rgba(249,115,22,.10); color:#D95B00; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:780; grid-row:1 / span 2; }
.nm-restore-fail-name { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:12px; font-weight:720; color:var(--txt); }
.nm-restore-fail-reason { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; color:var(--txt3); }
.nm-restore-fail-more { margin-top:6px; font-size:11.5px; color:var(--txt3); }
.nm-restore-result-actions { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-top:2px; }
.nm-restore-result-actions button { height:44px; border-radius:14px !important; font-size:12.5px !important; font-weight:720 !important; display:flex; align-items:center; justify-content:center; gap:7px; padding:0 12px !important; }
.nm-restore-result-actions button:only-child { grid-column:1 / -1; }
@media (max-width:520px){
  .nm-restore-result-grid { gap:7px; }
  .nm-restore-result-grid div { padding:10px 6px; }
  .nm-restore-result-actions { grid-template-columns:1fr; }
}

/* ── V286: 백업 완료 메모 포함 옵션 ── */
.nm-bak-option {
  margin: -4px 0 14px;
  padding: 13px 14px;
  border: 1px solid rgba(249,115,22,.16);
  border-radius: 16px;
  background: rgba(249,115,22,.035);
  display: flex;
  align-items: center;
  gap: 11px;
  cursor: pointer;
  user-select: none;
}
.nm-bak-option input {
  position: absolute;
  opacity: 0;
  pointer-events: none;
}
.nm-bak-check-ui {
  width: 24px;
  height: 24px;
  border-radius: 8px;
  border: 1.5px solid rgba(249,115,22,.36);
  background: var(--bg);
  color: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  font-size: 17px;
  transition: background .12s ease, color .12s ease, border-color .12s ease;
}
.nm-bak-option input:checked + .nm-bak-check-ui {
  background: #F97316;
  border-color: #F97316;
  color: #fff;
}
.nm-bak-option-text { display:flex; flex-direction:column; gap:3px; min-width:0; }
.nm-bak-option-text b { font-size: 12.8px; color: var(--txt); letter-spacing: -0.01em; }
.nm-bak-option-text small { font-size: 11.5px; line-height:1.45; color: var(--txt2); word-break: keep-all; }
.nm-bak-note-standalone {
  margin: 0 0 18px;
  padding: 12px 14px;
  border: 1px solid rgba(249,115,22,.16);
  border-radius: 14px;
  background: rgba(249,115,22,.035);
}
.nm-bak-mini {
  display:inline-flex;
  align-items:center;
  margin-left:6px;
  padding:2px 7px;
  border-radius:999px;
  background:rgba(249,115,22,.11);
  color:#E95F00;
  font-style:normal;
  font-size:11px;
  font-weight:720;
  vertical-align:1px;
}
@media (max-width: 520px) {
  .nm-bak-option { padding: 12px; gap: 10px; }
  .nm-bak-option-text b { font-size: 12.5px; }
  .nm-bak-option-text small { font-size: 11px; }
}

/* ── V288: 전체 계정 백업 완료 메모 옵션/버튼 정리 ── */
.nm-account-bak-option {
  margin: 4px 0 14px;
}
.nm-account-bak-actions {
  grid-template-columns: minmax(110px,.85fr) minmax(210px,1.45fr) !important;
}
.nm-account-bak-actions .nm-btn-primary {
  grid-column: auto !important;
}
.nm-account-download-btn {
  min-width: 0;
  height: 50px;
}
.nm-account-download-btn > span {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  line-height: 1.08;
  min-width: 0;
}
.nm-account-download-btn > span b {
  display: block;
  font-size: 11.5px;
  font-weight: 720;
  line-height: 1.05;
}
.nm-account-download-btn > span small {
  display: block;
  font-size: 13.2px;
  font-weight: 790;
  line-height: 1.08;
  white-space: nowrap;
}
@media (max-width:520px){
  .nm-account-bak-actions { grid-template-columns: 1fr !important; }
  .nm-account-download-btn > span b { font-size: 11px; }
  .nm-account-download-btn > span small { font-size: 12.6px; }
}

/* W3.597 — attachment export primary action: keep label on one line */
#nm-attachment-export-start-w3593 {
  white-space: nowrap !important;
  min-width: max-content;
}
#nm-attachment-export-start-w3593 > span {
  white-space: nowrap !important;
  word-break: keep-all !important;
}

/* ── W3.598: account backup completed-option alignment polish ── */
.nm-account-bak-option {
  display: grid !important;
  grid-template-columns: 24px minmax(0, 1fr) !important;
  grid-template-rows: auto auto;
  column-gap: 11px !important;
  row-gap: 3px;
  align-items: center !important;
  flex-wrap: nowrap !important;
}
.nm-account-bak-option > .nm-bak-check-ui {
  grid-column: 1;
  grid-row: 1;
  align-self: center;
  margin: 0 !important;
}
.nm-account-bak-option > .nm-bak-option-text {
  grid-column: 2;
  grid-row: 1 / span 2;
  display: grid !important;
  grid-template-rows: auto auto;
  gap: 3px !important;
  min-width: 0;
}
.nm-account-bak-option > .nm-bak-option-text b {
  grid-row: 1;
  white-space: nowrap;
  line-height: 24px;
}
.nm-account-bak-option > .nm-bak-option-text small {
  grid-row: 2;
  display: block;
}

/* W3.611-R1c — orphan cleanup user-owned safety flow */
.nm-orphan-modal{max-width:520px}.nm-orphan-hero{margin:12px 0 14px;padding:15px 16px;border:1px solid var(--bdr);border-radius:14px;background:rgba(249,115,22,.055)}
.nm-orphan-hero strong{display:block;font-size:20px;letter-spacing:-.4px}.nm-orphan-hero span{display:block;margin-top:3px;font-size:12px;color:var(--muted)}
.nm-orphan-copy{font-size:13px;line-height:1.65;color:var(--txt);margin:0 2px 10px}.nm-orphan-safety{display:flex;gap:8px;align-items:flex-start;padding:10px 12px;border-radius:11px;background:rgba(16,185,129,.07);font-size:11.5px;line-height:1.5;color:var(--muted)}
.nm-orphan-safety i{font-size:17px;color:#10b981;margin-top:1px}.nm-orphan-review-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:8px 0}.nm-orphan-review-meta{font-size:11.5px;color:var(--muted)}
.nm-orphan-select-all{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:700;cursor:pointer}.nm-orphan-select-all input,.nm-orphan-check{accent-color:var(--acc)}
.nm-orphan-review-list{max-height:min(48vh,420px);overflow:auto;border:1px solid var(--bdr);border-radius:13px;background:var(--card)}
.nm-orphan-file-row{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--bdr);cursor:pointer}.nm-orphan-file-row:last-child{border-bottom:0}.nm-orphan-file-row:hover{background:rgba(127,127,127,.04)}
.nm-orphan-file-icon{width:32px;height:32px;flex:0 0 32px;border-radius:9px;background:rgba(249,115,22,.08);display:grid;place-items:center;color:var(--acc);font-size:17px}.nm-orphan-file-info{min-width:0;display:flex;flex-direction:column;gap:2px}.nm-orphan-file-info strong{font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.nm-orphan-file-info small{font-size:10.5px;color:var(--muted)}
.nm-orphan-summary{display:flex;justify-content:space-between;align-items:center;margin-top:10px;padding:10px 12px;border-radius:11px;background:rgba(127,127,127,.055);font-size:11.5px}.nm-orphan-summary strong{font-size:13px}.nm-orphan-empty{text-align:center;padding:30px 12px;color:var(--muted)}.nm-orphan-empty i{font-size:26px}.nm-orphan-empty p{margin:6px 0 0}
.nm-orphan-confirm-box{margin:12px 0;padding:14px;border:1px solid var(--bdr);border-radius:13px}.nm-orphan-confirm-box strong{font-size:17px}.nm-orphan-confirm-box p{margin:5px 0 0;font-size:11.5px;color:var(--muted);line-height:1.55}
@media(max-width:600px){.nm-orphan-modal{width:calc(100vw - 28px)!important;max-width:none}.nm-orphan-review-list{max-height:46vh}.nm-orphan-file-row{padding:11px 10px}}
\n\n/* W3.611-R1d — NuMemo premium storage-care notice (notice only; behavior unchanged) */
.nm-orphan-notice-modal{
  width:min(472px,calc(100vw - 32px))!important;
  max-width:472px!important;
  padding:28px!important;
  border-radius:24px!important;
  border:1px solid rgba(18,18,18,.08)!important;
  box-shadow:0 28px 80px rgba(0,0,0,.18),0 3px 12px rgba(0,0,0,.06)!important;
  overflow:hidden;
}
.nm-orphan-notice-top{display:flex;align-items:center;gap:15px;margin-bottom:22px}
.nm-orphan-notice-icon{width:48px!important;height:48px!important;flex:0 0 48px;border-radius:16px!important;background:rgba(249,115,22,.09)!important;color:#E95F00!important;font-size:22px!important;box-shadow:inset 0 0 0 1px rgba(249,115,22,.07)}
.nm-orphan-notice-title{min-width:0}
.nm-orphan-eyebrow{display:block;margin-bottom:4px;font-size:9.5px;font-weight:800;letter-spacing:.13em;color:#E95F00}
.nm-orphan-notice-title h3{margin:0!important;font-size:20px!important;font-weight:780!important;letter-spacing:-.035em!important;line-height:1.25!important;color:var(--txt)!important}
.nm-orphan-notice-title .sub{margin:5px 0 0!important;font-size:12px!important;line-height:1.45!important;color:var(--txt3)!important}
.nm-orphan-notice-hero{position:relative;margin:0 0 18px!important;padding:20px 20px 18px!important;border:1px solid rgba(249,115,22,.14)!important;border-radius:18px!important;background:linear-gradient(135deg,rgba(249,115,22,.075),rgba(249,115,22,.025))!important}
.nm-orphan-notice-hero .nm-orphan-hero-label{display:block!important;margin:0 0 5px!important;font-size:11px!important;font-weight:700!important;color:var(--txt3)!important}
.nm-orphan-notice-hero strong{display:block!important;font-size:30px!important;font-weight:820!important;line-height:1.08!important;letter-spacing:-.045em!important;color:var(--txt)!important}
.nm-orphan-notice-hero .nm-orphan-hero-caption{display:flex!important;align-items:center;gap:5px;margin:10px 0 0!important;font-size:11px!important;line-height:1.4!important;color:#B95000!important}
.nm-orphan-notice-hero .nm-orphan-hero-caption i{font-size:14px}
.nm-orphan-notice-copy{margin:0 2px 15px!important;font-size:13px!important;line-height:1.65!important;letter-spacing:-.012em;color:var(--txt2)!important;word-break:keep-all}
.nm-orphan-notice-safety{padding:12px 13px!important;border:1px solid rgba(16,185,129,.11);border-radius:13px!important;background:rgba(16,185,129,.055)!important;font-size:11.5px!important;line-height:1.55!important;color:var(--txt3)!important;word-break:keep-all}
.nm-orphan-notice-safety b{color:var(--txt2);font-weight:720}
.nm-orphan-notice-actions{grid-template-columns:minmax(108px,.78fr) minmax(190px,1.35fr)!important;margin-top:20px!important;gap:10px!important}
.nm-orphan-notice-actions button{height:48px!important;border-radius:13px!important;font-size:13px!important;font-weight:720!important}
.nm-orphan-notice-actions .nm-btn-primary{grid-column:auto!important;box-shadow:0 9px 24px rgba(0,0,0,.16)!important}
.nm-orphan-notice-actions .nm-btn-primary i{font-size:16px!important;margin-left:1px}
@media(max-width:520px){
  .nm-orphan-notice-modal{width:calc(100vw - 24px)!important;padding:23px 20px 20px!important;border-radius:22px!important}
  .nm-orphan-notice-top{gap:12px;margin-bottom:18px}
  .nm-orphan-notice-icon{width:44px!important;height:44px!important;flex-basis:44px;font-size:20px!important;border-radius:15px!important}
  .nm-orphan-notice-title h3{font-size:18px!important}
  .nm-orphan-notice-hero{padding:18px!important}
  .nm-orphan-notice-hero strong{font-size:27px!important}
  .nm-orphan-notice-actions{grid-template-columns:.78fr 1.32fr!important}
  .nm-orphan-notice-actions button{height:46px!important;padding:0 10px!important}
}

/* W3.611-R1e — persistent Storage Care re-entry. Quiet by default, always recoverable after '나중에 확인'. */
.nm-orphan-care-entry[hidden]{display:none!important}
.nm-orphan-care-entry{
  appearance:none;border:1px solid rgba(249,115,22,.16);background:rgba(249,115,22,.055);color:var(--txt2);
  min-height:28px;padding:3px 8px 3px 6px;border-radius:10px;display:flex;align-items:center;gap:6px;cursor:pointer;
  font:inherit;line-height:1;transition:background .16s ease,border-color .16s ease,transform .16s ease,box-shadow .16s ease;
}
.nm-orphan-care-entry:hover{background:rgba(249,115,22,.09);border-color:rgba(249,115,22,.24);box-shadow:0 4px 12px rgba(0,0,0,.055)}
.nm-orphan-care-entry:active{transform:translateY(1px)}
.nm-orphan-care-entry-icon{position:relative;width:20px;height:20px;display:grid;place-items:center;color:#E95F00;font-size:14px}
.nm-orphan-care-entry-icon b{position:absolute;right:0;top:0;width:5px;height:5px;border-radius:99px;background:#F97316;box-shadow:0 0 0 2px var(--bg)}
.nm-orphan-care-entry-text{display:flex;align-items:baseline;gap:5px;white-space:nowrap}
.nm-orphan-care-entry-text em{font-style:normal;font-size:9.5px;font-weight:700;color:var(--txt3)}
.nm-orphan-care-entry-text strong{font-size:10.5px;font-weight:760;letter-spacing:-.015em;color:var(--txt2)}
@media(max-width:600px){
  .nm-orphan-care-entry{width:28px;min-width:28px;height:28px;padding:0;justify-content:center;border-radius:9px}
  .nm-orphan-care-entry-text{display:none}
  .nm-orphan-care-entry-icon{width:22px;height:22px}
}


/* W3.611-R1h — content-group preview review; existing typography/icon scale preserved */
.nm-orphan-content-row{gap:10px}
.nm-orphan-thumb-btn{position:relative;width:54px;height:54px;flex:0 0 54px;padding:0;border:0;border-radius:10px;overflow:hidden;background:rgba(127,127,127,.08);cursor:pointer;display:grid;place-items:center}
.nm-orphan-thumb-btn img{width:100%;height:100%;object-fit:cover;display:block}
.nm-orphan-thumb-empty{color:var(--acc);font-size:17px}
.nm-orphan-play{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.16);color:#fff;font-size:17px}
.nm-orphan-file-name{max-width:330px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;opacity:.76}
.nm-orphan-preview-modal{width:min(620px,calc(100vw - 28px))!important;max-width:620px!important}
.nm-orphan-preview-body{margin:10px 0 14px;min-height:220px;max-height:62vh;border:1px solid var(--bdr);border-radius:14px;background:#111;overflow:hidden;display:grid;place-items:center}
.nm-orphan-preview-body img,.nm-orphan-preview-body video{display:block;max-width:100%;max-height:62vh;width:auto;height:auto;object-fit:contain}
.nm-orphan-preview-empty{min-height:220px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;color:#bbb;font-size:12px}
.nm-orphan-preview-empty i{font-size:24px}
@media(max-width:600px){.nm-orphan-thumb-btn{width:50px;height:50px;flex-basis:50px}.nm-orphan-file-name{max-width:190px}.nm-orphan-preview-body{max-height:58vh}.nm-orphan-preview-body img,.nm-orphan-preview-body video{max-height:58vh}}
/* R1O account restore progress safety overlay */
#nm-account-restore-overlay-r1o{position:fixed;inset:0;z-index:2147483000;background:rgba(15,23,42,.58);display:none;align-items:center;justify-content:center;padding:20px;backdrop-filter:blur(2px)}
.nm-r1o-card{width:min(430px,92vw);background:#fff;border-radius:18px;padding:24px;box-shadow:0 24px 70px rgba(0,0,0,.28);text-align:center;color:#1f2937}
.nm-r1o-spin{font-size:26px;margin-bottom:8px}.nm-r1o-spin i{display:inline-block;animation:nmR1oSpin 1s linear infinite}
.nm-r1o-card b{display:block;font-size:18px;margin-bottom:8px}.nm-r1o-card #nm-r1o-detail{font-size:13px;min-height:38px;color:#667085;white-space:pre-line;overflow-wrap:anywhere}
.nm-r1o-track{height:10px;background:#eef1f5;border-radius:999px;overflow:hidden;margin:16px 0 8px}.nm-r1o-track>div{height:100%;width:0;background:#ff7417;border-radius:999px;transition:width .2s ease}
.nm-r1o-card strong{font-size:16px}.nm-r1o-card small{display:block;margin-top:13px;color:#8a94a6;font-size:11.5px}
@keyframes nmR1oSpin{to{transform:rotate(360deg)}}