#platformShell{display:flex;min-height:100vh;position:relative}#platformSidebar{width:220px;flex-shrink:0;background:#0c0c14;border-right:1px solid var(--border);display:flex;flex-direction:column;position:-webkit-sticky;position:sticky;top:0;height:100vh;overflow-y:auto;z-index:200;transition:transform .25s ease}.sidebar-brand{padding:24px 20px 16px;border-bottom:1px solid var(--border);flex-shrink:0}.sidebar-logo-text{display:block;font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,var(--primary-2),var(--teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;letter-spacing:-.5px}.sidebar-tagline{display:block;font-size:.72rem;color:var(--muted-2);margin-top:2px;letter-spacing:.5px;text-transform:uppercase}.sidebar-nav{flex:1 1;padding:12px 0;display:flex;flex-direction:column;gap:2px}.sidebar-nav-group-label{font-size:.65rem;text-transform:uppercase;letter-spacing:1px;color:var(--muted-2);padding:14px 20px 4px}.sidebar-nav-item{display:flex;align-items:center;gap:10px;padding:9px 20px;background:none;border:none;border-left:3px solid transparent;color:var(--muted);font-size:.88rem;cursor:pointer;text-align:left;width:100%;transition:all .15s;border-radius:0}.sidebar-nav-item svg{flex-shrink:0;opacity:.7}.sidebar-nav-item:hover{background:rgba(255,255,255,.05);color:var(--text)}.sidebar-nav-item:hover svg{opacity:1}.sidebar-nav-item.active{background:rgba(138,43,226,.12);border-left-color:var(--primary);color:var(--primary-2);font-weight:600}.sidebar-nav-item.active svg{opacity:1;stroke:var(--primary-2)}.sidebar-footer{padding:16px 20px;border-top:1px solid var(--border);flex-shrink:0}.sidebar-api-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;gap:8px}.sidebar-reset-key{background:none;border:1px solid var(--border);border-radius:6px;color:var(--muted);font-size:.72rem;padding:4px 8px;cursor:pointer;transition:all .2s;white-space:nowrap}.sidebar-reset-key:hover{border-color:var(--primary);color:var(--text)}.sidebar-footer-actions{display:flex;gap:6px;margin-bottom:10px}.sidebar-action-btn{flex:1 1;background:none;border:1px solid var(--border);border-radius:6px;color:var(--muted);font-size:.72rem;padding:5px 4px;cursor:pointer;transition:all .2s}.sidebar-action-btn:hover{border-color:var(--primary);color:var(--text)}.mobile-topbar{display:none;align-items:center;gap:12px;padding:12px 16px;background:#0c0c14;border-bottom:1px solid var(--border);position:-webkit-sticky;position:sticky;top:0;z-index:300}.sidebar-toggle-btn{background:none;border:none;color:var(--text);cursor:pointer;padding:4px;display:flex;align-items:center}.mobile-brand{font-size:1.1rem;font-weight:700;background:linear-gradient(135deg,var(--primary-2),var(--teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.mobile-no-key{font-size:.72rem;color:var(--warning);margin-left:auto}.sidebar-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:199}.sidebar-backdrop.hidden{display:none}#platformMain{flex:1 1;min-width:0;overflow-y:auto;padding:32px 40px 60px}.dashboard-hero{text-align:center;padding:40px 20px 32px}.dashboard-title{font-size:2.8rem;font-weight:700;background:linear-gradient(135deg,var(--primary-2),var(--teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:10px}.dashboard-sub{color:var(--muted);font-size:1rem;max-width:480px;margin:0 auto 24px;line-height:1.6}.use-case-grid{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:20px;gap:20px;margin-bottom:48px;max-width:900px;margin-left:auto;margin-right:auto}.use-case-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px 24px 28px;cursor:pointer;transition:all .2s;position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;gap:10px}.use-case-card:before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,var(--primary),var(--teal));opacity:0;transition:opacity .2s}.use-case-card:hover{border-color:var(--primary);transform:translateY(-3px);box-shadow:0 8px 30px rgba(138,43,226,.2)}.use-case-card:hover:before{opacity:1}.use-case-icon{color:var(--primary-2);opacity:.85;margin-bottom:4px}.use-case-title{font-size:1.1rem;font-weight:600;color:var(--text);margin:0}.use-case-desc{font-size:.85rem;color:var(--muted);line-height:1.55;margin:0;flex:1 1}.use-case-cta{font-size:.8rem;color:var(--primary-2);font-weight:600;margin-top:8px}@media (max-width:900px){#platformShell{flex-direction:column}#platformSidebar{position:fixed;left:0;top:0;bottom:0;transform:translateX(-100%);z-index:300}#platformSidebar.sidebar-open{transform:translateX(0)}.mobile-topbar{display:flex}#platformMain{padding:20px 20px 48px;flex:1 1;min-height:0}.use-case-grid{grid-template-columns:repeat(2,1fr)}}@media (min-width:901px){#platformShell{flex-direction:row}.mobile-topbar{display:none!important}}#hubScreen{max-width:var(--container);margin:0 auto;padding-bottom:var(--space-6);min-height:100vh;display:flex;flex-direction:column}.hub-header{display:flex;align-items:center;justify-content:center;padding:48px 20px 12px;text-align:center;position:relative;overflow:hidden}.hub-header .brand h1{font-size:2.8rem}.hub-hero-tagline{font-size:1.25rem;color:var(--primary-2);margin:4px 0 8px;font-weight:500}.hub-hero-sub{font-size:.95rem;color:var(--muted);margin:0 0 20px;max-width:440px;line-height:1.5}.hub-hero-cta{background:linear-gradient(135deg,var(--primary),#6a1bb0);color:#fff;border:none;padding:12px 32px;border-radius:30px;font-size:1rem;font-weight:600;cursor:pointer;transition:transform .2s,box-shadow .2s;box-shadow:0 4px 20px rgba(138,43,226,.3)}.hub-hero-cta:hover{transform:translateY(-2px);box-shadow:0 8px 30px rgba(138,43,226,.45)}.hub-grid{display:grid;grid-template-columns:repeat(2,1fr);grid-gap:20px;gap:20px;padding:24px 0;flex:1 1}.dnd-hub-grid{grid-template-columns:repeat(2,1fr)}.hub-grid-3{grid-template-columns:repeat(3,1fr)}.hub-grid-4{grid-template-columns:repeat(4,1fr)}@media (max-width:768px){.hub-grid,.hub-grid-4{grid-template-columns:1fr}}.hub-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px 24px;cursor:pointer;transition:all .3s ease;display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;position:relative;overflow:hidden}.hub-card:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 0,rgba(138,43,226,.08) 0,transparent 70%);opacity:0;transition:opacity .3s ease}.hub-card:hover{border-color:var(--primary);transform:translateY(-4px);box-shadow:0 12px 40px rgba(138,43,226,.2)}.hub-card:hover:before{opacity:1}.hub-card-icon{color:var(--primary-2);position:relative;z-index:1}.hub-card-title{font-size:1.3rem;color:var(--text)}.hub-card-desc,.hub-card-title{margin:0;position:relative;z-index:1}.hub-card-desc{font-size:.9rem;color:var(--muted);line-height:1.5}.hub-footer{text-align:center;padding:24px 0;border-top:1px solid var(--border);margin-top:auto}.app-section{max-width:var(--container);margin:0 auto;padding-bottom:var(--space-6);min-height:auto}.app-section.hidden{display:none}.section-header{display:flex;align-items:center;gap:16px;padding:16px 0;margin-bottom:8px;border-bottom:1px solid var(--border)}.section-header h2{color:var(--primary-2);font-size:1.4rem;margin:0;flex:1 1}.section-body{padding-top:16px}.section-intro{color:var(--muted);font-size:.95rem;margin-bottom:24px;line-height:1.5}.back-to-hub{padding:8px 16px;background:rgba(255,255,255,.05);border:1px solid var(--border);border-radius:8px;color:var(--muted);cursor:pointer;font-size:.9rem;transition:all .2s;flex-shrink:0}.back-to-hub:hover{background:rgba(255,255,255,.1);color:var(--text);border-color:var(--primary)}.back-to-sub{padding:8px 16px;background:rgba(255,255,255,.05);border:1px solid var(--border);border-radius:8px;color:var(--muted);cursor:pointer;font-size:.9rem;transition:all .2s;flex-shrink:0}.back-to-sub:hover{background:rgba(255,255,255,.1);color:var(--text);border-color:var(--primary)}.stories-list-area{margin-bottom:24px}.stories-list-area h3{color:var(--primary-2);margin-bottom:14px}.stories-card-list{display:flex;flex-direction:column;gap:10px}.story-select-card{display:flex;flex-direction:column;align-items:flex-start;padding:16px 20px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);cursor:default;transition:border-color .2s,background .2s;text-align:left}.story-select-card:hover{border-color:var(--primary);background:rgba(138,43,226,.08)}.story-card-top{display:flex;align-items:center;justify-content:space-between;width:100%;gap:8px;margin-bottom:8px}.story-card-top .story-select-card-title{margin:0}.story-card-wc{font-size:.72rem;color:var(--text-dim,#898999);background:var(--bg,#0e0e1a);padding:2px 8px;border-radius:10px;white-space:nowrap;flex-shrink:0}.story-card-actions{display:flex;gap:8px;width:100%;margin-top:4px}.story-card-actions .story-card-edit,.story-card-actions .story-card-play{flex:1 1;padding:6px 12px;font-size:.82rem;border-radius:6px}.story-card-delete{background:none;border:1px solid var(--danger,#cf6679);color:var(--danger,#cf6679);font-size:1.1rem;line-height:1;padding:4px 10px;border-radius:6px;cursor:pointer;opacity:.7;transition:opacity .2s,background .2s}.story-card-delete:hover{opacity:1;background:rgba(207,102,121,.12)}.story-select-card-title{color:var(--text);font-size:1.05rem;font-weight:600;margin:0 0 4px}.story-select-card-theme{color:var(--primary);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;margin:0}.context-input-area{margin-bottom:24px}.context-input-area label{display:block;margin-bottom:8px;font-weight:600;color:var(--primary-2)}.context-input-area textarea{width:100%;padding:12px;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:.95rem;resize:vertical;font-family:inherit}.context-input-area textarea:focus{border-color:var(--primary);outline:none}.wyo-controls{display:grid;grid-template-columns:1fr 340px;grid-gap:24px;gap:24px;align-items:start}.wyo-editor-col{min-width:0}.wyo-editor-col,.wyo-sidebar-col{display:flex;flex-direction:column}.wyo-sidebar-col{gap:16px;position:-webkit-sticky;position:sticky;top:20px}.wyo-toolbar{display:flex;align-items:center;gap:10px;margin-bottom:10px}.wyo-title-input{flex:1 1;min-width:0;padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:.95rem;font-family:inherit;transition:border-color .2s}.wyo-title-input:focus{border-color:var(--primary);outline:none}.wyo-title-input::placeholder{color:var(--muted)}.wyo-toolbar-btns{display:flex;gap:8px;flex-shrink:0}.wyo-toolbar-btns .btn-primary,.wyo-toolbar-btns .btn-secondary{margin-bottom:0}#scTextArea{width:100%;min-height:320px;padding:14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);color:var(--text);font-size:.95rem;font-family:inherit;line-height:1.6;resize:vertical;transition:border-color .2s;box-sizing:border-box}#scTextArea:focus{border-color:var(--primary);outline:none}.wyo-word-count{text-align:right;font-size:.78rem;color:var(--muted);padding:5px 2px 0}.wyo-cues-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden}.wyo-cues-header{padding:14px 16px 10px;border-bottom:1px solid var(--border)}.wyo-cues-header h3{color:var(--primary-2);font-size:.95rem;font-weight:600;margin:0 0 4px}.wyo-cues-hint{color:var(--muted);font-size:.78rem;line-height:1.4;margin:0}.wyo-cues-list{padding:8px 12px;display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto;min-height:40px}.wyo-cue-btn-row{display:flex;gap:6px;padding:10px 12px 12px;flex-wrap:wrap;border-top:1px solid var(--border)}.wyo-add-cue-btn{flex:1 1;min-width:80px;font-size:.8rem!important;padding:7px 8px!important;white-space:nowrap;margin-bottom:0!important}.wyo-actions{display:flex;flex-direction:column}.wyo-actions .btn-start{width:100%;padding:16px 24px;font-size:1.1em}@media (max-width:860px){.wyo-controls{grid-template-columns:1fr}.wyo-sidebar-col{position:static}#scTextArea{min-height:240px}}@media (max-width:480px){.wyo-toolbar{flex-direction:column;align-items:stretch}.wyo-toolbar-btns{width:100%}.wyo-toolbar-btns .btn-primary,.wyo-toolbar-btns .btn-secondary{flex:1 1}.wyo-cue-btn-row{flex-direction:column}.wyo-add-cue-btn{flex:none;width:100%}}.wyo-cue-row{display:flex;align-items:center;gap:10px;padding:10px 12px;background:rgba(255,255,255,.03);border:1px solid var(--border);border-radius:8px}.wyo-cue-keyword{width:140px;min-width:100px;padding:8px 12px;background:var(--bg,#0e0e1a);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:.9rem}.wyo-cue-keyword:focus{border-color:var(--primary);outline:none}.wyo-cue-arrow{color:var(--primary-2);font-size:1.1rem;flex-shrink:0}.wyo-cue-sound-select{flex:1 1;min-width:0;padding:8px 12px;background:var(--bg,#0e0e1a);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:.9rem}.wyo-cue-sound-select:focus{border-color:var(--primary);outline:none}.wyo-cue-preview{background:none;border:1px solid var(--border);color:var(--primary-2);width:34px;height:34px;border-radius:6px;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;flex-shrink:0}.wyo-cue-preview:hover{border-color:var(--primary-2);background:rgba(187,134,252,.1)}.wyo-cue-preview.wyo-cue-playing{border-color:var(--danger,#f44);color:var(--danger,#f44);background:rgba(255,68,68,.08)}.wyo-cue-preview.wyo-cue-playing:hover{background:rgba(255,68,68,.15)}.wyo-cue-delete{background:none;border:none;color:var(--danger);cursor:pointer;font-size:1.1rem;padding:4px;flex-shrink:0;opacity:.7}.wyo-cue-delete:hover{opacity:1}.wyo-cue-select-wrap{display:flex;flex-direction:column;gap:4px;flex:1 1;min-width:0}.wyo-cue-search{width:100%;padding:5px 10px;background:var(--bg,#0e0e1a);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:.8rem;box-sizing:border-box}.wyo-cue-search::placeholder{color:var(--text-dim,#898999)}.wyo-cue-search:focus{border-color:var(--primary);outline:none}.wyo-cue-type-toggle{display:flex;gap:0;flex-shrink:0}.wyo-cue-type-btn{padding:6px 10px;background:var(--bg,#0e0e1a);border:1px solid var(--border);color:var(--text-dim,#898999);font-size:.8rem;cursor:pointer}.wyo-cue-type-btn:first-child{border-radius:6px 0 0 6px}.wyo-cue-type-btn:last-child{border-radius:0 6px 6px 0;border-left:none}.wyo-cue-type-btn.active{background:var(--primary);color:#fff;border-color:var(--primary)}.wyo-saved-item{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;border-bottom:1px solid rgba(255,255,255,.06);gap:12px}.wyo-saved-item:last-child{border-bottom:none}.wyo-saved-item-title{color:var(--text);font-weight:500;flex:1 1;cursor:pointer}.wyo-saved-item-title:hover{color:var(--primary-2)}.wyo-saved-item-delete{background:none;border:none;color:var(--danger);cursor:pointer;font-size:.85rem;padding:4px 8px}@media (max-width:600px){.wyo-cue-row{flex-wrap:wrap}.wyo-cue-keyword,.wyo-cue-sound-select{width:100%}}.cb-header-actions{display:flex;gap:8px;flex-wrap:wrap;margin-left:auto}.cb-btn-sm{padding:6px 14px!important;font-size:.85rem!important}.cb-btn-danger{border-color:var(--danger)!important;color:var(--danger)!important}.cb-btn-danger:hover{background:rgba(207,102,121,.15)!important}.cb-body{padding-top:8px}.cb-canvas{position:relative;min-height:500px;background:rgba(0,0,0,.3);border:2px dashed var(--border);border-radius:var(--radius-lg);overflow:hidden}.cb-empty-state{inset:0;color:var(--muted-2);font-size:.95rem;pointer-events:none}.cb-button,.cb-empty-state{position:absolute;display:flex;align-items:center;justify-content:center}.cb-button{min-width:100px;min-height:60px;background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);flex-direction:column;cursor:-webkit-grab;cursor:grab;-webkit-user-select:none;-moz-user-select:none;user-select:none;transition:border-color .2s,box-shadow .2s;padding:8px 12px;gap:4px;z-index:1}.cb-button:hover{border-color:var(--primary)}.cb-button.cb-active{border-color:var(--teal);box-shadow:0 0 20px rgba(3,218,198,.25);background:rgba(3,218,198,.08)}.cb-button.cb-dragging{cursor:-webkit-grabbing;cursor:grabbing;opacity:.85;z-index:10}.cb-button-label{color:var(--text);font-size:.85rem;font-weight:600;text-align:center;pointer-events:none}.cb-button-type{color:var(--muted-2);font-size:.65rem;letter-spacing:.05em}.cb-button-group,.cb-button-type{text-transform:uppercase;pointer-events:none}.cb-button-group{font-size:.6rem;letter-spacing:.04em;margin-left:4px}.cb-button-delete{position:absolute;top:-8px;right:-8px;width:20px;height:20px;background:var(--danger);border:none;border-radius:50%;color:#fff;font-size:12px;cursor:pointer;display:none;align-items:center;justify-content:center;z-index:2}.cb-button:hover .cb-button-delete{display:flex}.cb-button-resize{position:absolute;bottom:0;right:0;width:14px;height:14px;cursor:nwse-resize;opacity:0;transition:opacity .2s}.cb-button:hover .cb-button-resize{opacity:.6}.cb-button-resize:after{content:"";position:absolute;bottom:3px;right:3px;width:8px;height:8px;border-right:2px solid var(--muted-2);border-bottom:2px solid var(--muted-2)}@media (pointer:coarse){.cb-button-resize{width:28px;height:28px;opacity:.5}.cb-button-resize:after{width:12px;height:12px;bottom:5px;right:5px}}.cb-search-input{width:100%;padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:8px;color:var(--text);font-size:.95rem}.cb-search-input:focus{border-color:var(--primary);outline:none}.cb-sound-results{max-height:200px;overflow-y:auto;margin-top:8px;border:1px solid var(--border);border-radius:8px;background:var(--surface)}.cb-sound-result-item{padding:10px 14px;cursor:pointer;border-bottom:1px solid rgba(255,255,255,.04);color:var(--text);font-size:.9rem;transition:background .15s}.cb-sound-result-item:hover{background:rgba(138,43,226,.1)}.cb-sound-result-item.selected{background:rgba(138,43,226,.2);border-color:var(--primary)}.cb-sound-result-item:last-child{border-bottom:none}.cb-recent-label{padding:6px 14px;font-size:.72rem;color:var(--primary-2,#bb86fc);text-transform:uppercase;letter-spacing:.06em;border-bottom:1px solid rgba(255,255,255,.04)}.cb-sound-result-type{font-size:.7rem;color:var(--muted-2);text-transform:uppercase;margin-left:8px}.cb-add-form{display:flex;flex-direction:column;gap:12px;text-align:left}.cb-add-form input,.cb-add-form select{width:100%}.cb-saved-boards{display:flex;flex-direction:column;gap:8px}.cb-saved-board-item{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--surface-2);border:1px solid var(--border);border-radius:8px;cursor:pointer;transition:border-color .2s}.cb-saved-board-item:hover{border-color:var(--primary)}.cb-saved-board-name{color:var(--text);font-weight:500}.cb-saved-board-count{color:var(--muted-2);font-size:.85rem}.cb-saved-board-delete{background:none;border:none;color:var(--danger);cursor:pointer;padding:4px 8px}.cb-tabs-bar{gap:4px;padding:0 0 10px;flex-wrap:wrap}.cb-tab,.cb-tabs-bar{display:flex;align-items:center}.cb-tab{gap:6px;padding:6px 14px;background:var(--surface);border:1px solid var(--border);border-radius:6px 6px 0 0;color:var(--muted-2);cursor:pointer;font-size:.85rem;transition:background .15s,border-color .15s,color .15s;white-space:nowrap}.cb-tab-active,.cb-tab:hover{border-color:var(--primary);color:var(--text)}.cb-tab-active{background:rgba(138,43,226,.15);font-weight:600}.cb-tab-name{pointer-events:none}.cb-tab-close{background:none;border:none;color:var(--muted-2);cursor:pointer;font-size:1rem;line-height:1;padding:0 0 0 2px;pointer-events:all}.cb-tab-close:hover{color:var(--danger)}.cb-tab-add{background:none;border:1px dashed var(--border);color:var(--muted-2);font-size:1.1rem;padding:4px 10px}.cb-tab-add:hover{border-color:var(--primary);color:var(--primary)}.cb-tab-rename-input{background:var(--surface-2,#1e1e2e);border:1px solid var(--primary);border-radius:4px;color:var(--text);font-size:.85rem;padding:2px 6px;width:100px}.cb-listen-active{background:rgba(3,218,198,.15)!important;border-color:var(--teal)!important;color:var(--teal)!important}.cb-listen-status{display:flex;align-items:center;gap:8px;padding:6px 12px;background:rgba(3,218,198,.08);border:1px solid rgba(3,218,198,.3);border-radius:var(--radius);margin-bottom:10px;font-size:.85rem;color:var(--teal)}.cb-listen-dot{width:8px;height:8px;border-radius:50%;background:var(--teal);animation:pulse 1.2s ease-in-out infinite;flex-shrink:0}.scene-presets-bar{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}.scene-preset-btn{padding:6px 16px;background:var(--surface);border:1px solid var(--border);border-radius:20px;color:var(--text-dim,var(--muted-2));cursor:pointer;font-size:.85rem;transition:border-color .15s,background .15s,color .15s}.scene-preset-btn:hover{border-color:var(--primary);background:rgba(138,43,226,.12);color:var(--text)}.scene-preset-edit-row{display:grid;grid-template-columns:1fr 2fr auto auto auto;grid-gap:8px;gap:8px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.05)}.scene-preset-edit-row:last-child{border-bottom:none}.scene-preset-context-input,.scene-preset-name-input{background:var(--surface);border:1px solid var(--border);border-radius:6px;color:var(--text);font-size:.85rem;padding:5px 8px;width:100%}.scene-preset-context-input:focus,.scene-preset-name-input:focus{border-color:var(--primary);outline:none}.scene-preset-mood-label{font-size:.75rem;color:var(--muted-2);white-space:nowrap}.scene-preset-mood-slider{width:70px}.scene-preset-delete{background:none;border:none;color:var(--danger);cursor:pointer;font-size:.8rem;padding:4px 6px;white-space:nowrap}@media (max-width:600px){.scene-preset-edit-row{grid-template-columns:1fr 1fr}.scene-preset-mood-slider{width:60px}.hub-grid{grid-template-columns:1fr;gap:14px}.hub-card{padding:24px 20px}.hub-header .brand h1{font-size:2.2rem}.hub-header{padding:20px 16px 4px}#hubScreen{min-height:auto;padding-bottom:24px}.use-case-grid{grid-template-columns:1fr}.cb-header-actions,.section-header{flex-wrap:wrap}}.story-overlay{position:fixed;inset:0;background:#0b0b0f;color:#eee;z-index:9999;display:flex;flex-direction:column}.story-overlay.hidden{display:none}.story-header{display:flex;align-items:center;gap:12px;padding:12px 16px;background:#151522;border-bottom:1px solid #24243a}.story-title{margin:0;font-size:1.2rem;color:#bb86fc}.story-progress-text{margin-left:auto;font-size:.8em;white-space:nowrap}.story-context-body{margin-top:20px}.story-context-label{display:block;margin-bottom:8px;font-weight:700;color:var(--primary-2)}.story-context-input{width:100%;padding:12px;background:var(--surface-2);border:1px solid var(--primary-2);border-radius:8px;color:var(--text);font-size:14px;resize:vertical;font-family:inherit}.story-context-input:focus{outline:none;border-color:var(--primary)}.story-context-tip{margin-top:8px;font-size:.9em}.story-context-actions{display:flex;gap:10px;margin-top:20px;justify-content:center}.story-context-actions .btn-secondary{margin-bottom:0}.story-content{padding:18px 20px 28px;line-height:1.6;font-size:1.1rem;overflow-y:auto;overflow-x:hidden;white-space:pre-wrap;word-break:break-word;overflow-wrap:break-word;flex:1 1;min-height:0}.story-word{padding:2px 1px;border-radius:4px;transition:background-color .15s ease}.story-word.highlight{background:rgba(187,134,252,.22)}.story-word.active{background:rgba(187,134,252,.45)}.demo-controls{display:flex;flex-direction:column;align-items:center;gap:12px;padding:20px 16px 28px;background:#151522;border-top:1px solid #24243a;flex-shrink:0}.demo-controls.hidden{display:none}.demo-controls p{color:var(--muted);font-size:.95rem;margin:0}.demo-start-btn{font-size:1.15rem;padding:14px 48px;border-radius:var(--radius-lg);animation:demoPulse 2s ease-in-out infinite}.demo-start-btn.hidden{display:none}.demo-stop-btn{font-size:1.15rem;padding:14px 48px;border-radius:var(--radius-lg);background:var(--danger);color:#fff;border:none;cursor:pointer}.demo-stop-btn:hover{opacity:.85}.demo-stop-btn.hidden{display:none}.demo-auto-btn{font-size:1.15rem;padding:14px 48px;border-radius:var(--radius-lg);animation:demoPulse 2s ease-in-out infinite}.demo-auto-btn.hidden{display:none}.demo-selector{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:32px 28px;max-width:520px;width:90%;text-align:center;max-height:90vh;overflow-y:auto}.demo-selector-title{color:var(--text);font-size:1.4rem;margin:0 0 8px}.demo-selector-desc{color:var(--muted);font-size:.95rem;margin:0 0 20px}.demo-story-list{gap:10px}.demo-story-card,.demo-story-list{display:flex;flex-direction:column}.demo-story-card{align-items:flex-start;padding:16px 20px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;transition:border-color .2s,background .2s;text-align:left}.demo-story-card:hover{border-color:var(--accent);background:rgba(138,43,226,.08)}.demo-story-card-title{color:var(--text);font-size:1.05rem;font-weight:600;margin:0 0 4px}.demo-story-card-theme{color:var(--accent);font-size:.8rem;font-weight:500;text-transform:uppercase;letter-spacing:.05em;margin:0 0 6px}.demo-story-card-desc{color:var(--muted);font-size:.9rem;margin:0}@keyframes demoPulse{0%,to{box-shadow:0 0 0 0 rgba(138,43,226,.4)}50%{box-shadow:0 0 20px 4px rgba(138,43,226,.3)}}.stories-selector{margin-top:18px}.stories-row{display:flex;align-items:center;gap:10px}:root{--bg:#0a0a0a;--bg-alt:#0b0b10;--surface:#151522;--surface-2:#1e1e2e;--border:#24243a;--text:#e0e0e0;--muted:#aaa;--muted-2:#888;--primary:#8a2be2;--primary-2:#bb86fc;--teal:#03dac6;--success:#00c853;--danger:#cf6679;--warning:#ffb74d;--radius:12px;--radius-lg:16px;--shadow:0 10px 40px rgba(0,0,0,0.35);--container:980px;--space-1:6px;--space-2:10px;--space-3:14px;--space-4:18px;--space-5:24px;--space-6:30px}*{margin:0;box-sizing:border-box}*,body{padding:0}body{font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;background:linear-gradient(135deg,var(--bg) 0,#1a1a2e 100%);color:var(--text);min-height:100vh;overflow-x:hidden;-webkit-overflow-scrolling:touch}.modal{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.95);display:flex;justify-content:center;align-items:center;z-index:1000}.modal-content{background:linear-gradient(135deg,#1e1e2e,#2d2d44);padding:40px;border-radius:20px;box-shadow:0 10px 50px rgba(138,43,226,.3);text-align:center;max-width:500px;width:90%;border:2px solid #8a2be2;box-sizing:border-box;max-height:90vh;overflow-y:auto}.modal-content h2{margin-bottom:20px;color:#bb86fc}.modal-content input{width:100%;padding:15px;margin:20px 0;background:#0a0a0a;border:2px solid #444;border-radius:10px;color:#fff;font-size:16px}.modal-content input:focus{outline:none;border-color:#bb86fc}.modal-content textarea{width:100%;padding:12px 15px;background:#0a0a0a;border:2px solid #444;border-radius:10px;color:#fff;font-size:16px}.modal-content textarea:focus{outline:none;border-color:#bb86fc}.ai-provider-selector{display:flex;gap:10px;margin:20px 0}.provider-btn{flex:1 1;padding:12px 20px;background:rgba(255,255,255,.05);border:2px solid #444;border-radius:10px;color:#e0e0e0;font-size:1em;cursor:pointer;transition:all .3s ease}.provider-btn:hover{background:rgba(138,43,226,.2);border-color:#bb86fc}.provider-btn.active{background:linear-gradient(135deg,#8a2be2,#bb86fc);border-color:#bb86fc;font-weight:700}.provider-info{background:rgba(3,218,198,.1);padding:15px;border-radius:10px;margin:15px 0;font-size:.9em;text-align:left}.provider-info p{margin:8px 0}.provider-info a{color:#03dac6;text-decoration:none;word-break:break-all}.provider-info a:hover{text-decoration:underline}.info-text{font-size:12px;color:#888;margin-top:15px}#appContainer{width:100%;margin:0 auto;padding-bottom:0;overflow-x:hidden}.hidden{display:none!important}header{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);margin-bottom:40px;padding:18px 20px;background:rgba(138,43,226,.08);border-radius:var(--radius-lg);border:1px solid rgba(138,43,226,.25)}.brand h1{font-size:2.2rem;line-height:1.1;background:linear-gradient(45deg,var(--primary-2),var(--teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;margin-bottom:6px}.tagline{color:var(--muted);font-size:.98rem}.header-actions{display:flex;gap:var(--space-2);flex-wrap:wrap}.btn-tutorial{padding:10px 16px;background:rgba(3,218,198,.12);border:1px solid var(--teal);border-radius:10px;color:var(--teal);font-size:.95em;cursor:pointer;transition:all .3s ease}.btn-tutorial:hover{background:rgba(3,218,198,.25);transform:scale(1.05);box-shadow:0 5px 15px rgba(3,218,198,.3)}.mode-selector{margin-bottom:30px}.mode-selector h3{color:#bb86fc;margin-bottom:15px;font-size:1.3em}.mode-dropdown{width:100%;padding:15px 20px;background:rgba(255,255,255,.05);border:2px solid #444;border-radius:12px;color:#e0e0e0;font-size:1.1em;cursor:pointer;transition:all .3s ease;outline:none}.mode-dropdown:hover{background:rgba(138,43,226,.2);border-color:#bb86fc}.mode-dropdown:focus{background:rgba(138,43,226,.15);border-color:#bb86fc;box-shadow:0 0 15px rgba(138,43,226,.4)}.mode-dropdown option{background:#1a1a1a;color:#e0e0e0;padding:10px}.mode-buttons{display:flex;gap:15px;flex-wrap:wrap}.mode-btn{flex:1 1;min-width:150px;padding:15px 20px;background:rgba(255,255,255,.05);border:2px solid #444;border-radius:12px;color:#e0e0e0;font-size:1em;cursor:pointer;transition:all .3s ease}.mode-btn:hover{background:rgba(138,43,226,.2);border-color:#bb86fc;transform:translateY(-2px)}.mode-btn.active{background:linear-gradient(135deg,#8a2be2,#bb86fc);border-color:#bb86fc;box-shadow:0 5px 20px rgba(138,43,226,.5)}.playback-options{margin-bottom:30px;padding:20px;background:rgba(255,255,255,.03);border-radius:var(--radius);border:1px solid rgba(255,255,255,.06);box-shadow:var(--shadow)}.playback-options h3{color:#03dac6;margin-bottom:16px}.menu-section{margin-bottom:20px;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);border:1px solid rgba(255,255,255,.06)}.menu-toggle{width:100%;padding:16px 20px;background:linear-gradient(135deg,rgba(138,43,226,.15),rgba(187,134,252,.1));border:none;border-bottom:1px solid rgba(255,255,255,.08);color:var(--text);font-size:1.1em;font-weight:600;text-align:left;cursor:pointer;display:flex;align-items:center;justify-content:space-between;transition:all .3s ease}.menu-toggle:hover{background:linear-gradient(135deg,rgba(138,43,226,.25),rgba(187,134,252,.15))}.menu-toggle .toggle-indicator{font-size:.8em;transition:transform .3s ease;color:var(--primary-2)}.menu-toggle.active .toggle-indicator{transform:rotate(-180deg)}.menu-content{padding:20px;background:rgba(255,255,255,.03);max-height:1000px;overflow:hidden;transition:max-height .3s ease,padding .3s ease}.menu-content.hidden{max-height:0;padding:0 20px}.menu-content h3{color:#03dac6;margin-bottom:16px;font-size:1em}.menu-content h3:not(:first-child){margin-top:20px}.toggle-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.08)}.toggle-row:last-child{border-bottom:none}.toggle-row label{color:#e0e0e0;font-size:1em}.tooltip{position:relative;gap:6px}.tooltip,.tooltip-icon{display:inline-flex;align-items:center}.tooltip-icon{-moz-appearance:none;appearance:none;-webkit-appearance:none;border:1px solid #8a2be2;background:rgba(138,43,226,.15);color:#bb86fc;width:18px;height:18px;border-radius:50%;font-size:12px;line-height:1;justify-content:center;cursor:help;padding:0}.tooltip-content{position:absolute;z-index:50;left:0;top:125%;min-width:220px;max-width:min(320px,calc(100vw - 30px));background:rgba(0,0,0,.9);border:1px solid #444;border-radius:8px;padding:10px 12px;color:#ddd;font-size:.9em;box-shadow:0 6px 20px rgba(0,0,0,.4);visibility:hidden;opacity:0;transform:translateY(4px);transition:opacity .15s ease,transform .15s ease,visibility .15s ease}.tooltip.show .tooltip-content{visibility:visible;opacity:1;transform:translateY(0)}.switch{position:relative;display:inline-block;width:54px;height:28px}.switch input{opacity:0;width:0;height:0}.slider{cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#444;border-radius:28px;border:1px solid #555}.slider,.slider:before{position:absolute;transition:.3s}.slider:before{content:"";height:22px;width:22px;left:3px;top:50%;transform:translateY(-50%);background-color:#fff;border-radius:50%}input:checked+.slider{background:linear-gradient(135deg,#8a2be2,#bb86fc);border-color:#8a2be2}input:checked+.slider:before{transform:translate(26px,-50%)}.btn-stop-audio{padding:12px 18px;background:rgba(255,255,255,.05);border:2px solid #444;border-radius:12px;color:#e0e0e0;font-size:1em;cursor:pointer;transition:all .2s ease;margin-left:10px}.btn-stop-audio:hover{background:rgba(220,53,69,.15);border-color:#dc3545}.volume-controls{margin-bottom:30px;padding:20px;background:rgba(255,255,255,.03);border-radius:var(--radius);border:1px solid rgba(255,255,255,.06);box-shadow:var(--shadow)}.volume-controls h3{color:#03dac6;margin-bottom:20px}.slider-container{margin-bottom:20px}.slider-container label{display:block;margin-bottom:8px;color:#aaa}.slider-container span{color:#03dac6;font-weight:700}input[type=range]{width:100%;height:8px;background:#333;border-radius:5px;outline:none;-moz-appearance:none;appearance:none;-webkit-appearance:none}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;background:linear-gradient(135deg,#03dac6,#bb86fc);border-radius:50%;cursor:pointer;box-shadow:0 2px 10px rgba(3,218,198,.5)}input[type=range]::-moz-range-thumb{width:20px;height:20px;background:linear-gradient(135deg,#03dac6,#bb86fc);border-radius:50%;cursor:pointer;border:none}@media (pointer:coarse){input[type=range]{height:12px}input[type=range]::-webkit-slider-thumb{width:28px;height:28px}input[type=range]::-moz-range-thumb{width:28px;height:28px}}.visualizer-section{margin-bottom:30px;padding:24px;background:#000;border-radius:var(--radius-lg);border:1px solid #333;position:relative;min-height:250px;display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:var(--shadow)}#visualizer{width:100%;height:200px;background:transparent}.status-row{display:flex;align-items:center;justify-content:center;gap:10px;margin-top:15px}.mic-indicator{width:12px;height:12px;border-radius:50%;background:var(--text-dim,#898999);display:none;flex-shrink:0}.mic-indicator.active{display:block;background:#cf6679;animation:mic-pulse 1.2s ease-in-out infinite}@keyframes mic-pulse{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.5);opacity:.5}}.status-text{font-size:1.1em;text-align:center;font-weight:500;transition:color .3s ease}.status-text,.status-text.status-info{color:#03dac6}.status-text.status-error{color:#cf6679;font-weight:600}.status-text.status-warning{color:#ffb74d;font-weight:600}.status-text.status-success{color:#81c784}.controls{margin-bottom:30px;display:flex;gap:15px;justify-content:center;flex-wrap:wrap}.btn-start,.btn-stop,.btn-test{padding:20px 50px;font-size:1.3em;border:none;border-radius:15px;cursor:pointer;font-weight:700;transition:all .3s ease;box-shadow:0 5px 20px rgba(0,0,0,.3)}.btn-test{background:linear-gradient(135deg,#ff9800,#ffc107);color:#000;padding:15px 30px;font-size:1.1em}.btn-test:hover{transform:scale(1.05);box-shadow:0 8px 30px rgba(255,152,0,.5)}.btn-start{background:linear-gradient(135deg,#00c853,#03dac6);color:#000}.btn-start:hover{transform:scale(1.05);box-shadow:0 8px 30px rgba(3,218,198,.5)}.btn-stop{background:linear-gradient(135deg,#cf6679,#ff5252);color:#fff}.btn-stop:hover{transform:scale(1.05);box-shadow:0 8px 30px rgba(207,102,121,.5)}.transcript-section{margin-bottom:30px}.transcript-section h3{color:#bb86fc;margin-bottom:15px}.transcript-box{background:rgba(0,0,0,.5);border:1px solid #333;border-radius:var(--radius);padding:20px;min-height:100px;max-height:200px;overflow-y:auto;color:#e0e0e0;font-family:Courier New,monospace;line-height:1.6;box-shadow:var(--shadow)}.sounds-section{margin-bottom:30px}.sounds-section h3{color:#03dac6;margin-bottom:15px}.sounds-list{display:flex;flex-direction:column;gap:10px}.sound-item{padding:15px;background:rgba(3,218,198,.08);border:1px solid #03dac6;border-radius:var(--radius);display:flex;justify-content:space-between;align-items:center;transition:all .3s ease}.sound-item.inactive{background:rgba(255,255,255,.03);border-color:#444;color:#666}.sound-item .sound-type{font-weight:700;color:#03dac6}.sound-item .sound-name{flex:1 1;margin:0 15px}.sound-item .sound-volume{color:#bb86fc;font-size:.9em}footer{text-align:center;padding:30px 0;border-top:1px solid #333;margin-top:40px}.api-status-row{display:flex;gap:12px;margin-bottom:15px}.api-status,.api-status-row{align-items:center;justify-content:center}.api-status{display:inline-flex;width:24px;height:24px;border-radius:50%;font-size:14px;font-weight:700;border:2px solid}.api-status.active{background:rgba(0,200,83,.15);border-color:#00c853;color:#00c853}.api-status.active:before{content:"✓"}.api-status.inactive{background:rgba(207,102,121,.15);border-color:#cf6679;color:#cf6679}.api-status.inactive:before{content:"✕"}.btn-primary,.btn-secondary{padding:12px 20px;border:none;border-radius:10px;cursor:pointer;font-size:1em;transition:all .3s ease}.btn-primary{background:linear-gradient(135deg,#bb86fc,#8a2be2);color:#fff;font-weight:700}.btn-primary:hover{transform:scale(1.05);box-shadow:0 5px 20px rgba(138,43,226,.5)}.btn-secondary{background:rgba(255,255,255,.05);color:#aaa;border:1px solid #444;margin-bottom:15px}.btn-secondary:hover{background:rgba(255,255,255,.1);color:#fff}.btn-refresh{width:100%;padding:12px 20px;background:linear-gradient(135deg,rgba(3,218,198,.2),rgba(3,218,198,.1));color:var(--teal);border:1px solid rgba(3,218,198,.4);border-radius:8px;font-size:1em;font-weight:600;cursor:pointer;transition:all .3s ease;display:flex;align-items:center;justify-content:center;gap:8px}.btn-refresh:hover{background:linear-gradient(135deg,rgba(3,218,198,.3),rgba(3,218,198,.15));border-color:rgba(3,218,198,.6);transform:scale(1.02)}.btn-refresh:active{transform:scale(.98)}.version{color:#666;font-size:.9em;margin-top:15px}.hub-footer-actions{display:flex;gap:10px;justify-content:center;margin-top:12px;margin-bottom:4px}.hub-footer-actions .btn-secondary{margin-bottom:0;font-size:.85rem;padding:8px 16px}.hub-card:focus-visible{outline:2px solid var(--primary-2);outline-offset:3px;border-color:var(--primary);transform:translateY(-4px);box-shadow:0 12px 40px rgba(138,43,226,.2)}.btn-primary:focus-visible,.btn-refresh:focus-visible,.btn-secondary:focus-visible,.btn-start:focus-visible,.btn-stop:focus-visible,.btn-test:focus-visible{outline:2px solid var(--primary-2);outline-offset:2px}button:focus-visible{outline:2px solid var(--primary-2);outline-offset:2px}@keyframes pulse{0%,to{opacity:1}50%{opacity:.6}}.listening{animation:pulse 2s infinite}.overlay{position:fixed;inset:0;background:rgba(0,0,0,.9);justify-content:center;z-index:2000}.overlay,.overlay-content{display:flex;align-items:center}.overlay-content{background:linear-gradient(135deg,#1e1e2e,#2d2d44);padding:30px 40px;border-radius:var(--radius-lg);border:2px solid #8a2be2;box-shadow:0 10px 40px rgba(138,43,226,.3);gap:16px}.spinner{width:28px;height:28px;border:3px solid rgba(187,134,252,.2);border-top-color:#bb86fc;border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.transcript-box::-webkit-scrollbar{width:8px}.transcript-box::-webkit-scrollbar-track{background:#1a1a1a;border-radius:10px}.transcript-box::-webkit-scrollbar-thumb{background:#bb86fc;border-radius:10px}.transcript-box::-webkit-scrollbar-thumb:hover{background:#8a2be2}.tutorial-content{max-width:min(700px,95vw);max-height:85vh;overflow-y:auto;text-align:left;position:relative}.tutorial-intro{font-size:1.05em;color:#aaa;margin-bottom:25px;text-align:center}.tutorial-section{margin-bottom:25px;padding:20px;background:rgba(0,0,0,.3);border-radius:12px;border-left:4px solid #03dac6}.tutorial-section h3{color:#03dac6;margin-bottom:12px;font-size:1.25em}.tutorial-section p{color:#e0e0e0;margin:8px 0;line-height:1.6}.tutorial-section ul{margin:10px 0 0 20px;color:#e0e0e0}.tutorial-section ul li{margin:6px 0;line-height:1.5}.tutorial-section a{color:#bb86fc;text-decoration:none}.tutorial-section a:hover{text-decoration:underline}.close-btn{position:absolute;top:15px;right:15px;background:rgba(207,102,121,.2);border:2px solid #cf6679;color:#cf6679;width:36px;height:36px;border-radius:50%;font-size:1.3em;cursor:pointer;transition:all .2s ease;display:flex;align-items:center;justify-content:center;padding:0;line-height:1}.close-btn:hover{background:rgba(207,102,121,.35);transform:scale(1.1)}.tutorial-content::-webkit-scrollbar{width:8px}.tutorial-content::-webkit-scrollbar-track{background:#1a1a1a;border-radius:10px}.tutorial-content::-webkit-scrollbar-thumb{background:#03dac6;border-radius:10px}.tutorial-content::-webkit-scrollbar-thumb:hover{background:#bb86fc}@media (max-width:768px){.brand h1{font-size:1.8rem}header{flex-direction:column;align-items:flex-start}.header-actions{width:100%;justify-content:flex-start}.mode-buttons{flex-direction:column}.mode-btn{width:100%}.controls{flex-direction:column}.btn-start,.btn-stop{width:100%}.app-section{min-height:auto;overflow-y:auto;-webkit-overflow-scrolling:touch}.cb-canvas{min-height:300px;overflow:auto;-webkit-overflow-scrolling:touch}}@media (max-width:480px){.btn-start,.btn-stop,.btn-test{width:100%;padding:16px 18px;font-size:1.05rem}.mode-dropdown{font-size:1rem;padding:12px 14px}.toggle-row{gap:10px}.switch{width:50px;height:26px}.slider:before{width:20px;height:20px}.app-section{padding-bottom:24px}.section-body{overflow-y:auto;-webkit-overflow-scrolling:touch}.cb-canvas{min-height:250px}}@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}.reduced-motion *{animation:none!important;transition:none!important}.skip-link{position:absolute;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden}.skip-link:focus{position:fixed!important;top:10px!important;left:10px!important;z-index:10000!important;background:var(--primary)!important;color:white!important;padding:10px!important;text-decoration:none!important;border-radius:5px!important;width:auto!important;height:auto!important}.sr-only{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}kbd{background:rgba(138,43,226,.2);padding:4px 8px;border-radius:4px;font-family:monospace;border:1px solid rgba(138,43,226,.4);display:inline-block;font-size:.9em}@media (orientation:landscape) and (max-height:600px){header{padding:12px 20px}.brand h1{font-size:1.5rem}.brand .tagline{font-size:.85rem}.menu-section{margin-bottom:15px}.menu-toggle{padding:12px 16px}.visualizer-section{min-height:auto}.visualizer-section canvas{height:60px}.controls{gap:10px;padding:15px 0}.controls button{padding:10px 20px;font-size:.95rem}.sounds-list,.transcript-box{max-height:120px}footer{padding:15px 20px}.menu-content{padding:15px}.slider-container{margin-bottom:12px}.toggle-row{padding:8px 0}}.btn-demo{padding:10px 18px;background:linear-gradient(135deg,#ff9800,#ffc107);border:none;border-radius:10px;color:#000;font-size:.95em;font-weight:700;cursor:pointer;transition:all .3s ease;letter-spacing:.02em}.btn-demo:hover{transform:scale(1.05);box-shadow:0 5px 20px rgba(255,152,0,.5)}.btn-demo.demo-active{background:linear-gradient(135deg,#cf6679,#ff5252);color:#fff;animation:pulse 1.5s infinite}.activity-feed-section{margin-bottom:30px}.activity-feed-section h3{color:var(--primary-2);margin-bottom:10px;display:flex;align-items:center;gap:8px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.activity-feed-section h3 .toggle-indicator{font-size:.7em;transition:transform .2s ease}.activity-feed-section h3.collapsed .toggle-indicator{transform:rotate(-90deg)}.activity-log{background:rgba(0,0,0,.6);border:1px solid var(--border);border-radius:var(--radius);padding:10px 14px;max-height:180px;overflow-y:auto;font-family:Courier New,monospace;font-size:.82em;line-height:1.55;scroll-behavior:smooth}.activity-log.collapsed{display:none}.activity-entry{padding:3px 0;border-bottom:1px solid rgba(255,255,255,.04);display:flex;gap:8px;align-items:baseline}.activity-entry:last-child{border-bottom:none}.activity-time{color:var(--muted-2);font-size:.85em;flex-shrink:0}.activity-entry.type-trigger .activity-msg{color:#ffc107}.activity-entry.type-ai .activity-msg{color:var(--teal)}.activity-entry.type-play .activity-msg{color:var(--success)}.activity-entry.type-error .activity-msg{color:var(--danger)}.activity-entry.type-info .activity-msg{color:var(--muted)}.activity-msg{word-break:break-word}.session-stats{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:20px;padding:12px 16px;background:rgba(138,43,226,.06);border:1px solid rgba(138,43,226,.2);border-radius:var(--radius)}.stat-item{display:flex;flex-direction:column;align-items:center;gap:2px;min-width:80px;flex:1 1}.stat-value{font-size:1.5em;font-weight:700;background:linear-gradient(135deg,var(--primary-2),var(--teal));-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.stat-label{font-size:.72em;color:var(--muted-2);text-transform:uppercase;letter-spacing:.04em}.story-progress-bar{height:3px;background:rgba(255,255,255,.08);position:relative;flex-shrink:0}.story-progress-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--teal));transition:width .3s ease;border-radius:0 2px 2px 0}.story-progress-text{position:absolute;right:10px;top:-18px;font-size:.7em;color:var(--muted-2)}.latency-badge{font-size:.72em;color:var(--teal);background:rgba(3,218,198,.1);padding:2px 7px;border-radius:6px;font-family:Courier New,monospace;white-space:nowrap;margin-left:6px}.preload-progress{width:100%;margin-top:12px}.preload-bar-track{width:100%;height:6px;background:rgba(255,255,255,.08);border-radius:3px;overflow:hidden}.preload-bar-fill{height:100%;background:linear-gradient(90deg,var(--primary),var(--teal));transition:width .15s ease;border-radius:3px}.preload-text{font-size:.85em;color:var(--muted);margin-top:6px;text-align:center}.visualizer-section.mode-horror{border-color:rgba(207,102,121,.35);box-shadow:0 0 30px rgba(207,102,121,.12)}.visualizer-section.mode-christmas{border-color:rgba(255,183,77,.35);box-shadow:0 0 30px rgba(255,183,77,.12)}.visualizer-section.mode-halloween{border-color:rgba(255,152,0,.35);box-shadow:0 0 30px rgba(255,152,0,.12)}.visualizer-section.mode-dnd{border-color:rgba(138,43,226,.35);box-shadow:0 0 30px rgba(138,43,226,.12)}.visualizer-section.mode-bedtime{border-color:rgba(100,181,246,.35);box-shadow:0 0 30px rgba(100,181,246,.12)}.visualizer-section.mode-sing{border-color:rgba(3,218,198,.35);box-shadow:0 0 30px rgba(3,218,198,.12)}.visualizer-section.mode-auto{border-color:rgba(187,134,252,.35);box-shadow:0 0 30px rgba(187,134,252,.12)}@keyframes sfx-pulse{0%{box-shadow:inherit}50%{box-shadow:0 0 40px rgba(3,218,198,.3)}to{box-shadow:inherit}}.visualizer-section.sfx-pulse{animation:sfx-pulse .4s ease}.no-key-banner{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:rgba(255,183,77,.08);border:1px solid rgba(255,183,77,.3);border-radius:var(--radius);margin-bottom:20px;font-size:.88em;color:var(--warning)}.no-key-banner button{background:none;border:1px solid var(--warning);border-radius:6px;color:var(--warning);padding:4px 12px;cursor:pointer;font-size:.9em;transition:all .2s}.no-key-banner button:hover{background:rgba(255,183,77,.15)}@media (max-width:768px){.controls{gap:10px}.btn-start,.btn-stop,.btn-test{padding:18px 24px;font-size:1.15em;width:100%;touch-action:manipulation}.btn-demo{width:100%;padding:14px;font-size:1.05em}.mode-dropdown{font-size:1.05em;padding:14px 16px;min-height:50px}.session-stats{gap:8px;padding:10px 12px}.stat-value{font-size:1.2em}.stat-label{font-size:.65em}.activity-log{max-height:120px;font-size:.78em}.story-content{font-size:1.05rem;-webkit-overflow-scrolling:touch}.sound-item{padding:12px;gap:8px}}@media (max-width:480px){.session-stats{flex-direction:row;justify-content:space-between}.stat-item{min-width:60px}.btn-start,.btn-stop{padding:16px 18px}.header-actions{gap:6px}.btn-demo,.btn-tutorial{padding:8px 12px;font-size:.85em}}@media (pointer:coarse){.btn-demo,.btn-primary,.btn-secondary,.btn-start,.btn-stop,.btn-stop-audio,.btn-test{min-height:44px;min-width:44px}#storiesDropdown,.menu-toggle,.mode-dropdown{min-height:48px}.switch{transform:scale(1.1)}}.mute-categories{display:flex;gap:8px;justify-content:center;margin-bottom:20px}.mute-cat-btn{padding:8px 16px;border-radius:20px;border:1px solid var(--border);background:var(--surface-2);color:var(--text-dim,#898999);font-size:.82rem;cursor:pointer;transition:all .2s;opacity:.5;min-height:36px}.mute-cat-btn.active{border-color:var(--primary);color:var(--primary-2);opacity:1;background:rgba(138,43,226,.1)}.audio-controls-panel{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px 24px;margin-bottom:24px}.audio-controls-title{font-size:.85rem;text-transform:uppercase;letter-spacing:.8px;color:var(--muted-2);margin:0 0 16px}.audio-controls-grid{display:flex;flex-direction:column;gap:14px}.audio-control-row{display:flex;align-items:center;justify-content:space-between;gap:12px}.audio-control-label{display:flex;align-items:center;gap:8px;font-size:.9rem;color:var(--text);cursor:pointer;flex-shrink:0}.audio-control-label svg{opacity:.7;flex-shrink:0}.toggle-switch{position:relative;display:inline-block;width:44px;height:24px;flex-shrink:0}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{cursor:pointer;inset:0;background:var(--surface-2,#2a2a3a);border:1px solid var(--border);border-radius:24px}.toggle-slider,.toggle-slider:before{position:absolute;transition:all .25s}.toggle-slider:before{content:"";height:18px;width:18px;left:2px;bottom:2px;background:var(--muted);border-radius:50%}.toggle-switch input:checked+.toggle-slider{background:rgba(138,43,226,.25);border-color:var(--primary)}.toggle-switch input:checked+.toggle-slider:before{transform:translateX(20px);background:var(--primary-2)}.audio-control-slider-row{flex-wrap:wrap;padding-top:4px;border-top:1px solid var(--border);margin-top:2px}.audio-slider-wrap{display:flex;align-items:center;gap:10px;flex:1 1;min-width:0;max-width:220px}.audio-slider{flex:1 1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:6px;background:var(--surface-2,#2a2a3a);border-radius:3px;outline:none;cursor:pointer}.audio-slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;background:var(--primary-2);border-radius:50%;cursor:pointer;border:2px solid var(--surface);box-shadow:0 2px 6px rgba(0,0,0,.3)}.audio-slider::-moz-range-thumb{width:18px;height:18px;background:var(--primary-2);border-radius:50%;cursor:pointer;border:2px solid var(--surface);box-shadow:0 2px 6px rgba(0,0,0,.3)}.audio-slider-value{font-size:.82rem;color:var(--primary-2);font-weight:600;min-width:32px;text-align:right}@media (max-width:480px){.audio-controls-panel{padding:16px}.audio-control-slider-row{flex-direction:column;align-items:stretch}.audio-slider-wrap{max-width:none}}@media (pointer:coarse){.toggle-switch{width:48px;height:28px}.toggle-slider:before{width:22px;height:22px}.toggle-switch input:checked+.toggle-slider:before{transform:translateX(20px)}.audio-slider::-webkit-slider-thumb{width:24px;height:24px}.audio-slider::-moz-range-thumb{width:24px;height:24px}}@media (max-width:400px){.modal-content{padding:20px 16px;width:95%}.section-header{gap:8px}.section-header h2{font-size:1.1rem}.cb-header-actions{gap:4px}.cb-btn-sm{padding:5px 8px!important;font-size:.75rem!important}.mute-categories{flex-wrap:wrap}}@media (max-width:480px){.wyo-cue-row{flex-direction:column;align-items:stretch;gap:8px}.wyo-cue-arrow{display:none}.wyo-cue-keyword,.wyo-cue-select-wrap{width:100%}.wyo-cue-type-toggle{align-self:flex-start}.tooltip-content{left:auto;right:0}}@media (pointer:coarse){.mute-cat-btn{min-height:44px;display:inline-flex;align-items:center}.cb-button-delete{display:flex;width:26px;height:26px}}.hub-ambient{position:absolute;inset:0;z-index:0;pointer-events:none;background:radial-gradient(ellipse at 30% 50%,rgba(138,43,226,.08) 0,transparent 60%),radial-gradient(ellipse at 70% 60%,rgba(3,218,198,.06) 0,transparent 55%);background-size:200% 200%;animation:ambientDrift 12s ease-in-out infinite alternate}@keyframes ambientDrift{0%{background-position:0 0}to{background-position:100% 100%}}.hub-header .brand,.hub-hero-cta,.hub-hero-sub,.hub-hero-tagline{position:relative;z-index:1}.hub-how-it-works{max-width:820px;margin:0 auto 32px;padding:0 20px;text-align:center}.hub-hiw-title{font-size:1rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin-bottom:20px}.hub-hiw-steps{justify-content:center;gap:12px;flex-wrap:wrap}.hub-hiw-step,.hub-hiw-steps{display:flex;align-items:center}.hub-hiw-step{flex-direction:column;gap:8px;min-width:120px;flex:0 1 auto}.hub-hiw-icon{width:52px;height:52px;border-radius:50%;background:rgba(138,43,226,.12);border:1px solid rgba(138,43,226,.25);display:flex;align-items:center;justify-content:center}.hub-hiw-icon svg{width:24px;height:24px}.hub-hiw-step span{font-size:.85rem;color:var(--muted)}.hub-hiw-arrow{color:rgba(138,43,226,.35);font-size:1.2rem;flex-shrink:0;align-self:center;margin-top:-20px}@media (max-width:600px){.hub-hiw-steps{gap:8px}.hub-hiw-arrow{display:none}.hub-hiw-step{min-width:80px}.hub-hiw-icon{width:44px;height:44px}.hub-hiw-icon svg{width:20px;height:20px}}.app-section{opacity:0;transform:translateY(8px);transition:opacity .3s ease,transform .3s ease}.app-section.section-visible{opacity:1;transform:translateY(0)}#hubScreen{transition:opacity .25s ease}#hubScreen.hub-fading,.modal{opacity:0}.modal{transition:opacity .25s ease}.modal:not(.hidden){opacity:1}.modal .modal-content{transform:scale(.92);transition:transform .25s cubic-bezier(.34,1.56,.64,1)}.modal:not(.hidden) .modal-content{transform:scale(1)}.toast-container{position:fixed;top:20px;right:20px;z-index:3000;display:flex;flex-direction:column;gap:8px;pointer-events:none}.toast{pointer-events:auto;padding:12px 20px;border-radius:var(--radius);color:#fff;font-size:.9rem;font-weight:500;background:var(--surface);border:1px solid var(--border);box-shadow:0 4px 24px rgba(0,0,0,.4);opacity:0;transform:translateX(40px);transition:opacity .3s ease,transform .3s ease;max-width:340px;cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.toast.toast-show{opacity:1;transform:translateX(0)}.toast.toast-hide{opacity:0;transform:translateX(40px)}.toast.toast-success{border-left:3px solid var(--teal)}.toast.toast-error{border-left:3px solid var(--danger)}.toast.toast-warning{border-left:3px solid #ffc107}.toast.toast-info{border-left:3px solid var(--primary-2)}.btn-loading{position:relative;pointer-events:none;opacity:.7}.btn-loading:after{content:"";position:absolute;width:16px;height:16px;top:50%;left:50%;margin:-8px 0 0 -8px;border:2px solid transparent;border-top-color:currentcolor;border-radius:50%;animation:btnSpin .6s linear infinite}.btn-loading>*{visibility:hidden}.btn-loading-inline{color:transparent!important}@keyframes btnSpin{to{transform:rotate(1turn)}}@media (max-width:600px){.toast-container{left:12px;right:12px;top:12px}.toast{max-width:100%}}.sound-lib-controls{display:flex;flex-direction:column;gap:12px;margin-bottom:20px}.sound-lib-search{width:100%;padding:10px 14px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:.95rem}.sound-lib-search:focus{outline:none;border-color:var(--primary)}.sound-lib-filters{display:flex;gap:8px;flex-wrap:wrap}.sound-lib-filter{padding:6px 14px;border-radius:20px;border:1px solid var(--border);background:transparent;color:var(--muted);cursor:pointer;font-size:.85rem;transition:all .2s ease}.sound-lib-filter:hover{border-color:var(--primary-2);color:var(--text)}.sound-lib-filter.active{background:var(--primary);border-color:var(--primary);color:#fff}.sound-lib-stats{display:flex;gap:16px;font-size:.85rem;color:var(--muted)}.sound-lib-list{display:flex;flex-direction:column;gap:4px;max-height:60vh;overflow-y:auto;padding-right:4px}.sound-lib-item{display:flex;align-items:center;gap:12px;padding:10px 14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);transition:background .2s ease}.sound-lib-item:hover{background:rgba(138,43,226,.06)}.sound-lib-item.disabled{opacity:.45}.sound-lib-preview{width:32px;height:32px;border-radius:50%;border:1px solid var(--border);background:transparent;color:var(--primary-2);cursor:pointer;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .2s ease}.sound-lib-preview:hover{background:var(--primary);color:#fff;border-color:var(--primary)}.sound-lib-preview.playing{background:var(--teal);border-color:var(--teal);color:#fff;font-size:.85rem}.sound-lib-info{flex:1 1;min-width:0}.sound-lib-name{font-size:.9rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sound-lib-duration{font-size:.75rem;color:var(--muted);margin-left:4px}.sound-lib-tags{font-size:.75rem;color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sound-lib-type{font-size:.7rem;padding:2px 8px;border-radius:10px;background:rgba(138,43,226,.15);color:var(--primary-2);flex-shrink:0;text-transform:uppercase}.sound-lib-type.type-sfx{background:rgba(3,218,198,.15);color:var(--teal)}.sound-lib-type.type-ambience{background:rgba(255,193,7,.15);color:#ffc107}.sound-lib-toggle{width:36px;height:20px;border-radius:10px;border:none;cursor:pointer;background:var(--teal);position:relative;flex-shrink:0;transition:background .2s ease}.sound-lib-toggle:after{content:"";position:absolute;top:2px;left:18px;width:16px;height:16px;border-radius:50%;background:#fff;transition:left .2s ease}.sound-lib-toggle.off{background:var(--border)}.sound-lib-toggle.off:after{left:2px}.sound-lib-custom{margin-top:28px;padding-top:20px;border-top:1px solid var(--border)}.sound-lib-custom h3{margin-bottom:8px;font-size:1rem}.sound-lib-custom .btn-primary{margin:12px 0}.modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);display:flex;align-items:center;justify-content:center;z-index:2000;opacity:1;transition:opacity .25s ease}.modal-overlay.hidden{opacity:0;pointer-events:none}.record-modal{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius-lg);padding:28px;width:90%;max-width:420px;position:relative}.modal-close{position:absolute;top:12px;right:16px;background:none;border:none;color:var(--muted);font-size:1.4rem;cursor:pointer}.modal-close:hover{color:var(--text)}.record-modal h2{margin-bottom:16px;font-size:1.2rem}.record-controls{display:flex;flex-direction:column;align-items:center;gap:12px;margin-bottom:20px}.record-visualizer{width:100%;height:60px;background:var(--surface);border-radius:var(--radius);overflow:hidden}.record-visualizer canvas{width:100%;height:100%}.session-recording-panel{margin-top:20px;padding:16px;background:var(--surface);border-radius:var(--radius);border:1px solid var(--border)}.session-recording-panel h3{margin:0 0 6px;font-size:.95rem}.session-rec-controls{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px}.rec-timer{font-family:Courier New,monospace;font-size:1.1rem;color:var(--accent,#8a2be2);font-weight:600}.rec-indicator{width:10px;height:10px;border-radius:50%;background:#e53935;animation:rec-blink 1s ease-in-out infinite}@keyframes rec-blink{0%,to{opacity:1}50%{opacity:.3}}.rec-download{margin-top:12px}.record-timer{font-size:1.6rem;font-weight:700;color:var(--text);font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.record-btns{display:flex;gap:12px}.btn-record{padding:10px 28px;border-radius:var(--radius);border:none;background:var(--danger,#e74c3c);color:#fff;font-weight:600;cursor:pointer;font-size:.95rem;transition:opacity .2s}.btn-record:hover{opacity:.85}.btn-record-stop{padding:10px 28px;border-radius:var(--radius);border:none;background:var(--muted);color:#fff;font-weight:600;cursor:pointer;font-size:.95rem}.record-playback,.record-playback audio{width:100%}.record-form{display:flex;flex-direction:column;gap:10px}.record-input{padding:10px 14px;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface);color:var(--text);font-size:.9rem}.record-input:focus{outline:none;border-color:var(--primary)}@media (max-width:768px){.sound-lib-item{padding:8px 10px;gap:8px}.sound-lib-list{max-height:60vh}.record-modal,.sound-lib-list{-webkit-overflow-scrolling:touch}.record-modal{padding:20px;width:95%;max-height:90vh;overflow-y:auto}.hub-grid-4{grid-template-columns:repeat(2,1fr)}.sound-lib-filters{gap:6px}.sound-lib-filter{padding:8px 14px;min-height:40px}.sound-lib-preview{width:40px;height:40px}.sound-lib-toggle{width:44px;height:24px}.sound-lib-toggle:after{width:18px;height:18px;top:3px;left:22px}.sound-lib-toggle.off:after{left:3px}.sound-lib-search{padding:12px 14px;font-size:1rem}}@media (max-width:480px){.hub-grid-4{grid-template-columns:1fr}.sound-lib-type{display:none}.sound-lib-stats{flex-direction:column;gap:4px}}#platformShell{min-height:100dvh}#platformSidebar{height:100dvh}#platformMain,.app-section{overflow-x:hidden}@supports (padding:env(safe-area-inset-top)){.mobile-topbar{padding-top:max(12px,env(safe-area-inset-top));padding-left:max(16px,env(safe-area-inset-left));padding-right:max(16px,env(safe-area-inset-right))}#platformSidebar{padding-top:env(safe-area-inset-top,0)}#platformMain{padding-bottom:max(60px,calc(env(safe-area-inset-bottom) + 32px))}.demo-controls{padding-bottom:max(28px,calc(env(safe-area-inset-bottom) + 12px))}.story-overlay .story-header{padding-top:max(12px,env(safe-area-inset-top))}.toast-container{top:max(20px,calc(env(safe-area-inset-top) + 8px));right:max(20px,calc(env(safe-area-inset-right) + 8px))}}@media (max-width:768px){.modal-content{padding:24px 18px}.no-key-banner{flex-wrap:wrap;gap:8px}.dashboard-title{font-size:2rem}.dashboard-sub{font-size:.9rem}.use-case-card{padding:20px 16px;gap:8px}.demo-auto-btn,.demo-start-btn,.demo-stop-btn{padding:14px 24px;max-width:340px;width:90%}.story-header{padding:10px 14px}.story-title{font-size:1rem}}@media (max-width:480px){.modal-content{padding:18px 14px}.dashboard-title{font-size:1.6rem}.dashboard-hero{padding:20px 10px 16px}#platformMain{padding:14px 14px 48px}.section-header{flex-wrap:wrap;gap:8px}.cb-canvas{overflow:auto;min-height:260px;touch-action:pan-x pan-y}.mute-categories{flex-wrap:wrap;justify-content:flex-start;gap:6px}.mute-cat-btn{font-size:.78rem;padding:6px 12px}.transcript-box{min-height:60px;max-height:100px;font-size:.88rem}.activity-log{font-size:.75em;max-height:100px}.story-context-actions{flex-direction:column;align-items:stretch}.story-context-actions .btn-primary,.story-context-actions .btn-secondary{width:100%;margin:0}.sound-lib-name{font-size:.82rem}.hub-how-it-works{padding:0 8px}.demo-selector{padding:20px 16px;width:95%}.session-stats{padding:8px 10px;gap:6px}.stat-value{font-size:1.1em}.stat-label{font-size:.62em}.wyo-cue-keyword{min-width:0}#visualizer{height:120px}.visualizer-section{min-height:160px;padding:16px}}@media (max-width:360px){.dashboard-title{font-size:1.4rem}.modal-content{padding:14px 12px;font-size:.92rem}.sidebar-nav-item{padding:9px 14px;font-size:.82rem}.btn-start,.btn-stop{font-size:.95rem;padding:14px 12px}#platformMain{padding:10px 10px 40px}.use-case-card{padding:16px 12px}.section-header h2,.use-case-title{font-size:1rem}}@media (pointer:coarse){.sidebar-nav-item{min-height:44px}.sidebar-action-btn,.sidebar-reset-key{min-height:36px;min-width:44px}.back-to-hub,.back-to-sub{min-height:44px;padding:10px 18px}.cb-tab{min-height:40px;padding:8px 14px}.sound-lib-filter{min-height:44px}.story-card-delete,.wyo-cue-delete,.wyo-cue-preview,.wyo-saved-item-delete{min-height:44px;min-width:44px}.cb-button-delete{width:28px;height:28px;display:flex}.cb-button .cb-button-delete{display:flex}}@media (max-width:900px) and (orientation:landscape) and (max-height:500px){.mobile-topbar{padding-top:6px;padding-bottom:6px}#platformMain{padding-top:10px}.dashboard-hero{padding:12px 10px 10px}.visualizer-section{min-height:120px;padding:10px}#visualizer{height:80px}.controls{gap:8px}.btn-start,.btn-stop{padding:10px 20px;font-size:1rem}}.landing{min-height:100vh;background:#0a0a0a;color:#e0e0e0;font-family:var(--font-body,system-ui,sans-serif)}.landing-nav{display:flex;align-items:center;justify-content:space-between;padding:20px 40px;max-width:1200px;margin:0 auto}.landing-brand{font-size:1.5rem;font-weight:700;background:linear-gradient(135deg,#8a2be2,#03dac6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.landing-nav-cta{padding:8px 20px;border:1px solid #8a2be2;border-radius:8px;color:#bb86fc;text-decoration:none;font-size:.9rem;transition:all .3s}.landing-nav-cta:hover{background:rgba(138,43,226,.15)}.landing-hero{padding-bottom:80px;background:radial-gradient(ellipse at 50% 0,rgba(138,43,226,.15) 0,transparent 70%)}.landing-hero-content{text-align:center;max-width:720px;margin:0 auto;padding:60px 20px 0}.landing-h1{font-size:clamp(2rem,5vw,3.5rem);font-weight:800;line-height:1.15;margin-bottom:20px;background:linear-gradient(135deg,#fff 30%,#bb86fc);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.landing-tagline{font-size:1.15rem;color:#aaa;line-height:1.6;margin-bottom:36px}.landing-hero-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.landing-btn-primary{padding:14px 32px;background:linear-gradient(135deg,#8a2be2,#bb86fc);border:none;border-radius:12px;color:#fff;font-size:1.05rem;font-weight:600;text-decoration:none;cursor:pointer;transition:transform .2s,box-shadow .3s}.landing-btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(138,43,226,.4)}.landing-btn-secondary{padding:14px 32px;background:transparent;border:2px solid #444;border-radius:12px;color:#e0e0e0;font-size:1.05rem;text-decoration:none;cursor:pointer;transition:border-color .3s,color .3s}.landing-btn-secondary:hover{border-color:#bb86fc;color:#bb86fc}.landing-features{max-width:1100px;margin:0 auto;padding:80px 20px}.landing-section-title{text-align:center;font-size:2rem;font-weight:700;margin-bottom:48px;color:#fff}.landing-feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));grid-gap:24px;gap:24px}.landing-feature-card{padding:28px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.06);border-radius:16px;transition:border-color .3s,transform .2s}.landing-feature-card:hover{border-color:rgba(138,43,226,.4);transform:translateY(-4px)}.landing-feature-icon{color:#bb86fc;margin-bottom:16px}.landing-feature-card h3{font-size:1.15rem;margin-bottom:8px;color:#fff}.landing-feature-card p{color:#999;line-height:1.6;font-size:.95rem}.landing-how{max-width:900px;margin:0 auto;padding:80px 20px}.landing-steps{display:flex;gap:32px;justify-content:center;flex-wrap:wrap}.landing-step{flex:1 1;min-width:200px;max-width:260px;text-align:center}.landing-step-num{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#8a2be2,#03dac6);color:#fff;font-size:1.3rem;font-weight:700;margin-bottom:16px}.landing-step h3{font-size:1.1rem;margin-bottom:8px;color:#fff}.landing-step p{color:#999;font-size:.9rem;line-height:1.5}.landing-usecases{max-width:1100px;margin:0 auto;padding:80px 20px}.landing-usecase-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));grid-gap:24px;gap:24px}.landing-usecase{padding:32px;background:rgba(138,43,226,.06);border:1px solid rgba(138,43,226,.2);border-radius:16px;text-align:center}.landing-usecase h3{font-size:1.15rem;margin-bottom:8px;color:#bb86fc}.landing-usecase p{color:#999;font-size:.95rem;line-height:1.5}.landing-cta{text-align:center;padding:80px 20px;background:radial-gradient(ellipse at 50% 100%,rgba(138,43,226,.12) 0,transparent 70%)}.landing-cta h2{font-size:1.8rem;margin-bottom:28px;color:#fff}.landing-footer{text-align:center;padding:24px;color:#666;font-size:.85rem;border-top:1px solid rgba(255,255,255,.06)}@media (max-width:600px){.landing-nav{padding:16px 20px}.landing-hero-content{padding:40px 16px 0}.landing-steps{flex-direction:column;align-items:center}}.btn-read-aloud{margin-top:8px;padding:10px 20px;background:rgba(3,218,198,.1);border:2px solid #03dac6;border-radius:12px;color:#03dac6;font-size:.95rem;cursor:pointer;transition:all .3s}.btn-read-aloud:hover{background:rgba(3,218,198,.2);transform:translateY(-1px)}.btn-read-aloud:disabled{opacity:.5;cursor:not-allowed;transform:none}