.ep-mobile-answer-viewer[hidden] {
display: none !important;
}
.ep-mobile-answer-viewer {
display: none;
}
@media (max-width: 782px) {
html.ep-mobile-answer-viewer-open,
body.ep-mobile-answer-viewer-open {
overflow: hidden !important;
overscroll-behavior: none;
}
.ep-mobile-answer-viewer {
position: fixed;
inset: 0;
z-index: 2147483000;
display: block;
width: 100vw;
height: 100vh;
height: 100dvh;
background: #f5f8ff;
color: #111827;
font-family: inherit;
opacity: 0;
visibility: hidden;
pointer-events: none;
transform: translateY(12px);
transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
}
.ep-mobile-answer-viewer.is-open {
opacity: 1;
visibility: visible;
pointer-events: auto;
transform: translateY(0);
}
.ep-mobile-answer-viewer__shell {
display: flex;
flex-direction: column;
width: 100%;
height: 100%;
min-height: 0;
background:
radial-gradient(circle at 0 0, rgba(37, 99, 235, 0.1), transparent 34%),
radial-gradient(circle at 100% 0, rgba(124, 58, 237, 0.09), transparent 38%),
#f8faff;
}
.ep-mobile-answer-viewer__header {
position: relative;
z-index: 3;
display: flex;
flex: 0 0 auto;
align-items: center;
justify-content: space-between;
gap: 12px;
min-height: 62px;
padding: calc(10px + env(safe-area-inset-top, 0px)) 14px 10px;
background: rgba(255, 255, 255, 0.96);
border-bottom: 1px solid rgba(148, 163, 184, 0.35);
box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
}
.ep-mobile-answer-viewer__heading {
min-width: 0;
}
.ep-mobile-answer-viewer__eyebrow {
display: block;
margin-bottom: 2px;
color: #2563eb;
font-size: 10px;
font-weight: 800;
letter-spacing: 0.12em;
line-height: 1.2;
}
.ep-mobile-answer-viewer__title {
margin: 0 !important;
color: #111827 !important;
font-size: clamp(18px, 5vw, 22px) !important;
font-weight: 800 !important;
line-height: 1.2 !important;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ep-mobile-answer-viewer__close {
display: inline-flex;
flex: 0 0 44px;
align-items: center;
justify-content: center;
width: 44px;
height: 44px;
margin: 0;
padding: 0;
border: 1px solid #d6deed;
border-radius: 14px;
background: #fff;
color: #0f4c81;
font: 400 34px/1 Arial, sans-serif;
box-shadow: 0 5px 16px rgba(15, 23, 42, 0.08);
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
.ep-mobile-answer-viewer__close:focus-visible,
.ep-mobile-answer-viewer__action:focus-visible,
.ep-mobile-answer-reopen:focus-visible {
outline: 3px solid rgba(37, 99, 235, 0.35);
outline-offset: 2px;
}
.ep-mobile-answer-viewer__question {
flex: 0 0 auto;
margin: 10px 12px 0;
padding: 10px 12px;
border: 1px solid #dbe5f5;
border-radius: 14px;
background: rgba(255, 255, 255, 0.9);
box-shadow: 0 4px 15px rgba(15, 23, 42, 0.05);
}
.ep-mobile-answer-viewer__question-label {
display: block;
margin-bottom: 3px;
color: #2563eb;
font-size: 11px;
font-weight: 800;
letter-spacing: 0.04em;
text-transform: uppercase;
}
.ep-mobile-answer-viewer__question-text {
display: -webkit-box;
margin: 0 !important;
overflow: hidden;
color: #334155 !important;
font-size: 13px !important;
font-weight: 600;
line-height: 1.4 !important;
overflow-wrap: anywhere;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.ep-mobile-answer-viewer__content {
position: relative;
flex: 1 1 auto;
min-height: 0;
width: 100%;
padding: 12px 12px 18px;
overflow-x: hidden;
overflow-y: auto;
scroll-behavior: smooth;
overscroll-behavior: contain;
-webkit-overflow-scrolling: touch;
}
.ep-mobile-answer-viewer__content > .ep-mobile-answer-source--fullscreen,
.ep-mobile-answer-viewer__content > .ai-study-output-pane,
.ep-mobile-answer-viewer__content > [data-ai-study-tool-output],
.ep-mobile-answer-viewer__content > [data-ai-study-answer-output],
.ep-mobile-answer-viewer__content > [data-ep-math-output] {
display: block !important;
box-sizing: border-box !important;
width: 100% !important;
max-width: 100% !important;
min-width: 0 !important;
height: auto !important;
min-height: 0 !important;
max-height: none !important;
margin: 0 !important;
padding: 14px !important;
overflow: visible !important;
resize: none !important;
border: 1px solid #dfe7f4 !important;
border-radius: 18px !important;
background: #fff !important;
color: #172033 !important;
box-shadow: 0 8px 26px rgba(15, 23, 42, 0.08) !important;
line-height: 1.68 !important;
word-break: normal !important;
overflow-wrap: anywhere !important;
-webkit-mask-image: none !important;
mask-image: none !important;
}
.ep-mobile-answer-viewer__content .ai-study-output-block,
.ep-mobile-answer-viewer__content .ai-study-learn-block,
.ep-mobile-answer-viewer__content .ai-study-advanced-output,
.ep-mobile-answer-viewer__content .ai-study-answer-card,
.ep-mobile-answer-viewer__content .ai-study-speaking-correction,
.ep-mobile-answer-viewer__content .ai-study-speaking-practice-pack {
max-width: 100% !important;
margin-right: 0 !important;
margin-left: 0 !important;
}
.ep-mobile-answer-viewer__content h1,
.ep-mobile-answer-viewer__content h2,
.ep-mobile-answer-viewer__content h3,
.ep-mobile-answer-viewer__content h4 {
max-width: 100%;
color: #111827 !important;
overflow-wrap: anywhere;
}
.ep-mobile-answer-viewer__content h1,
.ep-mobile-answer-viewer__content h2 {
font-size: clamp(24px, 8vw, 34px) !important;
line-height: 1.18 !important;
}
.ep-mobile-answer-viewer__content h3 {
font-size: clamp(20px, 6vw, 27px) !important;
line-height: 1.24 !important;
}
.ep-mobile-answer-viewer__content h4 {
font-size: clamp(17px, 5vw, 21px) !important;
}
.ep-mobile-answer-viewer__content p,
.ep-mobile-answer-viewer__content li,
.ep-mobile-answer-viewer__content td,
.ep-mobile-answer-viewer__content th {
color: #263247 !important;
font-size: 16px !important;
line-height: 1.68 !important;
}
.ep-mobile-answer-viewer__content img,
.ep-mobile-answer-viewer__content video,
.ep-mobile-answer-viewer__content canvas,
.ep-mobile-answer-viewer__content svg {
max-width: 100% !important;
height: auto;
}
.ep-mobile-answer-viewer__content table {
display: block;
max-width: 100%;
overflow-x: auto;
border-collapse: collapse;
-webkit-overflow-scrolling: touch;
}
.ep-mobile-answer-viewer__content pre,
.ep-mobile-answer-viewer__content code {
max-width: 100%;
white-space: pre-wrap;
word-break: break-word;
}
.ep-mobile-answer-viewer__status {
position: absolute !important;
width: 1px !important;
height: 1px !important;
margin: -1px !important;
padding: 0 !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
border: 0 !important;
white-space: nowrap !important;
}
.ep-mobile-answer-viewer__actions {
position: relative;
z-index: 3;
display: grid;
flex: 0 0 auto;
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 8px;
padding: 10px 10px calc(10px + env(safe-area-inset-bottom, 0px));
background: rgba(255, 255, 255, 0.97);
border-top: 1px solid rgba(148, 163, 184, 0.35);
box-shadow: 0 -10px 28px rgba(15, 23, 42, 0.09);
backdrop-filter: blur(16px);
-webkit-backdrop-filter: blur(16px);
}
.ep-mobile-answer-viewer__action {
display: inline-flex;
min-width: 0;
min-height: 48px;
align-items: center;
justify-content: center;
gap: 6px;
margin: 0;
padding: 8px 6px;
border: 1px solid #d8e1ef;
border-radius: 13px;
background: #fff;
color: #174ea6;
font-family: inherit;
font-size: 12px;
font-weight: 800;
line-height: 1.15;
text-align: center;
box-shadow: 0 4px 12px rgba(15, 23, 42, 0.05);
cursor: pointer;
-webkit-tap-highlight-color: transparent;
}
.ep-mobile-answer-viewer__action:hover,
.ep-mobile-answer-viewer__action:active,
.ep-mobile-answer-viewer__action.is-active {
border-color: transparent;
background: linear-gradient(135deg, #2563eb, #7c3aed);
color: #fff;
}
.ep-mobile-answer-viewer__action[hidden] {
display: none !important;
}
.ep-mobile-answer-viewer__action:disabled {
opacity: 0.55;
cursor: wait;
}
.ep-mobile-answer-viewer__action-icon {
flex: 0 0 auto;
font-size: 15px;
font-weight: 900;
line-height: 1;
}
.ep-mobile-answer-viewer__action-label {
min-width: 0;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}
.ep-mobile-answer-source-placeholder {
display: none !important;
}
.ep-mobile-answer-source--minimized {
position: relative !important;
box-sizing: border-box !important;
min-height: 110px !important;
max-height: 150px !important;
overflow: hidden !important;
resize: none !important;
border-bottom-right-radius: 0 !important;
border-bottom-left-radius: 0 !important;
-webkit-mask-image: linear-gradient(to bottom, #000 0, #000 68%, transparent 100%) !important;
mask-image: linear-gradient(to bottom, #000 0, #000 68%, transparent 100%) !important;
}
.ep-mobile-answer-compact-bar {
display: flex;
box-sizing: border-box;
width: 100%;
max-width: 100%;
align-items: center;
justify-content: space-between;
gap: 10px;
margin: -1px 0 14px;
padding: 9px 10px;
border: 1px solid #d8e3f3;
border-top: 0;
border-radius: 0 0 14px 14px;
background: #f8fbff;
box-shadow: 0 7px 18px rgba(15, 23, 42, 0.06);
}
.ep-mobile-answer-compact-bar__text {
min-width: 0;
color: #475569;
font-size: 11px;
font-weight: 700;
line-height: 1.25;
}
.ep-mobile-answer-reopen {
flex: 0 0 auto;
min-height: 38px;
margin: 0;
padding: 8px 12px;
border: 0;
border-radius: 11px;
background: linear-gradient(135deg, #2563eb, #7c3aed);
color: #fff;
font-family: inherit;
font-size: 11px;
font-weight: 800;
line-height: 1.15;
white-space: nowrap;
box-shadow: 0 6px 14px rgba(79, 70, 229, 0.22);
cursor: pointer;
}
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__shell {
background: #090f1d;
}
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__header,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__actions {
background: rgba(12, 18, 32, 0.97);
border-color: rgba(100, 116, 139, 0.45);
}
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__title,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content h1,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content h2,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content h3,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content h4 {
color: #f8fafc !important;
}
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__question,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content > .ep-mobile-answer-source--fullscreen,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__action {
border-color: #334155 !important;
background: #111827 !important;
color: #e2e8f0 !important;
}
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__question-text,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content p,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content li,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content td,
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__content th {
color: #dbeafe !important;
}
.ep-mobile-answer-viewer.is-dark .ep-mobile-answer-viewer__close {
border-color: #334155;
background: #111827;
color: #93c5fd;
}
}
@media (max-width: 360px) {
.ep-mobile-answer-viewer__header {
min-height: 56px;
padding-right: 10px;
padding-left: 10px;
}
.ep-mobile-answer-viewer__question {
margin-right: 8px;
margin-left: 8px;
}
.ep-mobile-answer-viewer__content {
padding-right: 8px;
padding-left: 8px;
}
.ep-mobile-answer-viewer__status {
position: absolute !important;
width: 1px !important;
height: 1px !important;
margin: -1px !important;
padding: 0 !important;
overflow: hidden !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
border: 0 !important;
white-space: nowrap !important;
}
.ep-mobile-answer-viewer__actions {
gap: 6px;
padding-right: 7px;
padding-left: 7px;
}
.ep-mobile-answer-viewer__action {
min-height: 45px;
padding-right: 4px;
padding-left: 4px;
font-size: 10.5px;
}
.ep-mobile-answer-viewer__action-icon {
font-size: 13px;
}
}
@media (prefers-reduced-motion: reduce) {
.ep-mobile-answer-viewer,
.ep-mobile-answer-viewer *,
.ep-mobile-answer-reopen {
scroll-behavior: auto !important;
transition: none !important;
animation: none !important;
}
}.ep-answer-avatar-launchbar{
display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;
padding:9px 10px;border-top:1px solid #dbe7ff;border-bottom:1px solid #dbe7ff;
background:linear-gradient(135deg,#f7fbff,#eef9ff);color:#17233a;
}
.ep-answer-avatar-launchbar__copy{display:flex;align-items:center;gap:9px;min-width:0}
.ep-answer-avatar-launchbar__icon{width:34px;height:34px;border-radius:12px;display:grid;place-items:center;background:#fff;border:1px solid #d7e4ff;box-shadow:0 7px 16px rgba(15,23,42,.08);flex:0 0 34px}
.ep-answer-avatar-launchbar__copy div{display:grid;min-width:0;line-height:1.18}
.ep-answer-avatar-launchbar__copy strong{font-size:13px;color:#17233a}
.ep-answer-avatar-launchbar__copy small{font-size:10px;color:#5b6b82;white-space:normal}
.ep-answer-avatar-launchbar button{min-height:38px;border:0;border-radius:999px;padding:8px 14px;background:linear-gradient(135deg,#6554ef,#0eb9cd);color:#fff;font-weight:900;font-size:12px;box-shadow:0 8px 20px rgba(84,76,232,.24);cursor:pointer}
.ep-answer-avatar-launchbar button:disabled{cursor:wait;opacity:.68;box-shadow:none}
.ep-answer-avatar-launchbar[data-state="ready"]{background:linear-gradient(135deg,#f2fff8,#eef8ff)}
.ep-answer-avatar-launchbar[data-state="error"] button{background:linear-gradient(135deg,#ef4444,#f97316)}
.ep-mobile-answer-viewer .ai-study-live-agent-sync-bar{display:none!important}
.ep-answer-avatar-overlay{position:fixed;inset:0;z-index:2147483600;background:#edf4ff;color:#111827;overflow:hidden}
.ep-answer-avatar-overlay[hidden]{display:none!important}
.ep-answer-avatar-overlay__shell{height:100dvh;max-height:100dvh;display:grid;grid-template-rows:auto auto minmax(0,1fr) auto auto;background:linear-gradient(180deg,#f6f9ff 0,#edf4ff 100%)}
.ep-answer-avatar-overlay__header{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:max(10px,env(safe-area-inset-top)) 12px 10px;border-bottom:1px solid #d7e3f8;background:rgba(255,255,255,.96);backdrop-filter:blur(14px)}
.ep-answer-avatar-overlay__header>div{min-width:0;display:grid;gap:2px}
.ep-answer-avatar-overlay__eyebrow{font-size:9px;letter-spacing:.12em;color:#2563eb;font-weight:950}
.ep-answer-avatar-overlay__header h2{margin:0;color:#111827;font-size:19px;line-height:1.05}
.ep-answer-avatar-overlay__topic{display:block;max-width:76vw;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#52637c;font-size:11px;font-weight:800}
.ep-answer-avatar-overlay__close{width:44px;height:44px;border-radius:14px;border:1px solid #d7e4f8;background:#fff;color:#0b64ad;font-size:29px;line-height:1;display:grid;place-items:center;box-shadow:0 8px 18px rgba(15,23,42,.08);cursor:pointer;flex:0 0 44px}
.ep-answer-avatar-overlay__notice{min-height:28px;padding:6px 12px;background:#ecf8ff;border-bottom:1px solid #d6ecfb;color:#31536d;font-size:11px;font-weight:800;text-align:center}
.ep-answer-avatar-overlay__body{min-height:0;overflow:auto;padding:8px 8px 3px;overscroll-behavior:contain}
.ep-answer-avatar-overlay__widget{min-height:100%}
.ep-answer-avatar-overlay__widget>.ai-live-avatar-tutor{margin:0!important;max-width:none!important;width:100%!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-shell{border-radius:20px!important;border:1px solid #d8e5fb!important;box-shadow:0 14px 38px rgba(15,23,42,.12)!important;overflow:hidden!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-headbar{display:none!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-main{grid-template-columns:1fr!important;padding:10px!important;gap:10px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-stage{min-height:245px!important;padding:10px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-video{width:min(220px,72vw)!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-status{font-size:12px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-subtitle{font-size:13px!important;line-height:1.35!important;max-height:82px;overflow:auto}
.ep-answer-avatar-overlay__widget .ai-live-avatar-control-panel{gap:9px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-row,
.ep-answer-avatar-overlay__widget .ai-live-avatar-topic-coach,
.ep-answer-avatar-overlay__widget .ai-live-avatar-magic-panel,
.ep-answer-avatar-overlay__widget .ai-live-avatar-learning-dashboard,
.ep-answer-avatar-overlay__widget .ai-live-avatar-correction,
.ep-answer-avatar-overlay__widget .ai-live-teacher-next{display:none!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-transcript{height:auto!important;min-height:110px!important;max-height:180px!important;padding:9px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-compose{gap:8px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-compose textarea{min-height:58px!important;max-height:95px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-actions{gap:7px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-actions button{min-height:42px!important;padding:9px 10px!important;font-size:12px!important;flex:1 1 calc(50% - 7px)!important}
.ep-answer-avatar-overlay__widget [data-ai-live-avatar-sync-last],
.ep-answer-avatar-overlay__widget [data-ai-live-avatar-float],
.ep-answer-avatar-overlay__widget [data-ai-live-avatar-minimize]{display:none!important}
.ep-answer-avatar-overlay__quick{display:flex;gap:7px;overflow-x:auto;padding:7px 9px;border-top:1px solid #d8e5f8;background:#f7faff;scrollbar-width:none}
.ep-answer-avatar-overlay__quick::-webkit-scrollbar{display:none}
.ep-answer-avatar-overlay__quick button{flex:0 0 auto;min-height:37px;border:1px solid #cfe0ff;border-radius:999px;background:#fff;color:#1d4ed8;padding:7px 12px;font-size:11px;font-weight:900;cursor:pointer}
.ep-answer-avatar-overlay__dock{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:8px 8px max(8px,env(safe-area-inset-bottom));border-top:1px solid #d6e2f6;background:rgba(255,255,255,.98);box-shadow:0 -10px 26px rgba(15,23,42,.08)}
.ep-answer-avatar-overlay__dock button{min-height:43px;border:1px solid #d9e3f3;border-radius:13px;background:#fff;color:#24354d;font-size:10px;font-weight:900;display:flex;align-items:center;justify-content:center;gap:4px;padding:5px;cursor:pointer}
.ep-answer-avatar-overlay__dock button.is-primary{background:linear-gradient(135deg,#2563eb,#7042ee);color:#fff;border:0}
.ep-answer-avatar-overlay__dock button.is-danger{color:#b91c1c;border-color:#fecaca;background:#fff7f7}
html.ep-answer-avatar-open,body.ep-answer-avatar-open{overflow:hidden!important;overscroll-behavior:none}
.ep-answer-avatar-overlay.is-dark,.ep-mobile-answer-viewer.is-dark~.ep-answer-avatar-overlay{background:#07111f;color:#e5edf9}
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__shell{background:linear-gradient(180deg,#0b1625,#07111f)}
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__header,
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__dock,
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__quick{background:#101b2a;border-color:#26364c;color:#e5edf9}
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__header h2{color:#fff}
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__topic{color:#bac7da}
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__notice{background:#102638;color:#cde8ff;border-color:#28435d}
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__quick button,
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__dock button,
.ep-answer-avatar-overlay.is-dark .ep-answer-avatar-overlay__close{background:#172436;color:#e5edf9;border-color:#30425b}
@media (max-width:420px){
.ep-answer-avatar-launchbar{grid-template-columns:1fr;padding:8px}
.ep-answer-avatar-launchbar button{width:100%}
.ep-answer-avatar-overlay__body{padding:6px 5px 2px}
.ep-answer-avatar-overlay__widget .ai-live-avatar-main{padding:7px!important}
.ep-answer-avatar-overlay__widget .ai-live-avatar-stage{min-height:220px!important}
.ep-answer-avatar-overlay__dock{gap:5px;padding-left:5px;padding-right:5px}
.ep-answer-avatar-overlay__dock button{font-size:9px;min-height:41px}
}
@media (min-width:783px){
.ep-answer-avatar-launchbar,.ep-answer-avatar-overlay{display:none!important}
}
@media (prefers-reduced-motion:reduce){
.ep-answer-avatar-launchbar button,.ep-answer-avatar-overlay *{scroll-behavior:auto!important;animation:none!important;transition:none!important}
}