.filters{display:flex; gap:12px; flex-wrap:wrap;}
.f-search{flex:1; min-width:240px; background:var(--panel); border:1px solid var(--line); border-radius:11px;
  padding:12px 15px; color:var(--text); font-family:var(--body); font-size:15px;}
.f-search:focus{outline:none; border-color:var(--teal);}
.filters select{background:var(--panel); border:1px solid var(--line); border-radius:11px; padding:12px 14px;
  color:var(--text); font-family:var(--body); font-size:14px; cursor:pointer;}

.teach-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.teacher{display:flex; flex-direction:column;}
.th-top{display:flex; gap:14px; align-items:center; margin-bottom:14px;}
.th-av{width:58px; height:58px; border-radius:14px; background:var(--panel-2); border:1px solid var(--line);
  display:flex; align-items:center; justify-content:center; font-family:var(--display); font-weight:800; font-size:20px; color:var(--teal); flex-shrink:0;}
.th-name{font-weight:600; font-size:17px;} .th-title{font-size:13px; color:var(--muted); font-family:var(--mono);}
.th-bio{color:var(--muted); font-size:14px; margin:0 0 14px; flex:1;}
.th-meta{display:flex; gap:6px; flex-wrap:wrap; margin-bottom:14px;}
.th-foot{display:flex; justify-content:space-between; align-items:center; padding-top:14px; border-top:1px solid var(--line-soft);}
.th-price{font-family:var(--mono); font-weight:700; font-size:18px;} .th-price i{font-style:normal; font-size:12px; color:var(--muted); font-weight:500;}
.th-rate{font-family:var(--mono); color:var(--gold); font-weight:700; font-size:14px;}
.th-langs{font-size:11px; color:var(--muted-2); font-family:var(--mono); margin-top:2px;}

.room{display:grid; grid-template-columns:1fr 340px; gap:20px; padding:20px;}
.room-tools{display:flex; gap:8px; margin-top:12px;}
.rtool{flex:1; background:var(--ink-2); border:1px solid var(--line); color:var(--muted); border-radius:9px; padding:9px; font-size:13px; cursor:pointer; font-family:var(--body);}
.rtool:hover{border-color:var(--teal); color:var(--teal);}
.room-side{display:flex; flex-direction:column; gap:14px;}
.video-tile{position:relative; height:180px; border-radius:14px; border:1px solid var(--line);
  background:linear-gradient(150deg,var(--panel-2),var(--ink-2)); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px;}
.vt-av{width:64px; height:64px; border-radius:50%; background:var(--teal-deep); display:flex; align-items:center; justify-content:center;
  font-family:var(--display); font-weight:800; font-size:22px; color:#04222a;}
.video-tile .mono{font-size:13px; color:var(--muted);}

.cta-teach{display:flex; justify-content:space-between; align-items:center; gap:24px; background:var(--panel);
  border:1px solid var(--line); border-radius:20px; padding:36px 40px; flex-wrap:wrap;
  background-image:radial-gradient(circle at 100% 0%,rgba(231,180,74,.12),transparent 55%);}
.cta-teach h2{font-size:clamp(24px,3vw,34px); margin-bottom:6px;}

.toast{position:fixed; bottom:28px; left:50%; transform:translateX(-50%) translateY(120px); background:var(--teal);
  color:#04222a; font-weight:600; padding:13px 22px; border-radius:12px; box-shadow:var(--shadow); z-index:300; transition:.35s; opacity:0;}
.toast.show{transform:translateX(-50%) translateY(0); opacity:1;}

@media(max-width:960px){ .teach-grid{grid-template-columns:1fr 1fr;} .room{grid-template-columns:1fr;} }
@media(max-width:600px){ .teach-grid{grid-template-columns:1fr;} .cta-teach{flex-direction:column; align-items:flex-start;} }
