*{margin:0;padding:0;box-sizing:border-box}:root{--black: #000000;--white: #FFFFFF;--accent: #00FF00;--bg: #0A0A0A;--text: #CCCCCC;--border: #333333;--font-body: "Space Grotesk", "Courier New", monospace}body{font-family:var(--font-body);background:var(--bg);color:var(--text);overflow:hidden;font-size:14px}.screen{width:100vw;height:100vh;position:relative}.hidden{display:none!important}#loginScreen{background:var(--black);display:flex;align-items:center;justify-content:center}.login-container{width:100%;max-width:400px;padding:2rem}.login-card{background:var(--bg);border:2px solid var(--accent);padding:2rem}.login-title{font-size:2.5rem;color:var(--accent);margin-bottom:.5rem;text-align:center;font-weight:700;text-transform:lowercase}.login-subtitle{text-align:center;color:var(--text);margin-bottom:2rem;font-size:.9rem}.login-form{display:flex;flex-direction:column;gap:1rem;margin-bottom:1rem}.form-field input{width:100%;padding:.75rem;background:var(--black);border:1px solid var(--border);color:var(--white);font-family:var(--font-body);font-size:.9rem}.form-field input:focus{outline:none;border-color:var(--accent)}.login-btn{width:100%;padding:.75rem;background:var(--accent);color:var(--black);border:none;font-family:var(--font-body);font-size:.9rem;font-weight:700;cursor:pointer;text-transform:lowercase}.login-btn:hover{background:var(--white)}.text-btn{background:none;border:none;color:var(--text);font-family:var(--font-body);font-size:.85rem;cursor:pointer;padding:.5rem;text-decoration:underline;width:100%;text-align:center}.text-btn:hover{color:var(--accent)}.stats-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-top:2rem;padding-top:1rem;border-top:1px solid var(--border)}.stat-item{display:flex;flex-direction:column;align-items:center;gap:.25rem}.stat-value{font-size:1.5rem;font-weight:700;color:var(--accent)}.stat-label{font-size:.75rem;color:var(--text);text-transform:lowercase}.main-header{background:var(--black);border-bottom:2px solid var(--accent);padding:1rem;display:flex;justify-content:space-between;align-items:center;position:relative;z-index:1001}.header-left{display:flex;align-items:center;gap:1rem}.sidebar-toggle{width:40px;height:40px;background:none;border:1px solid var(--border);color:var(--accent);cursor:pointer;display:flex;align-items:center;justify-content:center}.sidebar-toggle:hover{border-color:var(--accent);background:var(--accent);color:var(--black)}.app-title{font-size:1.25rem;color:var(--accent);font-weight:700;text-transform:lowercase}.header-right{display:flex;align-items:center;gap:1rem}.user-info span{color:var(--text);font-size:.9rem}.icon-btn{width:40px;height:40px;background:none;border:1px solid var(--border);color:var(--text);cursor:pointer;display:flex;align-items:center;justify-content:center}.icon-btn:hover{border-color:var(--accent);color:var(--accent)}.sidebar{position:fixed;top:0;left:0;width:300px;height:100vh;background:var(--black);border-right:2px solid var(--accent);z-index:2000;display:flex;flex-direction:column;transform:translate(0);transition:transform .3s ease}.sidebar.hidden{transform:translate(-100%)}.sidebar-header{padding:1rem;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center}.sidebar-header h2{font-size:1rem;color:var(--accent);text-transform:lowercase}.sidebar-search{padding:1rem;border-bottom:1px solid var(--border)}.sidebar-search input{width:100%;padding:.5rem;background:var(--bg);border:1px solid var(--border);color:var(--white);font-family:var(--font-body);font-size:.85rem}.sidebar-search input:focus{outline:none;border-color:var(--accent)}.sidebar-content{flex:1;overflow-y:auto;padding:.5rem}.sighting-item{padding:.75rem;border:1px solid var(--border);margin-bottom:.5rem;cursor:pointer;background:var(--bg)}.sighting-item:hover{border-color:var(--accent)}.sighting-item-header{display:flex;justify-content:space-between;align-items:start;margin-bottom:.5rem}.sighting-item-title{font-size:.9rem;color:var(--white);font-weight:700}.sighting-item-delete{background:none;border:none;color:red;cursor:pointer;font-size:1rem;padding:0;line-height:1}.sighting-item-delete:hover{color:#f66}.sighting-item-desc{font-size:.8rem;color:var(--text);margin-bottom:.5rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.sighting-item-meta{font-size:.75rem;color:var(--border)}.main-layout{position:relative;height:calc(100vh - 58px)}.map-container{width:100%;height:100%;position:relative}#map{width:100%;height:100%;background:var(--black)}.map-controls{position:absolute;top:1rem;right:1rem;z-index:1000;display:flex;flex-direction:column;gap:.5rem}.control-btn{width:40px;height:40px;background:var(--black);border:1px solid var(--accent);color:var(--accent);cursor:pointer;display:flex;align-items:center;justify-content:center}.control-btn:hover{background:var(--accent);color:var(--black)}.fab{position:absolute;bottom:2rem;right:2rem;padding:1rem 1.5rem;background:var(--accent);border:2px solid var(--accent);color:var(--black);font-family:var(--font-body);font-size:.9rem;font-weight:700;cursor:pointer;z-index:1000;text-transform:lowercase}.fab:hover{background:var(--white);border-color:var(--white)}.modal{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:3000;display:flex;align-items:center;justify-content:center;background:#000000e6}.modal-overlay{position:absolute;top:0;left:0;width:100%;height:100%}.modal-panel{position:relative;width:90%;max-width:600px;max-height:90vh;background:var(--bg);border:2px solid var(--accent);display:flex;flex-direction:column}.modal-header{padding:1rem;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;background:var(--black)}.modal-header h2{font-size:1rem;color:var(--accent);text-transform:lowercase}.modal-content{padding:1.5rem;overflow-y:auto;flex:1}.form-section{display:flex;flex-direction:column;gap:1rem}.form-row{display:grid;gap:1rem}.input-group{display:flex;flex-direction:column;gap:.5rem}.input-group.full{grid-column:1 / -1}.input-group label{font-size:.85rem;color:var(--accent);text-transform:lowercase}.input-group input,.input-group textarea{width:100%;padding:.75rem;background:var(--black);border:1px solid var(--border);font-family:var(--font-body);font-size:.9rem;color:var(--white);resize:vertical}.input-group input:focus,.input-group textarea:focus{outline:none;border-color:var(--accent)}.input-with-btn{display:flex;gap:0}.input-with-btn input{flex:1;border-right:none}.inline-btn{width:40px;background:var(--black);border:1px solid var(--border);color:var(--accent);cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:1.2rem}.inline-btn:hover{background:var(--accent);color:var(--black);border-color:var(--accent)}.mini-map{width:100%;height:250px;border:1px solid var(--border);background:var(--black)}.input-hint{font-size:.75rem;color:var(--border);font-style:italic}.coords-display{font-size:.75rem;color:var(--accent);font-family:Courier New,monospace}.modal-actions{display:flex;gap:1rem;justify-content:flex-end;margin-top:1.5rem;padding-top:1.5rem;border-top:1px solid var(--border)}.action-btn{padding:.75rem 1.5rem;font-family:var(--font-body);font-size:.9rem;font-weight:700;text-transform:lowercase;cursor:pointer;border:1px solid var(--border)}.action-btn.secondary{background:var(--bg);color:var(--text)}.action-btn.secondary:hover{border-color:var(--accent);color:var(--accent)}.action-btn.primary{background:var(--accent);border-color:var(--accent);color:var(--black)}.action-btn.primary:hover{background:var(--white);border-color:var(--white)}.toast{position:fixed;top:80px;right:20px;background:var(--black);border:2px solid var(--accent);color:var(--accent);padding:1rem 1.5rem;z-index:4000;font-size:.9rem;max-width:300px;animation:slideIn .3s ease}@keyframes slideIn{0%{transform:translate(400px);opacity:0}to{transform:translate(0);opacity:1}}.toast.hidden{display:none}.leaflet-popup-content-wrapper{background:var(--black);border:2px solid var(--accent);border-radius:0;color:var(--text);padding:0}.leaflet-popup-tip{background:var(--black);border:2px solid var(--accent);border-top:none;border-right:none}.leaflet-popup-close-button{color:var(--accent)!important;font-size:1.5rem!important;font-weight:700!important}.sighting-popup{padding:1rem;font-family:var(--font-body)}.sighting-popup h3{font-size:1rem;font-weight:700;margin-bottom:.5rem;color:var(--accent);text-transform:lowercase}.sighting-popup p{margin:.5rem 0;font-size:.85rem;line-height:1.4}.sighting-popup strong{color:var(--accent);font-weight:700;text-transform:lowercase}.sighting-popup a{color:var(--accent);text-decoration:underline}.sighting-popup a:hover{color:var(--white)}.sighting-popup-delete{margin-top:.75rem;padding-top:.75rem;border-top:1px solid var(--border)}.delete-btn{padding:.5rem 1rem;background:red;border:none;color:var(--white);font-family:var(--font-body);font-size:.85rem;cursor:pointer;text-transform:lowercase}.delete-btn:hover{background:#f66}.loading-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background:#000000f2;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1rem;z-index:5000;color:var(--accent);font-size:.9rem}.spinner{width:40px;height:40px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media (max-width: 768px){.sidebar{width:100%}.fab{bottom:1rem;right:1rem;padding:.75rem 1.25rem;font-size:.85rem}.modal-panel{width:95%;max-height:95vh}}.leaflet-control-zoom a,.leaflet-control-attribution{background:var(--black)!important;border-color:var(--border)!important;color:var(--accent)!important}.leaflet-control-zoom a:hover{background:var(--accent)!important;color:var(--black)!important}.leaflet-control-attribution{font-size:.7rem!important}.confirm-panel{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:var(--bg);border:2px solid var(--accent);padding:2rem;min-width:350px;max-width:500px;z-index:10001}.confirm-content{margin-bottom:2rem}.confirm-content p{font-size:1rem;line-height:1.5;color:var(--text);margin:0}.confirm-actions{display:flex;gap:1rem;justify-content:flex-end}.action-btn.danger{background:red;color:#fff;border-color:red}.action-btn.danger:hover{background:#c00;border-color:#c00}
