:root{--primary: #0b6b63;--primary-hover: #0e5f58;--secondary: #f3f4f6;--secondary-hover: #e6e7ea;--accent: #b78b2e;--danger: #dc2626;--success: #059669;--background: #eef1f3;--surface: #f5f7f9;--text-main: #111827;--text-muted: #6b7280;--border: #d1d5db;--radius: 12px;--shadow: 0 4px 6px -1px rgba(0,0,0,.06), 0 2px 4px -1px rgba(0,0,0,.04);--shadow-lg: 0 10px 15px -3px rgba(0,0,0,.06), 0 4px 6px -2px rgba(0,0,0,.04);--timer-bg: #fbe4e4;--timer-text: #c53030}body.dark{--primary: #14b8a6;--primary-hover: #2dd4bf;--secondary: #1e293b;--secondary-hover: #334155;--accent: #fbbf24;--background: #0f172a;--surface: #1e293b;--text-main: #f8fafc;--text-muted: #94a3b8;--border: #334155;--timer-bg: #450a0a;--timer-text: #fca5a5}*{box-sizing:border-box;margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}body{background-color:var(--background);color:var(--text-main);line-height:1.5;min-height:100vh;transition:background-color .3s,color .3s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}input,textarea,select{-webkit-user-select:text;-moz-user-select:text;-ms-user-select:text;user-select:text}.noselect{-webkit-user-select:none;-ms-user-select:none;user-select:none}.brand-logo{height:32px;width:32px;object-fit:contain;border-radius:0;background:transparent}header{background:var(--surface);border-bottom:2px solid var(--primary);padding:.75rem 1.25rem;display:flex;justify-content:space-between;align-items:center;position:sticky;top:0;z-index:100;box-shadow:0 2px 4px #0000001a;transition:background-color .3s}.brand{font-size:1.35rem;font-weight:800;color:var(--primary);cursor:pointer;display:flex;align-items:center;gap:10px;white-space:nowrap}.header-actions{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap;justify-content:flex-end}.container{max-width:1000px;margin:1.5rem auto;padding:0 1rem}.page{display:none;animation:fadeIn .3s ease}.page.active{display:block}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.btn{padding:.6rem 1.2rem;border-radius:8px;font-weight:600;cursor:pointer;border:none;transition:all .2s;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-size:.95rem}.btn:disabled{opacity:.5;cursor:not-allowed}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover);transform:translateY(-1px)}.btn-secondary{background:var(--secondary);color:var(--primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--secondary-hover)}.btn-success{background:var(--success);color:#fff;border:1px solid var(--success)}.btn-success:hover{background:#059669}.btn-danger{background:#fee2e2;color:var(--danger)}.btn-danger:hover{background:#fecaca}body.dark .btn-danger{background:#7f1d1d;color:#fca5a5}body.dark .btn-danger:hover{background:#991b1b}.btn-accent{background:var(--accent);color:#fff}.btn-accent:hover{background:#a67a28;transform:translateY(-1px)}.btn-icon{padding:.5rem;border-radius:6px;background:transparent;color:var(--text-muted);border:1px solid transparent;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .2s;font-size:1.1rem}.btn-icon:hover{background:var(--secondary);color:var(--text-main)}.theme-toggle-btn .theme-icon{transition:transform .5s cubic-bezier(.68,-.55,.265,1.55)}.theme-toggle-btn:active .theme-icon{transform:rotate(30deg)}.theme-moon{transition:opacity .3s,transform .5s cubic-bezier(.68,-.55,.265,1.55);opacity:1;transform-origin:center}body.dark .theme-moon{opacity:0}.theme-sun{transition:opacity .3s,transform .5s cubic-bezier(.68,-.55,.265,1.55);opacity:0;transform-origin:center}body.dark .theme-sun{opacity:1}body.dark .theme-toggle-btn .theme-icon{transform:rotate(180deg)}body.dark .theme-toggle-btn:active .theme-icon{transform:rotate(210deg)}.settings-icon{transition:transform .4s cubic-bezier(.68,-.55,.265,1.55)}.btn-icon:hover .settings-icon{transform:rotate(90deg)}@keyframes bubblePopOff{0%{transform:scale(1);opacity:1}50%{transform:scale(1.2);opacity:.8}to{transform:scale(0);opacity:0}}.tutorial-bubble-hide{animation:bubblePopOff .3s cubic-bezier(.68,-.55,.265,1.55) forwards}.dashboard-header{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:2rem;flex-wrap:wrap;gap:1rem}.dashboard-actions{display:flex;gap:.5rem;flex-wrap:wrap}.dashboard-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:1rem;margin-bottom:2rem}.stat-card{background:var(--surface);padding:1.25rem;border-radius:var(--radius);border:1px solid var(--border);box-shadow:var(--shadow);text-align:center;border-bottom:4px solid var(--primary)}.stat-value{font-size:1.75rem;font-weight:800;color:var(--text-main)}.stat-label{font-size:.8rem;color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;margin-top:.25rem;font-weight:600}.dashboard-controls{display:flex;gap:1rem;margin-bottom:1.5rem;flex-wrap:wrap}.search-bar{flex:2;min-width:200px}.sort-select{flex:1;min-width:150px;background-color:var(--surface)}.sets-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:1.5rem}.set-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s;display:flex;flex-direction:column;border-top:4px solid var(--primary);cursor:pointer}.set-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg);border-color:var(--primary)}.set-card h3{margin-bottom:.5rem;font-size:1.15rem;color:var(--primary)}.set-card p{color:var(--text-muted);font-size:.9rem;margin-bottom:1.25rem;flex-grow:1;pointer-events:none}.set-actions{display:flex;gap:.5rem}.set-actions .btn{flex:1;padding:.5rem}.editor-header{background:var(--surface);padding:1.5rem;border-radius:var(--radius);margin-bottom:1.5rem;box-shadow:var(--shadow);border:1px solid var(--border)}.input-group{margin-bottom:1rem}.input-group label{display:block;font-weight:600;margin-bottom:.5rem;font-size:.9rem;color:var(--text-main)}.form-control{width:100%;padding:.75rem 1rem;border:1px solid var(--border);border-radius:8px;font-size:1rem;transition:border-color .2s;background:var(--background);color:var(--text-main)}.form-control:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #0d948826}textarea.form-control{resize:vertical;min-height:80px}.card-list{display:flex;flex-direction:column;gap:1rem;margin-bottom:2rem}.edit-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.25rem;box-shadow:var(--shadow);position:relative;border-left:4px solid var(--accent);transition:background-color .2s}.edit-card.selected{background-color:#fef2f2;border-color:var(--danger)}body.dark .edit-card.selected{background-color:#450a0a;border-color:#fca5a5}.edit-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.5rem;border-bottom:1px solid var(--border)}.card-number{font-weight:700;color:var(--primary);display:flex;align-items:center;gap:10px}.card-controls{display:flex;gap:.25rem}.card-select-checkbox{display:none;width:18px;height:18px;cursor:pointer;accent-color:var(--danger)}.selection-mode-active .card-select-checkbox{display:inline-block}.selection-mode-active .card-controls{display:none}.selection-mode-active .type-toggle,.selection-mode-active .answer-section,.selection-mode-active .input-group label{display:none!important}.selection-mode-active .input-group{margin-bottom:0}.selection-mode-active .edit-card{padding:.75rem 1rem}.selection-mode-active textarea.q-input{min-height:38px!important;height:38px!important;padding:.5rem;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;resize:none}.type-toggle{display:flex;gap:.5rem;margin-bottom:1rem;background:var(--background);padding:.25rem;border-radius:8px;width:fit-content;border:1px solid var(--border);flex-wrap:wrap}.type-btn{padding:.4rem 1rem;border-radius:6px;font-size:.85rem;font-weight:600;cursor:pointer;border:none;background:transparent;color:var(--text-muted)}.type-btn.active{background:var(--primary);color:#fff;box-shadow:0 1px 3px #0000001a}.mcq-options{display:flex;flex-direction:column;gap:.75rem}.mcq-row{display:flex;align-items:center;gap:1rem;background:var(--background);padding:.5rem;border-radius:8px;border:1px solid transparent}.mcq-row:focus-within{border-color:var(--primary)}.mcq-row input[type=radio],.mcq-row input[type=checkbox]{width:20px;height:20px;cursor:pointer;accent-color:var(--primary)}.mcq-row input[type=text]{flex:1;border:none;background:transparent;color:var(--text-main);padding:.5rem;outline:none;font-size:1rem}.quiz-container{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:2rem;max-width:800px;margin:0 auto;border:1px solid var(--border);border-top:6px solid var(--primary);position:relative}.progress-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;color:var(--text-muted);font-weight:600}.progress-bar{height:8px;background:var(--border);border-radius:4px;overflow:hidden;margin-bottom:2rem}.progress-fill{height:100%;background:var(--accent);width:0%;transition:width .3s ease}.timer-badge{display:none;background:var(--timer-bg);color:var(--timer-text);padding:.4rem 1rem;border-radius:999px;font-weight:800;font-variant-numeric:tabular-nums;align-items:center;gap:6px;font-size:1.1rem;box-shadow:0 2px 4px #0000001a;animation:pulse 1s infinite}@keyframes pulse{0%{transform:scale(1)}50%{transform:scale(1.05)}to{transform:scale(1)}}.question-text{font-size:1.3rem;font-weight:600;margin-bottom:2rem;color:var(--text-main);line-height:2.2}.quiz-options{display:flex;flex-direction:column;gap:1rem}.quiz-option{padding:1rem 1.5rem;border:2px solid var(--border);border-radius:8px;background:var(--surface);color:var(--text-main);font-size:1.1rem;cursor:pointer;transition:all .2s;text-align:left}.quiz-option:hover{border-color:var(--primary);background:var(--secondary)}.quiz-option.selected{border-color:var(--primary);background:var(--primary);color:#fff}.quiz-text-answer{font-size:1.25rem;padding:1rem;border:2px solid var(--border)}.quiz-text-answer:focus{border-color:var(--primary)}.quiz-nav{display:flex;justify-content:space-between;margin-top:2rem;padding-top:2rem;border-top:1px solid var(--border)}.quiz-exit{text-align:center;margin-top:1.5rem}.drop-zone{display:inline-flex;align-items:center;justify-content:center;min-width:100px;height:36px;padding:0;border:2px dashed var(--primary);background:#0d94880d;margin:0 6px;vertical-align:middle;border-radius:6px;transition:all .2s}.drop-zone.drag-over{background:var(--secondary);border-style:solid}.word-bank{display:flex;flex-wrap:wrap;gap:10px;padding:1.5rem;border:2px dashed var(--border);border-radius:var(--radius);background:var(--background);min-height:80px;align-items:center;justify-content:center}.word-bank.drag-over{background:var(--secondary);border-color:var(--primary)}.draggable-word{display:inline-flex;align-items:center;justify-content:center;height:36px;padding:0 16px;background:var(--primary);color:#fff;border-radius:6px;cursor:grab;font-weight:600;font-size:1rem;box-shadow:0 2px 4px #00000026;touch-action:none}.draggable-word:active{cursor:grabbing;transform:scale(.95)}.drop-zone .draggable-word{width:100%;height:100%;border-radius:4px;box-shadow:none;padding:0 12px}.flip-card{background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);min-height:300px;display:flex;align-items:center;justify-content:center;padding:2rem;cursor:pointer;box-shadow:var(--shadow);position:relative;text-align:center;font-size:1.5rem;transition:transform .3s}.flip-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg);border-color:var(--primary)}.flip-hint{position:absolute;bottom:1rem;font-size:.9rem;color:var(--text-muted)}.score-card{text-align:center;padding:2.5rem 1rem;background:var(--surface);border-radius:var(--radius);margin-bottom:2rem;border:1px solid var(--border);box-shadow:var(--shadow);border-top:6px solid var(--primary)}.score-circle{width:150px;height:150px;border-radius:50%;background:var(--secondary);color:var(--primary);display:flex;align-items:center;justify-content:center;font-size:3rem;font-weight:800;margin:0 auto 1rem;border:8px solid var(--primary)}.chart-container{display:flex;align-items:flex-end;justify-content:center;gap:12px;height:160px;margin-top:1.5rem;padding-top:2rem;border-top:1px solid var(--border)}.chart-bar-wrapper{display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;width:35px;position:relative;cursor:pointer}.chart-bar{width:100%;background-color:var(--primary);border-radius:4px 4px 0 0;transition:height .4s ease,background-color .2s;min-height:4px;box-shadow:0 2px 4px #0000001a}.chart-bar-wrapper:hover .chart-bar{background-color:var(--accent)}.chart-label{font-size:.75rem;color:var(--text-muted);margin-top:6px;font-weight:600}.chart-tooltip{position:absolute;top:-30px;background:var(--text-main);color:var(--background);font-size:.8rem;padding:4px 8px;border-radius:6px;opacity:0;transition:opacity .2s,transform .2s;transform:translateY(5px);pointer-events:none;white-space:nowrap;font-weight:600;z-index:10}.chart-tooltip:after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border-width:5px;border-style:solid;border-color:var(--text-main) transparent transparent transparent}.chart-bar-wrapper:hover .chart-tooltip{opacity:1;transform:translateY(0)}.results-list{display:flex;flex-direction:column;gap:1rem}.result-item{padding:1.25rem;border-radius:var(--radius);border:1px solid var(--border);background:var(--surface)}.result-item.correct{border-left:6px solid var(--success)}.result-item.partial{border-left:6px solid var(--accent)}.result-item.incorrect{border-left:6px solid var(--danger)}.result-q{font-weight:600;margin-bottom:.5rem;font-size:1.1rem}.result-a{display:flex;flex-direction:column;gap:.25rem;font-size:.95rem}.text-success{color:var(--success);font-weight:600}.text-partial{color:var(--accent);font-weight:600}.text-danger{color:var(--danger);font-weight:600}.diff-selector{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:1rem;margin:1.5rem 0}.diff-option{border:2px solid var(--border);border-radius:var(--radius);padding:1rem;cursor:pointer;transition:all .2s;position:relative;background:var(--surface)}.diff-option:hover{border-color:var(--primary)}.diff-option.selected{border-color:var(--primary);background:#0d94880d}.diff-option h4{color:var(--text-main);margin-bottom:.25rem}.diff-option p{font-size:.85rem;color:var(--text-muted);margin:0}.diff-radio{position:absolute;top:1rem;right:1rem;accent-color:var(--primary);transform:scale(1.2);cursor:pointer}.modal-overlay{display:none;position:fixed;top:0;left:0;width:100dvw;height:100dvh;background:#0009;z-index:1000;justify-content:center;align-items:center;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-overlay.active{display:flex;animation:modalFadeIn .2s ease}@keyframes modalFadeIn{0%{opacity:0}to{opacity:1}}.modal-content{background:var(--surface);padding:2rem;border-radius:16px;width:90%;max-width:600px;box-shadow:0 20px 60px #0000004d;border:1px solid var(--border);max-height:90vh;overflow-y:auto;animation:modalSlideUp .3s ease}@keyframes modalSlideUp{0%{opacity:0;transform:translateY(30px) scale(.95)}to{opacity:1;transform:translateY(0) scale(1)}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;padding-bottom:1rem;border-bottom:2px solid var(--border)}.modal-header h2{margin:0;color:var(--primary);font-size:1.5rem;font-weight:800}.modal-header .btn-icon{color:var(--text-muted)}.modal-header .btn-icon:hover{color:var(--danger);background:#dc26261a}.empty-state{text-align:center;padding:4rem 1rem;color:var(--text-muted)}.selection-toolbar{display:none;gap:.5rem;flex-wrap:wrap;width:100%;background:#fee2e2;padding:.75rem;border-radius:8px;border:1px solid #fecaca;align-items:center}body.dark .selection-toolbar{background:#450a0a;border-color:#7f1d1d}.ai-prompt-box{background:var(--background);border:1px solid var(--border);border-radius:8px;padding:1rem;margin-bottom:1.5rem}.ai-prompt-box h4{margin-bottom:.5rem;color:var(--primary);display:flex;align-items:center;gap:6px}#import-warning{display:none;padding:.6rem .75rem;border-radius:8px;font-size:.95rem;margin-bottom:.75rem}body:not(.dark) #import-warning{background:#ef44441f;border:1px solid rgba(239,68,68,.25);color:#581011}body.dark #import-warning{background:#8b0f0f38;border:1px solid rgba(239,68,68,.45);color:#fff}.settings-row{display:flex;justify-content:space-between;align-items:center;margin-bottom:.5rem}.settings-slider{width:100%;margin-bottom:1.5rem;accent-color:var(--primary);cursor:pointer}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--background);padding:1rem}.auth-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:2.5rem 2rem;width:100%;max-width:420px;box-shadow:var(--shadow-lg);border-top:6px solid var(--primary);text-align:center}.auth-card .brand{justify-content:center;font-size:1.75rem;margin-bottom:.5rem}.auth-card .auth-subtitle{color:var(--text-muted);margin-bottom:2rem;font-size:.95rem}.auth-divider{display:flex;align-items:center;gap:1rem;margin:1.5rem 0;color:var(--text-muted);font-size:.85rem}.auth-divider:before,.auth-divider:after{content:"";flex:1;height:1px;background:var(--border)}.auth-input{width:100%;padding:.85rem 1rem;border:1px solid var(--border);border-radius:8px;font-size:1rem;background:var(--background);color:var(--text-main);margin-bottom:.75rem;transition:border-color .2s}.auth-input:focus{outline:none;border-color:var(--primary);box-shadow:0 0 0 3px #0d948826}.google-btn{width:100%;padding:.85rem;border-radius:8px;font-weight:600;cursor:pointer;border:1px solid var(--border);background:var(--surface);color:var(--text-main);display:flex;align-items:center;justify-content:center;gap:10px;font-size:1rem;transition:all .2s}.google-btn:hover{background:var(--secondary-hover);border-color:var(--primary)}.auth-error{background:#fee2e2;color:#dc2626;padding:.6rem .8rem;border-radius:8px;margin-bottom:1rem;font-size:.9rem}body.dark .auth-error{background:#7f1d1d;color:#fca5a5}.auth-toggle{margin-top:1.5rem;color:var(--text-muted);font-size:.9rem}.auth-toggle button{background:none;border:none;color:var(--primary);font-weight:700;cursor:pointer;font-size:.9rem;text-decoration:underline}.auth-success{background:#d1fae5;color:#065f46;padding:.75rem 1rem;border-radius:8px;margin-bottom:1rem;font-size:.9rem;line-height:1.5;text-align:left}body.dark .auth-success{background:#064e3b;color:#6ee7b7}.auth-info-box{background:#eff6ff;color:#1e40af;border:1px solid #bfdbfe;padding:.65rem .85rem;border-radius:8px;margin-bottom:.75rem;font-size:.82rem;line-height:1.5;text-align:left}body.dark .auth-info-box{background:#1e3a5f;color:#93c5fd;border-color:#1d4ed8}.auth-forgot{background:none;border:none;color:var(--text-muted);font-size:.85rem;cursor:pointer;text-decoration:underline;padding:0}.auth-forgot:hover{color:var(--primary)}.user-pill{display:flex;align-items:center;gap:8px;background:var(--secondary);border:1px solid var(--border);border-radius:999px;padding:.3rem .75rem .3rem .3rem;cursor:pointer;transition:.2s;max-width:180px}.user-pill:hover{border-color:var(--primary);background:var(--secondary-hover)}.user-pill img{width:28px;height:28px;border-radius:50%;object-fit:cover}.user-pill .user-avatar-fallback{width:28px;height:28px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:.8rem}.user-pill span{font-weight:600;font-size:.85rem;color:var(--text-main);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.logout-menu{position:absolute;top:calc(100% + 8px);right:0;background:var(--surface);border:1px solid var(--border);border-radius:12px;box-shadow:0 8px 24px #0000001f;min-width:240px;z-index:1000;animation:slideDown .2s ease;overflow:hidden}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.logout-menu-header{display:flex;align-items:center;gap:12px;padding:1rem;background:var(--background)}.logout-menu-avatar{width:40px;height:40px;border-radius:50%;object-fit:cover;border:2px solid var(--primary)}.logout-menu-avatar-fallback{width:40px;height:40px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:1rem;border:2px solid var(--primary)}.logout-menu-name{font-weight:700;font-size:.9rem;color:var(--text-main);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px}.logout-menu-email{font-size:.75rem;color:var(--text-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:160px}.logout-menu-divider{height:1px;background:var(--border)}.logout-menu-btn{width:100%;padding:.75rem 1rem;border:none;background:transparent;color:var(--text-main);font-weight:600;font-size:.9rem;cursor:pointer;display:flex;align-items:center;gap:10px;transition:background .2s;text-align:left}.logout-menu-btn:hover{background:var(--secondary)}.logout-menu-btn:last-child{color:var(--danger)}body.dark .logout-menu-btn:last-child{color:#fca5a5}body.dark .logout-menu-btn:hover{background:var(--secondary-hover)}.loading-screen{min-height:100vh;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:1rem;color:var(--text-muted)}.spinner{width:40px;height:40px;border:4px solid var(--border);border-top-color:var(--primary);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.tutorial-popup{background:var(--surface);border:2px solid var(--primary);border-radius:14px;box-shadow:0 8px 32px #0000002e;padding:1rem;animation:fadeIn .2s ease;z-index:9001}@keyframes tutPing{0%{transform:scale(1)}40%{transform:scale(1.18)}70%{transform:scale(.96)}to{transform:scale(1)}}@keyframes tutRing{0%{transform:scale(1);opacity:.8}to{transform:scale(1.9);opacity:0}}.tut-toggle-label{font-size:.72rem;font-weight:800;letter-spacing:.5px}@media (max-width: 768px){.tut-toggle-label{display:none}.tut-toggle-btn{padding:.3rem .45rem!important;gap:4px!important}}@media (max-width: 768px){.tutorial-popup{padding:.85rem;border-radius:12px;box-shadow:0 12px 40px #00000040}.tutorial-popup .modal-header{margin-bottom:.6rem}.tutorial-popup .modal-header span{font-size:.88rem}.tutorial-popup>div:nth-child(2){padding:.65rem;min-height:70px;margin-bottom:.6rem}.tutorial-popup>div:nth-child(2) p{font-size:.82rem;line-height:1.5}.tutorial-popup>div:nth-child(3){gap:4px;margin-bottom:.6rem}.tutorial-popup>div:nth-child(4){gap:.4rem}.tutorial-popup>div:nth-child(4) button{padding:.35rem;font-size:.78rem}.tutorial-popup>p{font-size:.68rem;margin-top:.4rem}}.toast{position:fixed;top:50dvh;left:50dvw;transform:translate(-50%,-50%) scale(1);background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:2rem 2.5rem 0;display:flex;flex-direction:column;align-items:center;gap:1rem;box-shadow:0 20px 60px #00000040;z-index:10000;min-width:280px;max-width:380px;text-align:center;overflow:hidden;animation:toastPop .35s cubic-bezier(.34,1.56,.64,1) forwards,toastFadeOut .4s ease 9.6s forwards;font-weight:600;font-size:1rem;line-height:1.5}.toast-progress-track{width:calc(100% + 5rem);margin-left:-2.5rem;margin-right:-2.5rem;height:4px;background:var(--border);flex-shrink:0;margin-top:.5rem}.toast-progress-fill{height:100%;animation:toastProgress 10s linear forwards;transform-origin:left}@keyframes toastPop{0%{opacity:0;transform:translate(-50%,-50%) scale(.7)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes toastFadeOut{0%{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(.85)}}.toast-icon{display:flex;align-items:center;justify-content:center}.toast-draw{stroke-dasharray:60;stroke-dashoffset:60;animation:drawStroke .5s ease .15s forwards}@keyframes drawStroke{to{stroke-dashoffset:0}}.toast-svg-pulse{animation:toastPulse 1s ease-in-out infinite}@keyframes toastPulse{0%,to{transform:scale(1)}50%{transform:scale(1.08)}}.toast-success{border-top:4px solid var(--success)}.toast-error{border-top:4px solid var(--danger)}.toast-info{border-top:4px solid var(--primary)}.toast>span{padding-bottom:.75rem}.toast-dismiss{position:absolute;top:.75rem;right:.75rem;background:transparent;border:none;cursor:pointer;color:var(--text-muted);padding:.25rem;border-radius:6px;display:flex;align-items:center;justify-content:center;transition:color .15s,background .15s}.toast-dismiss:hover{color:var(--text-main);background:var(--secondary)}@keyframes toastBackdropFade{0%{opacity:1}to{opacity:0}}@keyframes toastProgress{0%{transform:scaleX(1)}to{transform:scaleX(0)}}@media (max-width: 768px){.toast{min-width:240px;max-width:85vw;padding:1.5rem 1.75rem 0;font-size:.95rem;border-radius:14px}.toast-progress-track{width:calc(100% + 3.5rem);margin-left:-1.75rem;margin-right:-1.75rem}}.sync-badge{font-size:.7rem;padding:.2rem .5rem;border-radius:999px;font-weight:700;display:inline-flex;align-items:center;gap:4px}.sync-badge.syncing{background:#fef3c7;color:#92400e}.sync-badge.synced{background:#d1fae5;color:#065f46}.sync-badge.error{background:#fee2e2;color:#dc2626}body.dark .sync-badge.syncing{background:#78350f;color:#fde68a}body.dark .sync-badge.synced{background:#064e3b;color:#6ee7b7}body.dark .sync-badge.error{background:#7f1d1d;color:#fca5a5}@media (max-width: 768px){header{padding:.6rem .85rem;gap:.5rem}.brand{font-size:1rem;gap:6px}.brand-text-full{display:none}.brand-logo{height:32px;width:32px}.header-actions{gap:.3rem;flex-wrap:nowrap}.header-actions .btn{display:none}.header-actions .btn-icon{padding:.4rem;border-radius:8px}.header-actions .btn-icon svg{width:18px;height:18px}.sync-badge{display:none}.user-pill{padding:.25rem .6rem .25rem .25rem;max-width:120px;border-radius:20px}.user-pill span{font-size:.75rem}.user-pill img,.user-pill .user-avatar-fallback{width:24px;height:24px;font-size:.7rem}.container{margin:.75rem auto;padding:0 .65rem}.dashboard-header{flex-direction:column;align-items:stretch;gap:.6rem;margin-bottom:1rem}.dashboard-header>div:first-child h1{font-size:1.2rem}.dashboard-header>div:first-child p{font-size:.82rem;margin-top:.2rem}.dashboard-actions{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.dashboard-actions .btn{font-size:.78rem;padding:.45rem .4rem}.dashboard-actions .btn:last-child{grid-column:1 / -1}.dashboard-stats{grid-template-columns:repeat(3,1fr);gap:.4rem;margin-bottom:1rem}.stat-card{padding:.6rem .4rem;border-bottom-width:3px}.stat-value{font-size:1.2rem}.stat-label{font-size:.6rem;letter-spacing:0}.dashboard-controls{flex-direction:column;gap:.4rem;margin-bottom:1rem}.search-bar,.sort-select{min-width:unset;width:100%}.form-control{padding:.6rem .75rem;font-size:.9rem}.sets-grid{grid-template-columns:1fr;gap:.75rem}.set-card{padding:.9rem 1rem}.set-card h3{font-size:1rem}.set-card p{font-size:.82rem;margin-bottom:.9rem}.set-actions{gap:.4rem}.set-actions .btn{padding:.45rem .5rem;font-size:.82rem}.editor-toolbar-row{flex-direction:column!important;gap:.5rem!important}.editor-toolbar-row>div{width:100%;display:flex;flex-wrap:wrap;gap:.4rem}.editor-toolbar-row .btn{flex:1;font-size:.8rem;padding:.4rem .5rem}.edit-card{padding:.9rem}.edit-card-header{flex-direction:column;align-items:flex-start;gap:.5rem}.card-controls{width:100%;display:flex;gap:.25rem}.type-toggle{width:100%;justify-content:stretch;flex-wrap:wrap}.type-btn{flex:1;text-align:center;padding:.35rem .3rem;font-size:.75rem;min-width:70px}.mcq-row{gap:.5rem;flex-wrap:wrap}.mcq-row input[type=radio],.mcq-row input[type=checkbox]{flex-shrink:0}.mcq-row input[type=text]{font-size:.9rem;flex:1;min-width:120px}textarea.form-control{min-height:60px}.quiz-container{padding:1rem .9rem;max-width:100%;margin:0 auto}.progress-header{font-size:.9rem}.question-text{font-size:1rem;line-height:1.9;margin-bottom:1.25rem;word-break:break-word}.quiz-options{gap:.65rem}.quiz-option{padding:.75rem 1rem;font-size:.95rem;word-break:break-word}.quiz-text-answer{font-size:1rem;padding:.75rem}.quiz-nav{flex-direction:column;gap:.6rem;margin-top:1.25rem;padding-top:1.25rem}.quiz-nav .btn{width:100%;padding:.7rem;font-size:.95rem}.progress-bar{margin-bottom:1.25rem;height:6px}.timer-badge{display:inline-flex!important;font-size:.95rem;padding:.3rem .75rem}.flip-card{min-height:200px;font-size:1.1rem;padding:1.25rem 1rem;word-break:break-word}.flip-hint{font-size:.78rem;bottom:.75rem}.flip-card .btn-icon{top:.75rem;right:.75rem;padding:.35rem}.word-bank{padding:.9rem;gap:6px;min-height:60px;flex-wrap:wrap;justify-content:flex-start}.draggable-word{height:32px;padding:0 10px;font-size:.85rem;flex-shrink:0}.drop-zone{min-width:70px;height:32px;margin:0 2px}.drop-zone .draggable-word{margin:0}.score-card{padding:1.5rem .75rem;margin-bottom:1.5rem}.score-circle{width:110px;height:110px;font-size:2.1rem;border-width:6px;margin:0 auto 1rem}.score-card h2{font-size:1.2rem;margin-bottom:1rem}.score-card>p{font-size:1rem;margin-bottom:1.25rem}.score-card>div{gap:.5rem;flex-wrap:wrap}.score-card .btn{flex:1;min-width:0;font-size:.82rem;padding:.5rem .4rem}.result-item{padding:.9rem;margin-bottom:.75rem}.result-q{font-size:.95rem;word-break:break-word}.result-a{font-size:.85rem}.chart-container{gap:6px;height:120px;margin-top:1rem}.chart-bar-wrapper{width:26px}.chart-label{font-size:.65rem}.diff-selector{grid-template-columns:1fr;gap:.6rem;margin:1rem 0}.diff-option{padding:.75rem}.diff-option h4{font-size:.95rem}.diff-option p{font-size:.8rem}.quiz-container>div[style*=grid]{grid-template-columns:1fr!important}.modal-overlay{align-items:flex-end;height:100dvh}.modal-content{padding:1.5rem 1.25rem;width:100%;border-radius:20px 20px 0 0;max-height:88vh}.modal-content[style*="maxWidth: 450"],.modal-content[style*="max-width: 450"]{border-radius:16px;width:92%}.modal-overlay:has(.modal-content[style*="maxWidth: 450"]),.modal-overlay:has(.modal-content[style*="max-width: 450"]){align-items:center}.modal-header{position:relative;flex-direction:row;align-items:center;gap:0}.modal-header h2{font-size:1.2rem}.modal-header .btn-icon{margin-left:auto;padding:.3rem}.ai-prompt-box{padding:.75rem}.input-group label{font-size:.85rem}.auth-page{padding:1rem .75rem}.auth-card{padding:1.75rem 1.25rem;width:100%;max-width:100%}.auth-card .brand{font-size:1.4rem;margin-bottom:.75rem}.auth-card .auth-subtitle{font-size:.9rem;margin-bottom:1.5rem}.auth-input{padding:.75rem .9rem;font-size:1rem;margin-bottom:.6rem}.google-btn{padding:.75rem;font-size:.95rem}.auth-divider{margin:1.25rem 0}.auth-toggle{font-size:.85rem}.empty-state{padding:2.5rem 1rem}.empty-state svg{width:48px;height:48px}.empty-state h3{font-size:1.1rem}.empty-state p{font-size:.9rem}.settings-row{flex-direction:column;align-items:flex-start;gap:.5rem}.settings-slider{width:100%}}@media (max-width: 480px){header{padding:.5rem .6rem}.brand{font-size:.9rem}.brand-logo{height:28px;width:28px}.container{padding:0 .5rem;margin:.5rem auto}.dashboard-header>div:first-child h1{font-size:1.1rem}.dashboard-stats{grid-template-columns:repeat(3,1fr);gap:.3rem}.stat-card{padding:.5rem .3rem}.stat-value{font-size:1rem}.stat-label{font-size:.5rem}.sets-grid{gap:.6rem}.set-card{padding:.75rem .9rem}.set-card h3{font-size:.95rem}.set-card p{font-size:.75rem;margin-bottom:.75rem}.set-actions .btn{font-size:.75rem;padding:.4rem .35rem}.type-btn{font-size:.7rem;padding:.3rem .2rem;min-width:60px}.quiz-option{padding:.65rem .85rem;font-size:.9rem}.quiz-text-answer{font-size:.95rem;padding:.65rem}.flip-card{min-height:180px;font-size:1rem;padding:1rem .85rem}.score-circle{width:95px;height:95px;font-size:1.8rem;border-width:5px}.score-card h2{font-size:1.1rem}.score-card>p{font-size:.95rem}.score-card .btn{font-size:.75rem;padding:.45rem .3rem}.modal-content{padding:1.25rem 1rem}.modal-header h2{font-size:1.15rem}.auth-card{padding:1.5rem 1rem}.auth-card .brand{font-size:1.25rem}.auth-input{font-size:.95rem}.draggable-word{height:28px;padding:0 8px;font-size:.8rem}.drop-zone{min-width:60px;height:28px}.word-bank{padding:.75rem;gap:5px}.result-item{padding:.75rem}.result-q{font-size:.9rem}.result-a{font-size:.8rem}.chart-container{gap:4px;height:100px}.chart-bar-wrapper{width:22px}.chart-label{font-size:.6rem}}@media (max-width: 360px){.brand{font-size:.85rem;gap:4px}.brand-logo{height:24px;width:24px}.dashboard-actions{grid-template-columns:1fr}.dashboard-actions .btn{grid-column:unset}.stat-value{font-size:.95rem}.stat-label{font-size:.48rem}.type-btn{font-size:.65rem;padding:.25rem .15rem}.quiz-option{font-size:.85rem;padding:.6rem .75rem}.score-circle{width:85px;height:85px;font-size:1.6rem}.modal-content{width:98%;padding:1rem .9rem}.auth-card{padding:1.25rem .9rem}}