
.rs                     { padding:0 var(--gap-main); margin:var(--gap-main) auto; }

main .retro > *         { display: block;max-width: 100%;}
main .retro table tr td { border: 0;}


.rasp_block             { margin-bottom:var(--gap-l); }
.rasp_block:last-child  { border-bottom:none; margin-bottom:0; }
.rasp_block_header      { margin-top:var(--gap-m); margin-bottom: var(--gap-s); border-left:4px solid var(--clr-main-3); padding:var(--gap-s); border-radius: 3px;}


.rasp_block_name        { margin:0; font-size:var(--fs-l); font-weight:500; color:var(--clr-main-1); }
.rasp_grid              { display:grid; grid-template-columns:repeat(auto-fill, minmax(120px, auto)); gap:var(--gap-m); padding:var(--gap-xs) var(--gap-xs) var(--gap-xs) 0; }
.rasp_grid.teachers     { display:grid; grid-template-columns:repeat(auto-fill, minmax(300px, auto)); gap:var(--gap-s); padding:var(--gap-s) var(--gap-m); padding-left:0; }
.rasp_grid.specs        { display:block; overflow-x:auto; white-space:nowrap; gap:10px; }
.rasp_list_container    { display:contents; max-width:var(--v-content-max-width); margin:0 auto; }


.sub_tabs .ui_tab_label_text {} 
.ui_tab_label_text           { color: var(--clr-black);}


.checkbox_group         { display: flex;  flex-wrap: nowrap; gap: var(--gap-s) var(--gap-s); align-items: center; margin: 0 var(--gap-xs) 0 0; }


.checkbox_item          { align-items: center; display: flex; justify-content: center; line-height: 1;  height: 30px;}
.checkbox_item label    { cursor: pointer; margin: 0;  white-space: nowrap; color: var(--clr-black);}


.ui_tab_label_delimiter { margin:0 var(--gap-s); }
.ui_tab_label.tab_item_gaks { margin-right: var(--gap-small);}
.aud_search_form        { display: inline-block; line-height: 1em; position: relative; white-space: nowrap;  padding: var(--gap-m) 0 var(--gap-m) 0; }


.dd_aud_date            { position:relative; margin-left:var(--gap-xs);  display: inline-block; cursor: pointer; }
.dd_aud_date:hover .date_suggest { display: block !important; }
.dd_aud_date::before, .dd_aud_date::after { display: none;}


.date_input             { position:relative; z-index:3; display:inline-flex; gap:var(--gap-xs); align-items:center;     cursor: pointer;}
.date_input input[type="text"] { margin-left: var(--gap-xs); padding:var(--gap-xs) var(--gap-m);  font-size: var(--fs-s); border:1px solid var(--clr-gray-m); border-radius:var(--gap-s); }
.date_input input[type="text"]:focus { outline: none; border-color: var(--clr-main-3);}



.search_button          { width:var(--v-icon-size); height:var(--v-icon-size); min-width: var(--v-icon-size); min-height: var(--v-icon-size);  background-color: var(--clr-main-3); border: none; border-radius: var(--v-icon-size); cursor: pointer; transition: all 0.2s ease; position: relative; flex-shrink: 0; padding: 0;}
.search_button::after   { position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); width:var(--v-icon-size); height:var(--v-icon-size); background:url(/v7/i/i_go_g.svg) center center no-repeat; background-size:contain; content:""; }
.search_button:hover    { background-color:var(--clr-main-3-3); transform:scale(1.05); }
.search_button:focus    { outline: none; border: none;}

.date_suggest           { position:absolute; top:100%; left: 0; z-index:100; display:none; min-width:200px; margin-top:0; border:1px solid var(--clr-gray-m); background-color:var(--clr-white); box-shadow:0 4px 12px rgba(0,0,0,0.15); border-radius: var(--gap-s); overflow:hidden; }
.date_suggest:hover     { display: block !important; }


.suggest                { display:block; padding:var(--gap-xs) var(--gap-m); cursor:pointer; transition:background-color 0.2s ease; white-space:nowrap; }
.suggest .sg_wday       { display:inline-block; width:35px; color:var(--clr-gray-l); font-weight:500; }
.suggest .sg_date a     { text-decoration:none; color:var(--clr-main-2); margin-left:var(--gap-xs); }
.suggest .sg_date a:hover { color:var(--clr-main-3); }
.suggest_items          { display:block; padding:var(--gap-xs) 0; }
.suggest:hover          { background-color:var(--clr-gray-s); }

.auds_info              { padding-bottom:var(--gap-m);  border-bottom:1px solid var(--clr-gray-m); text-align: center;  gap: var(--gap-s);}
.auds_info form         { display: flex;  flex-wrap: nowrap; justify-content: flex-start;     align-items: center; }
.auds_info input[type="text"] { padding:var(--gap-xs) var(--gap-m); border:1px solid var(--clr-gray-m);  margin-right: var(--gap-small);  border-radius:var(--gap-s); font-size:var(--fs-s); }
.auds_info select       { padding:var(--gap-xs) var(--gap-m);  margin-right: var(--gap-small);  border:1px solid var(--clr-gray-m); border-radius:var(--gap-s); font-size:var(--fs-s); background-color:var(--clr-white); }
.auds_info .paratime    {   display: inline-block;  cursor:pointer; }
.auds_info input[type="checkbox"] { width:  var(--gap-s); height: var(--gap-s); margin-right: var(--gap-s);cursor: pointer;vertical-align: middle;accent-color: var(--clr-main-3)}



.group_link, .aud_link, .teacher_link, .spec_link { display:block; cursor:pointer; background-color:transparent; text-decoration:none; border-radius:8px; font-size:var(--fs-m); transition:color 0.3s ease; }
.group_link, .aud_link  {  display: flex; cursor: pointer; background-color: transparent; text-decoration: none;border-radius: 8px; font-size: var(--fs-m);transition: color 0.3s ease; text-align: left;justify-content: flex-start;}
.teacher_link           { text-align:left; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding-left:0; }
.spec_link              { margin-bottom:var(--gap-s); white-space:nowrap; flex-shrink:0; }
.group_link:hover, .teacher_link:hover, .aud_link:hover, .spec_link:hover { color:var(--clr-main-3); cursor:pointer; }
.last_update            { display:flex; text-align:right; font-size:var(--fs-s); color:var(--clr-gray-l); justify-content: flex-end; white-space:nowrap;}
.last_update .last_update_date { text-transform:lowercase;margin:0;padding:0;font-weight:normal; white-space:nowrap; } 
.week                   { display:inline-block; width:50%; min-width:450px; vertical-align:top; }
.week_num               { font-weight:500; font-size:var(--fs-l); color:var(--clr-main-1); }
.rasp_day               { font-weight:500; font-size:var(--fs-m); margin:var(--gap-s) 0 var(--gap-xs) 0; color:var(--clr-main-3); border-left:3px solid var(--clr-main-3); padding-left:var(--gap-xs); }
.rasp_building          { color:var(--clr-main-1); font-size:var(--fs-mid);  }


table.rasp_week, table.rasp_drasp             { width:98%; border-collapse:collapse; margin-bottom:var(--gap-m); margin-top: var(--gap-m); }
table.rasp_week thead, table.rasp_drasp thead { font-size:0.85em; border-bottom:1px solid var(--clr-gray-m); color:var(--clr-gray-l); }
table.rasp_week td, table.rasp_drasp td       { vertical-align:top; padding:var(--gap-xs); }

.rasp_time               { white-space:nowrap; width:70px;  }
.rasp_time.invisible     { visibility:hidden; }
.rasp_empty              { color:var(--clr-gray-m); }
.rasp_current td         { background-color:var(--clr-main-3-1); }
.rasp_subj span          { color:var(--clr-main-1); }
.rasp_aud, .rasp_teacher { color:var(--clr-gray-xl); }
.invisible               { visibility:hidden; }

.rasp_building_title     { font-size: var(--fs-l); font-weight: 500; text-align: center; color: var(--clr-main-1);}

.ui_tab_labels.main_tabs                          { display: flex;   margin: var(--gap-m) 0 var(--gap-m) 0; flex-wrap: wrap; gap: var(--gap-s); align-items: center; justify-content: center; }
.ui_tab_labels.main_tabs, .ui_tab_labels.sub_tabs { white-space: nowrap;  }
.ui_tab_labels.sub_tabs {display: flex; flex-wrap: wrap;  justify-content: center;  align-items: center; gap: var(--gap-s); margin: var(--gap-m) 0 var(--gap-m) 0; }

.main_tabs .ui_tab_label        { background-color: var(--clr-main-1-0); padding:var(--gap-xs) var(--gap-m); color:var(--clr-black)!important;  border-radius:var(--gap-s); cursor:pointer; transition:all 0.2s ease; font-size:var(--fs-m); }
.main_tabs .ui_tab_label:hover  { color:var(--clr-main-3); }
.main_tabs .ui_tab_label.selected { color: var(--clr-main-3); font-weight: 500; }

.sub_tabs .ui_tab_label             { padding:0; background-color:transparent; color:var(--clr-gray-xl); border-radius:0; cursor:pointer; transition:all 0.2s ease; font-size:var(--fs-m); border-bottom:2px solid transparent; margin-right:var(--gap-m); }
.sub_tabs .ui_tab_label:hover       { color:var(--clr-black); border-bottom: 2px dotted var(--clr-main-3); background-color:transparent; }
.sub_tabs .ui_tab_label.selected    { text-decoration: none; border-radius: 0; color:var(--clr-black); font-weight:500; border-bottom: 2px dotted var(--clr-main-3); background-color:transparent; }
.sub_tabs .ui_tab_label_delimiter   { display:none; }
.ui_tab_contents .ui_tab_content    { display:none; }
.ui_tab_label.tab_item_  a:hover   { text-decoration:none }

.ui_tab_contents.sub_tabs           { margin-top: var(--gap-m); }
.ui_tab_contents .ui_tab_content.selected { display:block; }
.ui_tab_content.page                { display:none; }
.ui_tab_content.page.selected       { display:block; }

.rasp_drasp.rasp_free_aud_table                 { width:100%; border-collapse:collapse; font-size:var(--fs-m); margin-bottom:var(--gap-l); vertical-align:middle; }
.rasp_drasp.rasp_free_aud_table td              { padding:var(--gap-m) var(--gap-m); vertical-align:middle; line-height:1.8; word-spacing:0.25em; letter-spacing:0.02em; }
.rasp_drasp.rasp_free_aud_table .rasp_time      { white-space:nowrap; width:90px; font-size:var(--fs-l); color:var(--clr-main-3); }
.rasp_drasp.rasp_free_aud_table td .dlink       { font-size:var(--fs-m); cursor:pointer; padding:0;border-bottom: 2px dotted var\(--clr-main-3 }
.rasp_drasp.rasp_free_aud_table td .rasp_empty  { font-size:var(--fs-m); color:var(--clr-gray-l); }


.rasp_list_container .free_auds_search_wrapper {  background-color:white; margin-top: 0;padding: 0; border-bottom: 1px solid var(--clr-gray-m);  padding-bottom: var(--gap-m); border-radius: 0;}
.rasp_list_container .free_auds_search_wrapper .checkbox_group  {  gap: var(--gap-s) }
.rasp_list_container .free_auds_search_wrapper .checkbox_item   { padding: 0; }

.rasp_main_container { margin: 0 auto;  }

.time_colon { animation: blink 1s step-end infinite;}


.rasp_hero         { position: relative; overflow: hidden; flex: 0 0 auto; margin-bottom: var(--gap-l); border-radius: var(--gap-m); background-color: var(--clr-white); box-sizing: border-box;}
.rasp_hero:before  { position: absolute;  height: 100%; width: 100%; top: 0; left: 0; pointer-events: none; background: var(--clr-main-2); content: ""; z-index: 0;}
.rasp_hero:after   { position: absolute; width: 210px;  bottom: auto;transform: translateX(13%) translateY(20%); height: 210px; right: 0; bottom: 0;background: url(/v7/i/ptt21.svg) bottom right no-repeat; background-size: contain; content: ""; opacity: 1; z-index: 0;}

.rasp_hero_content {  display: flex; justify-content: space-between;  align-items: stretch;  z-index: 10; gap: var(--gap-m); padding: var(--gap-m);  border-radius: var(--gap-m); position: relative; overflow: hidden;}

.hero_left   { flex: 1; border: 1px solid rgba(255, 255, 255, 0.2); box-shadow: 0 8px 20px rgba(0,0,0,0.1); background: linear-gradient(120deg, rgba(255,255,255,0.2), rgba(255,255,255,0.05));backdrop-filter: blur(15px);padding: var(--gap-s) var(--gap-m);border-radius: var(--gap-main); }
.hero_center { flex-shrink: 0;  align-self: center;  min-width: auto; max-width: 100%;}
.hero_right  { flex: 1; text-align: right; border: 1px solid rgba(255, 255, 255, 0.2); box-shadow: 0 8px 20px rgba(0,0,0,0.1);background: linear-gradient(120deg, rgba(255,255,255,0.2), rgba(255,255,255,0.05));backdrop-filter: blur(15px);padding: var(--gap-s) var(--gap-m);border-radius: var(--gap-main);}


.date_label         { font-weight: 500; opacity: 0.9;}
.week_badge         {  color: var(--clr-bg-ghost); }
.hero_time          { box-shadow: 0 8px 20px rgba(0,0,0,0.1);   display: inline-block; width: 100%; box-sizing: border-box; border: 1px solid rgba(255, 255, 255, 0.2); background: linear-gradient(120deg, rgba(255,255,255,0.2), rgba(255,255,255,0.05));backdrop-filter: blur(15px); padding: var(--gap-s) var(--gap-m); border-radius: var(--gap-main);text-align: center; }
.time_value         { font-size: calc(var(--fs-xl) * 1.5);  min-width: 160px; max-width: 100%; text-align: center; font-variant-numeric: tabular-nums; color: var(--clr-white); letter-spacing: 5px;}

.hero_date { display: flex; align-items: stretch; gap: var(--gap-xs); font-size: var(--fs-xl);}
.date_day  { display: flex; align-items: center; justify-content: center;  text-transform: capitalize; color: var(--clr-white); min-height: 100%;}
.date_full {  color: var(--clr-main-1);  opacity: 0.9; }

.para_timer_widget { text-align: right;}
.para_info         { margin-bottom: var(--gap-xs);}
.para_number       { font-size: var(--fs-mid); color: var(--clr-main-1);display: inline-block;}

.timer_bar_container { min-width: auto;  position: relative; }
.timer_bar_wrapper   { display: flex; align-items: center; gap: 8px;}

.timer_bar_bg        { position: relative; flex: 1;height: 4px; background: rgba(255, 255, 255, 0.3); border-radius: var(--gap-s);}
.timer_bar_fill      { position: absolute; height: 100%; background: var(--clr-white); border-radius: var(--gap-s); transition: width 0.5s ease;}
.timer_ball          { position: absolute; top: 50%; transform: translate(-50%, -50%); width: 14px; height: 14px; background: var(--clr-white); border-radius: 50%; transition: left 0.5s ease; cursor: pointer; box-shadow: 0 1px 3px rgba(0,0,0,0.2); z-index: 2;}
.timer_ball:hover    { transform: translate(-50%, -50%) scale(1.2);}

.timer_remaining     { text-align: right;  font-size: var(--fs-s); margin-top: var(--gap-s);}
.timer_label         { color: rgba(255, 255, 255, 0.6);}
.timer_value         { font-weight: bold; color: var(--clr-bg); font-size: var(--fs-m);}
.timer_start         { color: var(--clr-main-1); flex-shrink: 0; min-width: 40px; text-align: left; font-size: var(--fs-l);}
.timer_end           { color: var(--clr-main-1); flex-shrink: 0; min-width: 40px; text-align: right; font-size: var(--fs-l);}

.lesson_widget_info { flex: 1;}
.lesson_widget_status { font-size: var(--fs-mid); color: var(--clr-main-1);margin-bottom: var(--gap-xs); margin-bottom: var(--gap-xs);}
.lesson_widget_no_lessons { display: flex; align-items: center; gap: var(--gap-m);}
.lesson_widget_no_lessons > .lesson_widget_info > .lesson_widget_status { font-size: var(--fs-l);}
.history_card_remove       { cursor: pointer; color: var(--clr-gray-l); cursor: pointer; font-size: 14px; width: 20px; height: 20px; display: inline-flex; align-items: center; justify-content: center; border-radius: 50%; transition: all 0.2s ease;}
.history_card_remove:hover { transform: scale(1.1); }

.rasp_history_section,
.rasp_stats_section       { margin-bottom: var(--gap-l);}
.section_header           { display: flex; justify-content: space-between; align-items: baseline; margin-bottom: var(--gap-m); flex-wrap: wrap; gap: var(--gap-xs);}
.section_header a:hover   { text-decoration:none; bottom: 0 }
.rasp_history_section a       { text-decoration: none;}
.rasp_history_section a:hover { text-decoration: underline;}
.section_title            { display: flex;  align-items: center;  gap: var(--gap-xs);  font-size: var(--fs-l);  font-weight: 500;  margin: 0;  color: var(--clr-main-1);}
.section_note             { color: var(--clr-gray-l); font-size: var(--fs-s);}
.badge                    { display: inline-block;  font-weight: 600; color: var(--clr-gray-xl);white-space: nowrap; }
.history_badge             { display: flex; align-items: center; font-size: var(--fs-s); justify-content: space-between;}
.history_grid              { border-radius: var(--gap-m); display: grid; grid-template-columns: repeat(auto-fill, minmax(450px, 1fr)); gap: var(--gap-m);}
.history_card              { overflow: hidden;  position: relative; display: flex; align-items: center; gap: var(--gap-m); padding: var(--gap-m); padding-left: calc(10px + var(--gap-m)); border-radius: var(--gap-s); background-color: var(--clr-white); box-sizing: border-box; overflow: hidden; transition: all 0.5s 0s; text-decoration: none; color: var(--clr-black); min-height: 120px;}
.history_card:before       { position: absolute; height: 100%; width: 10px; top: 0; left: 0; background-color: var(--clr-main-2); content: ""; transition: all 0.5s 0s;}
.history_card:hover:before { width: 100%;}
.history_card:after                     { position: absolute; height: 75%; width: 100%; right: -60px; bottom: -30px; background: url(/v7/i/ptt21.svg) bottom right no-repeat; background-size: contain; content: ""; opacity: 0; transition: all 0.5s 0s; pointer-events: none;}
.history_card:hover:after               { right: -25px; opacity: 1;}
.history_card:hover                     { transform: translateY(-2px);}
.history_card:hover .history_card_name  { color: var(--clr-white);}
.history_card:hover .history_card_name  { color: var(--clr-white); text-decoration: underline;}
.history_card_info                      { position: relative; z-index: 2;}
.history_card_type                      { font-size: var(--fs-text); color: var(--clr-gray-l); opacity: 0.6;}
.history_card_title                     { display: flex; flex-direction: column;}
.history_card_name                      { font-size: var(--fs-m); font-weight: 600; color: var(--clr-main-2); text-decoration: none;}
.history_card_name:hover                { color: var(--clr-main-3); text-decoration: underline;}
.history_card_date                      { font-size: var(--fs-s); color: var(--clr-gray-l); margin-top: var(--gap-xs); transition: all 0.5s 0s;}
.history_card:hover .history_card_type,
.history_card:hover .history_card_date  { color: rgba(255, 255, 255, 0.7);}
.history_empty                          { text-align: center; padding: var(--gap-xl) var(--gap-m); background: var(--clr-gray-s); border-radius: var(--gap-m);}

.history_schedule_card       { background: var(--clr-white); border: 1px solid var(--clr-gray-m); border-radius: var(--gap-m); padding: var(--gap-s); transition: all 0.3s ease;}
.history_schedule_card:hover { transform: translateY(-2px);box-shadow: 0 4px 12px rgba(0,0,0,0.1);}

.history_schedule_list       { margin-top: var(--gap-s); display: flex; flex-direction: column; gap: var(--gap-xs);}
.history_card_header         { display: flex;justify-content: space-between;align-items: baseline;margin-bottom: var(--gap-s);padding-bottom: var(--gap-xs);border-bottom: 1px solid var(--clr-gray-m);flex-wrap: nowrap;flex-direction: inherit;gap: var(--gap-xs);}
.history_lesson_item         { display: flex; flex-wrap: wrap; gap: var(--gap-xs); align-items: baseline; padding: var(--gap-xs) var(--gap-xs); border-radius: var(--gap-s); }
.history_lesson_item.current { background: var(--clr-main-3-1); }

.history_lesson_time { font-size: var(--fs-text); }
.history_lesson_name { font-size: var(--fs-text); color: var(--clr-main-1); flex: 2;}
.history_lesson_type { font-size: var(--fs-text); color: var(--clr-gray-xl); }
.history_lesson_aud  { font-size:  var(--fs-text); color: var(--clr-gray-xl); }
.history_lesson_group{ font-size:  var(--fs-text); color: var(--clr-gray-xl);}
.history_no_lessons  { text-align: center; padding: var(--gap-m); color: var(--clr-gray-l); font-size: var(--fs-text);}

.empty_icon    { font-size: 48px; margin-bottom: var(--gap-m);}
.empty_text    { font-size: var(--fs-m); color: var(--clr-gray-xl); margin-bottom: var(--gap-xs);}
.empty_hint    { font-size: var(--fs-s); color: var(--clr-gray-l);}

.stats_grid   { display: grid; grid-template-columns: repeat(auto-fill, minmax(350px, 1fr)); gap: var(--gap-m);}
.stats_grid a { text-decoration: none }
.stat_card    { padding: var(--gap-s);  background: var(--clr-white);  border: 1px solid var(--clr-gray-m);  border-radius: var(--gap-m);  transition: all 0.3s ease;}

.stat_card:hover  { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(0,0,0,0.1);}
.stat_card_header { display: flex;  cursor: pointer;justify-content: space-between; align-items: center;margin-bottom: var(--gap-s); flex-wrap: nowrap; gap: var(--gap-xs);}
.stat_arrow       { font-size: var(--fs-m); opacity: 0.7;}
.stat_free_all    { text-align: center; font-size: var(--fs-s); border-radius: var(--gap-m);}

.stat_free_no_data { text-align: center;  color: #757575; font-size: var(--fs-s); border-radius: var(--gap-m);}

.stat_free_count { font-size: var(--fs-text); text-align: right; background: var(--clr-gray-s); padding: var(--gap-xs) var(--gap-s); border-radius: var(--gap-xl);}
.stat_free_list_wrapper { margin-top: var(--gap-s);}
.stat_free_list         { display: flex; flex-wrap: wrap; gap: var(--gap-xs); max-height: 100px; overflow-y: auto;}
.free_aud_item          { display: inline-block; padding: 2px var(--gap-xs); font-size: var(--fs-s); font-family: monospace; color: var(--clr-main-1); transition: all 0.2s ease;hite-space: nowrap; flex-shrink: 0; text-decoration: none; cursor: pointer;}
.free_aud_item:hover    { text-decoration: underline; color: var(--clr-main-3); transform: scale(1.05);}
.stat_free_empty        { text-align: center; padding: var(--gap-m); color: var(--clr-gray-l); font-size: var(--fs-s);}


.stat_building_name       { font-size: var(--fs-m); font-weight: 500; color: var(--clr-main-2); }
.stat_building_name:hover { text-decoration: underline; color: var(--clr-main-3); cursor: pointer;}
.stat_building_id         { font-size: var(--fs-s); color: var(--clr-gray-l);}

.free_auds_search_wrapper                   { background: var(--clr-gray-s); border-radius: var(--gap-m); padding: var(--gap-m); margin-top: var(--gap-l);}
.free_auds_search_wrapper .auds_info        { padding-bottom: 0; border-bottom: none;}
.free_auds_search_wrapper .auds_info form   { display: flex; flex-wrap: wrap; gap: var(--gap-xs); align-items: center;}
.free_auds_search_wrapper .auds_info input[type="text"],
.free_auds_search_wrapper .auds_info select { margin-bottom: var(--gap-xs); margin-top: var(--gap-xs); padding: var(--gap-xs) var(--gap-m); border: 1px solid var(--clr-gray-m); border-radius: var(--gap-s); font-size: var(--fs-m);}

.free_auds_search_wrapper .checkbox_group   { margin-bottom: var(--gap-xs); margin-top: var(--gap-xs);display: flex; flex-wrap: wrap; gap: var(--gap-xs); margin: 0;}
.free_auds_search_wrapper .checkbox_item    { background: var(--clr-white); padding: var(--gap-xs) var(--gap-s); border-radius: var(--gap-s); height: auto;}


.history_no_lessons_today { text-align: center; color: var(--clr-gray-l); font-size: var(--fs-text);}

@media screen and (max-width:1240px){ 

    .ui_tab_labels.main_tabs, .ui_tab_labels.sub_tabs { margin-bottom:var(--gap-m); white-space: wrap; }
    .ui_tab_label_delimiter        { margin: 0;}
    .auds_info .paratime           { display: inline-block;margin-right: var(--gap-micro);cursor: pointer;font-size: var(--fs-s);}
    .date_input input[type="text"] { margin-right: var(--gap-xs);padding: var(--gap-xs) var(--gap-m);font-size: var(--fs-s);border: 1px solid var(--clr-gray-m);border-radius: var(--gap-s);}
    .auds_info input[type="text"]  { padding: var(--gap-xs) var(--gap-m); border: 1px solid var(--clr-gray-m); margin-right: var(--gap-small);border-radius: var(--gap-s); font-size: var(--fs-s);}
    .auds_info select              { padding: var(--gap-xs) var(--gap-m); margin-right: var(--gap-main);border: 1px solid var(--clr-gray-m);border-radius: var(--gap-s);font-size: var(--fs-s); background-color: var(--clr-white);}
    .auds_info form                { display: flex;  flex-wrap: wrap;  justify-content: flex-start;  align-items: center; }
    .checkbox_group                { display: flex; flex-wrap: nowrap; gap: var(--gap-s) var(--gap-s); align-items: center; margin: 0 var(--gap-xs) 0 0; margin: var(--gap-s) 0;}
    .auds_info                     { padding-bottom:var(--gap-xs);  border-bottom:1px solid var(--clr-gray-m); text-align: center;  gap: var(--gap-s);}
}

@media screen and (max-width:1000px) {

    .rasp_list_container { padding:var(--gap-m); } 
    .rasp_grid          { grid-template-columns:repeat(auto-fill, minmax(100px, auto)); gap:var(--gap-xs); } 
    .rasp_block_name    { font-size:var(--fs-m); } 
    .date_suggest       { left:0; right:auto; width:100%; min-width:auto; } 
    .group_link, .teacher_link, .aud_link, .spec_link { padding:var(--gap-xs) var(--gap-m); font-size:var(--fs-s); } 
    .aud_search_form    { white-space: nowrap; font-size: var(--fs-m);} 
    .dd_aud_date        { position: relative;margin-left: var(--gap-xs); display: inline-block;}
    .date_input input[type="text"] { padding: var(--gap-xs) var(--gap-m); font-size: var(--fs-s); border: 1px solid var(--clr-gray-m);  border-radius: var(--gap-s); }
    .search_button      { background-color: var(--clr-main-3); margin-left: 0px; border: none; border-radius: var(--v-icon-size); cursor: pointer; transition: all 0.3s ease; position: relative; flex-shrink: 0;}
    .auds_info .paratime{ padding-top: 3px!important;}
    .checkbox_group     { display: flex; flex-wrap: wrap!important;  gap: var(--gap-s) var(--gap-s);  align-items: center;  margin: var(--gap-s) 0;}
    .checkbox_item      { display: inline-flex;align-items: center; line-height: 1; height: 30px; width: 68px;}
    .rasp_grid.teachers { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, auto)); gap: var(--gap-s); padding: var(--gap-s) var(--gap-m); padding-left: 0;}

    .ui_tab_labels           { flex-wrap:wrap; gap:var(--gap-xs) var(--gap-m); }
    .ui_tab_label            { white-space:nowrap; }
    
    .sub_tabs .ui_tab_label  { margin-bottom:var(--gap-xs); border-radius: 0!important}
    .free_auds_search_form   { font-size: var(--fs-m); }
    
    .main_tabs .ui_tab_label { padding: var(--gap-xs) var(--gap-s); background-color: transparent;color: var(--clr-gray-xl);border-radius: var(--gap-s);cursor: pointer;transition: all 0.2s ease; font-size: var(--fs-m); }
    .auds_info                         { text-align: center; padding-bottom: var(--gap-xs);}
    .auds_info input[type="text"]      { padding: var(--gap-xs) var(--gap-s); margin-bottom: 0;}
    .auds_info select                  { padding: var(--gap-xs) var(--gap-s); margin-bottom: 0;}
    .ui_tab_label.tab_item_gaks        { margin-right: var(--gap-main);}
    .history_grid      { grid-template-columns: 1fr;}
    .stats_grid        { grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: var(--gap-s); }
    .stat_card         { padding: var(--gap-s); }
    .rasp_hero::after  { width: 300px; height: 300px; transform: translateX(13%) translateY(24%); }


}

@media screen and (max-width: 800px) {

    .history_grid { grid-template-columns: 1fr; }
    .history_card { width: 100%;  min-height: unset;  padding: var(--gap-m);  padding-left: calc(10px + var(--gap-m));  gap: var(--gap-s);}
    .history_card:before { width: 4px;}
    .history_card:hover:before { width: 4px;}
    .history_card:after { display: none;}
    .history_card:hover { transform: none;}
    .history_card:hover .history_card_name  { color: var(--clr-black); text-decoration: underline;}
    .history_card:hover .history_card_arrow { transform: translateX(4px);color: var(--clr-main-3);}
    .history_card:hover .history_card_type,
    .history_card:hover .history_card_date  { color: var(--clr-gray-l);}
    .history_card_arrow   { flex: 0 0 auto;  width: var(--fs-xl);  height: var(--fs-xl);  margin-right: var(--gap-xs);  background: var(--src-i-go-white);  background-size: cover;  border: solid 1px var(--clr-black);  border-radius: var(--fs-xl);  content: "";}
    .rasp_hero::after     { width: 250px; height: 250px; transform: translateX(13%) translateY(26%);} 
    .timer_bar_container  {  min-width: auto;  width: 100%;}
  
}


@media screen and (max-width:775px)  { 


    .checkbox-group                             { width: 100%; }

    .auds_info input[type="text"], 
    .auds_info select                           { width:100%; box-sizing:border-box; margin-right: 0!important} 
    .auds_info form                             { gap:var(--gap-s); } 
    .auds_info .paratime                        { display:inline-block; margin-right:var(--gap-m); white-space:nowrap; } 
  
    .week                                       { display:block; width:100%; min-width:auto; overflow-x:auto; } 
    table.rasp_week, table.rasp_drasp           { display:block; overflow-x:auto; -webkit-overflow-scrolling:touch; } 
 
    .rasp_drasp.rasp_free_aud_table td          { padding:var(--gap-s) var(--gap-xs); word-break:break-word; word-spacing:0.15em; } 
    .rasp_drasp.rasp_free_aud_table .rasp_time  { width:70px; font-size:var(--fs-m); }

    .ui_tab_labels                              { flex-wrap:wrap; gap:var(--gap-s) var(--gap-m); }
    .ui_tab_labels.sub_tabs                     { display:flex; flex-wrap:wrap; gap:var(--gap-s) var(--gap-m); }
    .ui_tab_label                               { white-space:nowrap; }
    .ui_tab_label_delimiter                     { display:none; }

    .main_tabs .ui_tab_label                    { padding:var(--gap-xs) var(--gap-s);  background-color: var(--clr-main-1-0);}
    .sub_tabs  .ui_tab_label                     { margin-right:var(--gap-m); margin-bottom:var(--gap-xs);  padding:var(--gap-xs) var(--gap-s); font-size:var(--fs-s); background-color: var(--clr-white);}
    .sub_tabs  .ui_tab_label:last-child          { margin-right:0; }
    
    .free_auds_search_form                      { display: flex; flex-direction: column; align-items: center;  width: 100%;}
    .checkbox_item                              { display: inline-flex; justify-content: flex-start; align-items: center; line-height: 1; }
    .paratime                                   { padding-top: 3px;}
    .free_auds_search_form .search_button       { display: block; margin-top: var(--gap-m)}
    .checkbox_group                             { display: flex;flex-wrap: wrap !important;gap: var(--gap-s) var(--gap-s);align-items: center; margin: var(--gap-xs) 0; }
    .free_auds_search_wrapper .auds_info form { flex-direction: column;}
    .free_auds_search_wrapper .checkbox_group { justify-content: center;}

}

@media screen and (max-width:640px)  { 

    .rasp_list_container            { padding:var(--gap-s); } 
    .rasp_block_header              { padding-left:var(--gap-s); margin-bottom:var(--gap-s); } 
    
    .rasp_grid                      { grid-template-columns:repeat(auto-fill, minmax(85px, auto)); gap:var(--gap-xs); padding-bottom: var(--gap-s);} 
    
    .date_input input[type="text"]  { width:90px; font-size: var(--fs-s); padding:var(--gap-xs) var(--gap-s); } 
    
    .suggest_items                  { padding:var(--gap-xs) 0; } 
    .suggest                        { padding:var(--gap-xs) var(--gap-m); white-space:normal; } 
    .suggest .sg_wday               { width:30px; } 
    .suggest .sg_date a             { font-size: var(--fs-s); } 
    
    .group_link, .teacher_link, .aud_link, .spec_link { padding:var(--gap-xs) var(--gap-s); font-size: var(--fs-s); } 
    table.rasp_week td, table.rasp_drasp td { padding:var(--gap-xs); }

    .ui_tab_labels                  { gap:var(--gap-xs) var(--gap-s); }
    .main_tabs .ui_tab_label        { padding:var(--gap-xs) var(--gap-s); font-size: var(--fs-s); }
    .sub_tabs .ui_tab_label         { margin-right:var(--gap-s); font-size: var(--fs-s);          }
    .free_auds_search_form          { font-size: var(--fs-s); }
    .aud_search_form                { font-size: var(--fs-s); }
    .stats_grid          { grid-template-columns: 1fr; }
    .rasp_hero::after    { width: 250px; height: 250px;transform: translateX(13%) translateY(28%); }
    .date_time           { text-align: center;}
    .stat_free_list      { max-height: 80px; }
    .free_aud_item       { font-size: calc(var(--fs-s) * 0.9);}
    .timer_remaining     { position: static; margin-top: var(--gap-s); text-align: center;}
    .history_lesson_item { gap: var(--gap-xs); cursor: pointer; }
    .timer_bar_wrapper   { gap:3px}
    .timer_ball          { width: 8px; height: 8px }
    .timer_start  		 { min-width: 30px }
    .timer_bar_bg        { height: 2px;}
    .time_value 		 { min-width: 120px; }

}

@media screen and (max-width:480px)  { 

    .rasp_grid                          { grid-template-columns:repeat(auto-fill, minmax(75px, auto)); } 
    .group_link, .teacher_link, .aud_link, .spec_link { padding:var(--gap-xs); font-size: var(--fs-s); } 
    
    .date_input input[type="text"]      { width:80px; font-size: var(--fs-s); } 
    
    .rasp_drasp.rasp_free_aud_table td  { padding:var(--gap-xs); font-size:var(--fs-s); } 
    .rasp_drasp.rasp_free_aud_table .rasp_time { font-size:var(--fs-s); width:60px; } 

    .main_tabs .ui_tab_label            { padding:var(--gap-xs) var(--gap-s); font-size:var(--fs-s); } 

    .ui_tab_labels                      { gap:var(--gap-xs); }
   
    .main_tabs .ui_tab_label            { padding:var(--gap-xs) var(--gap-s); font-size: var(--fs-s); }
    
    .sub_tabs .ui_tab_label             { margin-right:var(--gap-xs); font-size: var(--fs-s); }
    .sub_tabs .ui_tab_label_text        { font-size: var(--fs-s); }
    
    .free_auds_search_form .search_button { display: block;  margin-bottom: 0px; }
    .checkbox_item         { width: 60px;}
    .history_card          { width: 100%;}
    .rasp_hero::after      { width: 230px;height: 230px;transform: translateX(13%) translateY(27%);}
    .timer_bar_container   { min-width: auto; max-width: 280px;}
    .rasp_hero_content     { display: flex; flex-direction: column;justify-content: center; gap: var(--gap-xs);}
    .timer_bar_container   { width: 100%; min-width: 320px; align-items: center}
    .para_timer_widget     { text-align: center;}

    .rasp_hero_content  	{ display: grid; grid-template-columns: 1fr auto; grid-template-rows: auto auto; grid-template-areas:      "left right"     "bottom bottom"; gap: var(--gap-m) var(--gap-l); align-items: center;}
    .hero_left          	{ grid-area: left; display: flex; flex-direction: column; align-items: flex-start; gap: var(--gap-xs);}
    .hero_center        	{ grid-area: right;}
    .hero_right         	{ grid-area: bottom; }
    .hero_date          	{ display: flex; align-items: flex-end; gap: var(--gap-xs);}
    .hero_week          	{ margin-top: 0;}
    .hero_time          	{ text-align: right; }
    .time_value         	{ font-size: calc(var(--fs-xl) * 1.8);  }
    .hero_para_info     	{ width: 100%; margin-top: var(--gap-xs);}
    .para_timer_widget  	{ text-align: center; }
    .timer_bar_container	{ width: 100%; min-width: 100%;}
    .time_value 			{ min-width: 100px; letter-spacing: 1px;}
    .hero_center 			{ min-width: auto; width: auto;}

}    

@media screen and (max-width: 360px) {

  .checkbox_item         { width: 55px; }
  .rasp_hero::after      { width: 250px;height: 250px; transform: translateX(13%) translateY(26%);} 
  .timer_bar_container   { width: 100%; min-width: 150px; align-items: center}
  .date_day              { margin-right: 0;}
  .rasp_hero_content     { gap: var(--gap-xs) var(--gap-main); align-items: center;}
  .hero_left, 			 
  .hero_time, .hero_right { padding: var(--gap-xs) var(--gap-xs); }

}

