.mobile-frame.svelte-mri7wp{background:var(--surface);border:solid var(--border-strong);margin:0 auto;position:relative;overflow:hidden;box-shadow:var(--shadow-xl)}.dark .mobile-frame.svelte-mri7wp{border-color:var(--border);background:var(--surface-tertiary)}.mobile-status-bar.svelte-mri7wp{height:44px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--space-4);background:var(--surface);border-bottom:1px solid var(--border);font-size:14px;font-weight:600;position:relative}.status-center.svelte-mri7wp{position:absolute;left:50%;transform:translate(-50%)}.status-notch.svelte-mri7wp{width:110px;height:18px;background:color-mix(in oklch,var(--heading-h1) 80%,transparent);border-radius:12px}.dark .status-notch.svelte-mri7wp{background:color-mix(in oklch,var(--text-body) 85%,transparent)}.status-right.svelte-mri7wp{margin-left:auto}.status-icons.svelte-mri7wp{display:flex;align-items:center;gap:var(--space-1);font-size:12px;color:var(--typography-caption-color)}.signal-icon.svelte-mri7wp{display:flex;align-items:end;gap:1px;height:12px}.signal-bar.svelte-mri7wp{width:2px;background:var(--surface-tertiary);border-radius:1px}.signal-bar.svelte-mri7wp:nth-child(1){height:3px}.signal-bar.svelte-mri7wp:nth-child(2){height:6px}.signal-bar.svelte-mri7wp:nth-child(3){height:9px}.signal-bar.svelte-mri7wp:nth-child(4){height:12px}.signal-bar.active.svelte-mri7wp{background:var(--typography-caption-color)}.battery-icon.svelte-mri7wp{display:flex;align-items:center;gap:1px}.battery-body.svelte-mri7wp{width:20px;height:10px;border:1px solid var(--typography-caption-color);border-radius:2px;position:relative;overflow:hidden}.battery-level.svelte-mri7wp{height:100%;background:var(--primary);transition:width var(--transition-base)}.battery-tip.svelte-mri7wp{width:2px;height:6px;background:var(--typography-caption-color);border-radius:0 1px 1px 0}.mobile-content.svelte-mri7wp{flex:1;height:calc(100% - 124px);overflow-y:auto}.app-screen.svelte-mri7wp{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;text-align:center}.app-screen.svelte-mri7wp h4:where(.svelte-mri7wp){font-size:var(--typography-subheading-size);color:var(--typography-heading-color);font-weight:var(--typography-subheading-weight);margin:0 0 var(--space-2) 0;letter-spacing:-.02em}.content-text.svelte-mri7wp{font-size:var(--typography-caption-size);color:var(--typography-caption-color);margin:0}.search-mockup.svelte-mri7wp{width:100%;margin-top:var(--space-4)}.search-bar.svelte-mri7wp{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3);background:var(--surface-secondary);border:1px solid var(--border);border-radius:var(--radius-lg);color:var(--typography-caption-color)}.notification-list.svelte-mri7wp{display:flex;flex-direction:column;gap:var(--space-3);margin-top:var(--space-4);width:100%}.notification-item.svelte-mri7wp{display:flex;align-items:center;gap:var(--space-2);padding:var(--space-3);background:var(--surface-secondary);border:1px solid var(--border);border-radius:var(--radius-md);font-size:var(--typography-caption-size);color:var(--typography-body-color);transition:transform var(--transition-fast)}.notification-item.svelte-mri7wp:hover{transform:translate(4px)}.notification-dot.svelte-mri7wp{width:8px;height:8px;background:var(--primary);border-radius:50%;flex-shrink:0}.mobile-bottom-nav.svelte-mri7wp{height:80px;display:flex;background:var(--surface);border-top:1px solid var(--border);padding:var(--space-2) var(--space-1)}.dark .mobile-bottom-nav.svelte-mri7wp{background:var(--surface-tertiary)}.nav-tab.svelte-mri7wp{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-1);background:transparent;border:none;cursor:pointer;transition:var(--transition-base);color:var(--typography-caption-color);padding:var(--space-1);border-radius:var(--radius-md)}.nav-tab.svelte-mri7wp:hover{background:color-mix(in oklch,var(--surface-secondary) 50%,transparent)}.nav-tab-active.svelte-mri7wp{color:var(--primary)}.nav-tab-active.svelte-mri7wp .nav-icon-container:where(.svelte-mri7wp){transform:scale(1.1)}.nav-icon-container.svelte-mri7wp{position:relative}.nav-badge.svelte-mri7wp{position:absolute;top:-4px;right:-4px;width:16px;height:16px;background:var(--error);color:var(--pure-white);border-radius:50%;font-size:10px;font-weight:600;display:flex;align-items:center;justify-content:center;border:2px solid var(--surface)}.nav-label.svelte-mri7wp{font-size:10px;font-weight:var(--typography-caption-weight);margin-top:2px;opacity:.8;transition:opacity var(--transition-fast)}.nav-tab-active.svelte-mri7wp .nav-label:where(.svelte-mri7wp){opacity:1}.floating-action-btn.svelte-mri7wp{position:absolute;bottom:100px;right:var(--space-4);width:56px;height:56px;background:var(--primary);color:var(--pure-white);border:none;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;box-shadow:var(--shadow-lg);transition:var(--transition-base)}.floating-action-btn.svelte-mri7wp:hover{background:var(--primary-hover);transform:scale(1.08);box-shadow:var(--shadow-xl)}.floating-action-btn.svelte-mri7wp:active{transform:scale(.95)}.mobile-frame.svelte-mri7wp{width:280px;height:560px;border-width:4px;border-radius:20px}.mobile-content.svelte-mri7wp{padding:var(--space-3)}@media (min-width: 641px){.mobile-frame.svelte-mri7wp{width:320px;height:640px;border-width:12px;border-radius:44px}.mobile-content.svelte-mri7wp{padding:var(--space-4)}}.position-selector.svelte-wwq9z0{display:flex;gap:var(--space-4)}.selector-buttons.svelte-wwq9z0{display:flex;gap:var(--space-2)}.selector-btn.svelte-wwq9z0{padding:var(--space-2) var(--space-3);background:var(--surface-secondary);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-base)}.selector-btn.svelte-wwq9z0:hover{background:var(--surface-tertiary)}.selector-btn-active.svelte-wwq9z0{background:var(--primary);color:var(--pure-white);border-color:transparent}.selector-btn-active.svelte-wwq9z0:hover{background:var(--primary-hover)}.playback-status.svelte-wwq9z0{display:flex;flex-direction:column;align-items:center;gap:var(--space-3)}.status-icon.svelte-wwq9z0{color:var(--primary)}.audio-demo.svelte-wwq9z0{min-height:500px;position:relative}.audio-canvas.svelte-wwq9z0{min-height:420px;padding:var(--space-8)}.audio-visualizer.svelte-wwq9z0{display:flex;align-items:center;justify-content:center;height:40px;margin-top:var(--space-4)}.visualizer-bars-static.svelte-wwq9z0{display:flex;align-items:end;gap:var(--space-1);height:40px}.visualizer-bar.svelte-wwq9z0{width:4px;background:var(--surface-tertiary);border-radius:2px;transition:var(--transition-base)}.visualizer-bar.svelte-wwq9z0:nth-child(1){height:12px}.visualizer-bar.svelte-wwq9z0:nth-child(2){height:20px}.visualizer-bar.svelte-wwq9z0:nth-child(3){height:28px}.visualizer-bar.svelte-wwq9z0:nth-child(4){height:16px}.visualizer-bar.svelte-wwq9z0:nth-child(5){height:10px}.audio-demo .toolbar-top.toolbar-horizontal{top:var(--space-6);left:50%;right:auto;bottom:auto;transform:translate(-50%);flex-direction:row}.audio-demo .toolbar-right.toolbar-vertical{right:var(--space-6);top:50%;left:auto;bottom:auto;transform:translateY(-50%);flex-direction:column}.audio-demo .toolbar-bottom.toolbar-horizontal{bottom:var(--space-6);left:50%;right:auto;top:auto;transform:translate(-50%);flex-direction:row}.audio-demo .toolbar-left.toolbar-vertical{left:var(--space-6);top:50%;right:auto;bottom:auto;transform:translateY(-50%);flex-direction:column}.toolbar-item-recording{background:var(--error);color:var(--pure-white);animation:svelte-wwq9z0-recordingPulse 1.5s ease-in-out infinite}.toolbar-item-recording:hover{background:var(--error-hover);color:var(--pure-white)}@keyframes svelte-wwq9z0-recordingPulse{0%,to{background:var(--error);box-shadow:0 0 color-mix(in oklch,var(--error) 40%,transparent)}50%{background:var(--error-hover);box-shadow:0 0 0 8px color-mix(in oklch,var(--error) 0%,transparent)}}.recording-text.svelte-wwq9z0{color:var(--error)}.toolbar-divider-container.svelte-wwq9z0{display:flex;align-items:center;justify-content:center}.position-selector.svelte-wwq9z0{flex-direction:column;align-items:flex-start}.selector-buttons.svelte-wwq9z0{flex-wrap:wrap}@media (min-width: 641px){.position-selector.svelte-wwq9z0{flex-direction:row;align-items:center}}.toolbar-demo{position:relative;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);min-height:200px;overflow:hidden}.dark .toolbar-demo{background:var(--surface-tertiary);border-color:var(--border-strong)}.canvas-area{padding:var(--space-6);display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:160px;background:var(--surface-secondary)}.canvas-text{font-size:var(--typography-body-size);color:var(--typography-body-color);text-align:center;margin:0}.tool-preview{display:flex;flex-direction:column;align-items:center;gap:var(--space-2);margin-top:var(--space-4)}.tool-name{font-size:var(--typography-caption-size);color:var(--typography-caption-color);text-transform:capitalize}.preview-icon{color:var(--primary)}.floating-toolbar{position:absolute;display:flex;background:color-mix(in oklch,var(--surface) 95%,transparent);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--space-2);gap:var(--space-1);z-index:10}.dark .floating-toolbar{background:color-mix(in oklch,var(--surface) 90%,transparent);border-color:var(--border-strong)}.toolbar-vertical{flex-direction:column;right:var(--space-4);top:50%;transform:translateY(-50%)}.toolbar-horizontal{flex-direction:row;left:50%;transform:translate(-50%)}.toolbar-zoom{bottom:var(--space-4);align-items:center;padding:var(--space-2) var(--space-3)}.toolbar-item{display:flex;align-items:center;justify-content:center;width:var(--space-8);height:var(--space-8);background:transparent;border:none;border-radius:var(--radius-md);cursor:pointer;transition:var(--transition-base);color:var(--typography-body-color)}.toolbar-item:hover{background:var(--surface-secondary);color:var(--typography-heading-color)}.toolbar-item:disabled{opacity:.5;cursor:not-allowed}.toolbar-item-active{background:var(--primary);color:var(--pure-white)}.toolbar-divider{width:1px;height:var(--space-4);background:var(--border);margin:0 var(--space-1)}.zoom-display{display:flex;flex-direction:column;align-items:center;gap:var(--space-4)}.zoom-text{font-size:var(--typography-caption-size);color:var(--typography-caption-color);font-family:var(--font-mono)}.zoom-display-inline{display:flex;align-items:center;padding:0 var(--space-2);min-width:60px;justify-content:center}.zoom-indicator{transition:transform var(--transition-base)}.zoom-content{padding:var(--space-3);background:var(--surface-tertiary);border-radius:var(--radius-sm);font-size:var(--typography-caption-size);color:var(--typography-body-color);white-space:nowrap}