.auth-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);padding:20px}.auth-card{background:#fff;border-radius:16px;padding:40px;width:100%;max-width:440px;box-shadow:0 20px 60px #0000004d}.auth-title{text-align:center;font-size:32px;margin:0 0 10px;color:#333}.auth-subtitle{text-align:center;font-size:20px;margin:0 0 30px;color:#666;font-weight:500}.auth-form{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-group label{font-weight:600;color:#333;font-size:14px}.form-group input{padding:12px 16px;border:2px solid #e0e0e0;border-radius:8px;font-size:15px;transition:all .2s}.form-group input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.auth-error{background:#fee;border:1px solid #fcc;color:#c33;padding:12px;border-radius:8px;font-size:14px;text-align:center}.auth-button{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;padding:14px;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s;margin-top:10px}.auth-button:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 20px #667eea66}.auth-button:disabled{opacity:.6;cursor:not-allowed}.auth-switch{text-align:center;margin-top:20px;color:#666;font-size:14px}.auth-link{color:#667eea;font-weight:600;cursor:pointer;text-decoration:none}.auth-link:hover{text-decoration:underline}@media(max-width:480px){.auth-card{padding:30px 20px}.auth-title{font-size:28px}.auth-subtitle{font-size:18px}}.media-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px;padding:20px}.media-card{position:relative;border-radius:12px;overflow:hidden;cursor:pointer;height:320px;box-shadow:0 2px 8px #00000026;transition:all .3s cubic-bezier(.4,0,.2,1)}.media-card:hover{transform:translateY(-5px);box-shadow:0 8px 20px #00000040}.border-watching{border-left:5px solid #28a745}.border-completed{border-left:5px solid #007bff}.border-plan{border-left:5px solid #ffc107}.card-poster{width:100%;height:100%;position:relative;overflow:hidden}.poster-image{width:100%;height:100%;object-fit:cover;transition:transform .4s ease}.media-card:hover .poster-image{transform:scale(1.08)}.poster-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-size:14px;font-weight:600}.card-overlay{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.95) 0%,rgba(0,0,0,.85) 70%,transparent 100%);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);padding:20px 15px 15px;transform:translateY(calc(100% - 50px));transition:all .4s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;justify-content:flex-end}.media-card:hover .card-overlay{transform:translateY(0)}.overlay-content{display:flex;flex-direction:column;gap:12px;height:100%;justify-content:space-between}.overlay-info{flex:1}.overlay-info h3{color:#fff;margin:0 0 8px;font-size:16px;line-height:1.3}.status-badge{display:inline-block;padding:4px 12px;border-radius:12px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px}.status-watching{background:#28a745;color:#fff}.status-completed{background:#007bff;color:#fff}.status-plan{background:#ffc107;color:#333}.type-text{color:#ffffffd9;font-size:12px;margin:4px 0}.card-actions{display:flex;gap:8px;opacity:0;transform:translateY(10px);transition:all .3s ease .15s}.media-card:hover .card-actions{opacity:1;transform:translateY(0)}.card-actions button{flex:1;padding:10px;border:none;border-radius:6px;cursor:pointer;background-color:#007bff;color:#fff;font-size:13px;font-weight:600;transition:all .2s}.card-actions button:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000004d}.card-actions button:active{transform:translateY(0)}.card-actions button:last-child{background-color:#dc3545}@media(max-width:768px){.media-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:15px;padding:15px}.media-card{height:250px}.overlay-info h3{font-size:14px}.type-text{font-size:11px}}.modal-card{background-color:#f9f9f9;padding:25px;border-radius:10px;width:400px;max-width:90%;box-shadow:0 5px 20px #0000004d;position:relative;animation:modalFadeIn .2s ease-in-out}.modal-card{background-color:#f9f9f9;padding:25px;border-radius:10px;width:400px;max-width:90%;box-shadow:0 5px 20px #0000004d;position:relative;animation:modalFadeIn .2s ease-in-out;max-height:90vh;overflow-y:auto}.add-button-container{display:flex;justify-content:center;margin:20px 0}.add-button{background-color:#28a745;color:#fff;font-size:18px;padding:12px 20px;border:none;border-radius:8px;cursor:pointer;box-shadow:0 2px 6px #00000026;transition:transform .2s,box-shadow .2s}.add-button:hover{transform:translateY(-3px);box-shadow:0 5px 15px #0003}.modal{position:fixed;z-index:100;inset:0;width:100%;height:100%;background-color:#00000080;display:flex;justify-content:center;align-items:center}.modal-card{background-color:#f9f9f9;padding:25px;border-radius:10px;width:400px;max-width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 5px 20px #0000004d;position:relative;animation:modalFadeIn .2s ease-in-out}.modal-card .close{position:absolute;top:10px;right:15px;font-size:28px;font-weight:700;color:#888;cursor:pointer}@keyframes modalFadeIn{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.media-form{display:flex;flex-direction:column;gap:15px;font-family:Arial,sans-serif}.media-form .form-title{text-align:center;font-size:22px;margin-bottom:10px;color:#333}.media-form .form-group{display:flex;flex-direction:column}.media-form label{margin-bottom:5px;font-weight:700}.media-form input,.media-form select{padding:10px;border-radius:6px;border:1px solid #ccc;font-size:16px}.media-form input:focus,.media-form select:focus{outline:none;border-color:#28a745;box-shadow:0 0 5px #28a74580}.media-form .form-submit{background-color:#28a745;color:#fff;font-size:18px;padding:12px;border:none;border-radius:8px;cursor:pointer;margin-top:10px;transition:transform .2s,box-shadow .2s}.media-form .form-submit:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0003}.floating-filters{position:fixed;bottom:30px;right:30px;display:flex;flex-direction:column;gap:15px;z-index:50}.filter-btn{background:transparent;border:none;color:#0006;font-size:45px;cursor:pointer;padding:8px;transition:all .3s cubic-bezier(.4,0,.2,1);filter:grayscale(.8);opacity:.6;line-height:1}.filter-btn:hover{opacity:.8;transform:scale(1.08);filter:grayscale(.5)}.filter-btn.active{filter:grayscale(0);opacity:1;transform:scale(1.25);text-shadow:0 3px 12px rgba(0,0,0,.15)}.filter-btn.active:hover{transform:scale(1.28)}@media(max-width:768px){.floating-filters{bottom:20px;right:20px;gap:12px}.filter-btn{font-size:38px}}input,button,label{margin-top:10px}.modal{position:fixed;z-index:1;left:0;top:0;right:0;width:100%;height:100%;overflow:auto;background-color:#0006}.modal-content{background-color:#fefefe;margin:10% auto;padding:20px;border:1px solid #888;width:80%}.close{color:#888;float:right;font-size:28px;font-weight:700}
