:root{--bg: #0f1420;--panel: #161d2e;--panel2: #1c2740;--line: #26314d;--txt: #e7ecf5;--muted: #8b97b3;--accent: #3d8bff;--ok: #25c281;--radius: 14px}*{box-sizing:border-box}body{margin:0;font-family:Segoe UI,system-ui,Roboto,Arial,sans-serif;background:linear-gradient(180deg,#0b0f18,#0f1420);color:var(--txt);-webkit-font-smoothing:antialiased;min-height:100vh}header{padding:28px 32px 12px;border-bottom:1px solid var(--line)}h1{margin:0;font-size:22px;letter-spacing:.3px}h1 span{color:var(--accent)}.sub{color:var(--muted);font-size:13px;margin-top:4px}.wrap{max-width:1080px;margin:0 auto;padding:24px 32px 80px}.status{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);margin-top:6px}.status .dot{width:8px;height:8px;border-radius:50%;background:var(--muted)}.status.online .dot{background:var(--ok);box-shadow:0 0 8px var(--ok)}.status.offline .dot{background:#f0556b}.overview{display:grid;grid-template-columns:220px 1fr;gap:24px;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:24px;margin:24px 0}.ring{position:relative;width:180px;height:180px;margin:auto}.ring svg{transform:rotate(-90deg)}.ring .pct{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;flex-direction:column;align-items:center;justify-content:center}.ring .pct b{font-size:38px}.ring .pct small{color:var(--muted);font-size:12px}.stats{display:flex;flex-direction:column;gap:14px;justify-content:center}.statline{display:flex;align-items:center;gap:12px;font-size:14px}.statline .d{width:10px;height:10px;border-radius:50%}.statline b{font-variant-numeric:tabular-nums}.btns{display:flex;gap:10px;margin-top:8px;flex-wrap:wrap}button{background:var(--panel2);color:var(--txt);border:1px solid var(--line);padding:8px 14px;border-radius:9px;cursor:pointer;font-size:13px;transition:.15s}button:hover{border-color:var(--accent);color:#fff}h2{font-size:15px;color:var(--muted);text-transform:uppercase;letter-spacing:1px;margin:32px 0 14px}.timeline{display:flex;gap:6px;overflow-x:auto;padding-bottom:8px}.tl-node{flex:1;min-width:96px;text-align:center}.tl-bar{height:8px;background:var(--panel2);border-radius:6px;overflow:hidden;margin-bottom:8px}.tl-bar>i{display:block;height:100%;background:var(--accent);border-radius:6px;transition:width .4s}.tl-node.done .tl-bar>i{background:var(--ok)}.tl-num{font-size:11px;color:var(--muted)}.tl-name{font-size:11px;margin-top:2px;line-height:1.3;height:30px;overflow:hidden}.tl-pct{font-size:12px;font-weight:700;margin-top:4px}.section-head{display:flex;align-items:center;justify-content:space-between;margin:32px 0 14px}.section-head h2{margin:0}.view-toggle{display:flex;gap:4px;background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:3px}.view-toggle button{background:transparent;border:none;padding:6px 14px;border-radius:8px;font-size:13px;color:var(--muted)}.view-toggle button:hover{color:var(--txt)}.view-toggle button.active{background:var(--accent);color:#fff;box-shadow:0 2px 8px #3d8bff66}.chart-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:20px 16px 12px}.chart-svg{width:100%;height:auto;display:block}.chart-bar{transform-box:fill-box;transform-origin:bottom;animation:barGrow .7s cubic-bezier(.2,.8,.2,1) both}@keyframes barGrow{0%{transform:scaleY(0)}to{transform:scaleY(1)}}.chart-area{opacity:0;animation:fadeIn .6s ease .5s forwards}.chart-line{stroke-dasharray:2000;stroke-dashoffset:2000;animation:drawLine 1.4s ease .4s forwards;filter:drop-shadow(0 0 6px rgba(155,92,255,.7))}@keyframes drawLine{to{stroke-dashoffset:0}}.chart-dot{opacity:0;animation:popDot .3s ease both}@keyframes popDot{0%{opacity:0;transform:scale(0)}to{opacity:1;transform:scale(1)}}.chart-legend{display:flex;flex-wrap:wrap;align-items:center;gap:18px;padding:10px 8px 4px;font-size:12px;color:var(--muted)}.chart-legend i{display:inline-block;vertical-align:middle;margin-right:6px}.lg-bar{width:14px;height:10px;border-radius:3px;background:linear-gradient(0deg,#3d8bff,#25c281)}.lg-line{width:18px;height:3px;border-radius:3px;background:#9b5cff;box-shadow:0 0 6px #9b5cffb3}.chart-global{margin-left:auto;color:var(--txt)}.chart-global b{color:var(--accent);font-size:14px}.roadmap{position:relative;padding:8px 0 8px 8px;margin-bottom:8px}.roadmap-line{position:absolute;left:27px;top:20px;bottom:20px;width:4px;background:var(--panel2);border-radius:4px;overflow:hidden}.roadmap-line-fill{width:100%;border-radius:4px;background:linear-gradient(180deg,#25c281,#3d8bff,#9b5cff);background-size:100% 300%;box-shadow:0 0 12px #3d8bff99;transition:height .8s cubic-bezier(.2,.8,.2,1);animation:flow 4s linear infinite}@keyframes flow{0%{background-position:0 0}to{background-position:0 300%}}.rm-item{position:relative;display:flex;align-items:stretch;gap:18px;padding:9px 0 9px 44px;animation:slideIn .5s ease both;animation-delay:calc(var(--i) * .07s)}@keyframes slideIn{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}.rm-node{position:absolute;left:8px;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;z-index:2}.rm-node-inner{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:15px;border:3px solid var(--line);background:var(--panel);color:var(--muted);transition:.3s}.rm-item.done .rm-node-inner{background:var(--ok);color:#04371f;border-color:var(--ok);box-shadow:0 0 16px #25c281b3}.rm-item.active .rm-node-inner{background:var(--accent);color:#fff;border-color:var(--accent);box-shadow:0 0 20px #3d8bffe6}.rm-pulse{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:3px solid var(--accent);animation:pulse 1.8s ease-out infinite}@keyframes pulse{0%{transform:scale(1);opacity:.9}to{transform:scale(2);opacity:0}}.rm-card{flex:1;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:14px 18px;transition:.25s}.rm-item.active .rm-card{border-color:var(--accent);box-shadow:0 0 0 1px var(--accent),0 8px 24px #3d8bff2e}.rm-item.done .rm-card{border-color:#25c28166}.rm-item.upcoming .rm-card{opacity:.7}.rm-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}.rm-phase{font-size:11px;letter-spacing:1px;color:var(--muted);font-weight:700}.rm-badge{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.5px;padding:3px 9px;border-radius:20px;background:var(--panel2);color:var(--muted)}.rm-item.done .rm-badge{background:#25c28126;color:var(--ok)}.rm-item.active .rm-badge{background:#3d8bff33;color:var(--accent)}.rm-name{font-size:15px;font-weight:600;margin-bottom:10px}.rm-bar{position:relative;height:20px;background:var(--panel2);border-radius:20px;overflow:hidden}.rm-bar-fill{height:100%;border-radius:20px;background:linear-gradient(90deg,#3d8bff,#25c281);transition:width .8s cubic-bezier(.2,.8,.2,1)}.rm-item.upcoming .rm-bar-fill{background:var(--panel2)}.rm-pct{position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:11px;font-weight:800;color:#fff;font-variant-numeric:tabular-nums;text-shadow:0 1px 3px rgba(0,0,0,.5)}.phase{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);margin-bottom:14px;overflow:hidden}.phase-head{display:flex;align-items:center;gap:14px;padding:16px 18px;cursor:pointer;-webkit-user-select:none;user-select:none}.phase-head .idx{width:30px;height:30px;border-radius:8px;background:var(--panel2);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;flex-shrink:0}.phase.complete .idx{background:var(--ok);color:#04371f}.phase-title{flex:1;font-size:15px;font-weight:600}.phase-mini{width:160px}.phase-mini .tl-bar{margin:0}.phase-pct{width:52px;text-align:right;font-variant-numeric:tabular-nums;font-weight:700;font-size:14px}.chev{color:var(--muted);transition:.2s;font-size:12px}.phase.open .chev{transform:rotate(90deg)}.tasks{padding:4px 18px 14px;border-top:1px solid var(--line)}.task{display:flex;align-items:flex-start;gap:12px;padding:10px 4px;border-bottom:1px solid rgba(255,255,255,.04);font-size:14px;line-height:1.5}.task:last-child{border-bottom:none}.task input{margin-top:3px;width:17px;height:17px;accent-color:var(--ok);cursor:pointer;flex-shrink:0}.task label{cursor:pointer;color:var(--txt)}.task.checked label{color:var(--muted);text-decoration:line-through}.task.saving{opacity:.55}.loading{text-align:center;color:var(--muted);padding:60px}footer{color:var(--muted);font-size:12px;text-align:center;padding:20px}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#060910b8;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:100;padding:20px;animation:fadeIn .15s ease}.modal{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:28px;width:100%;max-width:420px;text-align:center;box-shadow:0 20px 60px #00000080;animation:popIn .18s cubic-bezier(.2,.9,.3,1.3)}.modal-icon{width:56px;height:56px;border-radius:50%;margin:0 auto 16px;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:700}.modal-icon.ok{background:#25c28126;color:var(--ok);border:2px solid var(--ok)}.modal-icon.warn{background:#f0b42926;color:#f0b429;border:2px solid #f0b429}.modal h3{margin:0 0 12px;font-size:18px}.modal-task{background:var(--panel2);border:1px solid var(--line);border-radius:10px;padding:12px 14px;font-size:14px;color:var(--txt);margin:0 0 12px;line-height:1.5}.modal-note{color:var(--muted);font-size:13px;margin:0 0 22px}.modal-btns{display:flex;gap:10px}.modal-btns button{flex:1;padding:11px;font-size:14px;font-weight:600;border-radius:10px}.btn-cancel{background:var(--panel2)}.btn-ok{background:var(--ok);color:#04371f;border-color:var(--ok)}.btn-ok:hover{background:#2ad98f;color:#04371f}.btn-ok.warn{background:#f0b429;color:#3a2c05;border-color:#f0b429}.btn-ok.warn:hover{background:#ffc63d;color:#3a2c05}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes popIn{0%{opacity:0;transform:scale(.9) translateY(10px)}to{opacity:1;transform:scale(1) translateY(0)}}