/* 팀AI · C안 '보고서'. 종이 위에 짙은 초록 한 가지 — 제품의 얼굴은 대표에게 올라오는 보고서다.
 * 제목은 Hahmlet(한글 세리프), 본문 Noto Sans KR, 숫자·시각 IBM Plex Mono.
 * 강조색은 면(--accent)과 글자(--accent-ink)로 나눈다 — 한 값으로 둘을 겸하면 한쪽이 대비에서 진다. */
:root{
  --paper:#F7F7F4; --surface:#FFFFFF; --sunk:#ECEDE7; --ink:#1B211C; --muted:#5C645D; --line:#D9DCD3;
  --accent:#1F6B4A; --on-accent:#FFFFFF; --accent-ink:#1A5C40; --hl:#E3EFE7; --err:#A8321F;
  /* 팀원 아바타 색(흰 글자와 4.5:1 이상). 어두운 테마에서는 밝은 면에 어두운 글자로 뒤집는다. */
  --side-bg:#1B211C; --side-fg:#E6EAE5;   /* 사이드바는 테마와 무관하게 늘 어둡다(Slack 처럼) */
  --pm:#5C7F6B;   /* 총괄 PM 아바타. --ink 를 쓰면 늘 어두운 사이드바에서 사라진다 */
  --m1:#2C5AA6; --m2:#A8421F; --m3:#1F6B4A; --m4:#6A47AD; --m5:#8A5A00; --m6:#1B6F7E; --on-m:#FFFFFF;
  --f-display:"Hahmlet","Nanum Myeongjo",Georgia,serif;
  --f-body:"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  --ease-out:cubic-bezier(.2,.7,.2,1);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --paper:#111512; --surface:#171C18; --sunk:#222923; --ink:#E6EAE5; --muted:#A1AAA2; --line:#2D352F;
  --accent:#4FB386; --on-accent:#0B1F15; --accent-ink:#7CCBA5; --hl:#1F3328; --err:#F08A78; color-scheme:dark;
  --pm:#8FB89E; --m1:#8FB0F0; --m2:#F0A084; --m3:#7CCBA5; --m4:#B8A1F0; --m5:#E3BE6A; --m6:#79C7D4; --on-m:#10140F}}
:root[data-theme="dark"]{
  --paper:#111512; --surface:#171C18; --sunk:#222923; --ink:#E6EAE5; --muted:#A1AAA2; --line:#2D352F;
  --accent:#4FB386; --on-accent:#0B1F15; --accent-ink:#7CCBA5; --hl:#1F3328; --err:#F08A78; color-scheme:dark;
  --pm:#8FB89E; --m1:#8FB0F0; --m2:#F0A084; --m3:#7CCBA5; --m4:#B8A1F0; --m5:#E3BE6A; --m6:#79C7D4; --on-m:#10140F}
*{box-sizing:border-box}
/* .btn 이 display 를 정하므로 hidden 속성이 지고 만다(멈추기 버튼이 늘 보였다). */
[hidden]{display:none!important}
html,body{margin:0;overflow-x:clip}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.65;word-break:keep-all;overflow-wrap:anywhere}
a{color:inherit}
button,input,textarea,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
h1,h2,h3{font-family:var(--f-display);font-weight:800;font-style:normal;text-wrap:balance;margin:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:0 20px;border-radius:4px;
  border:1px solid var(--ink);background:transparent;color:var(--ink);font-weight:600;font-size:15px;text-decoration:none;cursor:pointer;white-space:nowrap}
.btn:hover{background:var(--sunk)}
.btn:active{transform:translateY(1px)}
.btn[disabled]{border-color:var(--line);color:var(--muted);cursor:default;background:transparent}
.btn.pri{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn.pri:hover{filter:brightness(1.08)}
.btn.kakao{background:#FEE500;border-color:#FEE500;color:#191600}
.btn.full{width:100%}
.muted{color:var(--muted)}
.mono{font-family:var(--f-mono);font-variant-numeric:tabular-nums}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}