:root{--arch-highlight-color: var(--primary-color);--arch-flow-color: var(--primary-color)}@keyframes arch-highlight{0%,to{filter:drop-shadow(0 0 5px var(--arch-highlight-color))}50%{filter:drop-shadow(0 0 16px var(--arch-highlight-color))}}@keyframes arch-fade-in{0%{opacity:0}to{opacity:1}}@keyframes arch-scale-up{0%{transform:scale(1)}to{transform:scale(1.2)}}@keyframes arch-color-change{0%,to{filter:saturate(1)}50%{filter:saturate(1.5) hue-rotate(20deg)}}@keyframes arch-bounce{0%,to{transform:translateY(0)}25%{transform:translateY(-8px)}50%{transform:translateY(-4px)}75%{transform:translateY(-6px)}}@keyframes arch-pulse-grow{0%{transform:scale(1);opacity:1}50%{transform:scale(1.15);opacity:.8}to{transform:scale(1);opacity:1}}@keyframes arch-rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes arch-blink{0%,49%,to{opacity:1}50%,99%{opacity:.3}}@keyframes arch-flow{to{stroke-dashoffset:0}}@keyframes arch-dash-flow{0%{stroke-dashoffset:50}to{stroke-dashoffset:0}}@keyframes arch-glow-pulse{0%,to{filter:drop-shadow(0 0 2px var(--arch-flow-color))}50%{filter:drop-shadow(0 0 12px var(--arch-flow-color))}}@keyframes arch-wave{0%{stroke-dashoffset:-100}to{stroke-dashoffset:100}}@keyframes arch-shimmer{0%{stroke-dasharray:10,10;stroke-dashoffset:0}to{stroke-dasharray:10,10;stroke-dashoffset:200}}@keyframes arch-edge-preview{0%,to{opacity:1}50%{filter:drop-shadow(0 0 8px var(--arch-flow-color))}}[data-arch-id]{cursor:pointer;transition:opacity .2s ease,filter .2s ease}line[data-arch-id],path[data-arch-id],polyline[data-arch-id]{pointer-events:stroke;stroke-linecap:round}.arch-hit-layer{pointer-events:none}.arch-hit-layer [data-arch-hit]{pointer-events:stroke}.arch-dimmed{opacity:.5!important}.arch-editing-node{filter:drop-shadow(0 0 10px rgba(217,26,58,.65))}.arch-editing-edge{animation:arch-edge-preview 1.2s ease-in-out infinite;stroke:var(--primary-color)!important}.arch-seen-node{filter:drop-shadow(0 0 4px rgba(217,26,58,.35))}.arch-seen-edge{stroke:var(--primary-color)!important;opacity:1!important}@media (prefers-reduced-motion: no-preference){.arch-highlighted[data-node-animation=highlight],.arch-highlighted:not([data-node-animation]){animation:arch-highlight 1.5s ease-in-out infinite}.arch-highlighted[data-node-animation=fade-in]{animation:arch-fade-in .8s ease-in}.arch-highlighted[data-node-animation=scale-up]{animation:arch-scale-up 1s ease-in-out infinite}.arch-highlighted[data-node-animation=color-change]{animation:arch-color-change 1.5s ease-in-out infinite}.arch-highlighted[data-node-animation=bounce]{animation:arch-bounce .8s ease-in-out infinite}.arch-highlighted[data-node-animation=pulse-grow]{animation:arch-pulse-grow 1.2s ease-in-out infinite}.arch-highlighted[data-node-animation=rotate]{animation:arch-rotate 2s linear infinite}.arch-highlighted[data-node-animation=blink]{animation:arch-blink 1s ease-in-out infinite}.arch-flowing[data-edge-animation=draw-path],.arch-flowing:not([data-edge-animation]){animation:arch-flow 1.2s linear forwards;stroke:var(--primary-color)!important}.arch-flowing[data-edge-animation=flow]{animation:arch-flow 1.2s linear forwards;stroke:var(--primary-color)!important}.arch-flowing[data-edge-animation=fade-in]{animation:arch-fade-in .8s ease-in;stroke:var(--primary-color)!important}.arch-flowing[data-edge-animation=pulse]{animation:arch-glow-pulse 1.5s ease-in-out infinite;stroke:var(--primary-color)!important}.arch-flowing[data-edge-animation=dash-flow]{animation:arch-dash-flow 1.5s ease-in-out forwards;stroke:var(--primary-color)!important}.arch-flowing[data-edge-animation=glow-pulse]{animation:arch-glow-pulse 1.5s ease-in-out infinite;stroke:var(--primary-color)!important}.arch-flowing[data-edge-animation=wave]{animation:arch-wave 2s ease-in-out infinite;stroke:var(--primary-color)!important}.arch-flowing[data-edge-animation=shimmer]{animation:arch-shimmer 2s ease-in-out infinite;stroke:var(--primary-color)!important}}@media (prefers-reduced-motion: reduce){.arch-highlighted,.arch-flowing,.arch-editing-edge{filter:drop-shadow(0 0 6px var(--arch-highlight-color))}}:root{--hue-brand: 221;--hue-accent: 142;--hue-danger: 354;--hue-warn: 42;--primary-color: hsl(var(--hue-brand), 72%, 42%);--primary-hover: hsl(var(--hue-brand), 72%, 36%);--primary-subtle: hsl(var(--hue-brand), 72%, 96%);--secondary-color: hsl(var(--hue-accent), 70%, 44%);--secondary-bg: hsl(var(--hue-accent), 60%, 94%);--danger: hsl(var(--hue-danger), 76%, 42%);--danger-subtle: hsl(var(--hue-danger), 76%, 96%);--warn: hsl(var(--hue-warn), 88%, 50%);--warn-subtle: hsl(var(--hue-warn), 88%, 95%);--neutral-0: #f5f3f0;--neutral-50: #edeae5;--neutral-100: #e2deda;--neutral-200: #ccc8c2;--neutral-300: #b0aba3;--neutral-400: #908b83;--neutral-500: #6b655d;--neutral-600: #4a453e;--neutral-700: #302c27;--neutral-800: #201d19;--neutral-900: #131110;--background-color: var(--neutral-50);--app-bg: var(--background-color);--surface: rgba(245, 243, 240, .96);--surface-muted: hsla(var(--hue-brand), 30%, 45%, .07);--border: rgba(15, 23, 42, .1);--border-strong: rgba(15, 23, 42, .18);--text-color: var(--neutral-700);--text-muted: var(--neutral-500);--shadow-sm: 0 1px 3px rgba(15, 23, 42, .06), 0 1px 2px rgba(15, 23, 42, .04);--shadow: 0 4px 16px rgba(15, 23, 42, .08), 0 1px 4px rgba(15, 23, 42, .04);--shadow-lg: 0 16px 48px rgba(15, 23, 42, .1), 0 4px 12px rgba(15, 23, 42, .06);--node-chip: hsla(var(--hue-brand), 72%, 50%, .12);--edge-chip: hsla(var(--hue-accent), 60%, 44%, .16);--space-1: 4px;--space-2: 8px;--space-3: 12px;--space-4: 16px;--space-5: 20px;--space-6: 24px;--space-8: 32px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 16px;--radius-xl: 24px;--radius-pill: 999px;--text-xs: .72rem;--text-sm: .82rem;--text-base: 1rem;--text-lg: 1.1rem;--text-xl: 1.25rem;--transition-fast: .1s ease;--transition-base: .16s ease}.theme-dark{--background-color: #0d1117;--app-bg: var(--background-color);--text-color: #e6eaf2;--text-muted: rgba(230, 234, 242, .55);--surface: rgba(22, 27, 40, .97);--surface-muted: rgba(255, 255, 255, .06);--border: rgba(255, 255, 255, .08);--border-strong: rgba(255, 255, 255, .14);--shadow-sm: 0 1px 3px rgba(0, 0, 0, .28), 0 1px 2px rgba(0, 0, 0, .2);--shadow: 0 4px 16px rgba(0, 0, 0, .32), 0 1px 4px rgba(0, 0, 0, .2);--shadow-lg: 0 16px 48px rgba(0, 0, 0, .4), 0 4px 12px rgba(0, 0, 0, .24);--danger: hsl(var(--hue-danger), 80%, 62%);--danger-subtle: hsla(var(--hue-danger), 80%, 62%, .12);--primary-color: hsl(var(--hue-brand), 76%, 62%);--primary-hover: hsl(var(--hue-brand), 76%, 70%);--primary-subtle: hsla(var(--hue-brand), 76%, 62%, .12);--secondary-color: hsl(var(--hue-accent), 58%, 54%);--secondary-bg: hsla(var(--hue-accent), 58%, 54%, .14);--node-chip: hsla(var(--hue-brand), 76%, 62%, .18);--edge-chip: hsla(var(--hue-accent), 58%, 54%, .18)}.theme-light{--background-color: #e8e5e0;--app-bg: var(--background-color);--text-color: var(--neutral-700);--text-muted: var(--neutral-500);--surface: rgba(242, 240, 237, .92);--surface-muted: hsla(var(--hue-brand), 30%, 45%, .07);--border: rgba(48, 44, 39, .1);--border-strong: rgba(48, 44, 39, .18);--danger: hsl(var(--hue-danger), 72%, 40%);--node-chip: hsla(var(--hue-brand), 60%, 50%, .12);--edge-chip: hsla(var(--hue-accent), 50%, 44%, .16)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-height:100vh;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;background:radial-gradient(ellipse 60% 40% at 0% 0%,hsla(var(--hue-brand),50%,60%,.05),transparent),radial-gradient(ellipse 50% 35% at 100% 100%,hsla(var(--hue-accent),50%,50%,.05),transparent),var(--app-bg);color:var(--text-color)}.theme-dark body{background:radial-gradient(ellipse 50% 40% at 0% 0%,hsla(var(--hue-brand),72%,50%,.1),transparent),radial-gradient(ellipse 45% 35% at 100% 100%,hsla(var(--hue-accent),60%,44%,.08),transparent),var(--app-bg)}.theme-dark .hero-upload-card,.theme-dark .canvas-stage,.theme-dark .animation-pane,.theme-dark .feature-card{background:#161b28f7}.theme-dark .hero-copy-note,.theme-dark .hero-upload-description,.theme-dark .playback-meta,.theme-dark .canvas-hint,.theme-dark .animation-pane-header p,.theme-dark .animation-pane-empty,.theme-dark .svg-canvas-empty,.theme-dark .playback-setting,.theme-dark .feature-card p{color:var(--text-muted)!important}.theme-dark .playback-bar,.theme-dark .step-timeline-row,.theme-dark .assignment-group,.theme-dark input[type=text],.theme-dark input[type=search]{background:#161b28e6;border-color:var(--border)}.theme-dark .hero-upload-title,.theme-dark .feature-label,.theme-dark .step-timeline-row,.theme-dark .assignment-group-title,.theme-dark h1,.theme-dark h2,.theme-dark h3,.theme-dark p{color:var(--text-color)}.theme-dark select,.theme-dark input[type=text],.theme-dark input[type=search],.theme-dark input[type=number]{background:#161b28e6;color:var(--text-color);border-color:var(--border);color-scheme:dark}button,input,select{font:inherit}button{border:0;border-radius:var(--radius-pill);padding:.62rem 1.1rem;background:var(--primary-color);color:#fff;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);transition:transform var(--transition-fast),box-shadow var(--transition-fast),background var(--transition-fast),opacity var(--transition-fast);font-size:var(--text-sm);font-weight:600;letter-spacing:.01em}.material-icons{font-size:1.1em;line-height:1}button:hover:not(:disabled){transform:translateY(-1px);background:var(--primary-hover);box-shadow:0 4px 16px hsla(var(--hue-brand),72%,42%,.28)}button:active:not(:disabled){transform:translateY(0)}button:disabled{opacity:.42;cursor:not-allowed}button.secondary{background:var(--secondary-color);color:#fff}button.secondary:hover:not(:disabled){background:hsl(var(--hue-accent),70%,38%);box-shadow:0 4px 16px hsla(var(--hue-accent),60%,44%,.28)}.theme-dark button.secondary{color:#fff}button.ghost{background:transparent;border:1px solid var(--border-strong);color:var(--text-color);box-shadow:none}button.ghost:hover:not(:disabled){background:var(--surface-muted);border-color:var(--border-strong);box-shadow:none}button.danger-text{color:var(--danger);border-color:hsla(var(--hue-danger),76%,42%,.25);background:transparent}button.danger-text:hover:not(:disabled){background:var(--danger-subtle);box-shadow:none}.app-shell{max-width:1440px;margin:0 auto;padding:0 var(--space-6) 48px}.app-header{display:flex;justify-content:space-between;align-items:center;gap:var(--space-5);min-height:72px;padding:var(--space-4) 0;margin-bottom:28px;border-bottom:1px solid var(--border)}.app-brand{display:inline-flex;align-items:center;gap:var(--space-3);min-width:0;color:var(--text-color);text-decoration:none;font-size:var(--text-base);font-weight:800}.app-brand-logo{width:38px;height:38px;border-radius:var(--radius-sm);background:var(--neutral-0);box-shadow:var(--shadow);flex-shrink:0}.beta-tag{padding:3px 8px;border-radius:var(--radius-pill);background:var(--secondary-bg);color:var(--secondary-color);font-size:var(--text-xs);font-weight:800;letter-spacing:.08em}.theme-dark .beta-tag{background:var(--secondary-bg);color:hsl(var(--hue-accent),58%,72%)}.header-actions{display:flex;align-items:center;gap:var(--space-3)}.theme-segmented{display:inline-flex;align-items:center;gap:2px;padding:3px;border-radius:var(--radius-md);background:var(--surface-muted);border:1px solid var(--border)}.theme-segmented button{min-height:34px;padding:0 10px;border-radius:calc(var(--radius-md) - 2px);background:transparent;color:var(--text-muted);box-shadow:none;font-size:var(--text-xs);font-weight:700}.theme-segmented button:hover:not(:disabled){background:var(--surface-muted);color:var(--text-color);box-shadow:none;transform:none}.theme-segmented button.is-active{background:var(--surface);color:var(--text-color);box-shadow:var(--shadow-sm)}.theme-dark .theme-segmented{background:#ffffff0d}.theme-dark .theme-segmented button.is-active{background:#ffffff1a}.header-pricing-link{min-height:40px;display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:0 var(--space-4);border-radius:var(--radius-md);background:var(--primary-subtle);color:var(--primary-color);font-weight:700;text-decoration:none;font-size:var(--text-sm);transition:background var(--transition-base)}.header-pricing-link:hover{background:hsla(var(--hue-brand),72%,50%,.14)}.theme-dark .header-pricing-link{background:hsla(var(--hue-brand),76%,62%,.14);color:var(--primary-color)}.hero-section{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:48px;align-items:center;margin-bottom:40px}.hero-content{display:flex;flex-direction:column;gap:var(--space-5);max-width:720px;padding:var(--space-5) 0}.eyebrow{margin:0 0 var(--space-2);color:var(--primary-color);text-transform:uppercase;letter-spacing:.22em;font-size:var(--text-xs);font-weight:700}h1{margin:0;font-size:clamp(2rem,4vw,3.8rem);line-height:1.04;max-width:760px;letter-spacing:-.02em}.hero-copy{max-width:640px;margin:0;color:var(--text-muted);line-height:1.65;font-size:1.05rem}.theme-dark .hero-copy{color:var(--text-muted)}.hero-feature-list{list-style:none;margin:var(--space-2) 0 0;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-3)}.hero-feature-list li{display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:0 var(--space-3);border-radius:var(--radius-pill);background:var(--surface-muted);border:1px solid var(--border);color:var(--text-color);font-size:var(--text-sm);font-weight:600}.hero-feature-list .material-icons{color:var(--primary-color)}.hero-upload-section{display:flex;justify-content:center;align-items:flex-start}@media (max-width: 980px){.hero-section{grid-template-columns:1fr;gap:var(--space-6)}.hero-upload-section{justify-content:stretch}}@media (max-width: 640px){.app-shell{padding:0 var(--space-4) 36px}.app-header{align-items:flex-start;flex-direction:column;gap:var(--space-3);padding:14px 0}.header-actions{width:100%;justify-content:space-between}.theme-label{display:none}.theme-segmented button{width:40px;padding:0}.hero-content{padding-top:var(--space-2)}}.hero-upload-card{width:100%;max-width:360px;padding:var(--space-6);border-radius:var(--radius-xl);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow-lg);display:grid;gap:var(--space-5)}.hero-upload-title{margin:0 0 var(--space-2);font-size:var(--text-xs);text-transform:uppercase;letter-spacing:.18em;color:var(--primary-color);font-weight:700}.hero-upload-description{margin:0;line-height:1.75;color:var(--text-muted);font-size:.94rem}.hero-upload-meta{display:grid;gap:var(--space-3)}.hero-upload-card .uploader.compact{width:100%;justify-content:space-between}.hero-upload-card .upload-hint{color:var(--text-muted)}.pricing-section{margin-top:40px;padding:36px var(--space-6);border-top:1px solid var(--border)}.pricing-grid{max-width:1000px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:var(--space-5)}.pricing-card{padding:var(--space-5);border-radius:var(--radius-lg);background:var(--surface);border:1px solid var(--border)}.pricing-card h3{margin:0 0 var(--space-2)}.pricing-sub{margin:0 0 var(--space-3);color:var(--text-muted)}.pricing-card ul{margin:0 0 var(--space-3);padding-left:1.15rem}.pricing-price{font-weight:700;margin:0}.editor-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,420px);gap:var(--space-5);align-items:stretch}.editor-workspace.is-canvas-maximized{grid-template-columns:1fr}.editor-workspace.is-canvas-maximized .animation-pane{display:none}.canvas-stage{display:flex;flex-direction:column;gap:var(--space-3);min-height:640px;padding:var(--space-5);border-radius:var(--radius-xl);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow)}.stage-toolbar{flex-shrink:0;display:flex;align-items:center;gap:var(--space-3)}.playback-bar{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-4);flex:1 1 auto;min-width:0;padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);background:var(--neutral-50);border:1px solid var(--border)}.theme-dark .playback-bar{background:#161b28e6}.playback-bar.is-disabled{opacity:.5}.playback-controls{display:flex;align-items:center;gap:var(--space-2)}.maximize-btn{font-size:var(--text-base)}.play-btn{min-width:88px;font-weight:700}.icon-btn{width:34px;height:34px;padding:0;display:inline-flex;align-items:center;justify-content:center;border-radius:var(--radius-sm)}.playback-meta{font-size:.9rem;font-weight:600;color:var(--text-muted)}.playback-settings{display:flex;align-items:center;gap:var(--space-4);margin-left:auto}.playback-setting{display:inline-flex;align-items:center;gap:var(--space-2);font-size:.88rem}.playback-setting select{border:1px solid var(--border-strong);border-radius:var(--radius-sm);padding:5px 10px;background:var(--surface);color:var(--text-color);box-shadow:none;color-scheme:light;font-size:var(--text-sm)}.theme-dark .playback-setting select{background:#161b28f2;color:var(--text-color);border-color:var(--border-strong);color-scheme:dark}.playback-loop input{accent-color:var(--primary-color)}.svg-canvas-wrap{position:relative;flex:1;min-height:480px;border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--neutral-0);overflow:hidden}.theme-dark .svg-canvas-wrap{background:#0f1420f2}.canvas-stage.is-maximized .svg-canvas-wrap{min-height:72vh}.svg-canvas-inner{width:100%;height:100%;min-height:480px;display:flex;align-items:center;justify-content:center;padding:var(--space-6)}.svg-canvas-inner svg{max-width:100%;max-height:100%;height:auto}.svg-canvas-empty{min-height:480px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-2);color:var(--text-muted);text-align:center;padding:32px}.svg-canvas-empty-icon{width:56px;height:56px;border-radius:var(--radius-lg);display:grid;place-items:center;font-size:1.4rem;background:var(--primary-subtle);color:var(--primary-color)}.theme-dark .svg-canvas-empty-icon{background:hsla(var(--hue-brand),76%,62%,.12)}.svg-canvas-empty p{margin:0;font-weight:700;color:var(--text-color)}.svg-canvas-empty span{font-size:.92rem}.playback-caption{position:absolute;left:50%;bottom:var(--space-5);transform:translate(-50%);max-width:min(90%,520px);padding:var(--space-3) var(--space-5);border-radius:var(--radius-pill);background:#0f172ae0;color:#fff;font-weight:600;text-align:center;box-shadow:var(--shadow-lg);font-size:var(--text-sm);letter-spacing:.01em}.canvas-hint{margin:0;font-size:.9rem;color:var(--text-muted)}.animation-pane{display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5);border-radius:var(--radius-xl);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);position:sticky;top:16px;height:calc(100vh - 48px);min-height:560px;overflow:hidden}.animation-pane-body{flex:1;min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:var(--space-4);padding-right:var(--space-1);scrollbar-color:hsla(var(--hue-brand),60%,60%,.45) transparent;scrollbar-width:thin}.animation-pane-body::-webkit-scrollbar{width:6px}.animation-pane-body::-webkit-scrollbar-track{background:transparent;border-radius:var(--radius-pill)}.animation-pane-body::-webkit-scrollbar-thumb{background:hsla(var(--hue-brand),60%,60%,.35);border-radius:var(--radius-pill)}.animation-pane-body::-webkit-scrollbar-thumb:hover{background:hsla(var(--hue-brand),60%,60%,.55)}.theme-dark .animation-pane-body{scrollbar-color:rgba(255,255,255,.2) transparent}.theme-dark .animation-pane-body::-webkit-scrollbar-thumb{background:#ffffff2e}.animation-pane-header{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:var(--space-4)}.animation-pane-header h2{margin:0;font-size:var(--text-lg);letter-spacing:-.01em}.animation-pane-header p{margin:4px 0 0;font-size:var(--text-sm);color:var(--text-muted);line-height:1.5}.animation-pane-actions{display:flex;gap:var(--space-2);align-items:center}.animation-pane-actions button{padding:.46rem .8rem;font-size:var(--text-xs)}.animation-pane-actions button .material-icons{font-size:.95rem}.step-search{margin-bottom:var(--space-4)}.step-search input{width:100%;border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:9px var(--space-3);background:var(--surface);color:var(--text-color);font-size:.9rem}.step-search input::placeholder{color:var(--text-muted)}.step-search-empty{padding:var(--space-4);border-radius:var(--radius-md);background:var(--surface-muted);color:var(--text-muted);font-size:.88rem}.animation-pane-empty{padding:var(--space-6) var(--space-4);border-radius:var(--radius-lg);background:var(--surface-muted);text-align:center;color:var(--text-muted);font-size:.9rem}.animation-pane-empty p{margin:0 0 var(--space-3)}.step-timeline{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px}.step-timeline>li{flex-shrink:0}.step-timeline-row{width:100%;min-height:44px;display:flex;align-items:center;gap:var(--space-2);padding:6px var(--space-2);border-radius:var(--radius-sm);border:1px solid var(--border);background:var(--surface);box-shadow:none;border-color:var(--border-strong)}.step-row-actions{display:flex;flex-shrink:0;gap:3px;margin-left:auto}.step-timeline-row.is-editing{border-color:hsla(var(--hue-brand),72%,50%,.4);background:var(--primary-subtle)}.theme-dark .step-timeline-row.is-editing{background:hsla(var(--hue-brand),76%,62%,.1);border-color:hsla(var(--hue-brand),76%,62%,.35)}.step-timeline-row.is-playing{border-color:hsla(var(--hue-warn),88%,50%,.65);background:var(--warn-subtle)}.theme-dark .step-timeline-row.is-playing{background:hsla(var(--hue-warn),88%,50%,.1);border-color:hsla(var(--hue-warn),88%,60%,.45)}.step-timeline-num{flex-shrink:0;width:22px;height:22px;border-radius:var(--radius-pill);display:grid;place-items:center;font-size:var(--text-xs);font-weight:700;background:var(--primary-color);color:#fff}.step-timeline-body{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px}.step-timeline-label{font-weight:600;font-size:var(--text-sm);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.step-timeline-meta{font-size:var(--text-xs);color:var(--text-muted)}.step-playing-badge{flex-shrink:0;width:24px;height:24px;display:grid;place-items:center;font-size:var(--text-xs);font-weight:700;border-radius:var(--radius-pill);background:var(--secondary-color);color:#fff}.step-detail{flex-shrink:0;display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-4);border-radius:var(--radius-lg);border:1px solid var(--border);background:var(--primary-subtle)}.theme-dark .step-detail{background:hsla(var(--hue-brand),76%,62%,.07)}.step-detail-header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2)}.step-detail-num{font-weight:700;font-size:.9rem}.step-detail-delete{font-size:.78rem;padding:.35rem .75rem}.field-label{display:flex;flex-direction:column;gap:var(--space-2);font-size:var(--text-sm);font-weight:600}.field-label-text{display:block;font-weight:700;color:var(--text-color);font-size:var(--text-sm)}.field-hint{display:block;font-size:var(--text-xs);color:var(--text-muted);font-weight:500;margin-top:2px}.field-label input,.field-label select{border:1px solid var(--border-strong);border-radius:var(--radius-md);padding:9px var(--space-3);background:var(--surface);color:var(--text-color);font-size:.88rem;transition:border-color var(--transition-fast)}.field-label input:focus,.field-label select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px hsla(var(--hue-brand),72%,50%,.12)}.theme-dark .field-label input,.theme-dark .field-label select{background:#161b28e6;border-color:var(--border-strong);color:var(--text-color)}.assignment-hint{display:flex;flex-wrap:wrap;gap:var(--space-2)}.hint-chip{font-size:var(--text-xs);padding:4px var(--space-2);border-radius:var(--radius-pill);border:1px solid var(--border);color:var(--text-muted)}.hint-chip-node{background:var(--node-chip);border-color:hsla(var(--hue-brand),72%,50%,.18)}.hint-chip-edge{background:var(--edge-chip);border-color:hsla(var(--hue-accent),60%,44%,.22)}.hint-chip-toggle{background:var(--surface-muted)}.assignment-group-title{font-size:var(--text-xs);font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:var(--space-2)}.assignment-empty{margin:0;font-size:var(--text-sm);color:var(--text-muted)}.assignment-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--space-2)}.chip{border-radius:var(--radius-pill);padding:5px 10px;font-size:var(--text-xs);font-weight:600;box-shadow:none;border:1px solid transparent;cursor:pointer;transition:opacity var(--transition-fast)}.chip:hover{transform:none;opacity:.78}.chip-node{background:var(--node-chip);color:var(--primary-color);border-color:hsla(var(--hue-brand),72%,50%,.2)}.theme-dark .chip-node{color:hsl(var(--hue-brand),76%,72%)}.chip-edge{background:var(--edge-chip);color:hsl(var(--hue-accent),70%,32%);border-color:hsla(var(--hue-accent),60%,44%,.28)}.theme-dark .chip-edge{color:hsl(var(--hue-accent),58%,62%)}.uploader.compact{border:1.5px dashed var(--border-strong);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);background:var(--primary-subtle);display:flex;align-items:center;justify-content:center;gap:var(--space-3);text-align:center;transition:background var(--transition-base)}.theme-dark .uploader.compact{background:hsla(var(--hue-brand),76%,62%,.07)}.uploader.compact:hover{background:hsla(var(--hue-brand),72%,50%,.1)}.upload-label{position:relative;overflow:hidden;display:inline-flex}.upload-label span{display:inline-block;padding:.52rem .92rem;border-radius:var(--radius-pill);background:var(--primary-color);color:#fff;font-size:.88rem;font-weight:600;cursor:pointer;transition:background var(--transition-fast)}.upload-label span:hover{background:var(--primary-hover)}.upload-label input[type=file]{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;cursor:pointer}.upload-hint{font-size:var(--text-sm);color:var(--text-muted)}.save-load{display:flex;flex:0 0 auto;align-items:center;gap:var(--space-2);padding:6px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--neutral-50)}.theme-dark .save-load{background:#161b28e6;border-color:var(--border)}.save-load .ghost,.save-load .file-btn{min-height:36px;padding:0 var(--space-3);border-radius:var(--radius-sm);font-size:var(--text-sm);font-weight:700;white-space:nowrap}.file-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);border:1px solid var(--border-strong);color:var(--text-color);background:transparent;cursor:pointer;border-radius:var(--radius-sm);transition:background var(--transition-fast)}.file-btn:hover{background:var(--surface-muted)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f172a80;display:grid;place-items:center;padding:var(--space-6);z-index:100;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.theme-dark .modal-backdrop{background:#000000a6}.modal-card{width:min(520px,100%);max-height:min(80vh,640px);overflow:auto;background:var(--surface);border-radius:var(--radius-xl);border:1px solid var(--border-strong);box-shadow:var(--shadow-lg);padding:var(--space-6)}.modal-header h3{margin:0;letter-spacing:-.01em}.modal-header p{margin:var(--space-2) 0 0;color:var(--text-muted);font-size:.92rem;line-height:1.55}.modal-card.suggest-modal{max-width:520px}.suggest-content{display:flex;flex-direction:column;gap:var(--space-6);margin:var(--space-6) 0}.suggest-section{display:flex;flex-direction:column;gap:var(--space-3)}.suggest-section-title{margin:0;font-size:.82rem;font-weight:700;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted)}.suggest-animation-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--space-3)}.animation-field{display:flex;flex-direction:column;gap:var(--space-2)}.field-name{font-size:var(--text-sm);font-weight:600;color:var(--text-color)}.animation-select{padding:8px var(--space-3);border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--text-color);font-size:.88rem;box-shadow:none;cursor:pointer;transition:border-color var(--transition-fast)}.animation-select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px hsla(var(--hue-brand),72%,50%,.12)}.theme-dark .animation-select{background:#161b28e6;border-color:var(--border-strong);color-scheme:dark}@media (max-width: 520px){.suggest-animation-row{grid-template-columns:1fr}}.suggest-preview-list{list-style:none;margin:var(--space-5) 0;padding:0;display:flex;flex-direction:column;gap:var(--space-3)}.suggest-preview-list li{display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-3);border-radius:var(--radius-md);background:var(--surface-muted)}.suggest-preview-list li.is-deselected{opacity:.45}.suggest-preview-toggle{display:inline-flex;align-items:center;gap:var(--space-2);flex-shrink:0}.suggest-preview-toggle input{width:16px;height:16px;accent-color:var(--primary-color)}.suggest-preview-num{width:24px;height:24px;border-radius:var(--radius-pill);display:grid;place-items:center;font-size:var(--text-xs);font-weight:700;background:var(--primary-color);color:#fff;flex-shrink:0}.suggest-preview-meta{display:block;margin-top:2px;font-size:.78rem;color:var(--text-muted)}.suggest-scope-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}.suggest-scope-option{min-height:110px;padding:var(--space-4) var(--space-3);border-radius:var(--radius-lg);background:var(--surface-muted);border:1.5px solid var(--border);color:var(--text-color);box-shadow:none;display:flex;flex-direction:column;gap:var(--space-2);text-align:center;align-items:center;justify-content:center;transition:transform var(--transition-base),box-shadow var(--transition-base),border-color var(--transition-base),background var(--transition-base);cursor:pointer}.suggest-scope-option:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 20px hsla(var(--hue-brand),72%,50%,.15);border-color:var(--primary-color);background:var(--primary-subtle)}.suggest-scope-option:active:not(:disabled){transform:translateY(0)}.theme-dark .suggest-scope-option{border-color:var(--border)}.theme-dark .suggest-scope-option:hover:not(:disabled){border-color:hsla(var(--hue-brand),76%,62%,.5);background:hsla(var(--hue-brand),76%,62%,.1);box-shadow:0 6px 20px hsla(var(--hue-brand),76%,62%,.18)}.suggest-scope-option .material-icons{color:var(--primary-color);font-size:1.5rem}.suggest-scope-option strong{font-size:.9rem;font-weight:700}.suggest-scope-option span:last-child{font-size:.75rem;color:var(--text-muted);font-weight:500}@media (max-width: 640px){.suggest-scope-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.suggest-section-title{font-size:.78rem}}.modal-footer{display:flex;justify-content:flex-end;gap:var(--space-3)}.app-footer{margin-top:48px;padding:var(--space-5) var(--space-6);border-top:1px solid var(--border);background:transparent}.app-footer-inner{max-width:1000px;margin:0 auto;display:flex;flex-direction:column;gap:6px;align-items:center}.footer-tag{margin:0;font-weight:700;color:var(--text-color);text-align:center}.footer-copy{margin:0;font-size:.88rem;color:var(--text-muted)}@media (max-width: 1024px){.app-header{grid-template-columns:1fr}.hero-upload-panel{justify-content:stretch}.hero-upload-card{max-width:100%}.editor-workspace{grid-template-columns:1fr}.stage-toolbar{flex-direction:column;align-items:stretch}.save-load{justify-content:flex-end}.animation-pane{max-height:none}}@media (max-width: 640px){.pricing-grid{grid-template-columns:1fr}.playback-settings{width:100%;margin-left:0}.save-load{justify-content:stretch}.save-load .ghost,.save-load .file-btn{flex:1}}