/* xy-project — 꾸밈은 적게, 읽기 쉽게. 색은 :root 에서만 정한다 */
:root { --bg:#f6f7f9; --card:#fff; --ink:#1c2430; --muted:#667085; --line:#e2e5ea; --brand:#1f4fa3; --brand-ink:#fff;
        --ok:#1b7f4b; --warn:#b54708; --bad:#b42318; --radius:10px; }
* { box-sizing:border-box; }
html { font-size:16px; }
body { margin:0; background:var(--bg); color:var(--ink); font-family:"Pretendard","Noto Sans KR","Malgun Gothic",system-ui,sans-serif; line-height:1.55; }
a { color:var(--brand); text-decoration:none; } a:hover { text-decoration:underline; }
h1 { font-size:1.4rem; margin:0 0 .8rem; }
.muted { color:var(--muted); }
.top { display:flex; gap:1rem; align-items:center; padding:.7rem 1rem; background:var(--card); border-bottom:1px solid var(--line); flex-wrap:wrap; }
.top .brand { font-weight:700; color:var(--ink); }
.top nav { display:flex; gap:.9rem; flex:1; flex-wrap:wrap; }
.top .me { display:flex; gap:.7rem; align-items:center; color:var(--muted); font-size:.9rem; flex-wrap:wrap; }
.top .me form { display:inline; }
.page { max-width:1100px; margin:0 auto; padding:1.2rem 1rem 3rem; }
.card { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:1.3rem; }
.narrow { max-width:420px; margin:0 auto; }
body.public { display:grid; min-height:100vh; place-items:center; padding:1rem; }
body.public .card { width:100%; }
.brand span { color:var(--muted); font-weight:400; font-size:.95rem; }
.stack { display:grid; gap:.9rem; }
.stack label { display:grid; gap:.3rem; font-size:.92rem; color:var(--muted); }
.stack label.check { display:flex; gap:.5rem; align-items:flex-start; color:var(--ink); }
input[type=text],input[type=email],input[type=password],input[type=tel],input[type=date],select,textarea {
  width:100%; padding:.6rem .7rem; border:1px solid var(--line); border-radius:8px; font:inherit; color:var(--ink); background:#fff; }
input:focus,select:focus,textarea:focus { outline:2px solid var(--brand); outline-offset:1px; }
.btn { display:inline-block; padding:.6rem 1rem; border-radius:8px; border:1px solid var(--line); background:#fff; color:var(--ink); font:inherit; cursor:pointer; }
.btn.primary { background:var(--brand); border-color:var(--brand); color:var(--brand-ink); }
button.link { background:none; border:0; padding:0; color:var(--brand); font:inherit; cursor:pointer; }
.links { margin:.9rem 0 0; font-size:.9rem; color:var(--muted); }
.flash { margin:0 0 .9rem; padding:.6rem .8rem; border-radius:8px; font-size:.93rem; list-style:none; }
.flash.alert { background:#fef3f2; color:var(--bad); border:1px solid #fecdca; }
.flash.notice { background:#ecfdf3; color:var(--ok); border:1px solid #abefc6; }

h2 { font-size:1.05rem; margin:1.4rem 0 .6rem; }
.small { font-size:.85rem; }
.bad { color:var(--bad); } .warn { color:var(--warn); }
.head { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-bottom:.8rem; flex-wrap:wrap; }
.head h1 { margin:0; }
.crumb { margin:0 0 .6rem; font-size:.9rem; color:var(--muted); }
.tabs { display:flex; gap:.3rem; border-bottom:1px solid var(--line); margin-bottom:.9rem; flex-wrap:wrap; }
.tabs a { padding:.5rem .8rem; color:var(--muted); border-bottom:2px solid transparent; }
.tabs a.on { color:var(--brand); border-color:var(--brand); font-weight:600; }
.filters { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:.9rem; }
.filters input[type=search] { flex:1 1 14rem; padding:.55rem .7rem; border:1px solid var(--line); border-radius:8px; font:inherit; }
.filters select { width:auto; flex:0 1 auto; }
.empty { padding:2rem; text-align:center; color:var(--muted); background:var(--card); border:1px dashed var(--line); border-radius:var(--radius); }
.table-wrap { overflow-x:auto; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); }
table.list { width:100%; border-collapse:collapse; min-width:760px; }
table.list th, table.list td { padding:.6rem .7rem; text-align:left; border-bottom:1px solid var(--line); vertical-align:top; }
table.list th { font-size:.82rem; color:var(--muted); font-weight:600; background:#fafbfc; white-space:nowrap; }
table.list tr:last-child td { border-bottom:0; }
td.num, .num { color:var(--muted); font-variant-numeric:tabular-nums; white-space:nowrap; }
td.title a { font-weight:600; }
.badge { display:inline-block; padding:.1rem .5rem; border-radius:999px; font-size:.8rem; border:1px solid var(--line); background:#f2f4f7; white-space:nowrap; }
.badge.st-pending { background:#fff7e6; border-color:#fedf89; color:#93370d; }
.badge.st-in_progress { background:#eff4ff; border-color:#b2ccff; color:#1f4fa3; }
.badge.st-review { background:#f4f3ff; border-color:#d9d6fe; color:#5925dc; }
.badge.st-on_hold { background:#f2f4f7; color:#475467; }
.badge.st-completed { background:#ecfdf3; border-color:#abefc6; color:var(--ok); }
.badge.pr-urgent { background:#fef3f2; border-color:#fecdca; color:var(--bad); }
.badge.pr-high { background:#fff7e6; border-color:#fedf89; color:#93370d; }
.badge.internal { background:#fff7e6; border-color:#fedf89; color:#93370d; }
.count { display:inline-block; min-width:1.2rem; padding:0 .35rem; border-radius:999px; background:var(--bad); color:#fff; font-size:.75rem; text-align:center; }
.detail { display:grid; grid-template-columns:minmax(0,1fr) 320px; gap:1rem; align-items:start; }
.detail .side { display:grid; gap:1rem; }
.detail h1 { font-size:1.25rem; }
.body { overflow-wrap:anywhere; }
.body p { margin:.4rem 0; }
details.edit { margin:.8rem 0; } details.edit summary { cursor:pointer; color:var(--brand); margin-bottom:.6rem; }
ul.files { list-style:none; padding:0; margin:.3rem 0 .8rem; display:grid; gap:.3rem; }
ul.files li { display:flex; gap:.6rem; align-items:center; flex-wrap:wrap; }
ul.files form { display:inline; }
.inline-form { display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }
.comment { border:1px solid var(--line); border-radius:8px; padding:.7rem .9rem; margin-bottom:.6rem; }
.comment.internal { background:#fffcf5; border-color:#fedf89; }
.comment .who { margin:0 0 .3rem; }
.row { display:flex; gap:.8rem; flex-wrap:wrap; align-items:end; }
.row > label { flex:1 1 9rem; }
.stack label.check.inline, label.check.inline { display:inline-flex; gap:.35rem; align-items:center; margin-right:.9rem; color:var(--ink); font-size:.92rem; }
fieldset { border:1px solid var(--line); border-radius:8px; padding:.6rem .8rem; margin:0; }
legend { font-size:.85rem; color:var(--muted); padding:0 .3rem; }
.actions { display:flex; gap:.5rem; }
.card.form { max-width:720px; }
dl.props { display:grid; grid-template-columns:5rem 1fr; gap:.4rem .6rem; margin:0 0 1rem; }
dl.props dt { color:var(--muted); font-size:.88rem; } dl.props dd { margin:0; }
ol.activity { list-style:none; padding:0; margin:0; display:grid; gap:.45rem; font-size:.9rem; }
ul.notes { list-style:none; padding:0; margin:0; background:var(--card); border:1px solid var(--line); border-radius:var(--radius); }
ul.notes li { padding:.7rem .9rem; border-bottom:1px solid var(--line); display:flex; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
ul.notes li:last-child { border-bottom:0; } ul.notes li.unread a { font-weight:700; }
nav.pagy { display:flex; gap:.3rem; justify-content:center; margin-top:1rem; flex-wrap:wrap; }
nav.pagy a { padding:.3rem .65rem; border:1px solid var(--line); border-radius:6px; background:#fff; color:var(--ink); }
nav.pagy a[aria-current] { background:var(--brand); border-color:var(--brand); color:#fff; }
@media (max-width: 820px) { .detail { grid-template-columns:1fr; } }

.tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(120px,1fr)); gap:.7rem; margin-bottom:.8rem; }
.tile { background:var(--card); border:1px solid var(--line); border-radius:var(--radius); padding:.9rem; display:grid; gap:.1rem; color:var(--ink); text-align:center; }
a.tile:hover { text-decoration:none; border-color:var(--brand); }
.tile strong { font-size:1.6rem; line-height:1.2; } .tile span { color:var(--muted); font-size:.88rem; }
.tiles.small .tile strong { font-size:1.25rem; }
.tile.bad strong { color:var(--bad); } .tile.warn strong { color:var(--warn); }
.cols { display:grid; grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); gap:1rem; align-items:start; }
ul.plain { list-style:none; padding:0; margin:0 0 .6rem; display:grid; gap:.5rem; }
ul.plain li span.small { display:block; }
table.bars { width:100%; border-collapse:collapse; } table.bars td, table.bars th { padding:.3rem .4rem; text-align:left; font-size:.9rem; }
table.bars th { color:var(--muted); font-weight:600; }
.bar { display:inline-block; height:.7rem; min-width:2px; border-radius:3px; vertical-align:middle; max-width:70%; }
.bar.made { background:#84adff; } .bar.done { background:#6ce9a6; }
.flash.temp code { font-size:1.1rem; font-weight:700; user-select:all; }
.report table.list { min-width:0; }
@media print { .top, .no-print, .flash { display:none !important; } body { background:#fff; } .page { max-width:none; padding:0; } .card { border:0; padding:0; } }
