:root{--ink3:#657083}
/* 접근성, 상태 화면, 쪽 번호, 공고 카드와 상세, 콘솔 표 */
:focus-visible{outline:2px solid var(--pri);outline-offset:2px;border-radius:6px}
.inp:focus-visible,.txt:focus-visible,.fld select:focus-visible,.sel:focus-visible{outline-offset:-1px}
.skip{position:absolute;left:8px;top:-60px;background:#16202e;color:#fff;padding:10px 16px;border-radius:0 0 10px 10px;z-index:200}
.skip:focus{top:0}
.netbar{background:#16202e;color:#fff;padding:8px 16px;display:flex;align-items:center;justify-content:center;gap:12px;font-size:14px;flex-wrap:wrap}
.netbar .btn{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}
.nowrap{white-space:nowrap}
.btn.solid-bad{background:var(--bad);border-color:var(--bad);color:#fff}.btn.solid-bad:hover{background:#b92d3b}
.ferr{color:var(--bad);font-size:12px;font-weight:600}
[aria-invalid="true"]{border-color:var(--bad)!important}
.done-ic.bad{background:var(--bad-l);color:var(--bad)}

/* 처음 불러오는 화면 */
.sk{display:block;background:linear-gradient(90deg,#e8ecf3 25%,#f3f5f9 37%,#e8ecf3 63%);background-size:400% 100%;animation:shim 1.2s infinite;border-radius:8px}
@keyframes shim{0%{background-position:100% 50%}100%{background-position:0 50%}}
.sk-h{height:132px;border-radius:16px;margin-bottom:16px}
.sk-grid{display:grid;grid-template-columns:minmax(440px,580px) 1fr;gap:20px}
.sk-card{display:flex;gap:14px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px}
.sk-av{width:48px;height:48px;border-radius:10px;flex:none}
.sk-l1{height:16px;width:70%;margin-bottom:10px}.sk-l2{height:12px;width:45%;margin-bottom:10px}.sk-l3{height:12px;width:85%}
.sk-pane{background:#fff;border:1px solid var(--line);border-radius:12px;padding:0 0 20px;overflow:hidden}
.sk-cover{height:150px;border-radius:0;margin-bottom:20px}.sk-pane .sk-l1,.sk-pane .sk-l2{margin-left:22px}
@media (prefers-reduced-motion:reduce){.sk{animation:none}}

/* 쪽 번호 */
.pager{display:flex;align-items:center;justify-content:center;gap:5px;margin:18px 0 6px;flex-wrap:wrap}
.pg{min-width:34px;height:34px;border-radius:8px;border:1px solid var(--line);background:#fff;font-weight:600;color:var(--ink2);display:inline-grid;place-items:center;padding:0 8px}
.pg:hover:not([disabled]){border-color:#b9c6dd}
.pg.on{background:var(--pri);border-color:var(--pri);color:#fff}
.pg[disabled]{opacity:.4;cursor:not-allowed}
.pg.gap{border:0;background:none;min-width:20px;padding:0}
.pg-sum{margin-right:auto}

/* 공고 카드 */
.jcard.dead{opacity:.74;background:#fafbfd}
.jc-meta{display:flex;flex-wrap:wrap;align-items:center;gap:2px 14px;margin-top:8px;color:var(--ink2)}
.jc-bot{margin-top:7px}
.jc-foot{display:flex;align-items:center;gap:6px 12px;margin-top:9px;flex-wrap:wrap;min-height:32px;padding-top:9px;border-top:1px solid var(--line2)}
.jc-foot .right{margin-left:auto}
.dl-soon{color:var(--bad);font-weight:700}
.activef{gap:8px;margin:-4px 0 14px;align-items:center}
.activef .chip svg{margin-left:2px}
.recent{gap:8px;margin:0 0 14px;padding:8px 12px;background:#fff;border:1px solid var(--line);border-radius:10px}
.recent b{color:var(--ink2);display:inline-flex;align-items:center;gap:4px}

/* 공고 상세 */
.jd-stats{display:flex;flex-wrap:wrap;gap:4px 14px;margin:8px 0 14px}
.dtabs{display:flex;gap:4px;border-bottom:1px solid var(--line);margin:0 -22px 16px;padding:0 22px;overflow-x:auto;scrollbar-width:none}
.dtabs button{border:0;background:none;padding:10px 14px;font-weight:700;color:var(--ink3);border-bottom:3px solid transparent;margin-bottom:-1px;white-space:nowrap}
.dtabs button.on{color:var(--pri);border-bottom-color:var(--pri)}
.jd-pane h4:first-child{margin-top:0}
.pay-hero{background:#f7f9fc;border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-bottom:12px;display:flex;flex-direction:column;gap:3px}
.pay-hero b{font-size:24px;line-height:1.2}
.cond{margin:0;border:1px solid var(--line);border-radius:12px;overflow:hidden}
.cr{display:grid;grid-template-columns:104px 1fr;gap:12px;padding:10px 14px;border-bottom:1px solid var(--line2);font-size:14px}
.cr:last-child{border:0}.cr dt{color:var(--ink3)}.cr dd{margin:0;display:flex;flex-wrap:wrap;gap:5px;align-items:center}
.mapsvg{width:100%;height:auto;border-radius:12px;border:1px solid var(--line);display:block}
.safety{display:flex;gap:10px;align-items:flex-start;background:#fff7e6;border:1px solid #f3dca8;color:#7a4d00;border-radius:10px;padding:10px 12px;font-size:13px;margin-top:16px}
.safety svg{flex:none;margin-top:2px}
.state-box{display:flex;gap:12px;background:var(--bad-l);border:1px solid #f1c2c7;color:#8d1f2c;border-radius:12px;padding:12px 14px;margin-bottom:14px}
.state-box svg{flex:none;margin-top:2px}
.mrow{display:flex;gap:12px;align-items:center;width:100%;text-align:left;border:1px solid var(--line);background:#fff;border-radius:10px;padding:8px 12px}
.mrow:hover{border-color:#b9c6dd}
.trust{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line);border-radius:12px;overflow:hidden}
.trust div{background:#fff;padding:12px 6px;text-align:center}.trust b{display:block;font-size:19px;color:var(--ok)}.trust.low b{color:var(--bad)}.trust span{font-size:12px;color:var(--ink3)}
.jd-act{align-items:center;gap:8px}
.jd-act .ibtn{height:48px;width:46px;border-radius:12px;flex:none}
.jd-act .btn.lg{padding:0 16px;font-size:15px}
.ngroup{font-size:12px;font-weight:800;color:var(--ink3);margin:14px 2px 6px}

/* 콘솔 표와 도구 막대 */
.toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:14px}
.toolbar .sinput{flex:0 1 auto}
.bulkbar{display:flex;align-items:center;gap:10px;background:var(--pri-l);border:1px solid #cfdcff;border-radius:10px;padding:8px 12px;margin-bottom:12px;flex-wrap:wrap}
.linkbtn{background:none;border:0;padding:0;color:var(--pri);font-weight:600;text-align:left}
.linkrow{display:flex;align-items:center;gap:10px;background:none;border:0;padding:0;text-align:left}
.linkrow b:hover{color:var(--pri)}
.acts{display:flex;gap:4px;flex-wrap:nowrap}
.ibtn.sm{width:30px;height:30px;border-radius:8px}
.ibtn.on-pri{color:var(--pri);border-color:#cfdcff;background:var(--pri-l)}
.tbl tr.sel td{background:#f3f7ff}
.tbl tr.clickrow{cursor:pointer}.tbl tr.clickrow:hover td{background:#fafbfd}
.stagebar{display:flex;height:8px;border-radius:4px;overflow:hidden;background:var(--line2);margin:5px 0 3px;min-width:110px;gap:1px}
.stagebar i{display:block;min-width:4px}
.stagebar .s0{background:#9aa8bd}.stagebar .s1{background:#5b86f0}.stagebar .s2{background:#e6a41a}.stagebar .s3{background:var(--ok)}.stagebar .s4{background:var(--bad)}
.fun-row{display:flex;align-items:center;gap:10px;margin:12px 0}
.fun-l{width:64px;font-size:13px;color:var(--ink2)}
.fun-t{flex:1;height:14px;background:var(--line2);border-radius:7px;overflow:hidden}
.fun-t i{display:block;height:100%;border-radius:7px;min-width:2px}
.f-submitted{background:#9aa8bd}.f-viewed{background:#5b86f0}.f-interview{background:#e6a41a}.f-offer{background:var(--ok)}
.fun-row b{width:28px;text-align:right}.fun-p{width:38px;text-align:right}
.fsec{font-weight:800;font-size:13px;color:var(--pri);border-bottom:1px solid var(--line);padding:4px 0 6px;margin:6px 0 14px}
.newdot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--bad);margin-right:6px;vertical-align:1px}
.stars{display:inline-flex;gap:1px;vertical-align:middle}
.star{color:#c9d1dd;display:inline-grid;place-items:center}.star.on{color:#e6a41a}
button.star{border:0;background:none;padding:2px;border-radius:6px}
.rate-row{display:flex;align-items:center;gap:12px;margin:14px 0 0}
.rate-in{display:inline-flex;gap:2px}
.mini-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}
.mini-kpis div{background:#f7f9fc;border:1px solid var(--line);border-radius:10px;padding:10px 12px;min-width:0}
.mini-kpis b{display:block;font-size:16px}.mini-kpis span{font-size:12px;color:var(--ink3)}
.delta{font-weight:700;margin-left:4px}.delta.up{color:var(--ok)}.delta.down{color:var(--bad)}
.kcard:focus-visible,.jcard:focus-visible,.lrow:focus-visible{outline-offset:-2px}

@media(max-width:1000px){
  .sk-grid{grid-template-columns:minmax(0,1fr)}.sk-pane{display:none}
  .pg-sum{display:none}
}
@media(max-width:760px){
  .dtabs{margin:0 -16px 14px;padding:0 16px}
  .cr{grid-template-columns:88px 1fr}
  .toolbar .sinput{flex:1 1 100%}
  .toolbar .right{margin-left:0;width:100%}
  .toolbar .right .sel{flex:1;min-width:0}
  .jd-act .btn.lg{padding:0 10px;font-size:14px}
  .jd-act .ibtn{width:40px}
  .mini-kpis b{font-size:14px}
}

.banner{min-height:104px;padding:16px 28px;margin-bottom:10px}.banner h2{font-size:20px;margin-bottom:4px}
.recent{margin-bottom:12px}

.fbtn{display:none}
.toolbar>.sinput{flex:0 1 auto}
.recent{flex-wrap:wrap}

@media(max-width:760px){
  .sbar .fbtn{display:inline-flex;margin-top:12px;width:100%}
  .sbar .s2{display:none}
  .sbar.open .s2{display:flex}
  .recent,.recent.row.wrap{flex-wrap:nowrap!important;overflow-x:auto;scrollbar-width:none}
  .banner{padding-bottom:46px}
  .recent .chip,.recent .btn{flex:none}
  .toolbar>.sinput{flex:1 1 100%}
  .toolbar .right{margin-left:0;width:100%}
  .toolbar .right{flex-wrap:wrap}
  .toolbar .right .sinput{flex:1 1 100%;width:auto!important}
  .toolbar .right .sel{flex:1 1 40%}
  .page-h .right{margin-left:0}

  /* 표를 카드로 쌓는다 */
  .tbl,.tbl tbody{display:block}
  .tbl thead{display:none}
  .tbl tr{display:block;padding:12px 14px;border-bottom:1px solid var(--line)}
  .tbl tr:last-child{border:0}
  .tbl td{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:5px 0;border:0;text-align:right;min-width:0}
  .tbl td[data-l]:before{content:attr(data-l);font-size:12px;color:var(--ink3);font-weight:700;flex:none;text-align:left}
  .tbl td.idc{display:block;text-align:left;padding-bottom:8px}
  .tbl tr{position:relative}
  .tbl td.chk{position:absolute;right:14px;top:14px;padding:0}
  .tbl td.idc{padding-right:30px}
  .tbl td.act{justify-content:flex-start;padding-top:10px;flex-wrap:wrap}
  .tbl td.wide{display:block;text-align:center}
  .tbl td .ell{max-width:100%!important}
  .tbl td>div:not(.acts):not(.row){text-align:right}
  .tbl td.idc,.tbl td.idc>div{text-align:left!important}
  .tbl .acts{flex-wrap:wrap}
  .stagebar{min-width:90px}
  .tbl-w{overflow-x:visible}
  .tbl td .tr-in{min-width:0;flex:1;text-align:left}
  .tbl td.idc .mut{word-break:break-all}
}

@media(max-width:1200px){
  .console{grid-template-columns:minmax(0,1fr)}
  .sidenav{position:static;padding:10px;min-width:0;max-width:100%}
  .sn-head{display:none}
  .sidenav nav{flex-direction:row;overflow-x:auto;gap:4px;scrollbar-width:none}
  .sidenav nav::-webkit-scrollbar{display:none}
  .sidenav nav button{white-space:nowrap;flex:none}
}

.recent b{white-space:nowrap;flex:none}
@media(max-width:430px){
  .jd-act{gap:6px;padding:12px}
  .jd-act .ibtn{width:38px;height:44px}
  .jd-act .btn.lg{height:44px;padding:0 8px;font-size:13.5px;min-width:0}
  .jd-act .btn.lg svg{display:none}
}

.related{gap:8px;margin-top:12px;align-items:center}
.chip.ss{padding:0 4px 0 12px;gap:2px}
.ss-b{border:0;background:none;padding:6px 4px;font-weight:600;color:inherit;max-width:260px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

@media(max-width:760px){
  .jobs-grid .row.wrap>.right.row{margin-left:0;width:100%;flex-wrap:wrap}
  .jobs-grid .right.row .sel{flex:1 1 100%}
  .jobs-grid .seg{display:flex;width:100%}
  .jobs-grid .seg button{flex:1;padding:6px 4px;font-size:12px}
}