#practiceTeacher{position:fixed;right:0;top:38%;z-index:12000;font-family:inherit;color:#dff9f3;text-align:left;line-height:1.6}
#practiceTeacher[hidden],#practiceTeacher [hidden]{display:none!important}
#practiceTeacher *{box-sizing:border-box}
#practiceTeacher button,#practiceTeacher textarea{font:inherit}
#practiceTeacher button{cursor:pointer}
#practiceTeacher .pt-tab{display:flex;align-items:center;justify-content:center;gap:10px;writing-mode:vertical-rl;text-orientation:upright;letter-spacing:2px;width:46px;min-height:124px;border:1px solid #6ad9c677;border-right:0;border-radius:15px 0 0 15px;padding:14px 10px;background:#163c39f5;color:#b7f3df;box-shadow:0 6px 26px #0003;font-weight:700}
#practiceTeacher .pt-tab span{display:grid;place-items:center;writing-mode:horizontal-tb;letter-spacing:0;flex-shrink:0;width:23px;height:23px;border:1px solid #99e6cf80;border-radius:50%;font-size:14px}
#practiceTeacher .pt-panel{position:fixed;right:18px;top:50%;transform:translate(calc(100% + 24px),-50%);opacity:0;visibility:hidden;pointer-events:none;transition:transform 340ms cubic-bezier(.22,1,.36,1),opacity 240ms ease,visibility 0s 340ms;width:370px;max-width:calc(100vw - 28px);height:580px;max-height:calc(100dvh - 32px);display:flex;flex-direction:column;background:#162329fa;border:1px solid #78cdb94d;border-radius:22px;box-shadow:0 20px 70px #0007;overflow:hidden}
#practiceTeacher[data-open="true"] .pt-panel{transform:translate(0,-50%);opacity:1;visibility:visible;pointer-events:auto;transition-delay:0s}
#practiceTeacher .pt-tab{transition:transform 200ms ease,opacity 180ms ease;transform:translateX(0);opacity:1}
#practiceTeacher[data-open="true"] .pt-tab{transform:translateX(12px);opacity:0;pointer-events:none;visibility:hidden}
#practiceTeacher header{display:flex;justify-content:space-between;align-items:center;padding:19px 20px 15px;background:linear-gradient(120deg,#204b45,#293831)}
#practiceTeacher header strong{font-size:21px;color:#eafbed}
#practiceTeacher small{display:block;font-size:11px;color:#9ab6b3}
#practiceTeacher header small{margin-top:3px}
#practiceTeacher .pt-close{background:transparent;color:#c6e5df;border:1px solid #b2ded52e;border-radius:50%;width:31px;height:31px;font-size:23px;line-height:1}
#practiceTeacher .pt-context{padding:12px 20px;border-bottom:1px solid #8cb7b022;background:#b9e8d807;max-height:125px;overflow:auto}
#practiceTeacher p{margin:3px 0}
#practiceTeacher .pt-en{font-weight:650;font-size:14px;color:#b0eedf}
#practiceTeacher .pt-zh{font-size:12px;color:#acbebd}
#practiceTeacher .pt-messages{flex:1;min-height:80px;overflow:auto;overscroll-behavior:contain;padding:17px;display:flex;flex-direction:column;gap:12px}
#practiceTeacher .pt-message{font-size:14px;padding:11px 13px;border-radius:13px;white-space:pre-wrap;overflow-wrap:anywhere;flex-shrink:0;max-width:95%;line-height:1.8}
#practiceTeacher .pt-assistant{background:#ffffff09;border:1px solid #ffffff0d;align-self:flex-start}
#practiceTeacher .pt-user{background:#275d54;color:#e4fff7;align-self:flex-end}
#practiceTeacher form{padding:13px 17px 15px;border-top:1px solid #8cb7b022}
#practiceTeacher label{display:block;font-size:12px;color:#bdd4cd;margin-bottom:7px}
#practiceTeacher textarea{display:block;width:100%;resize:none;border:1px solid #609e924d;border-radius:11px;padding:10px;background:#0e1a1e;color:#f0fffa;outline:none;font-size:14px}
#practiceTeacher textarea:focus{border-color:#5ddac3}
#practiceTeacher footer{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:9px}
#practiceTeacher footer small{font-size:10px}
#practiceTeacher .pt-send{border:0;border-radius:10px;background:linear-gradient(100deg,#8de1cf,#e3e69f);color:#123c36;font-size:13px;font-weight:700;padding:8px 15px}
#practiceTeacher .pt-send:disabled{opacity:.5;cursor:wait}
#practiceTeacher .pt-status{color:#f3dca0;font-size:12px;margin-top:5px;max-height:48px;overflow:auto}
#practiceTeacher button:focus-visible{outline:2px solid #9ae7d6;outline-offset:3px}
@media(max-width:600px){#practiceTeacher{top:27%}#practiceTeacher .pt-tab{width:40px;min-height:94px;font-size:13px;padding:12px 8px}#practiceTeacher .pt-tab span{display:none}#practiceTeacher .pt-panel{right:14px}}
@media(prefers-reduced-motion:reduce){#practiceTeacher .pt-panel,#practiceTeacher .pt-tab{transition:none}}

/* Keep the vertical label and its icon inside the narrow viewport tab. */
#practiceTeacher .pt-tab {
  writing-mode: horizontal-tb;
  flex-direction: column;
  gap: 8px;
  flex-shrink: 0;
  padding: 12px 8px;
}
#practiceTeacher .pt-tab .pt-tab-label {
  display: block;
  writing-mode: vertical-rl;
  text-orientation: upright;
  letter-spacing: 2px;
  width: auto;
  height: auto;
  border: 0;
  border-radius: 0;
  font-size: inherit;
  line-height: 1.4;
}
@media(max-width:600px) {
  #practiceTeacher .pt-tab { padding: 12px 8px; }
  #practiceTeacher .pt-tab .pt-tab-icon { display: none; }
}
