:root {
	color-scheme: light;
	--app-paper: #f7f8f1;
	--app-forest: #123d2d;
	--app-sage: #d8ebe2;
	--app-muted: #657168;
	--app-coral: #e56b4c;
	font-family: "DM Sans", "Avenir Next", sans-serif;
}

* { box-sizing: border-box; }
body { min-width: 320px; min-height: 100vh; margin: 0; background: radial-gradient(ellipse at 85% 12%, #d8ebe2 0, transparent 38%), var(--app-paper); color: var(--app-forest); }
a { color: inherit; }
button, input { font: inherit; }
.app-shell { display: flex; min-height: 100vh; flex-direction: column; align-items: center; justify-content: center; padding: 32px 20px; }
.app-login-shell { position: relative; isolation: isolate; height: 100vh; height: 100svh; min-height: 100vh; min-height: 100svh; overflow: hidden; padding: 8px 16px; }
.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) { font-size: 1.25em; }
.app-login-shell::before { position: absolute; z-index: 0; inset: 0; background: linear-gradient(135deg, rgba(10, 43, 30, .35), rgba(18, 61, 45, .12)), url("../img/greencollector.png") center / cover no-repeat; animation: app-login-background-zoom 45s ease-in-out infinite alternate; content: ""; }
.app-login-shell > * { position: relative; z-index: 1; }
.app-login-shell > .app-login-card { padding: clamp(18px, 5vw, 28px); border-color: rgba(255, 255, 255, .5); border-radius: 35px; background: rgba(255, 255, 255, .25); box-shadow: 0 24px 70px rgba(8, 34, 24, .24); backdrop-filter: blur(7px); }
.app-login-message { margin: 0 0 16px; color: white; font-size: clamp(24px, 6vw, 32px); line-height: 1.2; text-align: center; text-shadow: 0 2px 12px rgba(0, 0, 0, .7); }
.app-login-shell:not(.app-registration-shell) .app-login-message { font-size: clamp(19px, calc(6vw - 5px), 27px); }
.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-login-message { font-size: clamp(23.75px, calc(7.5vw - 6.25px), 33.75px); }
.app-login-shell.app-recovery-shell .app-login-message { font-size: clamp(23.75px, calc(7.5vw - 6.25px), 33.75px); }
.app-login-divider { color: white; text-shadow: 0 2px 10px rgba(0, 0, 0, .8); }
.app-login-divider::before, .app-login-divider::after { background: rgba(255, 255, 255, .75); }
.app-forgot-password { display: block; margin: 4px 0 10px; color: white; font-size: 13px; font-weight: 400; text-align: center; text-decoration: none; text-shadow: 0 2px 10px rgba(0, 0, 0, .85); }
.app-register-prompt { display: block; color: white; font-size: clamp(16px, 4vw, 19px); font-weight: 700; line-height: 1.3; text-align: center; text-decoration: none; text-shadow: 0 2px 10px rgba(0, 0, 0, .85); }
.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-forgot-password { font-size: 16.25px; }
.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-register-prompt { font-size: clamp(20px, 5vw, 23.75px); }
.app-register-back:hover { text-decoration: underline; }
.app-registration-note { margin: -10px 0 24px; color: white; font-size: 14px; line-height: 1.45; text-shadow: 0 2px 10px rgba(0, 0, 0, .85); }
.app-recovery-notice { padding: 12px; border: 1px solid rgba(255, 255, 255, .65); border-radius: 12px; background: rgba(18, 61, 45, .55); color: white; font-size: 14px; line-height: 1.45; }
.app-register-back { display: block; margin-top: 20px; color: white; font-size: 14px; font-weight: 700; text-align: center; text-decoration: none; text-shadow: 0 2px 10px rgba(0, 0, 0, .85); }
.app-login-brand-mark { display: grid; width: 100%; place-items: center; }
.app-login-brand-mark img { grid-area: 1 / 1; width: 100%; height: auto; filter: drop-shadow(0 14px 28px rgba(0, 0, 0, .32)); }
.app-login-brand-mark .hero-mark__off { animation: hero-logo-breathe-off 6.5s ease-in-out infinite; }
.app-login-brand-mark .hero-mark__on { opacity: 0; animation: hero-logo-breathe-on 6.5s ease-in-out infinite; }
@keyframes hero-logo-breathe-off {
	0%, 100% { opacity: 1; transform: scale(.72); }
	40% { opacity: 1; transform: scale(.78); }
	50% { opacity: .55; transform: scale(.84); }
	60%, 80% { opacity: 0; transform: scale(.89); }
}
@keyframes hero-logo-breathe-on {
	0%, 100% { opacity: 0; transform: scale(.93); filter: drop-shadow(0 0 0 rgba(183, 225, 129, 0)); }
	40% { opacity: 0; transform: scale(.97); filter: drop-shadow(0 0 0 rgba(183, 225, 129, 0)); }
	50% { opacity: .55; transform: scale(1); filter: drop-shadow(0 0 18px rgba(183, 225, 129, .45)); }
	60% { opacity: 1; transform: scale(1.03); filter: drop-shadow(0 0 24px rgba(183, 225, 129, .7)); }
	80% { opacity: 1; transform: scale(1.05); filter: drop-shadow(0 14px 28px rgba(0, 0, 0, .32)); }
}
@keyframes register-prompt-glow {
	0%, 40%, 100% { opacity: .4; transform: scale(.96); }
	50% { opacity: .75; transform: scale(1); }
	60%, 80% { opacity: .9; transform: scale(1.02); }
}
@keyframes app-login-background-zoom { from { transform: scale(1); } to { transform: scale(1.12); } }
@media (prefers-reduced-motion: reduce) {
	.app-login-shell::before { animation: none; }
	.app-login-brand-mark .hero-mark__off { animation: none; opacity: 1; transform: none; }
	.app-login-brand-mark .hero-mark__on { animation: none; opacity: 0; transform: none; }
	.app-register-prompt::before { animation: none; opacity: .75; }
}
.app-brand { display: block; width: min(190px, 60vw); margin-bottom: 30px; }
.app-brand img { display: block; width: 100%; height: auto; }
.app-login-shell .app-brand { width: min(175px, 46.875vw); margin: 0 auto 8px; }
.app-card { width: min(100%, 440px); padding: clamp(26px, 7vw, 44px); border: 1px solid rgba(18, 61, 45, .12); background: rgba(255, 255, 255, .86); box-shadow: 0 24px 70px rgba(18, 61, 45, .1); }
.app-eyebrow { display: inline-flex; align-items: center; gap: 9px; color: var(--app-forest); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.app-eyebrow::before { width: 7px; height: 7px; background: var(--app-coral); content: ""; }
h1 { margin: 15px 0 8px; font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: clamp(34px, 9vw, 44px); font-weight: 600; line-height: 1.05; }
.app-intro { margin: 0 0 28px; color: var(--app-muted); }
.app-field { margin-bottom: 18px; }
.app-field label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 700; }
.app-field input { width: 100%; min-height: 50px; padding: 0 14px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 0; background: white; color: var(--app-forest); }
.app-field input:focus { outline: 3px solid rgba(216, 235, 226, .9); border-color: var(--app-forest); }
.date-wheel { display: flex; gap: 8px; }
.date-wheel select { min-width: 0; min-height: 48px; flex: 1; padding: 8px 10px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 12px; background: white; color: var(--app-forest); font: inherit; scroll-snap-align: center; }
.date-wheel select:focus { outline: 3px solid rgba(216, 235, 226, .9); border-color: var(--app-forest); }
.app-button { display: flex; width: 100%; min-height: 52px; align-items: center; justify-content: center; gap: 12px; margin-top: 24px; padding: 12px 18px; border: 1px solid var(--app-forest); background: var(--app-forest); color: white; cursor: pointer; font-weight: 400; }
.app-login-shell .app-field { margin-bottom: 12px; }
.app-login-form .app-field { position: relative; }
.app-login-form .app-field label { position: absolute; top: 50%; left: 14px; margin: 0; color: var(--app-forest); font-size: 16px; font-weight: 400; pointer-events: none; text-shadow: none; transform: translateY(-50%); transition: top .15s ease, font-size .15s ease, transform .15s ease; }
.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-login-form .app-field label { font-size: 20px; }
.app-login-form .app-field input { padding-top: 12px; }
.app-login-form .app-field input:focus + label, .app-login-form .app-field input:not(:placeholder-shown) + label { top: 5px; font-size: 11px; transform: none; }
.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-login-form .app-field input:focus + label, .app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-login-form .app-field input:not(:placeholder-shown) + label { font-size: 13.75px; }
.app-login-shell .app-field input { border-radius: 8px; background: rgba(255, 255, 255, .85); }
.app-login-form .app-field input { background: rgba(255, 255, 255, .6); color: var(--app-forest); }
.app-login-shell .app-button { min-height: 46px; margin-top: 12px; padding: 10px 16px; }
.app-login-shell:not(.app-registration-shell) .app-button { border-radius: 25px; }
.app-login-form .app-register-prompt { position: relative; isolation: isolate; margin-top: 12px; padding: 8px 10px; border-radius: 24px; text-shadow: 0 2px 10px rgba(0, 0, 0, .85), 0 0 16px rgba(183, 225, 129, .8); }
.app-login-form .app-register-prompt::before { position: absolute; z-index: 0; inset: 0; border: 1px solid rgba(183, 225, 129, .6); border-radius: inherit; background: rgba(183, 225, 129, .24); box-shadow: 0 0 30px 6px rgba(183, 225, 129, .55), inset 0 0 18px rgba(183, 225, 129, .2); animation: register-prompt-glow 6.5s ease-in-out infinite; content: ""; }
.app-login-form .app-register-prompt > span { position: relative; z-index: 1; }
.app-login-shell .app-divider { margin: 8px 0; }
.app-login-shell > .app-back { margin-top: 8px; }
.app-registration-shell .app-brand, .app-registration-shell > .app-back { display: none; }
.app-registration-back-link { position: absolute; z-index: 2; top: max(12px, env(safe-area-inset-top)); left: max(12px, env(safe-area-inset-left)); color: white; font-size: 13px; line-height: 1.3; text-decoration: none; text-shadow: 0 2px 10px rgba(0, 0, 0, .85); }
.app-registration-back-link:hover { color: white; text-decoration: none; }
.app-registration-shell .app-field { margin-bottom: 8px; }
.app-registration-shell .app-field label, .app-registration-shell .app-field small, .app-registration-shell .app-help { color: white; text-shadow: 0 1px 5px rgba(0, 0, 0, .7); }
.app-registration-shell .app-field { position: relative; }
.app-registration-shell .app-field > input + label { position: absolute; top: 50%; left: 14px; margin: 0; color: var(--app-forest); font-size: 15px; font-weight: 400; pointer-events: none; text-shadow: none; transform: translateY(-50%); transition: top .15s ease, font-size .15s ease, transform .15s ease; }
.app-registration-shell .app-field > input:focus + label, .app-registration-shell .app-field > input:not(:placeholder-shown) + label { top: 5px; font-size: 11px; transform: none; }
.app-registration-shell .app-field > input { padding-top: 12px; }
.app-registration-shell .app-field > input:focus + label, .app-registration-shell .app-field > input:not(:placeholder-shown) + label { top: 4px; }
.app-registration-shell .app-field input, .app-registration-shell .date-wheel select { min-height: 42px; }
.app-registration-shell .app-button { width: 60%; min-height: 42px; margin: 8px auto 0; border-radius: 25px; }
.app-registration-shell .app-login-message { margin-bottom: 10px; }
.app-registration-shell .app-registration-collector-link { width: 75%; min-height: 32px; margin: 8px auto 0; padding: 6px 9px; border-radius: 25px; font-size: 12px; text-align: center; text-decoration: none; }
.app-registration-shell .app-registration-collector-link:hover { color: white; text-decoration: none; }
.app-registration-shell .app-register-back { margin-top: 10px; }
.app-registration-shell, .app-recovery-shell { font-size: 1.25em; }
.app-registration-back-link { font-size: 16.25px; }
.app-registration-shell .app-login-message { font-size: clamp(30px, 7.5vw, 40px); }
.app-registration-shell .app-field label { font-size: 16.25px; }
.app-registration-shell .app-field > input + label { font-size: 18.75px; }
.app-registration-shell .app-field > input:focus + label, .app-registration-shell .app-field > input:not(:placeholder-shown) + label { font-size: 13.75px; }
.app-registration-shell .app-field small { font-size: 15px; }
.app-registration-shell .app-help { font-size: 16.25px; }
.app-registration-shell .app-feedback, .app-recovery-shell .app-feedback { font-size: 17.5px; }
.app-registration-shell .app-registration-collector-link { font-size: 15px; }
.app-recovery-shell .app-registration-note, .app-recovery-shell .app-recovery-notice, .app-recovery-shell .app-register-back { font-size: 17.5px; }
@media (max-height: 700px) {
	.app-registration-shell { justify-content: center; padding: 6px 12px; }
	.app-registration-shell > .app-login-card { padding: 12px 16px; }
	.app-registration-shell .app-login-message { margin-bottom: 6px; font-size: 21px; }
	.app-registration-shell .app-feedback { margin-bottom: 8px; padding: 7px 10px; font-size: 12px; }
	.app-registration-shell .app-field { margin-bottom: 4px; }
	.app-registration-shell .app-field > input + label { left: 10px; font-size: 12px; }
	.app-registration-shell .app-field > input:focus + label, .app-registration-shell .app-field > input:not(:placeholder-shown) + label { top: 3px; font-size: 9px; }
	.app-registration-shell .app-field input, .app-registration-shell .date-wheel select { min-height: 32px; }
	.app-registration-shell .date-wheel select { padding: 4px 6px; font-size: 12px; }
	.app-registration-shell .app-field small { max-width: 100%; margin-top: 2px; font-size: 10px; line-height: 1.1; }
	.app-registration-shell .app-button { min-height: 36px; margin-top: 5px; padding: 7px 12px; }
	.app-registration-shell .app-registration-collector-link { min-height: 27px; margin-top: 5px; padding: 5px 8px; font-size: 10px; }
	.app-registration-shell .app-register-back { margin-top: 5px; font-size: 12px; }
	.app-login-shell:not(.app-registration-shell) { justify-content: center; padding: 4px 12px; }
	.app-login-shell:not(.app-registration-shell) .app-brand { width: min(112.5px, 31.25vw); margin-bottom: 4px; }
	.app-login-shell:not(.app-registration-shell) > .app-login-card { padding: 12px 16px; }
	.app-login-shell:not(.app-registration-shell) .app-login-message { margin-bottom: 8px; font-size: clamp(14px, calc(6vw - 5px), 18px); line-height: 1.08; }
	.app-login-shell:not(.app-registration-shell) .app-registration-note { margin: 0 0 8px; font-size: 12px; line-height: 1.25; }
	.app-login-shell:not(.app-registration-shell) .app-recovery-notice { padding: 8px; font-size: 12px; }
	.app-login-shell:not(.app-registration-shell) .app-field { margin-bottom: 6px; }
	.app-login-shell:not(.app-registration-shell) .app-login-form .app-field input + label { font-size: 14px; }
	.app-login-shell:not(.app-registration-shell) .app-login-form .app-field input:focus + label,
	.app-login-shell:not(.app-registration-shell) .app-login-form .app-field input:not(:placeholder-shown) + label { font-size: 10px; }
	.app-login-shell:not(.app-registration-shell) .app-field input { min-height: 36px; }
	.app-login-shell:not(.app-registration-shell) .app-button { min-height: 38px; margin-top: 6px; padding: 7px 12px; }
	.app-login-shell:not(.app-registration-shell) .app-forgot-password { margin: 4px 0 6px; font-size: 12px; }
	.app-login-shell:not(.app-registration-shell) .app-divider { margin: 5px 0; }
	.app-login-shell:not(.app-registration-shell) .app-register-prompt { font-size: 14px; line-height: 1.2; }
	.app-login-shell:not(.app-registration-shell) .app-login-form .app-register-prompt { margin-top: 8px; }
	.app-login-shell:not(.app-registration-shell) > .app-back { display: none; }
	.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-login-message { font-size: clamp(17.5px, calc(7.5vw - 6.25px), 22.5px); }
	.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-login-form .app-field label { font-size: 17.5px; }
	.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-login-form .app-field input:focus + label,
	.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-login-form .app-field input:not(:placeholder-shown) + label { font-size: 12.5px; }
	.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-forgot-password { font-size: 15px; }
	.app-login-shell:not(.app-registration-shell):not(.app-recovery-shell) .app-register-prompt { font-size: 17.5px; }
	.app-registration-shell .app-login-message { font-size: 26.25px; }
	.app-registration-shell .app-field > input + label { font-size: 15px; }
	.app-registration-shell .app-field > input:focus + label, .app-registration-shell .app-field > input:not(:placeholder-shown) + label { font-size: 11.25px; }
	.app-registration-shell .date-wheel select { font-size: 15px; }
	.app-registration-shell .app-field small { font-size: 12.5px; }
	.app-registration-shell .app-feedback, .app-recovery-shell .app-feedback { font-size: 15px; }
	.app-registration-shell .app-registration-collector-link { font-size: 12.5px; }
	.app-login-shell.app-recovery-shell .app-login-message { font-size: clamp(17.5px, calc(7.5vw - 6.25px), 22.5px); }
	.app-login-shell.app-recovery-shell .app-registration-note,
	.app-login-shell.app-recovery-shell .app-recovery-notice { font-size: 15px; }
	.app-login-shell.app-recovery-shell .app-register-back { font-size: 17.5px; }
}
.app-button:hover { background: #1b553e; }
.app-divider { display: flex; align-items: center; gap: 12px; margin: 26px 0 22px; color: var(--app-muted); font-size: 12px; }
.app-divider::before, .app-divider::after { height: 1px; flex: 1; background: rgba(18, 61, 45, .14); content: ""; }
.app-form-title { margin: 0 0 18px; font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: 20px; font-weight: 600; }
.app-field small { display: block; margin-top: 6px; color: var(--app-muted); font-size: 12px; }
.app-button:focus-visible, a:focus-visible { outline: 3px solid var(--app-coral); outline-offset: 3px; }
.app-button--secondary { background: transparent; color: var(--app-forest); }
.app-button--secondary:hover { background: var(--app-sage); }
.app-feedback { margin: 0 0 20px; padding: 12px 14px; border-left: 3px solid var(--app-coral); background: #fff3ef; color: #71341f; font-size: 14px; }
.app-feedback p { margin: 0; }
.app-message-dismissing { opacity: 0; pointer-events: none; transition: opacity 2s ease; }
.app-account { padding: 12px 0; border-top: 1px solid rgba(18, 61, 45, .12); color: var(--app-muted); font-size: 14px; }
.app-help { margin: 22px 0 0; color: var(--app-muted); font-size: 13px; text-align: center; }
.app-help a { color: var(--app-forest); font-weight: 700; }
.app-back { margin-top: 22px; color: var(--app-muted); font-size: 13px; text-decoration: none; }
.app-back:hover { color: var(--app-forest); text-decoration: underline; }
.app-card--home { width: min(100%, 980px); }
.app-home-notice { margin: 0 0 18px; padding: 12px 14px; border-left: 3px solid var(--app-forest); background: var(--app-sage); font-size: 13px; }
.app-impact-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 20px 0 30px; }
.app-impact-summary article { display: grid; min-width: 0; gap: 8px; padding: 14px; border: 1px solid rgba(18, 61, 45, .14); background: rgba(216, 235, 226, .35); }
.app-impact-summary span, .app-mission-capacity, .app-mission-pool, .app-ecoquest-dates { color: var(--app-muted); font-size: 12px; }
.app-impact-summary strong { overflow-wrap: anywhere; font-size: clamp(16px, 4vw, 22px); }
.app-ecoquest-list { display: grid; gap: 18px; }
.app-ecoquest-card { min-width: 0; padding: 18px; border: 1px solid rgba(18, 61, 45, .14); background: rgba(255, 255, 255, .75); }
.app-ecoquest-card h3 { margin: 0 0 8px; font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: 20px; }
.app-ecoquest-card > p { line-height: 1.55; }
.app-quest-state, .app-participation-state { padding: 10px 12px; background: rgba(216, 235, 226, .5); font-size: 13px; }
.app-quest-state--expired { background: #fff3ef; color: #71341f; }
.app-mission-card { margin-top: 14px; padding: 16px; border: 1px solid rgba(18, 61, 45, .12); }
.app-mission-card h4 { margin: 0 0 8px; font-size: 16px; }
.app-mission-card > p { line-height: 1.5; }
.app-mission-progress-label { margin-bottom: 6px; color: var(--app-forest); font-size: 12px; font-weight: 700; }
.app-mission-progress { display: block; width: 100%; height: 10px; margin: 0 0 12px; accent-color: #16834b; }
.app-mission-progress::-webkit-progress-bar { border-radius: 999px; background: #e4ebe4; }
.app-mission-progress::-webkit-progress-value { border-radius: 999px; background: #16834b; }
.app-inline-form .app-button, .app-completion-form .app-button { width: auto; min-height: 42px; margin-top: 12px; padding: 9px 16px; border-radius: 20px; }
.app-completion-form { display: grid; gap: 8px; margin-top: 14px; }
.app-completion-form label { font-size: 13px; font-weight: 700; }
.app-completion-form textarea { width: 100%; padding: 10px 12px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 12px; color: var(--app-forest); font: inherit; resize: vertical; }
.app-photo-options { display: grid; min-width: 0; gap: 7px; margin: 4px 0 0; padding: 12px; border: 1px solid rgba(18, 61, 45, .18); border-radius: 12px; }
.app-photo-options legend { padding: 0 4px; font-size: 13px; font-weight: 700; }
.app-photo-source-buttons { display: flex; flex-wrap: wrap; gap: 8px; }
.app-photo-source-button { display: inline-flex; min-width: 98px; min-height: 42px; align-items: center; justify-content: center; gap: 8px; padding: 8px 12px; border: 1px solid var(--app-forest); border-radius: 22px; background: var(--app-forest); color: white; cursor: pointer; font: inherit; font-size: 13px; font-weight: 400; }
.app-photo-source-button:hover { background: #1b553e; }
.app-photo-source-button svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.app-photo-file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; clip-path: inset(50%); }
.app-photo-file-list { display: grid; gap: 6px; margin: 0; padding: 0; list-style: none; }
.app-photo-file-list[hidden] { display: none; }
.app-photo-file-list li { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; border-radius: 10px; background: rgba(216, 235, 226, .5); color: var(--app-forest); font-size: 12px; }
.app-photo-file-name { min-width: 0; overflow-wrap: anywhere; }
.app-photo-file-remove { flex: 0 0 auto; padding: 4px 8px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 14px; background: white; color: var(--app-forest); cursor: pointer; font: inherit; }
.app-photo-help { color: var(--app-muted); font-size: 11px; line-height: 1.4; }
.app-empty { padding: 16px; background: rgba(216, 235, 226, .4); color: var(--app-muted); font-size: 14px; }
.rebooter-home-shell { position: fixed; inset: 0; display: block; height: 100vh; height: 100svh; min-height: 0; overflow: hidden; padding: 0; }
.rebooter-home-shell > .app-brand, .rebooter-home-shell > .app-back { display: none; }
.rebooter-home-shell > .app-card--home { width: 100%; max-width: none; height: 100vh; height: 100svh; min-height: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
.rebooter-home { position: relative; width: 100%; height: 100%; }
.rebooter-map-stage { position: relative; height: 100vh; height: 100svh; min-height: 0; overflow: hidden; background: #dce8df; }
.rebooter-map { position: absolute; inset: 0; z-index: 0; background: #dce8df; }
.rebooter-map .leaflet-control-attribution { font-size: 10px; }
.rebooter-map-header { position: absolute; z-index: 450; top: max(76px, calc(env(safe-area-inset-top) + 70px)); left: 50%; width: min(90%, 420px); padding: 12px 16px; border: 1px solid rgba(18, 61, 45, .12); border-radius: 18px; background: rgba(255, 255, 255, .75); box-shadow: 0 8px 26px rgba(18, 61, 45, .16); text-align: center; transform: translateX(-50%); }
.rebooter-map-header .app-eyebrow { font-size: 10px; }
.rebooter-map-header h1 { margin: 4px 0 0; font-size: clamp(20px, 5vw, 26px); }
.map-welcome-impact.is-animated { opacity: 0; transition: opacity 1s ease, top 2s ease, width 2s ease, padding 2s ease; }
.map-welcome-impact.is-welcome-visible { opacity: 1; }
.map-welcome-impact.is-impact-transition { top: max(14px, env(safe-area-inset-top)); width: min(210px, calc(100% - 2 * clamp(86px, 21vw, 102px))); padding: 7px 9px; opacity: 0; transition-duration: 2s; }
.map-welcome-impact.is-impact-visible { opacity: 1; }
.rebooter-map-header.map-welcome-impact.is-impact-visible { background: rgba(255, 255, 255, .75); }
.map-impact-message { margin: 0; color: var(--app-forest); font-size: clamp(10px, 2.8vw, 12px); font-weight: 600; line-height: 1.3; }
.map-impact-message strong { display: block; color: var(--app-forest); font-size: 1.15em; white-space: nowrap; }
.map-impact-message[hidden] { display: none; }
.rebooter-map-controls { position: absolute; z-index: 600; inset: 0; pointer-events: none; }
.rebooter-icon-button { display: grid; place-items: center; overflow: hidden; padding: 0; border: 0; border-radius: 50%; background: transparent; box-shadow: none; color: var(--app-forest); cursor: pointer; pointer-events: auto; }
.rebooter-map-control { position: absolute; width: clamp(72px, 19vw, 88px); height: clamp(72px, 19vw, 88px); }
.rebooter-map-control img { position: absolute; inset: 0; display: block; width: 100%; max-width: none; height: 100%; object-fit: contain; transform: scale(2.2); mix-blend-mode: multiply; }
.rebooter-map-control--nearby { top: max(14px, env(safe-area-inset-top)); left: max(14px, env(safe-area-inset-left)); }
.rebooter-map-control--stats { top: max(14px, env(safe-area-inset-top)); right: max(14px, env(safe-area-inset-right)); }
.rebooter-map-control--menu { bottom: max(24px, calc(env(safe-area-inset-bottom) + 18px)); left: 50%; transform: translateX(-50%); }
.map-current-location-button { position: absolute; top: 50%; right: max(14px, env(safe-area-inset-right)); width: 48px; height: 48px; padding: 5px; border: 1px solid rgba(18, 61, 45, .2); background: rgba(255, 255, 255, .9); box-shadow: 0 2px 8px rgba(18, 61, 45, .2); transform: translateY(-50%); }
.map-current-location-button img { display: block; width: 100%; height: 100%; object-fit: contain; }
.map-current-location-button:focus-visible { outline: 3px solid var(--app-forest); outline-offset: 3px; }
.map-current-location-button:disabled { cursor: wait; opacity: .65; }
.map-current-location-status { position: absolute; z-index: 620; top: 50%; right: max(72px, calc(env(safe-area-inset-right) + 72px)); max-width: min(280px, calc(100% - 104px)); margin: 0; padding: 8px 12px; border: 1px solid rgba(18, 61, 45, .14); border-radius: 12px; background: rgba(255, 255, 255, .94); box-shadow: 0 2px 8px rgba(18, 61, 45, .15); color: var(--app-forest); font-size: 13px; line-height: 1.35; text-align: center; transform: translateY(-50%); }
.map-current-location-status[hidden] { display: none; }
.rebooter-map-demo-notice { position: absolute; z-index: 610; right: 12px; bottom: calc(max(24px, env(safe-area-inset-bottom) + 18px) + clamp(72px, 19vw, 88px) + 10px); left: 12px; width: min(320px, calc(100% - 24px)); margin: 0 auto; padding: 7px 10px; border: 1px solid rgba(18, 61, 45, .12); border-radius: 12px; background: rgba(255, 255, 255, .82); color: var(--app-forest); font-size: clamp(10px, 2.8vw, 12px); line-height: 1.35; text-align: center; pointer-events: none; }
.rebooter-map-demo-notice[hidden] { display: none; }
.rebooter-quest-marker-shell { border: 0; background: transparent; }
.rebooter-quest-marker { display: block; width: 42px; height: 42px; object-fit: contain; filter: drop-shadow(0 2px 3px rgba(18, 61, 45, .35)); }
.map-current-location-marker-shell { border: 0; background: transparent; }
.map-current-location-marker { position: relative; display: grid; box-sizing: border-box; width: 42px; height: 42px; place-items: center; overflow: hidden; border: 3px solid white; border-radius: 50%; background: var(--app-forest); box-shadow: 0 2px 8px rgba(18, 61, 45, .45); }
.map-current-location-photo { position: absolute; inset: 0; display: block; width: 100%; height: 100%; min-width: 0; min-height: 0; border-radius: 50%; object-fit: cover; }
.map-current-location-marker--placeholder::before { color: white; content: "●"; font-size: 18px; line-height: 1; }
.rebooter-map-status { position: absolute; z-index: 400; right: 12px; bottom: max(6px, env(safe-area-inset-bottom)); left: 12px; max-width: min(520px, calc(100% - 24px)); margin: 0 auto; padding: 6px 10px; border-radius: 10px; background: rgba(255, 255, 255, .75); color: var(--app-muted); font-size: 11px; text-align: center; pointer-events: none; }
.rebooter-map-feedback { position: absolute; z-index: 550; top: 150px; right: 14px; left: 14px; max-width: 520px; margin: auto; }
.rebooter-map-panel { position: absolute; z-index: 650; width: min(360px, calc(100% - 28px)); max-height: min(55vh, 480px); overflow-y: auto; padding: 18px; border: 1px solid rgba(18, 61, 45, .16); border-radius: 20px; background: rgba(255, 255, 255, .75); box-shadow: 0 12px 36px rgba(18, 61, 45, .24); }
.rebooter-map-panel[hidden] { display: none; }
.rebooter-map-panel h2 { margin: 0 0 8px; font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: 20px; text-align: center; }
.rebooter-map-panel > p, .rebooter-collectors p, .rebooter-map-panel--profile p { margin: 8px 0; color: var(--app-muted); font-size: 13px; line-height: 1.45; text-align: justify; }
.rebooter-map-panel--nearby { top: max(86px, calc(env(safe-area-inset-top) + 80px)); left: 14px; }
.collector-main-menu { width: min(280px, calc(100% - 28px)); }
.collector-main-menu .rebooter-panel-link--count { display: flex; align-items: center; justify-content: space-between; background: rgba(77, 146, 98, .6); color: white; }
.collector-main-menu .rebooter-panel-link--count:hover { background: rgba(77, 146, 98, .75); }
.rebooter-map-panel--stats { top: max(86px, calc(env(safe-area-inset-top) + 80px)); right: 14px; }
.rebooter-map-panel--account, .rebooter-map-panel--profile { bottom: max(112px, calc(env(safe-area-inset-bottom) + 100px)); left: 50%; transform: translateX(-50%); }
.rebooter-map-panel--account { overflow: visible; max-height: none; padding-top: calc(20% + 12px); }
.rebooter-account-scroll { height: 132px; overflow-y: auto; padding-bottom: 8px; overscroll-behavior: contain; }
.rebooter-map-panel--profile { overflow: visible; max-height: none; padding-top: calc(20% + 12px); }
.rebooter-nearby-status:empty { display: none; }
.rebooter-nearby-status { margin: 10px 0 0; color: var(--app-muted); font-size: 12px; line-height: 1.4; }
.rebooter-nearby-list { display: grid; gap: 6px; margin-top: 8px; }
.rebooter-nearby-group-title { margin: 10px 0 2px; color: var(--app-forest); font-size: 13px; }
.rebooter-nearby-quest { display: flex; width: 100%; min-width: 0; align-items: center; gap: 8px; padding: 8px 10px; border: 1px solid rgba(18, 61, 45, .14); border-radius: 12px; background: rgba(255, 255, 255, .75); color: var(--app-forest); cursor: pointer; font: inherit; text-align: left; }
.rebooter-nearby-quest img { width: 28px; height: 28px; flex: 0 0 28px; object-fit: contain; }
.rebooter-nearby-quest-details { display: flex; min-width: 0; flex: 1; align-items: center; justify-content: space-between; gap: 8px; }
.rebooter-nearby-quest-title { overflow-wrap: anywhere; font-size: 13px; font-weight: 600; }
.rebooter-nearby-quest-distance { flex: 0 0 auto; color: var(--app-muted); font-size: 11px; }
.rebooter-panel-link { display: block; width: 100%; margin-top: 8px; padding: 11px 12px; border: 1px solid rgba(18, 61, 45, .14); border-radius: 12px; background: white; color: var(--app-forest); cursor: pointer; font: inherit; font-size: 14px; font-weight: 400; text-align: left; text-decoration: none; }
.rebooter-panel-link:hover { background: var(--app-sage); }
.rebooter-map-panel--account .rebooter-panel-link--count { display: flex; align-items: center; justify-content: space-between; background: rgba(77, 146, 98, .6); color: white; }
.rebooter-map-panel--account .rebooter-panel-link--count:hover { background: rgba(77, 146, 98, .75); }
.rebooter-panel-count { display: grid; min-width: 26px; min-height: 26px; place-items: center; padding: 2px 6px; border-radius: 50%; background: rgba(255, 255, 255, .8); color: var(--app-forest); font-size: 12px; font-weight: 700; }
.rebooter-account-actions { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: 8px; }
.rebooter-map-panel--account .rebooter-account-profile { position: absolute; z-index: 2; top: 0; left: 50%; display: grid; width: 40%; aspect-ratio: 1; place-items: center; margin: 0; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--app-forest); transform: translate(-50%, -50%); }
.rebooter-map-panel--account .rebooter-account-profile:hover { background: transparent; }
.rebooter-map-panel--account .rebooter-account-profile:focus-visible { outline: 3px solid var(--app-forest); outline-offset: 3px; }
.rebooter-account-avatar { display: grid; width: 100%; height: 100%; place-items: center; border: 2px solid rgba(255, 255, 255, .9); border-radius: 50%; object-fit: cover; }
.rebooter-account-avatar:not(.rebooter-account-avatar--placeholder) { background: white; opacity: 1; }
.rebooter-account-avatar--placeholder { background: var(--app-forest); color: white; }
.rebooter-account-avatar--placeholder svg { width: 60%; height: 60%; }
.rebooter-collectors { margin-top: 16px; padding-top: 12px; border-top: 1px solid rgba(18, 61, 45, .14); }
.rebooter-collectors h3 { margin: 0; font-size: 15px; }
.rebooter-map-panel .app-impact-summary { grid-template-columns: 1fr; margin: 12px 0; }
.rebooter-map-panel .app-impact-summary article { grid-template-columns: 1fr auto; align-items: center; padding: 10px; }
.rebooter-map-panel .app-impact-summary span { font-size: 11px; }
.rebooter-map-panel .app-impact-summary strong { font-size: 15px; }
.rebooter-map-panel .rebooter-impact-note { width: 80%; margin-inline: auto; font-size: 11px; text-align: center; }
.rebooter-logout-form { width: auto; flex: 0 0 auto; margin: 0; }
.rebooter-map-panel--account .rebooter-logout-form { display: flex; width: 100%; justify-content: center; margin-top: 24px; }
.rebooter-map-panel--account .rebooter-account-logout { width: auto; min-height: 42px; margin: 0; padding: 9px 12px; border-color: rgba(190, 48, 48, .5); background: rgba(190, 48, 48, .5); color: white; font-size: 13px; text-align: center; white-space: nowrap; }
.rebooter-map-panel--account .rebooter-account-logout:hover { background: rgba(190, 48, 48, .7); }
.rebooter-no-map-quests { margin: 0 0 16px; padding: 12px 14px; border-left: 3px solid var(--app-coral); background: #fff3ef; color: #71341f; font-size: 13px; }
.rebooter-no-map-quests[hidden] { display: none; }
.rebooter-ecoquests { position: absolute; z-index: 900; top: 50%; left: 50%; display: flex; width: min(440px, calc(100% - 28px)); height: min(75svh, 680px); max-height: min(75svh, 680px); flex-direction: column; gap: 12px; overflow: hidden; margin: 0; padding: 16px; border: 1px solid rgba(18, 61, 45, .16); border-radius: 20px; background: rgba(255, 255, 255, .75); box-shadow: 0 12px 36px rgba(18, 61, 45, .24); transform: translate(-50%, -50%); }
.rebooter-ecoquests[hidden] { display: none; }
.rebooter-ecoquests-header { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; gap: 16px; }
.rebooter-ecoquests-header h2 { margin: 0; font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: clamp(22px, 5vw, 30px); }
.rebooter-ecoquests-header h2, .rebooter-ecoquest-title, .rebooter-mission-title { text-align: center; }
.rebooter-ecoquests-header p { margin: 4px 0 0; color: var(--app-muted); font-size: 13px; text-align: justify; }
.rebooter-ecoquests-close { display: grid; width: 42px; height: 42px; flex: 0 0 42px; place-items: center; padding: 0; border: 1px solid rgba(18, 61, 45, .2); border-radius: 50%; background: rgba(255, 255, 255, .75); color: var(--app-forest); cursor: pointer; font: inherit; font-size: 25px; font-weight: 400; line-height: 1; }
.rebooter-ecoquests-content { min-height: 0; flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; }
.rebooter-ecoquests-content .app-ecoquest-list { display: flex; flex-direction: column; align-items: stretch; gap: 8px; padding-bottom: max(16px, env(safe-area-inset-bottom)); }
.rebooter-ecoquests-content .app-ecoquest-card { padding: 0; background: rgba(255, 255, 255, .75); }
.rebooter-ecoquests-content .app-mission-card { background: rgba(255, 255, 255, .75); }
.rebooter-ecoquest-summary, .rebooter-mission-summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; cursor: pointer; list-style: none; }
.rebooter-ecoquest-summary::-webkit-details-marker, .rebooter-mission-summary::-webkit-details-marker { display: none; }
.rebooter-ecoquest-summary { min-height: 68px; padding: 12px 14px; }
.rebooter-ecoquest-title { display: block; color: var(--app-forest); font-size: 15px; font-weight: 700; line-height: 1.3; }
.rebooter-ecoquest-meta { display: block; margin-top: 4px; color: var(--app-muted); font-size: 11px; line-height: 1.35; }
.rebooter-ecoquest-details { padding: 0 14px 14px; }
.rebooter-ecoquest-details > p:first-child { margin-top: 8px; text-align: justify; }
.rebooter-description-disclosure { margin: 8px 0; padding: 8px 10px; border: 1px solid rgba(18, 61, 45, .12); border-radius: 10px; background: rgba(255, 255, 255, .75); }
.rebooter-description-disclosure > summary { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--app-forest); cursor: pointer; font-size: 12px; font-weight: 700; list-style: none; }
.rebooter-description-disclosure > summary::-webkit-details-marker { display: none; }
.rebooter-description-disclosure > summary span { flex: 0 0 auto; font-size: 16px; transition: transform .15s ease; }
.rebooter-description-disclosure[open] > summary span { transform: rotate(180deg); }
.rebooter-description-disclosure > p { margin: 8px 0 0; color: var(--app-muted); font-size: 12px; line-height: 1.45; text-align: justify; }
.rebooter-ecoquests-intro { margin: 6px 0 0; padding: 0; border: 0; background: transparent; }
.rebooter-ecoquests-intro > summary { justify-content: flex-start; font-size: 11px; font-weight: 400; }
.rebooter-ecoquest-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin: 4px 0 12px; }
.rebooter-ecoquest-actions .rebooter-list-map-button, .rebooter-ecoquest-actions .rebooter-mission-directions { min-height: 36px; margin: 0; }
.rebooter-ecoquest-details .app-mission-card { margin-top: 8px; padding: 0; }
.rebooter-mission-summary { min-height: 52px; padding: 9px 10px; }
.rebooter-mission-title { color: var(--app-forest); font-size: 13px; font-weight: 700; line-height: 1.35; }
.rebooter-mission-status { flex: 0 0 auto; padding: 4px 8px; border-radius: 999px; background: rgba(216, 235, 226, .7); color: var(--app-forest); font-size: 10px; font-weight: 700; white-space: nowrap; }
.rebooter-mission-details { padding: 0 10px 10px; }
.rebooter-mission-details > p { text-align: justify; }
.rebooter-map .leaflet-popup-content-wrapper, .rebooter-map .leaflet-popup-tip, .collector-map .leaflet-popup-content-wrapper, .collector-map .leaflet-popup-tip { background: rgba(255, 255, 255, .75); }
.rebooter-map .leaflet-popup-content, .collector-map .leaflet-popup-content { width: min(440px, calc(100vw - 80px)); max-width: calc(100vw - 80px); max-height: calc(68svh - 32px); overflow: auto; margin: 12px 14px; }
.rebooter-map-popup { background: transparent; }
.rebooter-map-popup > strong { display: block; overflow-wrap: anywhere; font-size: 17px; font-weight: 400; line-height: 1.35; text-align: center; }
.rebooter-map-popup > p { margin: 8px 0; overflow-wrap: anywhere; font-size: 13px; line-height: 1.4; text-align: justify; }
.pickup-request-popup-detail { white-space: pre-line; }
.pickup-request-popup-images { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.pickup-request-popup-images img { width: 72px; height: 64px; border: 1px solid rgba(18, 61, 45, .14); border-radius: 8px; background: white; object-fit: cover; }
.pickup-request-popup .rebooter-popup-submission-actions { flex-wrap: wrap; align-items: center; gap: 6px; }
.pickup-request-action-form { width: auto; margin: 0; }
.pickup-request-action-form .rebooter-list-map-button, .pickup-request-popup .rebooter-list-map-button { min-height: 34px; margin: 0; padding: 6px 10px; font-size: 12px; text-decoration: none; }
.pickup-request-popup .app-mission-capacity { margin: 0; font-size: 11px; }
.rebooter-popup-more { color: var(--app-forest); font-size: inherit; font-weight: inherit; }
.rebooter-description-toggle { display: inline; margin: 0 0 0 3px; padding: 0; border: 0; background: transparent; color: var(--app-forest); cursor: pointer; font: inherit; text-decoration: underline; }
.rebooter-popup-timeline { margin: 10px 0 12px; padding: 6px 4px 0; }
.rebooter-popup-timeline-track { position: relative; height: 4px; margin: 0 4px 8px; border-radius: 999px; background: rgba(18, 61, 45, .2); }
.rebooter-popup-timeline-track::before { position: absolute; inset: 0; border-radius: inherit; background: var(--app-sage); content: ""; }
.rebooter-popup-timeline-marker { position: absolute; z-index: 1; top: 50%; display: block; width: 30px; height: 30px; object-fit: contain; transform: translate(-50%, -50%); }
.rebooter-popup-timeline-marker--start, .rebooter-popup-timeline-marker--end { width: 26px; height: 26px; }
.rebooter-popup-timeline-labels { display: flex; justify-content: space-between; gap: 12px; color: var(--app-forest); font-size: 11px; }
.rebooter-popup-timeline-labels > span:last-child { text-align: right; }
.rebooter-popup-timeline-status { margin: 5px 0 0 !important; color: var(--app-muted); font-size: 11px !important; text-align: center; }
.rebooter-popup-submissions { display: grid; gap: 7px; }
.rebooter-popup-submission { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 10px; padding-top: 7px; border-top: 1px solid rgba(18, 61, 45, .12); }
.collector-popup-submission { align-items: flex-start; }
.collector-popup-submission-info { display: grid; min-width: 0; flex: 1 1 auto; gap: 3px; }
.collector-popup-mission-dates { color: var(--app-muted); font-size: 10px; line-height: 1.35; }
.collector-popup-mission-status { max-width: 150px; color: var(--app-muted); font-size: 11px; line-height: 1.35; text-align: right; }
.rebooter-popup-submission-title { min-width: 0; flex: 1 1 auto; color: var(--app-forest); font-size: 12px; font-weight: 400; line-height: 1.35; text-align: left; }
.rebooter-popup-submission-actions { display: flex; flex: 0 0 auto; align-items: center; justify-content: flex-end; gap: 6px; }
.rebooter-popup-enrollment-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 6px; }
.rebooter-popup-submission button { width: auto; max-width: 140px; min-height: 34px; padding: 6px 8px; border: 1px solid var(--app-forest); border-radius: 18px; background: var(--app-forest); color: white; cursor: pointer; font-size: 12px; font-weight: 400; }
.rebooter-popup-submission button:disabled { border-color: rgba(18, 61, 45, .2); background: #e8eee9; color: var(--app-muted); cursor: not-allowed; }
.rebooter-popup-progress-button { display: inline-flex; max-width: 140px; min-height: 34px; align-items: center; justify-content: center; padding: 6px 8px; border: 1px solid var(--app-forest); border-radius: 18px; background: var(--app-forest); color: white; cursor: pointer; font-size: 12px; font-weight: 400; text-align: center; text-decoration: none; }
.leaflet-container a.rebooter-popup-progress-button { color: white; }
.rebooter-popup-progress-button:disabled { border-color: rgba(18, 61, 45, .2); background: #e8eee9; color: var(--app-muted); cursor: not-allowed; }
.rebooter-popup-submission form { margin: 0; }
.rebooter-popup-submission-actions form { width: auto; }
.rebooter-popup-submission form button { display: block; }
.rebooter-mission-confirm-dialog[open] { display: flex; flex-direction: column; overflow: hidden; }
.rebooter-mission-confirm-dialog .collector-panel-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.rebooter-mission-confirm-dialog .collector-panel-header h2 { flex: 1 1 auto; margin: 0 0 14px; overflow-wrap: anywhere; font-weight: 400; text-align: left; }
.rebooter-mission-confirm-content { min-height: 0; flex: 1 1 auto; overflow-y: auto; overscroll-behavior: contain; display: grid; gap: 12px; }
.rebooter-mission-confirm-content p { text-align: left; }
.rebooter-mission-confirm-quest { color: var(--app-forest) !important; font-size: 12px !important; }
.rebooter-mission-confirm-description { white-space: pre-line; }
.rebooter-mission-confirm-rewards { display: grid; gap: 8px; }
.rebooter-mission-confirm-rewards article { display: grid; gap: 4px; padding: 12px; border: 1px solid rgba(18, 61, 45, .14); border-radius: 12px; background: rgba(216, 235, 226, .42); }
.rebooter-mission-confirm-rewards article > span { color: var(--app-muted); font-size: 12px; }
.rebooter-mission-confirm-rewards article > strong { color: var(--app-forest); font-size: 18px; font-weight: 500; }
.rebooter-mission-confirm-rewards article > small { color: var(--app-muted); font-size: 11px; line-height: 1.4; }
.rebooter-mission-confirm-location { font-size: 12px !important; }
.rebooter-mission-confirm-form { flex: 0 0 auto; margin-top: 12px; padding-top: 10px; border-top: 1px solid rgba(18, 61, 45, .14); }
.rebooter-mission-confirm-actions { display: flex; justify-content: space-between; gap: 12px; margin-top: 14px; }
.rebooter-mission-confirm-actions button { min-height: 42px; padding: 8px 18px; border: 1px solid var(--app-forest); border-radius: 20px; cursor: pointer; font: inherit; }
.rebooter-mission-confirm-actions .rebooter-mission-back { background: white; color: var(--app-forest); }
.rebooter-mission-confirm-actions .rebooter-mission-confirm { background: var(--app-forest); color: white; }
.rebooter-mission-confirm-actions button:disabled { opacity: .65; }
.rebooter-mission-confirm-form .app-location-feedback { text-align: left; }
.rebooter-mission-directions { display: inline-flex; min-height: 36px; align-items: center; justify-content: center; padding: 7px 12px; border: 1px solid var(--app-forest); border-radius: 18px; background: var(--app-forest); color: white; font-size: 12px; font-weight: 400; text-align: center; text-decoration: none; white-space: nowrap; }
.rebooter-mission-actions { display: flex; flex: 0 0 auto; align-items: center; }
.rebooter-mission-actions .rebooter-mission-status { font-weight: 400; }
.rebooter-mission-directions:hover { background: var(--app-sage); color: var(--app-forest); }
.rebooter-mission-directions:focus-visible, .rebooter-mission-confirm-actions button:focus-visible { outline: 2px solid var(--app-forest); outline-offset: 2px; }
.app-location-feedback { margin: 8px 0 0; color: #71341f; font-size: 12px; line-height: 1.4; }
.rebooter-mission-details > p:first-child { margin-top: 4px; }
.rebooter-list-map-button { min-height: 40px; margin: 4px 0 12px; padding: 8px 14px; border: 1px solid var(--app-forest); border-radius: 20px; background: white; color: var(--app-forest); cursor: pointer; font-weight: 400; }
.rebooter-list-map-button:hover { background: var(--app-sage); }
.collector-confirm-dialog { box-sizing: border-box; width: min(420px, calc(100% - 32px)); max-height: min(85svh, 560px); padding: 22px; border: 1px solid rgba(18, 61, 45, .16); border-radius: 20px; background: rgba(255, 255, 255, .75); color: var(--app-forest); box-shadow: 0 12px 36px rgba(18, 61, 45, .24); }
.collector-confirm-dialog::backdrop { background: rgba(18, 61, 45, .6); backdrop-filter: blur(2px); }
.pickup-request-dialog { max-height: min(88svh, 740px); overflow-y: auto; overscroll-behavior: contain; }
.pickup-request-dialog[open] { display: block; }
.pickup-request-dialog .collector-panel-header h2 { flex: 1 1 auto; margin: 0; text-align: left; }
.pickup-request-form { display: grid; gap: 12px; margin-top: 16px; }
.pickup-request-form .app-field { margin: 0; }
.pickup-select-picker { position: relative; }
.pickup-select-button { display: flex; width: 100%; min-height: 40px; align-items: center; justify-content: space-between; padding: 8px 10px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 6px; background: white; color: var(--app-forest); cursor: pointer; font: inherit; text-align: left; }
.pickup-select-button::after { width: 0; height: 0; margin-left: 10px; border: 5px solid transparent; border-top-color: currentColor; content: ""; transform: translateY(2px); }
.pickup-select-button:disabled { background: #f0f2ee; color: var(--app-muted); cursor: not-allowed; }
.pickup-select-options { position: absolute; z-index: 20; top: calc(100% + 4px); right: 0; left: 0; max-height: 220px; overflow-y: auto; padding: 4px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 8px; background: white; box-shadow: 0 8px 24px rgba(18, 61, 45, .2); }
.pickup-select-options[hidden] { display: none; }
.pickup-select-option { display: block; width: 100%; padding: 9px 10px; border: 0; border-radius: 5px; background: transparent; color: var(--app-forest); cursor: pointer; font: inherit; text-align: left; }
.pickup-select-option[aria-selected="true"], .pickup-select-option:hover, .pickup-select-option:focus-visible { background: var(--app-sage); outline: none; }
.pickup-select-option:disabled { color: var(--app-muted); cursor: not-allowed; }
.pickup-request-form textarea { width: 100%; min-height: 68px; resize: vertical; }
.pickup-request-form > button[type="submit"] { border-radius: 24px; }
.pickup-image-label { display: block; margin-bottom: 7px; font-size: 13px; font-weight: 700; }
.pickup-image-sources { display: flex; gap: 10px; }
.pickup-image-source { display: flex; min-height: 68px; flex: 1; flex-direction: column; align-items: center; justify-content: center; gap: 5px; border: 1px solid rgba(18, 61, 45, .2); border-radius: 10px; background: white; color: var(--app-forest); cursor: pointer; font-size: 12px; }
.pickup-image-source:hover, .pickup-image-source:focus-within { background: var(--app-sage); }
.pickup-image-source svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.8; }
.app-field input.pickup-image-input { position: absolute; width: 1px; min-height: 1px; margin: -1px; padding: 0; overflow: hidden; border: 0; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; }
.pickup-image-remove { flex: 0 0 auto; padding: 4px 8px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 14px; background: white; color: var(--app-forest); cursor: pointer; font: inherit; font-size: 11px; }
.pickup-location-dialog { max-width: 430px; }
.collector-confirm-dialog.pickup-location-dialog h2 { font-size: clamp(22px, 5vw, 26px); }
.collector-confirm-dialog.pickup-location-dialog p { font-size: 16px; line-height: 1.6; text-align: left; }
.pickup-location-dialog .collector-confirm-actions { justify-content: stretch; }
.pickup-location-dialog .collector-confirm-actions button { flex: 1; border-radius: 22px; }
.pickup-request-help { margin: -4px 0 0 !important; font-size: 11px !important; text-align: left !important; }
.pickup-request-feedback { min-height: 0; margin: 0 !important; color: var(--app-muted); font-size: 12px !important; line-height: 1.45; text-align: left !important; }
.pickup-request-feedback:empty { display: none; }
.pickup-request-form button:disabled, .pickup-request-retry:disabled, .pickup-request-delete:disabled { cursor: wait; opacity: .65; }
.pickup-requests-dialog { height: min(78svh, 700px); max-height: min(85svh, 760px); }
.pickup-requests-dialog:not([open]) { display: none; }
.pickup-request-list { display: grid; align-content: start; gap: 12px; }
.pickup-request-card { padding: 14px; border: 1px solid rgba(18, 61, 45, .14); border-radius: 14px; background: rgba(255, 255, 255, .74); }
.pickup-request-card > header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; }
.pickup-request-card h3 { margin: 0; color: var(--app-forest); font-size: 15px; }
.pickup-request-card > p { margin: 8px 0; color: var(--app-muted); font-size: 12px; line-height: 1.45; white-space: pre-line; }
.pickup-request-images { display: flex; flex-wrap: wrap; gap: 6px; margin: 10px 0; }
.pickup-request-images img { width: 70px; height: 62px; border: 1px solid rgba(18, 61, 45, .14); border-radius: 8px; background: white; object-fit: cover; }
.pickup-request-status { display: inline-flex; padding: 5px 9px; border-radius: 999px; background: rgba(216, 235, 226, .8); color: var(--app-forest); font-size: 11px; font-weight: 700; }
.pickup-request-status--sin_enviar { background: #fff3ef; color: #71341f; }
.pickup-request-status--asignada, .pickup-request-status--en_ruta { background: #e6edf7; color: #294c70; }
.pickup-request-status--retirado, .pickup-request-status--cancelada { background: #e8eee9; color: #53645a; }
.pickup-request-schedule { margin: 10px 0; padding: 12px; border: 1px solid rgba(18, 61, 45, .16); border-radius: 12px; background: rgba(216, 235, 226, .35); }
.pickup-request-schedule h4 { margin: 0 0 8px; color: var(--app-forest); }
.pickup-request-schedule p { margin: 6px 0; }
.pickup-schedule-option { padding-top: 6px; border-top: 1px solid rgba(18, 61, 45, .12); }
.pickup-distance-commitment { padding: 10px 12px; border-left: 3px solid var(--app-forest); background: rgba(216, 235, 226, .65); color: var(--app-forest); font-size: 13px; }
.pickup-schedule-option .rebooter-list-map-button { margin-bottom: 6px; }
.pickup-schedule-response { min-height: 36px; border-radius: 20px; }
.pickup-schedule-dialog { max-height: min(90svh, 760px); overflow-y: auto; }
.pickup-schedule-dialog .collector-panel-header h2 { margin: 0; }
.pickup-schedule-dialog > p { margin: 0 0 14px; font-size: 13px; line-height: 1.5; text-align: left; }
.pickup-schedule-form { display: grid; gap: 14px; }
.pickup-schedule-option-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; min-width: 0; margin: 0; padding: 12px; border: 1px solid rgba(18, 61, 45, .18); border-radius: 12px; }
.pickup-schedule-option-fields legend { padding: 0 5px; font-size: 13px; font-weight: 700; }
.pickup-schedule-option-fields label, .pickup-schedule-instructions { display: grid; min-width: 0; gap: 5px; color: var(--app-forest); font-size: 12px; font-weight: 700; }
.pickup-schedule-option-fields input, .pickup-schedule-option-fields select, .pickup-schedule-instructions textarea { box-sizing: border-box; width: 100%; min-height: 40px; padding: 7px 8px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 7px; background: white; color: var(--app-forest); font: inherit; font-size: 13px; }
.pickup-date-picker { position: relative; display: inline-flex; width: 100%; min-width: 0; height: 40px; }
.pickup-schedule-option-fields .pickup-date-value { position: absolute; z-index: 2; inset: 0; width: 100%; height: 40px; min-height: 40px; padding: 0; border: 0; cursor: pointer; opacity: .01; }
.pickup-date-display { display: flex; box-sizing: border-box; width: 100%; min-height: 40px; align-items: center; padding: 7px 8px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 7px; background: white; color: var(--app-forest); font-size: 13px; font-weight: 600; line-height: 1.2; white-space: nowrap; }
.pickup-date-picker:hover .pickup-date-display { background: rgba(216, 235, 226, .65); }
.pickup-date-picker:focus-within .pickup-date-display { outline: 2px solid var(--app-forest); outline-offset: 2px; }
.pickup-schedule-option-fields select:disabled { background: #f1f3f1; color: #78847b; }
.pickup-schedule-add-option { display: flex; align-items: center; gap: 8px; font-size: 13px; }
.pickup-schedule-add-option input { width: 18px; height: 18px; }
.pickup-schedule-option-fields[hidden] { display: none; }
.pickup-schedule-form > .app-button { margin: 0; border-radius: 24px; }
.pickup-agenda-state { color: var(--app-forest) !important; font-weight: 700; }
.pickup-agenda-start { width: auto; margin: 8px 0 0; padding: 9px 18px; border-radius: 24px; }
.app-profile-panel { overflow: visible; }
.app-profile-panel [data-profile-cancel][hidden], .app-profile-panel [data-profile-edit-photo][hidden] { display: none; }
.app-profile-panel [data-close-collector-panel][hidden] { display: none; }
.rebooter-map-panel--profile.app-profile-panel { width: min(360px, calc(100% - 28px)); }
.app-profile-panel .app-profile-content { max-height: min(62svh, 520px); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.app-profile-panel--photo-options-open .app-profile-content { padding-top: 104px; }
.collector-missions.app-profile-panel { width: min(360px, calc(100% - 28px)); height: auto; max-height: none; overflow: visible; padding-top: calc(20% + 12px); }
.app-profile-avatar { position: absolute; z-index: 2; top: 0; left: 50%; width: 40%; aspect-ratio: 1; transform: translate(-50%, -50%); }
.app-profile-avatar-image, .app-profile-avatar-placeholder { display: grid; width: 100%; height: 100%; place-items: center; border: 4px solid white; border-radius: 50%; background: var(--app-sage); box-shadow: 0 4px 14px rgba(18, 61, 45, .2); color: var(--app-forest); object-fit: cover; }
.app-profile-avatar-placeholder svg { width: 43px; height: 43px; }
.app-profile-icon-button { display: grid; width: 38px; height: 38px; flex: 0 0 auto; place-items: center; padding: 9px; border: 1px solid rgba(18, 61, 45, .2); border-radius: 50%; background: white; color: var(--app-forest); cursor: pointer; }
.app-profile-icon-button:hover, .app-profile-icon-button:focus-visible { background: var(--app-sage); }
.app-profile-icon-button:focus-visible { outline: 3px solid rgba(216, 235, 226, .9); }
.app-profile-icon-button svg { width: 19px; height: 19px; }
.app-profile-avatar-edit { position: absolute; right: -2px; bottom: 0; width: 34px; height: 34px; padding: 8px; }
.app-profile-photo-source-list { position: absolute; z-index: 4; top: calc(100% + 8px); left: 50%; display: grid; width: min(230px, calc(100vw - 48px)); gap: 4px; padding: 6px; border: 1px solid rgba(18, 61, 45, .16); border-radius: 12px; background: white; box-shadow: 0 8px 24px rgba(18, 61, 45, .2); transform: translateX(-50%); }
.app-profile-photo-source-list[hidden] { display: none; }
.app-profile-photo-source-list .app-profile-photo-hint { margin: 0 4px 2px; padding: 4px 5px 7px; border-bottom: 1px solid rgba(18, 61, 45, .12); color: var(--app-muted); font-size: 11px; line-height: 1.35; text-align: center; }
.app-profile-photo-source { display: flex; min-height: 38px; align-items: center; gap: 10px; padding: 7px 9px; border: 0; border-radius: 8px; background: transparent; color: var(--app-forest); cursor: pointer; font: inherit; font-size: 13px; text-align: left; }
.app-profile-photo-source:hover, .app-profile-photo-source:focus-visible { outline: none; background: var(--app-sage); }
.app-profile-photo-source:focus-visible { box-shadow: 0 0 0 2px var(--app-forest); }
.app-profile-photo-source svg { width: 21px; height: 21px; flex: 0 0 auto; }
.app-profile-photo-source span { overflow-wrap: anywhere; }
.app-profile-heading { position: relative; display: flex; align-items: center; justify-content: center; gap: 10px; min-height: 40px; margin-bottom: 12px; }
.app-profile-heading h2 { max-width: calc(100% - 48px); margin: 0; overflow-wrap: anywhere; }
.app-profile-edit-close { position: absolute; z-index: 5; top: 10px; right: 10px; margin: 0; }
.app-profile-cancel { padding: 7px 12px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 18px; background: white; color: var(--app-forest); cursor: pointer; font-size: 13px; }
.app-profile-details { display: grid; gap: 0; margin: 0; }
.app-profile-details > div { display: grid; gap: 3px; padding: 10px 0; border-top: 1px solid rgba(18, 61, 45, .12); }
.app-profile-details dt { color: var(--app-muted); font-size: 12px; }
.app-profile-details dd { margin: 0; overflow-wrap: anywhere; color: var(--app-forest); font-size: 15px; }
.app-profile-edit[hidden], .app-profile-view[hidden] { display: none; }
.app-profile-form { display: grid; gap: 10px; margin-top: 12px; }
.app-profile-form .app-field { position: relative; margin: 0; }
.app-profile-form .app-field input { padding: 12px 14px 0; border-radius: 8px; }
.app-profile-form .app-field label { position: absolute; top: 50%; left: 14px; margin: 0; color: var(--app-muted); font-size: 15px; font-weight: 400; pointer-events: none; transform: translateY(-50%); transition: top .15s ease, font-size .15s ease, opacity .15s ease, transform .15s ease; }
.app-profile-form .app-field input:focus + label { top: 6px; font-size: 11px; transform: none; }
.app-profile-form .app-field input:not(:placeholder-shown) + label { opacity: 0; }
.app-profile-phone > label { display: block; margin-bottom: 6px; color: var(--app-muted); font-size: 12px; }
.app-profile-phone-inputs { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 8px; }
.app-profile-phone-prefix, .app-profile-phone-number { box-sizing: border-box; width: 100%; min-width: 0; min-height: 50px; padding: 0 10px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 8px; background: white; color: var(--app-forest); font: inherit; font-size: 14px; }
.app-profile-phone-prefix:focus, .app-profile-phone-number:focus { outline: 3px solid rgba(216, 235, 226, .9); border-color: var(--app-forest); }
.app-profile-location-fields { display: grid; gap: 8px; margin: 4px 0 0; padding: 12px; border: 1px solid rgba(18, 61, 45, .18); border-radius: 10px; }
.app-profile-location-fields legend { padding: 0 5px; color: var(--app-forest); font-size: 13px; font-weight: 700; }
.app-profile-location-fields p { margin: 0; color: var(--app-muted); font-size: 12px; line-height: 1.45; }
.app-profile-location-fields > label { display: grid; gap: 5px; color: var(--app-muted); font-size: 12px; }
.app-profile-location-fields input { box-sizing: border-box; width: 100%; min-width: 0; min-height: 42px; padding: 8px 10px; border: 1px solid rgba(18, 61, 45, .24); border-radius: 8px; background: white; color: var(--app-forest); font: inherit; }
.app-profile-location-fields .app-profile-location-current { width: auto; margin: 0; padding: 9px 14px; border-radius: 20px; font-size: 12px; }
.app-profile-location-fields .app-profile-location-current:disabled { opacity: .65; }
.app-profile-location-fields .app-profile-location-choice-label { margin-top: 2px; color: var(--app-forest); font-size: 12px; font-weight: 700; }
.app-profile-location-choices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.app-profile-location-choices .app-profile-location-current { width: 100%; min-height: 44px; padding: 8px 10px; }
.app-profile-location-feedback:empty { display: none; }
.app-profile-location-map-dialog { width: min(620px, calc(100% - 32px)); max-height: min(88svh, 720px); }
.app-profile-location-map-dialog[open] { display: flex; flex-direction: column; gap: 10px; }
.app-profile-location-map-dialog .collector-panel-header { flex: 0 0 auto; align-items: center; margin: 0; }
.app-profile-location-map-dialog .collector-panel-header h2 { flex: 1 1 auto; margin: 0; font-size: clamp(18px, 4vw, 22px); text-align: left; }
.app-profile-location-map-help, .app-profile-location-map-feedback { flex: 0 0 auto; margin: 0 !important; color: var(--app-muted); font-size: 13px !important; line-height: 1.4; text-align: left !important; }
.app-profile-location-map { width: 100%; height: min(55svh, 420px); min-height: 260px; overflow: hidden; border: 1px solid rgba(18, 61, 45, .2); border-radius: 12px; background: #dce8df; }
.app-profile-location-map .leaflet-control-attribution { font-size: 10px; }
.app-profile-location-map-dialog .collector-confirm-actions { flex: 0 0 auto; justify-content: stretch; margin-top: 0; }
.app-profile-location-map-dialog .collector-confirm-actions button { flex: 1 1 0; }
.app-profile-form .app-button { margin: 4px 0 0; border-radius: 24px; }
.app-profile-photo { display: block; width: 88px; height: 88px; margin: 8px 0 12px; border: 2px solid rgba(18, 61, 45, .16); border-radius: 50%; object-fit: cover; }
.app-profile-photo-picker { display: grid; gap: 8px; }
.app-profile-photo-error { margin: 0; color: #71341f; font-size: 12px; line-height: 1.4; }
.app-profile-file-input { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.collector-confirm-dialog.app-profile-crop-dialog { width: min(420px, calc(100% - 28px)); max-height: min(92svh, 720px); overflow-y: auto; }
.app-profile-crop-dialog h2 { margin: 0 0 8px; }
.app-profile-crop-dialog .app-profile-crop-instructions { margin: 0 0 14px; text-align: center; }
.app-profile-crop-canvas { display: block; width: min(78vw, 320px); height: min(78vw, 320px); margin: 0 auto 16px; border-radius: 50%; background: #fff; cursor: grab; touch-action: none; }
.app-profile-crop-canvas:active { cursor: grabbing; }
.app-profile-crop-zoom { display: grid; grid-template-columns: auto minmax(0, 1fr) 48px; align-items: center; gap: 10px; font-size: 13px; }
.app-profile-crop-zoom input { width: 100%; accent-color: var(--app-forest); }
.app-profile-crop-zoom output { color: var(--app-muted); text-align: right; }
.app-profile-crop-dialog .app-profile-crop-error { margin: 12px 0 0; color: #71341f; font-size: 13px; text-align: left; }
.app-profile-crop-dialog .collector-confirm-actions { justify-content: stretch; }
.app-profile-crop-dialog .collector-confirm-actions button { flex: 1 1 0; }
.pickup-request-incomplete { color: #71341f !important; }
.app-profile-panel .app-profile-close { position: absolute; z-index: 3; top: 10px; right: 10px; margin: 0; }
.pickup-request-card .rebooter-list-map-button { margin: 4px 6px 0 0; }
.pickup-request-card .pickup-request-delete { background: white; color: var(--app-forest); }
.collector-confirm-dialog h2 { margin: 0 0 12px; font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: 20px; text-align: center; }
.collector-confirm-dialog p { margin: 0; color: var(--app-muted); font-size: 14px; line-height: 1.5; text-align: center; }
.collector-confirm-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 20px; }
.collector-confirm-actions button { min-height: 40px; padding: 8px 16px; border: 1px solid var(--app-forest); border-radius: 20px; background: white; color: var(--app-forest); cursor: pointer; font: inherit; font-weight: 400; }
.collector-confirm-actions .collector-confirm-accept { background: var(--app-forest); color: white; }
.collector-confirm-actions a.collector-confirm-accept { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; padding: 8px 16px; border: 1px solid var(--app-forest); border-radius: 20px; font: inherit; font-weight: 400; text-decoration: none; }
.collector-confirm-actions button:hover { background: var(--app-sage); color: var(--app-forest); }
.collector-supervision-detail { overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.collector-supervision-detail .collector-panel-header { align-items: flex-start; }
.collector-supervision-detail .collector-panel-header h2 { flex: 1 1 auto; margin: 0; overflow-wrap: anywhere; }
.collector-supervision-detail > p { line-height: 1.5; text-align: justify; }
.collector-detail-task, .collector-detail-reviews-title { margin: 18px 0 8px; font-size: 16px; text-align: center; }
.collector-detail-reviews-title { padding-top: 12px; border-top: 1px solid rgba(18, 61, 45, .14); }
.collector-supervision-open { width: auto; min-height: 40px; margin: 12px auto 0; padding: 8px 16px; border-radius: 20px; }
.collector-review-actions .app-button { width: auto; }
.rebooter-home-notice { margin: 12px; }
.collector-home-shell { position: fixed; inset: 0; display: block; width: 100%; height: 100vh; height: 100svh; min-height: 0; overflow: hidden; padding: 0; }
.collector-home-shell > .app-brand, .collector-home-shell > .app-back { display: none; }
.collector-dashboard { position: relative; width: 100%; height: 100%; margin: 0 auto; }
.collector-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 20px; }
.collector-header h1 { margin: 8px 0; font-size: clamp(26px, 6vw, 38px); }
.collector-header p { color: var(--app-muted); line-height: 1.5; }
.collector-logout { width: auto; margin: 0; }
.collector-map-stage { position: relative; height: 100%; min-height: 0; overflow: hidden; background: #dce8df; }
.collector-map { position: absolute; inset: 0; }
.collector-map .leaflet-control-attribution { font-size: 10px; }
.collector-map-header { top: max(76px, calc(env(safe-area-inset-top) + 70px)); }
.collector-map-controls { position: absolute; }
.collector-map-stage > .rebooter-map-status { display: none; }
.collector-impact-summary { grid-template-columns: 1fr; margin: 12px 0; }
.collector-impact-summary article { grid-template-columns: 1fr auto; align-items: center; padding: 10px; }
.collector-impact-summary span { font-size: 11px; }
.collector-impact-summary strong { font-size: 15px; text-align: right; }
.collector-mission-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 12px 0; }
.collector-mission-stats > div { display: flex; min-width: 0; align-items: center; justify-content: space-between; gap: 8px; padding: 10px; border: 1px solid rgba(18, 61, 45, .14); background: rgba(216, 235, 226, .35); }
.collector-mission-stats span { color: var(--app-muted); font-size: 11px; }
.collector-mission-stats strong { font-size: 15px; }
.collector-missions { position: absolute; z-index: 900; top: 50%; left: 50%; width: min(440px, calc(100% - 28px)); height: min(75svh, 680px); max-height: min(75svh, 680px); overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; margin: 0; padding: 18px; border: 1px solid rgba(18, 61, 45, .16); border-radius: 20px; background: rgba(255, 255, 255, .75); box-shadow: 0 12px 36px rgba(18, 61, 45, .24); scroll-margin-top: 16px; transform: translate(-50%, -50%); }
#collector-panel-agenda { z-index: 920; display: flex; width: min(900px, calc(100% - 32px)); height: min(88svh, 900px); max-height: min(88svh, 900px); flex-direction: column; overflow-y: auto; }
#collector-panel-agenda[hidden] { display: none; }
#collector-panel-supervision { z-index: 900; background: rgba(255, 255, 255, .75); }
.collector-missions[hidden] { display: none; }
.collector-panel-header { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.collector-panel-header h2 { margin: 0; }
.collector-panel-header .rebooter-ecoquests-close { margin: 0; }
.collector-missions h2 { margin: 0 0 12px; font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: clamp(22px, 5vw, 30px); }
.pickup-agenda-calendar-view { min-height: 0; flex: 1 1 auto; }
.pickup-calendar-toolbar { display: grid; grid-template-columns: 48px minmax(0, 1fr) 48px; align-items: center; gap: 12px; margin: 8px 0 18px; }
.pickup-calendar-toolbar h3 { margin: 0; color: var(--app-forest); font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: clamp(20px, 4vw, 28px); text-align: center; text-transform: capitalize; }
.pickup-calendar-nav { display: grid; width: 44px; height: 44px; place-items: center; border: 1px solid rgba(18, 61, 45, .2); border-radius: 50%; background: white; color: var(--app-forest); cursor: pointer; font: inherit; font-size: 30px; line-height: 1; }
.pickup-calendar-weekdays, .pickup-calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: clamp(3px, 1vw, 8px); }
.pickup-calendar-weekdays { margin-bottom: 6px; color: var(--app-muted); font-size: clamp(10px, 2.5vw, 14px); font-weight: 700; text-align: center; }
.pickup-calendar-weekdays > span { padding: 5px 0; }
.pickup-calendar-day-button, .pickup-calendar-cell { box-sizing: border-box; display: flex; min-width: 0; min-height: clamp(54px, 10vw, 92px); flex-direction: column; align-items: center; justify-content: flex-start; gap: 7px; padding: clamp(6px, 1.5vw, 12px) 2px 6px; border: 1px solid rgba(18, 61, 45, .13); border-radius: 12px; background: rgba(255, 255, 255, .82); color: var(--app-forest); font: inherit; }
.pickup-calendar-day-button:not(:disabled) { background: #e3f0e8; border-color: rgba(18, 61, 45, .3); cursor: pointer; }
.pickup-calendar-day-button:not(:disabled):hover, .pickup-calendar-day-button:not(:disabled):focus-visible { background: #cfe5d8; outline: 2px solid var(--app-forest); outline-offset: 1px; }
.pickup-calendar-day-button:disabled { opacity: .7; }
.pickup-calendar-day-button.is-today .pickup-calendar-day-number { display: grid; width: 28px; height: 28px; place-items: center; border-radius: 50%; background: var(--app-forest); color: white; }
.pickup-calendar-day-number { min-height: 26px; font-size: clamp(13px, 3vw, 17px); line-height: 26px; }
.pickup-calendar-markers { display: inline-flex; min-height: 12px; align-items: center; justify-content: center; gap: 4px; }
.pickup-calendar-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--app-forest); }
.pickup-calendar-more { color: var(--app-forest); font-size: 14px; font-weight: 800; line-height: 10px; }
.pickup-calendar-empty { margin: 16px 0; }
.pickup-agenda-pending { margin-top: 24px; padding-top: 18px; border-top: 1px solid rgba(18, 61, 45, .16); }
.pickup-agenda-pending > h3 { margin: 0 0 12px; color: var(--app-forest); font-size: 16px; text-align: left; }
.pickup-agenda-pending .collector-mission-card { padding: 12px 14px; }
.pickup-agenda-pending .collector-mission-card h4 { margin: 0; }
.pickup-calendar-day { min-height: 0; flex: 1 1 auto; overflow-y: auto; }
.pickup-calendar-day[hidden] { display: none; }
.pickup-calendar-day > h3 { margin: 8px 0 18px; color: var(--app-forest); font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: clamp(20px, 4vw, 28px); text-align: center; text-transform: capitalize; }
.pickup-calendar-back { position: sticky; bottom: 0; width: 100%; margin: 16px 0 0; border-radius: 24px; box-shadow: 0 -8px 16px rgba(255, 255, 255, .9); }
.pickup-calendar-day .collector-mission-card { background: rgba(255, 255, 255, .9); }
.collector-history { padding-top: 0; }
.collector-mission-card:target { outline: 3px solid var(--app-coral); outline-offset: 3px; }
.collector-mission-list { display: grid; gap: 16px; }
.collector-mission-card { padding: 18px; border: 1px solid rgba(18, 61, 45, .14); border-radius: 16px; background: rgba(255, 255, 255, .75); }
.collector-pending-mission-title { width: 100%; color: var(--app-forest); font: inherit; font-weight: 700; text-align: left; cursor: pointer; }
.collector-pending-mission-title:hover { background: rgba(216, 235, 226, .7); }
.collector-pending-mission-title:focus-visible { outline: 3px solid var(--app-coral); outline-offset: 3px; }
.collector-mission-card h3 { margin: 0 0 8px; font-family: "Space Grotesk", "Avenir Next", sans-serif; font-size: 19px; text-align: center; }
.collector-mission-card h4 { margin: 0 0 8px; font-size: 15px; text-align: center; }
.collector-mission-card > p { line-height: 1.5; text-align: justify; }
.collector-mission-card h5 { margin: 18px 0 8px; font-size: 14px; }
.rebooter-map-panel :is(h2, h3, h4, h5),
.rebooter-ecoquests :is(h2, h3, h4, h5),
.collector-missions :is(h2, h3, h4, h5),
.collector-supervision-detail :is(h2, h3, h4, h5),
.rebooter-ecoquest-title,
.rebooter-mission-title,
.rebooter-nearby-quest-title,
.rebooter-description-disclosure > summary,
.rebooter-popup-submission > summary { font-weight: 400; }
.collector-review-card { margin-top: 10px; padding: 14px; border: 1px solid rgba(18, 61, 45, .12); border-radius: 12px; background: rgba(216, 235, 226, .28); }
.collector-review-card p { line-height: 1.5; overflow-wrap: anywhere; }
.collector-review-photo-link { display: inline-flex; max-width: 100%; flex-direction: column; align-items: flex-start; gap: 6px; margin: 4px 0 8px; color: var(--app-forest); font-size: 12px; font-weight: 700; }
.collector-review-photo { display: block; max-width: min(100%, 520px); max-height: 360px; border: 1px solid rgba(18, 61, 45, .16); border-radius: 10px; object-fit: contain; }
.collector-review-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.collector-review-actions .app-button { width: auto; min-height: 40px; margin: 8px 0 0; padding: 8px 12px; border-radius: 20px; }
.collector-review-actions .app-button--secondary { background: transparent; }
@media (max-width: 600px) {
	.collector-home-shell { padding: 0; }
	.collector-header { flex-direction: column; }
	.collector-map-stage { min-height: 100svh; }
	.collector-map-header { top: max(82px, calc(env(safe-area-inset-top) + 76px)); }
	.collector-missions { padding: 14px; }
	#collector-panel-agenda { width: calc(100% - 16px); height: min(94svh, 900px); max-height: min(94svh, 900px); padding: 12px; border-radius: 16px; }
	.pickup-calendar-grid, .pickup-calendar-weekdays { gap: 3px; }
	.pickup-calendar-day-button, .pickup-calendar-cell { min-height: 58px; gap: 4px; border-radius: 9px; }
	.pickup-calendar-dot { width: 7px; height: 7px; }
}
@media (prefers-reduced-motion: reduce) {
	.map-welcome-impact.is-animated { transition: none; }
}
@media (min-width: 760px) {
	.rebooter-map-stage { height: 100vh; height: 100svh; min-height: 0; }
	.rebooter-map-panel--nearby { left: 24px; }
	.rebooter-map-panel--stats { right: 24px; }
	.rebooter-map-control--nearby { left: 24px; }
	.rebooter-map-control--stats { right: 24px; }
}
@media (max-width: 480px) {
	.app-shell { justify-content: flex-start; padding-top: max(28px, env(safe-area-inset-top)); }
	.app-card:not(.app-card--home) { margin-block: auto; }
	.app-card--home { padding: 22px 16px; }
	.rebooter-home-shell { padding: 0; }
	.rebooter-home-shell > .app-card--home { padding: 0; }
	.rebooter-map-header { top: max(82px, calc(env(safe-area-inset-top) + 76px)); }
	.rebooter-ecoquests { gap: 12px; padding: max(12px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) max(12px, env(safe-area-inset-bottom)) max(14px, env(safe-area-inset-left)); }
	.app-impact-summary { grid-template-columns: 1fr; }
	.app-impact-summary article { grid-template-columns: 1fr auto; align-items: center; }
	.app-ecoquest-card { padding: 14px; }
	.app-mission-card { padding: 12px; }
	.app-back { padding-bottom: env(safe-area-inset-bottom); }
}