.flashcard-browser{background:#fff;border-radius:12px;padding:25px;box-shadow:0 2px 8px rgba(0,0,0,.1)}.browser-header{margin-bottom:25px}.browser-header h2{font-size:24px;font-weight:700;color:#1f2937;margin-bottom:5px}.browser-header p{color:#6b7280;font-size:14px}.browser-controls{display:flex;gap:15px;margin-bottom:25px;flex-wrap:wrap}.browser-controls input{flex:1;min-width:200px}.browser-controls input,.browser-controls select{padding:10px 15px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px}.browser-controls select{background:#fff;cursor:pointer}.flashcard-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px}.flashcard-card{perspective:1000px;height:200px}.flashcard-inner{position:relative;width:100%;height:100%;text-align:center;transition:transform .6s;transform-style:preserve-3d;cursor:pointer}.flashcard-inner.flipped{transform:rotateY(180deg)}.flashcard-back,.flashcard-front{position:absolute;width:100%;height:100%;backface-visibility:hidden;border-radius:10px;padding:20px;display:flex;flex-direction:column;justify-content:center;align-items:center;box-shadow:0 4px 6px rgba(0,0,0,.1)}.flashcard-front{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.flashcard-back{background:#fff;color:#1f2937;transform:rotateY(180deg);border:2px solid #667eea}.flashcard-actions{position:absolute;top:10px;right:10px;display:flex;gap:5px;z-index:10}.flashcard-actions button{background:hsla(0,0%,100%,.9);border:none;border-radius:5px;padding:5px 10px;cursor:pointer;font-size:12px;transition:background .3s}.flashcard-actions button:hover{background:#fff}.flashcard-editor{background:#fff;border-radius:12px;box-shadow:0 2px 8px rgba(0,0,0,.1);max-width:800px;margin:0 auto}.editor-header{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:25px;border-radius:12px 12px 0 0}.editor-header p{opacity:.9}.editor-form{padding:25px}.form-group{margin-bottom:20px}.form-group label{display:block;margin-bottom:8px;font-size:14px;font-weight:600;color:#374151}.form-group input,.form-group select,.form-group textarea{width:100%;padding:10px 15px;border:1px solid #e5e7eb;border-radius:8px;font-size:14px;font-family:inherit;transition:border-color .3s}.form-group input:focus,.form-group select:focus,.form-group textarea:focus{outline:none;border-color:#667eea}.form-group textarea{min-height:120px;resize:vertical}.form-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:25px}.form-actions button{padding:10px 20px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s}.btn-primary{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-primary:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(102,126,234,.4)}.btn-secondary{background:#f3f4f6;color:#374151}.btn-secondary:hover{background:#e5e7eb}.rich-text-editor{display:flex;gap:20px;height:100%}.notes-list{width:250px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:20px;overflow-y:auto}.notes-list h3{font-size:16px;font-weight:600;margin-bottom:15px;color:#1f2937}.note-item{padding:12px;margin-bottom:10px;border-radius:8px;background:#f9fafb;cursor:pointer;transition:all .3s}.note-item:hover{background:#f3f4f6;transform:translateX(5px)}.note-item.active{background:#667eea;color:#fff}.note-item h4{font-size:14px;font-weight:600;margin-bottom:4px}.note-item p{font-size:12px;opacity:.7}.editor-container{flex:1;background:#fff;border:1px solid #e5e7eb;border-radius:12px;padding:25px;display:flex;flex-direction:column}.editor-header{margin-bottom:20px}.editor-header h2{font-size:24px;font-weight:700;color:#1f2937;margin-bottom:5px}.editor-header p{color:#6b7280;font-size:14px}.editor-toolbar{display:flex;gap:5px;padding:10px;background:#f9fafb;border-radius:8px;margin-bottom:15px;flex-wrap:wrap}.editor-toolbar button{padding:8px 12px;border:1px solid #e5e7eb;background:#fff;border-radius:6px;cursor:pointer;font-size:14px;transition:all .3s}.editor-toolbar button:hover{background:#f3f4f6;border-color:#667eea}.editor-content{flex:1;border:1px solid #e5e7eb;border-radius:8px;padding:15px;min-height:300px;font-size:14px;line-height:1.6;overflow-y:auto}.editor-content:focus{outline:none;border-color:#667eea}.editor-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:15px}.editor-actions button{padding:10px 20px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .3s}.btn-save{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-save:hover{transform:translateY(-2px);box-shadow:0 4px 8px rgba(102,126,234,.4)}.btn-cancel{background:#f3f4f6;color:#374151}.btn-cancel:hover{background:#e5e7eb}