*{box-sizing:border-box}body{margin:0;background:#f6f7f8;color:#111827;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}.app{min-height:100vh;padding:clamp(12px,2vw,20px)}.app-header{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:10px}h1{margin:0;color:#101827;font-size:clamp(28px,5vw,44px);font-weight:900;letter-spacing:0;line-height:.95}.quick-controls{display:grid;grid-template-columns:minmax(132px,1fr) 48px 48px 48px minmax(92px,.8fr);gap:8px;margin-bottom:14px;align-items:start}button{background:#111827;color:#fff;border:none;border-radius:10px;min-height:48px;padding:10px 14px;cursor:pointer;font-size:18px;font-weight:800;white-space:nowrap}button:hover{filter:brightness(.95)}.quick-controls select{width:100%;min-height:48px;border:1px solid #d1d5db;border-radius:10px;background:#fff;color:#111827;padding:0 10px;font-size:16px;outline:none}.secondary-button,.icon-button{background:#fff;color:#111827;border:1px solid #d1d5db}.icon-button{padding:0;font-size:24px;line-height:1}.start-button{background:#059669}.stop-button{background:#b3312c}.settings-panel{margin-bottom:0}.settings-panel summary{display:grid;place-items:center;min-height:48px;border:1px solid #d1d5db;border-radius:10px;background:#fff;color:#4b5563;cursor:pointer;font-size:21px;font-weight:700;list-style:none}.settings-panel summary::-webkit-details-marker{display:none}.quick-settings{position:relative}.quick-settings .settings-grid{position:absolute;top:calc(100% + 8px);right:0;z-index:20;width:min(92vw,760px);padding:12px;border:1px solid #d1d5db;border-radius:10px;background:#fff;box-shadow:0 16px 40px #0f172a2e}.settings-grid{display:grid;grid-template-columns:minmax(220px,1.2fr) repeat(2,minmax(160px,.7fr)) minmax(180px,.7fr);align-items:end;gap:12px;margin-top:10px;margin-bottom:0}.setting-control{display:flex;flex-direction:column;gap:6px}.setting-control label{color:#4b5563;font-size:13px;font-weight:800;text-transform:uppercase}.setting-control input,.setting-control select{width:100%;border:1px solid #d1d5db;border-radius:8px;background:#fff;color:#111827;min-height:42px;padding:10px 12px;outline:none}.setting-control select option{background:#fff;color:#111827}.setting-control input:focus,.setting-control select:focus{border-color:#60a5fa;box-shadow:0 0 0 3px #60a5fa29}.setting-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px}.setting-actions button{min-height:42px;font-size:13px}.workspace-grid{display:grid;grid-template-columns:minmax(320px,.9fr) minmax(420px,1.1fr);gap:14px;height:calc(100dvh - 150px);min-height:0}.transcript-only-grid{grid-template-columns:1fr}.script-panel,.suggestion{overflow-y:auto;min-height:0;background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:16px}.script-panel,.suggestion{display:flex;flex-direction:column;max-height:100%}.panel-title-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.panel-title-row h2,.suggestion h2{margin:0 0 10px;font-size:18px}.panel-title-row h2{margin-bottom:0}.panel-title-row span{color:#facc15;font-size:12px;font-weight:800;text-transform:uppercase}.live-script{padding:12px;margin-bottom:16px;border-radius:12px;background:#facc1514;border:1px solid rgba(250,204,21,.16)}.live-script strong,.script-block strong{display:block;margin-bottom:6px;color:#6b7280;font-size:13px;text-transform:uppercase;letter-spacing:.04em}.live-script p{margin:0;color:#f5f7fb;font-size:16px;line-height:1.5;white-space:pre-wrap}.script-history{display:flex;flex-direction:column;gap:8px;min-height:0}.script-history-item{padding:8px 0 10px;border-bottom:1px solid rgba(255,255,255,.12)}.script-history-item:last-child{border-bottom:none}.script-history-item p{margin:0;color:#d9e2f8;font-size:15px;line-height:1.5;white-space:pre-wrap}.suggestion{cursor:pointer;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}.suggestion.collapsed{max-height:90px;overflow:hidden;opacity:.75}.suggestion:not(.collapsed) .answer-list{flex:0 0 auto;overflow:visible;padding-right:0}.tap-hint{opacity:.65;font-size:14px}.thinking{color:#b45309;font-weight:600}.live-strip{margin-bottom:14px;padding:14px;border:1px solid #e5e7eb;border-radius:10px;background:#f9fafb}.live-strip span{display:block;margin-bottom:6px;color:#6b7280;font-size:12px;font-weight:900;text-transform:uppercase}.live-strip p{margin:0;color:#111827;font-size:clamp(18px,3vw,28px);font-weight:700;line-height:1.35;white-space:pre-wrap}.answer-list{display:flex;flex-direction:column;gap:10px}.answer-item{padding:8px 0 10px;border-bottom:1px solid #e5e7eb;display:flex;flex-direction:column;gap:8px}.transcript-translation-item{gap:12px}.answer-item:last-child{border-bottom:none}.script-block p{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;word-break:break-word;line-height:1.6;font-size:15px}.vi-block p{color:#b45309;font-size:17px;font-weight:700}.answer-block p{color:#1d4ed8;font-size:17px;line-height:1.6}.answer-block strong{color:#1d4ed8;font-size:13px;font-weight:900;letter-spacing:.06em}@media(max-width:900px){.app-header{align-items:flex-start;flex-direction:column;gap:10px}h1{font-size:clamp(28px,8vw,42px)}.quick-controls{grid-template-columns:minmax(128px,1fr) 48px 48px 48px minmax(84px,.8fr);gap:8px}.settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.api-key-control{grid-column:1 / -1}.workspace-grid{grid-template-columns:1fr;height:auto}.english-ai-panel{order:1}.vietnamese-panel{order:2}.suggestion{max-height:none;min-height:260px;padding:14px}.english-ai-panel{min-height:52dvh}.vietnamese-panel{min-height:28dvh}}@media(max-width:560px){.app{padding:10px}.app-header{margin-bottom:10px}h1{font-size:34px}.quick-controls{grid-template-columns:minmax(118px,1fr) 42px 42px 42px minmax(72px,.8fr);gap:6px}.quick-controls select{min-height:48px;padding:0 8px;font-size:16px}.settings-grid{grid-template-columns:1fr;gap:8px}.setting-control label{font-size:11px}.setting-control input,.setting-control select,button{min-height:48px;padding:8px;font-size:13px}.start-button,.stop-button{font-size:15px}.workspace-grid{gap:10px}.suggestion{border-radius:8px;padding:12px}.suggestion h2{font-size:16px}.script-block p{font-size:14px;line-height:1.5}.vi-block p,.answer-block p{font-size:15px;line-height:1.55}}@media(orientation:landscape)and (min-width:640px){.app{padding:10px 14px}.app-header{margin-bottom:10px}h1{font-size:clamp(28px,5vw,42px)}.quick-controls{grid-template-columns:minmax(160px,1fr) 48px 48px 48px minmax(92px,.7fr);margin-bottom:10px}.workspace-grid,.transcript-translate-grid{grid-template-columns:minmax(280px,1fr) minmax(280px,1fr);height:calc(100dvh - 142px)}.transcript-only-grid{grid-template-columns:1fr}.transcript-translation-item{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:16px}.english-ai-panel,.transcript-panel{order:1;min-height:0}.vietnamese-panel{order:2;min-height:0}.suggestion{max-height:100%;min-height:0}}