.error-boundary{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-lg);background:var(--bg-base)}.error-boundary__card{text-align:center;max-width:420px}.error-boundary__icon{font-size:48px;margin-bottom:var(--space-md)}.error-boundary__title{font-size:24px;font-weight:800;margin-bottom:var(--space-sm)}.error-boundary__text{color:var(--text-secondary);font-size:15px;margin-bottom:var(--space-lg);line-height:1.6}.error-boundary__btn{padding:12px 28px;background:var(--color-primary);color:#fff;border-radius:var(--radius-sm);font-weight:700;font-size:15px;transition:background var(--transition-fast)}.error-boundary__btn:hover{background:var(--color-primary-dark)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-sm);border-radius:var(--radius-sm);font-weight:700;transition:all var(--transition-fast);white-space:nowrap}.btn:disabled{opacity:.5;cursor:not-allowed}.btn--primary{background:var(--color-primary);color:#fff}.btn--primary:hover:not(:disabled){background:var(--color-primary-dark)}.btn--outline{background:transparent;border:1px solid var(--color-primary);color:var(--color-primary)}.btn--outline:hover:not(:disabled){background:var(--color-primary);color:#fff}.btn--sm{padding:8px 16px;font-size:13px;border-radius:var(--radius-sm)}.btn--md{padding:12px 24px;font-size:15px;border-radius:var(--radius-sm)}.btn--lg{padding:16px 36px;font-size:17px;border-radius:10px}.btn--full{width:100%}.home{min-height:100vh;display:flex;flex-direction:column;background:radial-gradient(ellipse at 60% 0%,rgba(255,111,0,.1) 0%,transparent 60%)}.home__nav{padding:var(--space-md) var(--space-xl)}.home__logo{font-size:22px;font-weight:800;color:var(--color-primary)}.home__logo span{color:var(--text-primary)}.home__hero{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:var(--space-xl) var(--space-lg);max-width:640px;margin:0 auto}.home__badge{display:inline-block;background:#ff6f0026;border:1px solid var(--border-primary);color:var(--color-primary);padding:6px 16px;border-radius:var(--radius-full);font-size:13px;font-weight:700;margin-bottom:var(--space-lg)}.home__title{font-size:44px;font-weight:800;line-height:1.2;margin-bottom:var(--space-md)}.home__highlight{background:linear-gradient(135deg,var(--color-primary),var(--color-primary-light));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.home__subtitle{font-size:17px;color:var(--text-secondary);line-height:1.6;margin-bottom:var(--space-xl)}@media (max-width: 600px){.home__title{font-size:30px}}.select-field{display:flex;flex-direction:column;gap:var(--space-xs)}.select-field__label{font-size:14px;font-weight:700;color:var(--text-secondary)}.select-field__required{color:var(--color-primary)}.select-field__input{padding:12px 14px;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);font-size:15px;transition:border-color var(--transition-fast)}.select-field__input:focus{outline:none;border-color:var(--color-primary)}.select-field__input:disabled{opacity:.4;cursor:not-allowed}.select-field__input option{background:var(--bg-base);color:var(--text-primary)}.text-field{display:flex;flex-direction:column;gap:var(--space-xs)}.text-field__label{font-size:14px;font-weight:700;color:var(--text-secondary)}.text-field__optional{font-weight:400;color:var(--text-muted)}.text-field__input{padding:12px 14px;background:var(--bg-surface);border:1px solid var(--border-subtle);border-radius:var(--radius-sm);color:var(--text-primary);font-size:15px;transition:border-color var(--transition-fast)}.text-field__input:focus{outline:none;border-color:var(--color-primary)}.text-field__input::placeholder{color:var(--text-muted)}.demo-setup{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:var(--space-lg);background:radial-gradient(ellipse at 50% 0%,rgba(255,111,0,.08) 0%,transparent 60%)}.demo-setup__card{width:100%;max-width:480px;background:var(--bg-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:var(--space-xl)}.demo-setup__title{font-size:26px;font-weight:800;margin-bottom:var(--space-xs)}.demo-setup__subtitle{font-size:14px;color:var(--text-secondary);margin-bottom:var(--space-xl)}.demo-setup__form{display:flex;flex-direction:column;gap:var(--space-md);margin-bottom:var(--space-xl)}@media (max-width: 480px){.demo-setup__card{padding:var(--space-lg)}}.whiteboard{display:flex;flex-direction:column;height:100%;background:#12162a}.whiteboard__header{padding:var(--space-md) var(--space-lg);border-bottom:1px solid var(--border-subtle)}.whiteboard__topic{font-size:13px;font-weight:700;color:var(--color-primary);text-transform:uppercase;letter-spacing:.5px}.whiteboard__canvas-placeholder{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-sm);color:var(--text-muted)}.whiteboard__placeholder-icon{font-size:40px;opacity:.5}.whiteboard__placeholder-text{font-size:14px}.classroom{display:flex;flex-direction:column;height:100vh;overflow:hidden;background:#0a0e1a}.classroom__header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;background:#ffffff08;border-bottom:1px solid var(--border-subtle);flex-shrink:0}.classroom__header-left{display:flex;align-items:center;gap:10px}.classroom__logo{font-size:18px;font-weight:800;color:var(--color-primary)}.classroom__logo span{color:#fff}.classroom__meta{font-size:13px;color:var(--text-secondary)}.classroom__meta strong{color:var(--text-primary)}.classroom__live-badge{display:flex;align-items:center;gap:6px;background:#4caf5026;border:1px solid rgba(76,175,80,.4);color:#4caf50;padding:4px 12px;border-radius:var(--radius-full);font-size:12px;font-weight:700}.classroom__live-dot{width:7px;height:7px;background:#4caf50;border-radius:50%;animation:pulse 1.4s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.3}}.classroom__main{flex:1;display:grid;grid-template-columns:200px 1fr 220px;min-height:0;overflow:hidden}.classroom__left{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:24px 16px;background:#ffffff05;border-right:1px solid var(--border-subtle);overflow:hidden}.classroom__avatar-circle{width:100px;height:100px;border-radius:50%;background:linear-gradient(135deg,#ff6f00,#ffb300);display:flex;align-items:center;justify-content:center;font-size:46px;box-shadow:0 0 0 4px #ff6f0026,0 0 32px #ff6f001a}.classroom__avatar-name{font-size:15px;font-weight:800;text-align:center}.classroom__avatar-status{display:flex;align-items:center;gap:6px;font-size:12px;color:#4caf50}.classroom__avatar-dot{width:7px;height:7px;background:#4caf50;border-radius:50%;animation:pulse 1.4s ease-in-out infinite}.classroom__avatar-subject{font-size:12px;color:var(--text-muted);text-align:center;line-height:1.5}.classroom__center{display:flex;flex-direction:column;background:#111827;overflow:hidden}.classroom__board-header{display:flex;align-items:center;justify-content:space-between;padding:10px 20px;border-bottom:1px solid rgba(255,255,255,.06);background:#ffffff05;flex-shrink:0}.classroom__board-label{font-size:12px;font-weight:700;color:var(--color-primary);text-transform:uppercase;letter-spacing:.5px}.classroom__board-tag{font-size:11px;background:#ffffff0f;padding:3px 10px;border-radius:var(--radius-full);color:var(--text-secondary)}.classroom__board-canvas{flex:1;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden}.classroom__board-grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:40px 40px}.classroom__board-placeholder{position:relative;z-index:1;text-align:center;color:#ffffff26}.classroom__board-placeholder-icon{font-size:52px;margin-bottom:12px}.classroom__board-placeholder-text{font-size:14px;font-family:var(--font-board)}.classroom__right{padding:24px 16px;background:#ffffff05;border-left:1px solid var(--border-subtle);overflow-y:auto}.classroom__progress-title{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:1px;color:var(--text-muted);margin-bottom:20px}.classroom__progress-list{list-style:none;display:flex;flex-direction:column;gap:6px}.classroom__progress-item{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:var(--radius-md);border:1px solid transparent;transition:all var(--transition-base);opacity:.45}.classroom__progress-item--active{opacity:1;background:#ff6f001a;border-color:#ff6f004d}.classroom__progress-item--done{opacity:1}.classroom__progress-bullet{width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:800;flex-shrink:0;background:#ffffff0f;border:1px solid rgba(255,255,255,.1);color:var(--text-secondary)}.classroom__progress-item--active .classroom__progress-bullet{background:var(--color-primary);border-color:var(--color-primary);color:#fff}.classroom__progress-item--done .classroom__progress-bullet{background:var(--color-success);border-color:var(--color-success);color:#fff}.classroom__progress-label{font-size:14px;font-weight:600;color:var(--text-primary)}.classroom__progress-item--active .classroom__progress-label{color:var(--color-primary)}.classroom__controls{display:flex;align-items:center;justify-content:center;gap:10px;padding:14px 20px;background:#ffffff05;border-top:1px solid var(--border-subtle);flex-shrink:0;flex-wrap:wrap}.classroom__ctrl-btn{display:flex;flex-direction:column;align-items:center;gap:5px;padding:10px 18px;background:#ffffff0a;border:1px solid rgba(255,255,255,.09);border-radius:var(--radius-md);transition:all var(--transition-fast);min-width:72px;cursor:pointer;font-family:inherit}.classroom__ctrl-btn:hover{background:#ffffff14;border-color:#ff6f0059}.classroom__ctrl-btn--active{background:#ff6f0026;border-color:#ff6f0080}.classroom__ctrl-btn--end{background:#e539351a;border-color:#e5393559}.classroom__ctrl-btn--end:hover{background:#e5393533;border-color:#e5393599}.classroom__ctrl-icon{font-size:20px}.classroom__ctrl-label{font-size:11px;font-weight:700;color:var(--text-secondary);white-space:nowrap}.classroom__end-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000d1;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);display:flex;align-items:center;justify-content:center;z-index:999;padding:24px}.classroom__end-card{background:#131929;border:1px solid rgba(255,255,255,.1);border-radius:24px;padding:40px 36px;max-width:440px;width:100%;text-align:center;box-shadow:0 32px 80px #0009}.classroom__end-avatar{font-size:52px;margin-bottom:16px}.classroom__end-message{font-size:16px;color:var(--text-secondary);line-height:1.7;margin-bottom:28px;font-style:italic}.classroom__end-message strong{color:var(--text-primary);font-style:normal}.classroom__end-timer-ring{position:relative;width:88px;height:88px;margin:0 auto 20px}.classroom__end-timer-ring svg{transform:rotate(-90deg)}.classroom__end-timer-circle-bg{fill:none;stroke:#ffffff14;stroke-width:5}.classroom__end-timer-circle-fill{fill:none;stroke:var(--color-primary);stroke-width:5;stroke-linecap:round;transition:stroke-dashoffset 1s linear}.classroom__end-timer-count{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;font-size:28px;font-weight:800;color:var(--color-primary)}.classroom__end-skip{font-size:13px;color:var(--text-muted);background:none;border:none;cursor:pointer;font-family:inherit;transition:color var(--transition-fast)}.classroom__end-skip:hover{color:var(--text-secondary)}@media (max-width: 900px){.classroom__main{grid-template-columns:1fr;grid-template-rows:auto 1fr auto}.classroom__left{flex-direction:row;border-right:none;border-bottom:1px solid var(--border-subtle);padding:12px 20px;justify-content:flex-start;gap:14px}.classroom__avatar-circle{width:52px;height:52px;font-size:26px}.classroom__avatar-subject{display:none}.classroom__right{border-left:none;border-top:1px solid var(--border-subtle);padding:14px 16px}.classroom__progress-list{flex-direction:row;flex-wrap:wrap;gap:8px}.classroom__progress-item{padding:6px 10px}.classroom__ctrl-btn{min-width:56px;padding:8px 10px}.classroom__ctrl-label{display:none}}.not-found{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--space-md)}.not-found__code{font-size:72px;font-weight:800;color:var(--color-primary)}.not-found__text{color:var(--text-secondary);font-size:16px}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}:root{--color-primary: #FF6F00;--color-primary-dark: #E65100;--color-primary-light: #FFB300;--color-navy: #1A237E;--color-navy-mid: #283593;--bg-base: #0A0E1A;--bg-surface: rgba(255, 255, 255, .04);--bg-surface-hover: rgba(255, 255, 255, .07);--bg-card: rgba(255, 255, 255, .03);--border-subtle: rgba(255, 255, 255, .08);--border-primary: rgba(255, 111, 0, .35);--text-primary: #FFFFFF;--text-secondary: #B0B0B0;--text-muted: #6B6B6B;--color-success: #4CAF50;--color-error: #E53935;--color-info: #2196F3;--space-xs: 4px;--space-sm: 8px;--space-md: 16px;--space-lg: 24px;--space-xl: 40px;--space-2xl: 64px;--radius-sm: 6px;--radius-md: 12px;--radius-lg: 20px;--radius-full: 999px;--font-body: "Nunito", "Segoe UI", Arial, sans-serif;--font-board: "Kalam", cursive;--transition-fast: .15s ease;--transition-base: .25s ease}html,body{height:100%}body{font-family:var(--font-body);background:var(--bg-base);color:var(--text-primary);-webkit-font-smoothing:antialiased}#root{min-height:100vh;display:flex;flex-direction:column}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}a{color:inherit;text-decoration:none}select,input{font-family:inherit}img{max-width:100%;display:block}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:var(--radius-full)}