/* ArchesTask design system — plain CSS companions to Tailwind utilities */
[x-cloak]{display:none!important}
*{scrollbar-width:thin;scrollbar-color:#C1C7D0 transparent}
::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-thumb{background:#C1C7D0;border-radius:8px}

.nav-top{display:inline-flex;align-items:center;padding:.4rem .6rem;border-radius:6px;color:#44546F;font-weight:500;white-space:nowrap}
.nav-top:hover{background:#F1F2F4;color:#172B4D}
.nav-top-active{color:#0C66E4;position:relative}
.nav-top-active:after{content:"";position:absolute;left:8px;right:8px;bottom:-9px;height:3px;background:#0C66E4;border-radius:2px}

.dropdown{position:absolute;left:0;top:100%;margin-top:4px;background:#fff;border:1px solid #DCDFE4;border-radius:10px;box-shadow:0 8px 12px rgba(9,30,66,.15),0 0 1px rgba(9,30,66,.31);padding:6px;z-index:50}
.dropdown-item{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:6px;font-size:14px;color:#172B4D;text-decoration:none}
.dropdown-item:hover{background:#F1F2F4}
.dropdown-label{padding:8px 10px 4px;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#626F86}
.divider{height:1px;background:#EBECF0;margin:6px 0}

.side-label{padding:14px 10px 4px;font-size:11px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:#626F86}
.side-item{display:flex;align-items:center;gap:10px;padding:7px 10px;border-radius:6px;color:#172B4D;text-decoration:none}
.side-item span:first-child{width:20px;text-align:center}
.side-item:hover{background:#F1F2F4}
.side-active{background:#E9F2FF;color:#0C66E4;font-weight:600}

.proj-avatar{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:6px;font-size:13px;flex-shrink:0;color:#fff}

.btn{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:6px;font-size:14px;font-weight:600;background:#F1F2F4;color:#172B4D;border:none;cursor:pointer;white-space:nowrap;text-decoration:none;line-height:1.25}
.btn:hover{background:#DCDFE4}
.btn-primary{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:6px;font-size:14px;font-weight:600;background:#0C66E4;color:#fff;border:none;cursor:pointer;white-space:nowrap;text-decoration:none;line-height:1.25}
.btn-primary:hover{background:#0055CC}
.btn-danger{display:inline-flex;align-items:center;gap:6px;padding:7px 12px;border-radius:6px;font-size:14px;font-weight:600;background:#C9372C;color:#fff;border:none;cursor:pointer;white-space:nowrap}
.btn-danger:hover{background:#AE2E24}
.btn-ghost{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border-radius:6px;font-size:14px;font-weight:500;background:transparent;color:#44546F;border:none;cursor:pointer;white-space:nowrap;text-decoration:none}
.btn-ghost:hover{background:#F1F2F4;color:#172B4D}
.btn-sm{padding:4px 8px;font-size:12px}
.icon-btn{width:32px;height:32px;border-radius:6px;display:inline-flex;align-items:center;justify-content:center;color:#44546F;background:transparent;border:none;cursor:pointer}
.icon-btn:hover{background:#F1F2F4;color:#172B4D}

.inp{width:100%;border:2px solid #DCDFE4;border-radius:6px;padding:7px 10px;font-size:14px;background:#fff;color:#172B4D;outline:none;transition:border-color .15s}
.inp:focus{border-color:#388BFF;background:#fff}
.inp:hover{background:#F7F8F9}
select.inp{appearance:auto}
.lbl{display:block;font-size:12px;font-weight:600;color:#626F86;margin-bottom:4px}
.inline-inp{border:2px solid transparent;border-radius:6px;padding:4px 8px;font-size:14px;background:transparent;width:100%;outline:none}
.inline-inp:hover{background:#F1F2F4}.inline-inp:focus{border-color:#388BFF;background:#fff}

.card{background:#fff;border-radius:10px;box-shadow:0 1px 1px rgba(9,30,66,.25),0 0 1px rgba(9,30,66,.31)}
.card-hover:hover{box-shadow:0 8px 12px rgba(9,30,66,.15),0 0 1px rgba(9,30,66,.31);transform:translateY(-1px)}
.card-hover{transition:all .15s}

.lozenge{display:inline-flex;align-items:center;padding:1px 6px;border-radius:3px;font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase;white-space:nowrap;line-height:16px}
.lz-todo{background:#DCDFE4;color:#172B4D}.lz-in_progress{background:#E9F2FF;color:#0055CC}.lz-done{background:#DCFFF1;color:#1F845A}
.lz-red{background:#FFECEB;color:#AE2E24}.lz-purple{background:#F3F0FF;color:#5E4DB2}.lz-yellow{background:#FFF7D6;color:#7F5F01}.lz-gray{background:#F1F2F4;color:#44546F}.lz-teal{background:#E7F9FF;color:#206A83}
.tag{display:inline-flex;align-items:center;padding:2px 8px;border-radius:12px;font-size:11px;font-weight:600;color:#fff}

.issue-card{background:#fff;border-radius:8px;box-shadow:0 1px 1px rgba(9,30,66,.25),0 0 1px rgba(9,30,66,.31);padding:10px 12px;cursor:grab;transition:box-shadow .15s,transform .1s}
.issue-card:hover{background:#F7F8F9;box-shadow:0 4px 8px rgba(9,30,66,.15),0 0 1px rgba(9,30,66,.31)}
.sortable-ghost{opacity:.35;background:#E9F2FF!important;border:2px dashed #388BFF}
.sortable-chosen{cursor:grabbing}
.col-wrap{background:#F7F8F9;border-radius:10px;min-width:270px;width:270px;display:flex;flex-direction:column;max-height:calc(100vh - 14rem)}
.col-body{padding:8px;display:flex;flex-direction:column;gap:8px;overflow-y:auto;flex:1;min-height:80px}
.col-over{background:#E9F2FF}

.avatar{display:inline-flex;align-items:center;justify-content:center;border-radius:9999px;color:#fff;font-weight:700;overflow:hidden;flex-shrink:0;box-shadow:0 0 0 2px #fff}
.avatar img{width:100%;height:100%;object-fit:cover}

.mention{background:#E9F2FF;color:#0055CC;border-radius:3px;padding:0 3px;font-weight:600}
.issue-link{color:#0C66E4;font-weight:600;text-decoration:none;border-bottom:1px dotted #0C66E4}

.prose-archestask{font-size:15px;line-height:1.7;color:#172B4D}
.prose-archestask h1{font-size:1.9rem;font-weight:700;margin:1.5rem 0 .6rem;letter-spacing:-.01em}
.prose-archestask h2{font-size:1.45rem;font-weight:700;margin:1.4rem 0 .5rem}
.prose-archestask h3{font-size:1.15rem;font-weight:600;margin:1.2rem 0 .4rem}
.prose-archestask p{margin:.5rem 0}
.prose-archestask ul{list-style:disc;padding-left:1.5rem;margin:.5rem 0}.prose-archestask ol{list-style:decimal;padding-left:1.5rem;margin:.5rem 0}
.prose-archestask li{margin:.2rem 0}
.prose-archestask a{color:#0C66E4}
.prose-archestask blockquote{border-left:4px solid #DCDFE4;padding:2px 14px;color:#44546F;margin:.8rem 0;background:#F7F8F9;border-radius:0 6px 6px 0}
.prose-archestask pre{background:#F4F5F7;border-radius:8px;padding:12px 14px;overflow:auto;font-size:13px;margin:.8rem 0;border:1px solid #EBECF0}
.prose-archestask code{background:#F4F5F7;padding:1px 5px;border-radius:4px;font-size:.9em}
.prose-archestask table{border-collapse:collapse;width:100%;margin:.8rem 0;font-size:14px}
.prose-archestask th{background:#F4F5F7;font-weight:600;text-align:left}
.prose-archestask th,.prose-archestask td{border:1px solid #DCDFE4;padding:6px 10px;vertical-align:top}
.prose-archestask img{max-width:100%;border-radius:8px;margin:.5rem 0}
.prose-archestask hr{border:0;border-top:1px solid #DCDFE4;margin:1.5rem 0}
.prose-archestask .ql-align-center{text-align:center}.prose-archestask .ql-align-right{text-align:right}
.prose-archestask input[type=checkbox]{margin-right:6px}
.panel-info,.panel-note,.panel-warning,.panel-success{border-radius:8px;padding:10px 14px;margin:.8rem 0;border-left:4px solid}
.panel-info{background:#E9F2FF;border-color:#0C66E4}.panel-note{background:#F3F0FF;border-color:#6E5DC6}.panel-warning{background:#FFF7D6;border-color:#E2B203}.panel-success{background:#DCFFF1;border-color:#1F845A}

.ql-toolbar.ql-snow{border:1px solid #DCDFE4;border-radius:8px 8px 0 0;background:#F7F8F9;position:sticky;top:56px;z-index:10}
.ql-container.ql-snow{border:1px solid #DCDFE4;border-top:0;border-radius:0 0 8px 8px;font-family:Inter,sans-serif;font-size:15px;min-height:420px}
.ql-editor{min-height:420px;line-height:1.7}
.ql-editor h1{font-size:1.9rem}.ql-editor h2{font-size:1.45rem}

.tree-item{display:flex;align-items:center;gap:4px;padding:4px 6px;border-radius:6px;font-size:13.5px;color:#172B4D;text-decoration:none;line-height:1.3}
.tree-item:hover{background:#F1F2F4}
.tree-item.active{background:#E9F2FF;color:#0C66E4;font-weight:600}
.tree-handle{cursor:grab;color:#C1C7D0;opacity:0;font-size:12px}
li:hover>.tree-item .tree-handle{opacity:1}
.tree-toggle{width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;border-radius:4px;color:#626F86;font-size:10px;flex-shrink:0}
.tree-toggle:hover{background:#DCDFE4}

.progress{height:6px;background:#EBECF0;border-radius:4px;overflow:hidden;display:flex}
.progress>div{height:100%}
.stat{background:#fff;border-radius:10px;padding:14px 16px;box-shadow:0 1px 1px rgba(9,30,66,.25),0 0 1px rgba(9,30,66,.31)}
.stat .v{font-size:26px;font-weight:800;letter-spacing:-.02em}
.stat .l{font-size:12px;color:#626F86;font-weight:500}

.tbl{width:100%;font-size:14px;border-collapse:separate;border-spacing:0}
.tbl th{text-align:left;font-size:12px;color:#626F86;font-weight:600;padding:8px 10px;border-bottom:2px solid #DCDFE4;white-space:nowrap;background:#F7F8F9}
.tbl td{padding:8px 10px;border-bottom:1px solid #EBECF0;vertical-align:middle}
.tbl tr:hover td{background:#F7F8F9}

.tab{padding:8px 4px;margin-right:16px;font-size:14px;font-weight:600;color:#626F86;border-bottom:2px solid transparent;text-decoration:none}
.tab:hover{color:#0C66E4}
.tab-active{color:#0C66E4;border-bottom-color:#0C66E4}

.diff-add{background:#DCFFF1;color:#1F845A;padding:0 2px;border-radius:2px}
.diff-del{background:#FFECEB;color:#AE2E24;text-decoration:line-through;padding:0 2px;border-radius:2px}

.timeline-row:hover .timeline-bar{filter:brightness(1.08)}
.epic-bar{position:absolute;height:26px;top:7px;border-radius:6px;display:flex;align-items:center;padding:0 10px;color:#fff;font-size:12px;font-weight:600;white-space:nowrap;overflow:hidden;box-shadow:0 1px 2px rgba(9,30,66,.3)}

.auth-bg{background:radial-gradient(1200px 600px at 10% -10%,#CCE0FF 0%,transparent 60%),radial-gradient(900px 500px at 110% 110%,#DCFFF1 0%,transparent 60%),#F7F8F9}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.float{animation:float 6s ease-in-out infinite}

.side-item svg{color:#626F86}
.side-active svg{color:inherit}

img.emoji{height:1.15em;width:1.15em;margin:0 .06em;vertical-align:-.22em;display:inline-block}
.proj-avatar img.emoji,.avatar img.emoji{height:1em;width:1em;vertical-align:-.12em}

/* ===== WYSIWYG parity: the Quill editor mirrors the rendered page ===== */
.ql-editor{color:#172B4D;line-height:1.7}
.ql-editor.ql-blank::before{color:#8590A2;font-style:normal}
.ql-editor h1{font-size:1.9rem;font-weight:700;margin:1.5rem 0 .6rem;letter-spacing:-.01em}
.ql-editor h2{font-size:1.45rem;font-weight:700;margin:1.4rem 0 .5rem}
.ql-editor h3{font-size:1.15rem;font-weight:600;margin:1.2rem 0 .4rem}
.ql-editor p{margin:.5rem 0}
.ql-editor blockquote{border-left:4px solid #DCDFE4;padding:2px 14px;color:#44546F;margin:.8rem 0;background:#F7F8F9;border-radius:0 6px 6px 0}
.ql-editor pre,.ql-editor .ql-code-block-container{background:#F4F5F7!important;border:1px solid #EBECF0;border-radius:8px;padding:12px 14px;font-size:13px;margin:.8rem 0;color:#172B4D}
.ql-editor table{border-collapse:collapse;width:100%;margin:.8rem 0;font-size:14px}
.ql-editor th{background:#F4F5F7;font-weight:600;text-align:left}
.ql-editor th,.ql-editor td{border:1px solid #DCDFE4;padding:6px 10px;vertical-align:top}
.ql-editor img{max-width:100%;border-radius:8px;margin:.5rem 0}
.ql-editor a{color:#0C66E4}

/* ===== Confluence-style page editor chrome (wiki editor only) ===== */
.page-editor .ql-toolbar.ql-snow{border:0;border-bottom:1px solid #EBECF0;border-radius:0;background:rgba(255,255,255,.95);backdrop-filter:blur(4px);top:112px;padding:8px 0}
.page-editor .ql-toolbar .ql-formats{margin-right:14px}
.page-editor .ql-container.ql-snow{border:0;font-size:16px;min-height:62vh}
.page-editor .ql-editor{padding:22px 2px 96px}
.page-editor .ql-editor.ql-blank::before{left:2px}

/* ===== Interactive Gantt (timeline) ===== */
.epic-bar{cursor:grab;touch-action:none}
.epic-bar:active{cursor:grabbing}
.gantt-handle{position:absolute;top:0;bottom:0;width:9px;cursor:ew-resize;opacity:0;z-index:2}
.gantt-handle.left{left:0;border-radius:6px 0 0 6px}
.gantt-handle.right{right:0;border-radius:0 6px 6px 0}
.epic-bar:hover .gantt-handle{opacity:1;background:rgba(255,255,255,.35)}
.gantt-handle:after{content:"";position:absolute;top:7px;bottom:7px;left:3px;width:2px;border-radius:2px;background:rgba(255,255,255,.9)}
.sprint-band-label{font-size:10px;color:#626F86;background:rgba(255,255,255,.85);border-radius:4px;padding:1px 5px;margin:4px 0 0 4px;display:inline-block;max-width:92%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;box-shadow:0 0 0 1px rgba(9,30,66,.06)}

/* ===== Interactive workflow diagram ===== */
.wf-node{position:absolute;min-width:132px;text-align:center;background:#fff;border:2px solid;border-radius:12px;padding:10px 16px 8px;box-shadow:0 1px 3px rgba(9,30,66,.18),0 0 1px rgba(9,30,66,.31);cursor:grab;touch-action:none;user-select:none;transition:box-shadow .12s}
.wf-node:hover{box-shadow:0 6px 14px rgba(9,30,66,.18),0 0 1px rgba(9,30,66,.31)}
.wf-node:active{cursor:grabbing;box-shadow:0 10px 18px rgba(9,30,66,.25),0 0 1px rgba(9,30,66,.31);z-index:5}
.wf-port{position:absolute;right:-8px;top:50%;transform:translateY(-50%);width:15px;height:15px;border-radius:9999px;background:#fff;border:3px solid #0C66E4;cursor:crosshair;opacity:0;transition:opacity .12s,transform .12s;z-index:4}
.wf-node:hover .wf-port{opacity:1}
.wf-port{opacity:.45}
.wf-port:hover{transform:translateY(-50%) scale(1.25)}