/* 1. 기본 및 플로팅 버튼 스타일 */
            .gsf-floating-btn {
                position: fixed;
                bottom: 25px;
                right: 25px;
                z-index: 99999;
                background-color: #1a73e8;
                color: #ffffff;
                border: none;
                border-radius: 24px;
                padding: 12px 20px;
                font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
                font-size: 14px;
                font-weight: 500;
                display: flex;
                align-items: center;
                gap: 8px;
                box-shadow: 0 4px 10px rgba(0,0,0,0.16);
                cursor: pointer;
                transition: background-color 0.2s, transform 0.2s, box-shadow 0.2s;
            }
            .gsf-floating-btn:hover {
                background-color: #1557b0;
                box-shadow: 0 6px 14px rgba(0,0,0,0.24);
                transform: translateY(-2px);
            }
            .gsf-floating-btn .material-icons {
                font-size: 20px;
            }

            /* 2. 모달 오버레이 및 우측 드로어 구조 */
            .gsf-overlay {
                display: none;
                position: fixed;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background-color: rgba(60, 64, 67, 0.45);
                z-index: 100000;
                opacity: 0;
                transition: opacity 0.25s ease;
                font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
            }
            /* 레이아웃에 올린 상태(아직 투명) */
            .gsf-overlay.gsf-visible {
                display: block;
            }
            /* 슬라이드인 활성화 */
            .gsf-overlay.gsf-open {
                opacity: 1;
            }
            .gsf-card {
                position: absolute;
                top: 0;
                right: 0;
                width: 460px;
                max-width: 100%;
                height: 100%;
                max-height: 100%;
                background-color: #ffffff;
                border-radius: 0;
                box-shadow: -8px 0 32px rgba(0,0,0,0.28);
                display: flex;
                flex-direction: column;
                overflow: hidden;
                transform: translateX(100%);
                transition: transform 0.3s cubic-bezier(0.1, 0.8, 0.25, 1);
            }
            /* 우측에서 슬라이드인 */
            .gsf-overlay.gsf-open .gsf-card {
                transform: translateX(0);
            }

            /* 3. 헤더 및 내부 패널 */
            .gsf-card-header {
                display: flex;
                justify-content: space-between;
                align-items: center;
                padding: 16px 24px;
                border-bottom: 1px solid #dadce0;
            }
            .gsf-card-header h2 {
                margin: 0;
                font-size: 18px;
                font-weight: 500;
                color: #202124;
                line-height: 1.4;
            }
            .gsf-close-btn {
                background: none;
                border: none;
                color: #5f6368;
                cursor: pointer;
                padding: 4px;
                border-radius: 50%;
                display: flex;
                align-items: center;
                transition: background-color 0.2s;
            }
            .gsf-close-btn:hover {
                background-color: #f1f3f4;
                color: #202124;
            }

            .gsf-card-body {
                padding: 20px 24px;
                overflow-y: auto;
                flex-grow: 1;
            }

            /* 4. 입력 폼 스타일 */
            .gsf-form-group {
                margin-bottom: 20px;
            }
            .gsf-label {
                display: block;
                font-size: 14px;
                font-weight: 500;
                color: #202124;
                margin-bottom: 8px;
            }
            #gsf-opinion {
                width: 100%;
                height: 110px;
                padding: 12px;
                border: 1px solid #dadce0;
                border-radius: 4px;
                resize: none;
                font-size: 13px;
                line-height: 1.5;
                color: #3c4043;
                box-sizing: border-box;
                transition: border-color 0.2s;
            }
            #gsf-opinion:focus {
                outline: none;
                border-color: #1a73e8;
                box-shadow: 0 0 0 1px #1a73e8;
            }
            .gsf-helper-text {
                display: flex;
                align-items: center;
                gap: 4px;
                font-size: 11px;
                color: #70757a;
                margin-top: 6px;
            }
            .gsf-help-icon {
                font-size: 14px !important;
                color: #5f6368;
                cursor: help;
            }

            /* 5. 스크린샷 캡처 부문 */
            .gsf-screenshot-section {
                border-top: 1px solid #f1f3f4;
                padding-top: 16px;
                margin-bottom: 20px;
            }
            .gsf-screenshot-desc {
                font-size: 13px;
                color: #3c4043;
                margin: 0 0 12px 0;
            }
            .gsf-btn-outline {
                width: 100%;
                padding: 10px;
                background-color: #ffffff;
                border: 1px solid #dadce0;
                border-radius: 4px;
                color: #1a73e8;
                font-weight: 500;
                font-size: 13px;
                display: flex;
                align-items: center;
                justify-content: center;
                gap: 8px;
                cursor: pointer;
                transition: background-color 0.2s, border-color 0.2s;
            }
            .gsf-btn-outline:hover {
                background-color: #f8fafd;
                border-color: #d2e3fc;
            }
            .gsf-btn-outline .material-icons {
                font-size: 18px;
            }

            /* 6. 캡처 결과물 미리보기 */
            .gsf-preview-box {
                margin-top: 12px;
                text-align: center;
            }
            .gsf-preview-wrapper {
                position: relative;
                display: inline-block;
                max-width: 100%;
                border: 2px solid #dadce0;
                border-radius: 4px;
                overflow: hidden;
                cursor: zoom-in;
            }
            #gsf-screenshot-img {
                max-width: 100%;
                max-height: 150px;
                display: block;
            }
            .gsf-delete-btn {
                position: absolute;
                top: 4px;
                right: 4px;
                background: rgba(255, 255, 255, 0.9);
                border: none;
                border-radius: 50%;
                color: #ea4335;
                padding: 0;
                cursor: pointer;
                display: flex;
                align-items: center;
                justify-content: center;
                box-shadow: 0 1px 3px rgba(0,0,0,0.3);
            }
            .gsf-delete-btn .material-icons {
                font-size: 22px;
            }
            .gsf-preview-caption {
                font-size: 11px;
                color: #70757a;
                margin: 6px 0 0 0;
            }

            /* 7. 체크박스 동의 */
            .gsf-consent-section {
                margin-bottom: 16px;
            }
            .gsf-checkbox-container {
                display: flex;
                align-items: flex-start;
                position: relative;
                cursor: pointer;
                font-size: 13px;
                color: #3c4043;
                user-select: none;
                gap: 8px;
            }
            .gsf-checkbox-container input {
                position: absolute;
                opacity: 0;
                cursor: pointer;
                height: 0;
                width: 0;
            }
            .gsf-checkbox-mark {
                height: 16px;
                width: 16px;
                background-color: #ffffff;
                border: 2px solid #5f6368;
                border-radius: 2px;
                flex-shrink: 0;
                position: relative;
                top: 2px;
                box-sizing: border-box;
            }
            .gsf-checkbox-container:hover input ~ .gsf-checkbox-mark {
                border-color: #202124;
            }
            .gsf-checkbox-container input:checked ~ .gsf-checkbox-mark {
                background-color: #1a73e8;
                border-color: #1a73e8;
            }
            .gsf-checkbox-mark:after {
                content: "";
                position: absolute;
                display: none;
                left: 4px;
                top: 1px;
                width: 4px;
                height: 8px;
                border: solid white;
                border-width: 0 2px 2px 0;
                transform: rotate(45deg);
            }
            .gsf-checkbox-container input:checked ~ .gsf-checkbox-mark:after {
                display: block;
            }
            .gsf-checkbox-label {
                line-height: 1.4;
            }

            /* 8. 약관고지 */
            .gsf-disclaimer {
                font-size: 11px;
                color: #70757a;
                line-height: 1.5;
                margin: 0;
                border-top: 1px solid #f1f3f4;
                padding-top: 12px;
            }

            /* 9. 푸터 및 버튼 구조 */
            .gsf-card-footer {
                display: flex;
                justify-content: flex-end;
                gap: 12px;
                padding: 12px 24px;
                background-color: #f8f9fa;
                border-top: 1px solid #dadce0;
            }
            .gsf-btn-text-only {
                background: none;
                border: none;
                color: #5f6368;
                font-size: 14px;
                font-weight: 500;
                padding: 8px 16px;
                border-radius: 4px;
                cursor: pointer;
                transition: background-color 0.2s;
            }
            .gsf-btn-text-only:hover {
                background-color: #f1f3f4;
                color: #202124;
            }
            .gsf-btn-primary {
                background-color: #1a73e8;
                border: none;
                color: #ffffff;
                font-size: 14px;
                font-weight: 500;
                padding: 8px 24px;
                border-radius: 4px;
                cursor: pointer;
                box-shadow: 0 1px 2px rgba(60,64,67,0.3);
                transition: background-color 0.2s, box-shadow 0.2s;
            }
            .gsf-btn-primary:hover {
                background-color: #1557b0;
                box-shadow: 0 1px 3px rgba(60,64,67,0.3), 0 1px 2px rgba(60,64,67,0.15);
            }
            .gsf-btn-primary:disabled {
                background-color: #f1f3f4;
                color: #9aa0a6;
                box-shadow: none;
                cursor: not-allowed;
            }

            /* 10. 로더 레이아웃 */
            .gsf-loader-overlay {
                display: none;
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background-color: rgba(255,255,255,0.9);
                z-index: 10;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                gap: 16px;
            }
            .gsf-spinner {
                width: 40px;
                height: 40px;
                border: 3px solid #f3f3f3;
                border-top: 3px solid #1a73e8;
                border-radius: 50%;
                animation: gsfSpin 1s linear infinite;
            }
            @keyframes gsfSpin {
                0% { transform: rotate(0deg); }
                100% { transform: rotate(360deg); }
            }
            #gsf-loader-text {
                font-size: 14px;
                font-weight: 500;
                color: #3c4043;
                margin: 0;
            }

            /* 11. 상태별 결과 화면 */
            .gsf-status-view {
                display: none;
                position: absolute;
                top: 0;
                left: 0;
                width: 100%;
                height: 100%;
                background-color: #ffffff;
                z-index: 11;
                flex-direction: column;
                justify-content: center;
                align-items: center;
                padding: 40px;
                box-sizing: border-box;
                text-align: center;
            }
            .gsf-success-icon {
                font-size: 72px !important;
                color: #34a853;
                margin-bottom: 16px;
            }
            .gsf-status-view h3 {
                margin: 0 0 12px 0;
                font-size: 20px;
                font-weight: 500;
                color: #202124;
            }
            .gsf-status-view p {
                margin: 0 0 24px 0;
                font-size: 14px;
                color: #5f6368;
                line-height: 1.6;
            }

            /* 12. 라이트박스 줌 모달 */
            .gsf-zoom-modal {
                display: none;
                position: fixed;
                z-index: 100005;
                padding-top: 50px;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                overflow: auto;
                background-color: rgba(0,0,0,0.9);
            }
            .gsf-zoom-content {
                margin: auto;
                display: block;
                width: 85%;
                max-width: 1200px;
                border-radius: 4px;
                box-shadow: 0 4px 20px rgba(0,0,0,0.5);
                animation: zoomIn 0.25s ease;
            }
            @keyframes zoomIn {
                from {transform: scale(0.9); opacity: 0;}
                to {transform: scale(1); opacity: 1;}
            }
            .gsf-zoom-close {
                position: absolute;
                top: 20px;
                right: 35px;
                color: #f1f1f1;
                font-size: 40px !important;
                font-weight: bold;
                transition: 0.3s;
                cursor: pointer;
            }
            .gsf-zoom-close:hover {
                color: #bbb;
            }

            /* ── 다크모드 (sw-simple-dark-mode 의 body.dark-mode 클래스) ──
               카드/푸터/버튼 배경이 흰색으로 하드코딩돼 있어, 다크모드가 글자만 밝게 바꾸면
               흰 바탕에 흰 글씨가 된다. 모달 내부를 어두운 톤으로 재정의한다. */
            body.dark-mode .gsf-card { background-color: #23262b !important; color: #e6e6ea !important; }
            body.dark-mode .gsf-card-header,
            body.dark-mode .gsf-card-body { background-color: transparent !important; color: #e6e6ea !important; }
            body.dark-mode .gsf-card-header { border-bottom-color: #3a3d45 !important; }
            body.dark-mode .gsf-card-footer { background-color: #1c1f24 !important; border-top-color: #3a3d45 !important; }
            body.dark-mode .gsf-label,
            body.dark-mode .gsf-checkbox-label,
            body.dark-mode .gsf-screenshot-desc,
            body.dark-mode .gsf-preview-caption { color: #d5d5db !important; }
            body.dark-mode .gsf-helper-text,
            body.dark-mode .gsf-disclaimer { color: #9aa0a6 !important; }
            body.dark-mode .gsf-card textarea,
            body.dark-mode .gsf-card input[type='text'],
            body.dark-mode .gsf-card input[type='email'] {
                background-color: #2b2f36 !important; color: #e6e6ea !important; border-color: #454a54 !important;
            }
            body.dark-mode .gsf-card textarea::placeholder { color: #8a8f98 !important; }
            /* 체크박스 커스텀 마크 */
            body.dark-mode .gsf-checkbox-mark { background-color: #2b2f36 !important; border-color: #565b66 !important; }
            /* 버튼: 비활성(기본) → 어두운 회색, 활성(파랑)은 그대로 두어 강조를 유지 */
            body.dark-mode .gsf-btn-primary { background-color: #33373f !important; color: #9aa0a6 !important; }
            body.dark-mode .gsf-btn-primary:not(:disabled) { background-color: #1a73e8 !important; color: #ffffff !important; }
            body.dark-mode .gsf-btn-outline { background-color: transparent !important; border-color: #4a5563 !important; color: #8ab4f8 !important; }
            body.dark-mode .gsf-btn-outline:hover { background-color: #2b2f36 !important; }
            body.dark-mode .gsf-btn-text-only { color: #8ab4f8 !important; }
            body.dark-mode .gsf-close-btn,
            body.dark-mode .gsf-help-icon { color: #b8bcc4 !important; }
            /* 스크린샷 미리보기 / 상태 화면 / 로딩 오버레이 */
            body.dark-mode .gsf-preview-box,
            body.dark-mode .gsf-preview-wrapper { background-color: #2b2f36 !important; border-color: #3a3d45 !important; }
            body.dark-mode .gsf-status-view { background-color: #23262b !important; color: #e6e6ea !important; }
            body.dark-mode .gsf-loader-overlay { background-color: rgba(35, 38, 43, 0.92) !important; }
            body.dark-mode .gsf-delete-btn { background-color: rgba(35, 38, 43, 0.9) !important; }
            body.dark-mode .gsf-floating-btn { background-color: #2b2f36 !important; color: #e6e6ea !important; box-shadow: 0 2px 10px rgba(0,0,0,.5) !important; }