:root{--rm-bg:var(--theme-bg);--rm-surface:var(--theme-surface);--rm-border:var(--theme-border);--rm-text:var(--theme-text);--rm-text-muted:var(--theme-text-muted);--rm-accent:var(--theme-accent);--rm-accent-light:var(--theme-accent-light);--rm-success:var(--theme-success);--rm-success-light:var(--theme-success-light);--rm-warning:var(--theme-warning);--rm-error:var(--theme-error);--rm-shadow:var(--theme-shadow);--rm-shadow-lg:var(--theme-shadow-lg)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes flow{to{stroke-dashoffset:-20px}}@keyframes slideUp{0%{opacity:0;transform:translateY(100%)}to{opacity:1;transform:translateY(0)}}.learning-container{background:var(--rm-bg);color:var(--rm-text);height:100vh;min-height:640px;display:flex;overflow:hidden}.intro-overlay{background:var(--rm-bg);z-index:100;flex-direction:column;justify-content:center;align-items:center;transition:opacity 1s;display:flex;position:fixed;inset:0;overflow:hidden}.intro-overlay.hidden{opacity:0;pointer-events:none}.intro-simple{z-index:1;text-align:center;flex-direction:column;gap:14px;width:min(1000px,92vw);padding:24px;display:flex;position:relative}.intro-title{color:var(--rm-text);letter-spacing:.08em;font-size:clamp(2.5rem,6vw,3.8rem);font-weight:600}.intro-subtitle{color:var(--rm-text-muted);letter-spacing:.03em;font-size:1rem}.intro-progress{flex-direction:column;gap:10px;margin-top:8px;display:flex}.intro-progress-label{color:var(--rm-text);letter-spacing:.05em;justify-content:space-between;align-items:center;font-size:.9rem;display:flex}.intro-progress-track{background:var(--rm-border);border-radius:999px;width:100%;height:10px;position:relative;overflow:hidden}.intro-progress-bar{background:linear-gradient(90deg,var(--rm-accent),var(--rm-success));height:100%;transition:width .25s}.intro-status-line{color:var(--rm-text-muted);letter-spacing:.03em;margin-top:4px;font-size:.85rem}.learning-header{z-index:200;background:0 0;justify-content:space-between;align-items:center;padding:16px 16px 0;display:flex;position:relative}.breadcrumb{color:var(--rm-text-muted);align-items:center;gap:8px;font-size:14px;display:flex}.breadcrumb-link{cursor:pointer;transition:color .2s}.breadcrumb-link:hover{color:var(--rm-accent)}.breadcrumb span:last-child{color:var(--rm-text);font-weight:500}.header-right{align-items:center;gap:20px;display:flex}.node-group{cursor:pointer;transition:all .3s}.link{transition:all .5s}.link.highlighted{stroke:var(--rm-accent);stroke-width:2px;opacity:1;stroke-dasharray:6 4;animation:1s linear infinite flow}.link-dot{fill:var(--rm-border);pointer-events:none;opacity:.8;transition:all .3s}.link-dot.highlighted{fill:var(--rm-accent);r:2.8px;opacity:1;filter:drop-shadow(0 0 3px var(--rm-accent))}.node-group.highlighted .node-rect{stroke:var(--rm-accent);stroke-width:2px}.node-group.highlighted>text{fill:var(--rm-accent);font-weight:700}.milestone-title-group.active text{fill:var(--rm-accent)}.learning-graph.has-highlight .node-group:not(.highlighted):not(.active){opacity:.3}.learning-graph.has-highlight .link:not(.highlighted){opacity:.15}.main-wrapper{flex-direction:column;flex:1;display:flex;position:relative}.chart-container{background:var(--rm-bg);flex:1;position:relative;overflow:visible}.node-tooltip{background:var(--rm-surface);border:1px solid var(--rm-border);color:var(--rm-text);white-space:nowrap;pointer-events:none;box-shadow:var(--rm-shadow-lg);z-index:30;border-radius:8px;padding:6px 10px;font-size:12px;line-height:1.4;position:absolute;transform:translate(-50%,-130%)}@media (max-width:768px){.learning-container{height:auto;min-height:100vh;padding-bottom:calc(60px + env(safe-area-inset-bottom,0px));overflow:auto}.main-wrapper{min-height:480px}.chart-container{min-height:460px}.learning-legend{flex-wrap:wrap;justify-content:center;gap:8px;padding:6px 10px;font-size:11px;bottom:calc(72px + 8px + env(safe-area-inset-bottom,0px))!important;z-index:60!important;pointer-events:none!important;position:fixed!important;left:8px!important;right:8px!important}.legend-item{gap:4px}.year-selector{flex-flow:wrap;gap:4px;bottom:calc(120px + env(safe-area-inset-bottom,0px))!important;z-index:60!important;position:fixed!important;left:8px!important}.year-btn{padding:3px 8px;font-size:11px}}.milestone-detail-overlay{z-index:99;background:#00000080;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.milestone-detail-card{background:var(--rm-surface);border:1px solid var(--rm-border);z-index:100;width:480px;max-width:calc(100vw - 48px);max-height:calc(100vh - 100px);box-shadow:var(--rm-shadow-lg);border-radius:12px;flex-direction:column;animation:.2s ease-out fadeIn;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}.milestone-detail-header{border-bottom:1px solid var(--rm-border);justify-content:space-between;align-items:center;padding:16px;display:flex}.milestone-detail-header h3{color:var(--rm-text);margin:0;font-size:16px;font-weight:600}.milestone-detail-header button{color:var(--rm-text-muted);cursor:pointer;background:0 0;border:none;padding:4px;transition:color .2s}.milestone-detail-header button:hover{color:var(--rm-text)}.milestone-detail-meta{border-bottom:1px solid var(--rm-border);flex-wrap:wrap;gap:8px;padding:12px 16px;display:flex}.milestone-type-badge{color:var(--rm-accent);background:var(--rm-accent-light);border:1px solid var(--rm-accent);border-radius:4px;padding:2px 8px;font-size:11px;line-height:1.2;display:inline-block}.milestone-detail-meta .milestone-date{color:var(--rm-text-muted);background:var(--rm-surface);border:1px solid var(--rm-border);border-radius:4px;margin-bottom:0;padding:2px 8px;font-size:11px;line-height:1.2;animation:none;display:inline-block}.milestone-free-badge{color:var(--rm-success);background:var(--rm-success-light);border:1px solid var(--rm-success);border-radius:4px;padding:2px 8px;font-size:11px;line-height:1.2;display:inline-block}.milestone-source-link{color:var(--rm-accent);background:var(--rm-accent-light);border:1px solid var(--rm-accent);border-radius:4px;align-items:center;gap:4px;padding:2px 8px;font-size:11px;line-height:1.2;text-decoration:none;transition:all .2s;display:inline-flex}.milestone-source-link:hover{background:var(--rm-accent);color:#fff}.milestone-detail-desc{color:var(--rm-text);overscroll-behavior:contain;flex:1;min-height:0;padding:16px;font-size:14px;line-height:1.7;overflow-y:auto}.milestone-detail-desc .markdown-content{color:var(--rm-text);font-size:14px}.milestone-detail-desc .markdown-content *{color:inherit}.milestone-detail-desc .markdown-content p{margin:0 0 12px}.milestone-detail-desc .markdown-content p:last-child{margin-bottom:0}.node-rect{transition:all .3s}.node-group:hover .node-rect{fill:var(--rm-accent-light);stroke:var(--rm-accent)}.node-group.active .node-rect{fill:var(--rm-accent-light);stroke:var(--rm-accent);stroke-width:2px}.milestone-title-group{transition:all .2s}.milestone-title-group:hover text{fill:var(--rm-accent)}.milestone-video-foreign{overflow:visible}.milestone-video-card{cursor:pointer;position:relative;overflow:visible}.milestone-video-frame{border:1px solid var(--rm-border);background:var(--rm-surface);width:100%;height:100%;box-shadow:0 8px 16px var(--rm-shadow);border-radius:8px;position:relative;overflow:hidden}.milestone-video-card:before{content:"";border-left:14px solid var(--rm-border);border-top:9px solid #0000;border-bottom:9px solid #0000;position:absolute;top:50%;right:-14px;transform:translateY(-50%)}.milestone-video-card:after{content:"";border-left:13px solid var(--rm-surface);border-top:8px solid #0000;border-bottom:8px solid #0000;position:absolute;top:50%;right:-13px;transform:translateY(-50%)}.milestone-video-cover,.milestone-video-iframe{width:100%;height:100%;position:absolute;inset:0}.milestone-video-cover{background-position:50%;background-size:cover;transition:opacity .2s}.milestone-video-cover.placeholder{background:linear-gradient(135deg,var(--rm-border),var(--rm-surface))}.milestone-video-play{pointer-events:none;opacity:.95;justify-content:center;align-items:center;transition:opacity .2s;display:flex;position:absolute;inset:0}.milestone-video-play:before{content:"";background:#11182799;border:1px solid #fff9;border-radius:999px;width:36px;height:36px;box-shadow:0 6px 12px #00000059}.milestone-video-play:after{content:"";border-top:7px solid #0000;border-bottom:7px solid #0000;border-left:12px solid #fffffff2;margin-left:2px;position:absolute}.milestone-video-iframe{opacity:0;pointer-events:none;border:0;transition:opacity .2s}.milestone-video-card.is-playing .milestone-video-cover,.milestone-video-card.is-playing .milestone-video-play{opacity:0}.milestone-video-card.is-playing .milestone-video-iframe{opacity:1}.node-group.node-locked .node-rect{fill:var(--rm-surface);stroke:var(--rm-border);opacity:.6}.node-group.node-locked:hover .node-rect{fill:var(--rm-surface);stroke:var(--rm-border)}.node-group.node-not-started .node-status-dot{fill:var(--rm-text-muted)}.node-group.node-in-progress .node-status-dot{fill:var(--rm-warning)}.node-group.node-completed .node-status-dot{fill:var(--rm-success)}.node-group.node-completed .node-rect{stroke:var(--rm-success)}.learning-legend{background:var(--rm-surface);border:1px solid var(--rm-border);z-index:20;color:var(--rm-text);opacity:.8;border-radius:8px;gap:16px;padding:8px 12px;font-size:12px;display:flex;position:absolute;bottom:16px;right:16px}.legend-item{align-items:center;gap:6px;display:flex}.legend-dot{border-radius:50%;width:10px;height:10px;display:inline-block}.year-selector{z-index:20;opacity:.8;flex-direction:column;gap:4px;display:flex;position:absolute;bottom:16px;left:16px}.year-btn{background:var(--rm-surface);color:var(--rm-text);cursor:pointer;border:1px solid;border-radius:4px;padding:2px 6px;font-size:11px;font-weight:600;transition:transform .15s,box-shadow .15s}.year-btn:hover{transform:scale(1.05);box-shadow:0 2px 8px #00000026}.legend-lock{flex-shrink:0}.legend-not-started{background:var(--rm-text-muted)}.legend-in-progress{background:var(--rm-warning)}.legend-completed{background:var(--rm-success)}.legend-help-btn{background:var(--rm-accent);color:#fff;cursor:pointer;width:18px;height:18px;box-shadow:0 0 0 2px var(--rm-accent-light);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;margin-right:8px;transition:all .2s;display:flex}.legend-help-btn:hover{box-shadow:0 0 0 3px var(--rm-accent-light);transform:scale(1.1)}.legend-help-btn i{font-size:11px}@media (max-width:768px){.legend-help-btn{pointer-events:auto}.milestone-detail-card{top:auto;bottom:calc(60px + env(safe-area-inset-bottom,0px));border-radius:16px 16px 0 0;width:100%;max-width:100%;max-height:calc(85vh - 60px);animation:.3s ease-out slideUp;left:0;right:0;transform:none}.milestone-detail-header,.milestone-detail-desc{padding:12px 16px}}@keyframes guideEnter{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes highlightPulse{0%,to{box-shadow:0 0 0 4px rgba(var(--rm-accent-rgb,59,130,246),.3)}50%{box-shadow:0 0 0 8px rgba(var(--rm-accent-rgb,59,130,246),.15)}}.learning-guide-overlay{z-index:80;pointer-events:none;background:#00000080;position:fixed;inset:0}.learning-guide-highlight{border:2px solid var(--rm-accent);pointer-events:none;z-index:81;border-radius:8px;animation:2s ease-in-out infinite highlightPulse;position:fixed}.learning-guide-tooltip{z-index:85;background:var(--rm-surface);border:1px solid var(--rm-accent);pointer-events:auto;border-radius:12px;padding:16px;animation:.3s ease-out guideEnter;position:fixed;box-shadow:0 8px 32px #0000004d}.learning-guide-tooltip:before{content:"";border:8px solid #0000;width:0;height:0;position:absolute}.learning-guide-tooltip.arrow-left:before{border-right-color:var(--rm-accent);top:50%;left:-16px;transform:translateY(-50%)}.learning-guide-tooltip.arrow-right:before{border-left-color:var(--rm-accent);top:50%;right:-16px;transform:translateY(-50%)}.learning-guide-tooltip.arrow-top:before{border-bottom-color:var(--rm-accent);top:-16px;left:50%;transform:translate(-50%)}.learning-guide-tooltip.arrow-bottom:before{border-top-color:var(--rm-accent);bottom:-16px;left:50%;transform:translate(-50%)}.learning-guide-title{color:var(--rm-text);margin-bottom:8px;font-size:16px;font-weight:600}.learning-guide-content{color:var(--rm-text-muted);margin-bottom:16px;font-size:14px;line-height:1.6}.learning-guide-footer{justify-content:space-between;align-items:center;display:flex}.learning-guide-step{color:var(--rm-text-muted);font-size:12px}.learning-guide-actions{gap:8px;display:flex}.learning-guide-skip{color:var(--rm-text-muted);cursor:pointer;background:0 0;border:none;padding:6px 12px;font-size:13px;transition:color .2s}.learning-guide-skip:hover{color:var(--rm-text)}.learning-guide-next{background:var(--rm-accent);color:#fff;cursor:pointer;border:none;border-radius:6px;padding:6px 16px;font-size:13px;font-weight:500;transition:opacity .2s}.learning-guide-next:hover{opacity:.9}@media (max-width:768px){.learning-guide-tooltip{max-width:none;bottom:calc(80px + env(safe-area-inset-bottom,0px))!important;width:auto!important;position:fixed!important;top:auto!important;left:16px!important;right:16px!important}.learning-guide-tooltip:before{display:none}}.milestone-type-filter{z-index:20;opacity:.8;flex-direction:column;gap:4px;max-height:calc(100% - 32px);display:flex;position:absolute;top:16px;left:16px;overflow-y:auto}.milestone-type-btn{background:var(--rm-surface);border:1px solid var(--rm-border);color:var(--rm-text);cursor:pointer;white-space:nowrap;border-radius:4px;align-items:center;gap:6px;padding:5px 12px;font-size:12px;font-weight:600;line-height:1;transition:border-color .15s,color .15s;display:flex}.milestone-type-btn:hover,.milestone-type-btn.active{border-color:var(--rm-accent);color:var(--rm-accent)}@media (max-width:768px){.milestone-type-filter{flex-flow:wrap;gap:4px;max-height:120px;top:60px;left:8px;right:8px}.milestone-type-btn{padding:5px 10px;font-size:12px}}
