.button-base{font-family:var(--font-primary);font-weight:900;background-color:var(--surface-bg-dim);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:inline-block;border-radius:var(--border-radius);border:1px solid grey;box-shadow:0 2px 8px #0003;cursor:pointer}.modal button,.modal input[type=submit]{font-family:var(--font-primary);font-weight:900;background-color:var(--surface-bg-dim);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);display:inline-block;list-style:none;height:45px;border-radius:var(--border-radius);margin:5px;border:1px solid grey;box-shadow:0 2px 8px #0003;cursor:pointer}.modal.delete-confirm button,.modal.rotate-key-confirm button{height:45px;padding:0 50px}.share-track-btn,.share-trip-btn{border:none;cursor:pointer;padding:5px;border-radius:50%;line-height:0;transition:background-color .2s ease-in-out;margin-left:auto;background:none;box-shadow:none}.share-track-btn:hover,.share-trip-btn:hover{background-color:var(--color-list-item-hover-bg)}.share-track-btn .material-symbols-outlined,.share-trip-btn .material-symbols-outlined{color:var(--brand-medium)}.share-track-btn.copied .material-symbols-outlined,.share-trip-btn.copied .material-symbols-outlined{color:var(--brand-green-dark)}.track-action-btn{flex-grow:1;display:flex;justify-content:center;align-items:center;gap:10px;cursor:pointer;text-decoration:none;padding:8px;border-radius:var(--border-radius);background-color:var(--surface-bg-dim-light);border:1px solid grey;transition:background-color .2s ease-in-out}.track-action-btn:hover{background-color:var(--color-list-item-hover-bg)}.track-action-btn.add{background-color:var(--brand-dark);border-color:var(--brand-dark)}.track-action-btn.add .label,.track-action-btn.add .material-symbols-outlined{color:var(--color-white)}.track-action-btn.add:hover{background-color:var(--brand-darker);border-color:var(--brand-darker)}.track-action-btn .label{font-family:var(--font-primary);font-size:.75em;text-transform:uppercase;font-weight:900;color:var(--text-dark)}.track-action-btn .material-symbols-outlined{font-size:1.5em}.toggle-tracks-btn{background-color:var(--surface-bg-dim-light);border:1px solid grey;border-radius:var(--border-radius);box-shadow:0 2px 8px #0003;cursor:pointer;padding:5px;line-height:0;transition:background-color .2s ease-in-out}.toggle-tracks-btn:hover{background-color:var(--color-list-item-hover-bg)}.toggle-tracks-btn.hidden{display:none}.toggle-tracks-btn .material-symbols-outlined{font-size:1.5em;color:var(--text-dark)}.delete-track-btn,.delete-trip-btn,.delete-boat-btn{position:absolute;right:5px;top:50%;transform:translateY(-50%);background:none;border:none;cursor:pointer;padding:5px;border-radius:50%;line-height:0}.delete-track-btn .material-symbols-outlined,.delete-trip-btn .material-symbols-outlined,.delete-boat-btn .material-symbols-outlined{color:var(--text-subtle)}.delete-track-btn:hover .material-symbols-outlined,.delete-trip-btn:hover .material-symbols-outlined,.delete-boat-btn:hover .material-symbols-outlined{color:var(--color-delete-hover)}.delete-btn-placeholder{width:35px;flex-shrink:0}.edit-track-btn{border:none;cursor:pointer}.edit-track-btn span{color:var(--text-light)}.edit-track-btn.save span{color:var(--brand-medium)}.auth-controls .logout-btn{text-decoration:none;padding:5px;line-height:0;transition:background-color .2s ease-in-out}.auth-controls .logout-btn:hover{background-color:var(--color-list-item-hover-bg)}.toggle-legend-btn{background:none;border:none;cursor:pointer;padding:2px;border-radius:50%;line-height:0}.toggle-legend-btn .material-symbols-outlined{font-size:1.25em;color:var(--text-light);transition:color .2s}.toggle-legend-btn:hover .material-symbols-outlined{color:var(--text-dark)}.multi-track-view .save-trip-btn{padding:8px 16px;font-size:.875em;background-color:var(--brand-green-dark);border-color:var(--brand-green-darker);color:var(--color-white);transition:background-color .2s ease-in-out,opacity .2s ease-in-out}.multi-track-view .save-trip-btn:hover{background-color:var(--brand-green-darker)}.create-trip-btn{bottom:10px;right:0;position:absolute}.multi-track-view .save-trip-btn:disabled{opacity:.7;cursor:not-allowed;background-color:var(--brand-green-darker)}.tab-button{flex:1;padding:10px;cursor:pointer;background-color:transparent;border:none;font-family:var(--font-primary);font-weight:900;color:var(--text-light);border-bottom:2px solid transparent;margin-bottom:-2px}.tab-button.active{color:var(--brand-dark);border-bottom-color:var(--brand-dark)}.compact-toggle-btn{background:none;border:none;cursor:pointer;padding:5px;display:flex;align-items:center;justify-content:center;color:var(--text-light)}.compact-toggle-btn:hover{color:var(--text-dark)}.search{background-color:var(--brand-medium);border-color:var(--brand-dark)}.boat-selector-container{margin-top:15px;margin-bottom:5px;text-align:left;height:20px}.boat-selector-container select{font-family:var(--font-secondary);font-weight:900;color:var(--brand-medium);text-shadow:0 0 1px rgb(255 255 255 / 1);font-size:1.1em;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-color:transparent;border:none;margin:0;width:calc(100% - 25px);text-align:left;cursor:pointer;padding:0 0 0 25px;float:left}.boat-selector-container .boat-icon{float:left;color:var(--text-light)}.boat-selector-container .boat-icon.populated{float:left;color:var(--brand-medium)}.track-toggle,.trip-toggle{position:absolute;opacity:0;cursor:pointer;height:0;width:0}.track-toggle:checked+.track-label-group:before{background-color:var(--brand-medium);border-color:var(--brand-dark)}.track-toggle:checked+.track-label-group:after{content:"";position:absolute;left:16px;top:50%;width:5px;height:10px;border:solid var(--color-white);border-width:0 3px 3px 0;transform:translateY(-60%) rotate(45deg)}.file-upload-wrapper{margin:15px 0}.upload-store{display:none}.file-upload-label{padding:10px 25px;margin-left:5px;height:auto}.file-name{margin-left:15px;font-family:var(--font-secondary);color:var(--text-dark)}#upload-form{display:flex;flex-direction:column;align-items:center;gap:15px}.form-actions{display:flex;gap:10px;margin-top:10px}#boat-form .form-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}#boat-form .form-group{display:flex;flex-direction:column}#boat-form .form-group.span-2{grid-column:span 2}#boat-form label{font-family:var(--font-secondary);font-weight:900;color:var(--text-light);font-size:.75em;text-transform:uppercase;margin-bottom:5px}#boat-form input{font-family:var(--font-primary);font-size:1em;padding:8px;border-radius:4px;border:1px solid var(--border-color);background-color:var(--surface-bg-dim)}#boat-form select{font-family:var(--font-primary);font-size:1em;padding:8px;border-radius:4px;border:1px solid var(--border-color);background-color:var(--surface-bg-dim);-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 20 20'%3e%3cpath stroke='var(--color-form-select-arrow)' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M6 8l4 4 4-4'/%3e%3c/svg%3e");background-position:right .5rem center;background-repeat:no-repeat;background-size:1.5em 1.5em;padding-right:2.5rem}#boat-form textarea{font-family:var(--font-secondary);font-size:1em;padding:8px;border-radius:4px;border:1px solid var(--border-color);background-color:var(--surface-bg-dim);resize:vertical;min-height:80px}#boat-form input:focus,#boat-form select:focus,#boat-form textarea:focus{outline:none;border-color:var(--brand-medium);box-shadow:0 0 5px var(--brand-medium)}#boat-form input.warning{border-color:var(--color-form-warning-border);box-shadow:0 0 5px var(--color-form-warning-border);background-color:var(--color-form-warning-bg)}#boat-form input.warning::placeholder{color:var(--color-form-warning-border)}@media (max-width: 600px),(-webkit-min-device-pixel-ratio: 2) and (max-width: 600px),(min-resolution: 192dpi) and (max-width: 600px){#boat-form .form-grid{grid-template-columns:1fr}#boat-form .form-group.span-2{grid-column:span 1}#boat-form .form-grid input,#boat-form .form-grid select,#boat-form .form-grid textarea{width:100%;box-sizing:border-box}}@media (max-width: 768px),(-webkit-min-device-pixel-ratio: 2) and (max-width: 768px),(min-resolution: 192dpi) and (max-width: 768px){.boat-selector-container select{padding-left:0}}.modal{font-family:var(--font-secondary);visibility:hidden;height:150px;width:450px;position:absolute;top:50%;transform:translateY(-50%);color:var(--color-modal-error-text);left:0;right:0;margin:auto;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:2px solid var(--border-color);border-radius:var(--border-radius);padding:5px 10px;box-shadow:var(--shadow-main);z-index:4;background-color:#ffffff80}.modal.error,.rotate-key-confirm{z-index:30}.modal-login{height:100%;max-height:450px;border-radius:var(--border-radius)}.login-modal{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:20px;text-align:center;color:var(--text-dark)}.login-modal .login-icon{font-size:4em;color:var(--brand-dark);opacity:.8}.login-modal .message{font-size:1.5rem;font-family:var(--font-primary);font-weight:900}.login-modal .login-btn{display:inline-flex;align-items:center;gap:15px;padding:10px 25px;font-size:1.1rem;text-decoration:none;color:var(--brand-dark)}.login-modal .google-logo{width:20px;height:20px}.modal.upload-ui{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:15px;height:auto;padding:20px}.modal.upload-ui .message{font-size:1.5rem;font-family:var(--font-primary);font-weight:900;color:var(--text-dark);margin-bottom:5px}.modal.upload-ui .button-base{padding:10px 20px}.person-modal{width:500px;height:auto;padding:20px;text-align:left;color:var(--text-dark);position:relative}.person-modal .modal-title{font-family:var(--font-primary);text-transform:uppercase;font-weight:900;color:var(--brand-dark);text-align:left;margin:0 0 20px;padding-right:100px}.person-modal .person-details{display:grid;grid-template-columns:auto 1fr;gap:5px;align-items:center}.person-modal .person-field-group,.person-modal .person-details p,.person-modal .api-key-section,.person-modal .report-link-section{grid-column:1 / -1;display:contents}.person-modal .person-details p strong,.person-modal .person-field-group strong{grid-column:1;text-align:left;white-space:nowrap}.person-modal .person-details p span,.person-modal .person-field-group .view-mode.inline,.person-modal .person-field-group .edit-mode{grid-column:2;text-align:left}.person-modal .person-details p{margin:0;text-align:left;display:flex;gap:.5rem;align-items:center}.person-modal .person-picture{width:80px;height:80px;border-radius:50%;border:2px solid var(--border-color);position:absolute;top:20px;right:20px;margin-bottom:0;z-index:10}.person-modal .api-key-section{margin-top:10px;padding-top:8px;border-top:1px solid var(--border-color);width:100%;text-align:left;display:grid;grid-template-columns:subgrid;gap:10px}.person-modal .api-key-section p{grid-column:1 / -1;text-align:left;margin:0}.person-modal .api-key-section #get-api-key-btn,.person-modal .api-key-section #copy-api-key-btn,.person-modal .api-key-section #rotate-api-key-btn{grid-column:2;justify-self:start;height:auto;padding:8px 15px;margin:0}.person-modal #api-key-display{display:inline-block;background-color:var(--surface-bg-dim-light);padding:5px 10px;border-radius:4px;font-family:monospace;word-break:break-all;border:1px solid var(--border-color);margin-bottom:10px;grid-column:2;justify-self:start}.person-modal .report-link-section{margin-top:10px;padding-top:8px;border-top:1px solid var(--border-color);width:100%;text-align:left;display:grid;grid-template-columns:subgrid;gap:10px}.person-modal .report-link-section p{grid-column:1 / -1;text-align:left;margin:0}.person-modal .report-link-section button{grid-column:2;justify-self:start;height:auto;padding:8px 15px;margin:0}.person-modal .form-actions{display:flex;justify-content:flex-start;margin-top:25px;grid-column:1 / -1}.boat-form-modal{width:600px;height:auto;padding:20px}.boat-form-modal .modal-title{font-family:var(--font-primary);text-transform:uppercase;font-weight:900;color:var(--brand-dark);text-align:center;margin:0 0 20px}.boat-agent-confirm-modal{width:500px;height:auto;padding:20px;text-align:left;color:var(--text-dark)}.boat-agent-confirm-modal .modal-title{font-family:var(--font-primary);text-transform:uppercase;font-weight:900;color:var(--brand-dark);text-align:center;margin:0 0 20px}.boat-agent-confirm-modal .boat-agent-specs{margin-bottom:20px}.boat-agent-confirm-modal .boat-agent-specs p{margin:5px 0}.boat-agent-confirm-modal .form-actions{display:flex;justify-content:flex-end;gap:10px}.getting-started-modal{display:flex;flex-direction:column;gap:20px;height:auto;padding:30px;text-align:center;color:var(--text-dark);max-width:500px}.getting-started-modal .modal-title{font-family:var(--font-primary);text-transform:uppercase;font-weight:900;color:var(--brand-dark);font-size:1.5rem;margin:0}.getting-started-modal .steps-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:15px;text-align:left}.getting-started-modal .step-item{display:flex;align-items:center;gap:15px;padding:10px;background-color:var(--surface-bg-dim-light);border:1px solid var(--border-color);border-radius:var(--border-radius);cursor:pointer;transition:background-color .2s ease}.getting-started-modal .step-item:hover{background-color:var(--color-list-item-hover-bg)}.getting-started-modal .step-icon{color:var(--brand-medium);font-size:1.5rem}.getting-started-modal .step-text{font-family:var(--font-primary);font-weight:900;font-size:1.1rem}.getting-started-modal .form-actions{display:flex;justify-content:flex-end;margin-top:10px}.share-modal{display:flex;flex-direction:column;justify-content:space-between;height:auto;padding:20px;color:var(--text-dark)}.share-modal .modal-title{font-family:var(--font-primary);text-transform:uppercase;font-weight:900;color:var(--brand-dark);text-align:center;margin:0 0 15px}.share-modal p{text-align:center;margin:0 0 20px}.share-url-container{display:flex;align-items:center;gap:10px}.share-url{flex-grow:1;padding:8px;border:1px solid var(--border-color);border-radius:4px;font-family:monospace;background-color:var(--surface-bg-dim-light)}.share-modal .form-actions{display:flex;justify-content:flex-end;margin-top:20px}.legend-toggle-button{display:none}@media (max-width: 768px),(-webkit-min-device-pixel-ratio: 2) and (max-width: 768px),(min-resolution: 192dpi) and (max-width: 768px){.login-modal{position:fixed;width:100%;height:100%;top:0;left:0;right:0;bottom:0;transform:none;border-radius:0;border:none;margin:0}.legend-toggle-button{display:inline-block}.toggle-legend-btn,.edit-track-btn{display:none}}@media (max-width: 650px),(-webkit-min-device-pixel-ratio: 2) and (max-width: 650px),(min-resolution: 192dpi) and (max-width: 650px){.modal,.person-modal,.boat-form-modal,.share-modal,.upload-ui{position:fixed;width:auto;height:auto;max-width:100%;max-height:100%;border-radius:0;border:none;margin:0;z-index:100;box-sizing:border-box;overflow-y:auto}}#photo-modal{position:fixed;top:50%;left:0;width:100%;height:100%;background-color:#000c;z-index:1000;display:flex;justify-content:center;align-items:center}#photo-modal .modal-content{position:relative;padding:20px;background:#fff;border-radius:5px;max-width:90%;max-height:90%;display:flex;flex-direction:column;align-items:center}#photo-modal img{max-width:100%;max-height:80vh;margin-bottom:15px;border:1px solid var(--color-marker-start-border)}#photo-modal .close-button{position:absolute;top:10px;right:15px;font-size:2em;cursor:pointer;color:var(--text-light);text-shadow:var(--shadow-main)}#photo-modal #delete-photo-btn{padding:10px 20px;position:absolute;bottom:10px;right:10px;cursor:pointer}#photo-modal #delete-photo-btn:hover{color:var(--color-accent)}#photo-modal .photo-caption{font-family:var(--font-handwriting);font-size:1.5rem;margin-top:10px;color:var(--text-dark);background:none;border:none;text-align:center;resize:none;width:100%;box-sizing:border-box}@media (max-width: 1500px) or (max-height: 1150px),(-webkit-min-device-pixel-ratio: 2) and (max-width: 1500px),(min-resolution: 192dpi) and (max-width: 1500px){.person-modal{top:10%;left:50%;width:auto;transform:translate(-50%,-10%)}.boat-form-modal{top:10%;left:50%;width:auto;transform:translate(-50%,-10%);min-width:600px}}.person-field-group{margin-bottom:1rem;display:flex;align-items:center;gap:.5rem;width:100%;justify-content:flex-start}.person-field-group strong{margin-right:.5rem;white-space:nowrap}.view-mode.inline{display:inline-flex;align-items:center;gap:.5rem;flex-grow:1}.edit-icon{font-size:1.2rem;color:var(--text-light);cursor:pointer;-webkit-user-select:none;user-select:none}.edit-icon:hover{color:var(--brand-medium)}.edit-mode{display:flex;align-items:center;gap:.5rem;flex-grow:1}.edit-mode input{flex-grow:1;padding:5px 10px;border:1px solid var(--border-color);border-radius:4px;font-family:var(--font-secondary);font-size:1rem}.button-base.small{padding:5px 10px;font-size:.9rem;min-width:60px}.loading-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#9f9a84cc;display:flex;justify-content:center;align-items:center;z-index:10;visibility:hidden;opacity:0;transition:opacity .3s ease,visibility .3s ease}.loading-overlay.show{color:var(--brand-dark);visibility:visible;opacity:1}.spinner{border:8px solid var(--surface-bg-dim);border-top:8px solid var(--brand-medium);border-radius:50%;width:60px;height:60px;animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.loading-message{visibility:hidden}.hidden{visibility:hidden;opacity:0;pointer-events:none}.no-select{-webkit-user-select:none;user-select:none}.show{visibility:visible;opacity:1}.mapboxgl-popup-close-button{font-size:24px}@media print{.tracks-panel,.auth-controls,.toggle-legend-btn,.modal,.mapboxgl-ctrl,.mapboxgl-ctrl-group,.marker{display:none!important}body{-webkit-print-color-adjust:exact;print-color-adjust:exact}header{box-shadow:none}body{zoom:60%}}
