
/* ══ v-199 첫 화면 「내 업무판」 — 남색 판 · 숫자 넷 · 지금 할 일 · 바로 가기 · 이번 주 일정 · Claude 작업 · 소식 ══
   판(남색)은 옷 · 어둡게와 상관없이 그대로(급여 도우미 · 부가세 도우미와 같은 판) · 카드 · 글 · 줄은 옷의 색(변수)을 따름 */
#hv-root[data-hv-now="mine"] .hv-head>.eyebrow,#hv-root[data-hv-now="mine"] .hv-head>.hv-cnt{display:none}
.m9{display:flex;flex-direction:column;gap:14px;min-width:0}
/* ── 남색 판 ── */
.m9-hero{position:relative;overflow:hidden;padding:20px 24px 20px;border-radius:24px;color:#fff;box-sizing:border-box;
  background-color:#1847B8;
  background-image:radial-gradient(rgba(255,255,255,.07) 1px,rgba(255,255,255,0) 1.4px),radial-gradient(520px 260px at 100% -12%,rgba(125,165,255,.34),rgba(125,165,255,0) 70%),radial-gradient(420px 260px at -8% 118%,rgba(34,204,238,.22),rgba(34,204,238,0) 70%);
  background-size:18px 18px,auto,auto;box-shadow:0 22px 44px -28px rgba(8,23,54,.72)}
.m9-deco{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}
.m9-deco svg{position:absolute;right:-170px;top:-230px;fill:none;stroke-width:1}
.m9-deco circle:nth-child(1){stroke:rgba(255,255,255,.09)}
.m9-deco circle:nth-child(2){stroke:rgba(255,255,255,.06)}
.m9-deco circle:nth-child(3){stroke:rgba(255,255,255,.04)}
.m9-hero>:not(.m9-deco){position:relative}
.m9-top{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-height:30px}
.m9-date{font-size:13.5px;font-weight:700;color:rgba(255,255,255,.92)}
.m9-dd{display:inline-flex;align-items:center;min-height:28px;padding:0 11px;box-sizing:border-box;border-radius:9px;background:rgba(83,177,253,.24);border:1px solid rgba(132,202,255,.55);color:#fff;font-size:12.5px;font-weight:800;text-decoration:none;white-space:nowrap}
.m9-dd.warn{background:rgba(247,144,9,.3);border-color:rgba(254,200,75,.65);color:#FFF6E0}
.m9-dd:hover{background:rgba(255,255,255,.18)}
.m9-hi{margin:12px 0 2px;font-size:14px;font-weight:600;color:rgba(255,255,255,.9)}
.m9-h{margin:0;font-size:26px;line-height:1.3;font-weight:800;letter-spacing:-.035em;color:#fff}
.m9-h>b{font-size:30px}
.m9-hs{display:inline-block;margin-left:10px;font-size:15px;font-weight:600;letter-spacing:-.01em;color:rgba(255,255,255,.9)}
.m9-hs b{color:#fff;font-weight:800}
.m9-hs b.bad{color:#FFD7D2}
.m9-sub{margin:6px 0 0;font-size:13.5px;line-height:1.6;color:rgba(255,255,255,.9);max-width:760px}
.m9-go{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.m9-b{min-height:40px;padding:0 16px;border-radius:12px;border:1px solid rgba(255,255,255,.28);background:rgba(255,255,255,.1);color:#fff;font:inherit;font-size:13.5px;font-weight:700;cursor:pointer}
.m9-b.pri{background:#fff;border-color:#fff;color:#1847B8}
.m9-b:hover{background:rgba(255,255,255,.2)}
.m9-b.pri:hover{background:#EAF1FF}
.m9-b:focus-visible,.m9-dd:focus-visible{outline:2px solid #fff;outline-offset:2px}
/* ── 숫자 넷 ── */
.m9-ks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.m9-k{display:flex;flex-direction:column;gap:4px;min-width:0;padding:13px 15px 12px;border-radius:16px;background:var(--surface,#fff);border:1px solid var(--line,#E4E9F2);color:var(--ink,#101828);text-decoration:none;box-sizing:border-box}
.m9-k:hover{border-color:var(--accent,#155EEF)}
.m9-k .l{font-size:12.5px;font-weight:700;color:var(--muted,#475467);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m9-k .v{font-size:26px;line-height:1.15;font-weight:800;letter-spacing:-.04em;color:var(--ink,#101828);font-variant-numeric:tabular-nums}
.m9-k .v small{font-size:13px;font-weight:700;letter-spacing:0;color:var(--muted,#475467);margin-left:2px}
.m9-k .s{font-size:12px;line-height:1.45;color:var(--muted,#475467)}
.m9-k.warn{border-color:color-mix(in srgb,var(--sev2,#B54708) 45%,var(--line,#E4E9F2))}
.m9-k.warn .s{color:var(--sev2,#B54708)}
.m9-bar{display:block;height:6px;border-radius:99px;background:color-mix(in srgb,currentColor 10%,transparent);overflow:hidden;margin:2px 0 1px}
.m9-bar i{display:block;height:100%;border-radius:inherit;background:var(--accent,#155EEF)}
/* ── 두 단 ── */
.m9-g{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:14px;align-items:start}
.m9-l,.m9-r{display:flex;flex-direction:column;gap:14px;min-width:0}
.m9-card{padding:15px 16px 14px;border-radius:18px;background:var(--surface,#fff);border:1px solid var(--line,#E4E9F2);box-sizing:border-box;min-width:0;scroll-margin-top:90px}
.m9-ch{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin:0 0 10px}
.m9-ch h3{margin:0;font-size:15.5px;font-weight:800;letter-spacing:-.02em;color:var(--ink,#101828)}
.m9-cs{font-size:12px;color:var(--muted,#475467)}
.m9-cl{margin-left:auto;font-size:12.5px;font-weight:700;color:var(--accent-ink,var(--accent,#155EEF));text-decoration:none;white-space:nowrap}
.m9-cl:hover{text-decoration:underline}
.m9-none{margin:4px 0;font-size:12.5px;color:var(--muted,#475467)}
.m9-flt{margin:0 0 10px}
.m9-list .hx-it{margin:0 0 6px}
.m9-more{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:8px}
.m9-add{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-left:auto}
.m9-add input{min-height:34px;padding:0 10px;border:1px solid var(--line-2,var(--line,#E4E9F2));border-radius:10px;background:var(--surface,#fff);color:var(--ink,#101828);font:inherit;font-size:12.5px;box-sizing:border-box}
.m9-add input#wd-mt{width:220px;max-width:100%}
.m9-add input#wd-md{width:150px}
.m9-add button{min-height:34px}
/* 바로 가기 */
.m9-qs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.m9-qi{display:flex;align-items:center;gap:10px;min-width:0;min-height:56px;padding:9px 11px;border-radius:14px;border:1px solid var(--line,#E4E9F2);color:var(--ink,#101828);text-decoration:none;box-sizing:border-box}
.m9-qi:hover{border-color:var(--accent,#155EEF);background:color-mix(in srgb,var(--accent,#155EEF) 5%,transparent)}
.m9-qic{display:inline-grid;place-items:center;flex:none;width:34px;height:34px;border-radius:11px;background:color-mix(in srgb,var(--accent,#155EEF) 12%,transparent);color:var(--accent-ink,var(--accent,#155EEF))}
.m9-qt{display:flex;flex-direction:column;min-width:0}
.m9-qt b{font-size:13px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m9-qt small{font-size:11.5px;color:var(--muted,#475467);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
/* 이번 주 일정 */
.m9-w{display:flex;align-items:center;gap:12px;min-height:46px;padding:7px 4px;border-top:1px solid var(--line,#E4E9F2);color:var(--ink,#101828);text-decoration:none}
.m9-w:first-of-type{border-top:0}
.m9-w .d{display:flex;flex-direction:column;align-items:center;flex:none;width:56px;line-height:1.2}
.m9-w .d b{font-size:14px;font-weight:800;color:var(--accent-ink,var(--accent,#155EEF))}
.m9-w.soon .d b{color:var(--sev2,#B54708)}
.m9-w .d small{font-size:11px;color:var(--muted,#475467)}
.m9-w .t{display:flex;flex-direction:column;min-width:0}
.m9-w .t b{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m9-w .t small{font-size:11.5px;color:var(--muted,#475467)}
.m9-w:hover .t b{color:var(--accent-ink,var(--accent,#155EEF))}
/* Claude 작업 */
.m9-a{display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 4px;border-top:1px solid var(--line,#E4E9F2);color:var(--ink,#101828);text-decoration:none}
.m9-a:first-of-type{border-top:0}
.m9-a .t{display:flex;flex-direction:column;min-width:0}
.m9-a .t b{font-size:13px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.m9-a .t small{font-size:11.5px;color:var(--muted,#475467)}
.m9-a.bad .t small{color:var(--sev3,#D92D20)}
.m9-sp{flex:none;width:16px;height:16px;border-radius:50%;border:2.5px solid color-mix(in srgb,#7C5CFF 25%,transparent);border-top-color:#7C5CFF;animation:m9spin 1s linear infinite;box-sizing:border-box}
.m9-dot{flex:none;width:10px;height:10px;margin:0 3px;border-radius:50%;background:var(--good,#12B76A)}
.m9-a.bad .m9-dot{background:var(--sev3,#D92D20)}
@keyframes m9spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.m9-sp{animation:none}}
.m9-news .nw-home{margin:0}
/* ── 좁은 화면 ── */
@media (max-width:1100px){.m9-g{grid-template-columns:minmax(0,1fr)}.m9-qs{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:760px){
  .m9{gap:12px}
  .m9-hero{padding:16px 16px 16px;border-radius:22px}
  .m9-h{font-size:22px}.m9-h>b{font-size:26px}
  .m9-hs{display:block;margin:4px 0 0;font-size:13.5px}
  .m9-sub{font-size:12.5px}
  .m9-go .m9-b{flex:1 1 0;min-height:44px}
  .m9-ks{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .m9-k{padding:11px 12px 10px}
  .m9-k .v{font-size:22px}
  /* 차례 — 지금 할 일 → 이번 주 일정 → Claude 작업 → 소식 → 바로 가기 */
  .m9-g,.m9-l,.m9-r{display:contents}
  .m9-todo{order:1}.m9-week{order:2}.m9-ai{order:3}.m9-news{order:4}.m9-q{order:5}
  .m9-hero{order:-2}.m9-ks{order:-1}
  .m9-qs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .m9-add{margin-left:0;width:100%}
  .m9-add input#wd-mt{flex:1 1 100%;width:auto}
  .m9-add input#wd-md{flex:1 1 140px;width:auto}
  .m9-add input,.m9-add button{min-height:44px}
  /* 할 일 줄 — 글이 좁아지지 않게 기한 · 단추는 아랫줄로 */
  .m9-list .hx-it{grid-template-columns:54px minmax(0,1fr);row-gap:6px}
  .m9-list .hx-it .d{display:block;grid-column:1;grid-row:2;align-self:center;text-align:left;min-width:0}
  .m9-list .hx-it .hv-b{grid-column:2;grid-row:2;justify-self:end;display:flex;flex-wrap:wrap;gap:6px}
}
@media print{.m9-go,.m9-add,.m9-q{display:none}}
