.charts{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-4);margin:var(--space-5) 0 var(--space-6)}.chart-box{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4)}.chart-box h3{font-size:13px;font-weight:500;color:var(--color-text-muted);margin-bottom:var(--space-3)}.chart-box .chart-canvas-wrap{height:220px;position:relative}@media (max-width: 720px){.charts{grid-template-columns:1fr}}.container{max-width:1080px;margin:0 auto;padding:var(--space-6) var(--space-5) var(--space-7)}.page-header{display:flex;align-items:baseline;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-5);flex-wrap:wrap}.page-title{font-size:22px;color:var(--color-text);margin:0}.page-subtitle{color:var(--color-text-muted);font-size:14px;margin-top:var(--space-1)}.navbar{background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:0 var(--space-5);display:flex;align-items:center;justify-content:space-between;height:58px;position:sticky;top:0;z-index:10}.navbar-inner{max-width:1080px;margin:0 auto;width:100%;display:flex;align-items:center;justify-content:space-between}.logo{font-size:16px;font-weight:700;letter-spacing:.2px;color:var(--color-text);text-decoration:none;display:flex;align-items:center;gap:var(--space-2)}.logo-mark{width:22px;height:22px;border-radius:var(--radius-sm);background:var(--color-primary);color:#fff;font-size:12px;font-weight:700;display:flex;align-items:center;justify-content:center}.nav-links{display:flex;align-items:center;gap:var(--space-2)}.nav-link{color:var(--color-text-muted);text-decoration:none;font-size:14px;font-weight:500;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm)}.nav-link:hover{color:var(--color-text);background:var(--color-bg)}.nav-link.active{color:var(--color-primary);background:var(--color-primary-light)}.nav-toggle{display:none}.notification-bar{padding:var(--space-3) var(--space-4);border-radius:var(--radius-sm);margin-bottom:var(--space-4);font-size:14px;border:1px solid transparent}.notification-bar.info{background:var(--color-primary-light);color:var(--color-primary-dark);border-color:#cddaf0}.notification-bar.success{background:var(--color-success-bg);color:var(--color-success);border-color:#c9e6d3}.notification-bar.error{background:var(--color-danger-bg);color:var(--color-danger);border-color:#f2cdc8}.task-success-toast{position:fixed;top:24px;right:24px;z-index:1000;display:flex;align-items:center;gap:12px;max-width:min(390px,calc(100vw - 32px));padding:16px 18px;color:#14532d;background:#f0fdf4;border:1px solid #bbf7d0;border-radius:14px;box-shadow:0 14px 35px #14532d29;animation:toast-enter .24s ease-out}.task-success-toast__icon{display:grid;flex:0 0 32px;width:32px;height:32px;place-items:center;color:#fff;background:#22c55e;border-radius:50%;font-size:18px;font-weight:700}.task-success-toast strong,.task-success-toast span{display:block}.task-success-toast strong{font-size:14px}.task-success-toast span{margin-top:3px;color:#3f6b4e;font-size:13px}@keyframes toast-enter{0%{opacity:0;transform:translateY(-12px) translate(12px)}to{opacity:1;transform:translateY(0) translate(0)}}.card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-5)}.overview-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4);margin-bottom:var(--space-5)}.stat-card{background:var(--color-surface);border:1px solid var(--color-border);border-left:3px solid var(--color-border-strong);border-radius:var(--radius-md);padding:var(--space-4) var(--space-5)}.stat-card h3{font-size:13px;font-weight:500;color:var(--color-text-muted);margin-bottom:var(--space-2)}.stat-card span{font-size:28px;font-weight:700;color:var(--color-text)}.stat-card.total{border-left-color:var(--color-primary)}.stat-card.completed{border-left-color:var(--color-success)}.stat-card.completed span{color:var(--color-success)}.stat-card.pending{border-left-color:var(--color-warning)}.stat-card.pending span{color:var(--color-warning)}.stat-card.total span{color:var(--color-primary)}.table-wrap{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);overflow:hidden}table{width:100%;border-collapse:collapse;font-size:14px}thead th{background:var(--color-bg);color:var(--color-text-muted);font-weight:600;font-size:12.5px;text-align:left;padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border)}td{padding:var(--space-3) var(--space-4);border-bottom:1px solid var(--color-border);vertical-align:middle;color:var(--color-text)}tbody tr:last-child td{border-bottom:none}tbody tr:hover{background:var(--color-bg)}.row-actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.badge{display:inline-block;padding:3px 9px;border-radius:999px;font-size:12px;font-weight:600}.badge-success{background:var(--color-success-bg);color:var(--color-success)}.badge-pending{background:var(--color-warning-bg);color:var(--color-warning)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:8px 14px;border-radius:var(--radius-sm);border:1px solid transparent;cursor:pointer;font-weight:500;font-size:13.5px;text-decoration:none;line-height:1.2;transition:background-color .12s ease,border-color .12s ease}.btn:disabled{opacity:.6;cursor:not-allowed}.btn-sm{padding:5px 10px;font-size:12.5px}.btn-primary{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.btn-primary:hover{background:var(--color-primary-dark);border-color:var(--color-primary-dark)}.btn-secondary{background:var(--color-surface);border-color:var(--color-border-strong);color:var(--color-text)}.btn-secondary:hover{background:var(--color-bg)}.btn-success{background:var(--color-surface);border-color:#bfe0cb;color:var(--color-success)}.btn-success:hover{background:var(--color-success-bg)}.btn-danger{background:var(--color-surface);border-color:#edc4bf;color:var(--color-danger)}.btn-danger:hover{background:var(--color-danger-bg)}.btn-warning{background:var(--color-surface);border-color:#ecd3a5;color:var(--color-warning)}.btn-warning:hover{background:var(--color-warning-bg)}.btn-info{background:var(--color-surface);border-color:var(--color-border-strong);color:var(--color-primary)}.btn-info:hover{background:var(--color-primary-light);border-color:#cddaf0}.form-card{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-5);max-width:520px}.field{margin-bottom:var(--space-4)}.field label{display:block;font-size:13px;font-weight:500;color:var(--color-text-muted);margin-bottom:var(--space-1)}.field-hint{font-size:12px;color:var(--color-text-faint);margin-top:var(--space-1)}input,textarea{width:100%;padding:9px 11px;border-radius:var(--radius-sm);border:1px solid var(--color-border-strong);font-size:14px;font-family:inherit;color:var(--color-text);background:var(--color-surface)}textarea{resize:vertical;min-height:80px}input:focus,textarea:focus{outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px var(--color-primary-light)}input::placeholder,textarea::placeholder{color:var(--color-text-faint)}.form-actions{display:flex;gap:var(--space-3);margin-top:var(--space-5)}.state-block{text-align:center;padding:var(--space-7) var(--space-4);color:var(--color-text-muted);border:1px dashed var(--color-border-strong);border-radius:var(--radius-md);background:var(--color-surface)}.state-block h3{color:var(--color-text);margin-bottom:var(--space-2)}.state-block p{margin-bottom:var(--space-4);max-width:360px;margin-left:auto;margin-right:auto}.spinner{width:18px;height:18px;border:2px solid var(--color-border-strong);border-top-color:var(--color-primary);border-radius:50%;display:inline-block;animation:spin .7s linear infinite;vertical-align:middle}@keyframes spin{to{transform:rotate(360deg)}}.hero{padding:var(--space-7) 0 var(--space-6)}.hero-eyebrow{color:var(--color-primary);font-size:13px;font-weight:600;margin-bottom:var(--space-2)}.hero h1{font-size:34px;max-width:620px}.hero p{font-size:16px;max-width:520px}.hero-actions{display:flex;gap:var(--space-3);margin-top:var(--space-4)}.feature-section{margin:var(--space-7) 0}.section-heading{font-size:18px;margin-bottom:var(--space-4)}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-4)}.feature-item{background:var(--color-surface);border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-4)}.feature-item .feature-icon{width:32px;height:32px;border-radius:var(--radius-sm);background:var(--color-primary-light);color:var(--color-primary);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;margin-bottom:var(--space-3)}.feature-item h4{font-size:14.5px;margin-bottom:var(--space-1);color:var(--color-text)}.feature-item p{font-size:13.5px;margin:0}.how-it-works{margin:var(--space-7) 0}.workflow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4)}.workflow-card{position:relative;padding-top:var(--space-3)}.workflow-card .step{display:inline-block;font-size:12px;font-weight:700;color:var(--color-primary);margin-bottom:var(--space-2)}.workflow-card h4{font-size:14.5px;margin-bottom:var(--space-1)}.workflow-card p{font-size:13.5px;margin:0}.task-view-table{width:100%}.task-view-table th{width:30%;background:var(--color-bg);font-weight:500;text-align:left;color:var(--color-text-muted);font-size:13px}.task-view-table td{background:var(--color-surface);text-align:left}@media (max-width: 860px){.overview-cards{grid-template-columns:1fr}.feature-grid,.workflow-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width: 640px){.container{padding:var(--space-5) var(--space-4) var(--space-6)}.navbar{padding:0 var(--space-4)}.nav-links{gap:0}.nav-link{padding:var(--space-2);font-size:13px}.logo span.logo-text{display:none}.feature-grid,.workflow-grid{grid-template-columns:1fr}.hero h1{font-size:26px}.table-wrap{overflow-x:auto}table{min-width:640px}.form-card{max-width:none}}.navbar{background:rgba(255,255,255,.84);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border-bottom-color:#dde1e8cc}.logo-mark{width:32px;height:32px;background:linear-gradient(135deg,var(--color-primary),#ab5ee8)}.nav-link{transition:color .2s ease,background-color .2s ease,transform .2s ease}.nav-link:hover{transform:translateY(-1px)}.nav-add-task{display:inline-flex;align-items:center;gap:6px;padding:8px 12px;color:#fff;background:linear-gradient(135deg,var(--color-primary),#8a5af4);border-radius:999px;box-shadow:0 6px 14px #635bff40;font-size:13px;font-weight:600;text-decoration:none;transition:transform .2s ease,box-shadow .2s ease}.nav-add-task:hover{color:#fff;transform:translateY(-2px);box-shadow:0 10px 18px #635bff4d}.card,.table-wrap,.chart-box{box-shadow:var(--shadow-sm)}.stat-card{box-shadow:var(--shadow-sm);transition:transform .22s ease,box-shadow .22s ease}.stat-card:hover,.feature-item:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}.btn{transition:background-color .18s ease,border-color .18s ease,transform .18s ease,box-shadow .18s ease}.btn:hover:not(:disabled){transform:translateY(-2px)}.btn-primary{background:linear-gradient(135deg,var(--color-primary),#8564f6)}.btn-primary:hover{background:linear-gradient(135deg,var(--color-primary-dark),#744bdc);box-shadow:0 8px 18px #635bff3d}.form-card{max-width:560px;box-shadow:var(--shadow-md)}.field label svg{vertical-align:-3px;margin-right:4px;color:var(--color-primary)}.field label span{color:var(--color-text-faint);font-weight:400}input,textarea{background:#fcfcff;transition:border-color .18s ease,box-shadow .18s ease,background-color .18s ease}.hero{min-height:480px;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(300px,.9fr);align-items:center;gap:var(--space-7);padding:68px 0 56px}.hero-eyebrow{display:flex;align-items:center;gap:8px;color:#6959d6}.eyebrow-pulse{width:8px;height:8px;border-radius:50%;background:#f68f55;box-shadow:0 0 0 5px #fff0e8}.hero h1{font-size:clamp(36px,4vw,53px);letter-spacing:-1.9px}.hero h1 span{color:var(--color-primary)}.hero p{font-size:17px}.hero-trust{display:flex;align-items:center;gap:7px;margin-top:18px;color:#367a59;font-size:13px;font-weight:600}.hero-visual{position:relative;min-height:340px;display:grid;place-items:center}.hero-orb{position:absolute;border-radius:50%;filter:blur(1px)}.hero-orb--one{width:285px;height:285px;background:linear-gradient(135deg,#e8e5ff,#d7f4ec)}.hero-orb--two{width:70px;height:70px;right:4%;top:7%;background:#ffd7c5;animation:float 4s ease-in-out infinite}.reminder-card{position:absolute;background:rgba(255,255,255,.94);border:1px solid rgba(255,255,255,.95);box-shadow:0 20px 45px #463b9129;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.reminder-card--main{z-index:1;width:270px;padding:22px;border-radius:22px;animation:float 5s ease-in-out infinite}.reminder-card__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:21px}.reminder-icon{width:39px;height:39px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#8062f5,#b06ce5);border-radius:13px}.reminder-dot{width:9px;height:9px;background:#51bc83;border-radius:50%;box-shadow:0 0 0 5px #e5f7ed}.reminder-card p{margin-bottom:3px;font-size:12px;font-weight:600;color:var(--color-text-faint)}.reminder-card h3{font-size:17px;margin-bottom:13px}.reminder-time{display:flex;align-items:center;gap:6px;padding-top:12px;border-top:1px solid #eceaf6;color:#665d80;font-size:12px;font-weight:600}.reminder-card--small{z-index:2;bottom:23px;left:8%;display:flex;align-items:center;gap:8px;padding:11px 14px;color:#2c8057;border-radius:13px;font-size:12px;font-weight:700;animation:float 4.2s .4s ease-in-out infinite}@keyframes float{50%{transform:translateY(-9px)}}.feature-item{box-shadow:var(--shadow-sm);transition:transform .22s ease,box-shadow .22s ease}.feature-icon--2{background:#fff1e8!important;color:#e77a44!important}.feature-icon--3{background:#e7f7ee!important;color:#2f9462!important}.feature-icon--4{background:#ffefed!important;color:#df705d!important}.feature-icon--5{background:#e4f5fc!important;color:#348fb9!important}.feature-icon--6{background:#f8eafa!important;color:#a84aad!important}.workflow-card .step{display:grid;width:30px;height:30px;place-items:center;border-radius:10px;background:var(--color-primary-light)}.task-form-page{min-height:calc(100vh - 58px);padding:54px 24px 70px;display:flex;flex-direction:column;align-items:center}.form-intro{max-width:520px;text-align:center;margin-bottom:26px}.form-intro__icon{width:48px;height:48px;display:grid;place-items:center;margin:0 auto 14px;border-radius:16px;color:#fff;background:linear-gradient(135deg,var(--color-primary),#a65fe6);box-shadow:0 12px 24px #635bff3d}.form-kicker{color:#8364d5!important;font-size:12px!important;font-weight:700;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px!important}.form-intro h1{font-size:32px;letter-spacing:-.8px;margin-bottom:8px}.form-intro>p:last-child{margin:0}.task-form-page .form-card{width:min(560px,100%)}.reminder-input{position:relative}.reminder-input input{padding-right:82px}.reminder-input span{position:absolute;right:12px;top:50%;transform:translateY(-50%);color:var(--color-text-faint);font-size:13px;pointer-events:none}@media (max-width: 720px){.hero{min-height:0;grid-template-columns:1fr;gap:12px;padding-top:42px}.hero-visual{min-height:300px}.nav-add-task{font-size:0;padding:9px}.nav-add-task svg{width:17px;height:17px}}:root{--color-bg: #f7f8ff;--color-surface: #ffffff;--color-border: #dde1e8;--color-border-strong: #c7ccd6;--color-text: #1f2430;--color-text-muted: #616a7a;--color-text-faint: #8b93a3;--color-primary: #635bff;--color-primary-dark: #4d46d7;--color-primary-light: #eeedff;--color-success: #2f7d4f;--color-success-bg: #e7f5ec;--color-danger: #b3352c;--color-danger-bg: #fbe9e7;--color-warning: #a3620f;--color-warning-bg: #fdf1de;--font-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--font-mono: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 24px;--space-6: 32px;--space-7: 48px;--radius-sm: 9px;--radius-md: 18px;--shadow-sm: 0 4px 12px rgba(49, 45, 112, .06);--shadow-md: 0 14px 35px rgba(49, 45, 112, .1)}*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:radial-gradient(circle at 90% 0%,#fbeeff 0,transparent 25rem),var(--color-bg);color:var(--color-text);font-family:var(--font-base);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased}#root{min-height:100vh}h1,h2,h3,h4{margin:0 0 var(--space-2);font-weight:600;line-height:1.25;color:var(--color-text)}h1{font-size:28px}h2{font-size:21px}h3{font-size:16px}p{margin:0 0 var(--space-3);color:var(--color-text-muted)}a{color:var(--color-primary)}button{font-family:inherit}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--color-primary);outline-offset:2px}@media (prefers-reduced-motion: reduce){*{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}