#interview .iv-shell{max-width:1450px;margin:auto}#interview [hidden]{display:none!important}#interview h2{font-size:clamp(1.4rem,2.5vw,2rem);line-height:1.5}#interview h3{line-height:1.5}#interview p{line-height:1.8}#interview button{min-height:44px;white-space:normal}#interview input,#interview select,#interview textarea{width:100%;box-sizing:border-box;margin-top:6px}#interview textarea{min-height:160px;resize:vertical;line-height:1.8;padding:14px}#interview label{display:block;font-size:.9rem;font-weight:600}#interview .iv-top{display:flex;justify-content:space-between;align-items:center;gap:24px}#interview .iv-search{width:min(360px,100%)}#interview .iv-tabs{display:flex;gap:8px;overflow-x:auto;padding:12px 0;border-bottom:1px solid var(--line)}#interview .iv-tabs button{flex:0 0 auto}#interview .iv-tabs [aria-pressed=true]{background:var(--accent);color:white;border-color:var(--accent)}#interview .iv-meta{font-size:.75rem;letter-spacing:normal;font-weight:700;color:var(--muted);display:flex;flex-wrap:wrap;gap:12px;align-items:center}#interview .iv-hero{background:var(--panel);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:18px;padding:28px;display:flex;justify-content:space-between;align-items:center;gap:24px}#interview .iv-hero-mark{font-size:64px;font-weight:700;color:var(--accent);text-align:center;padding:20px}#interview .iv-hero-mark span{display:block;font-size:11px;letter-spacing:normal}#interview .iv-packs{display:flex;flex-wrap:wrap;gap:10px;margin:22px 0}#interview .iv-filters{display:grid;grid-template-columns:repeat(4,minmax(0,1fr)) auto;gap:12px;align-items:end}#interview .iv-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}#interview .card{padding:22px;min-width:0;margin:0 0 16px;overflow-wrap:anywhere}#interview .iv-grid .card{margin:0}#interview .iv-link{font:inherit;font-weight:700;border:none;background:none;color:inherit;padding:0;text-align:left}#interview .iv-link:hover{color:var(--accent);text-decoration:underline}#interview .iv-badge{font-size:11px;padding:4px 8px;border:1px solid var(--line);border-radius:6px}#interview .iv-columns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}#interview .iv-detail{margin-top:24px}#interview .iv-answer{font-size:1.2rem;line-height:1.9!important}#interview .iv-thai,#interview .iv-notice{padding:16px;border-left:3px solid var(--accent);background:var(--soft);border-radius:6px;line-height:1.8}#interview .iv-highlight{text-decoration:underline;text-decoration-style:dotted;text-underline-offset:5px;font-weight:600}#interview .iv-question-thai{font-size:1.1rem;color:var(--muted)}#interview details{margin-top:20px}#interview summary{cursor:pointer;min-height:44px;display:list-item;font-weight:600}#interview .iv-breakdown{border-bottom:1px solid var(--line);padding:12px 0}#interview .iv-score-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:20px 0}#interview .iv-score-grid>div{border:1px solid var(--line);border-radius:10px;padding:16px;display:grid;gap:8px}#interview .iv-score-grid strong{font-size:1.6rem;color:var(--accent)}#interview .iv-metrics{grid-template-columns:repeat(3,1fr);margin:24px 0}#interview .iv-metrics .card{display:grid;gap:8px}#interview .iv-metrics strong{font-size:2rem;color:var(--accent)}#interview progress{width:100%;height:14px;accent-color:var(--accent)}#interview .iv-error{color:#b42318;background:#fff1f0;padding:12px;border-radius:8px}#interview .iv-preserve{white-space:pre-wrap}#interview .iv-pause{text-align:center;color:var(--muted);padding:48px}#interview .actions{margin-top:14px;flex-wrap:wrap}#interview :focus-visible{outline:3px solid var(--accent);outline-offset:3px}#iv-status:empty{display:none}.dark #interview .iv-error{color:#ffb4ab;background:#3c1717}@media(max-width:1100px){#interview .iv-columns{grid-template-columns:1fr}#interview .iv-filters{grid-template-columns:1fr 1fr}#interview .iv-filters>button{grid-column:span 2}}@media(max-width:640px){#interview .iv-top{display:block}#interview .iv-search{width:100%}#interview .iv-grid{grid-template-columns:1fr}#interview .iv-hero{padding:20px}#interview .iv-hero-mark{display:none}#interview .iv-metrics,#interview .iv-score-grid{grid-template-columns:1fr 1fr}#interview .iv-meta{font-size:.7rem}#interview .card{padding:18px}#interview .iv-tabs{margin-right:-8px}#interview .iv-packs button{flex:1 1 100%}#interview .iv-filters label{font-size:.8rem}}
main.page:has(#interview:not([hidden])){min-width:0;margin:0 auto}#interview,#interview .iv-shell,#interview .iv-top>div{min-width:0}#interview .iv-top{flex-wrap:wrap}body.dark #interview .iv-tabs [aria-pressed=true]{background:#515ed1;color:white}
.speaking-modes{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:20px}.speaking-modes button{min-height:44px;flex:1}.speaking-modes [aria-pressed=true]{background:var(--accent);color:var(--bg)}
#interview-practice{min-width:0;max-width:100%;padding-bottom:calc(24px + env(safe-area-inset-bottom,0px))}#interview-practice [hidden]{display:none!important}.ip-panel{max-width:900px;min-width:0;overflow-wrap:anywhere}.ip-toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.ip-toolbar select{flex:1;min-width:0;width:auto;max-width:100%}.ip-question{font-size:clamp(1.5rem,4vw,2rem);line-height:1.5;margin:8px 0 12px}.ip-controls button{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px}.ip-controls button svg{flex-shrink:0}.ip-panel details{margin:20px 0;padding:16px;border:1px solid var(--line);border-radius:12px}.ip-panel summary,.ip-library summary{cursor:pointer;color:var(--accent);min-height:44px;align-content:center}.ip-answer p,#ip-transcript,.ip-library p{white-space:pre-line;overflow-wrap:anywhere}.ip-answer+.ip-answer{border-top:1px solid var(--line);margin-top:16px;padding-top:8px}.ip-navigation{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:12px;align-items:center;border-top:1px solid var(--line);padding-top:20px}.ip-navigation button{min-width:0;min-height:44px;white-space:normal}.ip-navigation span{text-align:center}.ip-privacy{font-size:.875rem;margin-top:20px}.ip-library{margin-top:20px;max-width:900px;min-width:0}.ip-library select,.ip-panel audio{max-width:100%;width:100%}.ip-panel button:focus-visible,.ip-panel summary:focus-visible,.speaking-modes button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}#ip-status[data-state=listening]{color:var(--accent);font-weight:600}#ip-status[data-state=listening]::before{content:'';display:inline-block;width:8px;height:8px;border-radius:50%;background:currentColor;margin-right:8px}#ip-status[data-state=error]{color:var(--red,#d04444)}
@media(max-width:480px){.ip-toolbar{gap:8px}.ip-toolbar label{flex-basis:100%}.ip-controls{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}.ip-controls #ip-record{grid-column:1/-1}.ip-navigation{gap:6px}.ip-navigation button{padding:10px 6px;font-size:.875rem}.ip-panel details{padding:12px}.speaking-modes button{padding:10px 8px}}
#speaking .speaking-modes button[aria-pressed=true]{color:#fff}
.ip-my-answer{margin:20px 0;min-width:0}.ip-my-answer textarea{display:block;width:100%;max-width:100%;box-sizing:border-box;min-height:130px;resize:vertical;font:inherit;line-height:1.6;margin-top:10px}.ip-auto-check{display:flex;align-items:center;gap:8px;margin-top:14px}.ip-auto-check input{width:20px!important;min-width:20px;margin:0}.ie-actions{display:flex;flex-wrap:wrap;gap:8px}.ie-actions button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:0;white-space:normal;max-width:100%}.ip-evaluation,.ie-grammar,#ie-confirm,#ip-practice-target{min-width:0;overflow-wrap:anywhere}.ip-evaluation{padding:16px;border:1px solid var(--line);border-radius:12px;margin:20px 0}.ip-evaluation [hidden]{display:none!important}.ip-evaluation h3{margin-top:0}.ip-evaluation p[lang=en]{white-space:pre-line}.ie-notice{font-size:.875rem;line-height:1.5}.ie-dimensions{margin:0}.ie-dimensions>div{border-bottom:1px solid var(--line);padding:12px 0}.ie-dimensions dt{font-weight:600}.ie-dimensions dd{margin:6px 0}.ie-dimensions dd p{margin:6px 0}.ie-grammar,#ie-confirm{border:1px solid var(--line);padding:12px;border-radius:8px;margin:12px 0}.ip-evaluation ul{padding-inline-start:22px}.ip-evaluation li{margin:8px 0}#ip-practice-target{border-left:3px solid var(--accent);padding:8px 12px;margin:18px 0}#ip-my-answer:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(max-width:480px){.ie-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.ip-evaluation{padding:12px}.ip-evaluation details{padding:10px}.ip-auto-check{align-items:flex-start}.ie-actions button{padding:10px 8px}}
.it-preview{border:1px solid var(--line);border-radius:12px;padding:14px;margin:16px 0;min-width:0}.it-preview label{display:block;margin-top:12px}.it-preview label:first-child{margin-top:0}.it-preview textarea{width:100%;max-width:100%;box-sizing:border-box;font:inherit;line-height:1.6;resize:vertical}.it-actions{display:flex;flex-wrap:wrap;gap:8px}#it-translate,.it-actions button{display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:44px;min-width:0;white-space:normal;max-width:100%}#ip-answer-translation{min-width:0;max-width:100%;margin-top:12px}#ip-answer-translation [hidden]{display:none!important}#it-status{overflow-wrap:anywhere}#it-status:empty,#it-language:empty{display:none}#it-source:focus-visible,#it-english:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media(max-width:480px){.it-preview{padding:10px}.it-actions{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.it-actions button{padding:10px 8px}}
.ip-panel .ip-guide{margin:16px 0}
.ip-guide>summary{font-weight:600}
.ip-guide>label{display:block;margin:8px 0 6px}
.ip-guide>select{width:100%;max-width:24rem;min-height:44px}
.ip-guide .ip-answer{margin-top:14px}
.ip-guide .ip-answer p[lang=en]{font-weight:600}