/* V3由来の基本スタイル */
    h3 { border-left: 5px solid #0073aa; padding-left: 10px; margin-top: 40px; }
    label { display: block; margin-bottom: 5px; font-weight: bold; }
    input[type="text"], select, textarea, input[type="time"] { width: 100%; padding: 8px; margin-bottom: 15px; box-sizing: border-box; border: 1px solid #333; border-radius: 4px; }
    button { background-color: #0073aa; color: white; padding: 10px 15px; border: none; border-radius: 4px; cursor: pointer; margin-right: 5px; margin-bottom: 10px; }
    button:hover { background-color: #005a87; }
    button:disabled { background-color: #ccc; cursor: not-allowed; }
    
    .checkbox-group label { background: rgba(245,245,245,1); border: 1px solid #333; transition: color 0.2s; cursor: pointer; margin: 2px; display: inline-block; padding: 0px 0.5rem; line-height: 2rem; }
    .checkbox-group label:has(input:checked) { background: #000; color: #fff; }
    .checkbox-group input[type="checkbox"] { display: none; }

    /* モード切替スイッチ */
    .mode-switch { display: flex; gap: 15px; margin-bottom: 25px; justify-content: center; background: #fff; padding: 15px; border-radius: 8px; border: 1px solid #ddd; }
    .mode-label { cursor: pointer; padding: 10px 20px; border: 1px solid #333; border-radius: 30px; font-weight: bold; color: #555; background: #fff; transition: 0.2s; display: flex; align-items: center; gap: 8px; margin:0; }
    .mode-label:hover { background: #f0f0f0; }
    input[type="radio"] { display: none; }
    input[type="radio"]:checked + .mode-label { border-color: #0073aa; background: #0073aa; color: #fff; }

    /* 結果エリア */
    .result-area { position: relative; margin-top: 30px; border-top: 2px dashed #ddd; padding-top: 20px; }
    .copy-btn { background-color: #666; font-size: 12px; padding: 5px 10px; margin-top: 5px; }
    .copy-btn:hover { background-color: #444; }

    /* DeepLスイッチ */
    .deepl-toggle-switch { position: relative; display: inline-block; width: 40px; height: 22px; vertical-align: middle; margin-right: 8px; }
    .deepl-toggle-switch input { opacity: 0; width: 0; height: 0; }
    .deepl-slider { position: absolute; cursor: pointer; top: 0; left: 0; right: 0; bottom: 0; background-color: #ccc; transition: .4s; border-radius: 34px; }
    .deepl-slider:before { position: absolute; content: ""; height: 16px; width: 16px; left: 3px; bottom: 3px; background-color: white; transition: .4s; border-radius: 50%; }
    input:checked + .deepl-slider { background-color: #0073aa; } 
    input:checked + .deepl-slider:before { transform: translateX(18px); }
    .deepl-label-text { font-weight: bold; color: #333; cursor: pointer; vertical-align: middle; font-size: 1.0em; }
    #deepl-toggle-container { margin-top: 15px; margin-bottom: 10px; text-align: center; }
    
    .hint { font-size: 0.85em; color: #666; margin-top: -10px; margin-bottom: 15px; }
    .accordion-content { display: block; }

    /* シーン設定用 */
    .scene-block { border: 1px solid #ddd; padding: 15px; margin-bottom: 15px; border-radius: 4px; background: #f9f9f9; }
    .serif-block { display: flex; gap: 5px; align-items: center; margin-bottom: 10px; flex-wrap: wrap; }
    .serif-block select.serif-speaker { width: 30%; min-width: 120px; margin-bottom: 0; }
    .serif-block input.serif-speaker-custom { width: 20%; min-width: 100px; display: none; margin-bottom: 0; }
    .serif-block input.serif-text { flex: 1; min-width: 200px; margin-bottom: 0; }

    /* ★キャラクターリスト用スタイル */
    .char-item { display: flex; gap: 5px; align-items: center; margin-bottom: 5px; }
    .char-id-badge { background: #333; color: #fff; padding: 3px 8px; border-radius: 3px; font-size: 12px; min-width: 40px; text-align: center; }

    /* ボタン配置のスマホ対応 */
    .generate-btn-group {
        display: flex; gap: 10px; margin-top: 15px; flex-wrap: wrap; align-items: stretch;
    }
    .btn-gen-main { flex: 2; min-width: 200px; padding: 15px; font-size: 1.1em; font-weight: bold; }
    .btn-gen-sub { flex: 1; min-width: 100px; font-size: 14px; padding: 15px 10px; }
    
    .bg-blue { background-color: #3f51b5; }
    .bg-orange { background-color: #f39c12; }
    .bg-green { background-color: #28a745; }

    @media (max-width: 600px) {
        .generate-btn-group { flex-direction: column; gap: 10px; }
        .generate-btn-group button { width: 100%; margin-right: 0; margin-bottom: 0; font-size: 16px; }
        .btn-gen-main { padding: 18px; order: 1; }
        .btn-gen-sub { padding: 12px; order: 2; }
    }