/* 드라이브책 웹 — 1단 시안(owner-requests/R-439-check/drivechaek-ux.html) 그대로의 색·간격. 인사책 브랜드 파랑 + 슬레이트 */
:root{
  --bg:#ffffff; --side:#f6f8fb; --ink:#0f172a; --ink2:#334155; --mute:#64748b; --faint:#94a3b8;
  --line:#e2e8f0; --hover:#f1f5f9; --sel:#e6f0ff; --brand:#2B74FB; --brand-ink:#ffffff; --brand-soft:#ebf4ff;
  --ok:#059669; --warn:#d97706; --bad:#dc2626; --chip:#f1f5f9; --scrim:rgba(15,23,42,.38);
  --shadow:0 10px 30px rgba(15,23,42,.10);
  --f-ui:"Wanted Sans",-apple-system,BlinkMacSystemFont,"Segoe UI","Apple SD Gothic Neo","Noto Sans KR",sans-serif;
  --f-num:"Geist Mono","JetBrains Mono",ui-monospace,"SF Mono",Menlo,Consolas,monospace;
  color-scheme:light;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg:#111827; --side:#0f172a; --ink:#e5e9f0; --ink2:#cbd5e1; --mute:#94a3b8; --faint:#64748b;
    --line:#1f2a3d; --hover:#172033; --sel:#14284d; --brand:#5B9EFF; --brand-ink:#08142b; --brand-soft:#132544;
    --ok:#34d399; --warn:#fbbf24; --bad:#f87171; --chip:#1a2335; --scrim:rgba(0,0,0,.55); --shadow:0 10px 30px rgba(0,0,0,.45);
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#111827; --side:#0f172a; --ink:#e5e9f0; --ink2:#cbd5e1; --mute:#94a3b8; --faint:#64748b;
  --line:#1f2a3d; --hover:#172033; --sel:#14284d; --brand:#5B9EFF; --brand-ink:#08142b; --brand-soft:#132544;
  --ok:#34d399; --warn:#fbbf24; --bad:#f87171; --chip:#1a2335; --scrim:rgba(0,0,0,.55); --shadow:0 10px 30px rgba(0,0,0,.45);
  color-scheme:dark;
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--f-ui);font-size:14px;line-height:1.45;-webkit-font-smoothing:antialiased;overflow:hidden}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer;padding:0}
input,select{font:inherit;color:var(--ink)}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
[hidden]{display:none!important}
svg.i{width:18px;height:18px;flex:none;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.num{font-family:var(--f-num);font-variant-numeric:tabular-nums}
#app{height:100%}

/* ── PC ── */
.pc{height:100%;display:grid;grid-template-columns:248px 1fr;grid-template-rows:60px 1fr;position:relative}
.pc-top{grid-column:1/3;display:flex;align-items:center;gap:16px;padding:0 18px;border-bottom:1px solid var(--line)}
.logo{display:flex;align-items:center;gap:9px;font-weight:700;font-size:17px;width:214px;flex:none}
.mk{width:28px;height:28px;border-radius:8px;background:var(--brand);color:var(--brand-ink);display:grid;place-items:center}
.mk svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:2}
.search{flex:1;max-width:680px;display:flex;align-items:center;gap:8px;background:var(--chip);border-radius:12px;padding:0 12px;height:40px;color:var(--mute)}
.search input{flex:1;border:0;background:transparent;outline:none;min-width:0}
.sp{flex:1}
.av{width:32px;height:32px;border-radius:50%;background:var(--brand-soft);color:var(--brand);display:grid;place-items:center;font-size:12px;font-weight:700;flex:none}
.side{background:var(--side);border-right:1px solid var(--line);padding:14px 10px;display:flex;flex-direction:column;gap:2px;overflow:auto;min-height:0}
.newbtn{display:inline-flex;align-items:center;gap:8px;background:var(--bg);border:1px solid var(--line);box-shadow:0 1px 3px rgba(15,23,42,.08);border-radius:14px;padding:11px 16px;font-weight:600;margin:0 4px 12px;width:max-content}
.nav{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;color:var(--ink2);width:100%;text-align:left}
.nav:hover{background:var(--hover)}
.nav.on{background:var(--sel);color:var(--brand);font-weight:600}
.nav.head{cursor:default}.nav.head:hover{background:none}
.nav .cnt{margin-left:auto;font-size:12px;color:var(--faint)}
.nav.sub{padding-left:38px;font-size:13.5px}
.divi{height:1px;background:var(--line);margin:8px 6px}
.quota{padding:8px 12px;font-size:12.5px;color:var(--mute)}
.qbar{height:6px;border-radius:3px;background:var(--line);overflow:hidden;margin:7px 0 5px;display:flex}
.qbar i{display:block;height:100%}
.q-my{background:var(--brand)} .q-dept{background:#7FB8FF} .q-co{background:#94a3b8} .q-tr{background:var(--warn)}
.qbar.full{box-shadow:0 0 0 1px var(--bad)}
.qleg{display:flex;flex-wrap:wrap;gap:4px 10px;font-size:11.5px}
.qleg span::before{content:"";display:inline-block;width:8px;height:8px;border-radius:2px;margin-right:4px;background:var(--c)}
.pc-main{display:grid;grid-template-columns:1fr auto;min-width:0;min-height:0}
.listpane{display:flex;flex-direction:column;min-width:0;min-height:0;position:relative}
.crumbs{display:flex;align-items:center;gap:6px;padding:14px 20px 6px;font-size:19px;font-weight:600;min-width:0;overflow:hidden;white-space:nowrap}
.crumbs button{padding:2px 6px;border-radius:6px;color:var(--mute);font-weight:500}
.crumbs button.cur{color:var(--ink);font-weight:600}
.crumbs .sep{color:var(--faint)}
.toolbar{display:flex;align-items:center;gap:8px;padding:6px 20px 10px;min-height:48px}
.btn{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);border-radius:10px;padding:7px 12px;background:var(--bg);color:var(--ink2);font-size:13px;white-space:nowrap;text-decoration:none}
.btn:hover{background:var(--hover)}
.btn.pri{background:var(--brand);border-color:var(--brand);color:var(--brand-ink);font-weight:600}
.btn.pri:hover{filter:brightness(1.05)}
.btn.bad{color:var(--bad)}
.btn.pri.bad{background:var(--bad);border-color:var(--bad);color:#fff}
.btn.ghost{background:transparent}
.trashbar{display:flex;align-items:center;gap:8px;padding:0 14px 8px;flex:none}.trashbar .note{flex:1;min-width:0}
.btn[disabled]{opacity:.5;cursor:default}
.seg{display:inline-flex;border:1px solid var(--line);border-radius:999px;overflow:hidden;margin-left:auto}
.seg button{padding:6px 12px;color:var(--mute)}
.seg button.on{background:var(--sel);color:var(--brand)}
.note{color:var(--mute);font-size:13px}
.rows{flex:1;overflow:auto;min-height:0;position:relative;contain:strict}
.thead,.row{display:grid;grid-template-columns:minmax(0,1fr) 108px 96px 76px 148px;align-items:center;gap:8px;padding:0 20px}
.thead{position:sticky;top:0;background:var(--bg);font-size:12.5px;color:var(--mute);height:36px;border-bottom:1px solid var(--line);z-index:1}
.vwrap{position:relative}
.row{position:absolute;left:0;right:0;height:44px;border-bottom:1px solid var(--line);user-select:none}
.row:hover{background:var(--hover)}
.row.sel{background:var(--sel)}
.row.drop-on{outline:2px dashed var(--brand);outline-offset:-2px}
.nav.drop-on,.crumbs button.drop-on{outline:2px dashed var(--brand);outline-offset:-2px;background:color-mix(in srgb,var(--brand) 10%,transparent)}
.nm{display:flex;align-items:center;gap:10px;min-width:0}
.nm span.t{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.m{color:var(--mute);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.acts{display:flex;justify-content:flex-end;gap:2px;opacity:0}
.row:hover .acts,.row.sel .acts,.row:focus-within .acts{opacity:1}
.acts button,.acts a{padding:5px;border-radius:6px;color:var(--mute);display:inline-flex}
.acts button:hover,.acts a:hover{background:var(--line);color:var(--ink)}
.ft{width:26px;height:26px;border-radius:6px;display:grid;place-items:center;font-size:9.5px;font-weight:700;color:#fff;flex:none;letter-spacing:.02em}
.ft.fold{background:transparent;color:var(--faint)}.ft.fold svg{width:22px;height:22px;fill:currentColor;stroke:none}
.ft.xls{background:#1f8f4e}.ft.pdf{background:#d9472b}.ft.doc{background:#2b5fd9}.ft.img{background:#a259d9}.ft.zip{background:#b38a2e}.ft.mp4{background:#d9367a}.ft.hwp{background:#1a9fb5}.ft.ppt{background:#e07a1f}.ft.txt{background:#64748b}.ft.etc{background:#94a3b8}
/* 다크 모드: 흰 글자 BIN(종류 모름) 칩이 밝은 슬레이트(#94a3b8)에선 대비 2.6:1 → 같은 슬레이트 색조로 어둡게 5.9:1 (R-DK0) */
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) .ft.etc{background:#56657a}}
:root[data-theme="dark"] .ft.etc{background:#56657a}
.star{color:var(--warn);display:inline-flex}.star svg{width:14px;height:14px;fill:currentColor}
.pinned{color:var(--ok);display:inline-flex;align-items:center;gap:2px;font-size:12px}
.grid{position:relative;padding:12px 20px 20px}
.card{position:absolute;border:1px solid var(--line);border-radius:12px;overflow:hidden;background:var(--bg);user-select:none}
.card:hover{border-color:var(--faint)}
.card.sel{border-color:var(--brand);box-shadow:0 0 0 1px var(--brand)}
.card .th{height:104px;background:var(--chip);display:grid;place-items:center;overflow:hidden}
.card .th img{width:100%;height:100%;object-fit:cover}
.card .th .ft{width:40px;height:40px;font-size:12px;border-radius:9px}
.card .th .ft.fold svg{width:40px;height:40px}
.card .cap{padding:9px 11px;font-size:13px;display:flex;flex-direction:column;gap:2px}
.card .cap b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.card .cap small{color:var(--mute)}
.empty{display:grid;place-items:center;text-align:center;color:var(--mute);padding:60px 20px;gap:6px}
.dropzone{position:absolute;inset:8px;background:color-mix(in srgb,var(--brand) 10%,transparent);border:2px dashed var(--brand);border-radius:12px;display:grid;place-items:center;color:var(--brand);font-weight:600;font-size:16px;z-index:5;pointer-events:none}
.info{width:300px;border-left:1px solid var(--line);padding:16px 18px;overflow:auto;display:flex;flex-direction:column;gap:14px;min-height:0}
.info h3{margin:0;font-size:15px;display:flex;align-items:center;gap:8px;min-width:0}
.info h3 span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.prev{height:150px;border-radius:12px;background:var(--chip);display:grid;place-items:center;overflow:hidden}
.prev img{width:100%;height:100%;object-fit:contain}
.prev .ft{width:52px;height:52px;font-size:14px;border-radius:12px}
.kv{display:grid;grid-template-columns:76px 1fr;gap:6px 10px;font-size:13px;margin:0}
.kv dt{color:var(--mute)}.kv dd{margin:0;min-width:0;overflow-wrap:anywhere}
.row-btns{display:flex;gap:6px;flex-wrap:wrap}
.upl{position:absolute;right:16px;bottom:16px;width:360px;max-width:calc(100% - 32px);background:var(--bg);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow);overflow:hidden;z-index:6}
.upl header{display:flex;align-items:center;gap:8px;padding:11px 14px;background:var(--side);font-weight:600;font-size:13.5px}
.upl .list{max-height:260px;overflow:auto}
.upl .it{display:grid;grid-template-columns:26px 1fr auto;align-items:center;gap:10px;padding:9px 14px;font-size:13px;border-top:1px solid var(--line)}
.upl .it .n{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upl .st .reup{margin-left:8px;padding:3px 9px;border:1px solid var(--line);border-radius:8px;font-size:12px;font-weight:600;color:var(--brand);background:var(--bg)}
/* 폰 폭: 올리기 칸은 ＋ 단추 위(단추·아래 탭 막대를 덮지 않음). 시안엔 폰 올리기 칸이 없어(진행은 사진 탭 카드) PC 칸의 모양을 그대로 위로 올림 */
@media (max-width:767px){.upl{position:fixed;left:12px;right:12px;width:auto;max-width:none;bottom:calc(152px + env(safe-area-inset-bottom,0px))}.upl .list{max-height:28vh}}
.pg{height:4px;background:var(--line);border-radius:2px;overflow:hidden;margin-top:5px}
.pg i{display:block;height:100%;background:var(--brand);transition:width .15s linear}
.nm .shared{color:var(--mute);display:inline-flex;flex:none}
.st{font-size:12px;color:var(--mute);white-space:nowrap}
.st.ok{color:var(--ok)}.st.bad{color:var(--bad)}
.scrim{position:fixed;inset:0;background:var(--scrim);display:grid;place-items:center;z-index:20;padding:16px}
.dialog{width:min(520px,100%);background:var(--bg);border-radius:16px;box-shadow:var(--shadow);padding:20px 22px;display:flex;flex-direction:column;gap:14px;max-height:calc(100% - 32px);overflow:auto}
.dialog h3{margin:0;font-size:17px;overflow-wrap:anywhere}
.dialog footer{display:flex;gap:8px;justify-content:flex-end}
.field{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:9px 12px;color:var(--mute);background:var(--bg)}
.field input{flex:1;border:0;background:transparent;outline:none;min-width:0}
.people{display:flex;flex-direction:column;gap:4px}
.person{display:flex;align-items:center;gap:8px;font-size:13px;padding:6px 8px;border-radius:10px;width:100%;text-align:left}
button.person:hover{background:var(--hover)}
.person.on{background:var(--sel)}
.person .av{width:26px;height:26px;font-size:11px}
.person em{margin-left:auto;color:var(--mute);font-style:normal;font-size:12px}
.sel-in{border:1px solid var(--line);border-radius:8px;padding:4px 8px;background:var(--bg);color:var(--ink2);font-size:12.5px}
.viewer{width:min(960px,100%);height:min(720px,100%);background:var(--bg);border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden}
.viewer header{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--line);min-width:0}
.viewer header b{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.viewer .body{flex:1;display:grid;place-items:center;background:var(--chip);min-height:0;overflow:auto}
.viewer .body img,.viewer .body video{max-width:100%;max-height:100%}
.viewer .body iframe{width:100%;height:100%;border:0;background:#fff}
.viewer .body .ph{display:flex;flex-direction:column;align-items:center;gap:12px;color:var(--mute);text-align:center;padding:20px}
.viewer .body .ph .ft{width:72px;height:72px;font-size:18px;border-radius:16px}
.toast{position:fixed;left:50%;top:72px;transform:translateX(-50%);background:var(--ink);color:var(--bg);padding:9px 14px;border-radius:10px;font-size:13px;z-index:30;max-width:calc(100% - 32px);display:flex;gap:10px;align-items:center;white-space:nowrap}
.toast span:first-child{overflow:hidden;text-overflow:ellipsis}
.toast .wave{background:color-mix(in srgb,var(--bg) 18%,transparent);color:var(--bg)}
@media (max-width:767px){.toast{top:auto;bottom:calc(96px + env(safe-area-inset-bottom,0px))}}
/* 파동 표시 — 개발 표시(?wave=1)일 때만 나옴 */
.wave{display:inline-flex;align-items:center;gap:6px;font-size:12px;border-radius:999px;padding:3px 10px;background:var(--brand-soft);color:var(--brand);font-weight:600;white-space:nowrap}
.wave b{font-family:var(--f-num)}
.wave.zero{background:var(--chip);color:var(--mute)}
.wavebar{position:absolute;left:264px;bottom:16px;display:flex;gap:8px;align-items:center;font-size:12px;color:var(--mute);z-index:4;background:var(--bg);border:1px solid var(--line);border-radius:999px;padding:4px 6px 4px 12px}
.wavebar code{font-family:var(--f-num);font-size:11.5px;color:var(--ink2)}
.linkrow{display:flex;align-items:center;gap:10px;background:var(--side);border-radius:12px;padding:10px 12px;font-size:13px}
.linkrow .sp{flex:1}
/* 퇴사자 보관함 넘겨주기 카드(시안 .lcard · .radio) */
.leavers{display:flex;flex-direction:column;gap:12px;padding:0 20px 12px;max-height:60vh;overflow:auto}
.lcard{background:var(--bg);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.lcard header{padding:12px 16px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.lcard header b{font-size:14px}
.lcard .body{padding:14px 16px;display:flex;flex-direction:column;gap:10px;font-size:13px}
.radio{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:10px;padding:8px 10px;width:100%;text-align:left}
.radio.on{border-color:var(--brand);background:var(--sel)}
.radio[disabled]{opacity:.5;cursor:default}
.radio i{width:14px;height:14px;border-radius:50%;border:2px solid var(--faint);flex:none}
.radio.on i{border:4px solid var(--brand)}
/* 오류 토스트도 시안 토스트 한 모양(ink 바탕) — 따로 빨강 0 */
.banner{margin:0 20px 8px;padding:8px 12px;border-radius:10px;background:color-mix(in srgb,var(--warn) 14%,transparent);color:var(--ink2);font-size:13px}

/* ── 모바일 ── */
.mo{height:100%;display:flex;flex-direction:column;position:relative;padding-top:env(safe-area-inset-top,0px)}
.mo-top{display:flex;align-items:center;gap:4px;padding:8px max(8px,env(safe-area-inset-right,0px)) 8px max(8px,env(safe-area-inset-left,0px));flex:none;min-height:56px}
.mo-top h1{margin:0 0 0 6px;font-size:20px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mo-top button{padding:10px;border-radius:12px;color:var(--ink2);display:inline-flex}
.mo-top button:active{background:var(--hover)}
.mo-top .field{flex:1;padding:8px 10px}
.chips{display:flex;gap:6px;padding:0 12px 8px;overflow-x:auto;flex:none;scrollbar-width:none}
.chips button{border:1px solid var(--line);border-radius:999px;padding:6px 12px;font-size:13px;white-space:nowrap;color:var(--ink2)}
.chips button.on{background:var(--sel);border-color:transparent;color:var(--brand);font-weight:600}
.mlist{flex:1;overflow:auto;min-height:0;position:relative;contain:strict}
.mrow{position:absolute;left:0;right:0;display:grid;grid-template-columns:36px 1fr 40px;align-items:center;gap:10px;padding:0 6px 0 14px;height:60px}
.mrow:active{background:var(--hover)}
.mrow{-webkit-touch-callout:none;-webkit-user-select:none;user-select:none}
.mrow .inl{-webkit-user-select:text;user-select:text}
.mrow .ft{width:34px;height:34px;font-size:10px;border-radius:8px}
.mrow .ft.fold svg{width:30px;height:30px}
.mrow .t{min-width:0;display:flex;flex-direction:column}
.mrow .t b{font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mrow .t small{color:var(--mute);font-size:12px;display:flex;gap:6px;align-items:center;white-space:nowrap;overflow:hidden}
.mrow>button{padding:10px;border-radius:10px;color:var(--mute);display:inline-flex}
.fab{position:absolute;right:max(18px,env(safe-area-inset-right,0px));bottom:calc(84px + env(safe-area-inset-bottom,0px));width:56px;height:56px;border-radius:18px;background:var(--brand);color:var(--brand-ink);display:grid;place-items:center;box-shadow:var(--shadow);z-index:3}
.fab svg{width:24px;height:24px}
.tabs{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);padding:6px 0 calc(8px + env(safe-area-inset-bottom,0px));flex:none;background:var(--bg)}
.tabs button{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11.5px;color:var(--mute);padding:4px 0}
.tabs button.on{color:var(--brand);font-weight:600}
.mscrim{position:fixed;inset:0;background:var(--scrim);z-index:20}
.msheet{position:fixed;left:0;right:0;bottom:0;background:var(--bg);border-radius:22px 22px 0 0;padding:10px max(18px,env(safe-area-inset-right,0px)) calc(20px + env(safe-area-inset-bottom,0px)) max(18px,env(safe-area-inset-left,0px));box-shadow:0 -10px 30px rgba(15,23,42,.18);z-index:21;display:flex;flex-direction:column;gap:4px;max-height:85%;overflow:auto}
.msheet .grab{width:40px;height:4px;border-radius:2px;background:var(--line);margin:0 auto 8px;flex:none}
.msheet h4{margin:0 0 4px;font-size:16px;display:flex;gap:10px;align-items:center;min-width:0}
.msheet h4 span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.mopt{display:flex;align-items:center;gap:12px;padding:12px 4px;font-size:15px;border-radius:10px;text-align:left;width:100%;color:var(--ink)}
.mopt:active{background:var(--hover)}
.mopt small{display:block;color:var(--mute);font-size:12px}
.mopt.bad{color:var(--bad)}
.mview{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;background:var(--chip);margin:0 12px 12px;border-radius:16px;color:var(--mute);overflow:hidden;min-height:0;text-align:center;padding:12px}
.mview img,.mview video{max-width:100%;max-height:100%;object-fit:contain}
.mview .ft{width:72px;height:72px;font-size:18px;border-radius:16px}
.photos{display:grid;grid-template-columns:repeat(4,1fr);gap:3px;padding:0 3px}
.photos .ph{aspect-ratio:1;max-width:100%;position:relative;background:var(--chip);overflow:hidden}
.photos .ph img{width:100%;height:100%;object-fit:cover}
.photos .ph .st{position:absolute;left:4px;bottom:4px;background:rgba(15,23,42,.65);color:#fff;border-radius:6px;padding:1px 5px;font-size:11px}
.mprog{margin:0 14px 10px;border:1px solid var(--line);border-radius:14px;padding:10px 12px;font-size:13px;display:flex;flex-direction:column;gap:6px}
.mprog .pg{height:5px;border-radius:3px;margin-top:0}
.mo .leavers{padding:0 12px 10px;max-height:55vh}
.mpage{flex:1;overflow:auto;padding:0 16px 16px;display:flex;flex-direction:column;gap:12px;min-height:0}
.card2{border:1px solid var(--line);border-radius:14px;padding:14px;display:flex;flex-direction:column;gap:8px}
@media (prefers-reduced-motion: reduce){*{transition:none!important;animation:none!important}}
.people:empty{display:none}
/* 줄 안 새 폴더 이름 칸(시안 · 지시 14) */
.inl{font:inherit;color:var(--ink);background:var(--bg);border:1.5px solid var(--brand);border-radius:6px;padding:3px 7px;margin:-4px 0;width:100%;max-width:320px;min-width:0;outline:none}
.nm span.t:has(.inl){flex:1;overflow:visible}

/* ── R-439 지시 27 ① 시안 맞춤 ── */
/* #44 사진 고르기 격자(시안 .photo — 동그라미 · 고르면 안쪽 3px 테두리) */
.photos .photo{aspect-ratio:1;max-width:100%;border:0;padding:0;position:relative;border-radius:2px;overflow:hidden;background:var(--chip)}
.photos .photo img{width:100%;height:100%;object-fit:cover;display:block}
.photos .photo i{position:absolute;right:5px;top:5px;width:20px;height:20px;border-radius:50%;border:2px solid #fff;background:rgba(0,0,0,.15)}
.photos .photo.on i{background:var(--brand);border-color:#fff}
.photos .photo.on::after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 3px var(--brand)}
/* #46 모바일 파일 보기 — 위 띠 + 회색 둥근 판 전체 화면(시안 .ph-top + .mview) */
.mfull{position:fixed;inset:0;z-index:15;background:var(--bg);display:flex;flex-direction:column;padding-top:env(safe-area-inset-top,0px);width:auto;height:auto;border-radius:0;box-shadow:none}
.mview .vprev{display:flex;align-items:center;justify-content:center;max-width:100%;min-height:0;flex:none}
.mview .vprev img,.mview .vprev video{max-width:100%;max-height:46vh;object-fit:contain;border-radius:8px}
.mview .vprev pre{margin:0;padding:12px;max-height:44vh;overflow:auto;white-space:pre-wrap;text-align:left;font-family:var(--f-num);font-size:13px;color:var(--ink);align-self:stretch;max-width:100%}
.mview .vprev:has(pre){align-self:stretch;margin:0 8px}
/* #52 넘겨주기 카드 — 시안 .links 격자(칸 최소 380px · 간격 18) */
.leavers{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,380px),1fr));gap:18px;align-items:start}

/* #52 카드는 잘리지 않음 — 카드만 있고 파일이 없으면(「아직 파일이 없어요」 없이) 머리 칸이 남은 자리를 다 쓰고 안에서 자연스럽게 스크롤 */
body.lv-only #head{flex:1 1 auto;min-height:0;overflow-y:auto}
body.lv-only .rows,body.lv-only .mlist{display:none}
body.lv-only .leavers,body.lv-only .mo .leavers{max-height:none;overflow:visible}
body.lv-only #mchips{flex:1 1 auto;min-height:0;overflow-y:auto}
body.lv-only #mbody{flex:0 0 0!important}