*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;overflow:hidden}button,label{font-family:inherit}.app{background:#f5f5f5;flex-direction:column;width:100vw;height:100vh;display:flex}.topbar{z-index:1000;background:#fff;border-bottom:1px solid #e5e5e5;flex-shrink:0;justify-content:space-between;align-items:center;height:56px;padding:0 18px;display:flex}.topbar-left{align-items:center;display:flex}.room-name{color:#777;margin-left:16px;font-size:13px}.pdf-button{cursor:pointer;color:#fff;-webkit-user-select:none;user-select:none;background:#111;border-radius:8px;align-items:center;padding:9px 15px;font-size:14px;font-weight:600;display:flex}.pdf-button:hover{opacity:.85}.whiteboard{flex:1;min-height:0;position:relative}.page-controller{z-index:1000;background:#fffffff2;border-radius:10px;align-items:center;gap:6px;padding:6px 8px;display:flex;position:fixed;bottom:12px;right:12px;box-shadow:0 2px 8px #0000001f}.page-controller button{cursor:pointer;border:none;border-radius:8px;width:34px;height:34px;padding:0;font-size:14px;line-height:34px}.page-controller span{text-align:center;min-width:48px;font-size:13px;font-weight:600}.page-controller button:disabled{opacity:.4;cursor:default}.dashboard{background:#f6f7f9;min-height:100vh;padding:40px;overflow-y:auto}.dashboard-header{justify-content:space-between;align-items:flex-end;gap:20px;max-width:1000px;margin:0 auto 28px;display:flex}.dashboard-header h1{margin:0 0 6px;font-size:30px}.dashboard-header p{color:#777;margin:0}.student-add-card{gap:10px;max-width:1000px;margin:0 auto 24px;display:flex}.student-add-card input{background:#fff;border:1px solid #ddd;border-radius:10px;flex:1;padding:13px 15px;font-size:15px}.student-add-card button,.primary-button{color:#fff;cursor:pointer;background:#111;border:0;border-radius:10px;padding:12px 18px;font-weight:600}.student-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;max-width:1000px;margin:auto;display:grid}.student-card{cursor:pointer;text-align:left;background:#fff;border:1px solid #e5e5e5;border-radius:14px;align-items:center;gap:14px;padding:18px;display:flex}.student-card:hover{border-color:#aaa;transform:translateY(-1px)}.student-avatar{color:#fff;background:#111;border-radius:50%;justify-content:center;align-items:center;width:44px;height:44px;font-weight:700;display:flex}.student-card strong{margin-bottom:5px;font-size:16px;display:block}.student-card span{color:#777;font-size:13px}.lesson-list{flex-direction:column;gap:10px;max-width:1000px;margin:auto;display:flex}.lesson-card{cursor:pointer;text-align:left;background:#fff;border:1px solid #e5e5e5;border-radius:12px;justify-content:space-between;align-items:center;width:100%;padding:18px;display:flex}.lesson-card strong{margin-bottom:6px;display:block}.lesson-card span{color:#777;font-size:13px}.empty-state{text-align:center;color:#888;background:#fff;border:1px dashed #ccc;border-radius:14px;padding:50px}.back-button{cursor:pointer;color:#666;background:0 0;border:none;margin-bottom:14px;padding:0}.topbar-actions{align-items:center;gap:10px;display:flex}.invite-button{color:#222;cursor:pointer;background:#fff;border:1px solid #dcdcdc;border-radius:8px;padding:9px 14px;font-size:14px;font-weight:600}.invite-button:hover{background:#f3f3f3}.login-page{background:#f6f7f9;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.login-card{background:#fff;border:1px solid #e5e5e5;border-radius:18px;width:100%;max-width:400px;padding:32px;box-shadow:0 8px 30px #00000012}.login-header{margin-bottom:28px}.login-header h1{margin:0 0 8px;font-size:28px}.login-header p{color:#777;margin:0}.login-field{margin-bottom:18px}.login-field label{margin-bottom:7px;font-size:14px;font-weight:600;display:block}.login-field input{border:1px solid #ddd;border-radius:10px;outline:none;width:100%;padding:12px 14px;font-size:15px}.login-field input:focus{border-color:#777}.login-button{color:#fff;cursor:pointer;background:#111;border:none;border-radius:10px;width:100%;padding:13px;font-size:15px;font-weight:600}.login-button:disabled{opacity:.6;cursor:default}.student-back-button{color:#6b7280;cursor:pointer;background:0 0;border:none;padding:0;font-size:14px;font-weight:500;transition:color .15s}.action-button{white-space:nowrap;cursor:pointer;border:1px solid #0000;border-radius:10px;justify-content:center;align-items:center;gap:7px;min-height:40px;padding:0 16px;font-size:14px;font-weight:600;transition:background-color .15s,border-color .15s,box-shadow .15s,transform .1s;display:inline-flex}.action-button:active:not(:disabled){transform:scale(.97)}.action-button:disabled{opacity:.55;cursor:default}.action-button-primary:hover:not(:disabled){background:#1d4ed8;border-color:#1d4ed8;box-shadow:0 3px 8px #2563eb33}.action-button-icon{font-size:20px;font-weight:400;line-height:1}.action-button-danger:hover:not(:disabled){background:#fef2f2;border-color:#f87171}.lesson-delete-button{color:#dc2626;cursor:pointer;background:#fff;border:1px solid #fecaca;border-radius:8px;flex-shrink:0;height:32px;padding:0 11px;font-size:12px;font-weight:600;transition:background-color .15s,border-color .15s}.lesson-delete-button:hover:not(:disabled){background:#fef2f2;border-color:#f87171}.lesson-delete-button:disabled{opacity:.5;cursor:default}@media (width<=640px){.student-detail-header{flex-direction:column;align-items:flex-start!important}.student-detail-actions{flex-wrap:wrap;width:100%}.action-button{min-height:38px;padding:0 13px;font-size:13px}}.lesson-list{overscroll-behavior:contain;scrollbar-gutter:stable;max-height:calc(100vh - 250px);padding-right:6px;overflow:hidden auto}.lesson-list{scrollbar-width:thin;scrollbar-color:#d1d5db transparent}.lesson-exit-button{color:#374151;cursor:pointer;background:#fff;border:1px solid #d1d5db;border-radius:8px;justify-content:center;align-items:center;height:36px;padding:0 13px;font-size:13px;font-weight:600;transition:background-color .15s,border-color .15s,transform .1s;display:inline-flex}.lesson-exit-button:hover{background:#f9fafb;border-color:#9ca3af}.lesson-exit-button:active{transform:scale(.97)}.lesson-list{overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#d1d5db transparent;flex-direction:column;gap:10px;max-height:calc(100vh - 250px);padding-right:6px;display:flex;overflow:hidden auto}.lesson-list::-webkit-scrollbar{width:7px}.lesson-list::-webkit-scrollbar-track{background:0 0}.lesson-list::-webkit-scrollbar-thumb{background:#d1d5db;border-radius:999px}.lesson-list::-webkit-scrollbar-thumb:hover{background:#9ca3af}.auth-page{background:#f5f7fb;justify-content:center;align-items:center;min-height:100vh;padding:24px;display:flex}.auth-card{background:#fff;border:1px solid #e5e7eb;border-radius:16px;width:100%;max-width:420px;padding:32px;box-shadow:0 10px 30px #0000000f}.auth-header{margin-bottom:28px}.auth-header h1{color:#111827;margin:0 0 8px;font-size:26px}.auth-header p{color:#6b7280;margin:0;font-size:14px}.auth-form{flex-direction:column;gap:16px;display:flex}.auth-field{color:#374151;flex-direction:column;gap:7px;font-size:13px;font-weight:600;display:flex}.auth-field input{border:1px solid #d1d5db;border-radius:9px;outline:none;height:44px;padding:0 12px;font-size:14px;transition:border-color .15s,box-shadow .15s}.auth-field input:focus{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}.auth-submit-button{color:#fff;cursor:pointer;background:#2563eb;border:none;border-radius:9px;height:44px;margin-top:4px;font-size:14px;font-weight:600}.auth-submit-button:hover:not(:disabled){background:#1d4ed8}.auth-submit-button:disabled{opacity:.6;cursor:default}.auth-error{color:#dc2626;background:#fef2f2;border-radius:8px;padding:10px 12px;font-size:13px}.auth-success{color:#15803d;background:#f0fdf4;border-radius:8px;padding:10px 12px;font-size:13px}.auth-footer{text-align:center;color:#6b7280;margin-top:22px;font-size:13px}.auth-footer a{color:#2563eb;font-weight:600;text-decoration:none}.logout-button{color:#4b5563;letter-spacing:-.01em;cursor:pointer;background:#fff;border:1px solid #e5e7eb;border-radius:10px;justify-content:center;align-items:center;height:40px;padding:0 16px;font-size:13px;font-weight:600;transition:background-color .15s,border-color .15s,color .15s,box-shadow .15s,transform .1s;display:inline-flex;box-shadow:0 1px 2px #0000000a}.logout-button:hover:not(:disabled){color:#111827;background:#f9fafb;border-color:#d1d5db;box-shadow:0 2px 5px #0000000f}.logout-button:active:not(:disabled){box-shadow:none;background:#f3f4f6;transform:translateY(1px)}.logout-button:focus-visible{outline:none;box-shadow:0 0 0 3px #2563eb1f}.logout-button:disabled{opacity:.5;cursor:not-allowed}.pdf-page-modal-backdrop{z-index:5000;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#11182761;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.pdf-page-modal{background:#fff;border:1px solid #e5e7eb;border-radius:16px;width:min(460px,100%);max-height:calc(100vh - 40px);padding:24px;overflow-y:auto;box-shadow:0 24px 60px #0000002e}.pdf-page-modal-header h2{color:#111827;margin:0;font-size:20px;font-weight:700}.pdf-page-modal-header p{color:#6b7280;text-overflow:ellipsis;white-space:nowrap;margin:7px 0 0;font-size:13px;overflow:hidden}.pdf-page-modal-options{flex-direction:column;gap:8px;margin-top:22px;display:flex}.pdf-page-option{color:#374151;cursor:pointer;border:1px solid #e5e7eb;border-radius:10px;align-items:center;gap:9px;min-height:42px;padding:0 12px;font-size:14px;font-weight:600;display:flex}.pdf-page-option:has(input:checked){color:#1d4ed8;background:#eff6ff;border-color:#93c5fd}.pdf-page-option input{margin:0}.pdf-page-custom{margin-top:16px}.pdf-page-custom label{color:#374151;margin-bottom:7px;font-size:13px;font-weight:600;display:block}.pdf-page-custom input{box-sizing:border-box;border:1px solid #d1d5db;border-radius:9px;outline:none;width:100%;height:42px;padding:0 12px;font-size:14px}.pdf-page-custom input:focus{border-color:#2563eb;box-shadow:0 0 0 3px #2563eb1a}.pdf-page-help{color:#9ca3af;margin-top:7px;font-size:12px}.pdf-page-error{color:#dc2626;background:#fef2f2;border-radius:8px;margin-top:12px;padding:10px 12px;font-size:12px}.pdf-page-summary{color:#6b7280;background:#f9fafb;border-radius:9px;margin-top:16px;padding:10px 12px;font-size:13px}.pdf-page-modal-actions{justify-content:flex-end;gap:8px;margin-top:22px;display:flex}.pdf-page-cancel-button,.pdf-page-confirm-button{cursor:pointer;border-radius:9px;height:40px;padding:0 15px;font-size:13px;font-weight:600}.pdf-page-cancel-button{color:#4b5563;background:#fff;border:1px solid #d1d5db}.pdf-page-cancel-button:hover:not(:disabled){background:#f9fafb}.pdf-page-confirm-button{color:#fff;background:#2563eb;border:1px solid #2563eb}.pdf-page-confirm-button:hover:not(:disabled){background:#1d4ed8;border-color:#1d4ed8}.pdf-page-cancel-button:disabled,.pdf-page-confirm-button:disabled{opacity:.55;cursor:default}@media (width<=640px){.pdf-page-modal-backdrop{padding:12px}.pdf-page-modal{border-radius:14px;padding:20px}.pdf-page-modal-actions{grid-template-columns:1fr 1fr;display:grid}.pdf-page-cancel-button,.pdf-page-confirm-button{width:100%}}@media (hover:none) and (pointer:coarse) and (width>=641px) and (width<=1180px){.pdf-page-modal-backdrop{padding:calc(52px + env(safe-area-inset-top,0px)) max(10px, env(safe-area-inset-right,0px)) 10px 168px;-webkit-backdrop-filter:none;backdrop-filter:none;background:#11182714;justify-content:flex-end;align-items:flex-start}.pdf-page-modal{width:min(400px,100vw - 180px);max-height:calc(100dvh - 64px - env(safe-area-inset-top,0px));padding:20px}}:root{--nodi-bg:#f7fbf4;--nodi-bg-soft:#fbfdf8;--nodi-surface:#fff;--nodi-surface-soft:#f7fbf3;--nodi-text:#172033;--nodi-text-strong:#101828;--nodi-text-muted:#667085;--nodi-text-soft:#98a2b3;--nodi-primary:#65a30d;--nodi-primary-hover:#4d7c0f;--nodi-primary-soft:#f1f8e8;--nodi-primary-soft-2:#e7f3d8;--nodi-blue:#84cc16;--nodi-blue-soft:#f7fee7;--nodi-success:#16a34a;--nodi-success-soft:#f0fdf4;--nodi-warning:#d97706;--nodi-warning-soft:#fffbeb;--nodi-danger:#dc2626;--nodi-danger-hover:#b91c1c;--nodi-danger-soft:#fff1f2;--nodi-border:#e2e8f0;--nodi-border-strong:#cbd5e1;--nodi-focus:#65a30d29;--nodi-shadow-xs:0 1px 2px #0f172a0a;--nodi-shadow-sm:0 4px 14px #0f172a0f;--nodi-shadow-md:0 10px 30px #0f172a14;--nodi-shadow-hover:0 14px 34px #65a30d24;font-family:Pretendard,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}html,body,#root{background:var(--nodi-bg);color:var(--nodi-text)}body{margin:0}.dashboard{color:var(--nodi-text);background:radial-gradient(circle at 8% 0%, #84cc161c, transparent 30%), radial-gradient(circle at 92% 10%, #bef2641f, transparent 28%), var(--nodi-bg)!important}.dashboard h1,.auth-page h1{color:var(--nodi-text-strong);letter-spacing:-.035em}.students-header h1{display:inline-block;position:relative;color:var(--nodi-primary)!important;font-weight:800!important}.students-header h1:after{content:"";opacity:.85;background:linear-gradient(90deg,#84cc16,#65a30d);border-radius:99px;height:3px;position:absolute;bottom:-4px;left:1px;right:1px}.empty-state{box-shadow:var(--nodi-shadow-xs);color:var(--nodi-text-muted)!important;background:linear-gradient(145deg,#fffffff0,#eef2ffe0)!important;border:1px dashed #d9efb8!important;border-radius:16px!important}button,label.pdf-button{transition:transform .14s,box-shadow .14s,border-color .14s,background-color .14s,color .14s}button:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,label.pdf-button:focus-within{outline-offset:1px;outline:3px solid var(--nodi-focus)!important}.action-button-primary{color:#fff!important;background:linear-gradient(135deg,#84cc16,#65a30d 55%,#65a30d)!important;border-color:#0000!important;box-shadow:0 6px 16px #65a30d38!important}.action-button-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 10px 22px #65a30d47!important}.action-button-danger{color:#be123c!important;background:#fff7f8!important;border-color:#fecdd3!important}.action-button-danger:hover:not(:disabled){color:#9f1239!important;background:#fff1f2!important;border-color:#fda4af!important}.student-back-button{color:var(--nodi-primary)!important;font-weight:700!important}.student-back-button:hover{color:var(--nodi-primary-hover)!important}input,textarea,select{transition:border-color .14s,box-shadow .14s,background-color .14s;border-color:var(--nodi-border)!important;color:var(--nodi-text)!important;background:#fffffff2!important}input:hover,textarea:hover,select:hover{border-color:#d9efb8!important}input:focus,textarea:focus,select:focus{background:#fff!important;border-color:#84cc16!important;box-shadow:0 0 0 4px #84cc161f!important}input::placeholder,textarea::placeholder{color:#a1a8b5}.student-card,.lesson-list>button,.lesson-card{border-color:var(--nodi-border)!important;box-shadow:var(--nodi-shadow-xs)!important;background:linear-gradient(145deg,#fff,#fbfcff)!important}.student-card:hover,.lesson-list>button:hover,.lesson-card:hover{transform:translateY(-2px);box-shadow:var(--nodi-shadow-hover)!important;background:linear-gradient(145deg,#fff,#f4f6ff)!important;border-color:#b7d98a!important}.student-card:active,.lesson-list>button:active,.lesson-card:active{transform:translateY(0)}.student-card>div:last-child{color:#84cc16!important}.auth-page{background:radial-gradient(circle at 14% 8%,#84cc1629,#0000 34%),radial-gradient(circle at 88% 88%,#a3e6351a,#0000 32%),linear-gradient(160deg,#f7fbf2,#f3f9ee)!important}.auth-card{background:#fffffff5!important;border-color:#d3ebb1cc!important;border-radius:20px!important;box-shadow:0 22px 70px #2d376e1f!important}.auth-header h1{color:#294014!important}.auth-header p,.auth-footer{color:var(--nodi-text-muted)!important}.auth-footer a{font-weight:700;color:var(--nodi-primary)!important}.auth-card>div>button:not(.action-button-danger){transition:transform .14s,border-color .14s,box-shadow .14s,background-color .14s}.auth-card>div>button:not(.action-button-danger):hover{box-shadow:var(--nodi-shadow-sm);transform:translateY(-1px);border-color:#d9efb8!important}[role=dialog]{border-color:#d3ebb1d1!important;border-radius:18px!important;box-shadow:0 28px 80px #0f172a33!important}.lesson-app{background:#f8fbf6!important}.lesson-app .topbar{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:0 5px 18px #0f172a0d;background:linear-gradient(110deg,#fffffffa,#f8fafffa)!important;border-bottom:1px solid #d3ebb1cc!important}.lesson-app .topbar-left>strong{letter-spacing:-.025em;color:#314d19!important;font-weight:800!important}.lesson-app .room-name{color:#94a3b8!important}.lesson-app .session-timer{background:linear-gradient(135deg,#fff,#f7fbea)!important;border-color:#e0efc8!important;box-shadow:0 3px 10px #65a30d14!important}.lesson-app .fullscreen-button,.lesson-app .lesson-exit-button,.lesson-app .invite-button,.lesson-app .pdf-button{box-shadow:var(--nodi-shadow-xs);color:#374151!important;background:#fff!important;border-color:#dce8cf!important}.lesson-app .fullscreen-button:hover,.lesson-app .lesson-exit-button:hover,.lesson-app .invite-button:hover,.lesson-app .pdf-button:hover{transform:translateY(-1px);box-shadow:0 6px 15px #65a30d24;color:var(--nodi-primary)!important;background:#f7fbea!important;border-color:#b7d98a!important}.lesson-app .offline-banner{color:#9f1239!important;background:linear-gradient(90deg,#fff1f2,#fff7ed)!important;border-color:#fecdd3!important}*{scrollbar-width:thin;scrollbar-color:#d9efb8 transparent}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:linear-gradient(#d9efb8,#b7d98a) padding-box padding-box;border:2px solid #0000;border-radius:99px}@media (width<=640px){.dashboard{background:linear-gradient(#f7fbf2,#f8fbf6)!important}.auth-card{border-radius:16px!important;box-shadow:0 12px 36px #2d376e1a!important}.student-card:hover,.lesson-list>button:hover,.lesson-card:hover{transform:none}}@media (prefers-reduced-motion:reduce){button,label.pdf-button,.student-card,.lesson-list>button,.lesson-card{transition:none!important}.student-card:hover,.lesson-list>button:hover,.lesson-card:hover,.action-button-primary:hover,.lesson-app button:hover,.lesson-app label:hover{transform:none!important}}.lesson-app .topbar-actions .pdf-button,.lesson-app label.pdf-button{position:relative;color:#3f6212!important;background:linear-gradient(135deg,#f5fce9,#eaf7d7)!important;border:1px solid #a8cf72!important;font-weight:800!important;box-shadow:0 4px 12px #65a30d29!important}.lesson-app .topbar-actions .pdf-button:before,.lesson-app label.pdf-button:before{content:"＋";margin-right:5px;font-size:14px;font-weight:900;line-height:1}.lesson-app .topbar-actions .pdf-button:hover,.lesson-app label.pdf-button:hover{transform:translateY(-1px);color:#365314!important;background:linear-gradient(135deg,#eef9dc,#dff2c1)!important;border-color:#84b844!important;box-shadow:0 8px 18px #65a30d38!important}.lesson-app .topbar-actions .pdf-button:active,.lesson-app label.pdf-button:active{transform:translateY(0);box-shadow:0 3px 8px #65a30d26!important}.lesson-app .topbar-actions .pdf-button[aria-disabled=true],.lesson-app label.pdf-button[aria-disabled=true]{opacity:.56;box-shadow:none!important}