*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--primary: #7C9EE6;--primary-dark: #5B7DCE;--primary-soft: #EEF2FC;--primary-grad: linear-gradient(135deg, #7C9EE6 0%, #B59CE8 100%);--accent-blue-from: #E6ECFC;--accent-blue-to: #D2DCFA;--accent-blue-text: #3F4FB8;--accent-blue-border:#BCC9F7;--accent-green-from: #E1F5EC;--accent-green-to: #C8ECDA;--accent-green-text: #1F6A48;--accent-green-border:#A8DBC1;--accent-red-from: #FCE6E6;--accent-red-to: #F6CFCF;--accent-red-text: #9A3434;--accent-red-border: #ECB4B4;--accent-amber-from: #FCEFE0;--accent-amber-to: #F7DFC2;--accent-amber-text: #8B5A1F;--accent-amber-border:#F0CD9C;--blue: var(--primary);--blue-lt: var(--accent-blue-from);--green: #58B383;--green-lt:var(--accent-green-from);--red: #D86464;--red-lt: var(--accent-red-from);--yellow: var(--accent-amber-text);--yellow-lt:var(--accent-amber-from);--bg: #F6F7FB;--surface: #ffffff;--surface-2: #FAFBFE;--gray-50: #F9FAFB;--gray-100: #F1F3F8;--gray-200: #E5E7EF;--gray-300: #D3D7E3;--gray-400: #9AA1B3;--gray-500: #6B7280;--gray-600: #4B5563;--gray-700: #374151;--gray-800: #1F2937;--gray-900: #111827;--radius: 12px;--radius-lg: 16px;--radius-pill: 999px;--shadow-sm: 0 1px 2px rgba(15,23,42,.04), 0 1px 1px rgba(15,23,42,.02);--shadow: 0 2px 4px rgba(15,23,42,.05), 0 4px 16px rgba(15,23,42,.06);--shadow-lg: 0 10px 30px rgba(15,23,42,.1), 0 4px 12px rgba(15,23,42,.05);font-family:Inter,system-ui,-apple-system,sans-serif;font-size:15px;color:var(--gray-800);background:var(--bg);background-image:radial-gradient(at 0% 0%,rgba(124,158,230,.07) 0px,transparent 50%),radial-gradient(at 100% 0%,rgba(181,156,232,.06) 0px,transparent 50%);background-attachment:fixed;min-height:100dvh;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3{font-family:Plus Jakarta Sans,Inter,system-ui,sans-serif;letter-spacing:-.015em}a{color:inherit;text-decoration:none}.app{display:flex;flex-direction:column;min-height:100dvh}nav{background:#ffffffbf;backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);color:var(--gray-800);padding:0 1.25rem;display:flex;align-items:center;gap:.25rem;flex-wrap:wrap;border-bottom:1px solid var(--gray-200);position:sticky;top:0;z-index:100}nav .brand{font-family:Plus Jakarta Sans,Inter,sans-serif;font-weight:800;font-size:1.05rem;padding:.95rem 0;background:var(--primary-grad);-webkit-background-clip:text;background-clip:text;color:transparent;letter-spacing:-.02em;white-space:nowrap}.nav-links{display:flex;gap:.15rem;margin-left:.5rem;flex-wrap:nowrap}.nav-links a{padding:.55rem .85rem;border-radius:var(--radius);font-size:.86rem;font-weight:500;color:var(--gray-600);transition:color .15s,background .15s;white-space:nowrap}.nav-links a:hover{color:var(--gray-800);background:var(--gray-100)}.nav-links a.active{color:var(--primary);background:var(--primary-soft);font-weight:600}.icon-btn{min-height:36px;min-width:36px;padding:.4rem .7rem;background:var(--surface-2);color:var(--gray-600);border:1px solid var(--gray-200);border-radius:var(--radius-pill);cursor:pointer;font-size:.95rem;line-height:1;font-family:inherit;transition:background .15s,color .15s,border-color .15s;display:inline-flex;align-items:center;justify-content:center}.icon-btn:hover{background:var(--gray-100);color:var(--gray-900)}.icon-btn-active{background:var(--primary-soft);color:var(--primary-dark);border-color:var(--primary)}.offline-chip{padding:.3rem .7rem;background:var(--accent-amber-from);color:var(--accent-amber-text);border:1px solid var(--accent-amber-border);border-radius:var(--radius-pill);font-size:.72rem;font-weight:700;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}.offline-banner{text-align:center;padding:.55rem .9rem;background:var(--accent-amber-from);color:var(--accent-amber-text);font-size:.82rem;border-bottom:1px solid var(--accent-amber-border)}.hamburger-btn{display:none;flex-direction:column;gap:3px;width:38px;height:38px;align-items:center;justify-content:center;background:var(--surface-2);border:1px solid var(--gray-200);border-radius:var(--radius-pill);cursor:pointer;padding:0}.hamburger-btn span{display:block;width:16px;height:2px;background:var(--gray-700);border-radius:2px}.nav-drawer{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a66;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:150;opacity:0;transition:opacity .2s;pointer-events:none}.nav-drawer.is-open{opacity:1;pointer-events:auto}.nav-drawer-panel{position:absolute;top:0;right:0;bottom:0;width:78%;max-width:320px;background:var(--surface);padding:4.5rem 1.25rem 2rem;box-shadow:var(--shadow-lg);transform:translate(100%);transition:transform .25s ease;display:flex;flex-direction:column;gap:.35rem}.nav-drawer.is-open .nav-drawer-panel{transform:translate(0)}.nav-drawer-link{padding:.9rem 1rem;border-radius:var(--radius);font-size:1rem;font-weight:600;color:var(--gray-700)}.nav-drawer-link:hover{background:var(--gray-100)}.nav-drawer-link.active{color:var(--primary-dark);background:var(--primary-soft)}@media (max-width: 760px){.nav-links{display:none}.hamburger-btn{display:flex}.nav-drawer{display:block}}main{flex:1;padding:2rem 1.25rem 4rem;max-width:1080px;width:100%;margin:0 auto}.card{background:var(--surface);border:1px solid var(--gray-200);border-radius:var(--radius-lg);padding:1.4rem 1.5rem;box-shadow:var(--shadow-sm);margin-bottom:1rem;transition:box-shadow .2s,transform .2s}.card:hover{box-shadow:var(--shadow)}.card-title{font-family:Plus Jakarta Sans,Inter,sans-serif;font-size:1rem;font-weight:700;margin-bottom:1.1rem;color:var(--gray-900);letter-spacing:-.01em}.grid-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:1rem}.grid-3{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.stat{padding:1.2rem 1.3rem;border-radius:var(--radius-lg);border:1px solid transparent;position:relative;overflow:hidden;transition:transform .2s,box-shadow .2s}.stat:before{content:"";position:absolute;top:0;right:0;bottom:0;width:60%;background:radial-gradient(circle at top right,rgba(255,255,255,.5),transparent 70%);pointer-events:none}.stat:hover{transform:translateY(-2px);box-shadow:var(--shadow)}.stat .label{font-size:.74rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;opacity:.8}.stat .value{font-family:Plus Jakarta Sans,Inter,sans-serif;font-size:1.7rem;font-weight:700;margin-top:.25rem;letter-spacing:-.02em}.stat.blue{background:linear-gradient(135deg,var(--accent-blue-from) 0%,var(--accent-blue-to) 100%);color:var(--accent-blue-text);border-color:var(--accent-blue-border)}.stat.green{background:linear-gradient(135deg,var(--accent-green-from) 0%,var(--accent-green-to) 100%);color:var(--accent-green-text);border-color:var(--accent-green-border)}.stat.red{background:linear-gradient(135deg,var(--accent-red-from) 0%,var(--accent-red-to) 100%);color:var(--accent-red-text);border-color:var(--accent-red-border)}.stat.yellow{background:linear-gradient(135deg,var(--accent-amber-from) 0%,var(--accent-amber-to) 100%);color:var(--accent-amber-text);border-color:var(--accent-amber-border)}.form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.85rem}.field{display:flex;flex-direction:column;gap:.35rem}.field label{font-size:.8rem;font-weight:600;color:var(--gray-600);letter-spacing:.005em}.field input,.field select,.field textarea{border:1px solid var(--gray-200);border-radius:var(--radius);padding:.55rem .75rem;font-size:.92rem;font-family:inherit;background:var(--surface-2);transition:border-color .15s,box-shadow .15s,background .15s;width:100%;color:var(--gray-800)}.field input::placeholder{color:var(--gray-400)}.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--gray-300)}.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px #6366f11f;background:#fff}.field input[type=color]{padding:.15rem;height:42px;cursor:pointer}.field.checkbox{flex-direction:row;align-items:center;gap:.55rem;margin-top:.35rem}.field.checkbox label{font-size:.9rem;color:var(--gray-800)}.field.checkbox input{width:auto;accent-color:var(--primary)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;padding:.55rem 1.15rem;border-radius:var(--radius);font-size:.88rem;font-weight:600;cursor:pointer;border:1px solid transparent;transition:transform .12s,box-shadow .15s,background .15s,color .15s;font-family:inherit}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}.btn-primary{background:var(--primary-grad);color:#fff;box-shadow:0 4px 12px #6366f140}.btn-primary:hover{box-shadow:0 6px 18px #6366f159}.btn-danger{background:var(--red);color:#fff;box-shadow:0 4px 12px #ef444433}.btn-danger:hover{background:#dc2626}.btn-ghost{background:var(--gray-100);color:var(--gray-700)}.btn-ghost:hover{background:var(--gray-200);color:var(--gray-900)}.btn-sm{padding:.35rem .75rem;font-size:.8rem;border-radius:8px}.form-actions{display:flex;justify-content:flex-end;margin-top:1.1rem}.table-wrap{overflow-x:auto;margin:0 -.25rem}table{width:100%;border-collapse:collapse;font-size:.9rem}thead th{text-align:left;padding:.6rem .85rem;border-bottom:1px solid var(--gray-200);font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--gray-500);white-space:nowrap;background:var(--surface-2)}thead th:first-child{border-top-left-radius:10px}thead th:last-child{border-top-right-radius:10px}tbody tr{border-bottom:1px solid var(--gray-100);transition:background .12s}tbody tr:last-child{border-bottom:none}tbody td{padding:.65rem .85rem;vertical-align:middle;color:var(--gray-700)}tbody td strong{color:var(--gray-900);font-weight:600}tbody tr:hover{background:var(--surface-2)}.badge{display:inline-flex;align-items:center;gap:.35rem;padding:.2rem .65rem;border-radius:var(--radius-pill);font-size:.76rem;font-weight:600;letter-spacing:.005em}.badge-green{background:var(--accent-green-from);color:var(--accent-green-text)}.badge-red{background:var(--accent-red-from);color:var(--accent-red-text)}.badge-blue{background:var(--accent-blue-from);color:var(--accent-blue-text)}.badge-yellow{background:var(--accent-amber-from);color:var(--accent-amber-text)}.cat-badge{display:inline-flex;align-items:center;gap:.4rem;padding:.2rem .7rem .2rem .55rem;border-radius:var(--radius-pill);font-size:.78rem;font-weight:600;background:var(--gray-100);color:var(--gray-700)}.cat-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;box-shadow:0 0 0 2px #fffc inset}.cat-swatch{display:inline-block;width:18px;height:18px;border-radius:6px;vertical-align:middle;box-shadow:0 0 0 1px #0000000f,inset 0 0 0 1px #fff6}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.5rem;flex-wrap:wrap;gap:.75rem}.page-header h1{font-size:1.65rem;font-weight:800;letter-spacing:-.025em;background:linear-gradient(135deg,var(--gray-900) 0%,var(--gray-600) 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.empty{color:var(--gray-400);text-align:center;padding:2.5rem 1rem;font-size:.92rem}.error{color:var(--red);font-size:.85rem;margin-top:.5rem;padding:.6rem .9rem;background:var(--red-lt);border-radius:var(--radius);border:1px solid #fca5a5}.section-title{font-size:.95rem;font-weight:700;margin:1.25rem 0 .75rem;color:var(--gray-700)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a8c;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:200;padding:1rem;animation:fadeIn .2s ease}.modal{background:var(--surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:560px;max-height:90dvh;overflow-y:auto;padding:1.7rem;animation:slideUp .25s ease}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:1.3rem}.modal-header h2{font-size:1.15rem;font-weight:700;letter-spacing:-.015em}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}body.is-private canvas,body.is-private .progress-bar{filter:blur(6px);transition:filter .2s ease}.year-stepper{display:inline-flex;align-items:center;gap:.25rem;padding:3px;background:var(--gray-100);border-radius:var(--radius-pill)}.year-stepper button{width:32px;height:32px;border:none;background:transparent;border-radius:var(--radius-pill);font-size:1rem;font-weight:700;color:var(--gray-600);cursor:pointer;font-family:inherit;display:inline-flex;align-items:center;justify-content:center}.year-stepper button:hover{background:var(--surface);color:var(--gray-900)}.year-stepper span{font-family:Plus Jakarta Sans,Inter,sans-serif;font-weight:700;font-size:.92rem;color:var(--gray-800);min-width:44px;text-align:center;font-variant-numeric:tabular-nums}.habit-section-title{font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--gray-500);margin:1rem 0 .55rem}.habit-section-title:first-of-type{margin-top:0}.styled-select{position:relative;display:inline-flex;align-items:center}.styled-select select{-moz-appearance:none;appearance:none;-webkit-appearance:none;border:1px solid var(--gray-200);background:var(--surface-2);border-radius:var(--radius);padding:.4rem 2rem .4rem .8rem;font-size:.85rem;font-family:inherit;color:var(--gray-800);cursor:pointer;height:36px;transition:border-color .15s,background .15s}.styled-select select:hover{border-color:var(--gray-300)}.styled-select select:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 4px #6366f11f;background:#fff}.styled-select-caret{position:absolute;right:.65rem;top:50%;transform:translateY(-50%);pointer-events:none;color:var(--gray-500);font-size:.7rem}.hero-stat{padding:1.7rem 1.6rem;border-radius:var(--radius-lg);border:1px solid var(--gray-200);box-shadow:var(--shadow-sm);margin-bottom:.85rem;background:linear-gradient(135deg,#e1f5ec,#d2dcfa)}.hero-positive{background:linear-gradient(135deg,#e1f5ec,#d2dcfa)}.hero-negative{background:linear-gradient(135deg,#fde6e6,#f6cfcf)}.hero-label{font-size:.78rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gray-600);opacity:.85}.hero-value{font-family:Plus Jakarta Sans,Inter,sans-serif;font-size:2.6rem;font-weight:800;letter-spacing:-.03em;color:var(--gray-900);margin:.25rem 0 .4rem;line-height:1}.hero-positive .hero-value{color:#1f6a48}.hero-negative .hero-value{color:#9a3434}.hero-sub{font-size:.85rem;color:var(--gray-600)}.metric-strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.55rem;margin-bottom:1.25rem}.metric-pill{padding:.7rem .9rem;border-radius:var(--radius);background:var(--surface);border:1px solid var(--gray-200);display:flex;flex-direction:column;gap:.15rem}.metric-pill-label{font-size:.7rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--gray-500)}.metric-pill-value{font-family:Plus Jakarta Sans,Inter,sans-serif;font-size:1.05rem;font-weight:700;color:var(--gray-900);letter-spacing:-.015em}.metric-green{border-left:3px solid #7FD1B8}.metric-amber{border-left:3px solid #EE9D86}.metric-blue{border-left:3px solid #7C9EE6}.metric-neutral{border-left:3px solid var(--gray-300)}.highlights{gap:.85rem}.highlight{padding:1rem 1.1rem;border-radius:var(--radius);background:var(--surface-2);border:1px solid var(--gray-200);transition:transform .15s,box-shadow .15s,border-color .15s}.highlight:hover{transform:translateY(-2px);box-shadow:var(--shadow);border-color:var(--gray-300)}.highlight .label{font-size:.72rem;color:var(--gray-500);text-transform:uppercase;letter-spacing:.05em;font-weight:600}.highlight .value{font-family:Plus Jakarta Sans,Inter,sans-serif;font-size:1.15rem;font-weight:700;margin-top:.25rem;color:var(--gray-900);letter-spacing:-.01em}.highlight .sub{font-size:.82rem;color:var(--gray-500);margin-top:.3rem}.kv-row{display:flex;justify-content:space-between;padding:.45rem 0;font-size:.92rem;color:var(--gray-700)}.kv-row strong{color:var(--gray-900);font-weight:600}.progress{width:100%;height:10px;background:var(--gray-100);border-radius:var(--radius-pill);overflow:hidden}.progress-bar{height:100%;background:var(--primary-grad);border-radius:var(--radius-pill);transition:width .4s ease}.assets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1rem}@media (max-width: 640px){main{padding:1.25rem 1rem}nav{padding:0 1rem}nav a{padding:.55rem;font-size:.82rem}.page-header h1{font-size:1.4rem}.stat .value{font-size:1.45rem}.card{padding:1.15rem}}