.app-kanban { position: relative; min-height: 38rem; color: #edf0f4; }
.app-kanban-toolbar { display: grid; grid-template-columns: minmax(12rem, 18rem) minmax(12rem, 1fr) auto auto auto auto; gap: .65rem; align-items: center; margin-bottom: 1rem; padding: .75rem; border: 1px solid #3b414d; border-radius: .55rem; background: #242933; }
.app-kanban-project-picker { display: grid; gap: .25rem; margin: 0; color: #b9bec8; font-size: .72rem; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.app-kanban-project-picker .form-select { border-color: #505866; background-color: #1c2028; color: #eef0f3; }
.app-kanban-project-heading { min-width: 0; }
.app-kanban-project-heading h2 { margin: 0; overflow: hidden; color: #f5f6f8; font-size: 1.15rem; text-overflow: ellipsis; white-space: nowrap; }
.app-kanban-project-heading p { margin: .18rem 0 0; overflow: hidden; color: #aeb4bf; font-size: .78rem; text-overflow: ellipsis; white-space: nowrap; }
.app-kanban-toolbar .btn { display: inline-flex; align-items: center; gap: .38rem; white-space: nowrap; }
.app-kanban-archive-filter { display: flex; align-items: center; gap: .42rem; margin: 0; color: #d3d7de; font-size: .8rem; white-space: nowrap; }
.app-kanban-task-filter { display: grid; grid-column: 1 / -1; grid-template-columns: auto minmax(0, 1fr); gap: .55rem; align-items: center; margin-top: .15rem; }
.app-kanban-task-filter > label { margin: 0; color: #d3d7de; font-size: .78rem; font-weight: 700; white-space: nowrap; }
.app-kanban-task-filter-control { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto auto; }
.app-kanban-task-filter-control .form-control { min-width: 0; border-color: #505866; border-radius: .35rem 0 0 .35rem; background-color: #1c2028; color: #eef0f3; }
.app-kanban-task-filter-control .form-control:focus { position: relative; z-index: 2; border-color: #6aa8ba; box-shadow: 0 0 0 .15rem rgb(86 162 184 / 22%); }
.app-kanban-task-filter-control > .btn { border-radius: 0; }
.app-kanban-task-filter-submit { border-radius: 0 .35rem .35rem 0 !important; }
.app-kanban-task-filter-control.has-value .app-kanban-task-filter-submit { border-radius: 0 !important; }
.app-kanban-task-filter-clear { border-radius: 0 .35rem .35rem 0 !important; }
.app-kanban-task-filter-clear[hidden] { display: none; }
.app-kanban-task-suggestions { position: absolute; z-index: 30; top: calc(100% + .3rem); right: 0; left: 0; overflow: hidden; border: 1px solid #4a5361; border-radius: .42rem; background: #20252e; box-shadow: 0 .8rem 2.2rem rgb(0 0 0 / 48%); }
.app-kanban-task-suggestions[hidden] { display: none; }
.app-kanban-task-suggestions-title { padding: .42rem .65rem; border-bottom: 1px solid #3c4450; color: #929aa6; font-size: .66rem; font-weight: 750; letter-spacing: .07em; text-transform: uppercase; }
.app-kanban-task-suggestion { display: grid; width: 100%; gap: .15rem; padding: .52rem .65rem; border: 0; border-bottom: 1px solid #373e49; background: transparent; color: #e9ebee; text-align: left; }
.app-kanban-task-suggestion:last-child { border-bottom: 0; }
.app-kanban-task-suggestion:hover, .app-kanban-task-suggestion:focus-visible { background: #343d49; outline: none; }
.app-kanban-task-suggestion strong { overflow: hidden; font-size: .8rem; text-overflow: ellipsis; white-space: nowrap; }
.app-kanban-task-suggestion-meta { color: #78b5c6; font-size: .67rem; }
.app-kanban-task-suggestion-preview { overflow: hidden; color: #aeb4bd; font-size: .69rem; text-overflow: ellipsis; white-space: nowrap; }
.app-kanban-board { display: grid; grid-template-columns: repeat(5, minmax(16rem, 1fr)); gap: .8rem; align-items: start; overflow-x: auto; padding-bottom: .7rem; }
.app-kanban-board[hidden] { display: none; }
.app-kanban-column { min-width: 16rem; overflow: hidden; border: 1px solid #363c47; border-radius: .55rem; background: #1c2028; }
.app-kanban-column-header { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .72rem .8rem; border-bottom: 1px solid #39404b; background: #292f3a; }
.app-kanban-column-header h3 { margin: 0; font-size: .9rem; }
.app-kanban-column[data-column='Backlog'] .app-kanban-column-header { box-shadow: inset 0 3px #8390a3; }
.app-kanban-column[data-column='Approved'] .app-kanban-column-header { box-shadow: inset 0 3px #8b72c6; }
.app-kanban-column[data-column='InProgress'] .app-kanban-column-header { box-shadow: inset 0 3px #4996bb; }
.app-kanban-column[data-column='Testing'] .app-kanban-column-header { box-shadow: inset 0 3px #d09b42; }
.app-kanban-column[data-column='Completed'] .app-kanban-column-header { box-shadow: inset 0 3px #55a874; }
.app-kanban-column-count { color: #aeb4bd; font-size: .69rem; white-space: nowrap; }
.app-kanban-list { display: grid; align-content: start; gap: .6rem; min-height: 8rem; padding: .65rem; transition: background .12s; }
.app-kanban-list.is-drag-over { background: rgb(85 154 181 / 12%); box-shadow: inset 0 0 0 2px #559ab5; }
.app-kanban-list-empty { display: grid; min-height: 5.5rem; place-items: center; border: 1px dashed #414855; border-radius: .42rem; color: #777e8a; font-size: .76rem; }
.app-kanban-list:has(.app-kanban-card) .app-kanban-list-empty { display: none; }
.app-kanban-card { padding: .7rem; border: 1px solid #424a57; border-radius: .48rem; background: #292f39; box-shadow: 0 2px 7px rgb(0 0 0 / 22%); cursor: grab; outline: none; transition: border-color .12s, transform .12s, opacity .12s; }
.app-kanban-card:hover, .app-kanban-card:focus-visible { border-color: #6e9dab; transform: translateY(-1px); }
.app-kanban-card.is-dragging { opacity: .45; cursor: grabbing; }
.app-kanban-card.is-archived { border-style: dashed; opacity: .68; cursor: default; }
.app-kanban-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: .4rem; }
.app-kanban-card h4 { margin: 0; color: #f3f4f6; font-size: .88rem; line-height: 1.35; overflow-wrap: anywhere; }
.app-kanban-card p { display: -webkit-box; margin: .48rem 0; overflow: hidden; color: #bdc2cb; font-size: .76rem; line-height: 1.4; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.app-kanban-card-actions { display: flex; flex: 0 0 auto; gap: .2rem; }
.app-kanban-icon-button { display: inline-grid; width: 1.75rem; height: 1.75rem; place-items: center; padding: 0; border: 0; border-radius: .3rem; background: transparent; color: #bbc1ca; }
.app-kanban-icon-button:hover, .app-kanban-icon-button:focus-visible { background: #414957; color: #fff; outline: none; }
.app-kanban-card-meta { display: flex; align-items: center; gap: .65rem; margin-top: .55rem; color: #aeb4bd; font-size: .69rem; }
.app-kanban-points { padding: .14rem .38rem; border-radius: 999px; background: #394755; color: #d8e8ee; font-weight: 700; }
.app-kanban-archived-badge { color: #d5aa62; font-weight: 700; text-transform: uppercase; }
.app-kanban-empty { display: grid; min-height: 24rem; place-items: center; align-content: center; gap: .7rem; border: 1px dashed #444b57; border-radius: .55rem; background: #20242c; color: #aeb4be; text-align: center; }
.app-kanban-empty[hidden] { display: none; }
.app-kanban-empty i { font-size: 2.6rem; color: #6d9caa; }
.app-kanban-status { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.app-kanban.is-loading::after { content: ''; position: absolute; z-index: 20; inset: 0; border-radius: .5rem; background: rgb(16 19 25 / 38%); cursor: wait; }
.app-kanban-dialog-backdrop { position: fixed; z-index: 1090; inset: 0; display: grid; place-items: center; padding: 1rem; background: rgb(3 6 10 / 72%); backdrop-filter: blur(3px); }
.app-kanban-dialog { width: min(42rem, 100%); max-height: calc(100vh - 2rem); overflow: hidden; border: 1px solid #4a5260; border-radius: .58rem; background: #242933; color: #f0f2f5; box-shadow: 0 1.5rem 5rem rgb(0 0 0 / 58%); }
.app-kanban-dialog-header { display: flex; align-items: center; justify-content: space-between; padding: .85rem 1rem; border-bottom: 1px solid #414855; }
.app-kanban-dialog-header h2 { margin: 0; font-size: 1.08rem; }
.app-kanban-dialog-body { max-height: calc(100vh - 10rem); padding: 1rem; overflow-y: auto; }
.app-kanban-dialog-footer { display: flex; justify-content: flex-end; gap: .5rem; padding: .8rem 1rem; border-top: 1px solid #414855; }
.app-kanban-editor { display: grid; gap: .85rem; }
.app-kanban-editor-row { display: grid; grid-template-columns: 1fr 2fr; gap: .75rem; }
.app-kanban-field { display: grid; gap: .25rem; }
.app-kanban-field .form-label { margin: 0; color: #d7dbe1; font-size: .78rem; font-weight: 650; }
.app-kanban-field .form-control, .app-kanban-field .form-select, .app-kanban-comment-composer .form-control { border-color: #505866; background-color: #1b1f27; color: #f0f2f5; color-scheme: dark; }
.app-kanban-dialog-error { min-height: 1.2rem; color: #ff9ba5; font-size: .8rem; white-space: pre-line; }
.app-kanban-timeline { display: grid; gap: .65rem; margin-top: .25rem; padding-top: .9rem; border-top: 1px solid #414855; }
.app-kanban-timeline h3 { margin: 0; font-size: .9rem; }
.app-kanban-timeline-feed { display: grid; gap: .55rem; max-height: 15rem; overflow-y: auto; }
.app-kanban-timeline-item { padding: .58rem .65rem; border: 1px solid #3f4652; border-radius: .42rem; background: #1e232b; }
.app-kanban-timeline-item.is-activity { border-left: 3px solid #8b72c6; background: #22232e; }
.app-kanban-timeline-item header { display: flex; align-items: center; gap: .55rem; color: #aeb4bd; font-size: .68rem; }
.app-kanban-timeline-item header strong { color: #e6e9ed; font-size: .75rem; }
.app-kanban-timeline-item header .app-kanban-icon-button { width: 1.45rem; height: 1.45rem; margin-left: auto; }
.app-kanban-timeline-item p { margin: .35rem 0 0; color: #d6d9df; font-size: .78rem; overflow-wrap: anywhere; white-space: pre-wrap; }
.app-kanban-timeline-action { margin-top: .32rem; color: #cfc4ea; font-size: .78rem; font-weight: 650; }
.app-kanban-timeline-change { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: .45rem; align-items: start; margin-top: .38rem; color: #c5c9d0; font-size: .72rem; }
.app-kanban-timeline-change span { overflow-wrap: anywhere; white-space: pre-wrap; }
.app-kanban-timeline-change i { color: #777f8b; }
.app-kanban-no-timeline { margin: .25rem 0; color: #858c97; font-size: .76rem; }
.app-kanban-comment-composer { display: grid; grid-template-columns: 1fr auto; gap: .5rem; align-items: end; }
@media (max-width: 1050px) { .app-kanban-toolbar { grid-template-columns: minmax(12rem, 1fr) minmax(10rem, 1fr) auto auto; } .app-kanban-archive-filter { grid-column: 1; } }
@media (max-width: 650px) { .app-kanban-toolbar { display: flex; flex-wrap: wrap; } .app-kanban-project-picker, .app-kanban-project-heading, .app-kanban-task-filter { flex: 1 1 100%; } .app-kanban-task-filter { grid-template-columns: 1fr; } .app-kanban-board { grid-template-columns: repeat(5, 86vw); } .app-kanban-editor-row, .app-kanban-comment-composer { grid-template-columns: 1fr; } .app-kanban-dialog { max-height: 100vh; border-radius: 0; } }