body{margin:0;font-family:var(--app-font, -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:#f5f5f5}#root{width:100%;height:100vh}html,body,#root{margin:0!important;padding:0!important;width:100%!important;height:100%!important;overflow:hidden!important}html body #root .app{width:100vw!important;height:100vh!important;display:flex!important;flex-direction:column!important;background:#f5f5f5!important;position:relative!important}html body #root .app-header{background:linear-gradient(135deg,#667eea,#764ba2)!important;color:#fff!important;padding:.75rem 1rem!important;display:flex!important;align-items:center!important;justify-content:space-between!important;box-shadow:0 2px 8px #667eea4d!important;position:relative!important;z-index:100!important;min-height:3rem!important}html body #root .main-layout{display:grid!important;grid-template-columns:1fr 1.5fr 1fr!important;gap:.75rem!important;padding:.75rem!important;flex:1!important;overflow-y:auto!important;overflow-x:hidden!important;height:calc(100vh - 4rem)!important}html body #root .left-panel,html body #root .right-panel,html body #root .center-panel>*{background:#fff!important;border-radius:.5rem!important;box-shadow:0 2px 8px #00000014!important;padding:.75rem!important;overflow:visible!important}html body #root .center-panel{display:flex!important;flex-direction:column!important;gap:.75rem!important;overflow:visible!important}html body #root .left-panel,html body #root .right-panel,html body #root .center-panel{min-width:0!important}html body #root button{background:linear-gradient(135deg,#667eea,#764ba2)!important;color:#fff!important;border:none!important;padding:.5rem 1rem!important;border-radius:.375rem!important;cursor:pointer!important;font-weight:500!important;transition:all .2s ease!important;box-shadow:0 2px 4px #667eea33!important}html body #root button:hover{transform:translateY(-2px)!important;box-shadow:0 4px 12px #667eea4d!important}html body #root .timer-display{font-size:3.5rem!important;font-weight:700!important;background:linear-gradient(135deg,#667eea,#764ba2)!important;-webkit-background-clip:text!important;-webkit-text-fill-color:transparent!important;background-clip:text!important;text-align:center!important;margin:1rem 0!important}html body #root .participant-item,html body #root .queue-item{background:#f8f9fa!important;border-radius:.375rem!important;padding:.5rem!important;margin-bottom:.5rem!important;transition:all .2s ease!important;border:1px solid transparent!important}html body #root .participant-item:hover,html body #root .queue-item:hover{background:#fff!important;border-color:#667eea!important;transform:translate(4px)!important;box-shadow:0 2px 6px #667eea1a!important}html body #root .participant-item.speaking{background:linear-gradient(90deg,#e8f5e9,#fff)!important;border-left:4px solid #4caf50!important}html body #root .participant-item.queued{background:linear-gradient(90deg,#fff3e0,#fff)!important;border-left:4px solid #ff9800!important}html body #root .avatar-placeholder,html body #root .avatar-placeholder-small{background:linear-gradient(135deg,#667eea,#764ba2)!important;color:#fff!important;border-radius:50%!important;display:flex!important;align-items:center!important;justify-content:center!important;font-weight:600!important}html body #root .timer-progress{background:#e3e8f0!important;border-radius:4px!important;overflow:hidden!important;height:8px!important}html body #root .timer-progress-bar{background:linear-gradient(90deg,#667eea,#764ba2)!important;height:100%!important;transition:width 1s linear!important}@media(max-width:1024px){html body #root .main-layout{grid-template-columns:1fr!important;grid-template-rows:auto auto auto!important}}html body #root h1,html body #root h2,html body #root h3{color:#2c3e50!important;margin:0!important;padding:0!important}html body #root .app-header h1{color:#fff!important}html body #root input[type=text],html body #root input[type=number]{border:1px solid #ddd!important;border-radius:.375rem!important;padding:.5rem!important;background:#fff!important;color:#2c3e50!important}html body #root input:focus{outline:none!important;border-color:#667eea!important;box-shadow:0 0 0 3px #667eea1a!important}html body #root .empty-queue{color:#9ca3af!important;text-align:center!important;padding:2rem!important;font-style:italic!important}html body #root .dev-mode-badge{background:#ffffff40!important;padding:.25rem .75rem!important;border-radius:1rem!important;font-size:.75rem!important;font-weight:500!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important}.collapsible-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;cursor:pointer;-webkit-user-select:none;user-select:none;text-align:left}.collapsible-title{display:flex;align-items:center;gap:.4rem;font-size:.875rem;color:#333;margin:0}.collapsible-caret{font-size:.7rem;color:#667eea;width:.9rem;flex-shrink:0;display:inline-block}.collapsible-actions{display:flex;gap:.25rem;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end}.collapsible-body{margin-top:.5rem}body #root .participant-list,html body #root .participant-list{height:100%!important;display:flex!important;flex-direction:column!important}.participant-list h2{font-size:.875rem;margin-bottom:.5rem;color:#333}.manual-add-container{margin-bottom:.75rem}.participant-actions{display:flex;gap:.25rem}.manual-add-button{flex:1;padding:.5rem;background:#2196f3;color:#fff;border:none;border-radius:.25rem;cursor:pointer;font-size:.875rem;font-weight:500}.roster-refresh-button{padding:.5rem .625rem;background:#eceff1;color:#37474f;border:1px solid #cfd8dc;border-radius:.25rem;cursor:pointer;font-size:.813rem;font-weight:500;white-space:nowrap}.roster-refresh-button:hover{background:#cfd8dc}.manual-add-button:hover{background:#1976d2}.manual-add-form{display:flex;gap:.25rem}.manual-add-input{flex:1;padding:.5rem;border-radius:.25rem;border:1px solid #ddd;background:#fff;color:#333;font-size:.875rem}.manual-add-submit{padding:.5rem 1rem;background:#4caf50;color:#fff;border:none;border-radius:.25rem;cursor:pointer;font-size:.875rem}.manual-add-submit:hover{background:#45a049}.manual-add-cancel{padding:.5rem 1rem;background:#666;color:#fff;border:none;border-radius:.25rem;cursor:pointer;font-size:.875rem}.manual-add-cancel:hover{background:#555}.participant-items{display:flex;flex-direction:column;gap:.25rem}body #root .participant-item,html body #root .participant-item{display:flex!important;align-items:center!important;justify-content:space-between!important;padding:.375rem!important;background:#f9f9f9!important;border-radius:.25rem!important;transition:all .2s!important;cursor:pointer!important}.participant-item.available:hover{background:#e8eaf6;transform:translate(4px)}body #root .participant-item.speaking,html body #root .participant-item.speaking{background:#e8f5e9!important;border-left:4px solid #4caf50!important}body #root .participant-item.queued,html body #root .participant-item.queued{background:#fff3e0!important;border-left:4px solid #ff9800!important;cursor:default!important}.participant-info{display:flex;align-items:center;gap:.5rem;flex:1}.participant-avatar,.avatar-placeholder{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center}.participant-avatar img{width:100%;height:100%;border-radius:50%;object-fit:cover}body #root .avatar-placeholder,html body #root .avatar-placeholder{background:linear-gradient(135deg,#667eea,#764ba2)!important;color:#fff!important;font-weight:600!important;font-size:.75rem!important}.participant-details{flex:1}.participant-name{font-weight:500;color:#333;font-size:.813rem;margin-bottom:.125rem;display:flex;align-items:center;gap:.25rem}.panelist-badge{color:#9c27b0;font-size:.625rem;font-weight:700;display:inline-flex;align-items:center;justify-content:center;margin-left:.125rem}.hand-raise-badge{background:#fff8e1;color:#f57f17;font-size:.625rem;font-weight:600;display:inline-flex;align-items:center;justify-content:center;padding:0 .25rem;border-radius:.25rem;margin-left:.25rem;border:1px solid #ffecb3;line-height:1.2}.participant-stats{display:flex;gap:.5rem;font-size:.625rem;color:#666}.stat-item{display:flex;gap:.25rem}.participant-status{display:flex;align-items:center;gap:.25rem}.manual-remove-button{background:transparent;color:#e53935;border:1.5px solid #e53935;border-radius:50%;width:20px;height:20px;font-size:.875rem;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}.manual-remove-button:hover{background:#e53935;color:#fff}.status-badge{padding:.125rem .375rem;border-radius:.25rem;font-size:.625rem;font-weight:500}.status-badge.speaking{background:#4caf50;color:#fff}.status-badge.queued{background:#ff9800;color:#fff}.status-badge.available{background:transparent;color:#667eea;font-size:1rem;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border:1.5px solid #667eea;border-radius:50%}body #root .speaker-queue,html body #root .speaker-queue{background:#fff!important;border-radius:.25rem!important;box-shadow:0 1px 3px #0000001a!important;padding:.5rem!important;flex:1!important;display:flex!important;flex-direction:column!important}body #root .queue-header,html body #root .queue-header{display:flex!important;align-items:center!important;justify-content:space-between!important;margin-bottom:.5rem!important}.queue-header h2{font-size:.875rem;color:#333}.queue-actions{display:flex;gap:.25rem}.start-button{background:linear-gradient(135deg,#4caf50,#45a049)}.clear-button{background:linear-gradient(135deg,#f44336,#e91e63);padding:.25rem .5rem;font-size:.625rem}.grace-button{background:linear-gradient(135deg,#2196f3,#1976d2);padding:.25rem .5rem;font-size:.625rem;color:#fff;border:none;border-radius:.25rem;cursor:pointer;font-weight:600}.grace-button:hover{background:linear-gradient(135deg,#1976d2,#1565c0)}.end-turn-button{background:linear-gradient(135deg,#9c27b0,#673ab7);padding:.25rem .5rem;font-size:.625rem;color:#fff;border:none;border-radius:.25rem;cursor:pointer}.add-hands-button{background:linear-gradient(135deg,#ffc107,#ff9800);padding:.25rem .5rem;font-size:.625rem;color:#fff;border:none;border-radius:.25rem;cursor:pointer;font-weight:600}.add-hands-button:hover{background:linear-gradient(135deg,#ffb300,#fb8c00)}.end-topic-button{background:linear-gradient(135deg,#ff9800,#ff5722);padding:.25rem .5rem;font-size:.625rem;color:#fff;border:none;border-radius:.25rem;cursor:pointer}.empty-queue{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#999;text-align:center;padding:1rem;font-size:.75rem}.queue-hint{font-size:.688rem;margin-top:.25rem}body #root .queue-list,html body #root .queue-list{flex:1!important;overflow-y:auto!important;min-height:120px!important}.queue-list.dragging-over{background:#f0f0f0}body #root .queue-item,html body #root .queue-item{background:#f9f9f9!important;border-radius:.25rem!important;margin-bottom:.25rem!important;position:relative!important;transition:all .2s!important}.queue-item.dragging{opacity:.5}.queue-item-content{display:flex;align-items:center;padding:.375rem;gap:.5rem}.queue-position{width:24px;height:24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.688rem}.queue-participant{flex:1;display:flex;align-items:center;gap:.375rem;font-size:1.25rem}.queue-participant .participant-name{display:flex;align-items:center;gap:.25rem}.queue-participant .panelist-badge{color:#9c27b0;font-size:.625rem;margin-left:.125rem}.participant-avatar-small,.avatar-placeholder-small{width:24px;height:24px;border-radius:50%}.participant-avatar-small img{width:100%;height:100%;border-radius:50%;object-fit:cover}.avatar-placeholder-small{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:.625rem}.remove-button{width:22px;height:22px;background:transparent;color:#f44336;border:1px solid #f44336;border-radius:50%;padding:0;font-size:1rem;display:flex;align-items:center;justify-content:center}.remove-button:hover{background:#f44336;color:#fff}.next-speaker-badge{position:absolute;top:0;right:0;background:#4caf50;color:#fff;padding:.125rem .375rem;border-radius:0 .25rem;font-size:.5rem;font-weight:600;text-transform:uppercase}body #root .timer-container,html body #root .timer-container{background:#fff!important;border-radius:.25rem!important;box-shadow:0 1px 3px #0000001a!important;padding:.75rem!important;text-align:center!important}.current-speaker{margin-bottom:.75rem}.speaker-name{font-size:1.125rem;font-weight:600;color:#333;margin-bottom:.25rem}.speaker-quick-stats{font-size:.75rem;color:#666;display:flex;gap:.5rem;justify-content:center}body #root .timer-display,html body #root .timer-display{font-size:3rem!important;font-weight:700!important;font-variant-numeric:tabular-nums!important;margin:.5rem 0!important;transition:color .3s ease!important;line-height:1!important}body #root .timer-progress,html body #root .timer-progress{width:100%!important;height:6px!important;background:#e0e0e0!important;border-radius:3px!important;overflow:hidden!important;margin:.5rem 0 1rem!important}body #root .timer-progress-bar,html body #root .timer-progress-bar{height:100%!important;transition:width 1s linear,background-color .3s ease!important}.timer-button{padding:.5rem 1.5rem;font-size:.875rem}.end-turn{background:linear-gradient(135deg,#f44336,#e91e63)}.timer-settings{display:flex;align-items:center;justify-content:center;gap:.5rem}.timer-settings label{font-size:.75rem;color:#666}.timer-settings input{width:60px;padding:.25rem;border:1px solid #ddd;border-radius:.25rem;font-size:.875rem}.timer-settings span{font-size:.75rem;color:#666}.timer-warning{margin-top:.5rem;padding:.25rem .5rem;background:#fff3e0;color:#f57c00;border-radius:.25rem;font-size:.75rem;font-weight:500;animation:pulse 1s infinite}@keyframes pulse{0%{opacity:1}50%{opacity:.7}to{opacity:1}}body #root .statistics,html body #root .statistics{height:100%!important;display:flex!important;flex-direction:column!important}.stats-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:.5rem}.stats-header h2{font-size:.875rem;color:#333}.stats-actions{display:flex;gap:.25rem}.export-button{background:linear-gradient(135deg,#4caf50,#45a049);padding:.25rem .5rem;font-size:.625rem}.reset-button{background:linear-gradient(135deg,#ff5722,#f44336);padding:.25rem .5rem;font-size:.625rem}.no-stats{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#999;text-align:center;padding:1rem;font-size:.75rem}.stats-hint{font-size:.688rem;margin-top:.25rem}body #root .stats-summary,html body #root .stats-summary{display:grid!important;grid-template-columns:1fr!important;gap:.375rem!important;margin-bottom:.75rem!important}body #root .summary-item,html body #root .summary-item{padding:.375rem!important;background:linear-gradient(135deg,#667eea14,#764ba214)!important;border-radius:.25rem!important;display:flex!important;justify-content:space-between!important;align-items:center!important}.summary-label{font-size:.688rem;color:#666}.summary-value{font-size:.875rem;font-weight:600;color:#667eea}.speaker-stats-list h3{font-size:.75rem;margin-bottom:.5rem;color:#333}.stats-list{display:flex;flex-direction:column;gap:.375rem;overflow-y:auto;max-height:250px}.stat-item{padding:.375rem;background:#f9f9f9;border-radius:.25rem;position:relative;overflow:hidden;transition:background-color .3s ease,border-color .3s ease}.stat-item.speaking{background:linear-gradient(135deg,#4caf501a,#8bc34a1a);border-left:3px solid #4caf50}.speaking-indicator{color:#4caf50;font-weight:500;font-size:.625rem}.stat-name{font-weight:600;color:#333;margin-bottom:.25rem;font-size:.688rem}.stat-details{display:grid;grid-template-columns:repeat(2,1fr);gap:.25rem;margin-bottom:.25rem}.stat-row{display:flex;justify-content:space-between;font-size:.625rem}.stat-label{color:#666}.stat-value{font-weight:500;color:#333}.stat-bar{width:100%;height:3px;background:#e0e0e0;border-radius:2px;overflow:hidden;margin-top:.25rem}.stat-bar-fill{height:100%;background:linear-gradient(90deg,#667eea,#764ba2);transition:width .5s ease}.settings-container{background:#fff;border-radius:.25rem;box-shadow:0 1px 3px #0000001a;padding:.75rem;margin-top:.5rem}.settings-container h3{font-size:.875rem;margin-bottom:.75rem;color:#333}.settings-section{margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid #e0e0e0}.settings-section:last-child{border-bottom:none}.settings-label{display:block;font-size:.75rem;font-weight:600;color:#666;margin-bottom:.5rem}.time-presets{display:flex;gap:.25rem;margin-bottom:.5rem}.font-presets{display:flex;flex-wrap:wrap;gap:.25rem}.font-controls+.font-controls{margin-top:.75rem;padding-top:.75rem;border-top:1px dashed #e0e0e0}.settings-sublabel{margin-top:.6rem}.reset-appearance-button{margin-top:.6rem;padding:.25rem .5rem;font-size:.688rem;background:#f0f0f0;color:#666;border:1px solid #ddd}.reset-appearance-button:hover{background:#e0e0e0}.how-to-link{color:#667eea;text-decoration:none;font-weight:600}.how-to-link:hover{text-decoration:underline}.preset-button{padding:.25rem .5rem;font-size:.688rem;background:#f0f0f0;color:#666;border:1px solid #ddd}.preset-button:hover{background:#e0e0e0}.preset-button.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-color:#667eea}.custom-time{display:flex;align-items:center;gap:.75rem}.time-slider{flex:1;height:4px;background:#e0e0e0;outline:none;-webkit-appearance:none}.time-slider::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:16px;height:16px;background:linear-gradient(135deg,#667eea,#764ba2);cursor:pointer;border-radius:50%}.time-slider::-moz-range-thumb{width:16px;height:16px;background:linear-gradient(135deg,#667eea,#764ba2);cursor:pointer;border-radius:50%;border:none}.time-display{min-width:60px;text-align:center}.current-time{font-size:.875rem;font-weight:600;color:#667eea}.toggle-container{display:flex;align-items:center;gap:.75rem}.toggle-switch{position:relative;display:inline-block;width:40px;height:22px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background-color:#ccc;transition:.3s;border-radius:22px}.toggle-slider:before{position:absolute;content:"";height:16px;width:16px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}input:checked+.toggle-slider{background:linear-gradient(135deg,#667eea,#764ba2)}input:checked+.toggle-slider:before{transform:translate(18px)}.toggle-label{font-size:.688rem;color:#666}.settings-info{margin-top:.75rem;padding-top:.75rem;border-top:1px solid #e0e0e0}.settings-info p{font-size:.625rem;color:#888;margin:.25rem 0}.overlay-mode-selector{display:flex;gap:.25rem;background:#f0f0f0;border-radius:.25rem;padding:.125rem}.mode-button{flex:1;padding:.375rem .75rem;font-size:.688rem;font-weight:600;background:transparent;color:#666;border:none;border-radius:.2rem;cursor:pointer;transition:all .2s ease}.mode-button:hover{background:#ffffff80}.mode-button.active{background:#fff;color:#667eea;box-shadow:0 1px 3px #0000001a}*{margin:0;padding:0;box-sizing:border-box}#root{font-family:var(--app-font, -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:#f5f5f5;width:100%;height:100vh}.app{min-height:100vh;display:flex;flex-direction:column;background:#f5f5f5}.app-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:.5rem 1rem;box-shadow:0 2px 4px #0000001a;display:flex;align-items:center;justify-content:space-between}.app-header h1{font-size:1rem;font-weight:600;color:#fff;margin:0}.dev-mode-badge{background:#fff3;padding:.25rem .75rem;border-radius:1rem;font-size:.875rem}.overlay-mode-selector-header{display:flex;gap:.125rem;background:#ffffff26;border-radius:.375rem;padding:.125rem}.mode-button-header{padding:.25rem .5rem;font-size:.688rem;font-weight:600;background:transparent;color:#ffffffe6;border:none;border-radius:.25rem;cursor:pointer;transition:all .2s ease}.mode-button-header:hover{background:#fff3}.mode-button-header.active{background:#fffffff2;color:#667eea;box-shadow:0 1px 3px #0003}.main-layout{flex:1;display:flex;gap:.5rem;padding:.5rem;max-width:100%;margin:0 auto;width:100%}.left-panel,.right-panel{flex:1;min-width:0;background:#fff;border-radius:.25rem;box-shadow:0 1px 3px #0000001a;padding:.5rem}.center-panel{flex:1.2;min-width:0;display:flex;flex-direction:column;gap:.5rem}button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:.25rem .5rem;border-radius:.25rem;cursor:pointer;font-size:.75rem;font-weight:500;transition:all .2s}button:hover{transform:translateY(-1px);box-shadow:0 4px 8px #0003}button:active{transform:translateY(0)}button:disabled{opacity:.5;cursor:not-allowed}@media(max-width:1024px){.main-layout{flex-direction:column}.left-panel,.right-panel,.center-panel{max-height:none}}.header-controls{display:flex!important;gap:.5rem!important;align-items:center!important}.timing-badge{background:#ff9800!important;color:#fff!important;padding:.125rem .5rem!important;border-radius:.25rem!important;font-size:.625rem!important;font-weight:700!important}.btn-small{font-size:.625rem!important;padding:.25rem .5rem!important;background:#666!important;color:#fff!important;border:none!important;border-radius:.25rem!important;cursor:pointer!important;min-width:5.75rem!important;text-align:center!important}.btn-active{background:#4caf50!important}.btn-inactive{background:#666!important}.error-text{font-size:.5rem!important;color:#ff9800!important;margin-left:.5rem!important}.sdk-status{margin-top:.5rem;padding:.25rem .375rem;font-size:.625rem;color:#666;background:#f0f0f0;border-radius:.25rem;word-break:break-word}.debug-panel{position:fixed!important;bottom:0!important;left:0!important;right:0!important;background:#333!important;color:#0f0!important;padding:10px!important;font-size:12px!important;font-family:monospace!important;border-top:1px solid #555!important;max-height:200px!important;overflow:auto!important;z-index:9999!important}.debug-error{color:red!important}