*{margin:0;padding:0;box-sizing:border-box}:root{--primary-color: #5d0d18;--primary-hover: #4b0a13;--on-primary: #fff9eb;--sub-color: #9fb2ac;--sub-hover: #8ea39d;--secondary-color: #fffdf6;--text-color: #1b1b1b;--text-muted: #55615c;--bg-color: #fff9eb;--bg-secondary: #fffdf6;--error-color: #ef4444;--success-color: var(--sub-color);--border-color: #d8d1bf;--border-radius: 8px;--spacing: 1rem;--transition: all .2s ease}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bg-color);color:var(--text-color);line-height:1.6}.layout{min-height:100vh;display:flex;flex-direction:column}.header{background-color:var(--secondary-color);padding:var(--spacing);box-shadow:0 2px 10px #0000000f;border-bottom:1px solid var(--border-color)}.header-content{max-width:1200px;margin:0 auto}.title{font-size:1.5rem;font-weight:600;color:var(--primary-color)}.title-link{color:var(--primary-color);text-decoration:none;transition:var(--transition)}.title-link:hover{color:var(--primary-hover)}.main-content{flex:1;max-width:1200px;width:100%;margin:0 auto;padding:calc(var(--spacing) * 2)}.footer{background-color:var(--secondary-color);padding:calc(var(--spacing) * 2);text-align:center;margin-top:auto;border-top:1px solid var(--border-color)}.footer-content{max-width:1200px;margin:0 auto;display:flex;flex-direction:column;gap:var(--spacing)}.footer-section{display:flex;justify-content:center;align-items:center}.footer-nav{display:flex;gap:calc(var(--spacing) * 2);justify-content:center;flex-wrap:wrap}.footer-link{color:var(--text-muted);text-decoration:none;font-size:.875rem;transition:var(--transition)}.footer-link:hover{color:var(--primary-color)}.footer-copyright{font-size:.75rem;color:var(--text-muted)}.footer-text{font-size:.875rem;color:var(--text-muted)}.video-player{margin-bottom:calc(var(--spacing) * 2)}.video-player-empty,.video-player-error{text-align:center;padding:calc(var(--spacing) * 4);background-color:var(--secondary-color);border-radius:var(--border-radius)}.empty-state-content{display:flex;flex-direction:column;align-items:center;gap:calc(var(--spacing) * 1.5);max-width:500px;margin:0 auto}.empty-icon{width:80px;height:80px;color:var(--primary-color);opacity:.8}.empty-title{font-size:1.5rem;font-weight:600;color:var(--text-color);margin:0}.empty-message,.error-message{font-size:1rem;color:var(--text-muted);margin:0;line-height:1.6}.empty-actions{display:flex;gap:var(--spacing);margin-top:var(--spacing)}.empty-action-button{padding:.75rem 1.5rem;border:none;border-radius:var(--border-radius);font-size:1rem;font-weight:600;text-decoration:none;cursor:pointer;transition:var(--transition);display:inline-block}.empty-action-button.primary{background-color:var(--primary-color);color:var(--on-primary)}.empty-action-button.primary:hover{background-color:var(--primary-hover)}.empty-action-button.secondary{background-color:transparent;color:var(--primary-color);border:2px solid var(--primary-color)}.empty-action-button.secondary:hover{background-color:#5d0d1814}.empty-hint{color:var(--text-muted)}.video-player-error-banner{background-color:var(--error-color);padding:var(--spacing);border-radius:var(--border-radius);margin-bottom:var(--spacing)}.error-text{text-align:center;font-weight:500}.video-player-container{position:relative;width:100%;max-width:854px;margin:0 auto;aspect-ratio:16 / 9;background-color:#000;border-radius:var(--border-radius);overflow:hidden}.youtube-player{width:100%;height:100%}.queue-title-display{margin-bottom:calc(var(--spacing) * 2);text-align:center}.queue-title{font-size:1.5rem;font-weight:600;color:var(--text-color);margin:0;padding:var(--spacing);background:linear-gradient(135deg,#5d0d1814,#9fb2ac2e);border-radius:var(--border-radius);border-left:4px solid var(--primary-color)}.video-info{margin-top:var(--spacing);padding:var(--spacing);background-color:var(--secondary-color);border-radius:var(--border-radius)}.video-title{font-size:1.125rem;margin-bottom:.5rem}.video-author{color:#aaa;font-size:.875rem;margin-bottom:.5rem}.video-time{color:#888;font-size:.875rem}.video-controls{background-color:var(--secondary-color);padding:var(--spacing);border-radius:var(--border-radius)}.video-position{display:flex;justify-content:space-between;align-items:center;margin-bottom:var(--spacing);font-size:1rem;font-weight:500}.completion-badge{background-color:var(--success-color);padding:.25rem .5rem;border-radius:4px;font-size:.875rem}.control-buttons{display:flex;gap:var(--spacing);justify-content:center;margin-bottom:var(--spacing)}.control-button{padding:.75rem 1.5rem;background-color:var(--primary-color);color:var(--on-primary);border:none;border-radius:var(--border-radius);cursor:pointer;font-size:1rem;font-weight:500;transition:opacity .2s}.control-button:hover:not(:disabled){opacity:.8}.control-button:disabled{background-color:#555;cursor:not-allowed;opacity:.5}.video-queue-preview{display:flex;gap:.5rem;overflow-x:auto;padding:var(--spacing) 0}.queue-item{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.5rem;background-color:var(--bg-secondary);border:2px solid transparent;border-radius:var(--border-radius);cursor:pointer;transition:var(--transition);white-space:nowrap;min-width:100px}.queue-item:hover{background-color:var(--border-color)}.queue-item.active{background-color:var(--primary-color);border-color:var(--primary-color);color:var(--on-primary)}.queue-item-thumbnail{width:80px;height:45px;object-fit:cover;border-radius:4px}.queue-item-number{font-weight:600;font-size:.875rem}.queue-item-title{font-size:.75rem;max-width:100px;overflow:hidden;text-overflow:ellipsis;text-align:center}.completion-message{text-align:center;padding:var(--spacing);background-color:var(--success-color);border-radius:var(--border-radius);margin-top:var(--spacing)}.completion-text{font-size:1.125rem;margin-bottom:var(--spacing)}.restart-button{padding:.75rem 1.5rem;background-color:var(--primary-color);color:var(--on-primary);border:none;border-radius:var(--border-radius);cursor:pointer;font-size:1rem;font-weight:600;transition:opacity .2s}.restart-button:hover{opacity:.9}.loading-spinner{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:calc(var(--spacing) * 2)}.spinner{width:40px;height:40px;border:4px solid var(--border-color);border-top-color:var(--primary-color);border-radius:50%;animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.loading-text{margin-top:var(--spacing);color:var(--text-muted)}.error-boundary{min-height:100vh;display:flex;align-items:center;justify-content:center;background-color:var(--bg-color)}.error-container{text-align:center;padding:calc(var(--spacing) * 3);background-color:var(--secondary-color);border-radius:var(--border-radius);max-width:500px}.error-title{font-size:1.5rem;margin-bottom:var(--spacing);color:var(--error-color)}.error-button{padding:.75rem 1.5rem;background-color:var(--primary-color);color:var(--text-color);border:none;border-radius:var(--border-radius);cursor:pointer;font-size:1rem;font-weight:500;transition:opacity .2s}.error-button:hover{opacity:.8}.edit-mode{text-align:center;padding:calc(var(--spacing) * 2)}.edit-mode p{margin-bottom:var(--spacing);font-size:1.125rem}.edit-mode pre{background-color:var(--secondary-color);padding:var(--spacing);border-radius:var(--border-radius);overflow-x:auto;text-align:left;font-size:.875rem}@media(max-width:768px){.title{font-size:1.25rem}.main-content{padding:var(--spacing)}.video-player-container{max-width:100%}.control-buttons{flex-direction:column}.control-button{width:100%}.queue-item-title{display:none}}.mode-switcher{display:flex;gap:.5rem;margin-top:1rem}.mode-button{padding:.5rem 1rem;background-color:var(--bg-color);color:var(--text-color);border:2px solid var(--border-color);border-radius:var(--border-radius);cursor:pointer;font-size:.875rem;font-weight:500;transition:var(--transition)}.mode-button:hover:not(:disabled){background-color:var(--bg-secondary);border-color:var(--primary-color)}.mode-button.active{background-color:var(--primary-color);border-color:var(--primary-color);color:var(--on-primary);cursor:default}.mode-button:disabled{opacity:.6;cursor:not-allowed}.video-editor{max-width:900px;margin:0 auto}.editor-header{text-align:center;margin-bottom:calc(var(--spacing) * 3)}.editor-title{font-size:2rem;margin-bottom:var(--spacing);color:var(--primary-color)}.editor-description{font-size:1rem;color:#aaa}.editor-content{display:flex;flex-direction:column;gap:calc(var(--spacing) * 2)}.editor-input-section,.editor-queue-section{background-color:var(--secondary-color);padding:calc(var(--spacing) * 2);border-radius:var(--border-radius)}.queue-title-input-wrapper{margin-bottom:calc(var(--spacing) * 2);padding-bottom:calc(var(--spacing) * 2);border-bottom:1px solid var(--border-color)}.queue-title-input-wrapper .input-label{display:block;font-size:.875rem;font-weight:500;color:#ddd;margin-bottom:.5rem}.queue-title-input{width:100%;padding:.75rem;background-color:var(--bg-color);color:var(--text-color);border:2px solid var(--border-color);border-radius:var(--border-radius);font-size:1rem;transition:var(--transition)}.queue-title-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #5d0d181f}.queue-title-input-wrapper .input-hint{margin-top:.5rem;font-size:.75rem;color:#888}.video-input-title{font-size:1.25rem;margin-bottom:calc(var(--spacing) * 1.5)}.video-input-form{display:flex;flex-direction:column;gap:var(--spacing)}.form-group{display:flex;flex-direction:column;gap:.5rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:var(--spacing)}.form-label{font-size:.875rem;font-weight:500;color:#ddd}.form-input{padding:.75rem;background-color:var(--bg-color);color:var(--text-color);border:2px solid var(--border-color);border-radius:var(--border-radius);font-size:1rem;transition:var(--transition)}.form-input:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #5d0d181f}.form-hint{font-size:.75rem;color:#888}.time-format-hint{margin-top:calc(var(--spacing) * .5);padding:.75rem;background-color:#9fb2ac40;border-left:3px solid var(--primary-color);border-radius:4px}.form-error{background-color:#f443361a;border:1px solid var(--error-color);border-radius:var(--border-radius);padding:var(--spacing)}.error-text{color:var(--error-color);font-size:.875rem}.form-submit{padding:.75rem 1.5rem;background-color:var(--primary-color);color:var(--on-primary);border:none;border-radius:var(--border-radius);font-size:1rem;font-weight:600;cursor:pointer;transition:opacity .2s}.form-submit:hover:not(:disabled){opacity:.9}.form-submit:disabled{opacity:.5;cursor:not-allowed}.video-queue-title{font-size:1.25rem;margin-bottom:calc(var(--spacing) * 1.5)}.video-queue-empty{text-align:center;padding:calc(var(--spacing) * 4)}.empty-message{font-size:1.25rem;margin-bottom:var(--spacing)}.empty-hint{color:#aaa}.video-queue-items{display:flex;flex-direction:column;gap:var(--spacing);margin-bottom:calc(var(--spacing) * 1.5)}.video-queue-item{display:grid;grid-template-columns:auto auto 120px 1fr auto;gap:var(--spacing);align-items:center;padding:var(--spacing);background-color:var(--bg-color);border-radius:var(--border-radius);transition:opacity .2s}.video-queue-item.dragging{opacity:.5}.video-queue-item-drag-handle{cursor:grab;font-size:1.25rem;color:#666;user-select:none;padding:.25rem}.video-queue-item-drag-handle:active{cursor:grabbing}.video-queue-item-number{font-weight:600;font-size:1rem;color:#888;min-width:2rem;text-align:center}.video-queue-item-thumbnail{width:120px;height:68px;object-fit:cover;border-radius:4px}.video-queue-item-info{display:flex;flex-direction:column;gap:.25rem}.video-queue-item-title{font-size:1rem;font-weight:500;color:var(--text-color)}.video-queue-item-duration{opacity:.8}.video-queue-item-author{font-size:.875rem;color:#aaa}.video-queue-item-time{font-size:.75rem;color:#888;cursor:pointer;padding:.25rem .5rem;border-radius:var(--border-radius);transition:background-color .2s;display:inline-flex;align-items:center;gap:.25rem}.video-queue-item-time:hover{background-color:#5d0d1814;color:var(--primary-color)}.time-edit-icon{font-size:.875rem;opacity:.6;transition:opacity .2s}.video-queue-item-time:hover .time-edit-icon{opacity:1}.video-queue-item-time-edit{display:flex;align-items:center;gap:.25rem}.time-edit-input{width:60px;padding:.25rem .5rem;font-size:.75rem;border:1px solid var(--primary-color);border-radius:var(--border-radius);background-color:var(--bg-color);color:var(--text-color)}.time-edit-input:focus{outline:none;box-shadow:0 0 0 2px #5d0d182e}.time-separator{color:#888;font-size:.75rem}.time-edit-save,.time-edit-cancel{padding:.25rem .5rem;font-size:.75rem;border:none;border-radius:var(--border-radius);cursor:pointer;transition:background-color .2s}.time-edit-save{background-color:var(--success-color);color:var(--text-color)}.time-edit-save:hover{background-color:var(--sub-hover)}.time-edit-cancel{background-color:#666;color:#fff}.time-edit-cancel:hover{background-color:#555}.video-queue-item-delete{padding:.5rem 1rem;background-color:transparent;color:var(--error-color);border:1px solid var(--error-color);border-radius:var(--border-radius);cursor:pointer;font-size:.875rem;transition:all .2s}.video-queue-item-delete:hover{background-color:var(--error-color);color:var(--text-color)}.video-queue-summary{padding-top:var(--spacing);border-top:1px solid var(--border-color)}.summary-text{font-size:.875rem;color:#aaa}.editor-actions{display:flex;gap:var(--spacing);justify-content:center;margin-top:calc(var(--spacing) * 2)}.editor-action-button{padding:1rem 2rem;border:none;border-radius:var(--border-radius);font-size:1rem;font-weight:600;cursor:pointer;transition:opacity .2s}.editor-action-button:hover{opacity:.9}.preview-button{background-color:var(--primary-color);color:var(--on-primary)}.share-button{background-color:var(--success-color);color:var(--text-color)}@media(max-width:768px){.form-row{grid-template-columns:1fr}.video-queue-item{grid-template-columns:auto auto 80px 1fr;grid-template-rows:auto auto}.video-queue-item-drag-handle,.video-queue-item-number{grid-row:1 / 3}.video-queue-item-thumbnail{width:80px;height:45px;grid-row:1 / 3}.video-queue-item-info{grid-column:4;grid-row:1}.video-queue-item-title{font-size:.95rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-queue-item-duration{display:none}.video-queue-item-delete{grid-column:4;grid-row:2;justify-self:start}.editor-actions,.mode-switcher{flex-direction:column}.footer-nav{flex-direction:column;gap:var(--spacing)}.landing-page .hero-actions{flex-direction:column}.landing-page .features-grid,.landing-page .steps-container{grid-template-columns:1fr}}.language-selector{display:inline-block}.language-select{padding:.5rem 1rem;background-color:var(--bg-color);color:var(--text-color);border:1px solid var(--border-color);border-radius:var(--border-radius);font-size:.875rem;cursor:pointer;transition:var(--transition)}.language-select:hover{border-color:var(--primary-color)}.language-select:focus{outline:none;border-color:var(--primary-color);box-shadow:0 0 0 3px #5d0d181f}.landing-page{width:100%}.hero-section{text-align:center;padding:calc(var(--spacing) * 6) calc(var(--spacing) * 2);background:linear-gradient(135deg,#9fb2acbf,#fff9eb);border-radius:var(--border-radius);margin-bottom:calc(var(--spacing) * 4);border:1px solid var(--border-color)}.hero-content{max-width:800px;margin:0 auto}.hero-title{font-size:3rem;font-weight:700;margin-bottom:var(--spacing);line-height:1.2;color:var(--primary-color)}.hero-subtitle{font-size:1.25rem;color:#1b1b1bbf;margin-bottom:calc(var(--spacing) * 3);line-height:1.6}.hero-actions{display:flex;flex-direction:column;gap:var(--spacing);justify-content:center;align-items:center}.hero-demo-actions{display:flex;gap:var(--spacing);justify-content:center;flex-wrap:wrap}.btn{padding:1rem 2rem;border:none;border-radius:var(--border-radius);font-size:1rem;font-weight:600;cursor:pointer;transition:var(--transition);text-decoration:none;display:inline-block}.btn-primary{background-color:var(--primary-color);color:var(--bg-color)}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 6px 18px #5d0d182e}.btn-secondary{background-color:transparent;color:var(--primary-color);border:2px solid var(--primary-color)}.btn-secondary:hover{background-color:#5d0d180f}.features-section{margin-bottom:calc(var(--spacing) * 4)}.features-section h2,.how-it-works-section h2,.cta-section h2{text-align:center;font-size:2rem;margin-bottom:calc(var(--spacing) * 3)}.features-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:calc(var(--spacing) * 2);margin-bottom:calc(var(--spacing) * 2)}.feature-card{background-color:var(--bg-secondary);padding:calc(var(--spacing) * 2);border-radius:var(--border-radius);border:1px solid var(--border-color);transition:var(--transition)}.feature-card:hover{border-color:var(--primary-color);transform:translateY(-4px);box-shadow:0 10px 26px #5d0d1824}.feature-icon{font-size:2.5rem;margin-bottom:var(--spacing)}.feature-title{font-size:1.25rem;font-weight:600;margin-bottom:.5rem}.feature-description{color:var(--text-muted);line-height:1.6}.how-it-works-section{margin-bottom:calc(var(--spacing) * 4)}.steps-container{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:calc(var(--spacing) * 3)}.step{text-align:center;position:relative}.step-number{width:60px;height:60px;background:linear-gradient(135deg,var(--primary-color) 0%,var(--primary-hover) 100%);color:var(--on-primary);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem;font-weight:700;margin:0 auto calc(var(--spacing) * 1.5)}.step-title{font-size:1.25rem;font-weight:600;margin-bottom:.5rem}.step-description{color:var(--text-muted);line-height:1.6}.cta-section{text-align:center;padding:calc(var(--spacing) * 4);background:linear-gradient(135deg,#9fb2ac47,#5d0d180f);border-radius:var(--border-radius);border:1px solid var(--border-color)}.cta-title{font-size:2rem;margin-bottom:var(--spacing)}.cta-subtitle{font-size:1.125rem;color:var(--text-muted);margin-bottom:calc(var(--spacing) * 2)}.btn-large{padding:1.25rem 3rem;font-size:1.125rem}.legal-page{max-width:800px;margin:0 auto}.legal-title{font-size:2.5rem;font-weight:700;margin-bottom:calc(var(--spacing) * 3);text-align:center;color:var(--primary-color)}.legal-content{background-color:var(--bg-secondary);padding:calc(var(--spacing) * 3);border-radius:var(--border-radius);border:1px solid var(--border-color);line-height:1.8}.legal-content h2{font-size:1.5rem;font-weight:600;margin-top:calc(var(--spacing) * 2);margin-bottom:var(--spacing);color:var(--text-color)}.legal-content h2:first-child{margin-top:0}.legal-content p{margin-bottom:var(--spacing);color:var(--text-muted)}.legal-content a{color:var(--primary-color);text-decoration:none;transition:var(--transition)}.legal-content a:hover{color:var(--primary-hover);text-decoration:underline}.legal-content ul{margin:var(--spacing) 0;padding-left:calc(var(--spacing) * 2)}.legal-content li{margin-bottom:.5rem;color:var(--text-muted)}.contact-methods{display:flex;flex-direction:column;gap:var(--spacing);margin:calc(var(--spacing) * 2) 0}.contact-method{display:flex;align-items:center;gap:var(--spacing);padding:var(--spacing);background-color:var(--bg-color);border-radius:var(--border-radius);border:1px solid var(--border-color)}.contact-method-icon{font-size:1.5rem}.contact-method-content{flex:1}.contact-method-label{font-weight:600;margin-bottom:.25rem}.contact-method-value{color:var(--primary-color)}