:root{
  --bg:#F5F6F1; --panel:#FFFFFF; --ink:#2B2F2A; --muted:#6B766E;
  --brand:#2E6B4F; --brand-deep:#245840; --brand-soft:#EBF1E9;
  --accent:#E7C15A; --accent-soft:#FBF3D8;
  --line:#E3E8E0; --line-2:#D7DED3;
  --r-lg:20px; --r-md:13px; --r-sm:9px;
  --shadow:0 1px 2px rgba(43,47,42,.05), 0 10px 28px rgba(43,47,42,.06);
}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%}
body{background:var(--bg);color:var(--ink);font-family:-apple-system,"PingFang SC","Microsoft YaHei","Helvetica Neue",sans-serif;font-size:15px;line-height:1.7;-webkit-font-smoothing:antialiased}
::selection{background:rgba(46,107,79,.16)}
a{color:inherit}
.app-header{height:68px;background:var(--panel);border-bottom:1px solid var(--line);display:flex;align-items:center;gap:26px;padding:0 32px;position:sticky;top:0;z-index:20}
.brand{display:flex;align-items:center;gap:11px;text-decoration:none;min-width:0}
.brand img{height:38px;width:auto;object-fit:contain}
.brand span{display:flex;flex-direction:column;line-height:1.25}
.brand strong{font-size:16.5px;letter-spacing:.2px}
.brand small{font-size:12px;color:var(--muted)}
.app-nav{display:flex;gap:6px;margin-left:auto}
.app-nav a{text-decoration:none;font-size:14px;color:var(--muted);padding:8px 14px;border-radius:10px;transition:.15s}
.app-nav a:hover{background:var(--brand-soft);color:var(--brand-deep)}
.app-nav a.active{background:var(--brand-soft);color:var(--brand-deep);font-weight:600}

.home{max-width:1320px;margin:0 auto;padding:44px 32px 60px}
.hero{max-width:860px;margin-bottom:28px}
.eyebrow{font-size:12.5px;letter-spacing:2px;color:var(--brand);font-weight:700;margin:0 0 8px}
.hero h1{font-size:38px;line-height:1.25;margin:0 0 10px;letter-spacing:.4px}
.hero-sub{margin:0;color:var(--muted);font-size:15.5px}

.task-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.task-card{position:relative;display:flex;gap:16px;align-items:flex-start;background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:24px;text-decoration:none;box-shadow:var(--shadow);transition:.16s;overflow:hidden}
.task-card::after{content:"";position:absolute;inset:0 auto 0 0;width:4px;background:var(--brand);opacity:.75}
.task-card.case::after{background:#4C7FA6}
.task-card.plans::after{background:#B5653B}
.task-card.diagrams::after{background:#6A8B5E}
.task-card:hover{transform:translateY(-2px);border-color:var(--brand);box-shadow:0 14px 34px rgba(43,47,42,.10)}
.task-icon{flex:0 0 auto;width:46px;height:46px;border-radius:13px;background:var(--brand-soft);color:var(--brand-deep);display:flex;align-items:center;justify-content:center}
.task-card.case .task-icon{background:#E7F0F7;color:#2F5D7C}
.task-card.plans .task-icon{background:#FBEDE2;color:#9A4E2B}
.task-card.diagrams .task-icon{background:#EDF3E7;color:#4C6B3F}
.task-icon svg{width:25px;height:25px}
.task-body{display:flex;flex-direction:column;gap:5px;min-width:0;flex:1}
.task-body strong{font-size:18px;letter-spacing:.2px}
.task-body small{font-size:13px;color:var(--muted);line-height:1.6}
.task-go{flex:0 0 auto;font-size:13px;font-weight:600;color:var(--brand-deep);background:var(--brand-soft);border:1px solid var(--line);border-radius:99px;padding:6px 12px;margin-top:4px}

.recent-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:24px}
.recent-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r-lg);padding:20px 22px;box-shadow:var(--shadow);min-height:180px}
.recent-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.recent-head h2{font-size:16px;margin:0}
.recent-head a{font-size:12.5px;color:var(--brand-deep);text-decoration:none}
.recent-head a:hover{text-decoration:underline}
.recent-list{display:flex;flex-direction:column;gap:2px}
.recent-empty{color:var(--muted);font-size:13px;margin:6px 0}
.recent-item{display:flex;align-items:center;gap:10px;padding:9px 0;border-top:1px dashed var(--line);text-decoration:none}
.recent-item:first-child{border-top:none}
.recent-item:hover .ri-title{color:var(--brand-deep)}
.ri-main{display:flex;flex-direction:column;min-width:0;flex:1}
.ri-title{font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ri-sub{font-size:11.5px;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ri-links{display:flex;gap:6px;flex:0 0 auto}
.ri-links a{font-size:11.5px;text-decoration:none;color:var(--brand-deep);background:var(--brand-soft);border:1px solid var(--line);border-radius:99px;padding:3px 9px}
.ri-links a:hover{background:var(--brand);color:#fff;border-color:var(--brand)}

.ask-bar{margin-top:24px;background:var(--brand-deep);color:#fff;border-radius:var(--r-lg);padding:18px 24px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:14px}
.ask-bar a{color:#fff;font-weight:700;text-decoration:none;border-bottom:1px solid rgba(255,255,255,.55);padding-bottom:1px;white-space:nowrap}
.footnote{text-align:center;color:var(--muted);font-size:12.5px;margin:26px 0 0}
.experience-bar{padding:20px 24px;margin:0 0 24px;border:1px solid #cdddcf;border-radius:16px;background:#edf4ed;display:flex;align-items:center;gap:24px;justify-content:space-between}.experience-bar strong{font-size:17px}.experience-bar p{margin:3px 0 0;color:var(--muted);font-size:13px}.experience-actions{display:flex;gap:8px;flex-wrap:wrap}.experience-actions a,.local-actions button,.import-backup{background:#fff;border:1px solid var(--line-2);border-radius:8px;padding:8px 12px;color:var(--brand-deep);font:inherit;font-size:13px;text-decoration:none;cursor:pointer}.experience-actions a:hover,.local-actions button:hover,.import-backup:hover{border-color:var(--brand)}.works-panel{margin-top:24px;scroll-margin-top:88px}.local-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.import-backup input{display:none}.recent-head select{font:inherit;border:1px solid var(--line-2);border-radius:6px;padding:5px;background:#fff}.recent-head label{font-size:13px}#localStatus{font-size:13px;color:var(--brand-deep)}

@media (max-width:900px){
  .app-header{padding:0 16px;gap:10px}
  .brand small{display:none}
  .app-nav a{padding:7px 9px;font-size:13px}
  .home{padding:26px 16px 44px}
  .hero h1{font-size:30px}
  .task-grid,.recent-grid{grid-template-columns:1fr}
  .task-card{padding:19px}
  .ask-bar{flex-direction:column;align-items:flex-start}
  .experience-bar{flex-direction:column;align-items:flex-start;gap:12px}
}