@import"https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Lexend:wght@400;500;600;700&display=swap";:root{--primary-navy: #1A2B48;--action-blue: #0066FF;--action-hover: #0052CC;--accent-teal: #00C2CB;--bg-light: #F8FAFC;--white: #FFFFFF;--text-main: #334155;--text-muted: #64748B;--border-color: #E2E8F0;--font-main: "Inter", -apple-system, sans-serif;--font-heading: "Lexend", sans-serif;--font-handwritten: "Caveat", cursive;--radius-sm: 4px;--radius-md: 8px;--shadow-sm: 0 1px 3px rgba(0, 0, 0, .1);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .1), 0 2px 4px -1px rgba(0, 0, 0, .06);--primary-blue: var(--action-blue);--primary-blue-hover: var(--action-hover);--secondary-blue: #E6F2FF;--text-dark: var(--text-main);--text-light: var(--text-muted);--bg-gray: var(--bg-light);--success-green: #38A169;--warning-amber: #DD6B20;--danger-red: #E53E3E;--font-family: var(--font-main);--radius: var(--radius-md);--bg-canvas: var(--bg-light);--nav-bg: rgba(255, 255, 255, .8);--nav-border: rgba(255, 255, 255, .1);--text-primary: var(--text-main);--bg-card: var(--white)}@media(prefers-color-scheme:dark){:root{--text-dark: #f1f5f9;--text-light: #94a3b8;--bg-gray: #0f172a;--bg-canvas: #0f172a;--white: #1e293b;--border-color: #334155;--shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, .3);--shadow-md: 0 4px 6px -1px rgba(0, 0, 0, .5), 0 2px 4px -1px rgba(0, 0, 0, .3);--secondary-blue: #1e3a8a;--nav-bg: rgba(30, 41, 59, .8);--nav-border: rgba(255, 255, 255, .05);--primary-navy: #f1f5f9;--text-main: #f1f5f9;--text-muted: #94a3b8;--bg-light: #0f172a}}.app-name{font-family:var(--font-handwritten);font-weight:700;letter-spacing:.5px}body{margin:0;font-family:var(--font-family);background-color:var(--bg-gray);color:var(--text-dark);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;width:100%}html{height:100%}button{transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1);transition-duration:.2s}button:hover:not(:disabled){transform:scale(1.02)}button:active:not(:disabled){transform:scale(.98)}button:disabled{opacity:.6;cursor:not-allowed}h1,h2,h3,h4,h5,h6{color:var(--primary-navy);font-family:var(--font-heading);margin-bottom:.5em;font-weight:700}p{color:var(--text-main);line-height:1.6}button{cursor:pointer;font-family:var(--font-family);font-weight:600;transition:all .2s ease;border:none;outline:none}.btn{display:inline-flex;align-items:center;justify-content:center;padding:.75rem 1.5rem;border-radius:var(--radius);font-size:1rem;text-decoration:none}.btn-primary{background-color:var(--action-blue);color:var(--white);padding:12px 28px;border-radius:var(--radius-md);font-weight:600;transition:all .3s ease;border:none;box-shadow:var(--shadow-sm)}.btn-primary:hover{background-color:var(--action-hover);transform:translateY(-1px);box-shadow:var(--shadow-md)}.btn-primary:disabled{background-color:#a0aec0;cursor:not-allowed;transform:none}.feature-card{background:var(--white);border:1px solid var(--border-color);border-radius:var(--radius-md);padding:24px;transition:border-color .3s ease}.feature-card:hover{border-color:var(--action-blue)}.btn-secondary{background-color:var(--white);color:var(--primary-blue);border:2px solid var(--primary-blue)}.btn-secondary:hover{background-color:var(--secondary-blue)}.btn-text{background:none;color:var(--primary-blue);padding:.5rem 1rem}.btn-text:hover{text-decoration:underline}.card{background-color:var(--white);border-radius:var(--radius);box-shadow:var(--shadow-sm);padding:2rem;border:1px solid var(--border-color)}.container{max-width:1200px;margin:0 auto;padding:0 1rem}.flex-center{display:flex;align-items:center;justify-content:center}.text-center{text-align:center}.mt-4{margin-top:1rem}.mb-4{margin-bottom:1rem}input[type=text],input[type=password],input[type=email]{width:100%;padding:.75rem;border:1px solid var(--border-color);border-radius:var(--radius);font-size:1rem;transition:border-color .2s;box-sizing:border-box}input:focus{border-color:var(--primary-blue);outline:none;box-shadow:0 0 0 3px var(--secondary-blue)}.footer-gradient-animated{background:linear-gradient(to right,#f8fafc,#e0f2fe,#bae6fd);background-size:200% 200%;animation:gradientShift 15s ease infinite}.page-gradient{background:linear-gradient(135deg,#eff6ff,#dbeafe,#bfdbfe);min-height:100vh}.glass-panel{background-color:var(--white);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border-color);box-shadow:var(--shadow-md)}.desktop-only{display:none}@media(min-width:768px){.desktop-only{display:block}}.text-gradient{background:linear-gradient(135deg,#1e3a8a,#3b82f6);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}.btn-gradient{background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;box-shadow:0 4px 12px #3b82f64d;transition:all .3s ease}.btn-gradient:hover{transform:translateY(-2px);box-shadow:0 8px 20px #3b82f666}.btn-outline{background-color:#fff;color:#3b82f6;border:2px solid #3b82f6;box-shadow:0 4px 12px #3b82f626;transition:all .3s cubic-bezier(.25,1,.5,1)}.btn-primary:active,.btn-outline:active,.btn-gradient:active{transform:scale(.98)}.btn-outline:hover{background-color:#3b82f6;color:#fff;transform:translateY(-2px)}.logo-box{width:48px;height:48px;background:linear-gradient(135deg,#3b82f6,#2563eb);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-weight:700;font-size:24px;box-shadow:0 4px 12px #3b82f64d}.modern-animated-grid{background-color:var(--bg-canvas);background-image:linear-gradient(45deg,rgba(148,163,184,.45) 1.5px,transparent 1.5px),linear-gradient(-45deg,rgba(148,163,184,.45) 1.5px,transparent 1.5px);background-size:40px 40px;position:relative}.modern-animated-grid:after{content:"";position:absolute;inset:0;background:linear-gradient(to bottom,var(--bg-canvas) 0%,transparent 15%,transparent 80%,var(--bg-canvas) 100%);pointer-events:none;z-index:0}.highlight-container{position:relative;display:inline-block;z-index:1}.highlight-svg{position:absolute;bottom:-10px;left:0;width:100%;height:20px;z-index:-1;pointer-events:none}.modal-overlay{position:fixed;inset:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1001}@keyframes gradientShift{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.animated-bg{background:linear-gradient(-45deg,#f8fafc,#eff6ff,#f0f9ff,#f8fafc);background-size:400% 400%;animation:gradientShift 40s ease infinite;min-height:100vh}.glass-card-enhanced{background:#ffffffb3;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid rgba(255,255,255,.5);border-radius:24px;box-shadow:0 4px 20px #00000008,inset 0 1px #fffc;transition:transform .4s ease,box-shadow .4s ease}.glass-card-enhanced:hover{transform:translateY(-2px);box-shadow:0 12px 30px #0000000d,inset 0 1px #fffc}@keyframes borderGlow{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.glow-border{position:relative;border-radius:24px;overflow:hidden}.glow-border:before{content:"";position:absolute;inset:-1px;border-radius:25px;background:linear-gradient(90deg,#60a5fa,#3b82f6,#93c5fd,#3b82f6);background-size:300% 100%;animation:borderGlow 8s linear infinite;z-index:-1;opacity:.3;transition:opacity .5s ease}.glow-border:hover:before{opacity:.9}.feature-card-hover{position:relative;overflow:hidden;transition:transform .3s ease}.feature-card-hover:after{content:"";position:absolute;inset:0;background:linear-gradient(135deg,#3b82f60d,#8b5cf60d);opacity:0;transition:opacity .3s ease;pointer-events:none;border-radius:inherit}.feature-card-hover:hover{transform:translateY(-6px)}.feature-card-hover:hover:after{opacity:1}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in-up{animation:fadeInUp .6s ease-out both}.navbar-glow{position:relative}.navbar-glow:after{content:"";position:absolute;bottom:-1px;left:10%;right:10%;height:1px;background:linear-gradient(90deg,transparent,rgba(59,130,246,.4),transparent);pointer-events:none}@keyframes pulseGlow{0%{box-shadow:0 0 #3b82f666}70%{box-shadow:0 0 0 10px #3b82f600}to{box-shadow:0 0 #3b82f600}}.cta-glow:hover{animation:pulseGlow 1.5s ease infinite}.modern-toolbar{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;padding:8px 12px;border-radius:999px;background-color:#ffffffbf;backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);box-shadow:0 8px 32px #0000001f,0 1px 2px #0000000a;border:1px solid rgba(255,255,255,.5);gap:8px;pointer-events:auto;transition:all .3s cubic-bezier(.16,1,.3,1);overflow:visible;max-width:100%}@media(max-width:600px){.modern-toolbar{padding:8px 12px;gap:4px;border-radius:20px;background-color:#ffffffd9}}.dark-mode{background-color:#0f172a;color:#f1f5f9}.student-header-layout{display:flex;flex-direction:column;padding:8px 1.5rem;background-color:#fffc;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid rgba(0,0,0,.05);z-index:50;position:relative;min-height:72px}@media(min-width:901px){.student-header-layout{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem}.student-header-left{justify-self:start}.student-header-right{justify-self:end}.student-header-toolbar{position:static;transform:none;justify-self:center;width:auto;max-width:100%}}.student-header-left,.student-header-right{display:flex;align-items:center;gap:1rem;z-index:2}.student-header-toolbar{display:flex;align-items:center;justify-content:center;z-index:1;width:auto}@media(max-width:900px){.student-header-layout{display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:center;height:auto;padding-bottom:12px}.student-header-toolbar{width:100%;margin-top:8px;display:flex;justify-content:center;order:3;position:relative;left:auto;top:auto;transform:none}}.dark-card{background-color:#1e293b;border:1px solid #334155;color:#f1f5f9}.dark-card:hover{transform:translateY(-4px);box-shadow:0 10px 15px -3px #00000080,0 4px 6px -2px #0000004d}.student-card-hover .quick-actions{transition:opacity .2s ease-in-out}#root{width:100%;margin:0;padding:0}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media(prefers-reduced-motion:no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.card{padding:2em}.read-the-docs{color:#888}.dashboard-container{width:100%;margin:0 auto}.students-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:20px}.student-card{border:1px solid #ddd;border-radius:8px;padding:10px;background-color:#f9f9f9;cursor:pointer;transition:transform .2s}.student-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.student-card h4{margin-top:0;margin-bottom:10px}.canvas-preview-container{display:flex;justify-content:center;align-items:center;background-color:#fff;border:1px solid #eee}.focused-view{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#000c;display:flex;justify-content:center;align-items:center;z-index:1000}.student-card.focused{cursor:default;transform:none;box-shadow:0 0 20px #00000080;border:none;background:#fff;padding:20px;border-radius:12px}.session-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.dashboard-container.has-focus .students-grid,.dashboard-container.has-focus .session-header,.dashboard-container.has-focus .controls-toolbar{filter:blur(5px);pointer-events:none}.controls-toolbar{background:#fff;padding:15px;border-radius:12px;box-shadow:0 4px 12px #0000000d;margin-bottom:25px;display:flex;flex-direction:column;gap:15px;border:1px solid #eaeaea}.controls-toolbar>div{display:flex;align-items:center;gap:10px;flex-wrap:wrap}.controls-toolbar strong{font-weight:600;color:#333;min-width:100px}.controls-toolbar button{padding:8px 16px;border-radius:6px;border:1px solid #ddd;background:#fff;cursor:pointer;transition:all .2s;font-size:14px}.controls-toolbar button:hover{background:#f0f0f0;border-color:#ccc;transform:translateY(-1px)}.controls-toolbar input[type=text]{padding:8px 12px;border-radius:6px;border:1px solid #ddd;flex-grow:1;max-width:300px}.controls-toolbar input[type=file]{font-size:14px}.tagline{font-size:.8rem;color:#64748b;font-weight:500;display:none}@media(min-width:768px){.tagline{display:block;margin-left:1rem}}.grid-tagline{font-size:.8rem;color:#64748b;font-weight:500;text-align:center}