:root{--bg: #f9fafb;--text: #1f2937;--card: #ffffff;--border: #d1d5db;--shadow: 0 2px 8px rgba(0, 0, 0, .1)}:root[data-theme=dark]{--bg: #0f141a;--text: #e5e7eb;--card: #1a1f25;--border: #374151;--shadow: 0 4px 14px rgba(0, 0, 0, .6)}html,body{margin:0;padding:0;background:var(--bg);color:var(--text);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;min-height:100%}.app-header,.app-footer{padding:16px 20px;background:var(--card);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between}.app-footer{border-top:1px solid var(--border);border-bottom:none;justify-content:center;color:#9ca3af}.brand{margin:0;font-size:1.6rem}.theme-toggle,.logout-btn{background:var(--card);border:1px solid var(--border);padding:6px 14px;border-radius:20px;color:var(--text);cursor:pointer;margin-left:10px}.login-container{min-height:100vh;display:flex;align-items:center;justify-content:center;background:var(--bg)}.login-box{background:var(--card);padding:30px;border-radius:12px;box-shadow:var(--shadow);display:flex;flex-direction:column;width:100%;max-width:340px;border:1px solid var(--border)}.login-box h2{text-align:center;margin-bottom:20px;color:var(--text)}.login-box input{margin-bottom:14px;padding:10px;border-radius:8px;border:1px solid var(--border);font-size:1rem;background:var(--bg);color:var(--text)}.login-box button{background:#4f46e5;color:#fff;border:none;padding:10px;border-radius:8px;font-size:1rem;cursor:pointer;transition:background .3s ease}.login-box button:hover{background:#3730a3}.login-box .error{color:#ef4444;text-align:center;margin-top:10px}.gallery{display:grid;grid-template-columns:1fr;gap:14px;padding:18px}@media(min-width:640px){.gallery{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.gallery{grid-template-columns:repeat(3,1fr)}}@media(min-width:1440px){.gallery{grid-template-columns:repeat(4,1fr)}}.image-container{position:relative;width:100%;aspect-ratio:1 / 1;background:var(--card);border:1px solid var(--border);border-radius:10px;overflow:hidden;box-shadow:var(--shadow);cursor:zoom-in}.image-container img{width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .3s ease}.image-container img.loaded{opacity:1}.lightbox-overlay{position:fixed;inset:0;background:#000000f2;display:flex;align-items:center;justify-content:center;z-index:1000}.lightbox-center{max-width:100vw;max-height:100vh}.lightbox-img{width:100%;height:auto;max-height:100vh;object-fit:contain;display:block}.nav-zone{position:fixed;top:0;bottom:0;width:30%;background:transparent}.nav-zone.left{left:0}.nav-zone.right{right:0}@media(hover:hover)and (pointer:fine){.nav-zone.left:hover{cursor:w-resize}.nav-zone.right:hover{cursor:e-resize}}