/* AgileFlow — styled after Atlassian Design System tokens so it reads like Jira */
:root{
  --brand:#0C66E4;--brand-hover:#0055CC;--brand-soft:#E9F2FF;
  --text:#172B4D;--text-subtle:#44546F;--text-subtlest:#626F86;--text-disabled:#8590A2;
  --bg:#FFFFFF;--bg-sunken:#F7F8F9;--bg-neutral:rgba(9,30,66,.06);--bg-neutral-hover:rgba(9,30,66,.14);
  --bg-hover:rgba(9,30,66,.04);--border:#DCDFE4;--border-strong:#B3B9C4;--input-border:#8590A2;
  --danger:#C9372C;--danger-bg:#FFECEB;--warn:#A54800;--warn-bg:#FFF7D6;--ok:#216E4E;--ok-bg:#DCFFF1;
  --flag:#FFF7D6;--shadow-raised:0 1px 1px rgba(9,30,66,.25),0 0 1px rgba(9,30,66,.31);
  --shadow-overlay:0 8px 12px rgba(9,30,66,.15),0 0 1px rgba(9,30,66,.31);
  --radius:3px;--radius-lg:6px;--nav-h:56px;--sb-w:240px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Noto Sans",Ubuntu,"Helvetica Neue",sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{font:14px/20px var(--font);color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased}
a{color:var(--brand);text-decoration:none}
a:hover{text-decoration:underline}
h1{font-size:24px;line-height:28px;font-weight:500;margin:0 0 4px;letter-spacing:-.01em}
h2{font-size:20px;line-height:24px;font-weight:500;margin:0 0 12px}
h3{font-size:16px;line-height:20px;font-weight:600;margin:0 0 8px}
h4{font-size:14px;font-weight:600;margin:0 0 6px}
hr{border:0;border-top:1px solid var(--border);margin:6px 0}
code{font-family:var(--mono);font-size:12px;background:var(--bg-neutral);padding:1px 4px;border-radius:3px}
.muted{color:var(--text-subtlest)}.small{font-size:12px;line-height:16px}.strong{font-weight:600}
.pad{padding:12px}.mt{margin-top:16px}.mb{margin-bottom:16px}.right{text-align:right}.nowrap{white-space:nowrap}
.row{display:flex;gap:8px;align-items:center}.row-wrap{flex-wrap:wrap}.grow{flex:1;min-width:0}.between{justify-content:space-between}
.stack>*+*{margin-top:12px}
.ic{flex-shrink:0;vertical-align:-3px}.ti,.pi{flex-shrink:0;vertical-align:-3px}
:focus-visible{outline:2px solid var(--brand);outline-offset:2px}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}

/* ---------- top nav ---------- */
.topnav{position:fixed;top:0;left:0;right:0;height:var(--nav-h);background:#fff;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;padding:0 12px;z-index:50}
.brand{display:flex;align-items:center;gap:8px;font-weight:600;font-size:16px;color:var(--text);padding:6px 8px;border-radius:var(--radius);margin-right:8px}
.brand:hover{background:var(--bg-hover);text-decoration:none}
.brand-logo{max-height:28px;max-width:140px}
.topnav-links{display:flex;align-items:center;gap:2px;height:100%}
.topnav-links>a,.topnav-links>.dd>button{height:100%;display:flex;align-items:center;gap:4px;padding:0 10px;color:var(--text-subtle);font-weight:500;border:0;background:none;font:inherit;font-weight:500;cursor:pointer;border-bottom:3px solid transparent;border-top:3px solid transparent}
.topnav-links>a:hover,.topnav-links>.dd>button:hover{color:var(--brand);text-decoration:none}
.topnav-links .on{color:var(--brand)!important;border-bottom-color:var(--brand)!important}
.topnav-links .dd{height:100%}
.btn-create{margin-left:8px}
.topnav-right{margin-left:auto;display:flex;align-items:center;gap:4px}
.global-search{display:flex;align-items:center;gap:6px;border:1px solid var(--input-border);border-radius:var(--radius);padding:0 8px;height:32px;width:220px;color:var(--text-subtlest);background:#fff}
.global-search:focus-within{border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand)}
.global-search input{border:0;outline:0;font:inherit;width:100%;background:none;color:var(--text)}
.icon-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;border:0;background:none;color:var(--text-subtle);cursor:pointer}
.icon-btn:hover{background:var(--bg-neutral);text-decoration:none}
.badge-dot{position:absolute;top:0;right:-2px;background:var(--danger);color:#fff;font-size:10px;line-height:14px;min-width:16px;padding:0 4px;border-radius:8px;font-weight:700}
.avatar-btn{border:0;background:none;padding:2px;border-radius:50%;cursor:pointer}
.only-mobile{display:none}

/* ---------- dropdowns ---------- */
.dd{position:relative}
.dd-menu{display:none;position:absolute;top:calc(100% + 4px);left:0;min-width:220px;background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-overlay);padding:6px 0;z-index:80;max-height:70vh;overflow:auto}
.dd.open>.dd-menu{display:block}
.dd-right{left:auto;right:0}
.dd-menu a,.dd-menu button.dd-item{display:flex;align-items:center;gap:8px;padding:6px 16px;color:var(--text);width:100%;text-align:left;border:0;background:none;font:inherit;cursor:pointer;border-left:2px solid transparent}
.dd-menu a:hover,.dd-menu button.dd-item:hover{background:var(--bg-hover);text-decoration:none;border-left-color:var(--brand)}
.dd-menu .danger{color:var(--danger)}
.dd-label{padding:8px 16px 4px;font-size:11px;font-weight:700;color:var(--text-subtlest);text-transform:uppercase;letter-spacing:.02em}
.dd-user{display:flex;gap:10px;align-items:center;padding:8px 16px}
.notif-menu{width:360px}
.notif{display:block;padding:8px 16px;color:var(--text);border-left:2px solid transparent}
.notif.unread{background:var(--brand-soft)}
.notif:hover{background:var(--bg-hover);text-decoration:none}

/* ---------- sidebar ---------- */
.sidebar{position:fixed;top:var(--nav-h);left:0;bottom:0;width:var(--sb-w);background:var(--bg-sunken);border-right:1px solid var(--border);padding:16px 8px;overflow-y:auto;z-index:40}
.sb-project{display:flex;gap:10px;align-items:center;padding:4px 8px 16px}
.sb-project strong{display:block;font-size:14px;line-height:18px}
.sb-group{font-size:11px;font-weight:700;color:var(--text-subtlest);text-transform:uppercase;padding:12px 12px 4px;letter-spacing:.02em}
.sidebar a{display:flex;align-items:center;gap:10px;padding:0 12px;height:36px;border-radius:var(--radius);color:var(--text-subtle);font-weight:500;position:relative}
.sidebar a:hover{background:var(--bg-neutral);text-decoration:none}
.sidebar a.on{background:var(--brand-soft);color:var(--brand)}
.sidebar a.on::before{content:"";position:absolute;left:0;top:8px;bottom:8px;width:3px;border-radius:0 3px 3px 0;background:var(--brand)}
.sb-sep{border-top:1px solid var(--border);margin:12px 8px}
.sb-foot{padding:16px 12px 0}
.proj-av{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:var(--radius);color:#fff;font-weight:700;flex-shrink:0}
.proj-av.sm{width:20px;height:20px;font-size:11px;border-radius:2px}
.proj-av.lg{width:48px;height:48px;font-size:20px}

/* ---------- main ---------- */
.main{padding:calc(var(--nav-h) + 24px) 40px 48px;min-height:100vh}
.has-sidebar .main{margin-left:var(--sb-w)}
.main.full{padding-left:24px;padding-right:24px}
.breadcrumbs{font-size:14px;color:var(--text-subtlest);margin-bottom:8px}
.breadcrumbs a{color:var(--text-subtlest)}
.page-head{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:20px}
.page-head .actions{display:flex;gap:8px;flex-wrap:wrap}
.toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.site-foot{text-align:center;padding:16px}
.has-sidebar .site-foot{margin-left:var(--sb-w)}

/* ---------- buttons & forms ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:6px;height:32px;padding:0 12px;border-radius:var(--radius);border:0;background:var(--bg-neutral);color:var(--text-subtle);font:inherit;font-weight:500;cursor:pointer;white-space:nowrap;text-decoration:none!important}
.btn:hover{background:var(--bg-neutral-hover)}
.btn-primary{background:var(--brand);color:#fff}.btn-primary:hover{background:var(--brand-hover)}
.btn-subtle{background:none}.btn-subtle:hover{background:var(--bg-neutral)}
.btn-danger{background:var(--danger);color:#fff}.btn-danger:hover{background:#AE2E24}
.btn-link{background:none;color:var(--brand);padding:0 4px}.btn-link:hover{text-decoration:underline!important;background:none}
.btn-sm{height:24px;padding:0 8px;font-size:13px}
.btn.selected{background:#DEEBFF;color:#0747A6}
.btn[disabled]{opacity:.5;cursor:not-allowed}
label{display:block;font-size:12px;font-weight:600;color:var(--text-subtle);margin-bottom:4px}
label.inline{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:400;color:var(--text);margin:0}
.req{color:var(--danger)}
.input,select.input,textarea.input{width:100%;min-height:36px;padding:6px 8px;border:1px solid var(--input-border);border-radius:var(--radius);font:inherit;color:var(--text);background:#fff}
.input:hover{background:#F7F8F9}
.input:focus{outline:0;border-color:var(--brand);box-shadow:inset 0 0 0 1px var(--brand);background:#fff}
textarea.input{min-height:90px;resize:vertical;line-height:20px}
select.input[multiple]{min-height:90px}
.input-sm{min-height:28px;padding:2px 6px;font-size:13px}
.field{margin-bottom:16px}
.field .hint{font-size:12px;color:var(--text-subtlest);margin-top:4px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.form-narrow{max-width:640px}
.err-text{color:var(--danger);font-size:12px}
input[type=checkbox],input[type=radio]{accent-color:var(--brand);width:16px;height:16px}
input[type=color]{width:48px;height:36px;padding:2px;border:1px solid var(--input-border);border-radius:var(--radius)}

/* ---------- flashes & toasts ---------- */
.flash{position:relative;padding:12px 40px 12px 16px;border-radius:var(--radius);margin-bottom:16px;background:var(--brand-soft);color:var(--text)}
.flash-error{background:var(--danger-bg)}.flash-success{background:var(--ok-bg)}.flash-warning{background:var(--warn-bg)}
.flash-x{position:absolute;right:8px;top:10px;border:0;background:none;cursor:pointer;color:var(--text-subtle)}
.toasts{position:fixed;left:24px;bottom:24px;display:flex;flex-direction:column;gap:8px;z-index:200}
.toast{background:#fff;box-shadow:var(--shadow-overlay);border-radius:var(--radius);padding:12px 16px;min-width:280px;max-width:420px;border-left:4px solid var(--ok);animation:toast-in .2s ease-out}
.toast.err{border-left-color:var(--danger)}.toast.warn{border-left-color:#E2B203}
@keyframes toast-in{from{transform:translateY(8px);opacity:0}}

/* ---------- avatars, lozenges, chips ---------- */
.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;color:#fff;font-weight:600;flex-shrink:0;object-fit:cover;user-select:none}
.avatar-xs{width:16px;height:16px;font-size:8px}.avatar-sm{width:24px;height:24px;font-size:10px}
.avatar-md{width:28px;height:28px;font-size:11px}.avatar-lg{width:40px;height:40px;font-size:15px}.avatar-xl{width:72px;height:72px;font-size:26px}
.avatar-empty{background:#DFE1E6;color:var(--text-subtle)}
.lozenge{display:inline-block;padding:0 4px;border-radius:3px;font-size:11px;font-weight:700;line-height:16px;text-transform:uppercase;white-space:nowrap;max-width:200px;overflow:hidden;text-overflow:ellipsis;vertical-align:middle}
.lz-todo{background:#DCDFE4;color:#44546F}.lz-in_progress{background:#CCE0FF;color:#0055CC}.lz-done{background:#BAF3DB;color:#216E4E}
.lz-red{background:#FFD5D2;color:#AE2E24}.lz-yellow{background:#F8E6A0;color:#7F5F01}.lz-purple{background:#DFD8FD;color:#5E4DB2}.lz-grey{background:#DCDFE4;color:#44546F}
.chip{display:inline-flex;align-items:center;gap:4px;padding:0 6px;height:20px;border-radius:3px;background:var(--bg-neutral);font-size:12px;color:var(--text-subtle);white-space:nowrap;max-width:180px;overflow:hidden;text-overflow:ellipsis}
.chip-epic{background:#DFD8FD;color:#5E4DB2;font-weight:600}
.chip-blue{background:#CCE0FF;color:#0055CC}
.points{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:16px;padding:0 5px;border-radius:8px;background:#DCDFE4;color:var(--text-subtle);font-size:11px;font-weight:600}
.key{color:var(--text-subtle);font-weight:500;white-space:nowrap}
a.key:hover{color:var(--brand)}
.issue-ref{font-weight:500}

/* ---------- tables ---------- */
.table{width:100%;border-collapse:collapse}
.table th{text-align:left;font-size:12px;font-weight:600;color:var(--text-subtlest);padding:8px;border-bottom:2px solid var(--border);white-space:nowrap}
.table td{padding:8px;border-bottom:1px solid var(--border);vertical-align:middle}
.table tr:hover td{background:var(--bg-hover)}
.table .sum{max-width:420px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.table-wrap{overflow-x:auto}
.table th a{color:inherit}
.pager{display:flex;gap:4px;margin-top:16px;align-items:center}

/* ---------- panels / cards ---------- */
.panel{border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;background:#fff}
.panel+.panel{margin-top:16px}
.panel-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:8px}
.grid{display:grid;gap:16px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.stat{border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px}
.stat b{display:block;font-size:24px;line-height:28px;font-weight:600}
.empty{text-align:center;padding:48px 16px;color:var(--text-subtle)}
.empty h3{color:var(--text)}
.tabs{display:flex;gap:4px;border-bottom:2px solid var(--border);margin-bottom:16px;flex-wrap:wrap}
.tabs a,.tabs button{padding:8px 4px;margin-right:12px;color:var(--text-subtle);font-weight:500;border:0;background:none;font:inherit;font-weight:500;cursor:pointer;margin-bottom:-2px;border-bottom:2px solid transparent}
.tabs a:hover,.tabs button:hover{color:var(--brand);text-decoration:none}
.tabs .on{color:var(--brand);border-bottom-color:var(--brand)}
.progress{display:flex;height:8px;border-radius:4px;overflow:hidden;background:#DCDFE4;min-width:80px}
.progress span{display:block;height:100%}
.pg-done{background:#22A06B}.pg-prog{background:#1D7AFC}.pg-todo{background:#DCDFE4}

/* ---------- board ---------- */
.board-wrap{overflow-x:auto;padding-bottom:12px}
.board{display:flex;gap:8px;align-items:flex-start;min-height:60vh}
.bcol{flex:0 0 272px;background:var(--bg-sunken);border-radius:var(--radius-lg);display:flex;flex-direction:column;max-height:calc(100vh - 210px)}
.bcol-head{padding:12px 12px 8px;display:flex;align-items:center;gap:6px;font-size:12px;font-weight:600;color:var(--text-subtlest);text-transform:uppercase;letter-spacing:.02em;position:sticky;top:0}
.bcol-head .wip{margin-left:auto;font-weight:500;text-transform:none}
.bcol.over{background:#FFECEB}.bcol.over .bcol-head{color:var(--danger)}
.bcol.under{background:#FFF7D6}
.bcol-body{padding:0 6px 8px;overflow-y:auto;min-height:80px;flex:1;display:flex;flex-direction:column;gap:4px}
.lane{margin-bottom:12px}
.lane-head{display:flex;align-items:center;gap:8px;padding:8px 4px;font-weight:600;border-bottom:1px solid var(--border);margin-bottom:8px;cursor:pointer;user-select:none}
.lane.collapsed .lane-body{display:none}
.lane-body .board{min-height:0}
.lane-body .bcol{max-height:none}
.card{background:#fff;border-radius:var(--radius);box-shadow:var(--shadow-raised);padding:10px 10px 8px;cursor:pointer;position:relative}
.card:hover{background:#F7F8F9}
.card.flagged{background:var(--flag)}
.card.flagged::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:#E2B203;border-radius:3px 0 0 3px}
.card-sum{margin-bottom:8px;overflow-wrap:anywhere}
.card-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px}
.card-meta .spacer{flex:1}
.card-labels{display:flex;gap:4px;flex-wrap:wrap;margin-bottom:6px}
.card.done .card-sum{color:var(--text-subtle)}
.sortable-ghost{opacity:.35}
.sortable-chosen{box-shadow:var(--shadow-overlay)}
.drop-blocked{outline:2px dashed var(--danger);outline-offset:-2px}
.quick-filters .btn{height:28px}
.sprint-bar{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin-bottom:12px;color:var(--text-subtle)}

/* ---------- backlog ---------- */
.bl-section{background:var(--bg-sunken);border-radius:var(--radius-lg);padding:8px;margin-bottom:12px}
.bl-head{display:flex;align-items:center;gap:8px;padding:4px 4px 8px;flex-wrap:wrap}
.bl-head h3{margin:0;font-size:14px}
.bl-head .bl-sum{margin-left:auto;display:flex;gap:4px;align-items:center}
.bl-goal{color:var(--text-subtle);font-size:13px;padding:0 4px 8px}
.bl-list{min-height:40px;border-radius:var(--radius)}
.bl-list:empty::after{content:"Plan this sprint by dragging issues here from the backlog.";display:block;text-align:center;padding:14px;color:var(--text-subtlest);border:2px dashed var(--border);border-radius:var(--radius);font-size:13px}
.bl-list.backlog:empty::after{content:"Your backlog is empty. Create an issue to get started."}
.bl-row{display:flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--border);margin-top:-1px;padding:4px 8px;min-height:40px;cursor:pointer}
.bl-row:first-child{border-radius:var(--radius) var(--radius) 0 0}.bl-row:last-child{border-radius:0 0 var(--radius) var(--radius)}
.bl-row:hover{background:#F7F8F9}
.bl-row.flagged{background:var(--flag)}
.bl-row .grip{color:var(--text-disabled);cursor:grab}
.bl-row .sum{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bl-row.done .sum{text-decoration:line-through;color:var(--text-subtle)}
.bl-row .dd-menu{min-width:200px}
.inline-create{display:flex;gap:6px;margin-top:6px;align-items:center}
.inline-create .input{min-height:32px}
.backlog-layout{display:flex;gap:16px;align-items:flex-start}
.epic-panel{width:240px;flex-shrink:0;border:1px solid var(--border);border-radius:var(--radius-lg);padding:8px;position:sticky;top:calc(var(--nav-h) + 16px)}
.epic-item{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:var(--radius);cursor:pointer;width:100%;border:0;background:none;font:inherit;color:var(--text);text-align:left}
.epic-item:hover{background:var(--bg-hover)}.epic-item.on{background:var(--brand-soft)}

/* ---------- issue view ---------- */
.issue-view{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px}
.issue-crumbs{display:flex;align-items:center;gap:6px;margin-bottom:12px;font-size:14px;color:var(--text-subtlest)}
.issue-title{font-size:24px;line-height:28px;font-weight:500;padding:4px 6px;margin:0 -6px 12px;border-radius:var(--radius);cursor:text;border:1px solid transparent;word-break:break-word}
.issue-title:hover{background:var(--bg-hover)}
.issue-actions{display:flex;gap:6px;margin-bottom:20px;flex-wrap:wrap}
.sec{margin-bottom:24px}
.sec-title{font-size:14px;font-weight:600;margin-bottom:8px;display:flex;align-items:center;justify-content:space-between}
.rich{padding:4px 6px;margin:0 -6px;border-radius:var(--radius);cursor:text;min-height:28px;overflow-wrap:anywhere}
.rich:hover{background:var(--bg-hover)}
.rich p{margin:0 0 4px}.rich ul,.rich ol{margin:4px 0;padding-left:24px}.rich .sp{height:8px}
.rich h3,.rich h4,.rich h5{margin:12px 0 4px}
.rich blockquote{border-left:3px solid var(--border);margin:4px 0;padding-left:12px;color:var(--text-subtle)}
pre.code{background:#F7F8F9;border:1px solid var(--border);padding:8px 12px;border-radius:var(--radius);overflow:auto;font:12px/18px var(--mono)}
.placeholder{color:var(--text-subtlest)}
.side-box{border:1px solid var(--border);border-radius:var(--radius-lg)}
.side-box summary{padding:12px 16px;font-weight:600;cursor:pointer;border-bottom:1px solid var(--border);list-style:none;display:flex;justify-content:space-between}
.side-box summary::-webkit-details-marker{display:none}
.dl{display:grid;grid-template-columns:130px minmax(0,1fr);gap:4px 8px;padding:12px 16px;align-items:center}
.dl>dt{font-size:13px;font-weight:600;color:var(--text-subtle);padding:6px 0;align-self:start}
.dl>dd{margin:0;min-width:0}
.ed{display:flex;align-items:center;gap:6px;min-height:32px;padding:2px 6px;margin-left:-6px;border-radius:var(--radius);cursor:pointer;flex-wrap:wrap;border:1px solid transparent}
.ed:hover{background:var(--bg-hover)}
.ed.readonly{cursor:default}.ed.readonly:hover{background:none}
.ed-input{width:100%}
.status-btn{font-weight:600;text-transform:uppercase;font-size:12px}
.status-btn.lz-in_progress{background:#CCE0FF;color:#0055CC}.status-btn.lz-done{background:#BAF3DB;color:#216E4E}
.child-list,.link-list{border:1px solid var(--border);border-radius:var(--radius)}
.child-row{display:flex;align-items:center;gap:8px;padding:6px 10px;border-top:1px solid var(--border)}
.child-row:first-child{border-top:0}
.child-row .sum{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.link-group{font-size:12px;font-weight:600;color:var(--text-subtle);padding:6px 10px;background:var(--bg-sunken)}
.attach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:8px}
.attach{border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;position:relative;background:#fff}
.attach .thumb{height:90px;display:flex;align-items:center;justify-content:center;background:var(--bg-sunken);color:var(--text-subtlest)}
.attach .thumb img{max-width:100%;max-height:100%;object-fit:cover}
.attach .meta{padding:6px 8px;font-size:12px}
.attach .meta a{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.attach .del{position:absolute;top:4px;right:4px;background:#fff;border-radius:3px}
.dropzone{border:2px dashed var(--border);border-radius:var(--radius);padding:12px;text-align:center;color:var(--text-subtlest);font-size:13px}
.dropzone.over{border-color:var(--brand);background:var(--brand-soft)}
.activity-item{display:flex;gap:10px;padding:10px 0}
.activity-item .body{flex:1;min-width:0}
.activity-item .who{font-weight:600}
.comment-box{display:flex;gap:10px;margin-bottom:16px}
.hist-change{font-size:13px;color:var(--text-subtle);margin-top:2px}
.hist-change del{color:var(--text-subtlest)}
.time-bar{height:6px;border-radius:3px;background:#DCDFE4;overflow:hidden;display:flex;margin:4px 0}
.time-bar span{background:#1D7AFC}.time-bar span.over{background:#E2B203}
.flag-banner{background:var(--flag);border-radius:var(--radius);padding:8px 12px;margin-bottom:16px;display:flex;gap:8px;align-items:flex-start}

/* ---------- drawer & modal ---------- */
.drawer{position:fixed;inset:0;z-index:120}
.drawer-backdrop{position:absolute;inset:0;background:rgba(9,30,66,.3)}
.drawer-panel{position:absolute;top:0;right:0;bottom:0;width:min(1100px,94vw);background:#fff;box-shadow:var(--shadow-overlay);overflow-y:auto;padding:24px 32px;animation:drawer-in .18s ease-out}
@keyframes drawer-in{from{transform:translateX(32px);opacity:.4}}
.drawer-close{position:absolute;top:16px;right:16px}
.modal{position:fixed;inset:0;z-index:150;display:flex;align-items:flex-start;justify-content:center;padding:56px 16px;overflow-y:auto}
.modal[hidden],.drawer[hidden]{display:none}
.modal-backdrop{position:fixed;inset:0;background:rgba(9,30,66,.54)}
.modal-box{position:relative;background:#fff;border-radius:var(--radius-lg);box-shadow:var(--shadow-overlay);width:min(600px,100%);max-height:none}
.modal-box.wide{width:min(860px,100%)}
.modal-head{padding:20px 24px 8px;display:flex;justify-content:space-between;align-items:center}
.modal-head h2{margin:0}
.modal-body{padding:8px 24px 16px}
.modal-foot{padding:16px 24px 20px;display:flex;justify-content:flex-end;gap:8px;align-items:center;border-top:1px solid var(--border)}
.modal-foot .left{margin-right:auto}

/* ---------- timeline ---------- */
.tl{display:grid;grid-template-columns:320px minmax(0,1fr);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}
.tl-left{border-right:1px solid var(--border);background:#fff}
.tl-right{overflow-x:auto;position:relative}
.tl-head{height:48px;border-bottom:1px solid var(--border);background:var(--bg-sunken);display:flex;align-items:center;padding:0 12px;font-weight:600;font-size:12px;color:var(--text-subtle)}
.tl-row{height:40px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:8px;padding:0 12px}
.tl-row.child{padding-left:36px;background:#FCFCFD}
.tl-row .sum{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.tl-grid{position:relative}
.tl-scale{height:48px;display:flex;border-bottom:1px solid var(--border);background:var(--bg-sunken);position:sticky;top:0}
.tl-scale div{flex-shrink:0;border-left:1px solid var(--border);font-size:12px;color:var(--text-subtle);padding:4px 6px;font-weight:600}
.tl-lane{height:40px;border-bottom:1px solid var(--border);position:relative}
.tl-bg{position:absolute;inset:48px 0 0 0;display:flex;pointer-events:none}
.tl-bg div{flex-shrink:0;border-left:1px solid #F1F2F4}
.tl-today{position:absolute;top:48px;bottom:0;width:2px;background:#E56910;z-index:3;pointer-events:none}
.tl-bar{position:absolute;top:8px;height:24px;border-radius:4px;background:#9F8FEF;color:#fff;font-size:12px;line-height:24px;padding:0 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:grab;z-index:2;box-shadow:var(--shadow-raised)}
.tl-bar.child{background:#579DFF;height:20px;top:10px;line-height:20px}
.tl-bar .prog{position:absolute;left:0;top:0;bottom:0;background:rgba(0,0,0,.18);pointer-events:none}
.tl-bar span{position:relative}
.tl-bar .h{position:absolute;top:0;bottom:0;width:8px;cursor:ew-resize}
.tl-bar .h.l{left:0}.tl-bar .h.r{right:0}
.tl-bar.unscheduled{display:none}
.tl-deps{position:absolute;inset:0;pointer-events:none;z-index:1}
.tl-add{position:absolute;top:8px;height:24px;border:1px dashed var(--border-strong);border-radius:4px;color:var(--text-subtlest);font-size:12px;padding:0 8px;line-height:22px;opacity:0;cursor:pointer}
.tl-lane:hover .tl-add{opacity:1}

/* ---------- reports / dashboards ---------- */
.report-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.report-card{border:1px solid var(--border);border-radius:var(--radius-lg);padding:16px;color:var(--text);display:block}
.report-card:hover{box-shadow:var(--shadow-raised);text-decoration:none}
.report-card h3{color:var(--brand)}
.chart-box{position:relative;height:340px}
.dash-cols{display:grid;gap:16px;align-items:start}
.dash-col{min-height:120px;display:flex;flex-direction:column;gap:16px}
.gadget{border:1px solid var(--border);border-radius:var(--radius-lg);background:#fff}
.gadget-head{display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid var(--border);font-weight:600}
.gadget-head .grip{cursor:grab;color:var(--text-disabled)}
.gadget-body{padding:12px;min-height:80px}
.gadget-body .chart-box{height:240px}

/* ---------- admin ---------- */
.admin-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px}
.admin-nav a{display:block;padding:7px 12px;border-radius:var(--radius);color:var(--text-subtle);font-weight:500}
.admin-nav a:hover{background:var(--bg-neutral);text-decoration:none}
.admin-nav a.on{background:var(--brand-soft);color:var(--brand)}
.admin-nav .grp{font-size:11px;font-weight:700;color:var(--text-subtlest);text-transform:uppercase;padding:14px 12px 4px}
.matrix td,.matrix th{text-align:center}.matrix td:first-child,.matrix th:first-child,.matrix td:nth-child(2),.matrix th:nth-child(2){text-align:left}
.brand-preview{display:flex;gap:16px;align-items:center;padding:12px;border:1px dashed var(--border);border-radius:var(--radius);margin-bottom:8px}
.brand-preview img{max-height:40px}
.json-row{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:6px;margin-bottom:6px}
.builder-row{display:flex;gap:6px;align-items:flex-start;margin-bottom:6px;padding:8px;border:1px solid var(--border);border-radius:var(--radius);background:#fff}
.builder-row .grow{display:flex;gap:6px;flex-wrap:wrap}
.builder-row .grow>*{flex:1;min-width:140px}
.rule-step{border-left:3px solid var(--border-strong);padding:8px 0 8px 16px;margin-left:8px;position:relative}
.rule-step::before{content:"";position:absolute;left:-8px;top:12px;width:13px;height:13px;border-radius:50%;background:#fff;border:3px solid var(--border-strong)}
.rule-step.trigger{border-color:#9F8FEF}.rule-step.trigger::before{border-color:#9F8FEF}
.rule-step.cond{border-color:#1D7AFC}.rule-step.cond::before{border-color:#1D7AFC}
.rule-step.act{border-color:#22A06B}.rule-step.act::before{border-color:#22A06B}

/* ---------- auth ---------- */
.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg-sunken);padding:24px}
.auth-box{width:400px;max-width:100%;background:#fff;box-shadow:var(--shadow-raised);border-radius:var(--radius-lg);padding:32px 40px}
.auth-brand{display:flex;align-items:center;justify-content:center;gap:8px;font-size:22px;font-weight:600;margin-bottom:24px}
.auth-brand img{max-height:40px}
.auth-box h1{font-size:16px;text-align:center;margin-bottom:24px;font-weight:600}

/* ---------- responsive ---------- */
@media (max-width:1100px){.issue-view{grid-template-columns:1fr}.grid-4{grid-template-columns:repeat(2,1fr)}.epic-panel{display:none}}
@media (max-width:900px){
  .only-mobile{display:inline-flex}.topnav-links>a,.topnav-links .dd{display:none}.global-search{width:140px}
  .sidebar{transform:translateX(-100%);transition:transform .2s}.sidebar.open{transform:none;box-shadow:var(--shadow-overlay)}
  .has-sidebar .main,.has-sidebar .site-foot{margin-left:0}.main{padding-left:16px;padding-right:16px}
  .grid-2,.grid-3,.field-row,.admin-layout{grid-template-columns:1fr}.tl{grid-template-columns:180px minmax(0,1fr)}
  .page-head{flex-direction:column}
}
@media print{.topnav,.sidebar,.toolbar,.page-head .actions,.btn{display:none!important}.has-sidebar .main{margin:0;padding:0}}
.points.lz-todo{background:#DCDFE4;color:#44546F}.points.lz-in_progress{background:#CCE0FF;color:#0055CC}.points.lz-done{background:#BAF3DB;color:#216E4E}
.card-meta{row-gap:4px}