@import url('./views.css');
:root{color-scheme:dark;--bg:#0c1423;--panel:#111d2f;--card:#172338;--line:rgba(181,202,233,.10);--text:#eaf0f9;--muted:#7f8da5;--orange:#ff742c;--green:#54c6a0;--purple:#af94f1;--blue:#7cacf5;--red:#f37875;font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:13px}

*{box-sizing:border-box}
body{margin:0;background:radial-gradient(ellipse at 92% 0%,#172139 0,transparent 48%),var(--bg);color:var(--text)}
button,input,select,textarea{font:inherit}
button{cursor:pointer;color:inherit}
button:disabled{opacity:.5;cursor:wait}
button,input,select,textarea{outline:none}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--orange);outline-offset:3px}
button{border:0;background:transparent}
button:hover{filter:brightness(1.15)}
svg{width:17px;height:17px;vertical-align:middle;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
h1,h2,h3,p{margin:0}
button span[data-icon]{display:inline-flex}
[hidden]{display:none!important}
.shell{display:flex;min-height:100vh}
.sidebar{width:232px;flex-shrink:0;background:rgba(16,26,43,.88);backdrop-filter:blur(24px);border-right:1px solid var(--line);padding:24px 17px 0;display:flex;flex-direction:column;position:fixed;inset:0 auto 0 0;z-index:3}
.traffic-lights{display:flex;gap:7px;align-items:center;margin:0 9px 33px}
.traffic-lights i{width:10px;height:10px;background:#ff625b;border-radius:50%}
.traffic-lights i:nth-child(2){background:#ffbf45}
.traffic-lights i:nth-child(3){background:#4dcc77}
.traffic-lights span{font-size:8px;letter-spacing:2px;margin-left:auto;color:#58677f}
.brand{display:flex;align-items:center;font-size:35px;font-weight:720;letter-spacing:-1.8px;padding:0 12px}
.brand-icon{font-size:42px;color:var(--orange);margin-right:10px;font-weight:400}
.brand-dot{color:var(--orange)}
.workspace-select{display:flex;align-items:center;width:100%;text-align:left;gap:10px;margin:25px 0 29px;border:1px solid var(--line);border-radius:8px;background:#ffffff03;padding:11px;font-size:11px}
.workspace-select>span:last-child{margin-left:auto;color:var(--muted)}
.workspace-monogram{padding:8px 10px;background:#344054;border-radius:6px;color:#c7d2e3;font-weight:700}
.workspace-select small{display:block;color:var(--muted);margin-top:5px;font-size:10px}
.nav-label{font-size:9px;letter-spacing:1.5px;color:#62718a;font-weight:650;margin:0 13px 12px;display:flex;justify-content:space-between}
.nav-item{display:flex;align-items:center;gap:12px;border-radius:7px;padding:11px 13px;width:100%;text-align:left;color:#95a3ba;font-size:12px;margin-bottom:4px}
.nav-item.active{background:#ff742c12;color:#ff9a62;box-shadow:inset 2px 0 var(--orange)}
.nav-item:hover{background:#ffffff07}
.nav-count{margin-left:auto;border-radius:4px;background:#ffffff08;font-size:10px;padding:2px 5px}
.nav-item.active .nav-count{background:#ff742c12;color:var(--orange)}
nav{margin-bottom:27px}
.status-dot{width:7px;height:7px;display:inline-block;border-radius:50%;flex-shrink:0;background:currentColor}
.red{color:var(--red)}
.amber,.orange{color:var(--orange)}
.green{color:var(--green)}
.purple{color:var(--purple)}
.blue{color:var(--blue)}
.pink{color:#e78fb7}
.danger{color:#f59188;background:#f3787512}
.sidebar-bottom{margin-top:auto}
.team-note{padding:19px 14px 24px;margin-top:20px;background:linear-gradient(125deg,#26334955,transparent);border:1px solid var(--line);border-radius:9px;position:relative}
.spark{display:block;font-size:23px;color:var(--orange);margin-bottom:10px}
.team-note strong{font-size:12px;font-weight:500}
.team-note p{line-height:1.7;color:var(--muted);font-size:11px;margin-top:7px}
.note-line{position:absolute;right:18px;top:24px;width:40px;height:40px;border:1px solid #ff742c33;border-radius:50%;box-shadow:6px 5px 0 #ff742c08}
.profile{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:20px 2px;border-top:1px solid var(--line);margin-top:22px}
.profile strong{font-size:11px;font-weight:500}
.profile small{display:block;font-size:10px;color:var(--muted);margin-top:4px}
.profile>span:last-child{margin-left:auto;color:var(--muted)}
.avatar{width:30px;height:30px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-weight:650;background:#263b56;border:2px solid #152135;flex-shrink:0}
.avatar.orange{background:#664132;color:#ffd7bf}
.avatar.purple{background:#483c66;color:#e3d4ff}
.avatar.blue{background:#294967;color:#c4e4ff}
.avatar.pink{background:#673c52;color:#ffd6ec}
.avatar.green{background:#2b534b;color:#c9f6e7}
.avatar.small{width:28px;height:28px}
.main-shell{margin-left:232px;width:calc(100% - 232px)}
.topbar{height:72px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;padding:0 34px;background:#13203630;backdrop-filter:blur(20px)}
.breadcrumb{display:flex;align-items:center;gap:15px;color:var(--muted);font-size:11px}
.breadcrumb strong{font-weight:500;color:#c3cede}
.project-private svg{width:12px;color:#65758e}
.top-actions{display:flex;align-items:center;gap:22px}
.live-status{color:#9cabbf;display:flex;align-items:center;gap:7px;font-size:10px}
.live-status i{height:5px;width:5px;background:var(--green);border-radius:50%;box-shadow:0 0 7px #54c6a044}
.icon-button{padding:7px;color:#8f9db3;display:inline-flex;align-items:center;justify-content:center;border-radius:6px}
.icon-button:hover{background:#ffffff08}
main{padding:32px 34px 20px;max-width:1900px;margin:auto}
.project-heading{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:29px}
.eyebrow{font-size:9px;letter-spacing:1.8px;color:#8091aa;font-weight:550}
.eyebrow>span{color:var(--orange);margin-left:8px}
h1{font-size:32px;font-weight:600;letter-spacing:-1.2px;margin:12px 0 10px}
.heading-dot{color:var(--orange)}
.project-heading p{font-size:11px;color:var(--muted)}
.heading-actions{display:flex;align-items:center;gap:18px;padding-top:25px}
.avatar-stack{display:flex;padding-left:5px}
.avatar-stack .avatar{margin-left:-6px;width:31px;height:31px}
.outline-button{border:1px solid #334056;background:#18243755;border-radius:6px;padding:9px 13px;font-size:11px;display:inline-flex;align-items:center;justify-content:center;gap:7px;white-space:nowrap}
.outline-button svg{width:14px}
.primary{background:var(--orange);border:1px solid #ff8e5144;border-radius:6px;padding:10px 15px;color:white;font-size:11px;font-weight:550;display:inline-flex;align-items:center;justify-content:center;gap:7px;box-shadow:0 3px 10px #ff742c12}
.primary svg{width:14px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-bottom:28px}
.stat{border:1px solid var(--line);border-radius:9px;background:linear-gradient(125deg,#1b29413b,#111c2b7a);padding:16px 18px;position:relative;overflow:hidden}
.stat-label{font-size:10px;color:#9aa9bf;display:flex;align-items:center;justify-content:space-between}
.stat-label svg{width:15px;color:#6f809c}
.stat-number{display:flex;align-items:center;gap:10px;margin-top:12px}
.stat-number strong{font-weight:550;font-size:28px;letter-spacing:-.7px}
.stat-number small{font-size:9px;color:var(--muted)}
.stat-mark{margin-left:auto;width:45px;height:22px;display:flex;align-items:end;gap:3px}
.stat-mark i{height:45%;width:5px;background:#7cacf536;border-radius:2px}
.stat-mark i:nth-child(2){height:70%}
.stat-mark i:nth-child(3){height:55%}
.stat-mark i:nth-child(4){height:85%}
.stat-mark i:nth-child(5){height:100%}
.stat:nth-child(2) .stat-mark i{background:#ff742c40}
.stat:nth-child(3) .stat-mark i{background:#af94f140}
.stat:nth-child(4) .stat-mark i{background:#54c6a040}
.view-bar{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);margin-bottom:21px}
.view-tabs{display:flex;gap:24px}
.tab{display:flex;align-items:center;gap:8px;font-size:11px;color:var(--muted);padding:0 0 15px;position:relative}
.tab svg{width:14px}
.tab.active{color:#f5f7fb}
.tab.active:after{content:'';position:absolute;height:2px;background:var(--orange);bottom:-1px;left:0;right:0}
.board-update{display:flex;align-items:center;gap:9px;color:#65758b;font-size:9px;padding-bottom:15px}
.board-update svg{width:14px}
.toolbar{display:flex;align-items:center;gap:10px;margin-bottom:23px}
.search{display:flex;align-items:center;gap:10px;border:1px solid var(--line);background:#15213780;border-radius:6px;padding:0 11px;width:280px;color:#71809a}
.search svg{width:14px}
.search input{width:100%;background:none;border:0;padding:10px 0;font-size:11px;color:#dbe3ef}
.search kbd{font-size:10px;border:1px solid var(--line);border-radius:3px;padding:0 4px}
.toolbar select{font-size:10px;width:150px;padding:10px;color:#a8b5c7}
.toolbar .primary{margin-left:auto}
.board{display:grid;grid-template-columns:repeat(4,minmax(220px,1fr));gap:17px;align-items:start;overflow-x:auto;padding-bottom:12px;min-height:430px}
.column{border:1px solid #a3bbdb09;border-radius:10px;background:#121e3070;padding:11px;min-height:425px;transition:.15s}
.column.drag-over{border-color:var(--orange);background:#ff742c09}
.column-header{display:flex;align-items:center;gap:8px;padding:4px 2px 15px;font-size:11px}
.column-header h2{font-size:11px;font-weight:550}
.column-header .count{font-size:9px;background:#ffffff07;border:1px solid var(--line);border-radius:4px;padding:2px 5px;color:#99a9bd}
.column-header button{margin-left:auto;padding:1px;color:#7889a2}
.column-header svg{width:14px}
.card{background:linear-gradient(140deg,#1b293e,#162235);border:1px solid #a9bed315;box-shadow:0 4px 8px #0000000a;border-radius:8px;padding:15px;margin-bottom:11px;cursor:grab;transition:transform .15s,border-color .15s}
.card:hover{border-color:#7990b74d;transform:translateY(-2px)}
.card.dragging{opacity:.4}
.card.overdue{border-color:#e36e5c5c;background:linear-gradient(140deg,#36292f50,#182437);box-shadow:0 0 17px #ff493b09}
.card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:13px}
.tag{font-size:8px;padding:4px 6px;border-radius:4px;background:#ffffff05;font-weight:500;letter-spacing:.1px}
.tag.purple{background:#a58ce814}
.tag.blue{background:#6da6ef14}
.tag.pink{background:#e98eb414}
.tag.orange{background:#ff742c12}
.tag.green{background:#54c6a014}
.card-menu{color:#75859d;letter-spacing:2px;font-size:11px;padding:0 2px}
.card h3{font-size:12px;line-height:1.6;font-weight:550;margin-bottom:7px;color:#e1e8f3}
.card p{font-size:10px;color:#8797b0;line-height:1.7;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;min-height:34px}
.card-meta{display:flex;align-items:center;justify-content:space-between;margin-top:16px;gap:3px}
.priority{font-size:8px;display:inline-flex;align-items:center;gap:5px;color:#9ba8bc}
.priority i{height:5px;width:5px;border-radius:50%;background:currentColor}
.priority.high{color:#e8b674}
.priority.urgent{color:#ee8c82}
.priority.low{color:#85b2af}
.countdown{font-size:8px;font-variant-numeric:tabular-nums;display:flex;gap:4px;align-items:center;color:#9aa9bf;white-space:nowrap}
.countdown svg{width:10px;height:10px}
.overdue .countdown{color:#fa9385;background:#ef685b10;padding:4px 5px;border:1px solid #ef685b25;border-radius:4px;box-shadow:0 0 8px #ef685b15}
.card-footer{display:flex;align-items:center;border-top:1px solid var(--line);padding-top:11px;margin-top:12px;justify-content:space-between}
.card-footer .avatar{width:24px;height:24px;font-size:7px}
.card-footer .avatar-stack{padding-left:4px}
.card-id{font-size:8px;letter-spacing:.6px;color:#62738b}
.card-footer-right{display:flex;align-items:center;gap:8px;color:#7c8ba3;font-size:9px}
.card-footer-right svg{width:11px}
.add-task{width:100%;display:flex;align-items:center;justify-content:center;gap:6px;padding:10px;border:1px dashed #8095b025;border-radius:6px;color:#8090a9;font-size:10px}
.add-task svg{width:12px}
.add-task:hover{color:var(--orange);border-color:#ff742c55}
.board-footer{display:flex;justify-content:space-between;color:#64758f;font-size:9px;padding-top:16px;border-top:1px solid #ffffff05}
.board-footer>span{display:flex;align-items:center;gap:7px}
.board-footer .status-dot{width:5px;height:5px}


.sidebar{overflow-y:auto;scrollbar-width:thin}

.brand-name{font-size:25px;line-height:1.05;letter-spacing:-.8px}
.brand-name>span{display:block;font-size:19px;letter-spacing:.2px;margin-top:4px}
@media(max-width:760px){.sidebar .brand-name{display:none}}