body.fishing_reports {background-color: #f0f2f5}
body.form-page:has(.fishing-report-new-container) .main-content {align-items: center;scrollbar-width: none;-ms-overflow-style: none}
body.form-page:has(.fishing-report-new-container) .main-content::-webkit-scrollbar {display: none}
.fishing-report-new-container {max-width: 520px;margin: 0 auto;padding: 0 24px;display: flex;flex-direction: column;height: calc(100dvh - 60px - 50px);overflow: hidden}
.fishing-report-new-container > form {display: flex;flex-direction: column;flex: 1;min-height: 0;overflow: hidden}
@media (max-width: 768px) {.fishing-report-new-container {position: fixed;top: 0;left: 0;right: 0;bottom: calc(60px + env(safe-area-inset-bottom, 0px));display: flex;flex-direction: column;max-width: 100%;height: auto;padding: 0 12px;margin: 0;overflow: hidden;z-index: 1;background: #f0f2f5}
.fishing-report-new-container > form {display: flex;flex-direction: column;flex: 1;min-height: 0;overflow: hidden}}
.fishing-report-header {text-align: center;margin-bottom: 24px}
.fishing-report-icon {display: inline-flex;align-items: center;justify-content: center;width: 64px;height: 64px;min-width: 64px;min-height: 64px;aspect-ratio: 1 / 1;background: linear-gradient(135deg, #42b72a 0%, #2d8a1d 100%);border-radius: 50%;margin-bottom: 12px;flex-shrink: 0}
.fishing-report-icon svg {color: #fff}
.fishing-report-header h1 {font-size: 1.5rem;font-weight: 700;color: #1c1e21;margin: 0 0 8px 0}
.fishing-report-description {color: #606770;font-size: 0.9rem;margin: 0;line-height: 1.5}
.fishing-report-optional-section {background: #f7f7f7;border-radius: 12px;padding: 16px}
.fishing-report-optional-section .optional-section-label {font-size: 0.85rem;font-weight: 600;color: #1c1e21;text-align: center;margin: 0 0 8px 0}
.fishing-report-comment-hint {font-size: 0.8rem;color: #606770;text-align: center;margin: 0 0 16px 0;line-height: 1.5}
.fishing-report-optional-fields {display: flex;gap: 12px;align-items: flex-start}
.fishing-report-photo-field {flex-shrink: 0}
.fishing-report-photo-preview {width: 80px;height: 80px;background: #fff;border: 2px dashed #ddd;border-radius: 8px;display: flex;align-items: center;justify-content: center;cursor: pointer;overflow: hidden;transition: border-color 0.2s}
.fishing-report-photo-preview:hover {border-color: #42b72a}
.fishing-report-photo-img {width: 100%;height: 100%;object-fit: cover;display: none}
.fishing-report-photo-placeholder {display: flex;flex-direction: column;align-items: center;gap: 4px;color: #999}
.fishing-report-photo-placeholder svg {color: #ccc}
.fishing-report-photo-placeholder span {font-size: 0.7rem}
.fishing-report-comment-field {flex: 1}
.fishing-report-comment-input {width: 100%;height: 80px;padding: 10px 12px;border: 1px solid #ddd;border-radius: 8px;font-size: 0.9rem;resize: none;font-family: inherit;transition: border-color 0.2s;box-sizing: border-box}
.fishing-report-comment-input:focus {outline: none;border-color: #42b72a}
.fishing-report-comment-input::placeholder {color: #999}
.fishing-report-caution {display: flex;align-items: flex-start;gap: 6px;font-size: 0.75rem;color: #e74c3c;margin: 16px 0 0 0;line-height: 1.4;background: #fef5f5;padding: 10px 12px;border-radius: 6px;border: 1px solid #fce4e4}
.fishing-report-caution svg {flex-shrink: 0;margin-top: 1px}
.fishing-report-map-section {margin-top: 16px;background: #fff;border-radius: 12px;padding: 16px;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05)}
.fishing-report-map-section #map {margin-bottom: 12px}
.fishing-report-location-button {display: flex;align-items: center;justify-content: center;gap: 8px;width: 100%;padding: 12px 16px;font-size: 0.9rem;font-weight: 500;color: #42b72a;background: #f0fff0;border: 1px solid #42b72a;border-radius: 8px;cursor: pointer;transition: all 0.2s ease}
.fishing-report-location-button:hover {background: #e6ffe6}
.fishing-report-location-button svg {flex-shrink: 0}
.fishing-report-details-section {margin-top: 16px}
.fishing-report-details-toggle {margin-bottom: 16px}
.fishing-report-detail-fields {background: #fff;border-radius: 12px;padding: 16px;margin-top: 16px}
.fishing-report-detail-fields .form-field {margin-bottom: 16px}
.fishing-report-detail-fields .form-field:last-child {margin-bottom: 0}
.fishing-report-detail-fields input[type="text"],
.fishing-report-detail-fields input[type="number"] {width: 100%;padding: 12px;border: 1px solid #ddd;border-radius: 8px;font-size: 16px;box-sizing: border-box;transition: border-color 0.2s}
.fishing-report-detail-fields input[type="text"]:focus,
.fishing-report-detail-fields input[type="number"]:focus {outline: none;border-color: #42b72a}
.fishing-report-main-action {position: relative;width: 100%;padding: 12px 0 0}
.fishing-report-submit-button {display: flex;align-items: center;justify-content: center;gap: 8px;width: 100%;padding: 16px 24px;font-size: 1rem;font-weight: 700;color: #fff;background: #42b72a;border: none;border-radius: 14px;cursor: pointer;transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);box-shadow: 0 2px 8px rgba(66, 183, 42, 0.2);letter-spacing: 0.02em;position: relative;overflow: hidden}
.fishing-report-submit-button::after {content: "";position: absolute;inset: 0;background: linear-gradient(135deg, transparent 0%, rgba(255, 255, 255, 0.1) 100%);pointer-events: none}
.fishing-report-submit-button:hover {background: #2d8a1d;box-shadow: 0 6px 20px rgba(66, 183, 42, 0.3);transform: translateY(-2px)}
.fishing-report-submit-button:active {transform: translateY(0);box-shadow: 0 1px 4px rgba(66, 183, 42, 0.2)}
.fishing-report-submit-button:disabled {background: #cbd5e1;cursor: not-allowed;box-shadow: none;transform: none}
.fishing-report-submit-button:disabled::after {display: none}
.fishing-report-submit-button svg {flex-shrink: 0}
.fishing-report-footer-link {text-align: center;margin-top: 24px;padding-top: 16px;border-top: 1px solid #e9ecef}
.fishing-report-home-link {display: inline-flex;align-items: center;gap: 6px;color: #666;text-decoration: none;font-size: 0.9rem;padding: 8px 16px;border-radius: 8px;transition: all 0.2s ease}
.fishing-report-home-link:hover {color: #42b72a;background: #f0f2f5}
.fishing-report-home-link svg {flex-shrink: 0}
.quota-hint {display: flex;align-items: center;justify-content: center;gap: 12px;padding: 8px 12px;margin-bottom: 16px;background: #f0fff0;border-radius: 8px}
.quota-hint-text {font-size: 13px;color: #666}
.quota-hint-text strong {color: #42b72a;font-size: 14px}
.quota-hint-empty {background: #fff5f5;border-radius: 6px;padding: 10px 16px}
.quota-hint-empty .quota-hint-text {color: #c62828}
.quota-hint-link {font-size: 12px;color: #42b72a;text-decoration: none}
.quota-hint-link:hover {text-decoration: underline}
.quota-hint-link-primary {font-size: 12px;color: #42b72a;font-weight: 600;text-decoration: none}
.quota-hint-link-primary:hover {text-decoration: underline}
.quota-badge {position: absolute;top: -10px;right: 8px;display: flex;align-items: center;gap: 4px;padding: 4px 10px;background: linear-gradient(135deg, #42b72a 0%, #2d8a1d 100%);border-radius: 20px;box-shadow: 0 2px 6px rgba(66, 183, 42, 0.3);z-index: 1}
.quota-badge-label {font-size: 11px;color: rgba(255, 255, 255, 0.9);font-weight: 500}
.quota-badge-count {font-size: 14px;font-weight: 700;color: #fff}
.quota-badge.quota-badge-empty {background: linear-gradient(135deg, #dc3545 0%, #c82333 100%);box-shadow: 0 2px 6px rgba(220, 53, 69, 0.3)}
.form-label {display: block;font-size: 14px;font-weight: 600;color: #1c1e21;margin-bottom: 6px}
.form-hint {font-size: 12px;color: #65676b;margin-top: 4px}
.edit-image-preview {display: flex;justify-content: center;margin-bottom: 16px}
.edit-thumbnail {width: 120px;height: 90px;object-fit: cover;border-radius: 8px;box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1)}
.form-section {margin-bottom: 20px;padding-bottom: 16px;border-bottom: 1px solid #e4e6eb}
.form-section:last-of-type {border-bottom: none;margin-bottom: 16px}
.form-section-title {font-size: 13px;font-weight: 600;color: #65676b;text-transform: uppercase;letter-spacing: 0.5px;margin-bottom: 12px}
.ai-fish-hint {display: flex;align-items: center;gap: 8px;padding: 8px 12px;background-color: #e7f3ff;border-radius: 6px;margin-bottom: 12px;font-size: 13px}
.ai-fish-hint .ai-label {color: #65676b}
.ai-fish-hint .ai-value {color: #1877f2;font-weight: 500}
.optional-fields-toggle {width: 100%;padding: 12px 16px;background-color: #fff;border: 1px dashed #dddfe2;border-radius: 8px;color: #606770;font-size: 14px;cursor: pointer;transition: all 0.2s;display: flex;align-items: center;justify-content: center;gap: 8px}
.optional-fields-toggle:hover {background-color: #f5f6f7;border-color: #bec3c9;color: #1c1e21}
.optional-fields-toggle-icon {font-size: 18px;font-weight: bold;transition: transform 0.2s}
.optional-fields-toggle.is-open .optional-fields-toggle-icon {transform: rotate(45deg)}
.optional-badge {font-size: 10px;padding: 3px 8px;background: #f0fdf4;border: 1px solid #bbf7d0;border-radius: 20px;color: #16a34a;font-weight: 700;letter-spacing: 0.03em;text-transform: uppercase}
.hidden-file-input {display: none}
.location-error-message-style {color: #fa383e;background-color: #ffebe6;padding: 10px;border-radius: 6px;margin-bottom: 16px;text-align: left}
.loading-overlay {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(255, 255, 255, 0.95);display: flex;flex-direction: column;justify-content: center;align-items: center;z-index: 9999}
.loading-overlay.hidden {display: none}
.loading-content {text-align: center;padding: 40px}
.loading-ocean-fantasy {position: relative;width: 300px;height: 200px;margin: 0 auto 24px;background: linear-gradient(
135deg,
rgba(30, 41, 59, 0.95) 0%,
rgba(51, 65, 85, 0.9) 50%,
rgba(30, 41, 59, 0.95) 100%
);border-radius: 20px;overflow: hidden;box-shadow:
0 0 40px rgba(96, 165, 250, 0.2),
inset 0 0 60px rgba(96, 165, 250, 0.1)}
.fantasy-ripple {position: absolute;border-radius: 50%;border: 1px solid;animation: fantasyRipple 4s ease-out infinite}
.fantasy-ripple.ripple-1 {width: 100px;height: 100px;top: 50%;left: 50%;transform: translate(-50%, -50%);border-color: rgba(167, 139, 250, 0.3)}
.fantasy-ripple.ripple-2 {width: 150px;height: 150px;top: 50%;left: 50%;transform: translate(-50%, -50%);border-color: rgba(244, 114, 182, 0.2);animation-delay: 1.3s}
.fantasy-ripple.ripple-3 {width: 200px;height: 200px;top: 50%;left: 50%;transform: translate(-50%, -50%);border-color: rgba(96, 165, 250, 0.15);animation-delay: 2.6s}
@keyframes fantasyRipple {0% {transform: translate(-50%, -50%) scale(0.3);opacity: 1}
100% {transform: translate(-50%, -50%) scale(1.5);opacity: 0}}
.particle {position: absolute;border-radius: 50%;animation: particleFloat 6s ease-in-out infinite}
.particle-1 {width: 4px;height: 4px;background: rgba(96, 165, 250, 0.6);top: 20%;left: 15%;animation-delay: 0s}
.particle-2 {width: 3px;height: 3px;background: rgba(167, 139, 250, 0.6);top: 70%;left: 25%;animation-delay: 1s}
.particle-3 {width: 5px;height: 5px;background: rgba(244, 114, 182, 0.5);top: 40%;left: 80%;animation-delay: 2s}
.particle-4 {width: 3px;height: 3px;background: rgba(52, 211, 153, 0.6);top: 80%;left: 70%;animation-delay: 0.5s}
.particle-5 {width: 4px;height: 4px;background: rgba(251, 191, 36, 0.5);top: 30%;left: 60%;animation-delay: 1.5s}
.particle-6 {width: 3px;height: 3px;background: rgba(96, 165, 250, 0.5);top: 60%;left: 10%;animation-delay: 2.5s}
@keyframes particleFloat {0%, 100% {transform: translateY(0) translateX(0);opacity: 0.3}
25% {transform: translateY(-20px) translateX(10px);opacity: 0.8}
50% {transform: translateY(-10px) translateX(-5px);opacity: 0.5}
75% {transform: translateY(-25px) translateX(5px);opacity: 0.9}}
.line-fish.fish-main {position: absolute;width: 100px;height: 60px;top: 50%;left: 50%;transform: translate(-50%, -50%);animation: lineFishSwim 5s ease-in-out infinite;filter: drop-shadow(0 0 8px rgba(167, 139, 250, 0.5))}
@keyframes lineFishSwim {0% {transform: translate(-50%, -50%) translateX(-70px) translateY(10px) rotate(-3deg)}
25% {transform: translate(-50%, -50%) translateX(-20px) translateY(-15px) rotate(3deg)}
50% {transform: translate(-50%, -50%) translateX(70px) translateY(5px) rotate(-3deg)}
75% {transform: translate(-50%, -50%) translateX(20px) translateY(-10px) rotate(3deg)}
100% {transform: translate(-50%, -50%) translateX(-70px) translateY(10px) rotate(-3deg)}}
.line-fish.fish-small-1,
.line-fish.fish-small-2,
.line-fish.fish-small-3 {position: absolute;width: 40px;height: 24px}
.line-fish.fish-small-1 {top: 25%;filter: drop-shadow(0 0 6px rgba(52, 211, 153, 0.5));animation: lineSmallFish1 4s ease-in-out infinite}
.line-fish.fish-small-2 {top: 70%;filter: drop-shadow(0 0 6px rgba(251, 191, 36, 0.5));animation: lineSmallFish2 4.5s ease-in-out infinite;animation-delay: -1.5s}
.line-fish.fish-small-3 {top: 45%;filter: drop-shadow(0 0 6px rgba(244, 114, 182, 0.5));animation: lineSmallFish3 3.8s ease-in-out infinite;animation-delay: -2.5s}
@keyframes lineSmallFish1 {0% {left: -50px;transform: scaleX(1) translateY(0)}
25% {transform: scaleX(1) translateY(-10px)}
48% {left: calc(100% + 10px);transform: scaleX(1) translateY(5px)}
52% {left: calc(100% + 10px);transform: scaleX(-1) translateY(5px)}
75% {transform: scaleX(-1) translateY(-8px)}
98% {left: -50px;transform: scaleX(-1) translateY(0)}
100% {left: -50px;transform: scaleX(1) translateY(0)}}
@keyframes lineSmallFish2 {0% {right: -50px;left: auto;transform: scaleX(-1) translateY(0)}
25% {transform: scaleX(-1) translateY(8px)}
48% {right: calc(100% + 10px);transform: scaleX(-1) translateY(-5px)}
52% {right: calc(100% + 10px);transform: scaleX(1) translateY(-5px)}
75% {transform: scaleX(1) translateY(10px)}
98% {right: -50px;transform: scaleX(1) translateY(0)}
100% {right: -50px;transform: scaleX(-1) translateY(0)}}
@keyframes lineSmallFish3 {0% {left: -50px;transform: scaleX(1) translateY(0) rotate(0deg)}
20% {transform: scaleX(1) translateY(-20px) rotate(5deg)}
40% {transform: scaleX(1) translateY(15px) rotate(-5deg)}
48% {left: calc(100% + 10px);transform: scaleX(1) translateY(0) rotate(0deg)}
52% {left: calc(100% + 10px);transform: scaleX(-1) translateY(0) rotate(0deg)}
70% {transform: scaleX(-1) translateY(-15px) rotate(-5deg)}
85% {transform: scaleX(-1) translateY(20px) rotate(5deg)}
98% {left: -50px;transform: scaleX(-1) translateY(0) rotate(0deg)}
100% {left: -50px;transform: scaleX(1) translateY(0) rotate(0deg)}}
.line-bubble {position: absolute;width: 20px;height: 20px;animation: lineBubbleRise 4s ease-in infinite}
.line-bubble.bubble-1 {left: 20%;bottom: -25px;animation-delay: 0s}
.line-bubble.bubble-2 {left: 50%;bottom: -25px;width: 16px;height: 16px;animation-delay: 1.3s}
.line-bubble.bubble-3 {left: 75%;bottom: -25px;width: 14px;height: 14px;animation-delay: 2.6s}
@keyframes lineBubbleRise {0% {transform: translateY(0) scale(0.8);opacity: 0}
10% {opacity: 0.8}
50% {transform: translateY(-100px) scale(1);opacity: 0.6}
100% {transform: translateY(-220px) scale(1.2);opacity: 0}}
.loading-text {color: #1c1e21;font-size: 1.2em;font-weight: 600;margin-bottom: 8px}
.loading-subtext {color: #606770;font-size: 0.9em}
.loading-dots {display: flex;justify-content: center;gap: 8px;margin-top: 16px}
.loading-dots span {width: 8px;height: 8px;background: #42b72a;border-radius: 50%;animation: dotPulse 1.4s ease-in-out infinite}
.loading-dots span:nth-child(2) {animation-delay: 0.2s}
.loading-dots span:nth-child(3) {animation-delay: 0.4s}
@keyframes dotPulse {0%, 80%, 100% {transform: scale(0.6);opacity: 0.5}
40% {transform: scale(1);opacity: 1}}
.caught-at-field {margin-bottom: 16px}
.caught-at-label {display: block;font-size: 14px;font-weight: 600;color: #1c1e21;margin-bottom: 8px}
.caught-at-inputs {display: flex;gap: 12px}
.caught-at-input-wrapper {flex: 1;position: relative;display: flex;align-items: center;background-color: #ffffff;border: 1.5px solid #e2e8f0;border-radius: 12px;transition: border-color 0.25s ease, box-shadow 0.25s ease;cursor: pointer}
.caught-at-input-wrapper:focus-within {border-color: #42b72a;background-color: #fff;box-shadow: 0 0 0 3px rgba(66, 183, 42, 0.08), 0 2px 8px rgba(66, 183, 42, 0.06)}
.caught-at-date-input,
.caught-at-time-input {flex: 1;border: none;background: transparent;padding: 12px;font-size: 16px;color: #1c1e21;outline: none;min-width: 0;cursor: pointer;box-sizing: border-box}
.caught-at-date-input::-webkit-calendar-picker-indicator,
.caught-at-time-input::-webkit-calendar-picker-indicator {cursor: pointer;opacity: 0.6;transition: opacity 0.2s}
.caught-at-date-input::-webkit-calendar-picker-indicator:hover,
.caught-at-time-input::-webkit-calendar-picker-indicator:hover {opacity: 1}
.caught-at-error {display: none;color: #dc3545;font-size: 13px;margin-top: 8px;padding: 8px 12px;background-color: #fff5f5;border: 1px solid #ffcccc;border-radius: 4px}
.exif-hint {display: none;color: var(--color-success-dark);font-size: 12px;margin-top: 8px;padding: 8px 10px;background-color: #f0fdf4;border: 1px solid #bbf7d0;border-radius: 10px;flex-shrink: 0;line-height: 1.5}
#edit-map {height: 180px;width: 100%;border-radius: 6px}
@media (max-width: 480px) {.caught-at-inputs {flex-direction: row;gap: 8px}
.caught-at-date-input,
.caught-at-time-input {font-size: 14px}}
.step-bar-container {margin-bottom: 10px;padding: 0;flex-shrink: 0}
.step-bar-labels {display: flex;gap: 3px;background: #f1f5f9;border-radius: 10px;padding: 3px}
.step-bar-label {display: flex;align-items: center;justify-content: center;background: none;border: none;padding: 7px 4px;cursor: pointer;transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);flex: 1;border-radius: 8px}
.step-bar-label-text {font-size: 11px;color: #94a3b8;font-weight: 600;white-space: nowrap;letter-spacing: 0.01em;transition: color 0.3s ease}
.step-bar-label.active {background: #ffffff;box-shadow:
0 1px 3px rgba(0, 0, 0, 0.06),
0 0 10px rgba(66, 183, 42, 0.15)}
.step-bar-label.active .step-bar-label-text {color: #42b72a;font-weight: 700}
.step-bar-label.completed .step-bar-label-text {color: #475569}
.step-bar-label.disabled {opacity: 0.35;cursor: not-allowed}
.steps-container {display: flex;overflow-x: auto;scroll-snap-type: x mandatory;scroll-behavior: smooth;-webkit-overflow-scrolling: touch;scrollbar-width: none;-ms-overflow-style: none;width: 100%;flex: 1;min-height: 0}
.steps-container::-webkit-scrollbar {display: none}
.steps-container.scroll-locked {overflow-x: hidden;scroll-snap-type: none}
.step-panel {flex: 0 0 100%;width: 100%;min-width: 100%;scroll-snap-align: start;scroll-snap-stop: always;box-sizing: border-box;display: flex;flex-direction: column}
.step-content {display: flex;flex-direction: column;background: #ffffff;border-radius: 20px;padding: 24px;box-shadow:
0 1px 3px rgba(0, 0, 0, 0.04),
0 6px 24px rgba(0, 0, 0, 0.06);border: 1px solid rgba(226, 232, 240, 0.5);border-left: 3px solid #42b72a;flex: 1;min-height: 0;overflow-y: auto;scrollbar-width: none;-ms-overflow-style: none}
.step-content::-webkit-scrollbar {display: none}
.step-title {display: flex;align-items: center;gap: 10px;font-size: 1.1rem;font-weight: 800;color: #0f172a;margin: 0 0 14px 0;letter-spacing: -0.01em;flex-shrink: 0}
.step-title svg {color: #42b72a;flex-shrink: 0}
.step-description {font-size: 0.85rem;color: #64748b;margin: 0 0 16px 0;line-height: 1.6;flex-shrink: 0}
.step-navigation {display: flex;justify-content: space-between;align-items: center;padding: 16px 0 8px;margin: 0;border: none;gap: 12px;flex-shrink: 0}
.step-prev-btn,
.step-next-btn {display: flex;align-items: center;justify-content: center;gap: 6px;height: 44px;padding: 0 20px;border: none;border-radius: 22px;cursor: pointer;transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);box-sizing: border-box;font-size: 0.85rem;font-weight: 600;letter-spacing: 0.01em;white-space: nowrap}
@keyframes rippleGreen {0% {outline-color: rgba(66, 183, 42, 0.4);outline-offset: 0px}
100% {outline-color: rgba(66, 183, 42, 0);outline-offset: 10px}}
.step-prev-btn svg,
.step-next-btn svg {flex-shrink: 0;width: 18px;height: 18px}
.step-prev-btn {background: #f1f5f9;border: 1.5px solid #e2e8f0;color: #475569;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06)}
.step-prev-btn svg {color: #475569}
.step-prev-btn:hover {background: #e2e8f0;border-color: #cbd5e1;box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1)}
.step-prev-btn:hover svg {color: #334155}
.step-prev-btn:active {background: #cbd5e1;box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);transform: scale(0.97)}
.step-prev-btn:active svg {color: #0f172a}
.step-next-btn {background: linear-gradient(135deg, #42b72a 0%, #2d8a1d 100%);border: 1.5px solid #2d8a1d;color: #fff;box-shadow: 0 2px 8px rgba(66, 183, 42, 0.25);outline: 2px solid transparent;outline-offset: 0;animation: rippleGreen 2.4s ease-out infinite;margin-left: auto}
.step-next-btn svg {color: #fff}
.step-next-btn:focus-visible {outline: none;box-shadow: 0 0 0 3px rgba(66, 183, 42, 0.5);animation: none}
.step-next-btn:hover:not(:disabled) {background: linear-gradient(135deg, #4ecc34 0%, #36a322 100%);box-shadow: 0 4px 14px rgba(66, 183, 42, 0.35);transform: translateY(-1px);animation: none;outline-color: transparent}
.step-next-btn:hover:not(:disabled) svg {color: #fff}
.step-next-btn:active:not(:disabled) {background: linear-gradient(135deg, #2d8a1d 0%, #1e6b14 100%);box-shadow: 0 1px 4px rgba(66, 183, 42, 0.2);transform: scale(0.97)}
.step-next-btn:disabled {background: #e2e8f0;border-color: #e2e8f0;color: #94a3b8;box-shadow: none;animation: none;outline-color: transparent;cursor: not-allowed}
.step-next-btn:disabled svg {color: #94a3b8}
@media (prefers-reduced-motion: reduce) {.step-next-btn {animation: none}}
.step-content--photo .step-photo-section {flex-shrink: 0}
.step-content--photo .step-photo-preview {aspect-ratio: 2 / 1}
.step-content--photo .step-comment-section {flex-shrink: 0}
.step-content--photo .step-comment-input {height: 72px}
.step-content--photo .exif-hint {flex-shrink: 0}
.step-photo-section {margin-bottom: 10px}
.step-photo-preview {width: 100%;aspect-ratio: 4 / 3;background: #f8fafc;border: 2px solid #e2e8f0;border-radius: 16px;display: flex;align-items: center;justify-content: center;cursor: pointer;overflow: hidden;transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);position: relative}
.step-photo-preview::before {content: "";position: absolute;inset: 0;border-radius: 14px;background: linear-gradient(145deg, rgba(66, 183, 42, 0.03) 0%, rgba(66, 183, 42, 0.06) 100%);opacity: 0;transition: opacity 0.3s ease}
.step-photo-preview:hover {border-color: #42b72a;box-shadow: 0 8px 24px rgba(66, 183, 42, 0.1);transform: translateY(-2px)}
.step-photo-preview:hover::before {opacity: 1}
.step-photo-img {width: 100%;height: 100%;object-fit: cover;display: none}
.step-photo-placeholder {display: flex;flex-direction: column;align-items: center;gap: 12px;color: #64748b;position: relative;z-index: 1}
.step-photo-placeholder svg {color: #42b72a;opacity: 0.4;transition: opacity 0.3s, transform 0.3s cubic-bezier(0.4, 0, 0.2, 1)}
.step-photo-preview:hover .step-photo-placeholder svg {opacity: 0.7;transform: scale(1.08)}
.step-photo-placeholder span {font-size: 0.85rem;color: #64748b;font-weight: 600;letter-spacing: 0.01em}
.step-photo-placeholder-warning {font-size: 0.65rem !important;color: #ef4444 !important;font-weight: 500 !important;line-height: 1.4;text-align: center;max-width: 240px;opacity: 0.7}
.step-comment-section {margin-top: 8px}
.step-comment-input {width: 100%;height: 64px;padding: 12px 14px;border: 1.5px solid #e2e8f0;border-radius: 12px;font-size: 16px;resize: none;font-family: inherit;background: #f8fafc;transition: border-color 0.25s ease, box-shadow 0.25s ease, background 0.25s ease;box-sizing: border-box}
.step-comment-input:focus {outline: none;border-color: #42b72a;background: #fff;box-shadow: 0 0 0 3px rgba(66, 183, 42, 0.08), 0 2px 8px rgba(66, 183, 42, 0.06)}
.step-comment-input::placeholder {color: var(--color-text-light)}
.step-location-content {display: flex;flex-direction: column;flex-shrink: 0;position: relative}
.location-auto-set-overlay {display: none;background: linear-gradient(135deg, #f0fff0 0%, #e8f5e9 100%);border: 2px solid #42b72a;border-radius: 8px;padding: 12px 16px;cursor: pointer;transition: all 0.2s ease}
.location-auto-set-overlay:hover {background: linear-gradient(135deg, #e8f5e9 0%, #c8e6c9 100%);box-shadow: 0 4px 12px rgba(66, 183, 42, 0.2)}
.location-auto-set-overlay.visible {display: block}
.location-auto-set-message {display: flex;align-items: center;justify-content: center;gap: 10px}
.location-auto-set-message svg {color: #42b72a;flex-shrink: 0}
.auto-set-title {font-size: 14px;font-weight: 600;color: #2d8a1d}
.auto-set-hint {font-size: 12px;color: #65676b;margin-left: 4px}
.step-map-section {aspect-ratio: 2 / 1;flex-shrink: 0;margin-bottom: 12px;overflow: hidden;border-radius: 14px}
.step-map-section.disabled {pointer-events: none;opacity: 0.6}
.step-map,
.step-map-section #map {width: 100%;height: 100%;border-radius: 14px;background: #f1f5f9;box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06)}
.step-location-btn {display: flex;align-items: center;justify-content: center;gap: 8px;width: 100%;padding: 14px 16px;margin-top: auto;font-size: 0.9rem;font-weight: 600;color: #fff;background: #42b72a;border: none;border-radius: 12px;cursor: pointer;transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1);flex-shrink: 0;box-shadow: 0 2px 8px rgba(66, 183, 42, 0.2)}
.step-location-btn:hover {background: #2d8a1d;box-shadow: 0 4px 16px rgba(66, 183, 42, 0.3);transform: translateY(-1px)}
.step-location-btn svg {flex-shrink: 0}
.privacy-force-notice {display: none;align-items: center;gap: 12px;margin-top: 8px;padding: 12px 14px;background: linear-gradient(135deg, #fff7ed 0%, #fef3c7 100%);border: 1px solid rgba(251, 146, 60, 0.3);border-radius: 14px;color: #9a3412;box-shadow: 0 12px 28px rgba(251, 146, 60, 0.18)}
.privacy-force-notice.is-visible {display: flex}
.privacy-force-icon {width: 34px;height: 34px;border-radius: 10px;background: #fff;border: 1px solid rgba(251, 146, 60, 0.35);color: #c2410c;display: flex;align-items: center;justify-content: center;flex-shrink: 0}
.privacy-force-content {display: flex;flex-direction: column;gap: 2px}
.privacy-force-title {font-size: 12px;font-weight: 700;letter-spacing: 0.02em}
.privacy-force-text {font-size: 12px;color: #92400e;line-height: 1.4}
.step-privacy-toggle {margin-top: 12px;padding: 12px 14px;background: #f8fafc;border-radius: 14px;border: 1px solid #e2e8f0;flex-shrink: 0}
.step-privacy-toggle.is-hidden,
.edit-privacy-settings.is-hidden {display: none}
.step-privacy-toggle.is-forced,
.edit-privacy-settings.is-forced {opacity: 0.75}
.step-privacy-toggle.is-forced .privacy-toggle-label,
.edit-privacy-settings.is-forced .toggle-switch {cursor: not-allowed;pointer-events: none}
.privacy-toggle-label {display: flex;align-items: center;gap: 12px;cursor: pointer;user-select: none}
.privacy-toggle-label input[type="checkbox"] {display: none}
.privacy-toggle-switch {position: relative;width: 44px;height: 24px;background: #ccc;border-radius: 12px;transition: background 0.3s;flex-shrink: 0}
.privacy-toggle-switch::after {content: "";position: absolute;top: 2px;left: 2px;width: 20px;height: 20px;background: white;border-radius: 50%;transition: transform 0.3s;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2)}
.privacy-toggle-label input[type="checkbox"]:checked + .privacy-toggle-switch {background: #4CAF50}
.privacy-toggle-label input[type="checkbox"]:checked + .privacy-toggle-switch::after {transform: translateX(20px)}
.privacy-toggle-text {display: flex;align-items: center;gap: 6px;font-size: 14px;font-weight: 500;color: #333}
.privacy-toggle-text svg {color: #666}
.privacy-toggle-hint {margin: 6px 0 0 56px;font-size: 12px;color: #666}
.edit-privacy-settings {display: flex;align-items: center;justify-content: space-between;padding: 12px 16px;background: #f8f9fa;border-radius: 8px;border: 1px solid #e0e0e0}
.edit-privacy-info {display: flex;flex-direction: column;gap: 4px}
.edit-privacy-label {display: flex;align-items: center;gap: 8px;font-size: 14px;font-weight: 500;color: #333}
.edit-privacy-label svg {color: #666;flex-shrink: 0}
.edit-privacy-hint {font-size: 12px;color: #666;padding-left: 24px}
.edit-privacy-settings .toggle-switch {position: relative;display: inline-block;width: 50px;height: 28px;flex-shrink: 0}
.edit-privacy-settings .toggle-switch input {opacity: 0;width: 0;height: 0}
.edit-privacy-settings .toggle-slider {position: absolute;cursor: pointer;top: 0;left: 0;right: 0;bottom: 0;background-color: #ccc;transition: 0.3s;border-radius: 28px}
.edit-privacy-settings .toggle-slider:before {position: absolute;content: "";height: 22px;width: 22px;left: 3px;bottom: 3px;background-color: white;transition: 0.3s;border-radius: 50%;box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2)}
.edit-privacy-settings .toggle-switch input:checked + .toggle-slider {background-color: #4CAF50}
.edit-privacy-settings .toggle-switch input:checked + .toggle-slider:before {transform: translateX(22px)}
.step-detail-fields {display: flex;flex-direction: column;justify-content: center;gap: 6px;flex: 1}
.detail-section {background: #f8fafc;border-radius: 12px;padding: 12px;border: 1px solid rgba(226, 232, 240, 0.6);transition: border-color 0.2s ease}
.detail-section:has(input:focus),
.detail-section:has(input:checked) {border-color: rgba(66, 183, 42, 0.3)}
.detail-section-header {display: flex;align-items: center;gap: 6px;margin-bottom: 10px}
.detail-section-icon {display: flex;align-items: center;justify-content: center;width: 26px;height: 26px;background: #42b72a;border-radius: 8px;color: #fff;flex-shrink: 0}
.detail-section-icon svg {width: 14px;height: 14px}
.detail-section-title {font-size: 0.8rem;font-weight: 700;color: #334155;letter-spacing: 0.01em}
.detail-section-body {display: flex;flex-direction: column;gap: 10px}
.step-field {display: flex;flex-direction: column}
.step-field-label {display: flex;align-items: center;gap: 6px;font-size: 13px;font-weight: 600;color: #1c1e21;margin-bottom: 6px}
.step-fields-row {display: flex;gap: 12px}
.step-fields-row .step-field {flex: 1}
.step-input {width: 100%;padding: 12px 14px;border: 1.5px solid #e2e8f0;border-radius: 12px;font-size: 15px;background: #ffffff;transition: border-color 0.25s ease, box-shadow 0.25s ease;box-sizing: border-box}
.step-input:focus {outline: none;border-color: #42b72a;background: #fff;box-shadow: 0 0 0 3px rgba(66, 183, 42, 0.08), 0 2px 8px rgba(66, 183, 42, 0.06)}
.step-input::placeholder {color: var(--color-text-light)}
.step-select {appearance: none;background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2342b72a' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E");background-repeat: no-repeat;background-position: right 14px center;padding-right: 40px;cursor: pointer}
.step-select:invalid,
.step-select option[value=""] {color: #999}
.step-select option {color: #1c1e21}
.location-type-forced {display: none;align-items: center;gap: 10px;padding: 10px 12px;border-radius: 12px;border: 1px solid rgba(59, 130, 246, 0.2);background: linear-gradient(135deg, #eef2ff 0%, #dbeafe 100%);color: #1f2937;font-size: 13px;font-weight: 600;box-shadow: 0 10px 24px rgba(59, 130, 246, 0.15)}
.location-type-forced.is-visible {display: flex}
.location-type-forced-icon {width: 18px;height: 18px;color: #1d4ed8;display: flex;align-items: center;justify-content: center}
.location-type-forced-icon svg {width: 100%;height: 100%}
.location-type-forced-ship {margin-left: auto;padding: 2px 8px;border-radius: 999px;background: rgba(255, 255, 255, 0.8);color: #1d4ed8;font-size: 11px;font-weight: 700}
.fishing-method-grid {display: grid;grid-template-columns: repeat(4, 1fr);gap: 8px}
.fishing-method-grid.is-hidden {display: none}
.fishing-method-card {position: relative;display: flex;flex-direction: column;align-items: center;gap: 6px;padding: 12px 4px 10px;cursor: pointer;background: #ffffff;border-radius: 12px;border: 1.5px solid rgba(148, 163, 184, 0.3);box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease, background 0.2s ease}
.fishing-method-card:hover {transform: translateY(-2px);box-shadow: 0 4px 12px rgba(66, 183, 42, 0.12);border-color: rgba(66, 183, 42, 0.45);background: #f8fdf6}
.fishing-method-card:active {transform: translateY(0);box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06)}
.fishing-method-card:has(input:checked) {border-color: #42b72a;background: linear-gradient(135deg, #f0fdf4 0%, #e8f9e2 100%);box-shadow: 0 2px 8px rgba(66, 183, 42, 0.18)}
.fishing-method-card input[type="radio"] {position: absolute;opacity: 0;width: 0;height: 0}
.fishing-method-card-icon {width: 28px;height: 28px;color: #64748b;display: flex;align-items: center;justify-content: center;flex-shrink: 0;transition: color 0.2s ease, transform 0.2s ease}
.fishing-method-card-icon svg {width: 100%;height: 100%}
.fishing-method-card:has(input:checked) .fishing-method-card-icon {color: #2d8a1d;transform: scale(1.1)}
.fishing-method-card-label {font-size: 0.6875rem;color: var(--color-text-secondary);font-weight: 600;white-space: nowrap;line-height: 1;transition: color 0.2s ease}
.fishing-method-card:has(input:checked) .fishing-method-card-label {color: #2d8a1d}
.fishing-method-card-check {position: absolute;top: 4px;right: 4px;width: 16px;height: 16px;color: #42b72a;opacity: 0;transform: scale(0.5);transition: opacity 0.2s ease, transform 0.2s ease;pointer-events: none}
.fishing-method-card-check svg {width: 100%;height: 100%}
.fishing-method-card:has(input:checked) .fishing-method-card-check {opacity: 1;transform: scale(1)}
.fishing-method-description {max-height: 0;overflow: hidden;opacity: 0;padding: 0 12px;font-size: 0.8125rem;color: #475569;background: #f8fdf6;border-radius: 10px;border: 1.5px solid transparent;transition: max-height 0.3s ease, opacity 0.3s ease, padding 0.3s ease, border-color 0.3s ease, margin 0.3s ease;line-height: 1.6;max-width: 100%;overflow-wrap: anywhere}
.fishing-method-description.is-visible {max-height: 80px;opacity: 1;padding: 10px 12px;margin-top: 8px;border-color: rgba(66, 183, 42, 0.25)}
.tackle-set-select {display: flex;flex-direction: column;gap: 10px;flex: 1;overflow-y: auto}
.tackle-set-option {display: flex;align-items: flex-start;gap: 12px;padding: 16px;background: #ffffff;border: 1.5px solid #e2e8f0;border-radius: 14px;cursor: pointer;transition: all 0.25s cubic-bezier(0.4, 0, 0.2, 1)}
.tackle-set-option:hover {border-color: rgba(66, 183, 42, 0.4);transform: translateY(-1px);box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06)}
.tackle-set-option:has(input[type="radio"]:checked) {background: linear-gradient(180deg, #f0fdf4 0%, #e8f5e9 100%);border-color: #42b72a;box-shadow: 0 0 0 3px rgba(66, 183, 42, 0.1), 0 4px 12px rgba(66, 183, 42, 0.1)}
.tackle-set-option input[type="radio"] {margin-top: 2px;width: 18px;height: 18px;accent-color: #42b72a;flex-shrink: 0}
.tackle-set-info {flex: 1;min-width: 0}
.tackle-set-name {display: block;font-size: 15px;font-weight: 700;color: #1c1e21;margin-bottom: 6px}
.tackle-items-grid-edit {display: flex;flex-wrap: wrap;gap: 6px;margin-top: 8px}
.tackle-item-card-edit {display: inline-flex;align-items: center;gap: 5px;padding: 6px 10px;background: #fff;border: 1px solid var(--color-border);border-radius: 8px;font-size: 12px;color: #65676b;transition: border-color 0.2s}
.tackle-item-icon-edit {width: 16px;height: 16px;display: flex;align-items: center;justify-content: center;color: #42b72a}
.tackle-card-icon-edit {width: 14px;height: 14px}
.tackle-item-name-edit {word-break: break-word;color: #1c1e21}
.no-tackle-message {display: flex;flex-direction: column;justify-content: center;align-items: center;flex: 1;text-align: center;padding: 24px 16px;color: #65676b}
.no-tackle-message p {margin: 0 0 16px 0;font-size: 0.9rem}
.no-tackle-message .tackle-register-note {margin: 20px 0 0;display: inline-flex;flex-wrap: wrap;align-items: center;justify-content: center;gap: 6px 8px;padding: 10px 14px;max-width: min(360px, 100%);border-radius: 14px;background: #eef6ff;border: 1px solid #cfe3ff;box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06);font-size: 0.78rem;line-height: 1.5;color: var(--color-text-secondary);text-align: center}
.tackle-register-note i {color: var(--color-primary)}
.tackle-register-note span {display: inline-block}
.create-tackle-link {display: inline-flex;align-items: center;gap: 6px;padding: 10px 20px;background: linear-gradient(135deg, #42b72a 0%, #2d8a1d 100%);color: #fff;text-decoration: none;border-radius: 8px;font-size: 0.9rem;font-weight: 500;transition: all 0.2s ease}
.create-tackle-link:hover {background: linear-gradient(135deg, #2d8a1d 0%, #1e6b14 100%);transform: translateY(-1px);box-shadow: 0 2px 8px rgba(66, 183, 42, 0.3)}
@media (max-width: 768px) {.fishing-report-new-container {max-width: 480px;padding: 0 20px 0}
.fishing-report-main-action {flex-shrink: 0;padding: 8px 0 4px}
.step-content {padding: 22px 20px;border-radius: 18px}
.step-content--photo .step-photo-preview {aspect-ratio: 4 / 3}
.step-map-section {aspect-ratio: 4 / 3}
.step-navigation {padding: 14px 0 8px}
.step-prev-btn,
.step-next-btn {height: 42px;padding: 0 16px;font-size: 0.82rem}
.step-prev-btn svg,
.step-next-btn svg {width: 17px;height: 17px}}
@media (max-width: 480px) {.fishing-report-new-container {padding: 0 10px}
.quota-hint {padding: 6px 10px;margin-bottom: 10px}
.quota-hint-text {font-size: 12px}
.step-bar-container {margin-bottom: 10px;padding: 0 2px}
.step-bar-label-text {font-size: 10px}
.step-bar-label {padding: 5px 2px}
.step-content {padding: 18px 14px;border-radius: 16px}
.step-title {font-size: 0.95rem;margin-bottom: 10px;gap: 8px}
.step-photo-preview {aspect-ratio: 4 / 3}
.step-photo-placeholder svg {width: 36px;height: 36px}
.step-photo-placeholder span {font-size: 0.8rem}
.step-comment-input {height: 60px}
.step-map,
.step-map-section #map {min-height: 0}
.step-field-label {font-size: 12px;margin-bottom: 4px}
.detail-section {padding: 10px;border-radius: 10px}
.detail-section-header {margin-bottom: 8px}
.detail-section-icon {width: 24px;height: 24px;border-radius: 7px}
.detail-section-icon svg {width: 13px;height: 13px}
.detail-section-title {font-size: 0.75rem}
.fishing-method-description {font-size: 0.75rem;line-height: 1.5}
.fishing-method-description.is-visible {max-height: 70px;padding: 8px 10px}
.detail-section-body {gap: 8px}
.fishing-method-grid {grid-template-columns: repeat(3, 1fr);gap: 6px}
.fishing-method-card {padding: 10px 2px 8px;border-radius: 10px}
.fishing-method-card-icon {width: 24px;height: 24px}
.fishing-method-card-label {font-size: 0.625rem}
.fishing-method-card-check {width: 14px;height: 14px;top: 3px;right: 3px}
.step-fields-row {flex-direction: row;gap: 8px}
.step-detail-fields {gap: 6px}
.step-input {padding: 10px 12px;font-size: 14px}
.step-navigation {padding: 10px 0 4px}
.step-prev-btn,
.step-next-btn {height: 40px;padding: 0 14px;font-size: 0.8rem;border-radius: 20px}
.step-prev-btn svg,
.step-next-btn svg {width: 16px;height: 16px}
.tackle-set-option {padding: 12px;gap: 10px}
.tackle-set-name {font-size: 14px;margin-bottom: 4px}
.tackle-item-card-edit {padding: 5px 8px;font-size: 11px}
.tackle-item-icon-edit {width: 14px;height: 14px}
.tackle-card-icon-edit {width: 12px;height: 12px}
.fishing-report-footer-link {margin-top: 16px;padding-top: 12px}
.quota-badge {top: -8px;right: 4px;padding: 3px 8px;gap: 3px}
.quota-badge-label {font-size: 10px}
.quota-badge-count {font-size: 12px}}
@media (max-width: 375px) {.fishing-report-new-container {padding: 0 8px}
.step-bar-container {margin-bottom: 8px;padding: 0}
.step-bar-label {padding: 4px 2px;border-radius: 6px}
.step-bar-label-text {font-size: 9px}
.step-content {padding: 14px 10px;border-radius: 12px}
.step-title {font-size: 0.85rem;gap: 6px;margin-bottom: 8px}
.step-title svg {width: 16px;height: 16px}
.step-description {font-size: 0.8rem;margin-bottom: 10px}
.step-photo-preview {aspect-ratio: 4 / 3}
.step-photo-placeholder svg {width: 28px;height: 28px}
.step-photo-placeholder span {font-size: 0.75rem}
.step-comment-input {height: 56px;font-size: 14px;padding: 10px 12px}
.step-input {padding: 8px 10px;font-size: 14px;border-radius: 8px}
.step-field-label {font-size: 11px}
.fishing-method-description {font-size: 0.6875rem}
.fishing-method-description.is-visible {max-height: 60px;padding: 6px 8px;margin-top: 6px}
.detail-section {padding: 8px;border-radius: 8px}
.detail-section-header {margin-bottom: 6px;gap: 5px}
.detail-section-icon {width: 22px;height: 22px;border-radius: 6px}
.detail-section-icon svg {width: 12px;height: 12px}
.detail-section-title {font-size: 0.6875rem}
.detail-section-body {gap: 6px}
.step-fields-row {gap: 6px}
.step-detail-fields {gap: 5px}
.caught-at-inputs {gap: 6px}
.caught-at-date-input,
.caught-at-time-input {padding: 10px 8px;font-size: 14px}
.fishing-method-grid {grid-template-columns: repeat(3, 1fr);gap: 5px}
.fishing-method-card {padding: 8px 2px 6px;border-radius: 8px}
.fishing-method-card-icon {width: 22px;height: 22px}
.fishing-method-card-label {font-size: 0.5625rem}
.fishing-method-card-check {width: 12px;height: 12px;top: 2px;right: 2px}
.step-navigation {padding: 6px 0 2px;gap: 8px}
.step-prev-btn,
.step-next-btn {height: 36px;padding: 0 12px;font-size: 0.75rem;border-radius: 18px;gap: 4px}
.step-prev-btn svg,
.step-next-btn svg {width: 14px;height: 14px}
.step-map,
.step-map-section #map {min-height: 0}
.step-location-btn {padding: 10px 14px;font-size: 0.85rem}
.step-privacy-toggle {padding: 8px 10px}
.privacy-toggle-text {font-size: 13px}
.privacy-toggle-hint {font-size: 11px;margin-left: 50px}
.fishing-report-submit-button {padding: 12px 16px;font-size: 0.95rem;border-radius: 10px}
.quota-badge {top: -7px;right: 2px;padding: 2px 6px}
.quota-badge-label {font-size: 9px}
.quota-badge-count {font-size: 11px}
.tackle-set-option {padding: 10px;gap: 8px;border-radius: 10px}
.tackle-set-name {font-size: 13px}
.tackle-item-card-edit {padding: 4px 6px;font-size: 10px}}
.image-required-highlight {animation: pulseHighlight 0.5s ease-in-out 3}
@keyframes pulseHighlight {0%, 100% {border-color: #ddd;box-shadow: none}
50% {border-color: #ff6b6b;box-shadow: 0 0 0 4px rgba(255, 107, 107, 0.3)}}
.modal-overlay {position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0, 0, 0, 0.6);display: flex;align-items: center;justify-content: center;z-index: 9999;padding: 16px}
.modal-overlay.hidden {display: none}
.modal-content {background: #fff;border-radius: 16px;padding: 24px;box-shadow: 0 4px 24px rgba(0, 0, 0, 0.2)}
@media (min-width: 769px) {body.with-header.with-footer.form-page:has(.edit-fishing-report-container) .main-content {align-items: flex-start;overflow-y: auto}}
body.form-page:has(.edit-fishing-report-container) .main-content {scrollbar-width: none;-ms-overflow-style: none}
body.form-page:has(.edit-fishing-report-container) .main-content::-webkit-scrollbar {display: none}
@media (max-width: 768px) {body.with-header.form-page:has(.edit-fishing-report-container) .main-content {align-items: flex-start;overflow-y: auto;padding-bottom: calc(130px + env(safe-area-inset-bottom, 0px))}}
.edit-fishing-report-container {max-width: 520px;margin: 0 auto;padding: 0 16px 16px;width: 100%}
.edit-hero-image {position: relative;width: 100%;aspect-ratio: 4 / 3;border-radius: 12px;overflow: hidden;margin: 16px 0;box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08)}
.edit-hero-img {width: 100%;height: 100%;object-fit: cover}
.edit-image-badge {position: absolute;bottom: 8px;right: 8px;background: rgba(0, 0, 0, 0.6);color: #fff;font-size: 11px;padding: 4px 10px;border-radius: 12px;display: flex;align-items: center;gap: 4px}
.edit-image-badge svg {flex-shrink: 0}
.edit-section {background: #fff;border-radius: 12px;padding: 20px;margin-bottom: 12px;box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06)}
.edit-section-header {display: flex;align-items: center;gap: 8px;margin-bottom: 16px}
.edit-section-header svg {color: #42b72a;flex-shrink: 0}
.edit-section-title {font-size: 16px;font-weight: 600;color: #1c1e21;margin: 0}
.edit-field {margin-bottom: 16px}
.edit-field:last-child {margin-bottom: 0}
.edit-field-label {display: block;font-size: 13px;font-weight: 600;color: #65676b;margin-bottom: 6px}
.edit-field .step-input {width: 100%;max-width: 100%;box-sizing: border-box}
.edit-field textarea.step-input {resize: vertical;min-height: 80px}
.edit-field .field-hint {font-size: 12px;color: #65676b;margin-top: 4px}
.edit-fields-row {display: flex;gap: 12px}
.edit-fields-row .edit-field {flex: 1;min-width: 0}
.tackle-snapshot-label {font-size: 12px;color: #65676b;margin-bottom: 8px}
.tackle-change-btn {display: flex;align-items: center;justify-content: center;gap: 6px;width: 100%;padding: 10px;border: 1.5px dashed #42b72a;border-radius: 10px;background: transparent;color: #42b72a;font-size: 14px;font-weight: 500;cursor: pointer;transition: all 0.2s;margin-top: 12px}
.tackle-change-btn:hover {background: #f6fff4}
.tackle-change-btn.is-open {border-style: solid;background: #f6fff4}
.tackle-change-btn svg {flex-shrink: 0}
.tackle-select-panel {display: none;flex-direction: column;gap: 10px;margin-top: 12px}
.tackle-select-panel.is-open {display: flex}
.tackle-select-note {font-size: 12px;color: #e67e22;padding: 8px 12px;background: #fff8e1;border-radius: 8px}
.edit-submit-area {position: fixed;left: 0;right: 0;background: #fff;border-top: 1px solid #e4e6eb;padding: 12px 16px;z-index: 1001;bottom: calc(60px + env(safe-area-inset-bottom, 0px))}
@media (min-width: 769px) {.edit-submit-area {bottom: 0;padding-bottom: calc(12px + env(safe-area-inset-bottom, 0px))}}
.edit-submit-inner {max-width: 520px;margin: 0 auto;display: flex;gap: 10px}
.edit-cancel-btn {display: flex;align-items: center;justify-content: center;padding: 12px 20px;border: 1.5px solid #dddfe2;border-radius: 10px;background: #fff;color: #65676b;font-size: 15px;font-weight: 500;cursor: pointer;white-space: nowrap;transition: all 0.2s;text-decoration: none}
.edit-cancel-btn:hover {background: #f0f2f5;text-decoration: none;color: #65676b}
.edit-submit-btn {flex: 1;display: flex;align-items: center;justify-content: center;gap: 8px;padding: 12px 24px;border: none;border-radius: 10px;background: linear-gradient(135deg, #42b72a 0%, #36a420 100%);color: #fff;font-size: 16px;font-weight: 600;cursor: pointer;box-shadow: 0 4px 12px rgba(66, 183, 42, 0.3);transition: all 0.2s}
.edit-submit-btn:hover {background: linear-gradient(135deg, #2d8a1d 0%, #1e6b14 100%);box-shadow: 0 6px 20px rgba(66, 183, 42, 0.4);transform: translateY(-1px)}
.edit-submit-btn:active {transform: translateY(0)}
.edit-submit-btn:disabled {background: #ccc;cursor: not-allowed;box-shadow: none;transform: none}
.edit-submit-btn svg {flex-shrink: 0}
@media (max-width: 390px) {.edit-fishing-report-container {padding: 0 12px 120px}
.edit-section {padding: 16px}
.edit-submit-btn {font-size: 14px;padding: 12px 16px}
.edit-cancel-btn {padding: 12px 14px;font-size: 14px}}
.scroll-hint-sticky {display: block;position: sticky;bottom: -24px;z-index: 5;cursor: pointer;margin: 0 -24px -24px;opacity: 1;transition: opacity 0.4s ease}
.scroll-hint-hidden {opacity: 0;pointer-events: none}
.scroll-hint-fade {height: 48px;background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);pointer-events: none}
.scroll-hint-chevrons {display: flex;flex-direction: column;align-items: center;gap: 0;padding-bottom: 8px;background: rgba(255, 255, 255, 0.95)}
.scroll-hint-chevrons svg {width: 24px;height: 24px;stroke: #42b72a;filter: drop-shadow(0 1px 3px rgba(66, 183, 42, 0.3))}
.scroll-hint-chevrons svg:first-child {margin-bottom: -12px;opacity: 0.5;animation: scroll-hint-bounce-upper 1.6s ease-in-out infinite}
.scroll-hint-chevrons svg:last-child {animation: scroll-hint-bounce-lower 1.6s ease-in-out infinite}
@media (max-width: 768px) {.scroll-hint-sticky {bottom: -22px;margin: 0 -20px -22px}
.scroll-hint-chevrons svg {width: 22px;height: 22px}}
@keyframes scroll-hint-bounce-upper {0%, 100% { transform: translateY(0); opacity: 0.4; }
50% { transform: translateY(4px); opacity: 0.7; }}
@keyframes scroll-hint-bounce-lower {0%, 100% { transform: translateY(0); opacity: 0.8; }
50% { transform: translateY(4px); opacity: 1; }}
@media (max-width: 480px) {.scroll-hint-sticky {bottom: -18px;margin: 0 -14px -18px}
.scroll-hint-fade {height: 40px}
.scroll-hint-chevrons svg {width: 20px;height: 20px}}