:root {
   --user_search_color_text: #222222;
   --user_search_color_border: #999999;
   --user_search_color_surface: #ffffff;
   --user_search_color_overlay: rgba(0, 0, 0, 0.4);
   --user_search_color_header_bg: #b8cce4;
   --user_search_color_label_id: #adadff;
   --user_search_color_toggle_on: #a8d3ff;
   --user_search_color_toggle_off: #c8c8c8;
   --user_search_color_button_bg: #d9d9d9;
   --user_search_color_normalbutton_bg: #38b48b;
   --user_search_color_error: #e0412b;
   --user_search_color_notice: blue;
   --user_search_color_self_row_bg: #e6f2ff;
   --user_search_spacing_sm: 6px;
   --user_search_spacing_md: 12px;
   --user_search_radius_control: 4px;
 }

 .user_search_overlay[hidden],
 .user_search_error[hidden] {
   display: none !important;
 }

 .user_search_overlay {
   position: fixed;
   inset: 0;
   background: var(--user_search_color_overlay);
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 16px;
   box-sizing: border-box;
 }

 .user_search_dialog {
   font-family: "Yu Gothic", "Meiryo", sans-serif;
   color: var(--user_search_color_text);
   background: var(--user_search_color_surface);
   width: 100%;
   max-width: 760px;
   max-height: 90vh;
   overflow-y: auto;
   border: 1px solid var(--user_search_color_border);
   border-radius: 6px;
   padding: var(--user_search_spacing_md);
   box-sizing: border-box;
 }

 .user_search_header {
   display: flex;
   justify-content: space-between;
   align-items: center;
   flex-wrap: wrap;
   gap: var(--user_search_spacing_sm);
 }

 .user_search_title {
   margin: 0;
   font-size: 20px;
   font-weight: 800;
 }

 .user_search_clock {
   font-size: 13px;
   font-weight: 800;
   color: #555555;
 }

 .user_search_error {
   color: var(--user_search_color_error);
   font-size: 14px;
   margin: var(--user_search_spacing_sm) 0 0 0;
 }

 /* エラー欄を案内（青文字）として使う場合 */
 .user_search_error.user_search_notice {
   color: var(--user_search_color_notice);
 }

 .user_search_search_row {
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: var(--user_search_spacing_sm);
   margin-top: var(--user_search_spacing_md);
 }

 .user_search_keyword_input {
   min-width: 180px;
   padding: 4px 6px;
   border: 1px solid var(--user_search_color_border);
   border-radius: var(--user_search_radius_control);
 }

 .user_search_button {
   padding: 4px 14px;
   color: white;
   font-weight: 600;
   background: var(--user_search_color_normalbutton_bg);
   border: 1px solid var(--user_search_color_border);
   border-radius: var(--user_search_radius_control);
   cursor: pointer;
 }

 .user_search_clear_button {
   margin-left: auto;
 }

 .user_search_column_row {
   display: flex;
   flex-wrap: wrap;
   gap: var(--user_search_spacing_sm);
   margin-top: var(--user_search_spacing_md);
 }

 .user_search_fixed_label {
   min-width: 90px;
   padding: 4px 14px;
   text-align: center;
   font-weight: 600;
   color: #ffffff;
   background: var(--user_search_color_label_id);
   border-radius: var(--user_search_radius_control);
   box-sizing: border-box;
 }

 .user_search_toggle_button {
   min-width: 90px;
   padding: 4px 14px;
   border: none;
   border-radius: var(--user_search_radius_control);
   cursor: pointer;
   color: #ffffff;
   font-weight: 600;
 }

 .user_search_toggle_on {
   background: var(--user_search_color_toggle_on);
 }

 .user_search_toggle_off {
   background: var(--user_search_color_toggle_off);
   color: #555555;
 }

 .user_search_result_header_row {
   display: flex;
   justify-content: space-between;
   align-items: center;
   flex-wrap: wrap;
   gap: var(--user_search_spacing_sm);
   margin-top: var(--user_search_spacing_md);
 }

 .user_search_table_wrap {
   overflow-x: auto;
   margin-top: var(--user_search_spacing_sm);
 }

 .user_search_result_table {
   width: 100%;
   min-width: 480px;
   border-collapse: collapse;
 }

 .user_search_result_table th,
 .user_search_result_table td {
   border: 1px solid var(--user_search_color_border);
   padding: 4px 8px;
   font-size: 14px;
   text-align: center;
 }

 .user_search_result_table th {
   background: var(--user_search_color_header_bg);
 }

 /* 自分自身がヒットした場合 */
 .user_search_self_row td {
   background: var(--user_search_color_self_row_bg);
   color: blue;
   font-weight: 900;
 }

 .user_search_col_check {
   width: 36px;
 }

 .user_search_col_name,
 .user_search_col_sub_name_1,
 .user_search_col_sub_name_2 {
   text-align: left;
 }

 .user_search_hide_sub_name_1 .user_search_col_sub_name_1,
 .user_search_hide_sub_name_2 .user_search_col_sub_name_2,
 .user_search_hide_created_at .user_search_col_created_at {
   display: none;
 }

 @media screen and (max-width: 767px) {
   .user_search_dialog {
     padding: var(--user_search_spacing_sm);
   }
 }
 /* 検索結果が1件以上のとき、一番左の列を「元の色→黄色→元の色…」と1秒ごとに切り替え、16秒後に元の色で止める */
 /* 元の色は指定しない（本文は白、見出しは --user_search_color_header_bg の青のまま）。黄色の区間だけ上書きする */
 @keyframes user_search_check_blink {
   50% {
     background-color: #ffff00;
   }
 }

 .user_search_blink_check .user_search_col_check {
   animation: user_search_check_blink 2s step-end 8;
 }