.glitchPage{flex-direction:column;gap:24px;display:flex}.glitchHero{background:linear-gradient(135deg, var(--surface), var(--neutral));border-radius:var(--radius-xl);border:2px solid var(--border);padding:clamp(40px,6vw,80px);position:relative;overflow:hidden}.glitchHero:after{content:"";background:repeating-linear-gradient(90deg, var(--ink) 0 8px, transparent 8px 16px);opacity:.12;width:128px;height:64px;position:absolute;top:32px;right:32px;transform:rotate(5deg)}.glitchHero h1{margin-top:8px}.glitchHero .sub{max-width:720px;margin-top:24px}.glitchStudio{flex-direction:column;gap:24px;display:flex}.glitchStage{flex-direction:column;gap:20px;padding:24px;display:flex}.glitchRatioRow{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.glitchRatioLabel{color:var(--muted);text-transform:uppercase;letter-spacing:.08em;font-family:Geist Mono,monospace;font-size:11px;font-weight:800}.glitchRatioPicker{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.glitchRatioBtn{appearance:none;background:var(--neutral);color:var(--ink);border:2px solid var(--border);font:inherit;letter-spacing:.02em;cursor:pointer;border-radius:9999px;padding:6px 12px;font-family:Geist Mono,monospace;font-size:12px;font-weight:800;transition:transform .16s cubic-bezier(.22,1,.36,1),background .16s,color .16s}.glitchRatioBtn:hover{background:var(--quaternary);transform:translateY(-1px)rotate(-1deg)}.glitchRatioBtn.active{background:var(--ink);color:var(--neutral);transform:rotate(-1.5deg)}.glitchRatioBtn.active:hover{background:var(--success);color:var(--ink)}.glitchCanvasWrap{background:var(--ink);border:2px solid var(--border);border-radius:var(--radius-md);aspect-ratio:16/9;place-items:center;max-width:100%;max-height:72vh;margin-inline:auto;transition:aspect-ratio .24s cubic-bezier(.22,1,.36,1),max-width .24s;display:grid;position:relative;overflow:hidden}.glitchCanvasWrap canvas{width:100%;height:100%;image-rendering:pixelated;display:block}.glitchCanvasWrap[data-empty=true] canvas{visibility:hidden}.glitchCanvasWrap[data-video=true] canvas{cursor:pointer}.glitchUpload{background:#fdf8eef0;position:absolute;inset:20px}.glitchUpload strong{font-size:20px;font-weight:950}.glitchUpload span{color:var(--muted);font-family:Geist Mono,monospace;font-size:12px;font-weight:800}.glitchLoading{color:var(--ink);letter-spacing:.04em;background:#fdf8eec7;place-items:center;font-family:Geist Mono,monospace;font-size:14px;font-weight:800;display:grid;position:absolute;inset:0}.glitchStageFooter{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px;display:flex}.glitchMeta{flex-wrap:wrap;align-items:center;gap:10px;min-width:0;display:flex}.glitchMetaPill{background:var(--neutral);border:2px solid var(--border);color:var(--ink);border-radius:9999px;align-items:center;padding:8px 12px;font-family:Geist Mono,monospace;font-size:12px;font-weight:800;display:inline-flex}.glitchMetaName{color:var(--muted);text-overflow:ellipsis;white-space:nowrap;max-width:240px;font-family:Geist Mono,monospace;font-size:12px;font-weight:700;overflow:hidden}.glitchActions{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.glitchSwapBtn{position:relative;overflow:hidden}.glitchSwapBtn input{display:none}.glitchSwapBtn.disabled{opacity:.5;pointer-events:none;cursor:not-allowed}.glitchRail{flex-direction:column;gap:16px;padding:24px;display:flex}.glitchRailHead{flex-direction:column;gap:4px;display:flex}.glitchRailHead h3{letter-spacing:-.01em;font-size:18px;font-weight:800}.glitchRailHint{color:var(--muted);font-family:Geist Mono,monospace;font-size:12px;font-weight:600}.glitchEffectList{grid-template-columns:repeat(auto-fill,minmax(280px,1fr));align-items:start;gap:12px;display:grid}.glitchEffect{background:var(--neutral);border:2px solid var(--border);border-radius:var(--radius-md);flex-direction:column;gap:10px;padding:12px 14px;transition:background .18s;display:flex}.glitchEffect.on{background:var(--surface)}.glitchEffectHead{justify-content:space-between;align-items:center;gap:12px;display:flex}.glitchTag{border:2px solid var(--border);border-radius:var(--radius-sm);letter-spacing:.02em;align-items:center;padding:6px 10px;font-family:Inter,system-ui,sans-serif;font-size:12px;font-weight:800;display:inline-flex;transform:rotate(-1.5deg)}.glitchTag-pink{background:var(--primary);color:var(--ink)}.glitchTag-red{background:var(--secondary);color:var(--neutral)}.glitchTag-blue{background:var(--tertiary);color:var(--neutral)}.glitchTag-yellow{background:var(--quaternary);color:var(--ink)}.glitchToggle{flex-shrink:0;width:96px;min-height:36px;padding:3px;font-size:11px}.glitchToggle .toggleOption{padding:6px 4px;font-size:11px}.glitchEffectBody{flex-direction:column;gap:6px;display:flex}.glitchSliderRow{justify-content:space-between;align-items:baseline;display:flex}.glitchSliderLabel{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-family:Geist Mono,monospace;font-size:11px;font-weight:800}.glitchSliderVal{color:var(--ink);font-family:Geist Mono,monospace;font-size:13px;font-weight:800}.glitchSlider{appearance:none;cursor:pointer;background:0 0;width:100%;height:28px}.glitchSlider::-webkit-slider-runnable-track{background:var(--surface);border:2px solid var(--border);border-radius:9999px;height:8px}.glitchSlider::-moz-range-track{background:var(--surface);border:2px solid var(--border);border-radius:9999px;height:8px}.glitchSlider::-webkit-slider-thumb{appearance:none;background:var(--tertiary);border:2px solid var(--border);cursor:grab;border-radius:50%;width:22px;height:22px;margin-top:-9px;transition:transform .12s}.glitchSlider::-moz-range-thumb{background:var(--tertiary);border:2px solid var(--border);cursor:grab;border-radius:50%;width:22px;height:22px}.glitchSlider:hover::-webkit-slider-thumb{transform:scale(1.1)}.glitchSlider:active::-webkit-slider-thumb{cursor:grabbing}.glitchSlider:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 4px #3d5afe2e}.glitchError{background:var(--secondary);color:var(--neutral);border:2px solid var(--border);border-radius:var(--radius-md);padding:16px 20px;font-size:14px;font-weight:700;transform:rotate(-.4deg)}.glitchError strong{margin-right:4px;font-weight:900}.glitchEffectActions{justify-content:flex-end;margin-top:-4px;display:flex}.glitchAnimateBtn{appearance:none;background:var(--neutral);color:var(--ink);border:2px solid var(--border);font:inherit;letter-spacing:.04em;cursor:pointer;border-radius:9999px;padding:5px 12px;font-family:Geist Mono,monospace;font-size:11px;font-weight:800;transition:transform .14s cubic-bezier(.22,1,.36,1),background .14s,color .14s,border-color .14s}.glitchAnimateBtn:hover:not(:disabled){background:var(--success);transform:translateY(-1px)rotate(-1deg)}.glitchAnimateBtn:disabled{opacity:.4;cursor:not-allowed}.glitchAnimateBtn.animating.track-0{background:var(--primary);color:var(--ink)}.glitchAnimateBtn.animating.track-1{background:var(--tertiary);color:var(--neutral)}.glitchAnimateBtn.animating.track-2{background:var(--quaternary);color:var(--ink)}.glitchAnimateBtn.animating.track-3{background:var(--secondary);color:var(--neutral)}.glitchAnimateBtn.animating.track-4{background:var(--success);color:var(--ink)}.glitchAnimateBtn.animating:hover:not(:disabled){transform:translateY(-1px)rotate(-1deg)}.glitchSliderHint{color:var(--muted);letter-spacing:.04em;margin-top:-2px;font-family:Geist Mono,monospace;font-size:10px;font-weight:700}.glitchTimeline{background:var(--neutral);border:2px solid var(--border);border-radius:var(--radius-md);flex-direction:column;gap:12px;padding:14px 16px 12px;display:flex}.glitchTimelineHeaderRow{grid-template-columns:132px minmax(0,1fr);align-items:center;gap:8px;display:grid}.glitchTimelineHeaderInfo{flex-direction:column;align-items:center;gap:2px;display:flex}.glitchTimelineHeaderLabel{color:var(--muted);text-transform:uppercase;letter-spacing:.1em;font-family:Geist Mono,monospace;font-size:14px;font-weight:800}.glitchTimelineTime{color:var(--ink);font-family:Geist Mono,monospace;font-size:12px;font-weight:800}.glitchTimelineLoop{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;align-items:center;gap:6px;font-family:Geist Mono,monospace;font-size:11px;font-weight:800;display:inline-flex}.glitchTimelineLoop select{appearance:none;background:var(--surface);color:var(--ink);border:2px solid var(--border);font:inherit;letter-spacing:.04em;cursor:pointer;background-image:linear-gradient(45deg, transparent 50%, var(--ink) 50%), linear-gradient(135deg, var(--ink) 50%, transparent 50%);background-position:right 10px top 55%,right 6px top 55%;background-repeat:no-repeat;background-size:4px 4px,4px 4px;border-radius:9999px;padding:4px 22px 4px 10px;font-family:Geist Mono,monospace;font-size:11px;font-weight:800}.glitchTimelineStrip{background:var(--surface);border:2px solid var(--border);cursor:pointer;touch-action:none;border-radius:9999px;height:18px;position:relative;overflow:visible}.glitchTimelineStrip.scrubbing{cursor:grabbing}.glitchTimelinePlayhead{background:var(--ink);pointer-events:none;z-index:3;width:2px;position:absolute;top:0;bottom:0;transform:translate(-1px)}.glitchTimelinePlayhead--strip{height:28px;top:-5px}.glitchTimelinePlayhead--strip:before{content:"";background:var(--ink);border-radius:50%;width:12px;height:12px;position:absolute;top:-7px;left:50%;transform:translate(-50%);box-shadow:0 1px 2px #0003}.glitchTimelineTracks{flex-direction:column;gap:6px;display:flex}.glitchTimelineRow{grid-template-columns:132px minmax(0,1fr);align-items:stretch;gap:8px;display:grid}.glitchTimelineRow.track-0{--trackColor:var(--primary)}.glitchTimelineRow.track-1{--trackColor:var(--tertiary)}.glitchTimelineRow.track-2{--trackColor:var(--quaternary)}.glitchTimelineRow.track-3{--trackColor:var(--secondary)}.glitchTimelineRow.track-4{--trackColor:var(--success)}.glitchTimelineRowLabel{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-sm);align-items:center;gap:8px;padding:0 8px;display:flex}.glitchTimelineDot{background:var(--trackColor);border:1.5px solid var(--ink);border-radius:50%;flex-shrink:0;width:10px;height:10px}.glitchTimelineRowName{color:var(--ink);white-space:nowrap;text-overflow:ellipsis;flex:1;font-family:Geist Mono,monospace;font-size:11px;font-weight:800;overflow:hidden}.glitchTimelineRemove{appearance:none;color:var(--muted);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:0 4px;font-size:18px;font-weight:800;line-height:1;transition:color .12s,background .12s,transform .12s}.glitchTimelineRemove:hover{color:var(--neutral);background:var(--secondary);transform:rotate(-6deg)}.glitchTimelineTrack{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-sm);touch-action:none;cursor:crosshair;height:52px;color:var(--trackColor);position:relative;overflow:hidden}.glitchTimelineGridline{pointer-events:none;background:#2222221a;height:1px;position:absolute;top:50%;left:0;right:0}.glitchTimelinePoly{pointer-events:none;opacity:.85;width:100%;height:100%;position:absolute;inset:0}.glitchTimelineKey{background:var(--trackColor);border:2px solid var(--ink);pointer-events:auto;cursor:grab;z-index:2;border-radius:50%;width:14px;height:14px;position:absolute;transform:translate(-50%,-50%);box-shadow:0 1px 2px #0000002e}.glitchTimelineKey:before{content:"";border-radius:50%;position:absolute;inset:-7px}.glitchTimelineTrack.dragging,.glitchTimelineTrack.dragging .glitchTimelineKey{cursor:grabbing}.glitchTimelineHint{color:var(--muted);letter-spacing:.04em;text-align:center;padding-top:2px;font-family:Geist Mono,monospace;font-size:10px;font-weight:700}@media (max-width:720px){.glitchTimelineHeaderRow,.glitchTimelineRow{grid-template-columns:100px minmax(0,1fr)}.glitchTimelineHeaderLabel{font-size:12px}.glitchTimelineRowName{font-size:10px}.glitchTimelineHint{display:none}}