@import"https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap";:root{--bg: #080d18;--bg-soft: #101827;--surface: rgba(16, 24, 39, .78);--surface-strong: #111a2b;--surface-muted: #182235;--border: rgba(148, 163, 184, .2);--border-strong: rgba(148, 163, 184, .34);--text: #edf4ff;--text-soft: #b7c3d5;--muted: #8997aa;--primary: #8aa2ff;--primary-strong: #a9b9ff;--primary-soft: rgba(138, 162, 255, .16);--green: #52d6ad;--green-soft: rgba(82, 214, 173, .14);--amber: #f2ba58;--amber-soft: rgba(242, 186, 88, .16);--red: #ff8585;--red-soft: rgba(255, 133, 133, .16);--shadow: 0 22px 60px rgba(0, 0, 0, .28);--shadow-soft: 0 12px 32px rgba(0, 0, 0, .22);--radius: 14px;color:var(--text);background:var(--bg);font-family:Space Grotesk,Avenir Next,Trebuchet MS,Inter,ui-sans-serif,system-ui,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}:root[data-theme=light]{--bg: #f6f8fb;--bg-soft: #eef4fb;--surface: rgba(255, 255, 255, .84);--surface-strong: #ffffff;--surface-muted: #f4f7fb;--border: rgba(148, 163, 184, .28);--border-strong: rgba(148, 163, 184, .42);--text: #172033;--text-soft: #526175;--muted: #7a889a;--primary: #4666f1;--primary-strong: #3652d7;--primary-soft: #e9eeff;--green: #10a37f;--green-soft: #e6f8f2;--amber: #d48a16;--amber-soft: #fff3d8;--red: #d04444;--red-soft: #ffe9e9;--shadow: 0 18px 50px rgba(31, 41, 55, .1);--shadow-soft: 0 10px 28px rgba(31, 41, 55, .08)}*{box-sizing:border-box}html{background:var(--bg);transition:background-color .26s ease,color .26s ease}body{letter-spacing:.012em;margin:0;min-width:320px;min-height:100vh;background:radial-gradient(circle at top left,rgba(70,102,241,.18),transparent 32rem),radial-gradient(circle at bottom right,rgba(16,163,127,.16),transparent 28rem),linear-gradient(180deg,var(--bg),var(--bg-soft))}body,button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled,select:disabled{cursor:not-allowed;opacity:.52}button,input,select,textarea,.panel,.modal,.auth-panel,.stat-card,.user-row,.task-card,.navbar{transition:background-color .22s ease,border-color .22s ease,color .22s ease,box-shadow .22s ease,transform .18s ease}.auth-layout{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 390px;gap:46px;align-items:center;min-height:100vh;width:min(1080px,calc(100% - 40px));margin:0 auto;padding:34px 0}.auth-theme-toggle{position:absolute;top:26px;right:0}.auth-copy h1{max-width:720px;margin:10px 0 14px;color:var(--text);font-size:clamp(2.5rem,6vw,4.8rem);font-weight:720;line-height:1.02;letter-spacing:.018em}.auth-copy p,.topbar p{max-width:690px;color:var(--text-soft);font-size:1rem;font-weight:430;line-height:1.72}.hero-chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}.hero-chips span{padding:9px 12px;border:1px solid var(--border);border-radius:999px;background:var(--surface);color:var(--text-soft);font-size:.86rem;font-weight:560;box-shadow:var(--shadow-soft)}.flat-illustration{position:relative;width:min(390px,100%);height:250px;margin-top:34px;border:1px solid var(--border);border-radius:26px;background:linear-gradient(145deg,rgba(138,162,255,.18),transparent 48%),var(--surface);box-shadow:var(--shadow);overflow:hidden}.illustration-window{display:flex;gap:7px;padding:17px}.illustration-window span{width:10px;height:10px;border-radius:999px;background:var(--primary);opacity:.7}.illustration-board{position:absolute;top:48px;right:24px;bottom:26px;left:24px;border-radius:20px;background:var(--surface-strong);border:1px solid var(--border)}.illustration-card{position:absolute;height:46px;border-radius:14px;box-shadow:var(--shadow-soft)}.card-one{top:26px;left:24px;width:46%;background:linear-gradient(135deg,var(--primary),var(--primary-strong))}.card-two{top:90px;right:28px;width:38%;background:linear-gradient(135deg,var(--green),#74e6c2)}.card-three{bottom:22px;left:38px;width:52%;background:linear-gradient(135deg,var(--amber),#ffd58a)}.illustration-person{position:absolute;right:26px;bottom:22px;width:70px;height:92px;border-radius:30px 30px 18px 18px;background:var(--primary-soft);border:1px solid var(--border)}.illustration-person span{position:absolute;top:-24px;left:17px;width:36px;height:36px;border-radius:50%;background:var(--amber)}.auth-panel,.panel,.modal{position:relative;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.auth-panel{overflow:hidden;padding:24px}.panel-glow{position:absolute;inset:-70px -90px auto auto;width:190px;height:190px;border-radius:50%;background:#4666f12e;filter:blur(8px);pointer-events:none}.tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;padding:5px;border:1px solid var(--border);border-radius:12px;background:var(--surface-muted)}.tabs button{min-height:40px;border:0;border-radius:9px;background:transparent;color:var(--muted);font-size:.94rem;font-weight:560}.tabs button.selected{background:var(--surface-strong);color:var(--text);box-shadow:var(--shadow-soft)}.auth-form,.modal-form{display:grid;gap:13px}.auth-form{margin-top:20px}.modal-form label{display:grid;gap:7px;color:var(--text-soft);font-size:.88rem;font-weight:620}input,select,textarea{width:100%;border:1px solid var(--border-strong);border-radius:11px;background:var(--surface-strong);color:var(--text);outline:none;font-size:.95rem;font-weight:430}input,select{min-height:43px;padding:0 13px}textarea{min-height:98px;padding:12px 13px;resize:vertical}input:focus,select:focus,textarea:focus{border-color:var(--primary);box-shadow:0 0 0 4px var(--primary-soft)}.primary,.icon-button.primary{border-color:var(--primary);background:linear-gradient(135deg,var(--primary),var(--primary-strong));color:#fff}.wide{width:100%;min-height:44px;border:0;border-radius:11px;font-weight:620}.message{margin:14px 0 0;color:var(--amber);font-size:.93rem;font-weight:620}.app-shell{width:100%;margin:0;padding:0 0 30px}.navbar{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:74px;margin-bottom:24px;padding:12px max(20px,calc((100vw - 1220px)/2));border-bottom:1px solid var(--border);background:color-mix(in srgb,var(--bg) 82%,transparent);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px)}.brand-block,.nav-actions,.topbar-actions,.name-line,.with-icon{display:flex;align-items:center;gap:10px}.brand-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:linear-gradient(135deg,var(--primary),var(--green)),var(--text);color:#fff;font-size:.82rem;font-weight:760;box-shadow:var(--shadow-soft)}.brand-block strong,.brand-block small{display:block}.brand-block strong{color:var(--text);font-size:1rem;font-weight:660}.brand-block small{margin-top:2px;color:var(--muted);font-size:.82rem;font-weight:460}.topbar{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;width:min(1220px,calc(100% - 32px));margin:0 auto 18px}.topbar h1{max-width:820px;margin:7px 0 10px;color:var(--text);font-size:clamp(2rem,4vw,3.25rem);font-weight:720;line-height:1.08;letter-spacing:.014em}.topbar p{margin:0}.eyebrow{margin:0;color:var(--primary);font-size:.75rem;font-weight:680;letter-spacing:.08em;text-transform:uppercase}.accent-text{color:var(--primary);display:inline-block;min-width:12ch}.accent-text .Typewriter{display:inline-block}.accent-text .Typewriter__cursor{color:var(--primary);font-weight:500}.dashboard-message{width:min(1220px,calc(100% - 32px));margin-left:auto;margin-right:auto;margin-bottom:16px}.stats-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;width:min(1220px,calc(100% - 32px));margin:0 auto 16px}.stat-card{min-height:98px;padding:18px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow-soft)}.stat-card:hover,.task-card:hover,.user-row:hover{transform:translateY(-2px);border-color:var(--border-strong);box-shadow:var(--shadow)}.stat-card span{display:block;margin-bottom:12px;color:var(--muted);font-size:.88rem;font-weight:560}.stat-card strong{color:var(--text);font-size:2rem;font-weight:680;line-height:1}.stat-card.green{border-left:5px solid var(--green)}.stat-card.blue{border-left:5px solid var(--primary)}.stat-card.amber{border-left:5px solid var(--amber)}.content-grid{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(0,1.35fr);gap:16px;align-items:start;width:min(1220px,calc(100% - 32px));margin:0 auto}.panel{display:flex;flex-direction:column;min-height:560px;max-height:calc(100vh - 270px);padding:18px;overflow:hidden}.panel-heading,.modal-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:14px}.panel-heading h2,.modal-heading h2{margin:4px 0 0;color:var(--text);font-size:1.12rem;font-weight:650;line-height:1.25;letter-spacing:0}.count-badge{min-width:36px;padding:6px 10px;border-radius:999px;background:var(--primary-soft);color:var(--primary);font-size:.84rem;font-weight:660;text-align:center}.icon-button,.theme-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;border:1px solid var(--border-strong);border-radius:11px;background:var(--surface);color:var(--text);box-shadow:0 1px #ffffff14 inset}.icon-button:hover:not(:disabled),.theme-toggle:hover{transform:translateY(-2px);border-color:var(--primary);box-shadow:var(--shadow-soft)}.theme-toggle{gap:8px;padding:0 12px;color:var(--text-soft);font-size:.9rem;font-weight:560}.welcome-user{display:grid;gap:1px;min-width:120px;padding:6px 12px;border:1px solid var(--border);border-radius:13px;background:var(--surface)}.welcome-user span{color:var(--muted);font-size:.68rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase}.welcome-user strong{color:var(--text);font-size:.92rem;font-weight:600;overflow-wrap:anywhere}.icon-button.spinning svg{animation:spin .7s linear infinite}.icon-button.labelled{width:auto;gap:8px;padding:0 13px;font-size:.9rem;font-weight:580}.icon-button.active{color:var(--green);background:var(--green-soft)}.icon-button.muted{color:var(--amber);background:var(--amber-soft)}.user-list,.task-list{display:grid;align-content:start;gap:10px;min-height:0;padding-right:4px;overflow-y:auto}.user-list::-webkit-scrollbar,.task-list::-webkit-scrollbar{width:8px}.user-list::-webkit-scrollbar-thumb,.task-list::-webkit-scrollbar-thumb{border-radius:999px;background:var(--border-strong)}.user-row{display:grid;grid-template-columns:minmax(0,1fr) auto auto auto;gap:10px;align-items:center;padding:12px;border:1px solid var(--border);border-radius:12px;background:var(--surface-strong)}.user-row strong,.user-row span{display:block;overflow-wrap:anywhere}.user-row strong{color:var(--text);font-size:.96rem;font-weight:620}.muted-text{margin-top:5px;color:var(--muted);font-size:.86rem;font-weight:430}.role-badge{flex:0 0 auto;padding:4px 8px;border-radius:999px;font-size:.7rem;font-weight:640;text-transform:capitalize}.role-badge.admin{color:var(--primary);background:var(--primary-soft)}.role-badge.member{color:var(--green);background:var(--green-soft)}.workload-pill{min-width:78px;padding:7px 9px;border-radius:10px;background:var(--primary-soft);text-align:center}.workload-pill b{display:block;color:var(--primary);font-size:1rem;font-weight:670}.workload-pill span{margin:0;color:var(--muted);font-size:.74rem;font-weight:560}.task-card{padding:14px;border:1px solid var(--border);border-radius:12px;background:var(--surface-strong)}.task-title-row,.task-meta{display:flex;align-items:center;justify-content:space-between;gap:12px}.task-card h3{margin:0;color:var(--text);font-size:1rem;font-weight:620;line-height:1.3;letter-spacing:0}.task-card p{margin:9px 0 13px;color:var(--text-soft);font-size:.92rem;font-weight:430;line-height:1.55}.priority{flex:0 0 auto;min-width:72px;padding:5px 9px;border-radius:999px;font-size:.74rem;font-weight:650;text-align:center;text-transform:capitalize}.priority.low{color:var(--green);background:var(--green-soft)}.priority.medium{color:var(--amber);background:var(--amber-soft)}.priority.high{color:var(--red);background:var(--red-soft)}.task-meta span{color:var(--text-soft);font-size:.9rem;font-weight:560}.task-meta select{width:154px;min-height:38px}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:30;display:grid;place-items:center;padding:18px;background:#080d187a;animation:fade-in .16s ease-out}.toast{position:fixed;top:84px;right:22px;z-index:40;max-width:min(360px,calc(100vw - 44px));padding:13px 16px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface-strong);color:var(--primary);box-shadow:var(--shadow);font-size:.92rem;font-weight:620;animation:toast-in .18s ease-out}.modal{width:min(470px,100%);max-height:calc(100vh - 36px);padding:20px;overflow-y:auto;animation:modal-in .18s ease-out}.modal.compact{width:min(420px,100%)}.profile-list{display:grid;gap:10px;margin:0}.profile-list div{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:11px 0;border-bottom:1px solid var(--border)}.profile-list dt{color:var(--muted);font-size:.88rem;font-weight:560}.profile-list dd{margin:0;color:var(--text);font-size:.92rem;font-weight:610;overflow-wrap:anywhere;text-align:right}@media (max-width: 940px){.auth-layout,.content-grid{grid-template-columns:1fr}.auth-layout{align-content:center;gap:26px}.auth-theme-toggle{position:static;justify-self:end}.auth-copy h1{font-size:2.5rem}.stats-grid{grid-template-columns:1fr}.panel{max-height:520px}}@media (max-width: 680px){.app-shell{padding-top:0}.navbar{align-items:stretch;flex-direction:column;padding-left:12px;padding-right:12px}.topbar,.nav-actions,.task-title-row,.task-meta{align-items:stretch;flex-direction:column}.nav-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.nav-actions .icon-button.labelled,.nav-actions .theme-toggle,.welcome-user{justify-content:center}.topbar h1{font-size:1.85rem}.accent-text{display:inline;min-width:0}.user-row{grid-template-columns:1fr auto}.workload-pill{grid-row:span 2}.task-meta select{width:100%}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes modal-in{0%{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
