/* =========================================================
   디자인 토큰
   ========================================================= */
:root{
  --ink:#16181A; --ink-2:#1F2226; --ink-3:#2A2E33;
  --paper:#FBFBF9; --card:#FFFFFF;
  --line:#E7E6E2; --line-2:#F1F0EC;
  --text:#191A18; --text-2:#5C5F63; --muted:#94948F;
  --brand:#053969; --accent:#A6864E;
  --ok:#2E6B45; --warn:#9A6B12; --bad:#A33027; --info:#2C4E7A;
  --r:2px;
  --shadow:0 1px 2px rgba(20,22,24,.04), 0 8px 28px -18px rgba(20,22,24,.22);
}
*{box-sizing:border-box}
html,body{height:100%}
body{margin:0;background:var(--paper);color:var(--text);
  font-family:Pretendard,-apple-system,BlinkMacSystemFont,system-ui,"Segoe UI",sans-serif;
  font-size:13.5px;line-height:1.6;-webkit-font-smoothing:antialiased;
  -webkit-text-size-adjust:100%;font-feature-settings:"tnum" 0}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font-family:inherit}
::selection{background:#E8E3D6}

/* =========================================================
   인트로
   ========================================================= */
#intro{position:fixed;inset:0;z-index:9999;background:#1E1E1E;
  display:flex;align-items:center;justify-content:center;flex-direction:column;
  animation:introOut .72s cubic-bezier(.65,0,.35,1) 2.05s forwards}
#intro .mk{width:150px;height:auto;flex:none;opacity:0;transform:scale(.82);
  -webkit-mask-image:linear-gradient(100deg,#000 33%,rgba(0,0,0,.25) 50%,#000 67%);
  mask-image:linear-gradient(100deg,#000 33%,rgba(0,0,0,.25) 50%,#000 67%);
  -webkit-mask-size:280% 100%;mask-size:280% 100%;
  animation:mkIn 1.05s cubic-bezier(.16,1,.3,1) .12s forwards,
            mkSweep 1.35s cubic-bezier(.4,0,.2,1) .5s forwards}
#intro .wm{margin-top:26px;text-align:center;opacity:0;transform:translateY(10px);
  animation:wmIn .8s cubic-bezier(.16,1,.3,1) .86s forwards}
#intro .wm .ko{color:#fff;font-size:15px;font-weight:600;letter-spacing:.18em}
#intro .wm .en{color:rgba(255,255,255,.4);font-size:9.5px;letter-spacing:.42em;margin-top:7px}
#intro .rule{width:0;height:1px;background:rgba(255,255,255,.22);margin-top:22px;
  animation:ruleIn .9s cubic-bezier(.16,1,.3,1) 1.15s forwards}
#intro .skip{position:absolute;bottom:34px;color:rgba(255,255,255,.28);font-size:10.5px;
  letter-spacing:.2em;opacity:0;animation:wmIn .6s ease 1.5s forwards;cursor:pointer}
#intro .skip:hover{color:rgba(255,255,255,.6)}
@keyframes mkIn{to{opacity:1;transform:scale(1)}}
@keyframes mkSweep{from{-webkit-mask-position:180% 0;mask-position:180% 0}
  to{-webkit-mask-position:-80% 0;mask-position:-80% 0}}
@keyframes wmIn{to{opacity:1;transform:translateY(0)}}
@keyframes ruleIn{to{width:170px}}
@keyframes introOut{to{opacity:0;visibility:hidden;transform:scale(1.035)}}
#intro.done{animation:introOut .42s cubic-bezier(.65,0,.35,1) forwards}
.rise{animation:rise .62s cubic-bezier(.16,1,.3,1) both}
@keyframes rise{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  #intro,#intro *,.rise{animation-duration:.01ms !important;animation-delay:0ms !important}
}

/* =========================================================
   셸 — 좌측 사이드바
   ========================================================= */
.app{display:flex;min-height:100vh}
.side{width:224px;flex:none;background:var(--ink);color:#fff;display:flex;
  flex-direction:column;position:sticky;top:0;height:100vh}
.side-top{padding:22px 20px 18px;border-bottom:1px solid rgba(255,255,255,.07)}
.side-top .row{display:flex;align-items:center;gap:10px}
.side-top img{height:21px;width:auto;flex:none;display:block}
.side-top .nm{font-size:13.5px;font-weight:600;letter-spacing:-.1px;line-height:1.25}
.side-top .sb{font-size:9.5px;color:rgba(255,255,255,.38);letter-spacing:.2em;margin-top:9px}
.side nav{padding:14px 12px;flex:1;overflow-y:auto}
.side nav a{display:block;padding:8px 12px;border-radius:var(--r);font-size:13px;
  color:rgba(255,255,255,.58);position:relative;margin-bottom:1px;transition:color .15s,background .15s}
.side nav a:hover{color:#fff;background:rgba(255,255,255,.05)}
.side nav a.on{color:#fff;background:rgba(255,255,255,.07)}
.side nav a.on::before{content:"";position:absolute;left:0;top:9px;bottom:9px;width:2px;
  background:var(--accent);border-radius:2px}
.side-bot{padding:16px 20px 20px;border-top:1px solid rgba(255,255,255,.07)}
.side-bot .u{font-size:13px;font-weight:500}
.side-bot .r{font-size:10.5px;color:rgba(255,255,255,.4);letter-spacing:.06em;margin-top:2px}
.side-bot .out{display:inline-block;margin-top:11px;font-size:11.5px;
  color:rgba(255,255,255,.45);border-bottom:1px solid rgba(255,255,255,.18);padding-bottom:1px}
.side-bot .out:hover{color:#fff;border-color:rgba(255,255,255,.5)}
.side-pw{display:flex;align-items:center;gap:8px;margin-top:18px;
  padding-top:15px;border-top:1px solid rgba(255,255,255,.06)}
.side-pw img{height:15px;width:auto;flex:none;opacity:.5}
.side-pw span{font-size:8.5px;color:rgba(255,255,255,.3);letter-spacing:.16em;line-height:1.5}

.main{flex:1;min-width:0;display:flex;flex-direction:column}
.bar{padding:26px 34px 0;display:flex;align-items:flex-start;justify-content:space-between;gap:20px}
.content{padding:18px 34px 64px;max-width:1400px;width:100%}

@media(max-width:900px){
  .app{flex-direction:column}
  .side{width:100%;height:auto;position:static;flex-direction:row;align-items:center;
    gap:14px;padding:0 16px;flex-wrap:wrap}
  .side-top{border:none;padding:12px 0}
  .side-top .sb{display:none}
  .side nav{display:flex;gap:4px;padding:0;overflow-x:auto;flex:1}
  .side nav a{white-space:nowrap;padding:6px 10px}
  .side nav a.on::before{left:10px;right:10px;top:auto;bottom:0;width:auto;height:2px}
  .side-bot{border:none;padding:10px 0;display:flex;align-items:center;gap:10px}
  .side-bot .r,.side-pw{display:none}
  .side-bot .out{margin:0}
  .bar{padding:20px 18px 0}
  .content{padding:14px 18px 56px}
}

/* =========================================================
   타이포그래피
   ========================================================= */
h1{font-size:23px;font-weight:600;letter-spacing:-.5px;margin:0 0 5px;line-height:1.25}
.sub{color:var(--muted);font-size:12.5px;margin:0}
.eyebrow{font-size:9.5px;letter-spacing:.24em;color:var(--muted);margin-bottom:9px}
h2{font-size:14px;font-weight:600;margin:0 0 16px;letter-spacing:-.15px;
  display:flex;align-items:baseline;gap:9px;flex-wrap:wrap;
  padding-bottom:11px;border-bottom:1px solid var(--line)}
h2 .n{color:var(--accent);font-size:11px;font-weight:700;letter-spacing:.06em}
h2 .en{font-size:9px;color:var(--muted);font-weight:400;letter-spacing:.2em;text-transform:uppercase}
.muted{color:var(--muted)}
.mono{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.tright{text-align:right}.tcenter{text-align:center}
.scroll{overflow-x:auto;margin:0 -2px}

/* =========================================================
   카드 및 레이아웃
   ========================================================= */
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--r);
  padding:22px 24px;margin-bottom:16px}
.grid{display:grid;gap:16px}
.g2{grid-template-columns:1fr 1fr}
.g23{grid-template-columns:5fr 7fr}
@media(max-width:1050px){.g2,.g23{grid-template-columns:1fr}}

.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(134px,1fr));
  border:1px solid var(--line);border-radius:var(--r);background:var(--card);
  margin-bottom:16px;overflow:hidden}
.kpi{padding:17px 20px;border-right:1px solid var(--line-2)}
.kpi:last-child{border-right:none}
.kpi .lab{font-size:9.5px;letter-spacing:.14em;color:var(--muted);text-transform:uppercase}
.kpi .val{font-size:27px;font-weight:600;letter-spacing:-1px;margin-top:5px;line-height:1.1;
  font-variant-numeric:tabular-nums}
.kpi .val.warn{color:var(--bad)}
@media(max-width:900px){.kpi{border-bottom:1px solid var(--line-2)}}

/* =========================================================
   표
   ========================================================= */
table{width:100%;border-collapse:collapse;font-size:13px}
th{text-align:left;font-weight:500;font-size:9.5px;letter-spacing:.14em;color:var(--muted);
  text-transform:uppercase;padding:0 12px 9px;border-bottom:1px solid var(--line);white-space:nowrap}
td{padding:11px 12px;border-bottom:1px solid var(--line-2);vertical-align:top}
tbody tr:last-child td{border-bottom:none}
tbody tr:hover td{background:#FAFAF7}

/* =========================================================
   상태 표시 — 점 + 라벨
   ========================================================= */
.b{display:inline-flex;align-items:center;gap:6px;font-size:11.5px;font-weight:500;
  white-space:nowrap;color:var(--text-2)}
.b::before{content:"";width:5px;height:5px;border-radius:50%;background:currentColor;flex:none}
.b.ok{color:var(--ok)} .b.wait{color:var(--warn)} .b.sent{color:var(--info)}
.b.fail{color:var(--bad)} .b.gray{color:var(--muted)} .b.extra{color:#6B3D7A}
.b.urgent{color:#fff;background:var(--bad);padding:1px 7px 2px;border-radius:9px;font-size:10px;
  font-weight:600;letter-spacing:.02em}
.b.urgent::before{display:none}
.tag{display:inline-block;font-size:10.5px;color:var(--text-2);border:1px solid var(--line);
  padding:1px 7px;border-radius:var(--r);font-weight:500;white-space:nowrap}
.tag.hi{color:var(--warn);border-color:#EADFC4;background:#FDFAF3}
.tag.em{color:var(--ink);border-color:#CFCDC6}
.lang{font-size:9px;color:var(--muted);border:1px solid var(--line);padding:1px 5px;
  border-radius:var(--r);letter-spacing:.1em;text-transform:uppercase;font-weight:500}

/* =========================================================
   폼
   ========================================================= */
label{display:block;font-size:9.5px;letter-spacing:.13em;color:var(--muted);
  text-transform:uppercase;margin:0 0 6px;font-weight:500}
input,select,textarea{width:100%;padding:9px 11px;border:1px solid var(--line);
  border-radius:var(--r);font-size:13px;background:#fff;color:var(--text);transition:border-color .15s}
input:hover,select:hover,textarea:hover{border-color:#D6D4CE}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--ink);
  box-shadow:0 0 0 3px rgba(22,24,26,.05)}
input::placeholder,textarea::placeholder{color:#B8B8B3}
textarea{min-height:70px;resize:vertical;line-height:1.6}
select[multiple]{height:auto;padding:5px}
.frow{display:grid;gap:14px;margin-bottom:14px}
.f2{grid-template-columns:1fr 1fr}
.f3{grid-template-columns:repeat(3,1fr)}
.f4{grid-template-columns:repeat(4,1fr)}
@media(max-width:820px){.f2,.f3,.f4{grid-template-columns:1fr}}

button,.btn{display:inline-flex;align-items:center;justify-content:center;
  padding:9px 18px;border:1px solid var(--ink);background:var(--ink);color:#fff;
  border-radius:var(--r);font-size:12.5px;font-weight:500;cursor:pointer;letter-spacing:-.05px;
  transition:background .15s,border-color .15s,color .15s}
button:hover,.btn:hover{background:var(--ink-3);border-color:var(--ink-3)}
button.ghost{background:transparent;color:var(--text);border-color:var(--line)}
button.ghost:hover{background:#F6F5F1;border-color:#D6D4CE;color:var(--text)}
button.sm{padding:5px 11px;font-size:11px}
button.danger{background:var(--bad);border-color:var(--bad)}
button.danger:hover{background:#8C2820;border-color:#8C2820}
button:disabled{background:#E8E7E3;border-color:#E8E7E3;color:#AFAFA9;cursor:not-allowed}

/* =========================================================
   알림
   ========================================================= */
.flash{padding:11px 16px;font-size:12.5px;margin-bottom:9px;border-left:2px solid;
  background:var(--card);border-radius:var(--r);border-top:1px solid var(--line);
  border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.flash.ok{border-left-color:var(--ok)}
.flash.warn{border-left-color:var(--warn)}
.flash.error{border-left-color:var(--bad)}
.notice{padding:12px 16px;font-size:12px;margin-bottom:14px;border-radius:var(--r);
  background:#FBF8F0;border:1px solid #EDE4D0;color:#6E5520;line-height:1.6}
.notice.crit{background:#FDF4F3;border-color:#F0D9D6;color:#8A2C24}
.notice.info{background:#F5F7FA;border-color:#E2E7EE;color:#2F4667}
.iso{font-size:11.5px;color:var(--text-2);background:#F7F6F2;border:1px solid var(--line);
  border-left:2px solid var(--accent);padding:11px 15px;border-radius:var(--r);
  margin-bottom:16px;line-height:1.65}

/* =========================================================
   로그인
   ========================================================= */
.login{min-height:100vh;display:grid;grid-template-columns:1fr 1fr}
.login .left{background:var(--ink);color:#fff;padding:52px 56px;display:flex;
  flex-direction:column;justify-content:space-between}
.login .left .mk{height:30px;width:auto;align-self:flex-start;flex:none}
.login .left .hd{font-size:30px;font-weight:600;letter-spacing:-.8px;line-height:1.35;margin-top:auto}
.login .left .hd span{color:rgba(255,255,255,.4)}
.login .left .dk{font-size:12.5px;color:rgba(255,255,255,.45);margin-top:18px;
  line-height:1.75;max-width:340px}
.login .left .langstrip{display:flex;flex-wrap:wrap;gap:7px 16px;margin-top:30px;
  padding-top:20px;border-top:1px solid rgba(255,255,255,.1);max-width:400px}
.login .left .langstrip span{font-size:11px;color:rgba(255,255,255,.3);letter-spacing:.01em}
.login .left .langstrip span:first-child{color:rgba(255,255,255,.62)}
@media(max-width:860px){.login .left .langstrip{margin-top:20px;padding-top:14px;gap:5px 12px}
  .login .left .langstrip span{font-size:10px}}
.login .left .ft{font-size:9.5px;color:rgba(255,255,255,.26);letter-spacing:.16em;margin-top:44px}
.login .right{display:flex;align-items:center;justify-content:center;padding:40px 32px}
.login .box{width:100%;max-width:352px}
.login .box .eyebrow{margin-bottom:7px}
.login .box h1{font-size:21px;margin-bottom:26px}
.login .accounts{margin-top:26px;padding-top:20px;border-top:1px solid var(--line)}
.login .accounts b{display:block;font-size:9.5px;letter-spacing:.14em;color:var(--muted);
  text-transform:uppercase;font-weight:500;margin-bottom:10px}
.chips{display:flex;flex-wrap:wrap;gap:5px}
.chip{border:1px solid var(--line);background:#fff;border-radius:var(--r);padding:4px 9px;
  font-size:10.5px;cursor:pointer;color:var(--text-2);font-weight:500;transition:all .13s}
.chip:hover{border-color:var(--ink);color:var(--ink);background:#fff}
@media(max-width:860px){
  .login{grid-template-columns:1fr}
  .login .left{padding:30px 26px;min-height:auto}
  .login .left .hd{font-size:23px;margin-top:26px}
  .login .left .dk{margin-top:12px}
  .login .left .langstrip{display:flex;flex-wrap:wrap;gap:7px 16px;margin-top:30px;
  padding-top:20px;border-top:1px solid rgba(255,255,255,.1);max-width:400px}
.login .left .langstrip span{font-size:11px;color:rgba(255,255,255,.3);letter-spacing:.01em}
.login .left .langstrip span:first-child{color:rgba(255,255,255,.62)}
@media(max-width:860px){.login .left .langstrip{margin-top:20px;padding-top:14px;gap:5px 12px}
  .login .left .langstrip span{font-size:10px}}
.login .left .ft{margin-top:24px}
}

/* =========================================================
   수행 인력 모바일
   ========================================================= */
.mhead{background:var(--ink);color:#fff;padding:20px 18px 18px;display:flex;
  align-items:flex-start;justify-content:space-between;gap:12px}
.mhead .t{font-size:19px;font-weight:600;letter-spacing:-.3px}
.mhead .s{font-size:11.5px;color:rgba(255,255,255,.45);margin-top:3px}
.mhead .s a{color:rgba(255,255,255,.7);border-bottom:1px solid rgba(255,255,255,.28)}
.mhead img{height:18px;width:auto;flex:none;opacity:.75;margin-top:3px}
.mwrap{padding:0 16px 90px;max-width:620px;margin:0 auto}
.mwrap .flash{margin-top:14px}
.task{border:1px solid var(--line);border-left:2px solid var(--accent);border-radius:var(--r);
  padding:16px 18px;margin-bottom:11px;background:#fff;display:block}
.task:first-of-type{margin-top:14px}
.task.new{border-left-color:var(--bad);background:#FFFCFB}
.task pre{white-space:pre-wrap;font-family:inherit;font-size:15.5px;margin:0 0 12px;
  line-height:1.65;letter-spacing:-.1px}
.task .meta{font-size:10.5px;color:var(--muted);display:flex;gap:10px;flex-wrap:wrap;
  align-items:center;letter-spacing:.02em}
.tbtn{display:flex;width:100%;padding:15px;font-size:15px;margin-top:12px}
.korean{border-top:1px solid var(--line-2);margin-top:14px;padding-top:12px;font-size:12.5px;
  color:var(--muted);white-space:pre-wrap;line-height:1.65}
.mdone{font-size:9.5px;letter-spacing:.16em;color:var(--muted);text-transform:uppercase;
  margin:26px 0 12px}

/* 수퍼바이저 연락 줄 */
.msup{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:14px;
  border:1px solid var(--line);border-left:2px solid var(--brand);border-radius:var(--r);
  padding:13px 16px;background:#fff}
.msup .l{display:flex;flex-direction:column;gap:2px;min-width:0}
.msup .cap{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.msup .nm{font-size:14.5px;font-weight:600}
.msup .tel{margin-left:auto;background:var(--brand);color:#fff;border-radius:var(--r);
  padding:11px 16px;font-size:14px;font-weight:600;white-space:nowrap;letter-spacing:.01em}

/* 글자 크기, 복사 안내 */
.mtools{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:12px 0 2px}
.mtools .cap{font-size:10.5px;color:var(--muted)}
.chipbtn{display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--line);background:#fff;border-radius:var(--r);
  padding:9px 14px;font-size:13px;font-weight:500;color:var(--ink);cursor:pointer;
  font-family:inherit;min-height:40px}
.chipbtn:hover{border-color:var(--brand);color:var(--brand)}
.mbtns{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.mflag{display:inline-block;background:var(--bad);color:#fff;font-size:10.5px;font-weight:600;
  padding:4px 9px;border-radius:var(--r);margin-bottom:9px;letter-spacing:.04em}
.mwarn{margin-top:10px;font-size:12px;color:#8A6D1F;background:#FDF8EC;
  border:1px solid #EFE1BE;border-radius:var(--r);padding:9px 11px;line-height:1.6}
.korean .cap{display:block;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:#A8AEB8;margin-bottom:6px}
.cp{cursor:copy;-webkit-user-select:text;user-select:text}

/* 담당자용 번역기 */
.mcard{border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;
  margin-top:18px;background:#fff}
.mcap{font-size:9.5px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);
  margin-bottom:10px}
.mcard textarea{min-height:76px;font-size:15px}
.mrow{display:flex;gap:8px;margin-top:9px}
.mrow select{flex:1;min-height:42px}
.mtout{margin-top:11px}
.mtout pre{white-space:pre-wrap;font-family:inherit;font-size:15px;line-height:1.65;
  margin:0 0 9px;background:#F7F8F9;border-radius:var(--r);padding:12px 13px}

/* 글자 크기 단계 */
.msize.s1 .task pre,.msize.s1 .mtout pre{font-size:17.5px}
.msize.s2 .task pre,.msize.s2 .mtout pre{font-size:19.5px}
.msize.s3 .task pre,.msize.s3 .mtout pre{font-size:22px}
.msize.s1 .korean{font-size:14px}
.msize.s2 .korean{font-size:15.5px}
.msize.s3 .korean{font-size:17px}
.msize.s2 .msup .nm,.msize.s3 .msup .nm{font-size:16.5px}

/* 복사 안내 */
.toast{position:fixed;left:50%;bottom:26px;transform:translateX(-50%);
  background:var(--ink);color:#fff;border-radius:var(--r);padding:12px 20px;
  font-size:13.5px;z-index:9000;opacity:1;transition:opacity .38s ease}
.toast.out{opacity:0}

/* =========================================================
   처리 경과, 번역 미리보기
   ========================================================= */
.supbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;
  border:1px solid var(--line);border-left:2px solid var(--brand);border-radius:var(--r);
  padding:13px 18px;margin-bottom:16px;background:#fff}
.supbar .who{display:flex;align-items:baseline;gap:9px}
.supbar .cap{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.supbar .nm{font-size:15px;font-weight:600}
.supbar .tel{background:var(--brand);color:#fff;border-radius:var(--r);
  padding:8px 14px;font-size:13px;font-weight:600;letter-spacing:.02em}
.supbar .say{font-size:11.5px;color:var(--muted)}
.supbar .say.warn{color:#8A6D1F}
.track{font-size:12px}
.track .tl{display:flex;gap:10px;padding:6px 0;border-bottom:1px solid var(--line-2);
  align-items:baseline;flex-wrap:wrap}
.track .tl:last-child{border-bottom:none}
.track .tm{color:var(--muted);font-size:11px;flex:none;width:86px}
.track .ac{font-weight:600;flex:none;min-width:92px}
.track .ms{color:#4A5260}
.trprev{margin-top:10px}
.trprev .cap{display:block;font-size:9.5px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--muted);margin-bottom:7px}
.trprev .pv{display:flex;gap:9px;align-items:baseline;padding:6px 0;
  border-bottom:1px solid var(--line-2);flex-wrap:wrap}
.trprev .pv:last-child{border-bottom:none}
.trprev .lg{flex:none;width:62px;font-size:11px;color:var(--muted)}
.trprev .tx{flex:1;min-width:140px;font-size:12.5px;line-height:1.6}

/* =========================================================
   필수 사진
   ========================================================= */
.mcap .cnt{float:right;letter-spacing:0;text-transform:none;font-size:11px;color:var(--ink)}
.msgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(132px,1fr));gap:10px}
.msi{border:1px solid var(--line);border-radius:var(--r);padding:9px;background:#fff;
  display:flex;flex-direction:column;gap:7px}
.msi.ok{border-color:var(--ok, #1E6B3A)}
.msi .nm{font-size:11.5px;line-height:1.4;min-height:32px}
.msi img{width:100%;height:94px;object-fit:cover;border-radius:2px;display:block}
.msi .ph{width:100%;height:94px;border-radius:2px;background:#F1F2F4;
  border:1px dashed #D3D8E0}
.msi .shot{width:100%;min-height:36px;font-size:12px;cursor:pointer}
.shots{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.shots figure{margin:0}
.shots img{width:100%;height:112px;object-fit:cover;border-radius:2px;display:block;
  border:1px solid var(--line)}
.shots figcaption{font-size:11px;color:var(--muted);margin-top:5px;line-height:1.5}
.mspick{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px 14px;
  border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;background:#fff}
.mspick label{display:flex;align-items:center;gap:7px;font-size:12.5px;cursor:pointer;
  font-weight:400;letter-spacing:0;text-transform:none;color:var(--ink);margin:0}
.mspick input{width:auto;margin:0}
.mspick.sm{max-height:168px;overflow:auto;grid-template-columns:repeat(auto-fill,minmax(168px,1fr))}

/* =========================================================
   하단 라이선스 표기
   ========================================================= */
.lic{display:flex;align-items:center;justify-content:center;gap:10px;
  padding:34px 16px 12px;color:#B5B5B0;font-size:10px;letter-spacing:.06em}
.lic img{height:16px;width:auto;flex:none;opacity:.38}