:root{--red: #dc2626;--red-dark: #b91c1c;--red-light: #fef2f2;--red-soft: #fee2e2;--white: #ffffff;--bg: #fefafa;--card-bg: #ffffff;--text: #1a1a1a;--text-secondary: #6b7280;--border: #f3d4d4;--sidebar-w: 220px;--sidebar-collapsed-w: 64px;--green: #16a34a;--warning: #ea580c}*{margin:0;padding:0;box-sizing:border-box}html,body,#app{height:100%;font-family:Inter,-apple-system,BlinkMacSystemFont,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;-webkit-tap-highlight-color:transparent}.app-layout{display:flex;height:100vh;height:100dvh}.sidebar{width:var(--sidebar-w);background:var(--white);border-right:1px solid var(--border);display:flex;flex-direction:column;flex-shrink:0;transition:width .3s;overflow:hidden;position:relative;z-index:50}.sidebar.collapsed{width:var(--sidebar-collapsed-w)}.sidebar-header{display:flex;align-items:center;gap:10px;padding:20px 18px;cursor:pointer;border-bottom:1px solid var(--border)}.logo{width:36px;height:36px;background:linear-gradient(135deg,var(--red),var(--red-dark));color:#fff;border-radius:10px;display:flex;align-items:center;justify-content:center;font-weight:900;font-size:14px;flex-shrink:0}.logo-text{font-size:17px;font-weight:800;color:var(--red);white-space:nowrap}.nav-list{flex:1;overflow-y:auto;padding:8px;scrollbar-width:none}.nav-list::-webkit-scrollbar{display:none}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 14px;margin:2px 0;border-radius:10px;text-decoration:none;color:var(--text-secondary);font-size:14px;font-weight:500;transition:all .2s;white-space:nowrap}.nav-item:hover{background:var(--red-light);color:var(--red)}.nav-item.active{background:var(--red);color:#fff;font-weight:700}.nav-icon{font-size:20px;width:24px;text-align:center;flex-shrink:0}.nav-label{overflow:hidden}.sidebar-toggle{padding:14px;text-align:center;cursor:pointer;color:var(--text-secondary);font-size:12px;border-top:1px solid var(--border);-webkit-user-select:none;user-select:none}.sidebar-toggle:hover{color:var(--red)}.main-content{flex:1;overflow-y:auto;scrollbar-width:none}.main-content::-webkit-scrollbar{display:none}.mobile-menu-btn{display:none;position:fixed;top:12px;left:12px;z-index:200;width:40px;height:40px;background:var(--white);border:1px solid var(--border);border-radius:10px;font-size:20px;cursor:pointer;box-shadow:0 2px 8px #00000014}.mobile-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0000004d;z-index:98}.mobile-nav{display:none;position:fixed;top:0;left:0;bottom:0;width:260px;background:var(--white);z-index:99;box-shadow:4px 0 20px #0000001a;flex-direction:column;overflow-y:auto}.mobile-nav-header{display:flex;align-items:center;gap:10px;padding:20px 18px;border-bottom:1px solid var(--border)}.fade-enter-active,.fade-leave-active{transition:opacity .2s}.fade-enter-from,.fade-leave-to{opacity:0}.slide-enter-active,.slide-leave-active{transition:transform .3s}.slide-enter-from,.slide-leave-to{transform:translate(-100%)}.card{background:var(--card-bg);border-radius:14px;padding:20px;margin:14px 0;box-shadow:0 1px 4px #0000000a;border:1px solid var(--border)}.card-title{font-size:16px;font-weight:700;margin-bottom:14px;display:flex;align-items:center;gap:8px;color:var(--red)}.section-label{font-size:13px;font-weight:700;color:var(--red);text-transform:uppercase;letter-spacing:.5px;margin:24px 0 10px;padding-left:2px}.page-container{max-width:800px;margin:0 auto;padding:24px 24px 40px}.page-header{margin-bottom:20px}.page-header h1{font-size:26px;font-weight:900;color:var(--text)}.page-header p{font-size:14px;color:var(--text-secondary);margin-top:4px}.todo-item{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--red-soft);cursor:pointer;font-size:14px}.todo-item:last-child{border:none}.todo-item.done{opacity:.45}.todo-item.done .todo-text{text-decoration:line-through}.todo-check{font-size:20px}.todo-progress{margin-top:12px;font-size:12px;color:var(--green);text-align:right;font-weight:600}@media (max-width: 768px){.sidebar{display:none}.mobile-menu-btn{display:flex;align-items:center;justify-content:center}.mobile-overlay{display:block}.mobile-nav{display:flex}.page-container{padding:16px 16px 30px}.page-container{padding-top:56px}}
