:root{color-scheme:dark;--bg:#08090b;--panel:#151515;--gold:#dfb968;--text:#f5efdf;--muted:#a8a39b}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at 70% 0,#272014 0,transparent 45%),var(--bg);color:var(--text);font:15px/1.5 system-ui,Arial}.top{display:flex;justify-content:space-between;align-items:center;padding:20px 3vw;border-bottom:1px solid #49402e}.brand{color:var(--gold);font-weight:800;letter-spacing:.14em;font-size:24px}.brand small{display:block;font-size:9px;color:#e7dcc2;letter-spacing:.3em}.state{font-size:13px;color:var(--muted)}.layout{display:grid;grid-template-columns:minmax(0,1fr) 360px;gap:16px;padding:18px;max-width:1650px;margin:auto}.stage,.chat{background:#111214;border:1px solid #383124;border-radius:16px;padding:20px;min-width:0}.heading{display:flex;justify-content:space-between;align-items:center}h1{font-size:23px;margin:0}h2{font-size:20px;margin:0 0 8px}p{margin:6px 0 12px;color:var(--muted)}#count{color:var(--gold)}.videos{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:12px}.tile{border:1px solid #55472a;background:#040404;border-radius:12px;overflow:hidden;position:relative;aspect-ratio:16/10}.tile video{width:100%;height:100%;object-fit:cover}.tile span{position:absolute;bottom:8px;left:10px;padding:4px 9px;background:#000b;border-radius:7px}.controls{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}button{border:1px solid #82682e;background:#d7ac5a;color:#181209;padding:11px 15px;border-radius:8px;font-weight:700;cursor:pointer}button:hover:not(:disabled){filter:brightness(1.13)}button:disabled{opacity:.4;cursor:not-allowed}.danger{background:#592626;color:#fff;border-color:#814242}.chat{display:flex;flex-direction:column;min-height:70vh}.hint{font-size:12px}#messages{flex:1;min-height:270px;max-height:58vh;overflow:auto;padding:10px 0}.bubble{background:#242423;border:1px solid #36332b;padding:10px;border-radius:11px;margin:0 0 9px;overflow-wrap:anywhere}.bubble .meta{font-size:12px;color:var(--gold);margin-bottom:5px}.correction{border-left:3px solid var(--gold);background:#251f14}.correction strong{color:var(--gold)}.chat form{display:grid;gap:6px}input,textarea{background:#0b0b0b;color:var(--text);border:1px solid #706041;border-radius:8px;padding:10px;font:inherit;width:100%}.toggle{display:flex;align-items:center;gap:9px;margin-top:12px;font-size:13px}.toggle input{width:auto}#screenPanel video{width:100%;max-height:60vh;background:#000}.overlay{position:fixed;inset:0;background:#080808ed;display:grid;place-items:center;z-index:10;padding:15px}.join{background:#191815;border:1px solid #77603c;border-radius:15px;padding:28px;width:min(420px,100%);display:grid;gap:15px}.join label{display:grid;gap:5px}.error{color:#ff9c91}@media(max-width:900px){.layout{grid-template-columns:1fr}.chat{min-height:450px}#messages{max-height:350px}}@media(max-width:480px){.top{padding:12px}.brand{font-size:18px}.layout{padding:8px;gap:9px}.stage,.chat{padding:12px}.heading h1{font-size:20px}.controls button{flex:1 1 42%}}

/* explicit, visible microphone-consent state */
#speechState{border-left:3px solid #caa558;padding-left:10px}


/* MI-javítás: feliratok helyett színes, hozzáférhető ikonok. */
.grammar-line {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-top: 10px;
    line-height: 1.5;
}
.grammar-icon {
    display: inline-flex;
    flex: 0 0 24px;
    justify-content: center;
    align-items: center;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    color: #fff;
    font-weight: 800;
    font-size: 16px;
    line-height: 1;
}
.grammar-icon-error { background: #a52e36; }
.grammar-icon-success { background: #16864e; }