:root{--brand:#97704f;--brand-dark:#795638;--brand-soft:#eee7df;--ink:#252527;--muted:#858486;--line:#e8e5e2;--bg:#f8f7f5;--surface:#fff;--success:#4f876c;--danger:#b64e48;font-family:Pretendard,-apple-system,BlinkMacSystemFont,"Noto Sans KR","Apple SD Gothic Neo",sans-serif;color:var(--ink);background:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}body{margin:0;font-size:14px;line-height:1.55}button,input,select,textarea{font:inherit}button,a,input,select,textarea{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.45}a{color:inherit;text-decoration:none}h1,h2,h3,h4,p{margin:0}h1,h2,h3,h4{letter-spacing:-.035em}ul,ol{margin:0;padding:0;list-style:none}[hidden]{display:none!important}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible,[tabindex]:focus-visible{outline:3px solid #97704f66;outline-offset:3px}::selection{background:#ead8c7}textarea{resize:vertical;min-height:80px}input,select,textarea{min-width:0}input:not([type=checkbox]):not([type=radio]),select,textarea{width:100%;min-height:39px;padding:9px 11px;border:1px solid #dedbd7;border-radius:6px;background:white;color:var(--ink);line-height:1.5}input:focus,select:focus,textarea:focus{border-color:#b39173;box-shadow:0 0 0 3px #97704f0d;outline:none}input:disabled,select:disabled,textarea:disabled{background:#f8f7f5;color:#747375}input::placeholder,textarea::placeholder{color:#a6a3a1}input[type=checkbox]{width:17px;height:17px;accent-color:var(--brand)}.icon{width:18px;height:18px;display:inline-block;vertical-align:middle;flex:0 0 auto}.button{appearance:none;display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:38px;padding:9px 15px;border:1px solid var(--line);border-radius:6px;background:white;color:#4a4641;font-weight:650;line-height:1.4;white-space:nowrap}.button:hover:not(:disabled){background:#f6f2ee;border-color:#cdb9a7}.button.primary{background:var(--brand);border-color:var(--brand);color:white}.button.primary:hover:not(:disabled){background:var(--brand-dark)}.button.outline{border-color:#c6ae99;color:var(--brand-dark)}.button.subtle{background:transparent;border-color:transparent;color:var(--muted)}.button.danger{color:var(--danger);border-color:#e7c9c6}.button.small{min-height:30px;padding:5px 9px;font-size:12px}.button.icon-button{width:32px;min-height:32px;padding:6px;background:transparent;border-color:transparent;color:#777476}.button.icon-button:hover{background:#f0ebe5}.actions,.inline{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.push-left{margin-right:auto}.pill{display:inline-flex;align-items:center;gap:5px;min-height:22px;padding:3px 8px;border-radius:5px;background:#f0efed;color:#77716d;font-size:11px;font-weight:600;line-height:1.5;white-space:nowrap}.pill.brand{background:var(--brand-soft);color:var(--brand-dark)}.pill.green{background:#e8f2eb;color:#508367}.pill.purple{background:#eeebfa;color:#7763a2}.pill.amber{background:#fff2d9;color:#ac7c2b}.avatar{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:43px;height:43px;border-radius:50%;background:#ebe3de;color:#695548;font-size:17px;font-weight:700}.avatar[data-tone="1"]{background:#dfebed;color:#54757b}.avatar[data-tone="2"]{background:#e9e4f4;color:#74658b}.avatar[data-tone="3"]{background:#e2ebf4;color:#4c6c8a}.avatar[data-tone="4"]{background:#e5eee0;color:#607b50}.small-avatar{width:28px;height:28px;font-size:11px}.unassigned-avatar{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:#f2f0ed;color:#aaa49e}.unassigned-avatar .icon{width:14px;height:14px}.hint,.muted{color:var(--muted);font-size:12px}.eyebrow{color:var(--brand-dark);font-size:11px;letter-spacing:.1em;font-weight:700}.form-field{display:flex;flex-direction:column;gap:8px;font-size:12px;font-weight:600;min-width:0}.form-field+.form-field{margin-top:17px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.form-grid .form-field+.form-field{margin-top:0}.span-2{grid-column:1/-1}.checkbox-row{display:flex;align-items:center;gap:8px;font-size:13px}.error-message{padding:10px 12px;background:#fff3f0;border:1px solid #efd3cc;border-radius:6px;color:var(--danger);font-size:12px;margin-top:12px}.error-message:empty{display:none}.notice{padding:13px 15px;border:1px solid #ecdfcd;border-radius:7px;background:#faf5ed;font-size:12px;color:#926c43;margin-bottom:16px}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:40px 20px;color:var(--muted);border:1px dashed #ded8d1;border-radius:8px;background:#fbfaf8;text-align:center;min-height:130px}.empty-state.spacious{min-height:240px}.empty-state .icon{width:28px;height:28px;color:#b4a697}.empty-state strong{font-weight:600;color:#79716c}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.workspace{display:grid;grid-template-columns:196px minmax(0,1fr);min-height:100dvh}.sidebar{position:fixed;top:0;bottom:0;left:0;width:196px;display:flex;flex-direction:column;padding:26px 12px 18px;background:linear-gradient(145deg,#f8f6f3,#f4f1ed);border-right:1px solid var(--line);z-index:20}.workspace-brand{padding:0 10px;margin-bottom:40px;display:block}.workspace-brand>span{display:block;color:var(--brand);font-size:29px;font-weight:800;line-height:1.2;letter-spacing:-.015em}.brand-dot{display:none}.workspace-brand small{display:block;margin-top:5px;font-size:11px;color:#66615e;letter-spacing:-.015em}.sidebar-label{font-size:9px;letter-spacing:.12em;color:#aca39a;padding:0 12px;margin-bottom:10px}.sidebar-nav{display:flex;flex-direction:column;gap:8px}.sidebar-nav a{display:flex;align-items:center;gap:12px;padding:13px 13px;border-radius:6px;font-weight:600;font-size:13px;min-width:0}.sidebar-nav a:hover{background:#eeebe6}.sidebar-nav a.active{background:#eae4dd;color:#3f3329}.sidebar-nav a.active .icon{color:var(--brand)}.sidebar-nav a:last-child{border-top:1px solid #e7e0d9;margin-top:18px;padding-top:25px;border-radius:0}.sidebar-nav .icon{width:19px;height:19px}.nav-count{margin-left:auto;padding:1px 5px;border-radius:4px;background:#ffffff9c;font-size:10px;color:#9b846d}.sidebar-tip{margin:auto 9px 32px;padding:16px 12px;border:1px solid #e7ddd2;border-radius:8px;background:#f5efe7;color:#8c7967;font-size:10px}.tip-mark{display:block;font-size:20px;color:#ae8c6a;margin-bottom:6px}.sidebar-tip strong{font-size:11px;color:#7d654f}.sidebar-tip p{margin-top:7px;line-height:1.8}.sidebar-bottom{margin-top:auto;border-top:1px solid var(--line);padding:16px 8px 0;font-size:10px;color:#999087;white-space:nowrap}.status-dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:#79a388;margin-right:5px}.workspace-main{grid-column:2;min-width:0;transition:margin-right .15s}.workspace-header{height:80px;display:flex;align-items:center;justify-content:space-between;gap:24px;padding:0 30px;background:#faf9f7;border-bottom:1px solid #eeeae5}.global-search{display:flex;align-items:center;gap:11px;max-width:620px;flex:1;padding:0 13px;border:1px solid #dedbd7;border-radius:7px;background:#ffffffb8;min-height:41px;color:#777476}.global-search .icon{width:17px;height:17px}.global-search input{padding:9px 0!important;min-height:38px!important;border:0!important;box-shadow:none!important;background:transparent!important;font-size:12px}.global-search kbd{font-size:9px;font-family:inherit;border:1px solid #e6e1dc;padding:1px 5px;border-radius:4px;color:#aaa199;white-space:nowrap}.header-right{display:flex;align-items:center;gap:15px}.header-right time{font-size:11px;color:#716d69;white-space:nowrap}.header-divider{height:22px;width:1px;background:var(--line)}.profile-button{display:flex;align-items:center;gap:8px;padding:0;border:0;background:transparent;text-align:left;font-size:11px;white-space:nowrap}.profile-button small{display:block;font-size:9px;color:#99908a}.workspace-content{padding:27px 28px 20px;max-width:1920px;margin:0 auto}.page-head{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:22px}.page-head .eyebrow{display:none}.page-title{font-size:30px;font-weight:800;line-height:1.35;letter-spacing:-.045em}.subtitle{color:#85817d;font-size:13px;margin-top:5px}.workspace-footer{display:flex;justify-content:space-between;margin-top:30px;color:#b6ada4;font-size:9px}.workspace-footer span{color:#bbb2aa}.personal-overview{display:flex;align-items:center;min-height:82px;padding:14px 17px;margin-bottom:11px;background:white;border:1px solid var(--line);border-radius:8px}.personal-identity{display:flex;align-items:center;gap:13px;flex:1.35;min-width:175px;padding-right:22px}.personal-identity .avatar{width:44px;height:44px;font-size:17px}.personal-identity strong{display:block;font-size:14px;font-weight:700}.personal-identity span:not(.avatar){display:flex;align-items:center;gap:5px;font-size:10px;color:#8c8884;margin-top:3px;white-space:nowrap}.personal-identity .icon{width:12px;height:12px}.metric-card{flex:1;display:flex;align-items:center;justify-content:center;gap:9px;border-left:1px solid #eeebe7;min-height:48px;padding:8px 16px;white-space:nowrap}.metric-card>span:not(.column-dot){font-size:11px;color:#56514d}.metric-card strong{font-size:18px;font-weight:700;margin-left:8px}.metric-card .column-dot{width:9px;height:9px}.active-dot{background:#508a6c!important}.review-dot{background:#efa91c!important}.help-dot{background:#7ba0dd!important}.flow-note{display:flex;align-items:center;gap:7px;font-size:10px;color:#9a9188;margin:0 2px 17px;line-height:1.7}.flow-note>.icon{width:13px;height:13px;color:#b5a797}.flow-note strong{font-weight:600;color:#8f7c69}.focus-reminder{margin-left:auto;color:#b98439;font-size:10px}.board-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:13px}.board-tabs{display:inline-flex;gap:3px;padding:3px;border:1px solid #e5e0d9;border-radius:6px;background:#f2eeea}.board-tabs .button{min-height:29px;padding:5px 12px;border:0;background:transparent;color:#8b827a;font-size:11px}.board-tabs .button.active{background:white;color:#4d4034;box-shadow:0 1px 4px #3d2c1610}.board-filters{display:flex;align-items:center;gap:9px;font-size:11px;color:#8d847b}.board-filters select{width:auto;max-width:220px;min-height:31px;padding:5px 28px 5px 10px;font-size:11px;border-color:#e3ddd6;background:#fff}.board-total{border-left:1px solid #dfd7cf;padding-left:12px;font-size:10px;color:#a2968c;white-space:nowrap}.kanban-board{display:grid;grid-template-columns:repeat(4,minmax(205px,1fr));gap:11px;overflow-x:auto;align-items:stretch;padding-bottom:10px;min-height:570px}.kanban-column{min-width:0;border:1px solid #e7e3de;border-radius:7px;background:#faf9f7;display:flex;flex-direction:column}.column-header{height:45px;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 13px}.column-header h2{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:750;white-space:nowrap}.column-dot{width:7px;height:7px;background:#b9b2aa;border-radius:50%;flex:0 0 auto}.kanban-column.active .column-dot{background:#578c70}.kanban-column.review .column-dot{background:#e6ae40}.kanban-column.completed .column-dot{background:#7a9acc}.column-count{color:#95816f;margin-left:1px;font-size:12px;font-weight:650}.column-header .button{width:23px;min-height:23px;padding:2px}.column-cards{padding:0 7px 12px;display:flex;flex-direction:column;gap:9px;flex:1;min-height:400px;transition:background .12s}.column-cards.drop-target{background:#e8dfd3;border-radius:6px;outline:2px dashed #b39170;outline-offset:-4px}.column-empty{display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:10px;padding:45px 8px;color:#b0a79f;text-align:center;font-size:10px;line-height:1.8}.column-empty .icon{width:24px;height:24px;opacity:.45}.task-card{position:relative;padding:11px 11px 10px;border:1px solid #e8e6e2;border-radius:7px;background:#fff;box-shadow:0 1px 3px #352a1f03;cursor:pointer;min-width:0;transition:border-color .12s,box-shadow .12s}.task-card:hover{border-color:#bf9f81;box-shadow:0 2px 7px #352a1f08}.task-card:has(.card-menu[open]){z-index:4}.task-card.dragging{opacity:.35;cursor:grabbing}.task-card[draggable=true]{cursor:grab}.task-card[draggable=true]:active{cursor:grabbing}.task-card-top{display:flex;align-items:center;justify-content:space-between;gap:5px;padding-right:17px;margin-bottom:8px}.project-tag{display:inline-flex;align-items:center;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;background:#fbe4e3;color:#b96c69;border-radius:4px;padding:3px 7px;font-size:10px;font-weight:600;line-height:1.4}.project-tag.tone-1{background:#e0eee6;color:#5f8a70}.project-tag.tone-2{background:#e2eafb;color:#6582b7}.project-tag.tone-3{background:#eae4fb;color:#8a71b2}.priority{display:inline-flex;align-items:center;gap:4px;font-size:9px;color:#aaa29b;white-space:nowrap}.priority i{width:5px;height:5px;background:#c3bbb3;border-radius:50%}.priority.high{color:#ca8c43}.priority.high i{background:#dda449}.priority.urgent{color:#c46055}.priority.urgent i{background:#d66f64}.priority.low{color:#8693a5}.priority.low i{background:#a1b1c5}.task-card h3{font-size:12px;font-weight:700;line-height:1.55;letter-spacing:-.025em;overflow-wrap:anywhere}.task-excerpt{font-size:10px;color:#8a8784;margin-top:6px;line-height:1.75;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.task-card-meta{display:flex;align-items:center;justify-content:space-between;gap:5px;margin-top:10px;color:#aaa19a;font-size:9px}.task-card-meta .icon{width:11px;height:11px;margin-right:3px}.effort-label{display:flex;align-items:center}.task-card-footer{display:flex;align-items:center;justify-content:space-between;gap:7px;margin-top:10px}.card-owner{display:flex;align-items:center;gap:6px;color:#75716e;font-size:10px;min-width:0}.card-owner .small-avatar{width:25px;height:25px;font-size:10px}.card-foot-right{display:flex;align-items:center;gap:9px;color:#a29a93;font-size:9px}.card-foot-right>span{display:flex;align-items:center;gap:3px}.card-foot-right .icon{width:12px;height:12px}.card-foot-right time.overdue{color:#bd796b}.claim-button{position:relative;margin-top:11px;min-height:29px;padding:5px 9px;justify-content:center;width:100%;border-color:#b4977c;background:#a07a59;color:white;font-size:10px}.claim-button .icon{width:12px;height:12px}.button.claim-button:hover{background:#8c6545;color:white;border-color:#8c6545}.card-menu{position:absolute;top:9px;right:7px}.card-menu summary{display:flex;align-items:center;justify-content:center;width:18px;height:22px;list-style:none;color:#a99c92;cursor:pointer}.card-menu summary::-webkit-details-marker{display:none}.card-menu summary .icon{width:13px;height:13px;transform:rotate(90deg)}.card-menu-content{position:absolute;right:0;top:25px;display:flex;flex-direction:column;padding:5px;width:160px;background:white;border:1px solid #e3dcd3;border-radius:7px;box-shadow:0 5px 15px #30251b18;z-index:10}.button.menu-action{justify-content:flex-start;border:0;min-height:30px;padding:6px 8px;border-radius:4px;font-size:10px;color:#6e6257}.menu-action .icon{width:12px;height:12px}.attention-tag{display:inline-flex;gap:5px;align-items:center;margin-top:8px;padding:3px 6px;font-size:9px;border-radius:4px}.attention-tag .icon{width:11px;height:11px}.attention-tag.external{color:#6a88b1;background:#edf3fc}.attention-tag.help{color:#ba8d42;background:#fdf3df}.task-card.needs-attention{border-left:2px solid #deb975}
.project-grid,.people-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px}.project-card,.person-card{padding:23px;border:1px solid var(--line);border-radius:9px;background:white;min-width:0}.project-card.is-archived{background:#f3f1ee;opacity:.75}.project-card-heading,.project-progress{display:flex;align-items:center;justify-content:space-between;gap:10px}.project-symbol{display:flex;align-items:center;justify-content:center;width:38px;height:38px;background:#f5efe8;border-radius:9px;color:var(--brand)}.project-card h2{font-size:18px;margin-top:18px}.project-card>p{font-size:12px;color:#938a82;line-height:1.8;min-height:45px;margin-top:9px;overflow-wrap:anywhere}.project-progress{font-size:10px;color:#9a8d82;margin-top:24px}.project-progress strong{color:var(--brand-dark);font-size:13px}.progress-track{height:5px;background:#eee8e1;border-radius:5px;overflow:hidden;margin-top:8px}.progress-track span{display:block;height:100%;background:#ac8a6c;border-radius:inherit}.project-dates{display:flex;align-items:center;gap:6px;font-size:10px;color:#ac9e92;margin-top:15px}.project-dates .icon{width:13px;height:13px}.project-actions{display:flex;gap:5px;justify-content:flex-end;margin-top:20px;padding-top:13px;border-top:1px solid #f0ebe5}.project-actions>.button:first-child{margin-right:auto}.team-summary{display:flex;align-items:center;gap:18px;margin-bottom:20px;font-size:12px;color:#a19081}.person-heading{display:flex;align-items:center;gap:13px}.person-heading h2{font-size:16px}.person-heading h2 .pill{font-size:9px;min-height:18px;margin-left:4px;padding:2px 5px}.person-heading p{font-size:11px;color:#99897d;margin-top:4px}.person-email{font-size:11px;color:#a79b92;margin-top:15px;overflow-wrap:anywhere}.person-stats{display:flex;justify-content:space-around;margin:20px 0;padding:15px 0;border-top:1px solid #f1ece7;border-bottom:1px solid #f1ece7;color:#a08e80;font-size:11px}.person-stats strong{color:#66513f;font-size:16px;display:block;text-align:center;margin-top:3px}.person-footer{display:flex;align-items:center;justify-content:space-between;gap:7px}.notes-list{display:flex;flex-direction:column;gap:17px;max-width:1050px}.meeting-card{padding:22px 25px;border:1px solid var(--line);border-radius:9px;background:white}.meeting-top{display:flex;align-items:center;gap:12px}.meeting-top time{font-size:10px;color:#a99a8d}.meeting-top .actions{margin-left:auto}.meeting-card h2{font-size:18px;margin:14px 0}.meeting-body{font-size:13px;line-height:1.9;color:#7c7066;white-space:pre-wrap;overflow-wrap:anywhere}.meeting-author{display:flex;align-items:center;gap:8px;font-size:10px;color:#998a7f;border-top:1px solid #f0ebe5;padding-top:15px;margin-top:20px}.meeting-author span:last-child{margin-left:auto;font-size:9px;color:#b2a295}
.modal{padding:0;border:1px solid #e1d8cf;border-radius:12px;width:min(620px,calc(100vw - 32px));max-height:calc(100dvh - 32px);box-shadow:0 15px 60px #33251426;color:var(--ink);background:white}.modal.wide{width:min(740px,calc(100vw - 32px))}.modal::backdrop{background:#332a2138;backdrop-filter:blur(2px)}.modal-head{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:21px 24px 18px;border-bottom:1px solid var(--line)}.modal-head h2{font-size:20px;font-weight:750}.modal-content{padding:23px 24px}.modal-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.form-intro{font-size:12px;color:#958374;line-height:1.8;margin-bottom:21px}.form-intro strong{color:#66503e}.panel{padding:28px;background:white;border:1px solid var(--line);border-radius:10px}.container{padding:25px}.load-error h1{font-size:25px;margin-bottom:15px}.load-error .hint{margin-top:10px}.load-error .actions{margin-top:20px}.brand{display:flex;align-items:center;gap:18px;white-space:nowrap}.brand-word{color:var(--brand-dark);font-size:29px;font-weight:800}.brand-divider{height:21px;width:1px;background:#d9d2ca}.brand-team{font-size:16px;font-weight:700}.login-card{background:white}.login-footer{text-align:center;font-size:11px;color:var(--muted)}.login-brand h1{font-weight:800}.login-card .hint{font-weight:400}.login-card .form-field{font-size:14px}.login-shell{justify-content:center}.login-description,.login-features{font-weight:400!important}.spinner{display:inline-block;width:18px;height:18px;border:2px solid #cbbfb3;border-top-color:var(--brand);border-radius:50%;animation:spin .7s linear infinite}.initial-loading{height:100dvh;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px;color:var(--brand);font-size:32px;font-weight:800}.initial-loading span{font-size:13px;color:var(--muted);font-weight:400}#toast{position:fixed;bottom:23px;left:50%;transform:translate(-50%,15px);z-index:2147483100;display:flex;align-items:center;gap:14px;max-width:min(92vw,600px);padding:13px 18px;border-radius:9px;background:#333230;color:white;font-size:12px;line-height:1.5;box-shadow:0 5px 20px #352e2926;opacity:0;pointer-events:none;transition:opacity .18s,transform .18s}#toast.visible{opacity:1;transform:translate(-50%,0);pointer-events:auto}#toast.error{background:#a15745}.button.toast-undo{border:0;border-left:1px solid #ffffff38;background:transparent;color:#e2c5a6;border-radius:0;padding:1px 0 1px 13px;min-height:22px;font-size:11px;white-space:nowrap}#toast .toast-undo:hover{background:transparent;color:white}body.drawer-open .workspace-main{margin-right:430px}.task-drawer{position:fixed;inset:0 0 0 auto;display:flex;flex-direction:column;max-height:none;max-width:100%;width:430px;height:100dvh;margin:0;padding:0;border:0;border-left:1px solid #ded7d0;border-radius:0;background:white;color:var(--ink);box-shadow:-6px 0 22px #33221008;z-index:40;overflow:hidden}.task-drawer:not([open]){display:none}.task-drawer::backdrop{background:transparent}.drawer-header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 21px 11px;color:#9f9286;font-size:10px;border-bottom:1px solid #f1ede8;flex:0 0 auto}.drawer-header>span{display:flex;align-items:center;gap:7px}.drawer-header .icon{width:14px;height:14px}.drawer-header .button .icon{width:18px;height:18px}.drawer-content{padding:22px 24px 26px;overflow-y:auto;flex:1;min-height:0}.drawer-project{display:flex;align-items:center;gap:6px;font-size:10px;color:#9b7c62;margin-bottom:12px}.drawer-project>.icon{width:12px;height:12px}.drawer-project .priority{margin-left:auto}.drawer-content>h2{font-size:23px;line-height:1.45;letter-spacing:-.045em;overflow-wrap:anywhere}.drawer-updated{font-size:9px;color:#b3a69b;margin:7px 0 22px}.detail-properties{display:grid;grid-template-columns:77px minmax(0,1fr);gap:12px 13px;align-items:center;font-size:11px}.detail-properties>span{font-size:11px;color:#9a8b7e}.detail-properties select,.detail-properties input{font-size:11px;min-height:31px;padding:5px 9px;max-width:215px;border-color:#e4dfd9}.drawer-owner{display:flex;align-items:center;gap:9px;font-size:12px;color:#776354}.drawer-section{margin-top:23px;padding-top:21px;border-top:1px solid #eee8e2}.drawer-section h3{display:flex;align-items:center;gap:7px;font-size:12px;color:#51443a;margin-bottom:12px}.drawer-section h3>.icon{width:14px;height:14px;color:#a18b77}.drawer-section-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.drawer-section-head .hint{font-size:9px;margin-bottom:12px}.estimate-box{display:flex;align-items:center;gap:12px;padding:14px;background:#faf7f3;border:1px solid #ebe2d9;border-radius:6px}.estimate-box label{flex:1;color:#9c8672;font-size:10px;min-width:0}.estimate-box input{font-size:12px;min-height:32px;margin-top:5px;background:white!important;border-color:#e4d8ca}.estimate-box>span{color:#c3aa93;margin-top:13px}.estimate-box+.hint{font-size:9px;line-height:1.8;margin-top:8px}.drawer-section .form-field{font-size:10px}.drawer-section input,.drawer-section textarea{font-size:11px}.drawer-section textarea{line-height:1.8}.drawer-section .form-field+textarea{margin-top:9px}.task-description{font-size:12px;line-height:1.9;color:#8a7e73;white-space:pre-wrap;overflow-wrap:anywhere}.checklist-items{display:flex;flex-direction:column;gap:9px;margin-bottom:12px}.checklist-item{display:flex;align-items:flex-start;gap:8px;font-size:11px;color:#8b7b6d}.checklist-item input{margin:1px 0 0;width:15px;height:15px}.checklist-item:has(input:checked)>span{text-decoration:line-through;color:#bbb0a6}.detail-save{width:100%;font-size:11px;margin-top:19px;min-height:33px}.drawer-tabs{display:flex;gap:22px;border-bottom:1px solid #e9dfd4;margin-top:28px;margin-bottom:17px}.drawer-tabs button{border:0;border-bottom:2px solid transparent;padding:9px 0;background:transparent;font-size:11px;color:#a38f7e;font-weight:600}.drawer-tabs button.active{color:#71543d;border-bottom-color:#aa805b}.drawer-tabs span{font-size:9px;margin-left:3px;color:#b1a192}.comments-list{display:flex;flex-direction:column;gap:16px;margin-bottom:18px}.comment-item{display:flex;align-items:flex-start;gap:9px}.comment-item>div{flex:1;min-width:0}.comment-meta{display:flex;align-items:center;gap:6px;font-size:10px;color:#7f6856;flex-wrap:wrap}.comment-meta strong{font-weight:650}.comment-meta time{font-size:8px;color:#b7a79a;margin-left:auto}.comment-meta .pill{font-size:8px;padding:1px 5px;min-height:17px}.comment-item p{font-size:11px;color:#9a8777;line-height:1.8;margin-top:5px;white-space:pre-wrap;overflow-wrap:anywhere}.discussion-empty{padding:12px 0;font-size:10px;color:#b3a18f}.drawer-discussion form{border:1px solid #e7dcd0;padding:12px;border-radius:7px;background:#fdfbf8}.drawer-discussion select{font-size:10px;min-height:28px;padding:4px 7px;width:106px;border-color:#e9dfd4;margin-bottom:9px}.drawer-discussion form input{font-size:10px;min-height:30px;margin-bottom:9px}.drawer-discussion textarea{font-size:11px;min-height:68px;line-height:1.8;background:white;border-color:#e8dfd5}.drawer-discussion form .button{margin-top:9px;min-height:28px;padding:5px 10px;font-size:10px}.activity-item{display:flex;align-items:flex-start;gap:10px;margin:0 0 15px;font-size:10px;color:#a18b78}.activity-item>i{width:6px;height:6px;flex:0 0 auto;margin-top:6px;background:#ceb69e;border-radius:50%}.activity-item strong{font-weight:650;color:#7d624e}.activity-item small{display:block;color:#c1ad9b;font-size:9px;margin-top:4px}.drawer-footer{display:flex;align-items:center;gap:8px;justify-content:center;flex-wrap:wrap;border-top:1px solid #ece3d9;padding:15px 20px;background:white;flex:0 0 auto;box-shadow:0 -4px 14px #37230d03}.drawer-footer>.button.primary{width:100%;font-size:12px;min-height:38px}.drawer-footer .subtle{font-size:10px;padding:4px 7px;min-height:24px}
@keyframes spin{to{transform:rotate(360deg)}}
@media(min-width:1800px){.workspace-content{padding:32px 35px}.task-card{padding:14px}.task-card h3{font-size:14px}.task-excerpt{font-size:12px}.project-tag{font-size:11px}.card-owner{font-size:11px}.task-card-footer{margin-top:15px}.kanban-board{gap:15px}.column-cards{padding:0 10px 15px;gap:12px}.column-header{height:51px}.column-header h2{font-size:15px}}
@media(max-width:1300px){.workspace{grid-template-columns:174px minmax(0,1fr)}.sidebar{width:174px;padding:23px 10px 16px}.workspace-brand{padding:0 8px}.sidebar-nav a{padding:12px 9px;font-size:12px;gap:10px}.nav-count{display:none}.workspace-header{padding:0 22px;gap:17px;height:70px}.workspace-content{padding:23px 20px}.header-right{gap:9px}.header-right time{font-size:10px}.metric-card{padding:8px 12px;gap:7px}.metric-card strong{font-size:16px;margin-left:3px}.metric-card>span:not(.column-dot){font-size:10px}.personal-identity{min-width:160px;padding-right:15px}.personal-identity strong{font-size:12px}.personal-identity span:not(.avatar){font-size:9px}.project-grid,.people-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.personal-overview{padding:12px}.page-title{font-size:28px}.sidebar-tip{margin: auto 4px 26px}.kanban-board{grid-template-columns:repeat(4,minmax(195px,1fr))}}
@media(max-width:1000px){.header-right time,.header-divider{display:none}.workspace-header{gap:12px}.personal-overview{flex-wrap:wrap}.personal-identity{flex-basis:100%;padding-bottom:12px;margin-bottom:5px;border-bottom:1px solid #f0e8df}.metric-card{border:0;min-height:38px}.metric-card+article{border-left:1px solid #eee7df}.flow-note{font-size:9px}.flow-note .focus-reminder{display:none}.sidebar-tip{display:none}body.drawer-open .workspace-main{margin-right:400px}.task-drawer{width:400px}.drawer-content{padding:19px 20px}.board-filters>label{display:none}.board-total{font-size:9px}.sidebar-bottom{font-size:9px}}
@media(max-width:850px){.workspace{grid-template-columns:70px minmax(0,1fr)}.sidebar{width:70px;padding:24px 7px 15px}.workspace-brand{padding:0;text-align:center;margin-bottom:38px}.workspace-brand>span{font-size:18px}.workspace-brand small,.sidebar-label,.sidebar-nav a>span,.sidebar-bottom{display:none}.sidebar-nav a{justify-content:center;padding:12px 5px}.sidebar-nav a .icon{width:21px;height:21px}.sidebar-nav a:last-child{margin-top:10px;padding-top:23px}.workspace-content{padding:22px 17px}.workspace-header{padding:0 17px}.global-search{padding:0 10px}.global-search input{font-size:11px}.global-search kbd{display:none}.page-title{font-size:26px}.subtitle{font-size:11px;line-height:1.8}.page-head{align-items:flex-start}.page-head>.actions .primary{font-size:10px;padding:8px 10px;min-height:34px}.profile-button>span:not(.avatar){display:none}.header-right{gap:5px}.header-right .button{width:27px;padding:3px}.flow-note{display:none}.personal-overview{margin-bottom:17px}body.drawer-open .workspace-main{margin-right:0}.task-drawer{box-shadow:-6px 0 22px #33221018;width:min(430px,calc(100vw - 70px))}.project-grid,.people-grid{grid-template-columns:1fr}.project-card,.person-card{padding:20px}.workspace-footer span{display:none}.project-card .project-progress{margin-top:17px}}
@media(max-width:550px){.workspace{grid-template-columns:1fr;padding-top:0;padding-bottom:61px}.sidebar{inset:auto 0 0;width:100%;height:61px;padding:0 8px;border:0;border-top:1px solid #e3d9ce;background:#faf7f3;z-index:30}.workspace-brand,.sidebar-tip{display:none}.sidebar-nav{flex-direction:row;gap:4px;height:100%;align-items:center;justify-content:space-around}.sidebar-nav a{flex:1;flex-direction:column;gap:3px;justify-content:center;padding:6px 4px;border-radius:6px;font-size:9px;line-height:1.3}.sidebar-nav a>span:not(.nav-count){display:block;font-size:9px}.sidebar-nav a .icon{width:18px;height:18px}.sidebar-nav a:last-child{border:0;margin:0;padding:6px 4px;border-radius:6px}.workspace-main{grid-column:1}.workspace-header{height:60px;padding:0 14px;gap:9px}.global-search{min-height:34px;padding:0 8px;gap:7px}.global-search input{min-height:32px!important;padding:7px 0!important;font-size:10px}.global-search .icon{width:15px;height:15px}.header-right .small-avatar{width:26px;height:26px;font-size:10px}.workspace-content{padding:21px 13px 15px}.page-title{font-size:25px}.page-head{gap:9px;margin-bottom:17px}.page-head .subtitle{max-width:210px;font-size:10px}.page-head>.actions{gap:1px}.page-head .actions>.icon-button{display:none}.page-head>.actions>.primary{font-size:9px;padding:7px 8px;min-height:31px;gap:4px}.page-head .primary .icon{width:12px;height:12px}.personal-overview{padding:12px 10px 7px;border-radius:7px}.personal-identity{gap:10px;padding-bottom:11px}.personal-identity strong{font-size:13px}.personal-identity .avatar{width:35px;height:35px;font-size:14px}.personal-identity span:not(.avatar){font-size:9px}.metric-card{padding:9px 4px;gap:5px;flex-wrap:nowrap}.metric-card>span:not(.column-dot){font-size:9px}.metric-card strong{font-size:15px;margin-left:1px}.metric-card .column-dot{width:6px;height:6px}.board-toolbar{gap:8px;flex-wrap:wrap;margin-bottom:11px}.board-tabs .button{font-size:10px;min-height:26px;padding:4px 10px}.board-filters{gap:6px;margin-left:auto}.board-filters select{max-width:140px;font-size:10px;min-height:29px;padding:4px 20px 4px 8px}.board-total{display:none}.kanban-board{grid-template-columns:repeat(4,235px);gap:10px;min-height:460px;padding-bottom:14px;scroll-snap-type:x proximity}.kanban-column{scroll-snap-align:start}.column-header{height:43px}.column-header h2{font-size:12px}.task-card{padding:12px}.task-card h3{font-size:12px}.task-excerpt{font-size:10px}.task-card-meta{font-size:9px}.workspace-footer{margin-top:20px}.task-drawer{inset:0;width:100%;height:100dvh;max-width:none;z-index:45;box-shadow:none}.drawer-content{padding:18px 20px 25px}.drawer-header{padding:12px 17px}.drawer-content>h2{font-size:24px}.drawer-footer{padding:12px 18px max(12px,env(safe-area-inset-bottom));gap:5px}.detail-properties{font-size:11px;grid-template-columns:85px minmax(0,1fr)}.drawer-section h3{font-size:13px}.drawer-section input,.drawer-section textarea{font-size:12px}.estimate-box label{font-size:11px}.drawer-tabs button{font-size:12px}.comment-item p{font-size:12px}.modal,.modal.wide{width:calc(100vw - 24px);border-radius:11px;max-height:calc(100dvh - 28px)}.modal-head{padding:18px 19px 15px}.modal-head h2{font-size:18px}.modal-content{padding:20px 19px}.form-grid{grid-template-columns:1fr;gap:16px}.span-2{grid-column:auto}.modal-actions{flex-wrap:wrap}.modal-actions>.button{flex:1;font-size:12px}.modal-actions .push-left{flex-basis:100%;margin:0}.form-field{font-size:12px}.team-summary{font-size:10px;gap:13px}.meeting-card{padding:19px 17px}.meeting-card h2{font-size:16px}.meeting-body{font-size:12px}.meeting-top{gap:8px}.meeting-top .button{font-size:10px;padding:4px 6px}.meeting-top .actions{gap:0}.person-heading h2{font-size:17px}#toast{font-size:11px;padding:12px 15px;bottom:75px;gap:10px;width:max-content;max-width:calc(100vw - 26px)}.button.toast-undo{font-size:10px}.load-error{padding:24px!important}.load-error h1{font-size:20px}.load-error p{font-size:12px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.001ms!important;transition-duration:.001ms!important;scroll-behavior:auto!important}}
/* Fixed-domain sign-in. Scoped to keep the application workspace unchanged. */
.login-page{display:flex;flex-direction:column;min-height:100dvh;background:var(--bg)}
.login-header{display:flex;align-items:center;min-height:94px;padding:24px clamp(24px,3.6vw,62px)}
.login-header .brand{gap:24px;color:var(--ink)}
.login-header .brand-word{font-size:34px;letter-spacing:-.01em}
.login-header .brand-team{font-size:21px;font-weight:750}
.login-header .brand-divider{height:27px;background:#d2cbc3}
.login-page .login-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.08fr);align-items:center;gap:clamp(54px,6vw,104px);flex:1;width:min(calc(100% - 112px),1460px);min-height:0;padding:48px 0 52px;margin:0 auto;background:none}
.login-page .login-brand{text-align:left;padding:0 0 5px}
.login-page .login-brand .eyebrow{margin:0 0 24px;color:var(--brand-dark);font-size:14px;font-weight:750;line-height:1.5;letter-spacing:.13em}
.login-page .login-brand h1{margin:0;font-size:clamp(45px,4.4vw,70px);font-weight:800;line-height:1.33;letter-spacing:-.055em;color:#2f2823;word-break:keep-all}
.login-page .login-brand .login-description{margin-top:34px;max-width:550px;color:#6e7580;font-size:clamp(17px,1.7vw,24px);font-weight:450;line-height:1.7;letter-spacing:-.035em;word-break:keep-all}
.login-page .login-brand .login-features{margin-top:43px;color:#8c929b;font-size:16px;font-weight:500;line-height:1.7;letter-spacing:.005em;word-break:keep-all}
.login-page .login-card{width:100%;max-width:none;padding:43px 46px 35px;border-color:#e3dcd3;border-radius:19px;box-shadow:0 10px 34px #58423006}
.login-page .login-card>.eyebrow{margin:0 0 11px;font-size:15px;color:var(--brand-dark);line-height:1.5;font-weight:750;letter-spacing:-.025em}
.login-page .login-card h2{margin:0;color:#2f2823;font-size:48px;line-height:1.2;font-weight:800;letter-spacing:-.045em}
.login-page .login-card>.subtitle{margin:12px 0 31px;color:#707783;font-size:18px;line-height:1.6;letter-spacing:-.025em;word-break:keep-all}
.login-page .login-card .form-field{gap:9px;margin-top:24px}
.login-page .login-card .form-field:first-child{margin-top:0}
.login-page .login-card label.form-field[for]{display:block;margin-bottom:8px}
.login-page .login-card .form-field>span{font-size:15px;font-weight:700;line-height:1.5}
.login-id-control{display:flex;align-items:stretch;min-width:0;min-height:54px;border:1px solid #d7d9dd;border-radius:8px;background:white;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.login-id-control:focus-within{border-color:#b18e6f;box-shadow:0 0 0 3px #9a735216}
.login-page .login-card .login-id-control>input.input{flex:1;width:0;min-width:0;min-height:54px;padding:13px 17px;border:0;border-radius:0;background:transparent;font-size:17px;line-height:1.5;font-weight:500}
.login-page .login-card .login-id-control>input.input:focus{box-shadow:none;outline:none}
.login-domain{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding:12px 17px;border-left:1px solid #d7d9dd;background:#f7f5f2;color:#413d39;font-size:15px;line-height:1.5;white-space:nowrap}
.login-page #login-id-hint{margin:8px 0 0;color:#8b9099;font-size:12px;line-height:1.6}
.password-control{position:relative;min-width:0}
.login-page .login-card .password-control>input.input{min-height:54px;padding:13px 58px 13px 17px;font-size:17px;line-height:1.5;border-color:#d7d9dd}
.password-toggle{appearance:none;position:absolute;top:50%;right:7px;display:grid;place-items:center;width:40px;height:40px;padding:8px;border:0;border-radius:6px;background:transparent;color:#666a6e;transform:translateY(-50%)}
.password-toggle:hover:not(:disabled){background:#f2eeea;color:var(--brand-dark)}
.password-toggle .icon{width:21px;height:21px;stroke-width:1.7}
.login-page .login-card .login-submit{position:relative;justify-content:center;gap:10px;width:100%;min-height:56px;padding:14px 49px;margin-top:28px;border-radius:8px;font-size:17px;font-weight:700;letter-spacing:-.025em}
.login-submit>.icon{position:absolute;right:20px;width:21px;height:21px}
.login-page .login-card .login-footer{margin:19px 0 0;max-width:none;color:#8a9099;text-align:left;font-size:12px;line-height:1.7;word-break:keep-all}
.login-page .error-message{margin:13px 0 0}
.login-page-footer{padding:9px 24px 22px;text-align:center;color:#9097a0;font-size:11px;line-height:1.7}
.login-page-footer p+p{margin-top:2px}

.load-error{width:min(100%,680px);margin:clamp(35px,8vh,100px) auto;padding:35px 38px;box-shadow:0 7px 28px #352e2906}
.load-error>.eyebrow{display:block;margin-bottom:12px}
.load-error>.page-title{margin:0 0 17px;font-size:29px;line-height:1.4;word-break:keep-all}
.load-error>p{margin:0 0 12px;color:#726a61;font-size:14px;line-height:1.8;word-break:keep-all;overflow-wrap:anywhere}
.load-error>p.hint{margin-bottom:0;color:var(--muted);font-size:12px}
.load-error>.actions{margin-top:25px;gap:10px;flex-wrap:wrap}
.load-error>.actions>.button{min-width:122px}

/* Shared request state: also works when #processing is a top-layer popover. */
body.is-processing,body.is-processing *{cursor:progress!important}
.processing-layer{position:fixed;inset:0;z-index:2147483000;display:grid;place-items:center;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:20px;border:0;background:#f7f5f12e;color:var(--ink);pointer-events:auto;overscroll-behavior:contain}
.processing-layer:popover-open{display:grid}
.processing-layer::backdrop{background:transparent}
.processing-surface{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:15px;width:min(100%,350px);padding:21px 23px;border:1px solid #e4dcd2;border-radius:14px;background:#fffffff7;box-shadow:0 12px 45px #352e2912;backdrop-filter:blur(8px)}
.processing-surface>.spinner{width:22px;height:22px;border-width:2px}
#processing-label{display:block;color:var(--ink);font-size:14px;font-weight:750;line-height:1.6;letter-spacing:-.025em}
#processing-note{margin:3px 0 0;color:var(--muted);font-size:11px;line-height:1.6;word-break:keep-all}
.processing-track{position:fixed;top:0;right:0;left:0;z-index:1;height:3px;overflow:hidden;background:#e9dfd54d}
.processing-track>span{display:block;width:30%;height:100%;background:var(--brand);border-radius:0 4px 4px 0;animation:processing-progress 1.25s ease-in-out infinite}
.button-spinner{display:inline-block;flex:0 0 auto;width:15px;height:15px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:spin .7s linear infinite}
.button-label{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-width:0}
.button[aria-busy=true]{cursor:progress}
@keyframes processing-progress{0%{transform:translateX(-110%)}100%{transform:translateX(440%)}}
@media(min-width:1101px){
  .login-page .login-shell{width:min(calc(100% - 160px),1440px);grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:80px;padding:48px 0 44px}
  .login-page .login-brand .eyebrow{font-size:17px;line-height:1.5;margin-bottom:27px;letter-spacing:.1em}
  .login-page .login-brand h1{font-size:clamp(52px,calc(5.6vw - 9.6px),80px);line-height:1.25;letter-spacing:-.055em}
  .login-page .login-brand .login-description{font-size:clamp(20px,1.65vw,26px);line-height:1.7;margin-top:36px;max-width:none}
  .login-page .login-brand .login-features{font-size:20px;line-height:1.7;margin-top:46px}
  .login-page .login-card{padding:50px 54px 42px;border-radius:20px}
  .login-page .login-card>.eyebrow{font-size:17px;line-height:1.4;margin-bottom:10px}
  .login-page .login-card h2{font-size:clamp(50px,4.1vw,66px);line-height:1.12;letter-spacing:-.045em}
  .login-page .login-card>.subtitle{font-size:clamp(18px,1.4vw,23px);line-height:1.5;margin:10px 0 25px}
  .login-page .login-card .form-field{margin-top:22px}
  .login-page .login-card .form-field:first-child{margin-top:0}
  .login-page .login-card .form-field>span{font-size:19px;line-height:1.4}
  .login-page .login-card label.form-field[for]{margin-bottom:8px}
  .login-page .login-id-control{min-height:66px;border-radius:9px}
  .login-page .login-card .login-id-control>input.input{min-height:64px;padding:16px 22px;font-size:20px;line-height:1.5;font-weight:500}
  .login-page .login-domain{padding:15px 21px;font-size:20px;line-height:1.5}
  .login-page #login-id-hint{font-size:13px;line-height:1.6;margin:8px 0 0}
  .login-page .login-card .password-control>input.input{min-height:66px;padding:16px 64px 16px 22px;font-size:20px;line-height:1.5;border-radius:9px}
  .login-page .password-toggle{width:47px;height:47px;right:12px}
  .login-page .password-toggle .icon{width:25px;height:25px}
  .login-page .login-card .login-submit{min-height:68px;padding:17px 60px;margin-top:28px;font-size:22px;line-height:1.35;border-radius:9px}
  .login-page .login-submit>.icon{width:26px;height:26px;right:25px}
  .login-page .login-card .login-footer{font-size:13px;line-height:1.6;margin-top:20px}
}
@media(max-width:1100px){
  .login-page .login-shell{width:calc(100% - 72px);gap:48px;grid-template-columns:minmax(0,.95fr) minmax(0,1.15fr)}
  .login-page .login-brand h1{font-size:44px}
  .login-page .login-brand .login-description{font-size:18px;margin-top:26px}
  .login-page .login-brand .login-features{font-size:13px;margin-top:31px}
  .login-page .login-card{padding:34px 29px 29px}
  .login-page .login-card h2{font-size:41px}
  .login-page .login-card>.subtitle{font-size:16px;margin-bottom:27px}
  .login-domain{font-size:13px;padding-right:13px;padding-left:13px}
}
@media(max-width:900px){
  .login-header{min-height:77px;padding:20px 28px}
  .login-header .brand{gap:18px}
  .login-header .brand-word{font-size:29px}
  .login-header .brand-team{font-size:18px}
  .login-header .brand-divider{height:23px}
  .login-page .login-shell{grid-template-columns:1fr;width:min(calc(100% - 48px),520px);gap:31px;padding:28px 0 38px}
  .login-page .login-brand .eyebrow{font-size:11px;margin-bottom:15px}
  .login-page .login-brand h1{font-size:39px;line-height:1.3}
  .login-page .login-brand .login-description{font-size:16px;line-height:1.7;margin-top:19px}
  .login-page .login-brand .login-features{font-size:12px;margin-top:21px}
  .login-page .login-card{padding:31px 29px 28px}
  .login-page .login-card h2{font-size:36px}
  .login-page .login-card>.eyebrow{font-size:12px;margin-bottom:9px}
  .login-page .login-card>.subtitle{font-size:15px;margin:10px 0 25px}
  .login-page .login-card .form-field>span{font-size:13px}
  .login-id-control,.login-page .login-card .login-id-control>input.input,.login-page .login-card .password-control>input.input{min-height:51px}
  .login-page .login-card .login-id-control>input.input,.login-page .login-card .password-control>input.input{font-size:15px}
  .login-domain{font-size:13px;padding:11px 13px}
  .login-page .login-card .login-submit{min-height:52px;font-size:15px;margin-top:25px}
  .login-page .login-card .login-footer{font-size:11px;margin-top:18px}
}
@media(max-width:420px){
  .login-header{min-height:70px;padding:17px 20px}
  .login-header .brand-word{font-size:27px}
  .login-header .brand-team{font-size:16px}
  .login-header .brand-divider{height:20px}
  .login-page .login-shell{width:calc(100% - 32px);gap:27px;padding:24px 0 30px}
  .login-page .login-brand{padding:0 6px}
  .login-page .login-brand h1{font-size:35px}
  .login-page .login-brand .login-description{font-size:14px;margin-top:17px}
  .login-page .login-brand .login-features{font-size:11px;margin-top:18px}
  .login-page .login-card{padding:27px 22px 25px;border-radius:15px}
  .login-page .login-card h2{font-size:32px}
  .login-page .login-card>.subtitle{font-size:13px;margin-bottom:23px}
  .login-page .login-card .login-id-control>input.input{padding:12px 11px;font-size:14px}
  .login-domain{padding-right:10px;padding-left:10px;font-size:11.5px}
  .login-page #login-id-hint{font-size:10px}
  .login-page .login-card .form-field{margin-top:21px}
  .login-page .login-card .form-field:first-child{margin-top:0}
  .processing-surface{padding:18px 20px;width:min(100%,315px);gap:12px}
  .login-page-footer{font-size:10px;padding-bottom:18px}
  .load-error{margin:30px auto;padding:27px 23px}
  .load-error>.page-title{font-size:24px;margin-bottom:14px}
  .load-error>p{font-size:13px}
  .load-error>.actions{margin-top:21px}
  .load-error>.actions>.button{flex:1;min-width:100px}
}
@media(prefers-reduced-motion:reduce){
  .processing-track>span{animation:none!important;width:100%;opacity:.72;transform:none}
  .button-spinner,.processing-surface>.spinner{animation:none!important}
}

.deleted-members{margin-top:24px;padding:15px 19px;border:1px solid #e6dfd6;border-radius:8px;color:#a08c79;font-size:11px;background:#f6f2ed}.deleted-members summary{cursor:pointer}.deleted-members>div{margin-top:12px}.deleted-member-row{display:flex;align-items:center;gap:10px;padding:12px 0;border-top:1px solid #e9e0d5}.deleted-member-row>span:not(.avatar){flex:1}.deleted-member-row strong{display:block;font-size:12px;color:#89705b}.deleted-member-row small{display:block;font-size:10px;color:#b39c88}.task-card.is-selected{border-color:#a47b56;box-shadow:0 0 0 1px #a47b5633}
.drawer-quick-actions{display:flex;gap:8px;margin-top:20px}.drawer-quick-actions .button{flex:1;min-width:0;font-size:10px;border-color:#e0d8d0;color:#85715f;padding:8px 7px;min-height:34px}.drawer-quick-actions .icon{width:13px;height:13px}

/* Approved reference: docs/design/approved-kanban.png, native 1586 × 992.
   Keep the board and reading-first drawer at the reference's geometry. */
@font-face {
  font-family: Pretendard;
  src: url('/fonts/PretendardVariable.woff2') format('woff2');
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}
:root {
  --bg: #f8f7f5;
  --surface: #fff;
  --ink: #191b1f;
  --muted: #777b7e;
  --line: #e5e2de;
  --brand: #9d7555;
  --brand-dark: #805b40;
  --drawer-width: 446px;
}
[hidden] { display: none !important; }
body { font-family: Pretendard, -apple-system, BlinkMacSystemFont, sans-serif; color: var(--ink); }
.workspace { grid-template-columns: 198px minmax(0, 1fr); background: var(--bg); }
.sidebar { width: 198px; padding: 18px 10px 16px; background: #f8f7f4; border-color: #e9e6e2; }
.workspace-brand { margin: 0 10px 28px; padding: 0; }
.workspace-brand > span { font-size: 30px; font-weight: 750; line-height: 37px; letter-spacing: -.035em; color: #967050; }
.workspace-brand small { margin-top: 0; font-size: 14px; line-height: 20px; color: #646566; }
.sidebar-nav { gap: 8px; }
.sidebar-nav a { padding: 12px; min-height: 44px; font-size: 14px; line-height: 20px; gap: 12px; font-weight: 550; border-radius: 6px; }
.sidebar-nav a.active { background: #eae5df; color: #4c3c2f; }
.sidebar-nav a .icon { width: 19px; height: 19px; }
.sidebar-nav a:last-child { margin-top: 24px; padding-top: 25px; border-color: #e6e2dc; border-radius: 0; }
.sidebar-account { margin-top: auto; display: flex; align-items: center; padding: 14px 10px 0; border-top: 1px solid #e8e4de; gap: 5px; }
.sidebar-profile { display: flex; flex: 1; align-items: center; gap: 10px; text-align: left; border: 0; background: none; padding: 0; color: #292b2d; min-width: 0; }
.sidebar-profile > span:last-child { font-size: 14px; font-weight: 600; line-height: 21px; }
.sidebar-profile small { display: block; font-size: 12px; font-weight: 400; color: #909294; line-height: 16px; }
.sidebar-profile .avatar { width: 36px; height: 36px; font-size: 16px; background: #e8e0d7; color: #5f5146; }
.sidebar-logout { opacity: 1; visibility: visible; flex: 0 0 30px; width: 30px; height: 32px; min-height: 32px; padding: 5px; border-radius: 5px; }
.sidebar-account:hover .sidebar-logout, .sidebar-logout:focus-visible { opacity: 1; }
.workspace-header { height: 68px; padding: 14px 26px; border: 0; background: #faf9f7; gap: 24px; }
.global-search { width: 625px; max-width: calc(100% - 165px); flex: 0 1 625px; min-height: 42px; padding: 0 13px; border: 1px solid #dcdedc; border-radius: 7px; background: white; gap: 12px; position: relative; }
.global-search input { font-size: 14px; min-height: 40px !important; padding: 9px 0 !important; color: #4c5156; }
.global-search input::placeholder { color: #8e9296; }
.global-search > .icon { width: 18px; height: 18px; color: #73777c; }
.search-filters { position: static; }
.search-filters > summary { list-style: none; color: #9a9da0; cursor: pointer; padding: 3px; }
.search-filters > summary::-webkit-details-marker { display: none; }
.search-filters > summary .icon { width: 16px; height: 16px; }
.search-filter-panel { position: absolute; right: 0; top: 48px; z-index: 32; width: 260px; display: grid; gap: 14px; padding: 16px; border: 1px solid var(--line); border-radius: 8px; background: white; box-shadow: 0 8px 24px #29221a12; }
.search-filter-panel label { display: grid; gap: 7px; font-size: 13px; }
.search-filter-panel select { min-height: 35px; font-size: 13px; }
.search-filter-panel .board-tabs { width: 100%; }
.search-filter-panel .board-tabs .button { flex: 1; }
#workspace-date { font-size: 14px; white-space: nowrap; line-height: 20px; color: #35393c; }
.workspace-content { padding: 12px 24px 24px; max-width: none; }
.page-head { align-items: center; min-height: 71px; margin: 0 0 16px; }
.page-title { font-size: 36px; line-height: 44px; letter-spacing: -.05em; font-weight: 760; color: #111317; }
.subtitle { margin-top: 4px; font-size: 16px; line-height: 23px; color: #74787c; }
.personal-overview { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); min-height: 84px; height: 84px; margin: 0 0 17px; padding: 14px 20px; border-color: #e6e3df; background: white; border-radius: 8px; }
.personal-identity { min-width: 0; display: flex; align-items: center; gap: 22px; padding: 0 22px 0 0; margin: 0; border: 0; }
.personal-identity .avatar { width: 43px; height: 43px; font-size: 21px; color: #62534a; background: #ebe5df; }
.personal-identity strong { font-size: 18px; line-height: 24px; font-weight: 650; white-space: nowrap; }
.personal-identity strong span { font: inherit; color: inherit; display: inline; }
.personal-identity small { display: flex; align-items: center; gap: 4px; margin-top: 3px; font-size: 12px; line-height: 17px; color: #939699; font-weight: 400; white-space: nowrap; }
.personal-identity small .icon { width: 13px; height: 13px; }
.metric-card { border: 0; border-left: 1px solid #e9e7e3; padding: 0 13px; min-height: 44px; gap: 12px; justify-content: center; flex-wrap: nowrap; }
.metric-dot { width: 11px; height: 11px; border-radius: 50%; flex-shrink: 0; }
.metric-dot.direct { background: #559372; }
.metric-dot.review { background: #e5ac39; }
.metric-dot.external { background: #87ade3; }
.metric-card > span:not(.column-dot) { font-size: 15px; line-height: 21px; color: #25292d; }
.metric-card strong { margin-left: 3px; font-size: 20px; line-height: 24px; font-weight: 650; }
.kanban-board { grid-template-columns: repeat(4, minmax(240px, 1fr)); gap: 5px; height: calc(100dvh - 298px); min-height: 480px; overflow-x: auto; padding: 0; align-items: stretch; scrollbar-width: thin; }
.kanban-column { min-width: 0; display: flex; flex-direction: column; background: #f8f7f5; border: 1px solid #e8e5e0; border-radius: 5px; overflow: visible; }
.column-header { height: 45px; min-height: 45px; padding: 0 12px; border: 0; }
.column-header h2 { font-size: 16px; font-weight: 650; line-height: 22px; color: #17191c; gap: 0; }
.column-count { margin-left: 9px; padding: 0; min-width: 0; border: 0; background: none; font-size: 16px; line-height: inherit; color: #444b50; font-weight: 500; }
.column-add { color: #797d7e; padding: 2px; width: 25px; min-height: 27px; }
.column-add .icon { width: 20px; height: 20px; }
.column-cards { display: flex; flex-direction: column; flex: 1; min-height: 0; padding: 0 8px 9px; gap: 8px; overflow-y: auto; scrollbar-width: thin; }
.task-card { display: flex; flex-direction: column; position: relative; min-width: 0; padding: 11px 12px 12px; background: #fff; border: 1px solid #e5e2dd; border-radius: 5px; box-shadow: 0 1px 2px #27201903; }
.task-card:hover { border-color: #c8b8a9; box-shadow: 0 2px 6px #3a2b1d08; transform: none; }
.task-card.owned-card { min-height: 141px; }
.task-card.waiting-card { min-height: 166px; }
.task-card.is-selected { border: 1px solid #a47d5e; min-height: 169px; box-shadow: none; }
.task-card-top { min-height: 22px; padding-right: 21px; margin: 0 0 8px; }
.project-tag { display: inline-flex; align-items: center; font-size: 12px; line-height: 18px; font-weight: 500; padding: 2px 7px; border-radius: 4px; color: #b75858; background: #fbe5e5; max-width: 100%; }
.project-tag.tone-0 { color: #c65858; background: #fbe5e5; }
.project-tag.tone-1 { color: #548568; background: #dfede6; }
.project-tag.tone-2 { color: #577ead; background: #e2e9fb; }
.project-tag.tone-3 { color: #7274be; background: #e9e5fc; }
.task-card h3 { margin: 0; font-size: 14px; line-height: 20px; font-weight: 650; letter-spacing: -.025em; color: #1d2228; }
.task-excerpt { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; margin: 8px 0 0; overflow: hidden; color: #84898e; font-size: 12px; line-height: 18px; min-height: 36px; }
.card-owner { display: flex; gap: 8px; align-items: center; margin: 10px 0 0; font-size: 12px; line-height: 20px; color: #30363b; }
.card-owner .avatar { width: 28px; height: 28px; font-size: 12px; flex-shrink: 0; }
.card-wait-mark { margin-left: auto; color: #b38c5b; display: flex; }
.card-wait-mark .icon { width: 14px; height: 14px; }
.task-card-footer { margin: auto 0 0; padding-top: 14px; display: flex; align-items: center; justify-content: flex-start; gap: 12px; color: #81888d; font-size: 11px; line-height: 17px; min-height: 31px; }
.task-card-footer .icon { width: 14px; height: 14px; flex-shrink: 0; }
.card-comment, .task-card-footer time { display: inline-flex; align-items: center; gap: 5px; white-space: nowrap; }
.task-card-footer time { font-size: 11px; }
.claim-button { margin: 0 0 0 auto; min-height: 35px; height: 35px; padding: 6px 9px; min-width: 74px; border-radius: 4px; background: var(--brand); border: 1px solid var(--brand); color: white; font-size: 13px; line-height: 20px; }
.claim-button:hover { background: var(--brand-dark) !important; color: white; }
.waiting-card .task-card-footer { gap: 8px; }
.card-menu { position: absolute; top: 11px; right: 9px; z-index: 4; }
.card-menu summary { display: flex; list-style: none; color: #969b9f; cursor: pointer; }
.card-menu summary::-webkit-details-marker { display: none; }
.card-menu summary .icon { width: 17px; height: 17px; }
.card-menu[open] { z-index: 25; }
.column-empty { min-height: 110px; padding: 30px 8px; color: #a0a4a7; font-size: 12px; }
body.drawer-open .workspace-main { margin-right: var(--drawer-width); }
.task-drawer { width: var(--drawer-width); height: 100dvh; z-index: 40; border-left: 1px solid #e9e6e1; box-shadow: -4px 0 14px #23232306; }
.drawer-scroll { flex: 1; min-height: 0; overflow-y: auto; scrollbar-width: thin; }
.drawer-header { height: 55px; min-height: 55px; padding: 26px 24px 0; border: 0; align-items: flex-start; color: var(--ink); }
.drawer-header .project-tag { font-size: 13px; padding: 3px 8px; line-height: 20px; }
.drawer-header .icon-button { min-height: 25px; width: 25px; padding: 1px; color: #33393d; }
.drawer-header .icon-button .icon { width: 20px; height: 20px; }
.drawer-content { padding: 14px 24px 0; overflow: visible; flex: none; }
.drawer-content > h2 { margin: 0 0 16px; font-size: 30px; line-height: 36px; font-weight: 750; letter-spacing: -.045em; color: #111317; }
.detail-properties { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; padding-bottom: 16px; border-bottom: 1px solid #e7e7e5; align-items: start; }
.detail-properties > label, .detail-properties > div { display: grid; gap: 6px; min-width: 0; font-size: 13px; line-height: 18px; }
.detail-properties > label > span, .detail-properties > div > span { color: #3c4145; }
.detail-properties select { width: 100%; max-width: none; min-height: 35px; height: 35px; padding: 5px 9px; font-size: 13px; line-height: 20px; background: #fbfcfc; color: #272c31; border-color: #d9dddf; border-radius: 5px; }
.drawer-owner { min-height: 35px; gap: 8px; font-size: 14px; color: #272c31; white-space: nowrap; }
.drawer-owner .avatar { width: 31px; height: 31px; font-size: 14px; }
.detail-plan { display: grid; grid-template-columns: 1fr 1fr; column-gap: 20px; padding: 16px 0 14px; border-bottom: 1px solid #e7e7e5; }
.detail-plan > label, .detail-plan > div { min-width: 0; display: grid; gap: 5px; }
.detail-plan > label > span, .detail-plan > div > span { font-size: 13px; line-height: 18px; color: #30363b; }
.detail-plan > div { border-left: 1px solid #ededeb; padding-left: 18px; }
.detail-date, .detail-effort { display: flex; align-items: center; gap: 7px; min-height: 25px; }
.detail-date .icon, .detail-effort .icon { width: 19px; height: 19px; color: #4c5259; flex-shrink: 0; }
.detail-date input { min-height: 25px; padding: 0; border: 0; font-size: 14px; line-height: 23px; background: none; color: #22282c; width: 140px; }
.detail-date input::-webkit-calendar-picker-indicator { display: none; }
.detail-effort strong { font-size: 15px; font-weight: 500; white-space: nowrap; }
.text-button { min-height: 22px; margin-left: auto; padding: 0; border: 0; background: none; font-size: 12px; color: #6686c4; text-decoration: underline; border-radius: 0; }
.drawer-request { position: relative; margin-top: 14px; }
.drawer-content h3 { font-size: 14px; line-height: 20px; margin: 0; font-weight: 650; color: #22272d; }
.task-description { margin-top: 6px; color: #53595f; font-size: 14px; line-height: 22px; white-space: pre-wrap; overflow-wrap: anywhere; }
.request-edit { position: absolute; right: 0; top: -2px; padding: 0; min-height: 22px; font-size: 11px; border: 0; background: white; color: #82898f; opacity: 0; }
.drawer-request:hover .request-edit, .request-edit:focus-visible { opacity: 1; }
.drawer-checklist { margin-top: 16px; }
.checklist-items { margin: 10px 0 0; gap: 8px; }
.checklist-item { gap: 8px; color: #5e646a; font-size: 13px; line-height: 20px; min-height: 20px; align-items: center; }
.checklist-item input { margin: 0; width: 17px; height: 17px; accent-color: #a8aaad; }
.checklist-item:has(input:checked) > span { text-decoration: none; color: #6f747a; }
.quick-actions { display: flex; gap: 12px; margin-top: 14px; }
.quick-actions .button { flex: 1; min-height: 40px; padding: 7px 9px; font-size: 13px; line-height: 20px; color: #343b43; border: 1px solid #dcdfe1; background: white; border-radius: 5px; }
.quick-actions .icon { width: 18px; height: 18px; }
#task-detail-form > .error-message:empty { display: none; }
#task-detail-form .detail-save { margin-top: 10px; min-height: 32px; font-size: 12px; }
.drawer-estimate { position: relative; border: 1px solid #e8e9e9; border-radius: 6px; padding: 12px 14px 10px; margin: 18px -6px 0; }
.drawer-estimate h3 { font-size: 16px; line-height: 22px; }
.opinion-kind { position: absolute; right: 12px; top: 12px; width: 19px; min-height: 20px; height: 20px; padding: 0; border: 0; color: transparent; background: none; font-size: 12px; cursor: pointer; }
.opinion-kind option { color: #222; background: white; }
.estimate-opinion-row { margin-top: 14px; display: flex; align-items: flex-start; gap: 14px; min-height: 40px; }
.draft-effort { min-width: 118px; display: grid; gap: 4px; }
.draft-effort span, .proposed-effort > span { font-size: 13px; line-height: 18px; color: #3b4148; }
.draft-effort strong { font-size: 15px; line-height: 19px; font-weight: 500; }
.proposed-effort { display: flex; align-items: center; gap: 7px; margin-left: auto; min-height: 28px; }
.proposed-effort input { width: 55px; min-height: 29px; height: 29px; padding: 3px 8px; font-size: 14px; line-height: 21px; border-color: #d8dde0; border-radius: 5px; }
#comment-form textarea { margin-top: 12px; min-height: 54px; height: 54px; padding: 7px 9px; font-size: 13px; line-height: 20px; border: 1px solid #dadddf; border-radius: 4px; background: white; resize: none; color: #4f565f; }
.opinion-length { text-align: right; font-size: 11px; line-height: 14px; height: 14px; color: #9298a0; }
#comment-form .error-message:empty { display: none; }
.opinion-submit { margin-top: 2px; padding: 5px 10px; height: 35px; min-height: 35px; border: 1px solid #b7967e; border-radius: 4px; color: #9a7050; font-size: 13px; line-height: 21px; background: white; }
.opinion-hint { display: flex; gap: 6px; align-items: flex-start; margin-top: 10px; color: #a0a5ab; font-size: 11px; line-height: 16px; }
.opinion-hint .icon { width: 14px; height: 14px; flex-shrink: 0; }
.drawer-activity { margin: 18px 0 10px; }
.activity-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 9px; }
.activity-heading h3 { font-size: 16px; line-height: 22px; }
.activity-more { padding: 0; border: 0; background: none; color: #8b929a; font-size: 10px; }
.activity-item { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; min-height: 28px; font-size: 12px; line-height: 18px; color: #5a626b; }
.activity-item .avatar { width: 28px; height: 28px; font-size: 12px; background: #efe7de; color: #6a5c4c; flex-shrink: 0; }
.activity-item p { flex: 1; font-size: 12px; line-height: 18px; color: inherit; }
.activity-item time { margin-left: auto; font-size: 10px; line-height: 16px; color: #929aa3; white-space: nowrap; }
.activity-history { padding-top: 10px; border-top: 1px solid #eeefef; }
.activity-history .comment-item { margin: 8px 0; font-size: 12px; }
.drawer-footer { min-height: 101px; height: 101px; padding: 10px 18px 12px; display: flex; flex-direction: column; flex-wrap: nowrap; justify-content: flex-start; gap: 12px; box-shadow: none; border-top: 1px solid #efeeec; }
.drawer-footer > .button.primary { min-height: 40px; height: 40px; width: 100%; padding: 8px 12px; font-size: 14px; line-height: 22px; border-radius: 4px; background: #9c7453; }
.drawer-footer > .button.subtle { min-height: 20px; height: 20px; padding: 0; font-size: 12px; color: #aa8060; text-decoration: underline; line-height: 20px; }
#toast { gap: 12px; bottom: 28px; padding: 13px 15px; font-size: 13px; line-height: 21px; border-radius: 8px; background: #2c2d2d; }
.toast-status { width: 21px; height: 21px; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: #85c2a6; color: #355f4e; flex-shrink: 0; }
.toast-status .icon { width: 15px; height: 15px; }
#toast .toast-undo { color: #cbb397; border: 0; border-left: 1px solid #ffffff23; border-radius: 0; padding-left: 11px; font-size: 12px; }
.toast-close { border: 0; padding: 1px; min-height: 22px; width: 22px; color: #ddd; background: transparent; }
.toast-close .icon { width: 16px; height: 16px; }
@media (min-width: 1800px) {
  .workspace-content { padding: 12px 24px 24px; }
  .kanban-board { gap: 5px; }
  .column-cards { padding: 0 8px 9px; gap: 8px; }
  .column-header { height: 45px; }
  .column-header h2 { font-size: 16px; }
  .task-card { padding: 11px 12px 12px; }
  .task-card h3 { font-size: 14px; }
  .task-excerpt { font-size: 12px; }
  .project-tag { font-size: 12px; }
  .card-owner { font-size: 12px; }
  .task-card-footer { margin-top: auto; }
}
@media (max-width: 1100px) {
  .workspace { grid-template-columns: 168px minmax(0, 1fr); }
  .sidebar { width: 168px; }
  .workspace-header { padding: 14px 20px; }
  .workspace-content { padding-left: 20px; padding-right: 20px; }
  .personal-overview { grid-template-columns: 1.5fr repeat(3, 1fr); padding: 12px; }
  .personal-identity { gap: 12px; padding-right: 12px; }
  .personal-identity strong { font-size: 15px; }
  .metric-card { padding: 0 8px; gap: 7px; }
  .metric-card > span:not(.column-dot) { font-size: 13px; }
  .metric-card strong { font-size: 17px; }
  #workspace-date { font-size: 12px; }
}
@media (max-width: 850px) {
  .workspace { grid-template-columns: 70px minmax(0, 1fr); }
  .sidebar { width: 70px; padding: 20px 7px; }
  .workspace-brand { margin: 0 0 24px; text-align: center; }
  .workspace-brand > span { font-size: 18px; }
  .workspace-brand small, .sidebar-nav a > span, .sidebar-account { display: none; }
  .sidebar-nav a { justify-content: center; padding: 12px 4px; }
  .global-search { max-width: 100%; width: 100%; flex: 1; }
  #workspace-date { display: none; }
  .personal-overview { grid-template-columns: repeat(3, 1fr); height: auto; min-height: 106px; }
  .personal-identity { grid-column: 1 / -1; border-bottom: 1px solid #eee; padding-bottom: 10px; margin-bottom: 9px; }
  .personal-identity strong { font-size: 16px; }
  .personal-identity .avatar { width: 35px; height: 35px; font-size: 17px; }
  .personal-identity small { font-size: 11px; }
  .metric-card { border-left: 0; min-height: 26px; }
  .metric-card + .metric-card { border-left: 1px solid #eee; }
  body.drawer-open .workspace-main { margin-right: 0; }
  .task-drawer { width: min(var(--drawer-width), 100vw); box-shadow: -8px 0 28px #29221910; }
}
@media (max-width: 550px) {
  .workspace { grid-template-columns: 1fr; padding-bottom: 61px; }
  .sidebar { inset: auto 0 0; width: 100%; height: 61px; padding: 0 8px; }
  .workspace-brand, .sidebar-account { display: none; }
  .sidebar-nav { height: 61px; flex-direction: row; gap: 4px; }
  .sidebar-nav a { font-size: 10px; padding: 6px 4px; gap: 3px; flex: 1; }
  .sidebar-nav a > span { display: block; font-size: 10px; }
  .sidebar-nav a:last-child { margin: 0; padding: 6px 4px; border: 0; }
  .workspace-main { grid-column: 1; }
  .workspace-header { height: 60px; padding: 10px 14px; }
  .global-search { min-height: 38px; }
  .global-search input { font-size: 13px; min-height: 36px !important; }
  .workspace-content { padding: 15px 13px; }
  .page-head { min-height: 69px; margin-bottom: 14px; }
  .page-title { font-size: 28px; line-height: 36px; }
  .subtitle { font-size: 12px; line-height: 19px; max-width: none; }
  .personal-overview { min-height: 109px; margin-bottom: 16px; }
  .metric-card > span:not(.column-dot) { font-size: 11px; }
  .metric-card strong { font-size: 16px; }
  .kanban-board { grid-template-columns: repeat(4, 245px); height: calc(100dvh - 300px); min-height: 420px; gap: 6px; }
  .column-header h2 { font-size: 15px; }
  .task-card h3 { font-size: 14px; }
  .task-excerpt { font-size: 12px; }
  .task-drawer { inset: 0; width: 100%; height: 100dvh; z-index: 45; }
  .drawer-header { padding: 18px 20px 0; height: 48px; min-height: 48px; }
  .drawer-content { padding: 12px 20px 0; }
  .drawer-content > h2 { font-size: 26px; line-height: 33px; }
  .detail-properties { gap: 9px; }
  .detail-properties select { padding: 5px; font-size: 12px; }
  .drawer-owner { gap: 5px; font-size: 12px; }
  .drawer-owner .avatar { width: 26px; height: 26px; font-size: 12px; }
  .detail-plan { column-gap: 12px; }
  .detail-plan > div { padding-left: 12px; }
  .detail-date input { width: 125px; font-size: 13px; }
  .detail-effort { gap: 4px; }
  .detail-effort strong { font-size: 14px; }
  .text-button { font-size: 11px; }
  .task-description { font-size: 13px; line-height: 21px; }
  .quick-actions .button { font-size: 12px; }
  .draft-effort { min-width: 95px; }
  .proposed-effort { gap: 5px; }
  .proposed-effort input { width: 48px; }
  .drawer-footer { min-height: 100px; height: 100px; padding-bottom: max(12px, env(safe-area-inset-bottom)); }
  #toast { max-width: calc(100vw - 24px); font-size: 12px; bottom: 75px; }
  .toast-status { width: 18px; height: 18px; }
}
/* Native controls retain accessible semantics while matching the reference. */
.personal-identity strong [data-testid="my-total-count"] {
  display: inline;
  color: inherit;
  font: inherit;
  line-height: inherit;
  margin: 0;
}
.task-drawer .detail-date { position: relative; min-width: 0; height: 25px; }
.task-drawer .detail-date .formatted-date { font-size: 14px; line-height: 25px; white-space: nowrap; color: #292e34; }
.task-drawer .detail-date input[type="date"] {
  position: absolute; inset: 0; opacity: 0; width: 100%; height: 25px;
  min-height: 25px; border: 0; padding: 0; background: none; cursor: pointer;
}
.task-drawer .detail-date:focus-within { outline: 1px solid #b6967a; outline-offset: 3px; border-radius: 3px; }
.proposed-effort { white-space: nowrap; flex-shrink: 0; }
.task-drawer .proposed-effort input[type="number"] {
  flex: 0 0 55px; width: 55px; min-width: 55px; min-height: 29px;
  height: 29px; padding: 3px 8px; font-size: 14px; line-height: 21px;
  border: 1px solid #d8dde0; border-radius: 5px; background: white;
}
.task-drawer .checklist-item input[type="checkbox"] {
  appearance: none; position: relative; flex: 0 0 17px; width: 17px;
  height: 17px; border: 1.5px solid #bdc2c8; border-radius: 3px;
  background: #fff; cursor: pointer; opacity: 1;
}
.task-drawer .checklist-item input[type="checkbox"]:checked::after {
  content: ''; position: absolute; width: 5px; height: 9px; top: 1px; left: 5px;
  border: solid #a6adb4; border-width: 0 1.7px 1.7px 0; transform: rotate(45deg);
}
.task-drawer .checklist-item input[type="checkbox"]:focus-visible { outline: 2px solid #b59376; outline-offset: 2px; }
.sidebar { padding-left: 12px; padding-right: 12px; }
.workspace-brand { margin-left: 12px; margin-right: 8px; }
.workspace-brand > span { font-size: 33px; line-height: 37px; }
.sidebar-account { padding-left: 12px; padding-right: 8px; }
body.drawer-open .workspace-content { padding-right: 7px; }
.task-card.owned-card, .task-card.is-selected { min-height: 140px; }
.task-card.waiting-card { min-height: 164px; }
.task-card-footer { padding-top: 10px; }
.task-card h3 { font-weight: 700; }
.task-excerpt { color: #7c8288; }
.project-tag.tone-3 { color: #577ead; background: #e2e9fb; }
.project-tag.tone-4 { color: #7274be; background: #e9e5fc; }
.activity-item p { font-size: 13px; }
.workspace-main { transition: none; }
.personal-overview { grid-template-columns: minmax(0, 1.6fr) repeat(3, minmax(0, 1fr)); }
.metric-card { min-width: 0; }
.owned-card .task-card-footer { min-height: 27px; }
.claim-button { width: 74px; flex: 0 0 74px; }
@media (max-width: 550px) {
  .sidebar { padding: 0 8px; }
  body.drawer-open .workspace-content { padding-right: 13px; }
  .task-drawer .proposed-effort input[type="number"] { flex-basis: 48px; width: 48px; min-width: 48px; }
  .task-drawer .detail-date .formatted-date { font-size: 12px; }
}

/* Approved Kanban structure and day/week/month period controls, 2026-10-29.
   Columns stay compact and never resize when the detail overlay opens. */
:root { --drawer-width: 420px; }
.workspace-body { font-size: 14px; }
.workspace { grid-template-columns: 192px minmax(0, 1fr); }
.workspace-main { container: workspace / inline-size; min-width: 0; }
.sidebar { width: 192px; padding: 18px 10px 16px; background: #faf9f7; }
.workspace-brand { margin: 0 10px 28px; }
.workspace-brand > span { font-size: 30px; line-height: 36px; font-weight: 760; }
.workspace-brand small { font-size: 12px; line-height: 18px; }
.sidebar-nav { gap: 8px; }
.sidebar-nav a { min-height: 44px; padding: 10px 12px; font-size: 14px; line-height: 20px; gap: 12px; }
.sidebar-nav a .icon { width: 19px; height: 19px; flex-shrink: 0; }
.sidebar-nav a:last-child { margin-top: 24px; padding-top: 24px; }
.sidebar-account { padding: 14px 10px 0; }
.sidebar-profile { gap: 10px; }
.sidebar-profile > span:last-child { flex: 1; min-width: 0; font-size: 13px; line-height: 20px; }
.sidebar-user-name { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: inherit; font-weight: 600; }
.sidebar-profile small { font-size: 11px; line-height: 17px; }
.sidebar-profile .avatar { width: 36px; height: 36px; font-size: 16px; flex-shrink: 0; }
.workspace-header { height: 64px; padding: 11px 24px; gap: 20px; background: #faf9f7; }
.global-search { width: 520px; flex: 0 1 520px; min-width: 0; max-width: calc(100% - 176px); min-height: 38px; padding: 0 12px; gap: 10px; }
.global-search input { min-height: 36px !important; padding: 7px 0 !important; font-size: 13px; }
.global-search > .icon { width: 18px; height: 18px; flex-shrink: 0; }
#workspace-date { font-size: 13px; line-height: 20px; }
.workspace-content, .workspace-content:has(#board), body.drawer-open .workspace-content { padding: 20px 24px 26px; }
.page-head, .workspace-content:has(#board) .page-head { min-height: 64px; margin: 0 0 16px; align-items: flex-start; gap: 16px; }
.page-head > div:first-child { min-width: 0; }
.page-title, .workspace-content:has(#board) .page-title { font-size: 30px; line-height: 38px; font-weight: 750; }
.subtitle, .workspace-content:has(#board) .subtitle { margin-top: 4px; font-size: 14px; line-height: 21px; color: #737e8a; overflow-wrap: anywhere; }
.page-head > .actions { flex: 0 0 auto; }
.workspace-content:has(#board) .page-head > .actions { padding-top: 3px; }
.workspace-content:has(#board) .page-head .primary { min-width: 112px; min-height: 36px; padding: 8px 12px; font-size: 13px; line-height: 20px; border-radius: 6px; background: #956848; }
.workspace-content:has(#board) .page-head .primary .icon { width: 17px; height: 17px; }
.board-toolbar { display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap; min-height: 36px; gap: 10px; margin: 0 0 20px; }
.board-toolbar .board-tabs { display: flex; flex: 0 0 184px; min-width: 0; height: 36px; gap: 2px; padding: 3px; background: white; border: 1px solid #d9dde2; border-radius: 6px; }
.board-toolbar .board-tabs .button { flex: 1; min-width: 0; min-height: 28px; padding: 4px 10px; border: 0; border-radius: 4px; background: transparent; color: #28313b; font-size: 13px; line-height: 20px; white-space: nowrap; }
.board-toolbar .board-tabs .button.active { background: #ebe4dc; color: #885d3b; }
.board-filters { display: flex; align-items: center; flex-wrap: wrap; min-width: 0; gap: 8px; margin: 0; }
.board-filters select { width: 180px; max-width: 100%; min-height: 36px; height: 36px; padding: 7px 27px 7px 10px; font-size: 13px; line-height: 20px; color: #29333e; border: 1px solid #d9dde2; border-radius: 6px; background-color: white; text-overflow: ellipsis; }
.board-filters #assignee-filter { width: 152px; }
.overdue-filter { min-height: 36px; height: 36px; padding: 7px 10px; font-size: 12px; line-height: 20px; color: #a74e2d; border: 1px solid #f0dfe0; background: #fff8f8; border-radius: 6px; font-weight: 550; gap: 7px; white-space: nowrap; }
.overdue-filter::before { content: ''; width: 8px; height: 8px; flex-shrink: 0; border-radius: 50%; background: #ef5657; }
.overdue-filter[aria-pressed="true"] { border-color: #cf7a6b; background: #ffedeb; box-shadow: 0 0 0 1px #cf7a6b26; }
.overdue-filter:hover { background: #fff0ef; }
.reset-filters { font-size: 12px; color: #85684e; white-space: nowrap; }
.kanban-board { display: grid; grid-template-columns: repeat(4, 280px); justify-content: start; gap: 0; height: auto; min-height: 0; padding: 0 0 8px; overflow-x: auto; overflow-y: auto; align-items: stretch; scrollbar-width: thin; }
.kanban-column { display: flex; min-width: 0; flex-direction: column; padding: 0 8px; background: transparent; border: 0; border-left: 1px solid #e8e4df; border-radius: 0; }
.kanban-column:first-child { padding-left: 0; padding-right: 8px; border-left: 0; }
.kanban-column:last-child { padding-right: 0; }
.column-header { display: flex; align-items: center; justify-content: flex-start; gap: 5px; height: 36px; min-height: 36px; padding: 0 1px 8px; }
.column-header h2 { display: flex; align-items: center; gap: 9px; min-width: 0; margin: 0; font-size: 16px; line-height: 24px; font-weight: 650; letter-spacing: -.025em; color: #18212d; white-space: nowrap; }
.column-count { margin: 0; font-size: 14px; line-height: 24px; color: #748092; font-weight: 500; }
.column-header .column-dot { display: inline-block; flex: 0 0 9px; width: 9px; height: 9px; margin: 0; border-radius: 50%; background: #956b4d; }
.active .column-header .column-dot { background: #379d69; }
.review .column-header .column-dot { background: #efb126; }
.completed .column-header .column-dot { background: #6099e5; }
.column-header .help-trigger { margin: 0; }
.column-cards { display: flex; flex: 1; flex-direction: column; min-height: 160px; padding: 0; gap: 10px; overflow: visible; }
.task-card, .task-card.waiting-card, .task-card.owned-card, .task-card.is-selected { min-height: 150px; padding: 12px; border: 1px solid #e4e0db; border-radius: 7px; background: white; box-shadow: none; }
.task-card.owned-card { min-height: 160px; }
.task-card.is-selected { border-color: #a47d5e; box-shadow: 0 0 0 1px #a47d5e26; }
.task-card-top { min-height: 20px; margin: 0 0 7px; padding-right: 23px; min-width: 0; }
.project-tag { display: inline-block; max-width: 100%; vertical-align: middle; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task-card .project-tag { padding: 2px 6px; font-size: 11px; line-height: 17px; border-radius: 4px; }
.task-card h3 { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; margin: 0; font-size: 15px; line-height: 22px; font-weight: 650; letter-spacing: -.025em; color: #19232e; overflow-wrap: anywhere; }
.task-card-meta { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; min-width: 0; gap: 5px 8px; margin: 8px 0 0; color: #7d899a; font-size: 12px; font-weight: 400; line-height: 20px; }
.task-card-meta > span, .task-card-meta time { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; white-space: nowrap; }
.task-card-meta .icon { width: 14px; height: 14px; flex-shrink: 0; }
.task-card-meta .overdue-badge { padding: 1px 4px; color: #d94e4e; background: #ffe7e8; border-radius: 4px; font-size: 11px; line-height: 18px; }
.card-owner { display: flex; align-items: center; min-width: 0; margin-top: 7px; gap: 6px; font-size: 12px; line-height: 20px; }
.card-owner .avatar { width: 22px; height: 22px; font-size: 10px; flex-shrink: 0; }
.owner-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.card-owner .owner-name { flex: 1; }
.card-wait-mark { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 3px; margin-left: auto; font-size: 11px; line-height: 18px; white-space: nowrap; }
.card-wait-mark .icon { width: 12px; height: 12px; flex-shrink: 0; }
.task-card-footer, .owned-card .task-card-footer { display: flex; align-items: center; justify-content: flex-start; gap: 8px; min-height: 36px; margin: auto 0 0; padding-top: 8px; border: 0; color: #7c8a9c; font-size: 12px; line-height: 20px; }
.task-card-footer .icon { width: 16px; height: 16px; flex-shrink: 0; }
.card-comment { gap: 5px; }
.claim-button { flex: 0 0 84px; width: 84px; min-width: 84px; height: 32px; min-height: 32px; margin-left: auto; padding: 5px 10px; border: 1px solid #a17049; border-radius: 5px; background: white; color: #946340; font-size: 12px; line-height: 20px; font-weight: 550; }
.claim-button:hover { background: #f5eee7 !important; color: #805333; }
.card-menu { top: 13px; right: 10px; }
.card-menu summary .icon { width: 16px; height: 16px; color: #63788f; transform: none; }
.card-menu-content { position: fixed; inset: auto; width: 184px; max-width: calc(100vw - 16px); max-height: calc(100dvh - 16px); margin: 0; padding: 5px; overflow-y: auto; border: 1px solid #e3dcd3; border-radius: 7px; background: white; color: var(--ink); box-shadow: 0 5px 18px #30251b20; font-size: 12px; }
.card-menu-content .menu-action { min-height: 32px; padding: 6px 8px; font-size: 12px; line-height: 20px; }
.card-menu-content:not(:popover-open) { display: none; }
.card-menu-content:popover-open { display: flex; }
.card-menu-content::backdrop { background: transparent; pointer-events: none; }
.column-empty { display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; justify-content: center; gap: 6px; height: auto; min-height: 160px; padding: 18px 12px; border: 1px dashed #cdd4dc; border-radius: 7px; color: #8a96a7; text-align: center; overflow-wrap: anywhere; }
.column-empty > .icon { width: 28px; height: 28px; margin-bottom: 8px; color: #ae896c; opacity: 1; flex-shrink: 0; }
.completed .column-empty > .icon { color: #48a470; }
.column-empty strong { display: block; max-width: 100%; font-size: 13px; line-height: 20px; color: #23303f; font-weight: 550; word-break: keep-all; overflow-wrap: anywhere; }
.column-empty p { max-width: 100%; margin: 0; font-size: 12px; line-height: 19px; color: #8996a7; font-weight: 400; word-break: keep-all; overflow-wrap: anywhere; }
.column-cards.drop-target { background: #eee5d940; outline: 2px dashed #b69472; outline-offset: -2px; border-radius: 7px; }
.board-help { display: flex; align-items: flex-start; gap: 8px; margin: 18px 0 0; color: #8391a3; font-size: 12px; line-height: 20px; font-weight: 400; }
.board-help > .icon { width: 16px; height: 16px; margin-top: 2px; flex-shrink: 0; }

/* A fixed overlay at every viewport: opening details never resizes the board. */
body.drawer-open .workspace-main { margin-right: 0; }
.task-drawer { width: min(var(--drawer-width), 100vw); height: 100dvh; max-height: 100dvh; overflow: hidden; }
.drawer-scroll { min-width: 0; min-height: 0; overflow-x: hidden; overflow-y: auto; }
.drawer-header { height: auto; min-height: 48px; padding: 18px 20px 0; align-items: flex-start; gap: 12px; }
.drawer-header .project-tag { display: block; min-width: 0; max-width: calc(100% - 38px); font-size: 11px; line-height: 18px; padding: 2px 6px; }
.drawer-header .icon-button { flex: 0 0 24px; }
.drawer-content { min-width: 0; padding: 12px 20px 18px; }
.drawer-content > h2 { margin-bottom: 16px; font-size: 22px; line-height: 30px; letter-spacing: -.035em; overflow-wrap: anywhere; }
.detail-properties { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.detail-properties > label, .detail-properties > div { min-width: 0; font-size: 12px; }
.detail-properties select { min-width: 0; min-height: 34px; height: 34px; font-size: 12px; padding: 5px 7px; }
.drawer-owner { display: flex; align-items: center; min-width: 0; min-height: 34px; gap: 6px; font-size: 13px; }
.drawer-owner .avatar { width: 28px; height: 28px; font-size: 12px; flex-shrink: 0; }
.detail-plan { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); column-gap: 14px; padding: 14px 0; }
.detail-plan > div { padding-left: 14px; }
.detail-plan > label > span, .detail-plan > div > span { font-size: 12px; }
.detail-date, .detail-effort { min-width: 0; gap: 5px; }
.detail-date .icon, .detail-effort .icon { width: 16px; height: 16px; }
.task-drawer .detail-date .formatted-date { max-width: calc(100% - 21px); overflow: hidden; text-overflow: ellipsis; font-size: 13px; }
.detail-effort { flex-wrap: wrap; }
.detail-effort strong { max-width: 100%; font-size: 13px; }
.detail-effort .text-button { flex: 0 0 auto; margin-left: auto; font-size: 11px; }
.drawer-plan-date { display: block; min-width: 0; padding: 12px 0; font-size: 12px; color: #4e5965; }
.drawer-plan-date > label { display: grid; grid-template-columns: 76px minmax(0, 1fr); align-items: center; gap: 12px; min-width: 0; }
.drawer-plan-date .detail-date { width: min(100%, 214px); height: 34px; min-height: 34px; padding: 5px 9px; border: 1px solid #d9dddf; border-radius: 5px; background: #fff; }
.task-drawer .drawer-plan-date .detail-date input[type="date"] { height: 100%; }
.task-drawer .drawer-plan-date .detail-date .formatted-date { max-width: calc(100% - 21px); line-height: 22px; }
.drawer-content h3, .drawer-estimate h3, .activity-heading h3 { font-size: 14px; line-height: 21px; }
.task-description { font-size: 13px; line-height: 21px; }
.drawer-request .task-description { min-height: 44px; padding: 8px 10px; border: 1px solid #e0e3e6; border-radius: 5px; background: #fff; }
.drawer-checklist .checklist-items > .hint { padding: 8px 10px; border: 1px solid #e0e3e6; border-radius: 5px; background: #f8f9fa; }
.quick-actions { gap: 10px; }
.quick-actions > div { display: flex; align-items: center; gap: 5px; flex: 1; min-width: 0; }
.quick-actions > div > .button { flex: 1; min-width: 0; min-height: 36px; padding: 6px; font-size: 12px; line-height: 20px; white-space: normal; }
.quick-actions .icon { width: 15px; height: 15px; flex-shrink: 0; }
.drawer-estimate { margin: 16px 0 0; padding: 12px; }
.estimate-opinion-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; min-height: 36px; gap: 12px; }
.draft-effort { min-width: 0; }
.draft-effort span, .proposed-effort > span { font-size: 12px; line-height: 18px; }
.draft-effort strong { font-size: 13px; line-height: 20px; }
.proposed-effort { min-width: 0; gap: 5px; margin-left: 0; }
.task-drawer .proposed-effort input[type="number"] { flex-basis: 52px; width: 52px; min-width: 52px; font-size: 13px; }
/* Number and unit are one control. Native radios retain keyboard semantics. */
.drawer-periods { margin: 0; padding: 12px; min-width: 0; border: 1px solid #e5e6e8; border-radius: 6px; background: #fff; }
.drawer-periods > h3 { margin-bottom: 12px; }
.period-heading { display: flex; align-items: center; justify-content: space-between; min-width: 0; gap: 10px; margin-bottom: 10px; }
.period-heading > h3 { min-width: 0; margin: 0; }
.period-heading > .text-button { flex: 0 0 auto; margin: 0; font-size: 11px; line-height: 18px; }
.period-field { display: flex; flex-direction: column; min-width: 0; gap: 7px; margin: 0; padding: 0; border: 0; font-size: 12px; line-height: 19px; }
.period-field + .period-field { margin-top: 10px; }
.period-row, .drawer-periods > .period-field { display: grid; grid-template-columns: 94px minmax(0, 1fr); align-items: center; column-gap: 10px; }
.period-row + .period-row { margin-top: 10px; }
.period-row > label, .period-row > .field-caption, .period-row > span:first-child { min-width: 0; color: #647080; font-size: 12px; line-height: 19px; }
.period-control { display: grid; grid-template-columns: 84px minmax(0, 1fr); align-items: center; gap: 10px; width: 100%; min-width: 0; }
.period-control input[type="number"], .task-drawer .period-control input[type="number"] { width: 84px; min-width: 0; max-width: 100%; height: 32px; min-height: 32px; padding: 5px 7px; border: 1px solid #d9dde2; border-radius: 5px; background: white; color: #26313d; font-size: 13px; font-weight: 400; line-height: 20px; }
.period-control input[type="number"]:disabled { background: #f8f7f5; color: #747375; }
.period-units { display: flex; min-width: 0; min-height: 32px; padding: 0; border: 1px solid #d9dde2; border-radius: 5px; background: white; }
.period-units > label { display: flex; position: relative; flex: 1 1 0; min-width: 0; margin: 0; padding: 0; cursor: pointer; }
.period-units > label + label { border-left: 1px solid #d9dde2; }
.period-units input[type="radio"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: 0; opacity: 0; }
.period-units label > span { display: flex; align-items: center; justify-content: center; width: 100%; min-width: 0; min-height: 30px; padding: 4px 6px; color: #627083; background: white; font-size: 12px; font-weight: 550; line-height: 20px; white-space: nowrap; }
.period-units label:first-child > span { border-radius: 4px 0 0 4px; }
.period-units label:last-child > span { border-radius: 0 4px 4px 0; }
.period-units input[type="radio"]:checked + span { color: white; background: #aa8567; }
.period-units input[type="radio"]:focus-visible + span { outline: 2px solid #8e6a4c; outline-offset: -3px; }
.period-units input[type="radio"]:disabled + span { opacity: .55; cursor: not-allowed; }
.period-save { display: flex; justify-content: flex-end; margin: 10px 0 0 auto; }
button.period-save, .period-save .button { min-height: 32px; padding: 5px 9px; border-color: #b7967e; color: #936846; font-size: 12px; line-height: 20px; }
#task-detail-form .period-save .detail-save { flex: 0 0 auto; width: auto; margin: 0; }
.drawer-periods .flow-hint { margin-top: 10px; font-size: 11px; line-height: 18px; }
.estimate-opinion-row:has(.period-control) { display: flex; flex-direction: column; align-items: stretch; gap: 10px; margin-top: 10px; }
.estimate-opinion-row:has(.period-control) .draft-effort { display: flex; align-items: center; gap: 14px; width: 100%; min-height: 30px; padding: 5px 8px; border-radius: 4px; background: #f4f5f7; }
.proposed-effort:has(.period-control) { display: grid; grid-template-columns: 64px minmax(0, 1fr); align-items: center; column-gap: 10px; width: 100%; min-width: 0; white-space: normal; }
.proposed-effort .period-field { min-width: 0; }
#comment-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: 'estimate estimate' 'body submit' 'guide guide' 'length length' 'error error'; column-gap: 8px; min-width: 0; }
#comment-form .estimate-opinion-row { grid-area: estimate; }
#comment-form textarea { grid-area: body; min-width: 0; min-height: 48px; height: 48px; margin-top: 10px; resize: vertical; }
#comment-form .opinion-submit { grid-area: submit; align-self: start; min-height: 34px; height: 34px; margin-top: 10px; padding: 5px 8px; font-size: 12px; }
#comment-form .flow-hint { grid-area: guide; margin-top: 6px; font-size: 11px; line-height: 17px; }
#comment-form .opinion-length { grid-area: length; }
#comment-form .error-message { grid-area: error; }
.drawer-estimate .opinion-hint { margin-top: 6px; font-size: 11px; line-height: 16px; }
.activity-item { min-width: 0; align-items: flex-start; }
.activity-item p, .comment-item p, .flow-hint, .flow-state { min-width: 0; overflow-wrap: anywhere; }
.activity-item p { font-size: 12px; }
.comment-item > div { min-width: 0; overflow-wrap: anywhere; }

/* Saved discussion is visible separately from the expandable activity log. */
.drawer-discussion { min-width: 0; margin-top: 16px; scroll-margin-top: 14px; }
.discussion-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; min-width: 0; margin-bottom: 8px; }
.discussion-count { display: inline-flex; align-items: center; justify-content: center; min-width: 19px; min-height: 19px; margin-left: 4px; padding: 0 5px; border-radius: 10px; background: #f1ece6; color: #866449; font-size: 11px; line-height: 19px; vertical-align: 1px; }
.discussion-list { display: flex; flex-direction: column; min-width: 0; overflow: hidden; border: 1px solid #e5e7e9; border-radius: 6px; background: #fcfcfb; }
.discussion-list > .hint { padding: 12px; color: #7e8791; font-size: 12px; line-height: 19px; }
.discussion-list .discussion-item { display: flex; align-items: flex-start; gap: 8px; min-width: 0; margin: 0; padding: 10px; scroll-margin-top: 14px; }
.discussion-list .discussion-item + .discussion-item { border-top: 1px solid #e8e9e9; }
.discussion-item > .avatar { flex: 0 0 auto; width: 27px; height: 27px; font-size: 11px; }
.discussion-item > div { flex: 1; min-width: 0; }
.discussion-item-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 6px; min-width: 0; }
.discussion-item-heading strong { min-width: 0; max-width: 100%; color: #394858; font-size: 12px; font-weight: 650; line-height: 19px; overflow-wrap: anywhere; }
.discussion-item-heading time { flex: 0 0 auto; margin-left: auto; color: #8b94a0; font-size: 10px; line-height: 18px; white-space: nowrap; }
.comment-kind, .discussion-item-heading .pill { display: inline-flex; align-items: center; flex: 0 0 auto; min-height: 18px; padding: 0 5px; border-radius: 4px; background: #edf0f4; color: #6c7b8e; font-size: 10px; line-height: 18px; }
.comment-kind.estimate { background: #f3eadf; color: #9b704d; }
.comment-kind.help { background: #fff0d8; color: #aa742e; }
.discussion-list .discussion-item p { min-width: 0; margin-top: 4px; color: #4d5b6a; font-size: 12px; line-height: 19px; white-space: pre-wrap; overflow-wrap: anywhere; }
.discussion-item.is-new { background: #fbf5ec; box-shadow: inset 2px 0 0 #b18a67; }
.drawer-discussion:focus, .discussion-item:focus { outline: 2px solid #b18a67; outline-offset: 3px; border-radius: 6px; }
.discussion-item:focus { outline-offset: -2px; }

/* Progress is saved independently from task details and period opinions. */
.drawer-progress { min-width: 0; margin: 0 0 14px; padding: 12px; border: 1px solid #e5e6e8; border-radius: 6px; background: #fff; }
.progress-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; min-width: 0; margin-bottom: 7px; }
.progress-heading h3 { min-width: 0; }
.task-progress-label { flex: 0 0 auto; color: #926b4b; font-size: 14px; line-height: 21px; font-variant-numeric: tabular-nums; }
#task-progress-form { min-width: 0; }
.task-progress-controls { display: grid; grid-template-columns: minmax(56px, 1fr) 64px auto; align-items: center; gap: 8px; min-width: 0; }
.task-progress-controls input[type="range"] { display: block; appearance: auto; width: 100%; min-width: 0; min-height: 32px; height: 32px; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; accent-color: #a07a59; cursor: pointer; }
.task-progress-controls input[type="range"]:focus-visible { outline: 2px solid #aa8666; outline-offset: 1px; }
.progress-number-control { display: flex; align-items: center; min-width: 0; min-height: 32px; height: 32px; border: 1px solid #d9dde2; border-radius: 5px; background: #fff; }
.task-progress-controls .progress-number-control input[type="number"] { flex: 1; width: 45px; min-width: 0; min-height: 30px; height: 30px; padding: 4px 5px; border: 0; border-radius: 5px; background: transparent; box-shadow: none; color: #354151; font-size: 12px; line-height: 20px; }
.progress-number-control:focus-within { border-color: #b39173; box-shadow: 0 0 0 2px #97704f12; }
.progress-number-control > span { flex: 0 0 auto; padding-right: 7px; color: #7c8693; font-size: 11px; line-height: 20px; }
.task-progress-controls .progress-save { min-height: 32px; height: 32px; padding: 5px 8px; font-size: 12px; line-height: 20px; }
.drawer-progress .flow-hint { margin-top: 6px; font-size: 11px; line-height: 17px; }
.drawer-progress .error-message { margin-top: 8px; }
.progress-readonly { display: flex; align-items: center; gap: 8px; min-width: 0; min-height: 15px; }
.task-progress-track { display: block; flex: 1; min-width: 0; width: 100%; height: 6px; overflow: hidden; border-radius: 4px; background: #eee9e2; }
.task-progress-track > span { display: block; max-width: 100%; height: 100%; border-radius: inherit; background: #a07a59; }
.card-progress { display: flex; align-items: center; gap: 7px; min-width: 0; min-height: 10px; margin-top: 2px; font-size: 10px; line-height: 10px; }
.card-progress-track { display: block; flex: 1; min-width: 0; height: 4px; overflow: hidden; border-radius: 3px; background: #eee9e2; }
.card-progress-track > span { display: block; max-width: 100%; height: 100%; border-radius: inherit; background: #a07a59; }
.card-progress-value { flex: 0 0 28px; width: 28px; color: #6c7f95; font-size: 10px; line-height: 10px; text-align: right; font-variant-numeric: tabular-nums; }
button.card-comment { min-width: 24px; min-height: 24px; padding: 2px 4px; border: 0; border-radius: 4px; background: transparent; color: #7890ac; font: inherit; font-size: 11px; line-height: 19px; cursor: pointer; }
button.card-comment.has-comments { color: #936b4a; background: #f7f0e7; }
button.card-comment:hover { color: #886546; background: #f5eee7; }
button.card-comment:focus-visible { outline: 2px solid #a07a59; outline-offset: 2px; }
.drawer-footer { height: auto; min-height: 0; flex-shrink: 0; gap: 7px; padding: 10px 18px max(12px, env(safe-area-inset-bottom)); }
.drawer-footer > .button.primary { min-height: 36px; height: 36px; padding: 6px 10px; font-size: 13px; }
body.drawer-open #toast { bottom: calc(var(--active-drawer-footer-height, 108px) + 12px); }
.footer-guide { margin: 0; font-size: 11px; line-height: 17px; color: #858c94; text-align: center; overflow-wrap: anywhere; }

/* Shared accessible hover/focus/touch guidance. */
.help-trigger { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 18px; width: 18px; height: 18px; min-height: 18px; padding: 1px; border: 0; border-radius: 50%; background: transparent; color: #99a0a8; cursor: help; vertical-align: middle; }
.help-trigger .icon { width: 14px; height: 14px; }
.help-trigger:hover, .help-trigger[aria-expanded="true"] { color: #916b4d; background: #eee7df; }
.help-trigger:focus-visible { outline: 2px solid #a68160; outline-offset: 3px; }
.helper-popover { position: fixed; inset: auto; width: max-content; max-width: min(300px, calc(100vw - 24px)); margin: 0; padding: 12px 14px; border: 0; border-radius: 8px; background: #3d352e; color: #fffdf9; font-family: inherit; font-size: 13px; line-height: 1.65; text-align: left; box-shadow: 0 5px 18px #2c211b24; z-index: 100; overflow-wrap: anywhere; }
.helper-popover::backdrop { background: transparent; pointer-events: none; }
.helper-popover strong { display: block; margin-bottom: 4px; font-size: 13px; font-weight: 650; }
.helper-popover p { margin: 0; }
.field-caption { display: inline-flex; align-items: center; gap: 5px; }
.flow-hint { margin: 8px 0 0; font-size: 12px; line-height: 19px; color: #899098; }
.flow-state { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 6px 10px; padding: 10px 11px; margin-top: 12px; border: 1px solid #e8dfd4; border-radius: 6px; background: #fbf8f3; color: #7c654f; font-size: 12px; line-height: 19px; }
.flow-state > strong { width: 100%; }
.flow-state > p { flex: 1 1 100%; min-width: 0; margin: 0; overflow-wrap: anywhere; }
.flow-state .button { flex: 0 0 auto; min-height: 27px; padding: 4px 7px; font-size: 11px; }
.modal-content, .form-grid, .form-field { min-width: 0; }
.modal-content .form-intro, .modal-content .hint { overflow-wrap: anywhere; }
.task-drawer { box-shadow: -8px 0 28px #29221918; }
@media (max-width: 1100px) {
  .workspace { grid-template-columns: 168px minmax(0, 1fr); }
  .sidebar { width: 168px; }
  .workspace-brand > span { font-size: 28px; }
  .sidebar-nav a { font-size: 13px; padding-left: 10px; padding-right: 10px; }
  .sidebar-account { padding-left: 6px; padding-right: 2px; }
}
@media (max-width: 850px) {
  .workspace { grid-template-columns: 70px minmax(0, 1fr); }
  .sidebar { width: 70px; padding: 20px 7px; }
  .workspace-brand { margin: 0 0 24px; }
  .workspace-brand > span { font-size: 18px; line-height: 30px; }
  .sidebar-nav a { min-height: 44px; padding: 10px 4px; gap: 0; }
  .sidebar-nav a:last-child { margin-top: 24px; padding-top: 24px; }
}
@container workspace (max-width: 850px) {
  .workspace-header { gap: 12px; }
  .global-search { flex: 1; width: 100%; max-width: 100%; }
  #workspace-date { display: none; }
  .board-toolbar { gap: 8px; }
  .board-filters select { width: 164px; }
  .board-filters #assignee-filter { width: 140px; }
}
@container workspace (max-width: 620px) {
  .page-title, .workspace-content:has(#board) .page-title { font-size: 28px; line-height: 36px; }
  .subtitle, .workspace-content:has(#board) .subtitle { font-size: 13px; line-height: 20px; }
  .board-filters { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); flex: 1 1 300px; }
  .board-filters select, .board-filters #assignee-filter { width: 100%; max-width: none; }
}
@container workspace (max-width: 520px) {
  .board-toolbar .board-tabs { flex-basis: 100%; }
  .board-filters { flex-basis: 100%; }
}
@media (max-width: 550px) {
  .workspace { grid-template-columns: 1fr; padding-bottom: 61px; }
  .sidebar { inset: auto 0 0; width: 100%; height: 61px; padding: 0 8px; }
  .sidebar-nav { gap: 4px; }
  .sidebar-nav a, .sidebar-nav a:last-child { min-height: 49px; margin: 0; padding: 6px 4px; gap: 3px; }
  .sidebar-nav a .icon { width: 18px; height: 18px; }
  .workspace-header { height: 60px; padding: 10px 14px; }
  .workspace-content, .workspace-content:has(#board), body.drawer-open .workspace-content { padding: 16px 14px 24px; }
  .page-head, .workspace-content:has(#board) .page-head { min-height: 64px; margin-bottom: 14px; gap: 10px; }
  .page-title, .workspace-content:has(#board) .page-title { font-size: 26px; line-height: 34px; }
  .subtitle, .workspace-content:has(#board) .subtitle { max-width: none; font-size: 12px; line-height: 19px; }
  .workspace-content:has(#board) .page-head .primary { min-width: 96px; min-height: 34px; padding: 7px 10px; font-size: 12px; }
  .workspace-content:has(#board) .page-head .primary .icon { width: 15px; height: 15px; }
  .board-toolbar { margin-bottom: 16px; }
  .kanban-board { grid-template-columns: repeat(4, 256px); scroll-snap-type: x proximity; }
  .kanban-column { scroll-snap-align: start; }
  .task-drawer { inset: 0; width: 100%; height: 100dvh; max-width: none; z-index: 45; }
  .drawer-content { padding-left: 18px; padding-right: 18px; }
  .drawer-header { padding-left: 18px; padding-right: 18px; }
  .detail-properties { gap: 8px; }
  .drawer-owner { gap: 5px; font-size: 12px; }
  .drawer-owner .avatar { width: 24px; height: 24px; font-size: 11px; }
  .detail-effort .text-button { margin-left: 0; }
  .task-drawer .proposed-effort input[type="number"] { flex-basis: 48px; width: 48px; min-width: 48px; }
  .period-row, .drawer-periods > .period-field { grid-template-columns: 76px minmax(0, 1fr); column-gap: 8px; }
  .period-control { grid-template-columns: 84px minmax(0, 1fr); gap: 8px; }
  .period-control input[type="number"], .task-drawer .period-control input[type="number"] { width: 84px; min-width: 0; }
  .period-units label > span { padding-left: 4px; padding-right: 4px; }
  .proposed-effort:has(.period-control) { grid-template-columns: 56px minmax(0, 1fr); column-gap: 8px; }
  .board-help { font-size: 11px; line-height: 18px; }
}

/* Every route uses the approved board's shell and typography. */
.workspace .workspace-content, body.drawer-open .workspace-content, .workspace-content:has(#board.member-board, #board.assignee-board) { padding: 8px 22px 22px; }
.workspace .page-head, .workspace-content:has(#board.member-board, #board.assignee-board) .page-head { min-height: 60px; margin-bottom: 5px; }
.workspace .page-head > .actions { padding-top: 3px; gap: 8px; }
.workspace-content:has(#board.member-board, #board.assignee-board) .page-head .actions > .board-refresh { display: inline-flex; }
.workspace .page-title, .workspace-content:has(#board.member-board, #board.assignee-board) .page-title { color: #172537; font-size: 30px; line-height: 38px; }
.workspace .subtitle, .workspace-content:has(#board.member-board, #board.assignee-board) .subtitle { font-size: 13px; line-height: 21px; }
.workspace .page-head .primary { min-height: 36px; padding: 8px 12px; border-radius: 6px; font-size: 13px; line-height: 20px; }
.workspace .page-head .primary .icon { width: 17px; height: 17px; flex-shrink: 0; }
.workspace .icon { flex-shrink: 0; }
.board-refresh .refresh-icon { display: block; width: 17px; height: 17px; flex: 0 0 17px; overflow: visible; }

/* Project, member and meeting lists share compact, discoverable controls. */
.collection-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; min-width: 0; max-width: 1586px; margin: 8px 0 16px; }
.collection-tabs { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 2px; min-width: 0; padding: 3px; border: 1px solid #d8dfe7; border-radius: 6px; background: #fff; }
.collection-tabs .button { min-width: 76px; min-height: 30px; padding: 5px 12px; border: 0; border-radius: 4px; background: transparent; color: #62748a; font-size: 12px; line-height: 20px; }
.collection-tabs .button.active, .collection-tabs .button.is-active { background: #f0e8df; color: #936746; }
.collection-tabs .button > span { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; min-height: 18px; margin-left: 3px; padding: 0 4px; border-radius: 9px; background: #f2f4f5; color: #788697; font-size: 10px; line-height: 17px; }
.collection-tabs .button.active > span, .collection-tabs .button.is-active > span { background: #fff9f2; color: #936746; }
.collection-filters { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; min-width: 0; }
.collection-filters select, select.member-filter { width: auto; min-width: 140px; max-width: 220px; min-height: 35px; height: 35px; padding: 6px 28px 6px 10px; font-size: 12px; line-height: 20px; }
.collection-summary { min-width: 0; color: #77899f; font-size: 12px; line-height: 20px; overflow-wrap: anywhere; }
.collection-summary strong { color: #53677f; font-weight: 650; }
.collection-search-result { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; min-width: 0; max-width: 1586px; margin: -4px 0 15px; color: #75879e; font-size: 12px; line-height: 20px; overflow-wrap: anywhere; }
.collection-search-result strong { color: #586d85; font-weight: 650; }
.collection-search-result .button { min-height: 26px; padding: 3px 7px; border-color: transparent; background: transparent; color: #8c684a; font-size: 11px; }
.collection-empty.empty-state { display: flex; grid-column: 1 / -1; flex-direction: column; align-items: center; justify-content: center; gap: 8px; min-height: 220px; max-width: 1586px; margin: 0; padding: 30px 20px; border: 1px dashed #d9dfe5; border-radius: 8px; background: #faf9f7; color: #8192a7; font-size: 12px; line-height: 20px; text-align: center; overflow-wrap: anywhere; }
.collection-empty.empty-state > .icon { width: 28px; height: 28px; margin-bottom: 3px; color: #a1b0c1; }
.collection-empty.empty-state strong { color: #4c5e74; font-size: 14px; line-height: 22px; font-weight: 650; }
.collection-empty.empty-state p { max-width: 420px; margin: 0; }
.collection-empty.empty-state .button { min-height: 32px; margin-top: 4px; padding: 6px 11px; font-size: 12px; }
.workspace .project-grid, .workspace .people-grid { gap: 14px; max-width: 1586px; }
.workspace .project-card, .workspace .person-card { padding: 18px; border-radius: 8px; }
.workspace .project-card h2 { margin-top: 14px; color: #243448; font-size: 16px; line-height: 24px; overflow-wrap: anywhere; }
.workspace .project-card > p { min-height: 40px; margin-top: 6px; color: #8190a1; font-size: 12px; line-height: 20px; }
.workspace .project-progress { margin-top: 18px; font-size: 11px; line-height: 18px; }
.workspace .project-task-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; margin-top: 12px; color: #8090a3; font-size: 11px; line-height: 20px; }
.workspace .project-task-summary > span { display: inline-flex; align-items: center; gap: 5px; }
.workspace .project-task-summary strong { color: #53677d; font-size: 12px; font-weight: 650; }
.workspace .project-dates { flex-wrap: wrap; gap: 5px; color: #8695a7; font-size: 11px; line-height: 18px; }
.workspace .project-actions { flex-wrap: wrap; gap: 6px; margin-top: 16px; padding-top: 12px; }
.workspace .project-actions > .button, .workspace .person-actions > .button { min-height: 30px; padding: 5px 9px; font-size: 12px; line-height: 18px; }
.workspace .person-heading { min-width: 0; gap: 11px; }
.workspace .person-heading > div { min-width: 0; }
.workspace .person-heading h2 { color: #243448; font-size: 15px; line-height: 23px; overflow-wrap: anywhere; }
.workspace .person-heading p, .workspace .person-email { color: #8190a1; font-size: 12px; line-height: 20px; }
.workspace .person-stats { gap: 8px; margin: 16px 0; padding: 12px 0; color: #8695a7; }
.workspace .person-stats strong { color: #53677d; font-size: 16px; line-height: 24px; }
.workspace .person-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 6px; margin-top: 13px; padding-top: 12px; border-top: 1px solid #efebe6; }
.workspace .notes-list { max-width: 1280px; gap: 14px; }
.workspace .meeting-card { padding: 18px 20px; border-radius: 8px; }
.workspace .meeting-top { flex-wrap: wrap; gap: 8px; }
.workspace .meeting-top time { color: #8190a1; font-size: 11px; line-height: 18px; }
.workspace .meeting-card h2 { margin: 12px 0; color: #243448; font-size: 16px; line-height: 24px; overflow-wrap: anywhere; }
.workspace .meeting-body { color: #6d7c90; font-size: 13px; line-height: 22px; }
.workspace .meeting-author { flex-wrap: wrap; gap: 6px; margin-top: 16px; padding-top: 12px; color: #8190a1; font-size: 11px; line-height: 18px; }

/* Approved member board: two people per row, two task previews per person. */
.workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar { justify-content: flex-start; align-items: center; gap: 10px; margin-bottom: 12px; }
.workspace-content:has(#board.member-board, #board.assignee-board) .board-filters { gap: 10px; flex-wrap: wrap; }
.workspace-content:has(#board.member-board, #board.assignee-board) .board-filters select { width: 170px; max-width: 190px; min-height: 35px; height: 35px; padding: 6px 25px 6px 11px; font-size: 12px; }
.workspace-content:has(#board.member-board, #board.assignee-board) .board-filters #category-filter { width: 154px; }
.workspace-content:has(#board.member-board, #board.assignee-board) .board-filters #assignee-filter { width: 174px; }
.workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > select { flex: 0 0 auto; width: 170px; max-width: 190px; min-height: 35px; height: 35px; padding: 6px 25px 6px 11px; font-size: 12px; }
.workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > #category-filter { width: 154px; }
.workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > #assignee-filter { width: 174px; }
.board-mode-tabs { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 2px; padding: 2px; min-height: 35px; border: 1px solid #d8dfe7; border-radius: 5px; background: white; }
.board-mode-tabs .button { min-width: 126px; min-height: 29px; padding: 5px 12px; border: 0; border-radius: 3px; background: transparent; color: #223247; font-size: 12px; line-height: 19px; }
.board-mode-tabs .button.active { background: #f0e8df; color: #996b48; box-shadow: none; }
.board-extra-filters { position: relative; flex: 0 0 auto; margin-left: 0; min-width: 0; }
.board-extra-filters > summary { display: inline-flex; align-items: center; gap: 5px; min-height: 35px; padding: 6px 9px; border: 1px solid #d8dfe7; border-radius: 5px; background: white; color: #667b94; font-size: 12px; line-height: 21px; list-style: none; cursor: pointer; }
.board-extra-filters > summary::-webkit-details-marker { display: none; }
.board-extra-filters > summary > .icon { width: 15px; height: 15px; }
.board-extra-filters[open] > summary { border-color: #ba9b81; background: #f7f2eb; }
.board-extra-filters.is-active > summary { border-color: #b9987a; background: #f1e8de; color: #8c6241; }
.board-extra-filter-content { display: flex; position: absolute; top: calc(100% + 6px); right: 0; z-index: 12; flex-direction: column; align-items: stretch; gap: 8px; width: 244px; max-width: calc(100vw - 28px); padding: 12px; border: 1px solid #e3dcd3; border-radius: 7px; background: white; box-shadow: 0 5px 18px #30251b20; }
.board-extra-filter-content .button { justify-content: flex-start; min-height: 34px; font-size: 12px; }
.board-filter-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; min-width: 0; max-width: 1586px; margin: -3px 0 12px; color: #62748b; font-size: 12px; line-height: 20px; }
.board-filter-summary .filter-chip, .board-filter-summary > .button { display: inline-flex; align-items: center; gap: 5px; min-width: 0; min-height: 27px; max-width: 280px; padding: 3px 8px; overflow: hidden; border: 1px solid #ded8cf; border-radius: 5px; background: #f3eee8; color: #775a43; font-size: 11px; line-height: 19px; text-overflow: ellipsis; }
.board-filter-summary .filter-chip .icon { width: 12px; height: 12px; }
.board-filter-summary .filter-chip > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.board-filter-summary .filter-count { margin-right: 3px; color: #53657c; white-space: nowrap; }
.board-filter-summary > .text-button { border-color: transparent; background: transparent; color: #62748b; }
.board-guidance { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; max-width: 1586px; margin: 0 0 12px; padding: 10px 12px; border: 1px solid #e4dbcf; border-radius: 7px; background: #f6f0e8; color: #715940; font-size: 12px; line-height: 20px; }
.board-guidance > .icon { width: 17px; height: 17px; color: #a27c58; }
.board-guidance > p, .board-guidance > div:first-of-type { flex: 1 1 250px; min-width: 0; }
.board-guidance > div:first-of-type { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 10px; }
.board-guidance > div > span { color: #7b6955; }
.board-guidance strong { color: #5d4935; font-weight: 650; }
.board-guidance .button, .member-pool-link { min-height: 28px; padding: 4px 9px; border: 1px solid #c8ac91; border-radius: 5px; background: #fff; color: #8e603c; font-size: 11px; line-height: 18px; }
.board-guidance .button:focus-visible, .member-pool-link:focus-visible, .board-extra-filters > summary:focus-visible { outline: 2px solid #92704e; outline-offset: 3px; }
.member-board.kanban-board { --member-columns: 2; --member-track: clamp(590px, calc(590px + (100cqw - 1311px) * .28), 710px); display: grid; grid-template-columns: minmax(206px, 280px) var(--member-track) minmax(194px, 280px) minmax(194px, 280px); align-items: stretch; justify-content: start; gap: 12px; width: 100%; max-width: 1586px; min-width: 0; min-height: 0; height: auto; padding: 0 0 2px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: none; }
.member-board[data-member-columns="3"] { --member-columns: 3; --member-track: clamp(878px, calc(878px + (100cqw - 1311px) * .3), 1000px); max-width: 1876px; }
.member-board > .kanban-column { position: relative; min-height: 0; height: auto; border: 0; border-radius: 0; padding: 0; background: transparent; }
.member-board > .kanban-column:last-child { border-right: 0; }
.member-board > .kanban-column.active { padding: 0 12px 12px; border: 1px solid #eeeae5; border-radius: 8px; }
.member-board > .kanban-column.review::after { position: absolute; top: 0; right: -6px; bottom: 0; width: 1px; background: #eeeae5; content: ''; pointer-events: none; }
.member-board .column-header { flex: 0 0 auto; height: 48px; min-height: 48px; padding: 7px 0; gap: 6px; justify-content: flex-start; flex-wrap: nowrap; }
.member-board .column-header h2 { min-width: 0; flex: 0 0 auto; gap: 8px; color: #18273b; font-size: 17px; line-height: 25px; font-weight: 700; letter-spacing: -.025em; }
.member-board .column-header .column-dot { display: block; flex: 0 0 10px; width: 10px; height: 10px; min-width: 10px; min-height: 10px; aspect-ratio: 1; margin: 0; padding: 0; border: 0; border-radius: 0; background: transparent; color: #a97a56; line-height: 1; font-style: normal; overflow: visible; }
.member-board .kanban-column.waiting .column-dot { color: #a97a56; background: transparent; }
.member-board .kanban-column.active .column-dot { color: #19a467; background: transparent; }
.member-board .kanban-column.review .column-dot { color: #efbd45; background: transparent; }
.member-board .kanban-column.completed .column-dot { color: #3389df; background: transparent; }
.member-board .column-count { margin: 0; color: #7188a8; font-size: 15px; font-weight: 500; }
.member-board .column-header > .help-trigger { flex: 0 0 18px; margin: 0; }
.member-board .column-header > .column-header-title { display: flex; align-items: center; gap: 5px; min-width: 0; }
.member-count-chip { display: inline-flex; flex: 0 0 auto; align-items: center; justify-content: center; min-height: 27px; margin-left: 4px; padding: 3px 10px; border: 1px solid #dde3e9; border-radius: 15px; background: #f8fafb; color: #3c5471; font-size: 12px; line-height: 18px; white-space: nowrap; }
.member-layout-control { display: flex; align-items: center; flex: 0 0 auto; gap: 8px; margin-left: auto; color: #607a99; font-size: 12px; line-height: 20px; white-space: nowrap; }
.member-layout-control > span { margin-right: 2px; }
.member-layout-control > div, .member-layout-control .layout-buttons { display: inline-flex; align-items: center; gap: 0; border: 1px solid #d8dfe7; border-radius: 5px; background: white; }
.member-layout-control .button { width: auto; min-width: 56px; min-height: 27px; height: 27px; padding: 3px 11px; border: 1px solid #d8dfe7; border-radius: 4px; background: white; color: #324e6e; font-size: 12px; line-height: 19px; }
.member-layout-control .button.active { border-color: #b08360; background: #a67a58; color: white; }
.member-layout-control > div .button, .member-layout-control .layout-buttons .button { border: 0; border-radius: 3px; }
.member-board .column-cards { min-height: 0; flex: 1; gap: 11px; padding: 0 0 12px; }
.member-board > .kanban-column.active > .column-cards { padding: 0; }
.member-board > .kanban-column.waiting > .column-cards { padding-right: 0; }
.member-board > .kanban-column.completed > .column-cards { padding-right: 0; }
.member-board > .kanban-column.completed > .column-cards { flex: 0 0 auto; }
.member-board .column-empty .button { min-height: 30px; max-width: 100%; margin-top: 4px; padding: 5px 10px; font-size: 12px; line-height: 18px; white-space: normal; }
.member-board .task-card:not(.compact-task) { min-height: 150px; padding: 12px; }
.member-board .task-card:not(.compact-task) h3 { font-size: 15px; line-height: 22px; font-weight: 650; }
.member-board .task-card:not(.compact-task) .card-owner { margin-top: 8px; font-size: 12px; }
.member-board .task-card:not(.compact-task) .task-card-meta { gap: 5px 7px; font-size: 12px; line-height: 20px; }
.member-board .task-card:not(.compact-task) .task-card-footer { min-height: 30px; padding-top: 6px; }
.member-board .task-card:not(.compact-task) .claim-button { flex-basis: auto; min-width: 80px; width: auto; height: 30px; min-height: 30px; margin-top: 0; padding: 4px 10px; }
.member-board .project-tag { max-width: 100%; }
.member-board .task-card:not(.compact-task) .project-tag { font-size: 12px; line-height: 18px; }
.member-board .project-tag.tone-0, .member-task-drawer .project-tag.tone-0 { color: #cc4d4d; background: #ffe6e6; }
.member-board .project-tag.tone-1, .member-task-drawer .project-tag.tone-1 { color: #329465; background: #def6e7; }
.member-board .project-tag.tone-2, .member-task-drawer .project-tag.tone-2 { color: #3886bc; background: #dfeffc; }
.member-board .project-tag.tone-3, .member-task-drawer .project-tag.tone-3 { color: #8955dc; background: #f0e5ff; }
.card-owner-estimate, .card-completed-date { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 4px; max-width: 100%; margin-left: auto; color: #7d91ad; font-size: 11px; line-height: 20px; white-space: nowrap; }
.card-owner-estimate .icon, .card-completed-date .icon { width: 14px; height: 14px; flex-shrink: 0; }
.card-owner:has(.card-owner-estimate, .card-completed-date) .owner-name { min-width: 0; flex: 1 1 auto; }
.member-board .column-cards.member-grid { display: grid; grid-template-columns: repeat(var(--member-columns), minmax(0, 1fr)); grid-auto-rows: auto; align-items: stretch; align-content: start; gap: 10px; min-width: 0; }
.member-board .member-grid > .column-empty { grid-column: 1 / -1; }
.member-work-panel { display: flex; position: relative; flex-direction: column; min-width: 0; min-height: 0; padding: 8px; border: 1px solid #e9e4dd; border-radius: 8px; background: #fbfaf8; overflow: visible; }
.member-work-panel.is-self { border-color: #d4aa87; box-shadow: 0 0 0 1px #e4c9b44a; }
.member-work-panel.is-idle { min-height: 94px; background: #faf9f7; }
.member-work-panel.is-idle .member-work-head { margin-bottom: 4px; }
.member-work-panel.is-idle .member-work-empty { flex-direction: row; justify-content: flex-start; gap: 6px; min-height: 24px; padding: 0 0 1px 47px; color: #70829a; text-align: left; }
.member-work-panel.is-idle .member-work-empty > .icon { display: none; }
.member-work-panel.is-idle .member-work-empty:has(.member-pool-link) { flex-wrap: wrap; padding-top: 1px; padding-bottom: 3px; }
.member-claim-guide { color: #718298; font-size: 11px; line-height: 18px; }
.member-work-empty .member-pool-link { flex: 0 0 auto; }
.member-work-head { display: flex; align-items: center; gap: 9px; min-width: 0; min-height: 42px; margin-bottom: 7px; }
.member-work-head > .avatar { width: 38px; height: 38px; background: #efe6dc; color: #78583f; font-size: 18px; }
.member-work-heading { min-width: 0; flex: 1; }
.member-work-heading h3 { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 14px; line-height: 21px; color: #172637; font-weight: 700; }
.member-work-heading h3 > span:not(.self-chip) { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.member-work-summary { margin-top: 2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #6f829c; font-size: 11px; line-height: 18px; }
.member-work-heading h3 .self-chip { margin-left: 6px; vertical-align: 1px; }
.self-chip { display: inline-flex; align-items: center; flex: 0 0 auto; min-height: 20px; padding: 1px 6px; border-radius: 12px; background: #e0effe; color: #277cc4; font-size: 11px; line-height: 18px; font-weight: 650; }
.member-work-head > .button { align-self: flex-start; flex: 0 0 auto; width: 20px; min-height: 22px; padding: 2px; margin-left: auto; color: #88a0bc; }
.member-work-head > .button .icon { width: 15px; height: 15px; }
.member-attention { display: flex; position: absolute; top: 65px; right: 18px; z-index: 1; flex-wrap: nowrap; align-items: center; gap: 5px; margin: 0; color: #9c7443; font-size: 11px; line-height: 18px; pointer-events: none; }
.member-attention .pill, .member-attention > span { min-height: 20px; padding: 1px 5px; border-radius: 4px; font-size: 11px; line-height: 18px; }
.member-attention .help { color: #b76b24; background: #fff0d8; }
.member-attention .overdue { color: #cc4b4b; background: #ffe7e7; }
.member-attention .red { color: #cc4b4b; background: #ffe7e7; }
.member-work-tasks { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.task-card.compact-task, .task-card.compact-task.owned-card, .task-card.compact-task.waiting-card { min-height: 0; padding: 9px; border-color: #e8e9e8; border-radius: 6px; background: white; }
.compact-task .task-card-top { min-height: 18px; margin-bottom: 4px; padding-right: 18px; }
.compact-task .project-tag { max-width: 100%; padding: 1px 6px; font-size: 11px; line-height: 17px; }
.member-work-panel:has(.member-attention) .member-work-tasks > .compact-task:first-child .project-tag { max-width: 85px; }
.member-work-panel:has(.member-attention) .member-work-tasks > .compact-task:first-child .task-card-top .compact-wait-mark { display: none; }
.member-work-panel:has(.member-attention) .member-work-tasks > .compact-task:first-child .card-menu { top: 30px; }
.member-work-panel:has(.member-attention) .member-work-tasks > .compact-task:first-child h3 { padding-right: 18px; }
.task-card.compact-task h3 { margin: 0; font-size: 14px; line-height: 21px; font-weight: 650; }
.compact-task .task-card-meta { gap: 4px 6px; margin-top: 5px; font-size: 12px; line-height: 19px; }
.compact-task .task-card-meta .icon { width: 13px; height: 13px; }
.compact-task .task-card-meta .overdue-badge { padding: 0 4px; font-size: 10px; line-height: 18px; }
.compact-task .task-card-meta .compact-wait-mark { display: inline-flex; height: 18px; padding: 0 4px; font-size: 10px; line-height: 18px; }
.compact-task .card-menu { top: 6px; right: 5px; }
.compact-task .card-menu summary { height: 20px; }
.compact-task .card-menu summary .icon { width: 15px; height: 15px; }
.compact-task .task-card-footer { min-height: 21px; padding-top: 2px; margin-top: 2px; font-size: 11px; line-height: 19px; }
.compact-task .card-comment { display: inline-flex; align-items: center; gap: 3px; margin-left: auto; color: #7890ac; font-size: 11px; line-height: 19px; }
.compact-task button.card-comment { margin-top: -2.5px; margin-bottom: -2.5px; }
.compact-task .card-comment .icon { width: 13px; height: 13px; }
.compact-task .card-progress { flex: 0 0 auto; align-self: center; gap: 0; min-height: 19px; margin: 0; font-size: 11px; line-height: 19px; }
.compact-task .card-progress-track { display: none; }
.compact-task .card-progress-value { flex: 0 0 auto; width: auto; min-width: 27px; color: #826449; font-size: 11px; line-height: 19px; text-align: center; }
.compact-wait-mark { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 3px; padding: 0 5px; border-radius: 4px; background: #fff0d8; color: #bc6d24; font-size: 10px; line-height: 18px; white-space: nowrap; }
.compact-wait-mark.external { background: #e2f0ff; color: #287bcc; }
.compact-wait-mark .icon { width: 11px; height: 11px; }
.member-work-empty { display: flex; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: 3px; min-height: 46px; padding: 0 3px; color: #71849d; font-size: 12px; line-height: 19px; text-align: center; overflow-wrap: anywhere; }
.member-work-empty > .icon { width: 24px; height: 24px; color: #98abc0; }
.member-work-footer { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; min-width: 0; gap: 5px 8px; margin: 4px -8px -8px; padding: 0 8px; color: #7890ab; font-size: 11px; line-height: 18px; }
.member-work-footer > span { min-width: 0; }
.member-preview-more { display: flex; align-items: center; justify-content: space-between; min-width: 0; gap: 8px; margin: 6px 0 0; color: #7890ab; font-size: 11px; line-height: 18px; }
.member-preview-more > span { min-width: 0; }
.member-preview-more .member-all-tasks { display: inline-flex; align-items: center; justify-content: center; gap: 6px; margin-left: auto; min-height: 28px; padding: 3px 10px; border: 1px solid #b99477; border-radius: 4px; color: #a36c43; background: white; font-size: 11px; line-height: 19px; }
.member-preview-more .member-all-tasks .icon { width: 14px; height: 14px; }
.member-work-footer .member-all-tasks { margin-left: auto; min-height: 28px; padding: 3px 10px; border-color: #b99477; border-radius: 4px; color: #a36c43; background: white; font-size: 11px; line-height: 19px; }
.member-work-footer .member-all-tasks .icon { width: 14px; height: 14px; }
.member-status-link, .member-work-footer .member-status-link { display: flex; align-items: center; justify-content: space-between; flex: 1 1 100%; width: 100%; min-width: 0; min-height: 22px; padding: 2px 0 1px; border: 0; border-top: 1px solid #e9e3dc; border-radius: 0; background: transparent; color: #7890ab; text-align: left; font-size: 11px; line-height: 18px; }
.member-status-link .icon { width: 13px; height: 13px; }
.member-board .completed-history-link, .member-board .all-completed-link { justify-content: flex-end; min-height: 30px; margin-top: 3px; padding: 3px 0; border: 0; background: transparent; color: #4588d0; font-size: 12px; line-height: 20px; }
.workspace-content:has(#board.member-board, #board.assignee-board) .board-help { margin-top: 7px; color: #8095ad; font-size: 12px; line-height: 20px; }

/* The complete member task list shares the fixed, non-shifting detail overlay. */
.member-task-drawer.task-drawer { display: flex; flex-direction: column; inset: 0 0 0 auto; width: min(var(--drawer-width), 100vw); height: 100dvh; max-height: 100dvh; padding: 0; overflow: hidden; }
.member-task-drawer.task-drawer:not([open]) { display: none; }
.member-task-drawer .drawer-scroll { display: flex; flex: 1; flex-direction: column; min-height: 0; overflow: hidden; }
.member-task-drawer .drawer-content { display: flex; flex: 1; flex-direction: column; min-height: 0; padding: 0; overflow: hidden; }
.member-list-head { display: flex; flex: 0 0 auto; align-items: flex-start; gap: 10px; min-width: 0; padding: 20px 20px 16px; border-bottom: 1px solid #e9e5df; }
.member-list-head > .avatar { width: 40px; height: 40px; font-size: 18px; }
.member-list-head > div { flex: 1; min-width: 0; }
.member-list-head h2 { color: #1d2b3b; font-size: 20px; line-height: 28px; overflow-wrap: anywhere; }
.member-list-head p { margin-top: 3px; color: #7c8fa7; font-size: 12px; line-height: 20px; overflow-wrap: anywhere; }
.member-list-head > .button { flex: 0 0 auto; width: 28px; min-height: 28px; padding: 4px; }
.member-list-filters { display: flex; flex: 0 0 auto; flex-wrap: wrap; align-items: center; gap: 8px; padding: 13px 20px; border-bottom: 1px solid #eee9e4; }
.member-list-filters .button { min-height: 30px; padding: 5px 10px; font-size: 12px; }
.member-list-filters .button.active { border-color: #ba9b81; background: #f1e9e0; color: #8f6848; }
.member-list-count { padding: 12px 20px 0; color: #768aa3; font-size: 12px; line-height: 20px; }
.member-list-tasks { display: flex; flex: 1; flex-direction: column; align-items: stretch; gap: 10px; min-width: 0; min-height: 0; padding: 14px 20px 20px; overflow-y: auto; overflow-x: hidden; }
.member-list-tasks .task-card { flex: 0 0 auto; min-height: 0; }
.member-list-tasks .task-card .task-card-meta { font-size: 12px; }

/* Archived work uses the same non-shifting list and detail panels. */
.workspace-content:has(#board) .page-head .actions { gap: 8px; }
.board-archive-button { min-height: 36px; padding: 7px 11px; border-color: #d9cabb; color: #775c45; font-size: 12px; }
.board-archive-button > .icon { width: 16px; height: 16px; }
.board-archive-button > span { display: inline-flex; align-items: center; justify-content: center; min-width: 18px; min-height: 18px; padding: 0 4px; border-radius: 9px; background: #f0e9e1; color: #826246; font-size: 10px; }
.archive-toolbar { flex: 0 0 auto; min-width: 0; padding: 12px 20px 0; }
.archive-toolbar #archive-search { width: 100%; min-height: 36px; padding: 8px 10px; font-size: 12px; }
.archive-list-count { flex: 0 0 auto; min-width: 0; padding: 10px 20px 0; color: #72839b; font-size: 12px; line-height: 20px; }
.archive-status-tag { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 4px; min-height: 20px; padding: 1px 6px; border: 1px solid #e5ddd3; border-radius: 4px; background: #f4efe8; color: #80694f; font-size: 10px; line-height: 17px; }
.archived-card .task-card-top { gap: 7px; padding-right: 22px; flex-wrap: wrap; }
.archived-card .project-tag { min-width: 0; max-width: 100%; }
.archive-card-actions { display: flex; align-items: center; justify-content: flex-end; gap: 7px; min-width: 0; margin-top: 9px; }
.archive-card-actions .restore-archive-button { min-height: 29px; padding: 5px 9px; font-size: 11px; }
.archive-readonly-hint { color: #7b8798; font-size: 11px; line-height: 18px; overflow-wrap: anywhere; }
.archive-empty { margin: 0; padding: 28px 12px; color: #77869a; font-size: 12px; line-height: 21px; text-align: center; overflow-wrap: anywhere; }
.archive-empty strong { display: block; margin-bottom: 5px; color: #4b5b70; font-size: 14px; }

/* The secondary assignee view uses one shared set of stage headings. */
.assignee-board { display: flex; flex-direction: column; gap: 10px; min-width: 0; padding-bottom: 3px; overflow-x: auto; }
.assignee-stage-row { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 12px; min-width: 1118px; padding: 12px 0; border-bottom: 1px solid #e8e2dc; }
.assignee-stage-row > h2 { display: flex; align-items: center; gap: 8px; min-width: 0; font-size: 14px; line-height: 22px; }
.assignee-stage-cells { display: grid; grid-template-columns: repeat(4, 230px); align-items: start; gap: 12px; }
.assignee-stage-cell { display: flex; flex-direction: column; gap: 8px; min-width: 0; min-height: 80px; padding: 0 10px 0 0; border-right: 1px solid #e8e2dc; }
.assignee-stage-cell:last-child { border-right: 0; }
.assignee-stage-cell .task-card { min-height: 0; }

@media (min-width: 851px) {
  .workspace { grid-template-columns: 170px minmax(0, 1fr); }
  .workspace .sidebar { width: 170px; padding: 17px 10px 26px; background: #faf9f7; }
  .workspace .workspace-brand { margin: 0 10px 17px; padding: 0; }
  .workspace .workspace-brand > span { font-size: 29px; line-height: 35px; }
  .workspace .workspace-brand small { margin-top: 0; font-size: 11px; line-height: 18px; }
  .workspace .sidebar-nav { gap: 8px; }
  .workspace .sidebar-nav a { min-height: 40px; padding: 9px 12px; gap: 10px; font-size: 13px; }
  .workspace .sidebar-nav a:last-child { position: relative; margin-top: 46px; padding-top: 9px; border-top: 0; border-radius: 6px; }
  .workspace .sidebar-nav a:last-child::before { content: ''; position: absolute; top: -20px; left: 0; right: 0; border-top: 1px solid var(--line); pointer-events: none; }
  .workspace .sidebar-account { padding-left: 9px; padding-right: 0; }
  .workspace .sidebar-profile .avatar { width: 44px; height: 44px; font-size: 20px; }
  .workspace .workspace-header { height: 56px; padding: 0 22px; border-bottom: 0; background: #faf9f7; }
  .workspace .global-search { max-width: 488px; min-height: 35px; }
  .workspace .global-search input { min-height: 32px !important; padding: 5px 0 !important; font-size: 12px; }
  .workspace #workspace-date { color: #34445b; font-size: 12px; }

  /* Only card bodies scroll; stage headings remain visible at any task count. */
  .member-board > .kanban-column { max-height: var(--board-available-height, calc(100dvh - 230px)); }
  .member-board > .kanban-column > .column-cards { flex: 1 1 auto; min-height: 0; max-height: calc(var(--board-available-height, 100dvh - 230px) - 48px); overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: thin; scrollbar-color: #c9bbae transparent; }
  .member-board > .kanban-column.active > .column-cards { max-height: calc(var(--board-available-height, 100dvh - 230px) - 62px); }
  .member-board > .kanban-column.active > .column-cards.member-grid { grid-auto-rows: max-content; }
  .member-board > .kanban-column.completed > .column-cards { flex: 0 1 auto; }
  .member-board > .kanban-column > .column-cards > .task-card { flex: 0 0 auto; }
  .member-board > .kanban-column > .completed-history-link { flex: 0 0 auto; }
  .assignee-board { max-height: var(--board-available-height, calc(100dvh - 230px)); overflow-y: auto; overscroll-behavior-y: contain; scrollbar-width: thin; scrollbar-color: #c9bbae transparent; }
  .assignee-board > .assignee-stage-row { flex: 0 0 auto; }
  .assignee-board > .assignee-stage-heading { position: sticky; top: 0; z-index: 2; margin-bottom: 0; background: #faf9f7; }
}
@container workspace (max-width: 1050px) {
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar { flex-wrap: wrap; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-filters { flex: 0 1 auto; display: flex; flex-wrap: wrap; }
}
@media (max-width: 850px) {
  .workspace .workspace-content, body.drawer-open .workspace-content, .workspace-content:has(#board.member-board, #board.assignee-board) { padding-left: 16px; padding-right: 16px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar { position: relative; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-extra-filters { position: static; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-extra-filter-content { top: calc(100% + 6px); right: auto; left: 0; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-filters select { width: 150px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-filters #category-filter { width: 126px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-filters #assignee-filter { width: 150px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > select { width: 150px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > #category-filter { width: 126px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > #assignee-filter { width: 150px; }
}
@media (max-width: 550px) {
  .workspace .workspace-content, body.drawer-open .workspace-content, .workspace-content:has(#board.member-board, #board.assignee-board) { padding: 12px 14px 24px; }
  .workspace .page-head, .workspace-content:has(#board.member-board, #board.assignee-board) .page-head { min-height: 60px; gap: 8px; }
  .workspace .page-head > .actions, .workspace-content:has(#board.member-board, #board.assignee-board) .page-head > .actions { gap: 5px; }
  .workspace .page-head .primary, .workspace-content:has(#board.member-board, #board.assignee-board) .page-head .primary { min-width: 0; min-height: 30px; padding: 6px 8px; font-size: 11px; line-height: 18px; }
  .workspace .page-head .primary .icon, .workspace-content:has(#board.member-board, #board.assignee-board) .page-head .primary .icon { width: 14px; height: 14px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-archive-button { min-height: 30px; padding: 5px 8px; gap: 5px; font-size: 11px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-archive-button > .icon { width: 14px; height: 14px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-archive-button > span { display: none; }
  .workspace .page-title, .workspace-content:has(#board.member-board, #board.assignee-board) .page-title { font-size: 26px; line-height: 34px; }
  .workspace .subtitle, .workspace-content:has(#board.member-board, #board.assignee-board) .subtitle { font-size: 12px; line-height: 19px; }
  .collection-toolbar { gap: 8px; margin: 8px 0 13px; }
  .collection-tabs { max-width: 100%; }
  .collection-tabs .button { min-width: 0; padding: 5px 9px; font-size: 11px; }
  .collection-summary { flex-basis: 100%; font-size: 11px; }
  .collection-filters { flex: 1 1 100%; }
  .collection-filters select, select.member-filter { flex: 1; width: 100%; min-width: 0; max-width: none; }
  .workspace .project-card, .workspace .person-card { padding: 16px; }
  .workspace .meeting-card { padding: 16px; }
  .workspace .meeting-top .actions { margin-left: auto; }
  .workspace .meeting-author > span:last-child { margin-left: 0; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar { gap: 8px; }
  .board-mode-tabs { width: 100%; }
  .board-mode-tabs .button { flex: 1; min-width: 0; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-filters { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); flex: 1 1 100%; width: 100%; gap: 8px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-filters select,
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-filters #category-filter,
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-filters #assignee-filter { width: 100%; max-width: none; min-height: 34px; height: 34px; padding-left: 8px; font-size: 11px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > select,
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > #category-filter,
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-toolbar > #assignee-filter { flex: 0 0 calc(50% - 4px); width: calc(50% - 4px); max-width: none; min-height: 34px; height: 34px; padding-left: 8px; font-size: 11px; }
  .member-board.kanban-board { grid-template-columns: 222px var(--member-track) 210px 210px; height: auto; min-height: 0; gap: 12px; padding-bottom: 10px; }
  .member-task-drawer.task-drawer { inset: 0; width: 100%; max-width: none; }
  .member-list-head { padding-left: 18px; padding-right: 18px; }
  .member-list-filters { padding-left: 18px; padding-right: 18px; }
  .member-list-tasks { padding-left: 18px; padding-right: 18px; }
  .archive-toolbar, .archive-list-count { padding-left: 18px; padding-right: 18px; }
  .workspace-content:has(#board.member-board, #board.assignee-board) .board-help { font-size: 11px; line-height: 18px; }
}

/* Approved team overview: output/mockups/leader-overview-20261029/.
   This is an additional reading view; the existing Kanban geometry is retained. */
.workspace-content[data-route="board"] .board-view-tabs {
  display: flex; align-items: center; gap: 0; min-height: 42px; margin: 8px 0 13px;
  padding: 0 0 3px; border-bottom: 1px solid #e6e2dc;
}
.workspace-content[data-route="board"] .board-view-tabs:has(> .board-view-tab) {
  position: relative; gap: 2px; padding: 3px 4px 4px;
}
.board-view-tabs:has(> .board-view-tab)::before {
  content: ''; position: absolute; top: 0; bottom: 4px; left: 0;
  width: 282px; max-width: 100%; border: 1px solid #e1ddd8; border-radius: 6px;
  background: #fff; pointer-events: none;
}
.board-view-tabs > .board-view-tab { position: relative; z-index: 1; }
.board-view-tabs > div, .board-view-tabs > [role="tablist"] {
  display: inline-flex; align-items: center; gap: 2px; padding: 3px;
  border: 1px solid #e1ddd8; border-radius: 6px; background: #fff;
}
.board-view-tabs .board-view-tab {
  display: inline-flex; align-items: center; justify-content: center; min-width: 136px;
  min-height: 34px; padding: 6px 18px; border: 0; border-radius: 4px;
  background: transparent; color: #334359; font-size: 13px; font-weight: 650; line-height: 22px;
}
.board-view-tabs .board-view-tab[aria-selected="true"], .board-view-tabs .board-view-tab.active {
  background: #eae4dd; color: #253247;
}
.workspace .workspace-content[data-route="board"] .board-toolbar {
  display: flex; align-items: center; justify-content: flex-start; flex-wrap: wrap;
  gap: 10px; min-height: 42px; margin-bottom: 0;
}
.workspace .workspace-content[data-route="board"] .board-toolbar .board-filters {
  display: flex; align-items: center; flex-wrap: wrap; gap: 10px;
}
.workspace .workspace-content[data-route="board"] .board-toolbar select {
  flex: 0 1 auto; width: 178px; max-width: 190px; height: 40px; min-height: 40px;
  padding: 7px 28px 7px 12px; border-color: #dcdad7; border-radius: 6px;
  color: #243448; font-size: 12px; line-height: 22px;
}
.workspace .workspace-content[data-route="board"] .board-toolbar #category-filter,
.workspace .workspace-content[data-route="board"] .board-toolbar #assignee-filter { width: 178px; }
.workspace .workspace-content[data-route="board"] .board-toolbar .board-extra-filters > summary {
  min-height: 40px; padding: 8px 12px; border-color: #d8dfe7; border-radius: 6px;
  font-size: 12px; line-height: 22px;
}
.workspace-refresh {
  display: flex; align-items: center; justify-content: flex-end; flex: 0 0 262px;
  gap: 12px; width: 262px; min-width: 262px; margin-left: auto;
}
.refresh-timestamp {
  display: block; flex: 0 0 142px; width: 142px; min-width: 142px;
  color: #7b8da5; font-size: 11px; line-height: 20px; text-align: right;
  white-space: nowrap; font-variant-numeric: tabular-nums;
}
.workspace-refresh-button.button {
  display: inline-flex; flex: 0 0 108px; justify-content: center; gap: 6px;
  width: 108px; min-width: 108px; max-width: 108px; height: 40px; min-height: 40px;
  margin: 0; padding: 7px 9px; border: 1px solid #b9987e; border-radius: 6px;
  background: #fff; color: #96673f; font-size: 12px; line-height: 22px;
  font-weight: 650; white-space: nowrap; box-shadow: none;
}
.workspace-refresh-button.button .refresh-icon,
.workspace-refresh-button.button .button-spinner {
  display: block; flex: 0 0 17px; width: 17px; height: 17px;
  margin: 0; overflow: visible;
}
.workspace-refresh-button.button:disabled,
.workspace-refresh-button.button[aria-busy="true"] {
  opacity: 1; border-color: #d4d1ce; background: #fafafa; color: #a19e9a;
}
.refresh-status-slot {
  display: flex; align-items: center; min-height: 24px; height: 24px;
  margin: 0 0 8px; overflow: hidden;
}
.refresh-status-message {
  display: flex; align-items: center; gap: 7px; min-width: 0; width: 100%;
  margin: 0; padding: 2px 8px; border-radius: 4px; background: #fff7eb;
  color: #a26e34; font-size: 11px; line-height: 20px;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.refresh-status-message > .icon { width: 14px; height: 14px; }
.refresh-status-message > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; }
.team-overview { min-width: 0; max-width: 1586px; color: #203247; }
.team-overview .team-summary {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)) minmax(180px, .9fr);
  align-items: center; gap: 12px; min-width: 0; margin: 0 0 18px;
}
.team-summary-button {
  display: flex; align-items: center; justify-content: flex-start; gap: 13px;
  min-width: 0; min-height: 54px; padding: 12px 18px; border: 1px solid #e5e2de;
  border-radius: 6px; background: #fff; color: #172a42;
  font-size: 16px; font-weight: 700; line-height: 26px; text-align: left;
}
.team-summary-button:hover { border-color: #bba28b; background: #fdfbf8; }
.team-summary-button[aria-pressed="true"] { border-color: #a07857; background: #f6efe7; box-shadow: 0 0 0 1px #a0785733; }
.team-summary-button strong { margin-left: 1px; color: #355b89; font-size: 18px; font-weight: 650; }
.team-summary-button .column-dot {
  display: block; flex: 0 0 14px; width: 14px; height: 14px; min-width: 14px; min-height: 14px;
  margin: 0; border: 0; border-radius: 0; background: transparent; color: #26a667;
}
.team-summary-button[data-summary="review"] .column-dot { color: #ffc346; }
.team-summary-button[data-summary="help"] .column-dot { color: #f27d33; }
.team-summary-button[data-summary="overdue"] .column-dot { color: #f14d5c; }
.team-summary-button[data-summary="overdue"] strong { color: #e64c59; }
.team-summary-note {
  display: flex; align-items: center; gap: 8px; min-width: 0; color: #8091a5;
  font-size: 11px; line-height: 19px; overflow-wrap: anywhere;
}
.team-summary-note > .icon { width: 16px; height: 16px; color: #8b9eb5; }
.team-overview-panel { min-width: 0; overflow: hidden; border: 1px solid #e1ddd8; border-radius: 7px; background: #fff; }
.team-overview-heading {
  display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap;
  gap: 8px 14px; min-height: 52px; padding: 12px 18px;
}
.team-overview-heading h2 { color: #172d46; font-size: 19px; line-height: 27px; font-weight: 750; letter-spacing: -.035em; }
.overview-heading-copy { display: flex; align-items: baseline; flex-wrap: wrap; gap: 5px 12px; min-width: 0; }
.overview-heading-copy p, .overview-heading-copy > span, .team-overview-heading .hint { color: #8090a5; font-size: 12px; line-height: 20px; }
.overview-priority-toggle {
  display: inline-flex; align-items: center; gap: 10px; flex: 0 0 auto; margin: 0;
  color: #72869e; font-size: 12px; line-height: 22px; white-space: nowrap; cursor: pointer;
}
.overview-priority-toggle input {
  appearance: none; display: block; position: relative; width: 37px; height: 21px;
  min-width: 37px; margin: 0; padding: 0; border: 0; border-radius: 12px;
  background: #c6cbd1; box-shadow: inset 0 0 0 1px #00000005; cursor: pointer;
}
.overview-priority-toggle input::before {
  content: ''; display: block; position: absolute; top: 2px; left: 2px;
  width: 17px; height: 17px; border-radius: 50%; background: white;
  box-shadow: 0 1px 3px #0000001a; transition: transform .15s;
}
.overview-priority-toggle input:checked { background: #a57b58; }
.overview-priority-toggle input:checked::before { transform: translateX(16px); }
.overview-priority-toggle > span:empty { display: none; }
.team-overview-table-wrap {
  min-width: 0; width: 100%; overflow-x: auto; overscroll-behavior-x: contain;
  scrollbar-width: thin; scrollbar-color: #c9bbae transparent;
}
.team-overview-table {
  width: 100%; min-width: 1110px; border-collapse: separate; border-spacing: 0;
  table-layout: fixed; color: #22384f; font-size: 12px; line-height: 20px;
}
.team-overview-table th {
  height: 44px; padding: 10px 16px; border-top: 1px solid #f0ede9; border-bottom: 1px solid #eeebe7;
  background: #f8f7f5; color: #3d536d; font-weight: 600; font-size: 12px; text-align: left;
}
.team-overview-table th:nth-child(1) { width: 14%; }
.team-overview-table th:nth-child(2) { width: 51%; }
.team-overview-table th:nth-child(3) { width: 12.5%; }
.team-overview-table th:nth-child(4) { width: 22.5%; }
.team-overview-table td {
  height: 70px; padding: 6px 12px; vertical-align: middle;
  border-bottom: 1px solid #eeebe7; background: #fff;
}
.team-overview-table td + td, .team-overview-table th + th { border-left: 1px solid #f1efec; }
.team-overview-table tbody tr:last-child > td { border-bottom: 0; }
.team-overview-table .overview-person-cell { padding-left: 16px; padding-right: 10px; }
.overview-person { display: flex; align-items: center; gap: 12px; min-width: 0; }
.overview-person .avatar { width: 42px; height: 42px; min-width: 42px; font-size: 19px; background: #eee6dc; color: #80583d; }
.overview-person > div, .overview-person > span:last-child:not(.avatar) { min-width: 0; }
.overview-person strong { display: block; max-width: 100%; color: #24394e; font-size: 13px; font-weight: 700; line-height: 21px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.overview-person small { display: block; margin-top: 1px; color: #8b9bb0; font-size: 11px; line-height: 18px; }
.team-overview-table .overview-task-cell { padding: 5px 7px; }
.overview-task-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; gap: 7px; min-width: 0; }
.overview-task-list:has(> .overview-extra) { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; align-items: center; }
.team-overview-table tr.is-expanded .overview-task-list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.team-overview-table tr.is-expanded .overview-extra { grid-column: 1 / -1; justify-self: start; }
.overview-task-preview {
  display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 100%; min-width: 0;
  min-height: 54px; margin: 0; padding: 6px 8px; border: 1px solid #f0eeeb; border-radius: 7px;
  background: #fff; color: #273b51; font-size: 12px; line-height: 18px; font-weight: 500; text-align: left;
}
button.overview-task-preview:hover, .overview-task-preview.is-selected { border-color: #bba088; background: #fffdf9; }
.overview-task-preview:focus-visible { outline-offset: 1px; }
.overview-task-top { display: flex; align-items: center; gap: 7px; min-width: 0; }
.overview-task-top .project-tag {
  flex: 0 1 auto; max-width: 104px; padding: 2px 5px; font-size: 10px; line-height: 17px;
}
.overview-task-top strong, .overview-task-top .overview-task-title {
  display: block; flex: 1 1 0; min-width: 0; color: #23364b; font-size: 12px; font-weight: 650;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.overview-task-meta { display: flex; align-items: center; gap: 9px; min-width: 0; color: #8094af; font-size: 11px; line-height: 16px; }
.overview-task-progress { display: flex; align-items: center; flex: 1 1 auto; gap: 8px; min-width: 0; }
.overview-task-progress-track { display: block; flex: 1 1 auto; min-width: 25px; height: 4px; overflow: hidden; border-radius: 4px; background: #ebe8e4; }
.overview-task-progress-track > span { display: block; height: 100%; border-radius: inherit; background: #aa8060; }
.overview-task-progress > span:last-child:not(.overview-task-progress-track), .overview-task-progress > strong { min-width: 30px; color: #7a8da7; font-size: 11px; font-weight: 450; text-align: right; font-variant-numeric: tabular-nums; }
.overview-task-meta time { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 5px; color: #8094af; font-size: 11px; white-space: nowrap; }
.overview-task-meta time.overdue, .overview-task-meta time.is-overdue { color: #ec5261; }
.overview-task-meta time > .icon { width: 12px; height: 12px; }
.overview-task-stage { display: inline-flex; flex: 0 0 auto; align-items: center; padding: 1px 4px; border-radius: 3px; background: #fff5e3; color: #ac8034; font-size: 10px; line-height: 15px; white-space: nowrap; }
.overview-extra { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; min-height: 24px; margin: 0; padding: 3px 7px; border: 0; border-radius: 4px; background: #eef5ff; color: #5e8bbf; font-size: 11px; line-height: 18px; white-space: nowrap; }
.overview-extra:hover { background: #e3effe; color: #3b74b2; }
.overview-task-counts { display: flex; align-items: center; flex-wrap: wrap; gap: 5px 14px; color: #375575; font-size: 12px; line-height: 21px; white-space: nowrap; }
.overview-task-counts strong { margin-left: 3px; font-weight: 650; font-variant-numeric: tabular-nums; }
.overview-task-counts .is-zero { color: #94a1b1; }
.overview-flags { position: relative; display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-height: 36px; padding-right: 25px; }
.overview-flags .pill, .overview-flag { display: inline-flex; align-items: center; gap: 4px; min-height: 26px; padding: 4px 7px; border: 1px solid transparent; border-radius: 5px; background: #f7f5f1; color: #8f785e; font-size: 11px; font-weight: 500; line-height: 17px; white-space: nowrap; }
.overview-flags .pill.amber, .overview-flags .pill.help, .overview-flag.help { border-color: #ffe9ca; background: #fff4e2; color: #d38b31; }
.overview-flags .pill.danger, .overview-flags .pill.overdue, .overview-flag.overdue { border-color: #ffd5da; background: #fff0f2; color: #ea4d60; }
.overview-flags .pill.blue, .overview-flags .pill.external, .overview-flag.external { border-color: #e3efff; background: #edf5ff; color: #4e8dc7; }
.overview-flags .muted { color: #a2adbb; }
.overview-row-toggle { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 22px; width: 22px; height: 30px; min-height: 30px; padding: 2px; border: 0; border-radius: 4px; background: transparent; color: #7d91ab; }
.overview-flags .overview-row-toggle { position: absolute; top: 3px; right: 0; }
.overview-row-toggle .icon { width: 17px; height: 17px; transition: transform .15s; }
.overview-row-toggle[aria-expanded="true"] .icon { transform: rotate(90deg); }
.overview-row-toggle:hover { background: #f2f5f8; color: #546f90; }
.overview-table-help {
  display: flex; align-items: center; gap: 10px; min-height: 47px; padding: 12px 16px;
  border-top: 1px solid #eeebe7; color: #8b9bb1; font-size: 12px; line-height: 21px;
}
.overview-table-help > .icon { width: 17px; height: 17px; }
.overview-empty { padding: 35px 18px; color: #8192a7; font-size: 13px; text-align: center; }

@media (max-width: 1250px) {
  .team-overview .team-summary { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
  .team-summary-note { grid-column: 1 / -1; min-height: 18px; }
  .team-summary-button { min-height: 50px; padding: 10px 14px; gap: 10px; font-size: 14px; }
  .team-summary-button strong { font-size: 17px; }
}
@media (max-width: 850px) {
  .workspace-content[data-route="board"] .board-view-tabs { margin-top: 8px; }
  .workspace .workspace-content[data-route="board"] .board-toolbar { gap: 9px; }
  .workspace .workspace-content[data-route="board"] .board-toolbar .board-extra-filters { position: static; }
  .workspace .workspace-content[data-route="board"] .board-toolbar .board-extra-filter-content { right: auto; left: 0; }
  .workspace-refresh { margin-top: 0; }
  .team-overview-heading { padding: 11px 14px; }
  .team-overview-heading h2 { font-size: 17px; line-height: 25px; }
  .team-overview-table { min-width: 1110px; }
}
@media (max-width: 550px) {
  .workspace-content[data-route="board"] .board-view-tabs { min-height: 40px; margin-top: 8px; margin-bottom: 10px; }
  .board-view-tabs:has(> .board-view-tab)::before { width: 100%; }
  .board-view-tabs > div, .board-view-tabs > [role="tablist"] { width: 100%; }
  .board-view-tabs .board-view-tab { flex: 1; min-width: 0; min-height: 33px; padding: 6px 12px; font-size: 12px; line-height: 21px; }
  .workspace .workspace-content[data-route="board"] .board-toolbar .board-filters { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); flex: 1 1 100%; width: 100%; gap: 8px; }
  .workspace .workspace-content[data-route="board"] .board-toolbar select,
  .workspace .workspace-content[data-route="board"] .board-toolbar #category-filter,
  .workspace .workspace-content[data-route="board"] .board-toolbar #assignee-filter { width: 100%; max-width: none; height: 35px; min-height: 35px; padding-left: 9px; font-size: 11px; }
  .workspace .workspace-content[data-route="board"] .board-toolbar > select,
  .workspace .workspace-content[data-route="board"] .board-toolbar > #category-filter,
  .workspace .workspace-content[data-route="board"] .board-toolbar > #assignee-filter { flex: 0 0 calc(50% - 4px); width: calc(50% - 4px); }
  .workspace .workspace-content[data-route="board"] .board-toolbar > .board-extra-filters { flex: 1 0 calc(50% - 4px); }
  .workspace .workspace-content[data-route="board"] .board-toolbar .board-extra-filters > summary { min-height: 35px; padding: 6px 10px; font-size: 11px; line-height: 21px; }
  .workspace-refresh { flex-basis: 100%; width: 100%; min-width: 0; justify-content: flex-end; gap: 10px; margin-left: 0; }
  .workspace-refresh-button.button { min-height: 36px; height: 36px; font-size: 11px; }
  .refresh-timestamp { flex-basis: 142px; font-size: 10px; }
  .refresh-status-slot { height: 25px; min-height: 25px; margin-bottom: 7px; }
  .refresh-status-message { padding-left: 5px; font-size: 10px; }
  .team-overview .team-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-bottom: 12px; }
  .team-summary-button { min-height: 46px; gap: 9px; padding: 9px 11px; font-size: 13px; line-height: 24px; }
  .team-summary-button .column-dot { flex-basis: 11px; width: 11px; min-width: 11px; height: 11px; min-height: 11px; }
  .team-summary-button strong { font-size: 16px; }
  .team-summary-note { font-size: 10px; }
  .team-overview-heading { align-items: flex-start; gap: 8px; padding: 12px; }
  .overview-heading-copy { flex-basis: 100%; gap: 3px 8px; }
  .team-overview-heading h2 { font-size: 16px; }
  .overview-heading-copy p, .overview-heading-copy > span, .team-overview-heading .hint { font-size: 11px; }
  .overview-priority-toggle { margin-left: auto; font-size: 11px; }
  .overview-table-help { align-items: flex-start; padding: 10px 12px; font-size: 11px; line-height: 19px; }
  .overview-table-help > .icon { margin-top: 1px; }
}
@media (prefers-reduced-motion: reduce) {
  .overview-row-toggle .icon, .overview-priority-toggle input::before { transition: none; }
}

/* Compact shared page chrome. Search and route actions remain available without
   a second description row taking space above the actual work. */
.workspace .workspace-header {
  height: 44px; min-height: 44px; padding: 0 22px; gap: 16px;
}


.workspace .global-search {
  flex: 0 1 400px; width: 400px; max-width: min(400px, 100%);
  height: 30px; min-height: 30px; padding: 0 10px; gap: 8px;
}
.workspace .global-search input {
  height: 28px; min-height: 28px !important; padding: 3px 0 !important;
  font-size: 11px; line-height: 20px;
}
.workspace .global-search > .icon { width: 15px; height: 15px; }
.workspace #workspace-date { font-size: 11px; line-height: 18px; }
.workspace .workspace-content,
.workspace .workspace-content:has(#board) { padding-top: 8px; }
.workspace .workspace-content .page-head,
.workspace .workspace-content:has(#board) .page-head {
  align-items: center; min-height: 36px; margin-bottom: 6px; gap: 12px;
}
.workspace .workspace-content .page-title,
.workspace .workspace-content:has(#board) .page-title {
  font-size: 24px; line-height: 32px;
}
.workspace .workspace-content .page-head .subtitle,
.workspace .workspace-content:has(#board) .page-head .subtitle { display: none; }
.workspace .workspace-content .page-head > .actions,
.workspace .workspace-content:has(#board) .page-head > .actions {
  align-items: center; padding-top: 0;
}

/* Approved board scrollbars: keep an 8px native drag target at all times,
   painting only a 3px rounded thumb on the scroller the user is using.
   Each candidate resets its own color so an active ancestor never lights up
   the independent lanes. The controller owns activation, not parent :hover. */
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
) { --board-scrollbar-thumb: transparent; scrollbar-width: thin; scrollbar-color: var(--board-scrollbar-thumb, transparent) transparent; }
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
).board-scrollbar-active { --board-scrollbar-thumb: #b9b1a8; }
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
).board-scrollbar-dragging { --board-scrollbar-thumb: #aaa198; }
@supports selector(::-webkit-scrollbar) {
  /* Non-auto standard properties take precedence over WebKit pseudo-elements
     in Chromium. States change only the custom color, keeping this reset. */
  :is(
    html:has(body.workspace-body .workspace-content[data-route="board"]),
    body.workspace-body:has(.workspace-content[data-route="board"]),
    .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
    .workspace .workspace-content[data-route="board"],
    .workspace .workspace-content[data-route="board"] #board,
    .workspace .workspace-content[data-route="board"] #board .column-cards,
    .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
  ) { scrollbar-width: auto; scrollbar-color: auto; }
}
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
)::-webkit-scrollbar { width: 8px; height: 8px; border: 0; background: transparent; }
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
)::-webkit-scrollbar-track { border: 0; background: transparent; box-shadow: none; }
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
)::-webkit-scrollbar-thumb { border: solid transparent; border-width: 3px 2px 3px 3px; border-radius: 999px; background-color: var(--board-scrollbar-thumb, transparent); background-clip: content-box; transition: background-color 160ms ease; }
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
)::-webkit-scrollbar-thumb:horizontal { border-width: 3px 3px 2px 3px; }
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
)::-webkit-scrollbar-button { display: none; width: 0; height: 0; border: 0; background: transparent; }
:is(
  html:has(body.workspace-body .workspace-content[data-route="board"]),
  body.workspace-body:has(.workspace-content[data-route="board"]),
  .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
  .workspace .workspace-content[data-route="board"],
  .workspace .workspace-content[data-route="board"] #board,
  .workspace .workspace-content[data-route="board"] #board .column-cards,
  .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
)::-webkit-scrollbar-corner { background: transparent; }
@media (prefers-reduced-motion: reduce) {
  :is(
    html:has(body.workspace-body .workspace-content[data-route="board"]),
    body.workspace-body:has(.workspace-content[data-route="board"]),
    .workspace .workspace-main:has(> .workspace-content[data-route="board"]),
    .workspace .workspace-content[data-route="board"],
    .workspace .workspace-content[data-route="board"] #board,
    .workspace .workspace-content[data-route="board"] #board .column-cards,
    .workspace .workspace-content[data-route="board"] .team-overview-table-wrap
  )::-webkit-scrollbar-thumb { transition: none; }
}

@media (max-width: 850px) {
  .workspace .workspace-header { padding-left: 16px; padding-right: 16px; }
}
@media (max-width: 550px) {
  .workspace .workspace-header { padding-left: 14px; padding-right: 14px; }
  .workspace .global-search { height: 32px; min-height: 32px; }
  .workspace .global-search input { height: 30px; min-height: 30px !important; }
  .workspace .workspace-content .page-head,
  .workspace .workspace-content:has(#board) .page-head { min-height: 34px; gap: 8px; }
  .workspace .workspace-content .page-title,
  .workspace .workspace-content:has(#board) .page-title { font-size: 22px; line-height: 30px; }
}

/* The page title is the only shared header. Search belongs to each menu's
   own tools, so it never consumes a separate full-width row above the title. */
.workspace .workspace-content,
.workspace .workspace-content:has(#board) { padding-top: 10px; }
.page-head-controls { display: flex; align-items: center; justify-content: flex-end; gap: 18px; min-width: 0; }
.page-head-controls > .actions { display: flex; align-items: center; gap: 8px; padding: 0; }
.page-head-controls #workspace-date { flex: 0 0 auto; color: #7e8c9d; white-space: nowrap; }
.workspace .global-search.content-search {
  display: flex; align-items: center; flex: 1 1 196px; width: 196px;
  min-width: 150px; max-width: 250px; height: 34px; min-height: 34px;
  margin: 0; border: 1px solid #dedbd7; border-radius: 6px; background: #fff;
}
.workspace .content-search input { height: 30px; min-height: 30px !important; }
.workspace .content-search input::placeholder { color: #9a9fa7; }
.workspace .collection-toolbar > .content-search { margin-left: auto; }
.workspace .workspace-content[data-route="board"] .board-toolbar > #project-filter { width: 156px; }
.workspace .workspace-content[data-route="board"] .board-toolbar > #category-filter { width: 124px; }
.workspace .workspace-content[data-route="board"] .board-toolbar > #assignee-filter { width: 146px; }
.workspace .workspace-content[data-route="board"] .board-toolbar { gap: 8px; }
.workspace .workspace-content[data-route="reports"] .content-search { flex: 1 1 190px; }

@media (max-width: 1100px) {
  .workspace .workspace-content[data-route="board"] .content-search { flex-basis: 180px; max-width: 230px; }
  .page-head-controls { gap: 10px; }
}
@media (max-width: 850px) {
  .workspace .workspace-content .page-head { align-items: center; }
  .page-head-controls { gap: 8px; }
  .page-head-controls #workspace-date { font-size: 10px; }
}
@media (max-width: 550px) {
  .workspace .workspace-content,
  .workspace .workspace-content:has(#board) { padding-top: 10px; }
  .workspace .workspace-content .page-head { flex-wrap: nowrap; gap: 8px; }
  .page-head-controls #workspace-date { display: none; }
  .page-head-controls > .actions { gap: 5px; }
  .workspace .global-search.content-search,
  .workspace .workspace-content[data-route="board"] .content-search {
    flex: 1 0 100%; width: 100%; min-width: 0; max-width: none; height: 34px; min-height: 34px;
  }
  .workspace .collection-toolbar > .content-search { order: 3; }
}
.workspace .workspace-content .page-head,
.workspace .workspace-content:has(#board) .page-head { min-height: 40px; }
.workspace .workspace-content,
body.drawer-open .workspace .workspace-content { padding-top: 10px; }

/* Session actions stay visible without hover. On compact navigation the
   header carries logout because the account footer is hidden. */
.sidebar-logout:hover, .sidebar-logout:focus-visible { background: #eee8e1; color: #895f42; }
.page-head-controls > .header-logout { display: none; flex: 0 0 32px; width: 32px; height: 32px; min-height: 32px; padding: 6px; }
@media (max-width: 850px) {
  .page-head-controls > .header-logout { display: inline-flex; }
}
@media (max-width: 550px) {
  .page-head-controls { gap: 5px; }
  .page-head-controls > .actions .button { padding-left: 8px; padding-right: 8px; }
}

.drawer-header-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; margin-left: auto; margin-top: -4px; }
.drawer-header:has(.drawer-header-actions) .project-tag { max-width: calc(100% - 38px); }

/* One shared notification control stays beside the title, clear of the drawer. */
.page-heading { display: flex; align-items: center; gap: 13px; min-width: 0; }
.page-heading .page-title { min-width: 0; }
.page-heading > .notification-trigger { flex: 0 0 32px; width: 32px; height: 32px; min-height: 32px; }
.workspace .workspace-content[data-route="board"] .board-utilities {
  display: flex; align-items: center; justify-content: flex-end; flex: 0 0 auto;
  gap: 8px; margin-left: auto; min-width: 0;
}
.workspace .board-utilities .workspace-refresh { position: relative; flex: 0 0 108px; width: 108px; min-width: 108px; margin: 0; gap: 0; }
.workspace .board-utilities .refresh-timestamp { position: absolute; width: 1px; height: 1px; min-width: 0; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.workspace .board-utilities .board-archive-button { flex: 0 0 auto; min-height: 34px; height: 34px; padding: 5px 9px; font-size: 11px; }
.workspace .board-utilities .workspace-refresh-button { height: 34px; min-height: 34px; padding: 5px 9px; font-size: 11px; }
@media (max-width: 850px) {
  .workspace .workspace-content[data-route="board"] .board-utilities { margin-left: auto; }
  .page-heading { gap: 9px; }
}
@media (max-width: 550px) {
  .page-heading { gap: 7px; }
  .page-heading > .notification-trigger { width: 30px; height: 30px; min-height: 30px; flex-basis: 30px; }
  .workspace .workspace-content[data-route="board"] .board-utilities { flex: 1 0 auto; justify-content: flex-end; gap: 6px; }
}

/* Approved task-detail proposal, 2026-10-30. Keep the board and member drawer
   independent while the task drawer uses one consistent information rhythm. */
#task-drawer .drawer-header { min-height: 32px; padding: 10px 14px 0; }
#task-drawer .drawer-header .project-tag { padding: 1px 5px; font-size: 10px; line-height: 16px; }
#task-drawer .drawer-header .icon-button { width: 20px; min-height: 20px; }
#task-drawer .drawer-header .icon-button .icon { width: 16px; height: 16px; }
#task-drawer .drawer-header-actions { margin-top: -2px; }
#task-drawer .drawer-content { padding: 2px 14px 14px; }
#task-drawer .drawer-content > h2 { margin-bottom: 8px; font-size: 18px; line-height: 24px; }
#task-drawer .drawer-content h3 { font-size: 12px; line-height: 18px; }
#task-drawer .drawer-properties { margin: 0; padding: 0 0 6px; gap: 12px; border-bottom: 1px solid #e7e8e9; }
#task-drawer .drawer-properties > label,
#task-drawer .drawer-properties > div { position: relative; gap: 2px; font-size: 11px; line-height: 16px; }
#task-drawer .drawer-properties > label > span,
#task-drawer .drawer-properties > div > span { color: #4a5663; }
#task-drawer .drawer-properties select { height: 28px; min-height: 28px; padding: 3px 20px 3px 22px; border-color: #d8dde2; background-color: #fff; font-size: 11px; }
#task-drawer .drawer-properties .help-trigger { width: 14px; height: 14px; min-height: 14px; flex-basis: 14px; }
#task-drawer .drawer-properties .help-trigger .icon { width: 12px; height: 12px; }
#task-drawer .drawer-properties > label:has(select)::after { content: ''; position: absolute; left: 9px; bottom: 10px; width: 8px; height: 8px; border-radius: 50%; background: #aeb5bc; pointer-events: none; }
#task-drawer .drawer-properties > label:has(#task-status-select option[value="active"]:checked)::after { background: #27a575; }
#task-drawer .drawer-properties > label:has(#task-status-select option[value="review"]:checked)::after { background: #e4a22b; }
#task-drawer .drawer-properties > label:has(#task-status-select option[value="completed"]:checked)::after { background: #789bd3; }
#task-drawer .drawer-properties > label:has(select[name="priority"] option[value="urgent"]:checked)::after { background: #eb794c; }
#task-drawer .drawer-properties > label:has(select[name="priority"] option[value="high"]:checked)::after { background: #e9ad49; }
#task-drawer .drawer-properties > label:has(select[name="priority"] option[value="low"]:checked)::after { background: #85a594; }
#task-drawer .drawer-owner { min-height: 28px; gap: 6px; color: #2d3844; font-size: 11px; }
#task-drawer .drawer-owner .avatar { width: 25px; height: 25px; font-size: 11px; }
#task-drawer .drawer-owner .owner-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; }

#task-drawer .drawer-progress { margin: 10px 0 0; padding: 0; border: 0; border-radius: 0; background: transparent; }
#task-drawer .drawer-progress:has(#task-progress-form) { display: grid; grid-template-columns: minmax(0, 1fr) 46px auto; grid-template-rows: 18px 15px auto; column-gap: 8px; }
#task-drawer .progress-heading { min-width: 0; margin-bottom: 5px; }
#task-drawer .drawer-progress:has(#task-progress-form) .progress-heading { grid-column: 1; grid-row: 1; margin: 0; }
#task-drawer .task-progress-label { color: #2c3541; font-size: 12px; line-height: 18px; }
#task-drawer #task-progress-form,
#task-drawer #task-progress-form .task-progress-controls { display: contents; }
#task-drawer #task-progress-range { grid-column: 1; grid-row: 2; height: 15px; min-height: 15px; appearance: none; background: transparent; }
#task-drawer #task-progress-range::-webkit-slider-runnable-track { height: 6px; border: 0; border-radius: 4px; background: linear-gradient(to right, #a07a59 0 var(--task-progress, 0%), #e0e3e7 var(--task-progress, 0%) 100%); }
#task-drawer #task-progress-range::-webkit-slider-thumb { appearance: none; box-sizing: border-box; width: 15px; height: 15px; margin-top: -4.5px; border: 1px solid #a07a59; border-radius: 50%; background: #fff; box-shadow: none; }
#task-drawer #task-progress-range::-moz-range-track { height: 6px; border: 0; border-radius: 4px; background: #e0e3e7; }
#task-drawer #task-progress-range::-moz-range-progress { height: 6px; border-radius: 4px; background: #a07a59; }
#task-drawer #task-progress-range::-moz-range-thumb { box-sizing: border-box; width: 15px; height: 15px; border: 1px solid #a07a59; border-radius: 50%; background: #fff; box-shadow: none; }
#task-drawer .progress-number-control { grid-column: 2; grid-row: 1 / span 2; align-self: center; height: 26px; min-height: 26px; }
#task-drawer .task-progress-controls .progress-number-control input[type="number"] { width: 28px; height: 24px; min-height: 24px; padding: 3px; font-size: 11px; text-align: center; appearance: textfield; }
#task-drawer .progress-number-control input::-webkit-inner-spin-button,
#task-drawer .progress-number-control input::-webkit-outer-spin-button { appearance: none; margin: 0; }
#task-drawer .progress-number-control > span { padding-right: 4px; font-size: 10px; }
#task-drawer .task-progress-controls .progress-save { grid-column: 3; grid-row: 1 / span 2; align-self: center; min-height: 26px; height: 26px; padding: 3px 7px; font-size: 10px; }
#task-drawer .drawer-progress .flow-hint { grid-column: 1 / -1; margin: 2px 0 0; color: #87919d; font-size: 10px; line-height: 14px; }
#task-drawer .drawer-progress .error-message { grid-column: 1 / -1; margin: 6px 0 0; }
#task-drawer .drawer-progress .error-message:empty { display: none; }
#task-drawer .progress-readonly { display: block; }
#task-drawer .progress-readonly .task-progress-track { margin: 7px 0 8px; }

#task-drawer .drawer-request { margin: 24px 0 0; padding: 0; }
#task-drawer .drawer-request > h3 { padding-right: 38px; }
#task-drawer .request-edit { top: 0; min-height: 18px; opacity: 1; color: #936846; font-size: 10px; line-height: 18px; background: transparent; }
#task-drawer .drawer-request .task-description { min-height: 0; margin-top: 4px; padding: 0; border: 0; border-radius: 0; background: transparent; color: #65717f; font-size: 11px; line-height: 18px; }
#task-drawer .drawer-checklist { margin: 8px 0 0; padding-top: 3px; border-top: 1px solid #e7e8e9; }
#task-drawer .checklist-heading { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
#task-drawer .checklist-count { flex: 0 0 auto; color: #8a95a2; font-size: 10px; line-height: 18px; font-variant-numeric: tabular-nums; }
#task-drawer .checklist-heading .help-trigger { width: 14px; height: 14px; min-height: 14px; flex-basis: 14px; }
#task-drawer .checklist-heading .help-trigger .icon { width: 12px; height: 12px; }
#task-drawer .checklist-items { gap: 1px; margin: 2px 0 0; }
#task-drawer .checklist-item { min-height: 17px; gap: 7px; color: #465261; font-size: 11px; line-height: 17px; }
#task-drawer .checklist-item:has(input:checked) > span { color: #465261; }
#task-drawer .checklist-item input[type="checkbox"] { width: 15px; height: 15px; border-color: #cbb9aa; }
#task-drawer .checklist-item input[type="checkbox"]:checked { border-color: #a77d5d; background: #a77d5d; }
#task-drawer .drawer-detail-save { display: flex; align-items: flex-end; justify-content: space-between; flex-wrap: wrap; gap: 5px 10px; margin-top: 3px; }
#task-drawer .detail-save-guide { flex: 1 1 160px; margin: 0; color: #8993a0; font-size: 10px; line-height: 14px; overflow-wrap: anywhere; }
#task-drawer .drawer-detail-save .detail-save { flex: 0 0 auto; width: auto; min-height: 26px; margin: 0 0 0 auto; padding: 3px 8px; border-color: #b7967e; color: #936846; font-size: 10px; line-height: 18px; }
#task-drawer .drawer-detail-save .error-message { flex: 1 0 100%; margin: 0; }
#task-drawer .drawer-detail-save .error-message:empty { display: none; }
/* Keep detail saving separate from help and waiting-state actions. */
#task-drawer .quick-actions { gap: 8px; margin-top: 16px; padding-top: 12px; border-top: 1px solid #e7e8e9; }
#task-drawer .quick-actions > div { gap: 3px; }
#task-drawer .quick-actions > div > .button { min-height: 28px; padding: 3px 6px; gap: 5px; border-color: #bda18b; border-radius: 4px; font-size: 11px; line-height: 20px; }
#task-drawer .quick-actions .icon { width: 14px; height: 14px; color: #956d4d; }
#task-drawer .quick-actions .help-trigger { flex-basis: 14px; width: 14px; height: 14px; min-height: 14px; }
#task-drawer .quick-actions .help-trigger .icon { width: 12px; height: 12px; color: #9ca3ab; }
#task-drawer .quick-actions + .flow-hint { margin-top: 6px; color: #8993a0; font-size: 10px; line-height: 17px; }
#task-drawer .drawer-footer { padding: 4px 14px max(4px, env(safe-area-inset-bottom)); gap: 3px; }
#task-drawer .drawer-footer > .button.primary { min-height: 28px; height: 28px; padding: 4px 8px; background: #956848; border-color: #956848; border-radius: 4px; font-size: 11px; line-height: 18px; }
#task-drawer .drawer-footer > .button.subtle { min-height: 16px; height: auto; padding: 0 6px; border: 0; color: #796b5d; font-size: 10px; line-height: 16px; }
#task-drawer .footer-guide { color: #8d96a0; font-size: 10px; line-height: 14px; }
@media (max-width: 360px) {
  #task-drawer .drawer-header { padding-left: 14px; padding-right: 14px; }
  #task-drawer .drawer-content { padding-left: 14px; padding-right: 14px; }
  #task-drawer .drawer-properties { gap: 8px; }
  #task-drawer .drawer-properties select { padding-left: 20px; padding-right: 18px; font-size: 11px; }
  #task-drawer .drawer-properties > label:has(select)::after { left: 7px; width: 7px; height: 7px; }
  #task-drawer .drawer-owner { font-size: 11px; gap: 4px; }
  #task-drawer .drawer-owner .avatar { width: 24px; height: 24px; font-size: 11px; }
  #task-drawer .quick-actions > div > .button { font-size: 10px; padding-left: 4px; padding-right: 4px; }
}

/* Project labels share one quiet treatment; project/category chart colors
   and the red/amber alert palette retain their existing meaning. The root
   selector also wins over tone rules in the later weekly-report stylesheet. */
:root .project-tag,
:root .project-tag:is(.tone-0, .tone-1, .tone-2, .tone-3, .tone-4),
:root .weekly-project-tag,
:root .weekly-project-tag:is(.tone-0, .tone-1, .tone-2, .tone-3, .tone-4) { background: #f2f0ec; color: #746a60; }

/* Only idle member bodies grow into a tall neighbour's grid row. Their
   illustration/copy group stays centered, while an all-empty row stays small. */
.member-work-panel.is-idle:has(.member-empty-illustration) .member-work-tasks { flex: 1 1 40px; min-height: 40px; justify-content: center; }
.member-work-panel.is-idle:has(.member-pool-link):has(.member-empty-illustration) .member-work-tasks { flex-basis: 56px; min-height: 56px; }
.member-work-panel.is-idle .member-work-empty:has(.member-empty-illustration) { display: flex; flex: 1 1 auto; flex-direction: row; flex-wrap: nowrap; align-items: center; align-content: center; justify-content: center; min-height: 40px; gap: 6px 8px; padding: 0 4px; text-align: left; }
.member-work-panel.is-idle .member-work-empty > .member-empty-illustration { display: block; flex: 0 0 48px; width: 48px; height: 36px; max-width: none; margin: 0; object-fit: contain; }
.member-work-panel.is-idle .member-work-empty:has(.member-empty-illustration) > span { flex: 0 1 auto; min-width: 0; max-width: calc(100% - 56px); color: #7b8795; font-size: 12px; line-height: 19px; }
.member-work-panel.is-idle .member-work-empty:has(.member-empty-illustration):has(.member-pool-link) { flex-wrap: wrap; row-gap: 2px; padding: 0 4px; }
.member-work-panel.is-idle .member-work-empty:has(.member-pool-link) > .member-empty-illustration { flex-basis: 44px; width: 44px; height: 33px; }
.member-work-panel.is-idle .member-work-empty:has(.member-empty-illustration) > .member-pool-link { flex: 0 0 100%; justify-content: center; width: 100%; min-height: 20px; margin: 0; padding: 0; font-size: 11px; line-height: 18px; text-align: center; }

/* Approved wider task detail, 2026-10-30. Member/archive drawers retain the
   shared 420px token; this remains an overlay and never resizes the board. */
@media (min-width: 1100px) {
  #task-drawer { width: 560px; inset: 0 0 0 auto; }
  #task-drawer .drawer-header { padding-left: 24px; padding-right: 24px; }
  #task-drawer .drawer-content { padding-left: 24px; padding-right: 24px; padding-bottom: 18px; }
  #task-drawer .drawer-footer { padding-left: 24px; padding-right: 24px; }
  #task-drawer .flow-state > p { flex: 1 1 240px; }
}