:root{--bg:#08080d;--surface-1:#0f0f16;--surface-2:#15141d;--surface-3:#1b1925;--purple:#8b5cf6;--violet:#a855f7;--lavender:#c4b5fd;--cyan:#22d3ee;--green:#34d399;--amber:#f59e0b;--red:#f87171;--font-heading:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-body:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, "Fira Code", Consolas, monospace;--bg-canvas:var(--bg);--bg-deep:var(--surface-1);--bg-surface:var(--surface-2);--bg-elevated:var(--surface-3);--bg-glass:#0f0f16f0;--color-purple-500:var(--purple);--color-violet-500:var(--violet);--color-violet-300:var(--lavender);--color-cyan-400:var(--cyan);--color-green-400:var(--green);--color-amber-400:var(--amber);--color-red-400:var(--red);--text-primary:#f8fafc;--text-secondary:#a1a1aa;--text-muted:#71717a;--text-dim:#52525b;--border-subtle:#ffffff14;--border-medium:#ffffff24;--border-purple-glow:#8b5cf659;--border-cyan-glow:#22d3ee59;--shadow-sm:0 2px 8px #0009;--shadow-md:0 8px 24px #000000b3;--shadow-glow:0 0 25px #8b5cf640;--space-1:8px;--space-2:12px;--space-3:16px;--space-4:20px;--space-5:24px;--space-6:32px;--space-7:40px;--space-8:48px;--space-9:64px;--space-10:80px;--radius-xs:6px;--radius-sm:8px;--radius-md:10px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:20px;--radius-3xl:24px;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-normal:.25s cubic-bezier(.4, 0, .2, 1);--transition-slow:.3s cubic-bezier(.4, 0, .2, 1);--graph-node-known:var(--color-cyan-400);--graph-node-prereq:var(--color-violet-300);--graph-node-active:var(--color-purple-500);--graph-node-target:var(--color-violet-500)}*,:before,:after{box-sizing:border-box}html{font-family:var(--font-body);--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;background-color:var(--bg-canvas);color:var(--text-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.5}body{background-color:var(--bg-canvas);background-image:radial-gradient(circle at 80% 20%,#8b5cf614 0%,#0000 40%),radial-gradient(circle at 20% 80%,#22d3ee0f 0%,#0000 40%);background-attachment:fixed;min-height:100vh;margin:0;padding:0;overflow-x:hidden}#root{flex-direction:column;width:100%;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);letter-spacing:-.025em}button,select,input{font-family:inherit}button{cursor:pointer;appearance:none;background:0 0;border:none;padding:0}button:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--color-purple-500);outline-offset:2px}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:var(--bg-canvas)}::-webkit-scrollbar-thumb{background:#ffffff1f;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#8b5cf659}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.sp-button{border-radius:var(--radius-md);font-family:var(--font-body);white-space:nowrap;transition:all var(--transition-fast);cursor:pointer;appearance:none;box-sizing:border-box;justify-content:center;align-items:center;gap:8px;font-weight:600;text-decoration:none;display:inline-flex}.sp-button:disabled{opacity:.5;cursor:not-allowed;box-shadow:none!important;transform:none!important}.sp-button.btn-sm{height:38px;padding:0 16px;font-size:13px}.sp-button.btn-md{height:48px;padding:0 24px;font-size:14.5px}.sp-button.btn-lg{height:52px;padding:0 32px;font-size:15.5px;font-weight:700}.sp-button.btn-primary{background:linear-gradient(135deg, var(--color-purple-500), var(--color-violet-500));color:#fff;box-shadow:var(--shadow-glow);border:1px solid #ffffff1f}.sp-button.btn-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 30px #8b5cf673}.sp-button.btn-primary:active:not(:disabled){transform:translateY(0)}.sp-button.btn-secondary{background:var(--bg-surface);border:1px solid var(--border-subtle);color:var(--text-primary)}.sp-button.btn-secondary:hover:not(:disabled){border-color:var(--color-purple-500);background:var(--bg-elevated)}.sp-button.btn-tertiary{border:1px solid var(--border-subtle);color:var(--text-secondary);background:#ffffff0a}.sp-button.btn-tertiary:hover:not(:disabled){color:var(--text-primary);background:#ffffff14}.sp-button.btn-ghost{color:var(--text-secondary);background:0 0;border:1px solid #0000}.sp-button.btn-ghost:hover:not(:disabled){color:var(--text-primary);background:#8b5cf614}.sp-button.btn-danger{color:var(--color-red-400);background:#f871711f;border:1px solid #f871714d}.sp-button.btn-danger:hover:not(:disabled){background:#f8717138}.btn-spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:16px;height:16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.sp-card{border-radius:var(--radius-xl);transition:all var(--transition-fast);box-sizing:border-box;padding:28px}.card-surface-main{background:var(--bg-surface)}.card-surface-deep{background:var(--bg-deep)}.card-surface-elevated{background:var(--bg-elevated)}.card-bordered{border:1px solid var(--border-subtle)}.card-hoverable:hover{border-color:var(--border-purple-glow);box-shadow:var(--shadow-md);transform:translateY(-2px)}.card-interactive{cursor:pointer}.sp-badge{white-space:nowrap;border-radius:9999px;align-items:center;gap:6px;font-weight:700;display:inline-flex}.sp-badge.badge-sm{padding:3px 10px;font-size:11.5px}.sp-badge.badge-md{padding:5px 14px;font-size:12.5px}.sp-badge.badge-lg{padding:7px 18px;font-size:13.5px}.badge-purple{color:var(--color-violet-300);background:#8b5cf624;border:1px solid #8b5cf64d}.badge-cyan{color:var(--color-cyan-400);background:#22d3ee24;border:1px solid #22d3ee4d}.badge-green{color:var(--color-green-400);background:#34d39924;border:1px solid #34d3994d}.badge-amber{color:var(--color-amber-400);background:#f59e0b24;border:1px solid #f59e0b4d}.badge-red{color:var(--color-red-400);background:#f8717124;border:1px solid #f871714d}.badge-neutral{color:var(--text-secondary);border:1px solid var(--border-subtle);background:#ffffff0d}.sp-input-group,.sp-select-group{flex-direction:column;gap:6px;width:100%;display:flex}.sp-input-label,.sp-select-label{color:var(--text-secondary);font-size:13px;font-weight:600}.sp-input-wrapper,.sp-select-wrapper{align-items:center;width:100%;display:flex;position:relative}.sp-input,.sp-select{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);width:100%;height:52px;color:var(--text-primary);transition:all var(--transition-fast);box-sizing:border-box;padding:0 18px;font-size:14.5px;font-weight:500}.sp-select{appearance:none;cursor:pointer;padding-right:44px}.sp-input.has-icon{padding-left:44px}.sp-input:hover,.sp-select:hover{border-color:var(--border-medium);background:var(--bg-elevated)}.sp-input:focus,.sp-select:focus{border-color:var(--color-purple-500);outline:none;box-shadow:0 0 0 3px #8b5cf62e}.sp-input-icon{color:var(--text-muted);pointer-events:none;place-items:center;display:grid;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.sp-select-chevron{color:var(--text-muted);pointer-events:none;place-items:center;display:grid;position:absolute;top:50%;right:16px;transform:translateY(-50%)}.sp-search-wrapper{width:100%;position:relative}.sp-search-clear-btn{color:var(--text-muted);padding:4px;position:absolute;top:50%;right:14px;transform:translateY(-50%)}.sp-search-clear-btn:hover{color:var(--text-primary)}.sp-tabs-container{background:var(--bg-deep);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);flex-wrap:wrap;align-items:center;gap:4px;padding:4px;display:inline-flex}.sp-tab-btn{border-radius:var(--radius-md);color:var(--text-secondary);transition:all var(--transition-fast);background:0 0;border:none;align-items:center;gap:8px;padding:8px 18px;font-size:13.5px;font-weight:600;display:inline-flex}.sp-tab-btn:hover{color:var(--text-primary);background:#ffffff0a}.sp-tab-btn.active{background:var(--bg-surface);color:#fff;box-shadow:var(--shadow-sm);border:1px solid var(--border-subtle);font-weight:700}.sp-tab-badge{color:var(--color-violet-300);background:#8b5cf633;border-radius:9999px;padding:2px 6px;font-size:11px;font-weight:800}.sp-stat-block{align-items:center;gap:16px;display:flex}.sp-stat-icon-wrap{border-radius:var(--radius-md);width:44px;height:44px;color:var(--color-violet-300);border:1px solid var(--border-subtle);background:#8b5cf61f;flex-shrink:0;place-items:center;display:grid}.sp-stat-text-stack{flex-direction:column;display:flex}.sp-stat-value{font-family:var(--font-mono);color:var(--text-primary);font-size:24px;font-weight:800;line-height:1.1}.sp-stat-label{color:var(--text-muted);margin-top:2px;font-size:12px;font-weight:600}.sp-status-indicator{border-radius:9999px;align-items:center;gap:8px;padding:6px 14px;font-size:12px;font-weight:700;display:inline-flex}.sp-status-indicator.online{color:var(--color-green-400);background:#34d3991f;border:1px solid #34d3994d}.sp-status-indicator.offline{color:var(--color-red-400);background:#f871711f;border:1px solid #f871714d}.sp-status-dot{border-radius:50%;width:7px;height:7px}.sp-status-indicator.online .sp-status-dot{background:var(--color-green-400);box-shadow:0 0 8px var(--color-green-400)}.sp-status-indicator.offline .sp-status-dot{background:var(--color-red-400)}.sp-section-header{justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:32px;display:flex}.sp-section-eyebrow{letter-spacing:.1em;color:var(--color-cyan-400);margin-bottom:8px;font-size:11px;font-weight:800;display:block}.sp-section-title{color:var(--text-primary);letter-spacing:-.025em;margin:0;font-size:30px;font-weight:800;line-height:1.2}.sp-section-subtitle{color:var(--text-secondary);margin:8px 0 0;font-size:14.5px;line-height:1.5}.sp-modal-backdrop{z-index:100;-webkit-backdrop-filter:blur(10px);background:#07070cd9;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.sp-modal-container{background:var(--bg-surface);border:1px solid var(--border-purple-glow);border-radius:var(--radius-2xl);width:100%;max-width:640px;max-height:calc(100vh - 40px);box-shadow:var(--shadow-glow);box-sizing:border-box;padding:32px;overflow-y:auto}.sp-modal-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.sp-modal-title{color:var(--text-primary);margin:0;font-size:22px;font-weight:800}.sp-modal-close-btn{color:var(--text-muted)}.sp-modal-close-btn:hover{color:var(--text-primary)}.skillpath-app.shell-layout{background-color:var(--bg-canvas);min-height:100vh;color:var(--text-primary);box-sizing:border-box;display:flex}.app-sidebar{background:var(--bg-deep);border-right:1px solid var(--border-subtle);z-index:60;box-sizing:border-box;flex-direction:column;gap:24px;width:248px;min-width:248px;height:100vh;padding:24px 16px;transition:width .25s cubic-bezier(.16,1,.3,1),min-width .25s cubic-bezier(.16,1,.3,1),padding .25s cubic-bezier(.16,1,.3,1);display:flex;position:sticky;top:0}.menu-toggle-btn,.mobile-menu-btn{border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:var(--bg-surface);width:36px;height:36px;color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.menu-toggle-btn:hover,.mobile-menu-btn:hover{color:var(--text-primary);border-color:var(--color-purple-500);background:#8b5cf61f}@media (width>=1025px){.app-sidebar.collapsed{align-items:center;width:68px;min-width:68px;padding:20px 8px}.app-sidebar.collapsed .sidebar-brand{justify-content:center;width:100%;padding:0}.app-sidebar.collapsed .sidebar-brand-text,.app-sidebar.collapsed .sidebar-section-heading,.app-sidebar.collapsed .nav-btn-label,.app-sidebar.collapsed .sidebar-system-heading,.app-sidebar.collapsed .sidebar-system-footer .sp-button span,.app-sidebar.collapsed .sidebar-system-footer .sp-status-label{display:none!important}.app-sidebar.collapsed .sidebar-nav-btn{border-radius:var(--radius-md);border-left:none;justify-content:center;padding:10px}.app-sidebar.collapsed .sidebar-nav-btn.active{box-shadow:0 0 0 1px var(--color-purple-500);background:#8b5cf640}.app-sidebar.collapsed .sidebar-system-footer{align-items:center;width:100%;padding-top:12px}.app-sidebar.collapsed .sidebar-system-footer .sp-button{justify-content:center;min-width:0;padding:8px}}.sidebar-brand{align-items:center;gap:12px;padding:4px 6px;display:flex;position:relative}.sidebar-brand-icon{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--color-purple-500), var(--color-violet-500));color:#fff;width:38px;height:38px;box-shadow:var(--shadow-glow);flex-shrink:0;place-items:center;display:grid}.sidebar-brand-text{flex-direction:column;min-width:0;display:flex}.sidebar-brand-title{color:var(--text-primary);letter-spacing:-.03em;margin:0;font-size:18px;font-weight:800;line-height:1.1}.sidebar-brand-tagline{color:var(--color-violet-300);letter-spacing:.06em;white-space:nowrap;text-overflow:ellipsis;margin-top:2px;font-size:8.5px;font-weight:800;overflow:hidden}.sidebar-nav{flex-direction:column;flex:1;gap:20px;width:100%;padding-right:2px;display:flex;overflow-y:auto}.sidebar-nav-group{flex-direction:column;gap:6px;display:flex;position:relative}.sidebar-heading-wrap{justify-content:space-between;align-items:center;padding:0 8px 4px;display:flex}.sidebar-section-heading{letter-spacing:.1em;color:var(--text-muted);text-transform:uppercase;transition:color var(--transition-fast);font-size:9.5px;font-weight:800}.sidebar-nav-group.group-active .sidebar-section-heading{color:var(--color-violet-300)}.group-active-indicator{background:var(--color-purple-500);width:6px;height:6px;box-shadow:0 0 8px var(--color-purple-500);border-radius:50%}.sidebar-section-items{flex-direction:column;gap:3px;display:flex}.sidebar-section-items.journey-workflow-stack{border-left:2px solid #8b5cf633;margin-left:4px;padding-left:6px;position:relative}.sidebar-nav-btn{border-radius:var(--radius-md);color:var(--text-secondary);text-align:left;width:100%;transition:all var(--transition-fast);cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:12px;padding:8px 12px;font-size:13.5px;font-weight:600;display:flex;position:relative}.sidebar-nav-btn:hover{color:var(--text-primary);background:#8b5cf614;border-color:#8b5cf626}.sidebar-nav-btn.active{color:#fff;background:#8b5cf629;border-color:#8b5cf659;font-weight:700;box-shadow:0 1px 4px #0003}.sidebar-nav-btn.nav-btn-advanced{border-color:#06b6d426}.sidebar-nav-btn.nav-btn-advanced:hover{background:#06b6d414;border-color:#06b6d44d}.sidebar-nav-btn.nav-btn-advanced.active{background:#06b6d429;border-color:#06b6d466}.nav-btn-icon{color:var(--text-muted);transition:color var(--transition-fast);flex-shrink:0;place-items:center;display:grid}.sidebar-nav-btn:hover .nav-btn-icon{color:var(--color-violet-300)}.sidebar-nav-btn.active .nav-btn-icon{color:var(--color-purple-400)}.sidebar-nav-btn.nav-btn-advanced.active .nav-btn-icon{color:var(--color-cyan-400)}.nav-btn-text{flex-direction:column;flex:1;min-width:0;display:flex}.nav-btn-label-row{justify-content:space-between;align-items:center;gap:6px;display:flex}.nav-btn-label{white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;font-weight:600;overflow:hidden}.nav-btn-subtitle{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;margin-top:1px;font-size:10.5px;font-weight:400;overflow:hidden}.sidebar-nav-btn:hover .nav-btn-subtitle{color:var(--text-secondary)}.sidebar-nav-btn.active .nav-btn-subtitle{color:var(--color-violet-300)}.nav-btn-badge{border-radius:var(--radius-full);color:var(--color-green-400);letter-spacing:.02em;white-space:nowrap;background:#34d39929;border:1px solid #34d3994d;flex-shrink:0;padding:1px 6px;font-size:9.5px;font-weight:800}.sidebar-system-footer{border-top:1px solid var(--border-subtle);flex-direction:column;gap:10px;padding-top:16px;display:flex}.sidebar-system-heading{letter-spacing:.08em;color:var(--text-muted);text-transform:uppercase;padding:0 4px;font-size:10px;font-weight:800}.app-header{z-index:50;background:var(--bg-glass);-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-subtle);height:64px;position:sticky;top:0}.header-container{justify-content:space-between;align-items:center;gap:16px;max-width:1320px;height:100%;margin:0 auto;padding:0 32px;display:flex}.page-context-eyebrow{letter-spacing:.1em;color:var(--color-cyan-400);font-size:10px;font-weight:800;display:block}.page-context-title-group{align-items:baseline;gap:8px;display:flex}.page-context-title{color:var(--text-primary);margin:0;font-size:18px;font-weight:800}.page-context-desc{color:var(--text-secondary);font-size:12px;font-weight:500}.header-actions{align-items:center;gap:12px;display:flex}.app-main-wrapper{box-sizing:border-box;flex-direction:column;flex:1;min-width:0;display:flex}.main-layout{box-sizing:border-box;flex:1;width:100%;min-width:0;max-width:1320px;margin:0 auto;padding:28px 32px 48px}.dashboard-hero-banner{z-index:1;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);align-items:center;gap:40px;margin-bottom:48px;display:grid;position:relative}.banner-right-workspace{flex-direction:column;width:100%;min-width:0;display:flex}.banner-eyebrow{letter-spacing:.1em;color:var(--color-cyan-400);margin-bottom:12px;font-size:11px;font-weight:800;display:block}.banner-title{letter-spacing:-.03em;color:var(--text-primary);margin:0 0 16px;font-size:38px;font-weight:800;line-height:1.18}.gradient-violet{background:linear-gradient(135deg, var(--color-purple-500), var(--color-violet-500));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.banner-subtext{color:var(--text-secondary);margin:0 0 24px;font-size:15.5px;line-height:1.6}.banner-actions{align-items:center;gap:16px;display:flex}.hero-graph-workspace-card{box-sizing:border-box;background:var(--bg-surface);border:1px solid var(--border-purple-glow);border-radius:var(--radius-2xl);width:100%;height:380px;max-height:380px;box-shadow:var(--shadow-glow);perspective:1000px;flex-direction:column;justify-content:space-between;display:flex;position:relative;overflow:hidden}.graph-workspace-topbar{border-bottom:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10;background:#0b0a1199;justify-content:space-between;align-items:center;padding:14px 20px;display:flex}.graph-badge{letter-spacing:.1em;color:var(--color-cyan-400);align-items:center;gap:8px;font-size:11px;font-weight:800;display:flex}.live-pulse{background:var(--color-cyan-400);width:8px;height:8px;box-shadow:0 0 8px var(--color-cyan-400);border-radius:50%}.replay-path-btn{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--text-secondary);transition:all var(--transition-fast);background:#ffffff0d;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:600;display:inline-flex}.replay-path-btn:hover{color:var(--text-primary);border-color:var(--border-purple-glow);background:#8b5cf629}.workspace-svg-wrapper{flex:1;justify-content:center;align-items:center;width:100%;height:100%;min-height:0;transition:transform .15s cubic-bezier(.4,0,.2,1);display:flex;overflow:hidden}.open-graph-svg{width:100%;height:100%;max-height:100%;display:block}.graph-workspace-footer{border-top:1px solid var(--border-subtle);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10;background:#0b0a1199;justify-content:space-between;align-items:center;padding:10px 20px;font-size:12px;display:flex}.active-node-detail{align-items:center;gap:8px;display:flex}.node-detail-lbl{color:var(--text-muted);font-weight:600}.node-detail-val{color:var(--color-violet-300);font-weight:700;font-family:var(--font-mono)}.graph-hint{color:var(--text-muted)}.status-telemetry-strip{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);z-index:2;grid-template-columns:repeat(4,1fr);align-items:center;gap:24px;margin-bottom:48px;padding:20px 28px;display:grid;position:relative}.telemetry-divider{display:none}.dashboard-section{margin-bottom:44px}.featured-jobs-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px;display:grid}.featured-job-card{flex-direction:column;gap:14px;display:flex}.featured-job-card.active-target-card{border-color:var(--border-purple-glow);box-shadow:var(--shadow-glow)}.job-card-top{justify-content:space-between;align-items:center;display:flex}.job-card-title{color:var(--text-primary);margin:0;font-size:18px;font-weight:800}.job-req-count{color:var(--text-muted);align-items:center;gap:6px;font-size:13px;display:flex}.job-card-bottom{margin-top:auto;padding-top:10px}.onboarding-readiness-card{padding:32px}.onboarding-card-content{align-items:center;gap:24px;display:flex}.onboarding-icon-wrap{border-radius:var(--radius-lg);width:52px;height:52px;color:var(--color-violet-300);border:1px solid var(--border-subtle);background:#8b5cf61f;flex-shrink:0;place-items:center;display:grid}.onboarding-text{flex:1}.onboarding-title{color:var(--text-primary);margin:0 0 6px;font-size:18px;font-weight:800}.onboarding-subtitle{color:var(--text-secondary);margin:0;font-size:14.5px;line-height:1.5}.how-it-works-section{margin-bottom:64px}.how-steps-grid{grid-template-columns:repeat(3,minmax(0,1fr));align-items:stretch;gap:24px;display:grid}.step-wrapper{align-items:center;display:flex;position:relative}.how-step-card{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);width:100%;min-height:240px;transition:all var(--transition-fast);flex-direction:column;gap:16px;padding:28px;display:flex}.how-step-card:hover{border-color:var(--border-purple-glow);box-shadow:var(--shadow-md);transform:translateY(-2px)}.how-step-top{justify-content:space-between;align-items:center;display:flex}.how-step-num{font-family:var(--font-mono);color:var(--color-violet-300);border-radius:var(--radius-md);border:1px solid var(--border-subtle);background:#8b5cf61f;padding:4px 10px;font-size:16px;font-weight:800}.how-step-icon-wrap{border-radius:var(--radius-md);width:44px;height:44px;color:var(--color-cyan-400);background:#22d3ee1a;border:1px solid #22d3ee40;place-items:center;display:grid}.how-step-title{color:var(--text-primary);margin:0;font-size:20px;font-weight:800}.how-step-desc{color:var(--text-secondary);margin:0;font-size:14.5px;line-height:1.6}.how-connector-line{z-index:5;color:var(--color-violet-300);background:var(--bg-canvas);border:1px solid var(--border-subtle);border-radius:50%;place-items:center;padding:4px;display:grid;position:absolute;top:50%;right:-20px;transform:translateY(-50%)}.readiness-gauge-card{padding:32px}.gauge-header{justify-content:space-between;align-items:center;margin-bottom:24px;display:flex}.gauge-title{letter-spacing:.1em;color:var(--color-cyan-400);margin-bottom:4px;font-size:11px;font-weight:800;display:block}.gauge-role-name{color:var(--text-primary);margin:0;font-size:24px;font-weight:800}.gauge-main-row{align-items:center;gap:40px;display:flex}.gauge-meter-wrapper{flex-shrink:0;width:140px;height:140px;position:relative}.gauge-svg{width:100%;height:100%}.gauge-bg-circle{stroke:var(--bg-deep)}.gauge-fill-circle{transition:stroke-dashoffset .6s cubic-bezier(.4,0,.2,1)}.gauge-center-text{flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.gauge-score-value{font-family:var(--font-mono);color:var(--text-primary);font-size:32px;font-weight:800;line-height:1}.gauge-score-sub{color:var(--text-muted);text-transform:uppercase;margin-top:4px;font-size:11px;font-weight:700}.gauge-details{flex-direction:column;flex:1;gap:16px;display:flex}.gauge-stat-box{flex-direction:column;gap:2px;display:flex}.stat-num{font-family:var(--font-mono);color:var(--text-primary);font-size:20px;font-weight:800}.stat-text{color:var(--text-muted);font-size:13px;font-weight:600}.skill-breakdown-lists{flex-direction:column;gap:12px;display:flex}.breakdown-group{flex-direction:column;gap:8px;display:flex}.breakdown-label{letter-spacing:.05em;text-transform:uppercase;font-size:12px;font-weight:700}.breakdown-label.known{color:var(--color-green-400)}.breakdown-label.missing{color:var(--color-red-400)}.breakdown-chips{flex-wrap:wrap;gap:8px;display:flex}.app-footer{border-top:1px solid var(--border-subtle);background:var(--bg-deep);margin-top:48px;padding:24px 0}.footer-container{justify-content:space-between;align-items:center;gap:20px;max-width:1320px;margin:0 auto;padding:0 40px;display:flex}.footer-brand{color:var(--text-secondary);align-items:center;gap:10px;font-size:13.5px;display:flex}.footer-logo{color:var(--text-primary);font-weight:800}.footer-dot,.footer-desc{color:var(--text-muted)}.footer-tech-stack{color:var(--text-muted);align-items:center;gap:16px;font-size:12px;font-weight:600;display:flex}.footer-tech-stack span{border-radius:var(--radius-xs);border:1px solid var(--border-subtle);background:#ffffff0a;padding:2px 8px}.planner-page{flex-direction:column;gap:36px;display:flex}.planner-header-section{flex-direction:column;gap:8px;display:flex}.planner-eyebrow{letter-spacing:.1em;color:var(--color-cyan-400);font-size:11px;font-weight:800}.planner-title{color:var(--text-primary);letter-spacing:-.025em;margin:0;font-size:32px;font-weight:800}.planner-description{color:var(--text-secondary);max-width:720px;margin:0 0 16px;font-size:15px;line-height:1.5}.planner-step-bar{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);grid-template-columns:repeat(3,1fr);gap:16px;margin-top:8px;padding:6px;display:grid}.step-item{border-radius:var(--radius-lg);color:var(--text-muted);text-align:left;transition:all var(--transition-fast);cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:14px;padding:12px 18px;display:flex}.step-item:hover{color:var(--text-secondary);background:#ffffff08}.step-item.current{background:var(--bg-elevated);border-color:var(--border-purple-glow);color:var(--text-primary);box-shadow:var(--shadow-sm)}.step-item.completed{color:var(--color-green-400)}.step-badge{border:1px solid var(--border-subtle);width:28px;height:28px;font-size:12px;font-weight:800;font-family:var(--font-mono);background:#ffffff0f;border-radius:50%;flex-shrink:0;place-items:center;display:grid}.step-item.current .step-badge{background:linear-gradient(135deg, var(--color-purple-500), var(--color-violet-500));color:#fff;box-shadow:var(--shadow-glow);border:none}.step-item.completed .step-badge{color:var(--color-green-400);background:#34d39929;border-color:#34d3994d}.step-text{flex-direction:column;min-width:0;display:flex}.step-label-title{white-space:nowrap;text-overflow:ellipsis;font-size:13.5px;font-weight:700;overflow:hidden}.step-label-desc{color:var(--text-muted);white-space:nowrap;text-overflow:ellipsis;font-size:11px;overflow:hidden}.step-item.current .step-label-desc{color:var(--color-violet-300)}.planner-content-stack{flex-direction:column;gap:36px;display:flex}.planner-section{flex-direction:column;gap:16px;scroll-margin-top:84px;transition:opacity .2s;display:flex}.planner-notice-banner{border:1px solid var(--border-purple-glow);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm);background:#8b5cf61a;align-items:flex-start;gap:14px;padding:16px 20px;display:flex}.notice-icon-badge{flex-shrink:0;margin-top:2px;font-size:20px;line-height:1}.notice-text-content{flex-direction:column;display:flex}.section-title-strip{align-items:center;gap:10px;display:flex}.section-step-tag{letter-spacing:.1em;border-radius:var(--radius-xs);color:var(--color-violet-300);transition:all var(--transition-fast);background:#8b5cf624;border:1px solid #8b5cf640;padding:3px 8px;font-size:10px;font-weight:800}.active-step-panel .section-step-tag{background:var(--color-purple-500);color:#fff;border-color:var(--color-purple-500);box-shadow:var(--shadow-glow)}.section-heading{color:var(--text-primary);margin:0;font-size:20px;font-weight:800}.planner-workspace-card{flex-direction:column;gap:28px;display:flex}.job-selector-row{grid-template-columns:1fr auto;align-items:flex-end;gap:24px;display:grid}.selected-job-summary-badge{background:var(--bg-deep);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);align-items:center;gap:16px;padding:12px 20px;display:flex}.job-meta-item{flex-direction:column;gap:2px;display:flex}.meta-lbl{letter-spacing:.05em;color:var(--text-muted);text-transform:uppercase;font-size:10px;font-weight:700}.meta-val{color:var(--text-primary);font-size:13.5px;font-weight:700}.highlight-purple{color:var(--color-violet-300)}.job-meta-divider{background:var(--border-subtle);width:1px;height:24px}.popular-roles-block{flex-direction:column;gap:12px;display:flex}.popular-roles-label{letter-spacing:.08em;color:var(--text-muted);font-size:11px;font-weight:800}.popular-roles-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px;display:grid}.role-option-card{border-radius:var(--radius-lg);background:var(--bg-deep);border:1px solid var(--border-subtle);text-align:left;transition:all var(--transition-fast);cursor:pointer;flex-direction:column;gap:10px;padding:16px 20px;display:flex}.role-option-card:hover{border-color:var(--border-medium);background:var(--bg-elevated)}.role-option-card.selected{border-color:var(--color-purple-500);background:#8b5cf61a;box-shadow:0 0 16px #8b5cf626}.role-card-header{justify-content:space-between;align-items:center;display:flex}.role-card-title{color:var(--text-primary);font-size:15px;font-weight:700}.role-selected-check{color:var(--color-purple-500);font-size:14px;font-weight:800}.role-card-meta{justify-content:space-between;align-items:center;display:flex}.role-req-count{color:var(--text-muted);font-size:12px;font-weight:600}.skills-toolbar{justify-content:space-between;align-items:center;gap:20px;display:flex}.skills-search-wrap{flex:1;max-width:480px}.skills-selected-status{align-items:center;gap:16px;display:flex}.mastered-count-text{color:var(--text-secondary);font-size:13.5px}.mastered-count-text strong{color:var(--color-cyan-400)}.skills-category-bar{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.category-chip-btn{background:var(--bg-deep);border:1px solid var(--border-subtle);color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer;border-radius:9999px;padding:6px 14px;font-size:12.5px;font-weight:600}.category-chip-btn:hover{color:var(--text-primary);border-color:var(--border-medium)}.category-chip-btn.active{border-color:var(--color-purple-500);color:#fff;background:#8b5cf62e;font-weight:700}.skills-directory-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px;max-height:480px;padding-right:4px;display:grid;overflow-y:auto}.skills-empty-state{text-align:center;color:var(--text-muted);grid-column:1/-1;padding:40px}.skill-selectable-card{border-radius:var(--radius-lg);background:var(--bg-deep);border:1px solid var(--border-subtle);text-align:left;transition:all var(--transition-fast);cursor:pointer;flex-direction:column;justify-content:space-between;gap:10px;padding:14px 16px;display:flex}.skill-selectable-card:hover{border-color:var(--border-medium);background:var(--bg-elevated)}.skill-selectable-card.selected{border-color:var(--color-cyan-400);background:#22d3ee14}.skill-selectable-card.is-required{border-left:3px solid var(--color-purple-500)}.skill-card-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.skill-card-name{color:var(--text-primary);font-size:14px;font-weight:700}.skill-check-indicator{border:1px solid var(--border-subtle);width:22px;height:22px;color:var(--text-muted);background:#ffffff0f;border-radius:50%;flex-shrink:0;place-items:center;font-size:12px;font-weight:800;display:grid}.skill-check-indicator.checked{background:var(--color-cyan-400);color:#07070c;border:none}.skill-card-bottom{justify-content:space-between;align-items:center;gap:6px;display:flex}.skill-category-tag{color:var(--text-muted);font-size:11px;font-weight:500}.step-nav-footer{justify-content:space-between;align-items:center;gap:16px;padding-top:8px;display:flex}.step-hint-text{color:var(--text-secondary);font-size:13px;font-weight:500}.planner-readiness-layout{grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);align-items:stretch;gap:24px;display:grid}.path-generation-action-card{flex-direction:column;justify-content:space-between;gap:24px;padding:32px;display:flex}.action-card-header{flex-direction:column;gap:10px;display:flex}.action-eyebrow{letter-spacing:.1em;color:var(--color-cyan-400);font-size:10px;font-weight:800}.action-title{color:var(--text-primary);margin:0;font-size:22px;font-weight:800}.action-description{color:var(--text-secondary);margin:0;font-size:14.5px;line-height:1.55}.action-card-footer{margin-top:auto}.action-card-footer .sp-button{width:100%}.roadmap-page{flex-direction:column;gap:32px;display:flex}.roadmap-header-section{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.roadmap-header-left{flex-direction:column;gap:8px;display:flex}.roadmap-eyebrow{letter-spacing:.1em;color:var(--color-cyan-400);font-size:11px;font-weight:800}.roadmap-title{color:var(--text-primary);letter-spacing:-.025em;margin:0;font-size:32px;font-weight:800}.roadmap-description{color:var(--text-secondary);max-width:680px;margin:0;font-size:15px;line-height:1.5}.roadmap-header-right{flex-shrink:0;align-items:center;gap:12px;display:flex}.compact-target-badge,.compact-score-badge{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-md);text-align:right;flex-direction:column;padding:8px 16px;display:flex}.compact-lbl{letter-spacing:.08em;color:var(--text-muted);font-size:9px;font-weight:800}.compact-val{color:var(--color-violet-300);font-size:13.5px;font-weight:700}.compact-score-val{font-size:16px;font-weight:800;font-family:var(--font-mono);color:var(--color-cyan-400)}.roadmap-telemetry-strip{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);grid-template-columns:repeat(5,1fr);align-items:center;gap:20px;padding:18px 24px;display:grid}.roadmap-stat-item{flex-direction:column;gap:3px;display:flex}.stat-lbl{color:var(--text-muted);font-size:11px;font-weight:600}.stat-val{color:var(--text-primary);white-space:nowrap;text-overflow:ellipsis;font-size:15px;font-weight:700;overflow:hidden}.stat-val.highlight-violet{color:var(--color-violet-300)}.stat-val.highlight-cyan{color:var(--color-cyan-400);font-family:var(--font-mono)}.stat-val.text-green{color:var(--color-green-400)}.roadmap-stat-divider{display:none}.roadmap-empty-card{text-align:center;padding:64px 32px}.empty-card-content{flex-direction:column;align-items:center;gap:16px;max-width:520px;margin:0 auto;display:flex}.empty-icon-circle{border:1px solid var(--border-purple-glow);width:56px;height:56px;color:var(--color-violet-300);background:#8b5cf61f;border-radius:50%;place-items:center;display:grid}.empty-card-title{color:var(--text-primary);margin:0;font-size:24px;font-weight:800}.empty-card-desc{color:var(--text-secondary);margin:0;font-size:14.5px;line-height:1.55}.roadmap-timeline-wrapper{flex-direction:column;gap:24px;display:flex}.timeline-header-strip{justify-content:space-between;align-items:center;gap:16px;display:flex}.timeline-section-title{color:var(--text-primary);margin:0;font-size:20px;font-weight:800}.timeline-header-actions{align-items:center;gap:12px;display:flex}.timeline-nodes-list{flex-direction:column;gap:0;display:flex;position:relative}.timeline-node-item{grid-template-columns:48px 1fr;gap:20px;display:grid;position:relative}.timeline-marker{flex-direction:column;align-items:center;display:flex;position:relative}.marker-badge{background:linear-gradient(135deg, var(--color-purple-500), var(--color-violet-500));color:#fff;width:32px;height:32px;font-size:12px;font-weight:800;font-family:var(--font-mono);box-shadow:var(--shadow-glow);z-index:5;border-radius:50%;place-items:center;margin-top:24px;display:grid}.marker-dot{z-index:5;border-radius:50%;width:16px;height:16px;margin-top:28px}.marker-dot.cyan-glow{background:var(--color-cyan-400);box-shadow:0 0 12px var(--color-cyan-400)}.marker-dot.purple-glow{background:var(--color-violet-500);box-shadow:0 0 12px var(--color-violet-500)}.marker-line{background:linear-gradient(to bottom, var(--border-purple-glow), var(--border-subtle));flex:1;width:2px;min-height:48px;margin-top:4px}.milestone-card{flex-direction:column;gap:14px;margin-bottom:20px;padding:20px 24px;display:flex}.milestone-card.compact-target-card{gap:10px;margin-bottom:0;padding:18px 22px}.milestone-card-top{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.milestone-title-group{flex-direction:column;gap:4px;display:flex}.milestone-step-header{align-items:center;gap:10px;display:flex}.step-tag{letter-spacing:.1em;color:var(--color-cyan-400);font-size:10px;font-weight:800}.milestone-skill-name{color:var(--text-primary);margin:0;font-size:19px;font-weight:800}.milestone-badge-row{align-items:center;gap:12px;display:flex}.milestone-step-lbl{color:var(--text-muted);font-size:12px;font-weight:600}.origin-chips-wrap{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.more-skills-tag{color:var(--text-muted);font-size:12px;font-weight:600}.target-node-desc{color:var(--text-secondary);margin:0;font-size:13.5px;line-height:1.45}.milestone-prereqs-block{background:var(--bg-deep);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);flex-direction:column;gap:8px;padding:12px 16px;display:flex}.prereq-block-label{letter-spacing:.08em;color:var(--text-muted);font-size:10px;font-weight:800}.prereq-chips-row{flex-wrap:wrap;gap:8px;display:flex}.milestone-courses-block{flex-direction:column;gap:10px;display:flex}.courses-block-label{letter-spacing:.08em;color:var(--text-muted);font-size:11px;font-weight:800}.courses-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:12px;display:grid}.course-recommend-card{border-radius:var(--radius-lg);background:var(--bg-deep);border:1px solid var(--border-subtle);flex-direction:column;justify-content:space-between;gap:10px;padding:12px 16px;display:flex}.course-card-top{justify-content:space-between;align-items:center;gap:8px;display:flex}.course-provider-tag{color:var(--color-cyan-400);font-size:11px;font-weight:700}.course-duration-tag{color:var(--text-muted);font-size:11px;font-weight:600;font-family:var(--font-mono)}.course-title{color:var(--text-primary);margin:0;font-size:13.5px;font-weight:700;line-height:1.35}.course-card-bottom{justify-content:space-between;align-items:center;gap:8px;margin-top:4px;display:flex}.course-link-action{color:var(--color-cyan-400);transition:color var(--transition-fast);font-size:11.5px;font-weight:700;text-decoration:none}.course-link-action:hover{color:var(--color-violet-300);text-decoration:underline}.graph-workspace-page{flex-direction:column;gap:24px;display:flex}.graph-header-section{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.graph-header-left{flex-direction:column;gap:6px;display:flex}.graph-eyebrow{letter-spacing:.1em;color:var(--color-cyan-400);font-size:11px;font-weight:800}.graph-title{color:var(--text-primary);letter-spacing:-.025em;margin:0;font-size:32px;font-weight:800}.graph-description{color:var(--text-secondary);max-width:680px;margin:0;font-size:15px;line-height:1.5}.graph-header-right{flex-shrink:0;align-items:center;gap:12px;display:flex}.graph-toolbar-strip{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);justify-content:space-between;align-items:center;gap:20px;padding:14px 20px;display:flex}.toolbar-left-controls{flex:1;align-items:center;gap:16px;display:flex}.graph-search-wrap{width:320px}.graph-category-filter{align-items:center;gap:6px;display:flex}.graph-cat-btn{background:var(--bg-deep);border:1px solid var(--border-subtle);color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer;border-radius:9999px;padding:5px 12px;font-size:12px;font-weight:600}.graph-cat-btn:hover{color:var(--text-primary);border-color:var(--border-medium)}.graph-cat-btn.active{border-color:var(--color-purple-500);color:#fff;background:#8b5cf62e;font-weight:700}.toolbar-right-controls{align-items:center;gap:20px;display:flex}.graph-legend-group{align-items:center;gap:14px;display:flex}.legend-item{color:var(--text-muted);align-items:center;gap:6px;font-size:12px;font-weight:600;display:flex}.camera-btn-group{align-items:center;gap:6px;display:flex}.camera-ctrl-btn{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer;background:#ffffff0a;padding:6px 10px;font-size:12px;font-weight:700}.camera-ctrl-btn:hover{color:var(--text-primary);border-color:var(--border-medium);background:#ffffff14}.rotate-toggle-btn{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer;background:#ffffff0a;padding:6px 12px;font-size:12px;font-weight:600}.rotate-toggle-btn:hover{color:var(--text-primary);background:#ffffff14}.rotate-toggle-btn.active{border-color:var(--color-cyan-400);color:var(--color-cyan-400);background:#22d3ee1f}.graph-stage-layout{grid-template-columns:minmax(0,1fr) 340px;gap:20px;height:600px;display:grid}.graph-canvas-container{background:var(--bg-surface);border:1px solid var(--border-purple-glow);border-radius:var(--radius-2xl);width:100%;height:100%;box-shadow:var(--shadow-glow);position:relative;overflow:hidden}.graph-loading-skeleton{background:var(--bg-surface);flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;display:flex}.empty-courses-graph-overlay{background:var(--bg-surface);place-items:center;width:100%;height:100%;padding:40px;display:grid}.empty-courses-content{text-align:center;flex-direction:column;align-items:center;gap:14px;max-width:440px;display:flex}.empty-courses-icon{width:52px;height:52px;color:var(--color-green-400);background:#34d3991f;border:1px solid #34d3994d;border-radius:50%;place-items:center;display:grid}.empty-courses-title{color:var(--text-primary);margin:0;font-size:20px;font-weight:800}.empty-courses-desc{color:var(--text-secondary);margin:0 0 8px;font-size:14px;line-height:1.5}.node-inspector-panel{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-2xl);flex-direction:column;padding:24px;display:flex;overflow-y:auto}.inspector-empty-prompt{text-align:center;height:100%;color:var(--text-muted);flex-direction:column;justify-content:center;align-items:center;gap:12px;display:flex}.prompt-icon{border:1px solid var(--border-purple-glow);width:48px;height:48px;color:var(--color-violet-300);background:#8b5cf61f;border-radius:50%;place-items:center;display:grid}.prompt-title{color:var(--text-primary);margin:0;font-size:16px;font-weight:700}.prompt-desc{color:var(--text-secondary);margin:0;font-size:13px;line-height:1.5}.inspector-node-details{flex-direction:column;gap:20px;display:flex}.inspector-header{justify-content:space-between;align-items:flex-start;gap:12px;display:flex}.inspector-node-name{color:var(--text-primary);margin:6px 0 0;font-size:20px;font-weight:800}.close-inspector-btn{border:1px solid var(--border-subtle);width:28px;height:28px;color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0d;border-radius:50%;place-items:center;display:grid}.close-inspector-btn:hover{color:var(--text-primary);background:#ffffff1f}.inspector-body-stack{flex-direction:column;gap:16px;display:flex}.detail-meta-box{flex-direction:column;gap:2px;display:flex}.inspector-rel-section{border-top:1px solid var(--border-subtle);flex-direction:column;gap:8px;padding-top:8px;display:flex}.rel-section-lbl{letter-spacing:.08em;color:var(--text-muted);font-size:10px;font-weight:800}.rel-chips-wrap{flex-wrap:wrap;gap:6px;display:flex}.explorer-page{flex-direction:column;gap:24px;display:flex}.explorer-header-section{justify-content:space-between;align-items:flex-end;gap:24px;display:flex}.explorer-header-left{flex-direction:column;gap:6px;display:flex}.explorer-eyebrow{letter-spacing:.1em;color:var(--color-cyan-400);font-size:11px;font-weight:800}.explorer-title{color:var(--text-primary);letter-spacing:-.025em;margin:0;font-size:32px;font-weight:800}.explorer-description{color:var(--text-secondary);max-width:680px;margin:0;font-size:15px;line-height:1.5}.explorer-header-right{flex-shrink:0;align-items:center;gap:12px;display:flex}.explorer-toolbar-strip{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);justify-content:space-between;align-items:center;gap:20px;padding:14px 20px;display:flex}.explorer-search-wrap{width:320px}.explorer-filter-chips{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.explorer-chip-btn{background:var(--bg-deep);border:1px solid var(--border-subtle);color:var(--text-secondary);transition:all var(--transition-fast);cursor:pointer;border-radius:9999px;padding:5px 12px;font-size:12px;font-weight:600}.explorer-chip-btn:hover{color:var(--text-primary);border-color:var(--border-medium)}.explorer-chip-btn.active{border-color:var(--color-purple-500);color:#fff;background:#8b5cf62e;font-weight:700}.toolbar-right-meta{align-items:center;gap:14px;display:flex}.count-badge{color:var(--text-muted);font-size:12px;font-weight:700;font-family:var(--font-mono)}.mastered-toggle-btn{border-radius:var(--radius-sm);border:1px solid var(--border-subtle);color:var(--text-secondary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff0a;padding:5px 12px;font-size:12px;font-weight:600}.mastered-toggle-btn.active{border-color:var(--color-green-400);color:var(--color-green-400);background:#34d39924}.explorer-cards-grid{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.career-explorer-card{flex-direction:column;justify-content:space-between;gap:16px;padding:24px;display:flex}.career-card-header{flex-direction:column;gap:10px;display:flex}.career-badges-row{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.career-card-title{color:var(--text-primary);margin:4px 0 0;font-size:18px;font-weight:800}.skills-section-label{letter-spacing:.08em;color:var(--text-muted);margin-bottom:8px;font-size:10px;font-weight:800;display:block}.career-skills-chips{flex-wrap:wrap;gap:6px;display:flex}.skills-explorer-grid{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.skill-explorer-card{flex-direction:column;justify-content:space-between;gap:14px;padding:20px;display:flex}.skill-card-header{flex-direction:column;gap:8px;display:flex}.skill-meta-row{justify-content:space-between;align-items:center;gap:8px;display:flex}.skill-card-name{color:var(--text-primary);margin:0;font-size:16px;font-weight:700}.courses-explorer-grid{grid-template-columns:repeat(3,1fr);gap:20px;display:grid}.course-library-card{flex-direction:column;justify-content:space-between;gap:16px;padding:24px;display:flex}.course-meta-row{align-items:center;gap:8px;margin-bottom:8px;display:flex}.course-duration-text{color:var(--text-muted);font-size:12px;font-weight:600;font-family:var(--font-mono)}.course-name-heading{color:var(--text-primary);margin:0;font-size:16px;font-weight:800;line-height:1.35}.course-target-label{letter-spacing:.08em;color:var(--text-muted);margin-bottom:6px;font-size:10px;font-weight:800;display:block}.explorer-empty-card{text-align:center;padding:48px}.empty-content-box{flex-direction:column;align-items:center;gap:12px;max-width:440px;margin:0 auto;display:flex}.empty-icon{border:1px solid var(--border-purple-glow);width:48px;height:48px;color:var(--color-violet-300);background:#8b5cf61f;border-radius:50%;place-items:center;display:grid}.empty-title{color:var(--text-primary);margin:0;font-size:18px;font-weight:800}.empty-desc{color:var(--text-secondary);margin:0 0 8px;font-size:14px;line-height:1.5}.explorer-bottom-cta{background:var(--bg-surface);border:1px solid var(--border-purple-glow);border-radius:var(--radius-2xl);box-shadow:var(--shadow-glow);justify-content:space-between;align-items:center;gap:20px;padding:24px 32px;display:flex}.explorer-bottom-cta h4{color:var(--text-primary);margin:0 0 4px;font-size:16px;font-weight:800}.explorer-bottom-cta p{color:var(--text-secondary);margin:0;font-size:13px}@media (width<=1024px){.app-sidebar{z-index:100;width:280px;min-width:280px;height:100vh;transition:transform .25s cubic-bezier(.16,1,.3,1);display:flex;position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);box-shadow:0 0 36px #000000b3}.app-sidebar.mobile-open{transform:translate(0)}.sidebar-backdrop{z-index:90;-webkit-backdrop-filter:blur(4px);background:#000000a6;position:fixed;inset:0}.sidebar-close-btn{border-radius:var(--radius-md);border:1px solid var(--border-subtle);width:32px;height:32px;color:var(--text-secondary);cursor:pointer;background:#ffffff0d;place-items:center;margin-left:auto;display:grid}.sidebar-close-btn:hover{color:var(--text-primary);border-color:var(--color-purple-500)}.mobile-menu-btn{display:inline-flex}.dashboard-hero-banner{grid-template-columns:1fr}.page-context-desc{display:none}.how-steps-grid{grid-template-columns:1fr}.how-connector-line{display:none}.planner-step-bar,.job-selector-row,.planner-readiness-layout{grid-template-columns:1fr}.roadmap-header-section{flex-direction:column;align-items:flex-start;gap:16px}.roadmap-telemetry-strip{grid-template-columns:repeat(3,1fr)}.graph-stage-layout{grid-template-columns:1fr;height:500px}.node-inspector-panel{height:auto;max-height:320px}.explorer-cards-grid,.skills-explorer-grid,.courses-explorer-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=480px){.main-layout{padding:20px 16px 48px}.header-container{padding:0 16px}.sp-section-header{flex-direction:column;align-items:flex-start;gap:12px}.banner-title{font-size:32px}.banner-actions{flex-direction:column;width:100%}.banner-actions .sp-button{width:100%}.status-telemetry-strip{flex-direction:column;gap:16px}.telemetry-divider{display:none}.footer-container{flex-direction:column;align-items:flex-start;gap:12px;padding:0 20px}.skills-toolbar{flex-direction:column;align-items:stretch}.skills-search-wrap{max-width:100%}.skills-selected-status{justify-content:space-between}.skills-directory-grid{grid-template-columns:1fr}.step-nav-footer{flex-direction:column;gap:12px}.step-nav-footer .sp-button{width:100%}.roadmap-telemetry-strip{grid-template-columns:1fr}.timeline-node-item{grid-template-columns:32px 1fr;gap:12px}.courses-grid{grid-template-columns:1fr}.timeline-header-strip{flex-direction:column;align-items:flex-start;gap:12px}.graph-toolbar-strip{flex-direction:column;align-items:stretch;gap:12px}.toolbar-left-controls{flex-direction:column;align-items:stretch}.graph-search-wrap{width:100%}.toolbar-right-controls{justify-content:space-between}.graph-stage-layout{height:420px}.explorer-header-section{flex-direction:column;align-items:flex-start;gap:12px}.explorer-toolbar-strip{flex-direction:column;align-items:stretch;gap:12px}.explorer-search-wrap{width:100%}.explorer-cards-grid,.skills-explorer-grid,.courses-explorer-grid{grid-template-columns:1fr}.explorer-bottom-cta{flex-direction:column;align-items:flex-start;padding:20px}.explorer-bottom-cta .sp-button{width:100%}}.landing-shell{isolation:isolate;width:100%;min-height:100vh;position:relative}.landing-3d-background{z-index:0;pointer-events:none;width:100%;height:100vh;position:fixed;inset:0;overflow:hidden}.landing-content{z-index:10;box-sizing:border-box;flex-direction:column;gap:64px;width:100%;max-width:1320px;min-height:100vh;margin:0 auto;padding:0 24px 64px;display:flex;position:relative}.landing-main-body{z-index:10;flex-direction:column;gap:64px;width:100%;display:flex;position:relative}.landing-page-wrapper{z-index:10;box-sizing:border-box;flex-direction:column;gap:64px;width:100%;max-width:1320px;min-height:100vh;margin:0 auto;padding:0 24px 64px;display:flex;position:relative}.landing-top-navbar{z-index:50;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border-subtle);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm);background:#0b0a11d9;margin-top:12px;padding:12px 24px;position:sticky;top:0}.landing-nav-container{justify-content:space-between;align-items:center;gap:20px;display:flex}.landing-nav-brand{align-items:center;gap:12px;display:flex}.landing-brand-icon{border-radius:var(--radius-md);background:linear-gradient(135deg, var(--color-purple-500), var(--color-violet-500));color:#fff;width:34px;height:34px;box-shadow:var(--shadow-glow);place-items:center;display:grid}.landing-brand-text{flex-direction:column;display:flex}.landing-brand-name{color:var(--text-primary);font-size:16px;font-weight:800;line-height:1.1}.landing-brand-sub{color:var(--color-violet-300);letter-spacing:.08em;font-size:8px;font-weight:800}.landing-nav-links{align-items:center;gap:20px;display:flex}.landing-nav-link{color:var(--text-secondary);cursor:pointer;transition:color var(--transition-fast);background:0 0;border:none;font-size:13.5px;font-weight:600}.landing-nav-link:hover{color:var(--text-primary)}.landing-nav-actions{align-items:center;gap:16px;display:flex}.cinematic-hero-section{z-index:2;flex-direction:column;justify-content:center;width:100%;min-height:580px;margin-top:24px;display:flex;position:relative}.cinematic-hero-grid{grid-template-columns:1fr 380px;align-items:center;gap:48px;width:100%;display:grid}.hero-product-intro{flex-direction:column;gap:20px;display:flex}.cinematic-hero-headline{letter-spacing:-.035em;color:var(--text-primary);margin:0;font-size:48px;font-weight:800;line-height:1.14}.cinematic-hero-subtext{color:var(--text-secondary);max-width:640px;margin:0;font-size:16.5px;line-height:1.6}.hero-spatial-visualization{width:100%}.spatial-system-column{-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border-purple-glow);border-radius:var(--radius-xl);background:#0b0a11b8;flex-direction:column;gap:16px;padding:24px;display:flex;box-shadow:0 16px 40px #00000080}.spatial-column-header{border-bottom:1px solid var(--border-subtle);justify-content:space-between;align-items:center;padding-bottom:10px;display:flex}.spatial-column-tag{letter-spacing:.1em;color:var(--color-cyan-400);font-size:10px;font-weight:800;font-family:var(--font-mono)}.spatial-column-hint{color:var(--text-muted);font-size:11px}.spatial-stages-list{flex-direction:column;gap:10px;display:flex}.spatial-stage-box{border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border-subtle);cursor:pointer;transition:all var(--transition-fast);flex-direction:column;gap:4px;padding:12px 16px;display:flex;position:relative}.spatial-stage-box:hover,.spatial-stage-box.active{background:var(--bg-elevated);border-color:var(--color-purple-500);box-shadow:var(--shadow-sm)}.stage-box-top{align-items:center;gap:10px;display:flex}.stage-num-pill{border-radius:var(--radius-xs);font-size:10px;font-weight:800;font-family:var(--font-mono);padding:2px 6px}.stage-num-pill.cyan{color:var(--color-cyan-400);background:#22d3ee24}.stage-num-pill.purple{color:var(--color-violet-300);background:#8b5cf624}.stage-num-pill.violet{color:var(--color-violet-400);background:#c084fc24}.stage-num-pill.green{color:var(--color-green-400);background:#4ade8024}.stage-label-title{letter-spacing:.08em;color:var(--text-muted);font-size:11px;font-weight:800}.stage-sub-title{color:var(--text-primary);font-size:13px;font-weight:700}.stage-hover-desc{color:var(--text-secondary);margin:4px 0 0;font-size:12px;line-height:1.5}.spatial-flow-down-arrow{color:var(--text-muted);pointer-events:none;font-size:10px;position:absolute;bottom:-12px;left:20px}.workflow-5step-wrap{flex-direction:column;gap:24px;display:flex}.workflow-nav-nodes{grid-template-columns:repeat(5,1fr);gap:12px;width:100%;display:grid}.workflow-node-card{border-radius:var(--radius-xl);background:var(--bg-surface);border:1px solid var(--border-subtle);cursor:pointer;transition:all var(--transition-fast);flex-direction:column;gap:8px;padding:16px;display:flex;position:relative}.workflow-node-card:hover,.workflow-node-card.selected{background:var(--bg-elevated);border-color:var(--color-cyan-400);box-shadow:var(--shadow-sm)}.workflow-card-head{justify-content:space-between;align-items:center;display:flex}.step-badge{color:var(--color-cyan-400);font-size:12px;font-weight:800;font-family:var(--font-mono)}.step-tag-pill{letter-spacing:.08em;color:var(--text-muted);font-size:8px;font-weight:800}.workflow-card-title{color:var(--text-primary);margin:0;font-size:13.5px;font-weight:800}.workflow-card-sub{color:var(--text-muted);font-size:11px}.workflow-active-detail{flex-direction:column;gap:14px;padding:28px;display:flex}.detail-header{justify-content:space-between;align-items:center;display:flex}.detail-stage-num{color:var(--text-muted);font-size:12px;font-family:var(--font-mono)}.detail-title{color:var(--text-primary);margin:0;font-size:22px;font-weight:800}.detail-desc{color:var(--text-secondary);margin:0;font-size:15px;line-height:1.6}.detail-cta-row{margin-top:8px}.landing-eyebrow-badge{border-radius:var(--radius-full);border:1px solid var(--border-purple-glow);color:var(--color-violet-300);letter-spacing:.08em;background:#8b5cf624;align-items:center;gap:8px;width:fit-content;padding:6px 14px;font-size:11px;font-weight:800;display:inline-flex}.spatial-hero-headline{letter-spacing:-.03em;color:var(--text-primary);margin:0;font-size:44px;font-weight:800;line-height:1.15}.gradient-text-purple{background:linear-gradient(135deg, var(--color-violet-300), var(--color-purple-400));-webkit-text-fill-color:transparent;-webkit-background-clip:text}.spatial-hero-subtext{color:var(--text-secondary);margin:0;font-size:16px;line-height:1.6}.landing-hero-ctas{align-items:center;gap:16px;margin-top:4px;display:flex}.landing-status-strip{align-items:center;gap:10px;margin-top:4px;font-size:11px;font-weight:600;display:flex}.status-badge-item{align-items:center;gap:6px;display:flex}.status-badge-item.green{color:var(--color-green-400)}.status-badge-item.cyan{color:var(--color-cyan-400)}.status-badge-item.violet{color:var(--color-violet-300)}.status-dot{border-radius:50%;width:6px;height:6px}.status-dot.green{background:var(--color-green-400);box-shadow:0 0 6px var(--color-green-400)}.status-dot.cyan{background:var(--color-cyan-400);box-shadow:0 0 6px var(--color-cyan-400)}.status-dot.violet{background:var(--color-violet-400);box-shadow:0 0 6px var(--color-violet-400)}.status-divider{color:var(--text-muted)}.hero-hud-column{z-index:2;pointer-events:none;flex-direction:column;gap:14px;padding-right:12px;display:flex}.hud-transparent-card{border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);width:fit-content;box-shadow:var(--shadow-sm);background:#0b0a11b8;border:1px solid #8b5cf640;flex-direction:column;gap:2px;padding:12px 18px;display:flex}.hud-card-eyebrow{letter-spacing:.1em;color:var(--color-violet-300);font-size:9px;font-weight:800;font-family:var(--font-mono)}.hud-card-label{color:var(--text-muted);font-size:11px}.hud-card-val{font-size:13px;font-weight:700}.hud-card-val.cyan{color:var(--color-cyan-400)}.hud-card-val.violet{color:var(--color-violet-300)}.hud-card-val.green{color:var(--color-green-400)}.spatial-inspector-bar{z-index:3;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border:1px solid var(--border-purple-glow);border-radius:var(--radius-md);background:#0b0a11e0;align-items:center;gap:12px;padding:8px 16px;font-size:12px;display:flex;position:absolute;bottom:24px;left:48px;right:48px}.inspector-badge{color:var(--color-cyan-400);border-radius:var(--radius-xs);font-size:9px;font-weight:800;font-family:var(--font-mono);background:#22d3ee24;padding:2px 8px}.inspector-name{color:var(--text-primary);font-weight:700}.inspector-desc{color:var(--text-muted)}.hero-bottom-fade-mask{background:linear-gradient(to bottom, transparent, var(--bg-primary,#0b0a11));pointer-events:none;z-index:3;height:80px;position:absolute;bottom:0;left:0;right:0}.hero-3d-header{border-bottom:1px solid var(--border-subtle);background:#0b0a1199;justify-content:space-between;align-items:center;padding:12px 20px;display:flex}.stage-badge{color:var(--color-cyan-400);letter-spacing:.08em;font-size:10.5px;font-weight:800}.stage-controls-hint{color:var(--text-muted);font-size:11px}.hero-3d-canvas-container{background:#06050a;flex:1;width:100%;position:relative}.hero-3d-footer{border-top:1px solid var(--border-subtle);background:#0b0a1199;justify-content:space-between;align-items:center;padding:10px 20px;font-size:12px;display:flex}.node-legend-row{align-items:center;gap:14px;display:flex}.legend-item{color:var(--text-secondary);align-items:center;gap:6px;display:flex}.legend-dot{border-radius:50%;width:8px;height:8px}.legend-dot.cyan{background:var(--color-cyan-400);box-shadow:0 0 6px var(--color-cyan-400)}.legend-dot.violet{background:var(--color-violet-400);box-shadow:0 0 6px var(--color-violet-400)}.legend-dot.green{background:var(--color-green-400);box-shadow:0 0 6px var(--color-green-400)}.inspector-text{font-family:var(--font-mono);color:var(--color-violet-300);font-weight:600}.landing-metrics-strip{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-2xl);padding:24px 32px}.metrics-container{justify-content:space-between;align-items:center;gap:20px;display:flex}.metric-box{text-align:center;flex-direction:column;align-items:center;gap:4px;display:flex}.metric-number{color:var(--color-purple-400);font-size:28px;font-weight:800;font-family:var(--font-mono);line-height:1}.metric-label{color:var(--text-secondary);font-size:12px;font-weight:600}.metric-divider{background:var(--border-subtle);width:1px;height:36px}.landing-section{flex-direction:column;gap:24px;display:flex}.comparison-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}.comparison-card{flex-direction:column;gap:16px;padding:28px;display:flex}.card-tag{letter-spacing:.1em;border-radius:var(--radius-xs);width:fit-content;padding:4px 10px;font-size:10px;font-weight:800}.card-tag.red{color:var(--color-red-400);background:#f871711f;border:1px solid #f871714d}.card-tag.green{color:var(--color-green-400);background:#34d3991f;border:1px solid #34d3994d}.flat-list-diagram{border-radius:var(--radius-md);background:#0003;align-items:center;gap:12px;padding:16px;font-size:13px;display:flex}.flat-item{color:var(--text-primary);font-weight:700}.flat-arrow{color:var(--text-muted)}.graph-flow-diagram{border-radius:var(--radius-md);background:#0003;flex-direction:column;gap:8px;padding:16px;font-size:12.5px;font-weight:700;display:flex}.flow-step{border-radius:var(--radius-xs);width:fit-content;padding:6px 12px}.flow-step.cyan{color:var(--color-cyan-400);background:#22d3ee1f;border:1px solid #22d3ee4d}.flow-step.violet{color:var(--color-violet-300);background:#8b5cf61f;border:1px solid #8b5cf64d}.flow-step.lavender{color:var(--color-purple-300);background:#c4b5fd1f;border:1px solid #c4b5fd4d}.flow-step.green{color:var(--color-green-400);background:#34d3991f;border:1px solid #34d3994d}.flow-arrow{color:var(--text-muted);letter-spacing:.04em;padding-left:12px;font-size:10px}.card-footer-note{color:var(--text-muted);font-size:12px;font-weight:600}.steps-workflow-container{grid-template-columns:280px 1fr;gap:24px;display:grid}.steps-navigation-bar{flex-direction:column;gap:8px;display:flex}.step-tab-btn{border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border-subtle);color:var(--text-secondary);text-align:left;cursor:pointer;transition:all var(--transition-fast);align-items:center;gap:14px;padding:14px 18px;display:flex}.step-tab-btn:hover{border-color:var(--border-purple-glow);color:var(--text-primary)}.step-tab-btn.active{background:var(--bg-elevated);border-color:var(--color-purple-500);color:#fff;box-shadow:var(--shadow-sm)}.tab-num{font-size:12px;font-weight:800;font-family:var(--font-mono);color:var(--color-violet-300)}.tab-title{font-size:13.5px;font-weight:700}.step-detail-card{flex-direction:column;justify-content:space-between;gap:20px;padding:32px;display:flex}.step-detail-header{justify-content:space-between;align-items:center;display:flex}.step-count{color:var(--text-muted);font-size:12px;font-weight:600}.step-title{color:var(--text-primary);margin:0;font-size:24px;font-weight:800}.step-desc{color:var(--text-secondary);margin:0;font-size:15px;line-height:1.6}.relationships-grid{grid-template-columns:repeat(3,1fr);gap:24px;display:grid}.rel-card{flex-direction:column;gap:14px;padding:24px;display:flex}.rel-header{flex-direction:column;gap:4px;display:flex}.rel-type{color:var(--color-cyan-400);font-size:14px;font-weight:800;font-family:var(--font-mono)}.rel-node-label{color:var(--text-muted);font-size:12px}.rel-desc{color:var(--text-secondary);margin:0;font-size:13.5px;line-height:1.5}.rel-example{border-radius:var(--radius-sm);background:#0000004d;padding:10px 14px;font-size:11px}.rel-example code{color:var(--color-violet-300);font-family:var(--font-mono);word-break:break-all}.architecture-interactive-wrap{grid-template-columns:1fr 1fr;gap:24px;display:grid}.arch-layers-list{flex-direction:column;gap:8px;display:flex}.arch-layer-item{border-radius:var(--radius-lg);background:var(--bg-surface);border:1px solid var(--border-subtle);text-align:left;cursor:pointer;transition:all var(--transition-fast);flex-direction:column;gap:4px;padding:14px 18px;display:flex}.arch-layer-item:hover{border-color:var(--color-purple-500)}.arch-layer-item.selected{background:var(--bg-elevated);border-color:var(--color-cyan-400);box-shadow:var(--shadow-sm)}.layer-title{color:var(--text-primary);font-size:14px;font-weight:700}.layer-tech{color:var(--text-muted);font-size:11.5px;font-family:var(--font-mono)}.arch-detail-card{flex-direction:column;justify-content:center;gap:16px;padding:32px;display:flex}.arch-card-title{color:var(--text-primary);margin:0;font-size:22px;font-weight:800}.arch-card-desc{color:var(--text-secondary);margin:0;font-size:15px;line-height:1.6}.arch-tech-pill{color:var(--color-cyan-400);font-size:12px;font-weight:700;font-family:var(--font-mono)}.cypher-code-block-card{flex-direction:column;gap:16px;padding:24px;display:flex}.code-header{justify-content:space-between;align-items:center;display:flex}.code-filename{color:var(--text-secondary);font-size:12.5px;font-weight:700;font-family:var(--font-mono)}.cypher-syntax-pre{border-radius:var(--radius-md);border:1px solid var(--border-subtle);color:var(--color-violet-300);font-family:var(--font-mono);background:#07060b;margin:0;padding:20px;font-size:13px;line-height:1.6;overflow-x:auto}.journey-dual-grid{grid-template-columns:1fr 1fr;gap:24px;display:grid}.journey-group-card{flex-direction:column;gap:16px;padding:28px;display:flex}.group-title{color:var(--text-primary);margin:0;font-size:20px;font-weight:800}.group-desc{color:var(--text-secondary);margin:0;font-size:13.5px}.workspace-links-list{flex-direction:column;gap:8px;display:flex}.workspace-link-btn{border-radius:var(--radius-md);border:1px solid var(--border-subtle);color:var(--text-primary);cursor:pointer;transition:all var(--transition-fast);background:#ffffff08;justify-content:space-between;align-items:center;padding:12px 16px;font-size:13.5px;font-weight:600;display:flex}.workspace-link-btn:hover{border-color:var(--border-purple-glow);color:#fff;background:#8b5cf624}.link-arrow{color:var(--color-purple-400);font-weight:800}.tech-filter-bar{align-items:center;gap:10px;display:flex}.tech-chip-btn{border-radius:var(--radius-full);background:var(--bg-surface);border:1px solid var(--border-subtle);color:var(--text-secondary);letter-spacing:.06em;cursor:pointer;transition:all var(--transition-fast);padding:6px 14px;font-size:11px;font-weight:800}.tech-chip-btn:hover,.tech-chip-btn.active{border-color:var(--color-purple-500);color:var(--text-primary);background:#8b5cf629}.tech-cards-grid{grid-template-columns:repeat(4,1fr);gap:16px;display:grid}.tech-card{flex-direction:column;gap:10px;padding:20px;display:flex}.tech-name{color:var(--text-primary);margin:0;font-size:16px;font-weight:800}.tech-desc{color:var(--text-secondary);margin:0;font-size:12.5px;line-height:1.5}.highlights-grid{grid-template-columns:repeat(3,1fr);gap:14px;display:grid}.highlight-item-box{background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);color:var(--text-primary);align-items:center;gap:12px;padding:14px 18px;font-size:13px;font-weight:600;display:flex}.check-icon{color:var(--color-green-400);font-weight:800}.landing-cta-banner{border:1px solid var(--border-purple-glow);border-radius:var(--radius-2xl);text-align:center;box-shadow:var(--shadow-glow);background:linear-gradient(135deg,#8b5cf629,#06b6d41f);padding:48px}.cta-banner-content{flex-direction:column;align-items:center;gap:16px;max-width:640px;margin:0 auto;display:flex}.cta-eyebrow{color:var(--color-cyan-400);letter-spacing:.1em;font-size:11px;font-weight:800}.cta-title{color:var(--text-primary);margin:0;font-size:32px;font-weight:800}.cta-subtext{color:var(--text-secondary);margin:0;font-size:15px;line-height:1.6}.cta-buttons-row{align-items:center;gap:16px;margin-top:8px;display:flex}.landing-footer{border-top:1px solid var(--border-subtle);padding-top:24px}.landing-footer-container{justify-content:space-between;align-items:center;gap:20px;display:flex}.footer-brand{color:var(--text-primary);font-size:16px;font-weight:800}.footer-tagline{color:var(--text-muted);margin-left:8px;font-size:12px}.footer-tech-stack{color:var(--text-muted);align-items:center;gap:14px;font-size:12px;display:flex}@media (width<=1024px){.cinematic-hero-grid{grid-template-columns:1fr;gap:32px}.cinematic-hero-headline{font-size:36px}.workflow-nav-nodes{grid-template-columns:1fr}.landing-nav-links{display:none}.comparison-grid,.steps-workflow-container,.relationships-grid,.architecture-interactive-wrap,.journey-dual-grid,.tech-cards-grid,.highlights-grid{grid-template-columns:1fr}.metrics-container{flex-direction:column;gap:16px}.metric-divider{display:none}.cta-buttons-row{flex-direction:column;width:100%}.cta-buttons-row .sp-button{width:100%}}@media (width<=768px){.landing-content,.landing-page-wrapper{box-sizing:border-box;gap:40px;width:100%;max-width:100%;padding:0 16px 40px}.landing-top-navbar{box-sizing:border-box;width:100%;max-width:100%;margin-top:8px;padding:10px 14px}.landing-nav-container{gap:10px}.landing-brand-name{font-size:15px}.cinematic-hero-headline{word-break:break-word;overflow-wrap:break-word;font-size:32px;line-height:1.2}.cinematic-hero-subtext{max-width:100%;font-size:14.5px;line-height:1.5}.spatial-system-column{box-sizing:border-box;width:100%;max-width:100%;padding:16px;overflow:hidden}.flat-list-diagram,.graph-flow-diagram{flex-wrap:wrap;gap:8px}.landing-footer-container{flex-direction:column;align-items:flex-start;gap:12px}.footer-tech-stack{flex-wrap:wrap;gap:8px}.app-header{height:auto;min-height:56px;padding:8px 0}.header-container{box-sizing:border-box;gap:8px;width:100%;max-width:100%;padding:0 16px}.page-context-title{white-space:nowrap;text-overflow:ellipsis;max-width:180px;font-size:15px;overflow:hidden}.header-actions{gap:6px}}@media (width<=640px){.landing-status-strip{flex-wrap:wrap;gap:8px 12px;width:100%;font-size:10.5px}.status-divider,.landing-brand-sub{display:none}}@media (width<=480px){.cinematic-hero-headline{font-size:28px}.landing-eyebrow-badge{box-sizing:border-box;flex-wrap:wrap;max-width:100%;padding:4px 10px;font-size:10px}.landing-hero-ctas{flex-direction:column;gap:10px;width:100%}.landing-hero-ctas .sp-button{justify-content:center;width:100%}.landing-cta-banner{padding:24px 16px}.cta-title{font-size:24px}.spatial-inspector-bar{flex-wrap:wrap;padding:6px 10px;font-size:11px;bottom:12px;left:12px;right:12px}.hero-3d-header,.hero-3d-footer{flex-wrap:wrap;gap:8px;padding:8px 12px}}@media (width<=440px){.landing-top-navbar{padding:8px 10px}.landing-brand-icon{width:28px;height:28px}.landing-brand-name{font-size:14px}.landing-nav-actions .sp-status-label,.header-actions .sp-status-label{display:none}.landing-nav-actions .sp-button{padding:5px 8px;font-size:11.5px}.cinematic-hero-headline{font-size:24px}.spatial-column-header{flex-direction:column;align-items:flex-start;gap:4px}}
