/* „Az LLM működése” — a Mind vizualizáció beágyazott stílusa (plan-v6).
   Az eredeti, teljes képernyős styles.css minden szabálya a .llm-mind tárolóra
   szűkítve; a fekete helyett a webhely navyja az alap, a kiemelés narancs. */
@font-face{font-family:MindRoboto;src:url('./fonts/RobotoCondensed-Regular.ttf') format('truetype');font-style:normal;font-weight:400;font-display:swap}

.llm-mind{--mind-bg:#16233f;--mind-panel:rgba(30,47,82,.94);--mind-line:#33476f;--mind-muted:#aeb7ca;--mind-accent:#f68b28;
  color-scheme:dark;font-family:MindRoboto,'Arial Narrow',Arial,sans-serif;background:var(--mind-bg);color:#fff;
  width:100%;height:calc(100dvh - 64px);min-height:560px;display:grid;grid-template-columns:var(--space-width,38%) 1fr;position:relative;overflow:hidden}
.llm-mind:fullscreen{height:100dvh;max-height:none;border-radius:0}
.llm-mind *{box-sizing:border-box}
.llm-mind button,.llm-mind a,.llm-mind summary{-webkit-tap-highlight-color:transparent}
.llm-mind button{font:inherit;color:inherit;cursor:pointer}
.llm-mind button:focus-visible,.llm-mind a:focus-visible,.llm-mind summary:focus-visible,.llm-mind canvas:focus-visible{outline:2px solid var(--mind-accent);outline-offset:3px}
.llm-mind section{min-width:0;min-height:0;position:relative;overflow:hidden;background:var(--mind-bg)}
.llm-mind #space-panel{border-right:1px solid var(--mind-line)}
.llm-mind canvas{display:block;width:100%;height:100%;touch-action:none;outline:none}
.llm-mind #thought{position:absolute;inset:44px 20px 20px;overflow:hidden;font-size:52px;line-height:1.16;font-weight:700;pointer-events:none;overflow-wrap:break-word;user-select:none}
.llm-mind #thought-prefix{color:rgba(255,255,255,.32)}
.llm-mind #thought-tail{color:rgba(246,139,40,.28)}
.llm-mind .mind-toolbar{position:absolute;top:10px;left:10px;display:flex;align-items:center;gap:8px;z-index:7}
.llm-mind #fullscreen-toggle{width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--mind-line);border-radius:50%;padding:0;background:rgba(22,35,63,.7)}
.llm-mind #fullscreen-toggle:hover{background:rgba(246,139,40,.18)}
.llm-mind #fullscreen-toggle[aria-pressed=true]{background:var(--mind-accent);color:#16233f;border-color:var(--mind-accent)}
.llm-mind .mind-icon--collapse,.llm-mind.is-full .mind-icon--expand{display:none}
.llm-mind.is-full .mind-icon--collapse{display:block}
/* Tartalék teljes képernyő (ahol a Fullscreen API elemre nem érhető el). */
.llm-mind.is-expanded{position:fixed;inset:0;z-index:100;height:100dvh;min-height:0}
html.llm-mind-lock,html.llm-mind-lock body{overflow:hidden}
.llm-mind #language{display:flex;align-items:center;gap:2px;font-size:13px;line-height:1;padding:2px 4px;background:rgba(22,35,63,.7);border:1px solid var(--mind-line);border-radius:999px}
.llm-mind #language button{border:0;background:none;padding:8px 9px;color:rgba(255,255,255,.5);border-radius:999px;min-width:36px;min-height:32px}
.llm-mind #language button[aria-pressed=true]{color:#16233f;background:var(--mind-accent);font-weight:700}
.llm-mind #language span{color:#5b6c94;font-size:11px}
.llm-mind #help-toggle{position:absolute;right:10px;top:10px;width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--mind-line);border-radius:50%;padding:0;background:rgba(22,35,63,.7);font-size:18px;line-height:1;z-index:6}
.llm-mind #help-toggle[aria-expanded=true]{background:var(--mind-accent);color:#16233f;border-color:var(--mind-accent)}
.llm-mind #help{position:absolute;inset:8px;padding:16px 18px 22px;background:var(--mind-panel);border:1px solid var(--mind-line);border-radius:18px;overflow-y:auto;overscroll-behavior:contain;z-index:5;font-size:16px;line-height:1.4;scrollbar-width:thin;scrollbar-color:#526492 transparent}
.llm-mind #help h2{font-size:28px;line-height:1.1;font-weight:400;padding-right:40px;margin:2px 0 18px}
.llm-mind #help h3{font-size:19px;font-weight:400;margin:22px 0 5px;color:var(--mind-accent)}
.llm-mind #help p{margin:6px 0 12px;color:#e3e8f2}
.llm-mind #help a{color:#fff;text-underline-offset:3px}
.llm-mind #datasets{display:flex;flex-direction:column;align-items:flex-start;gap:4px;margin:12px 0 22px}
.llm-mind #datasets button{background:none;border:0;text-align:left;padding:6px 0;min-height:32px;text-decoration:underline;text-underline-offset:3px;font-size:17px;line-height:1.2}
.llm-mind #datasets button::before{content:'· ';text-decoration:none}
.llm-mind #datasets button[aria-pressed=true]{color:var(--mind-accent);text-decoration:none}
.llm-mind .controls{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0}
.llm-mind .controls button{padding:8px 12px;min-height:38px;border:1px solid #6d7ea8;background:rgba(22,35,63,.4);border-radius:10px;font-size:14px}
.llm-mind .controls button:hover{background:rgba(255,255,255,.1)}
.llm-mind #readable{border-top:1px solid var(--mind-line);border-bottom:1px solid var(--mind-line);padding:12px 0;margin-top:22px}
.llm-mind summary{cursor:pointer;padding:6px 0}
.llm-mind #completions{padding-left:21px;font-size:15px;line-height:1.4}
.llm-mind #completions li{margin:0 0 12px;overflow-wrap:anywhere}
.llm-mind .note,.llm-mind .credits{font-size:13px;line-height:1.4;color:var(--mind-muted)}
.llm-mind .credits{margin-top:20px!important}
.llm-mind #loading{position:absolute;left:20px;top:50%;right:20px;color:var(--mind-muted);font-size:17px;text-align:center;line-height:1.45;pointer-events:none}
.llm-mind #loading button{display:block;margin:12px auto 0;background:#1e2f52;border:1px solid #7785a5;border-radius:10px;padding:8px 16px;pointer-events:auto}
.llm-mind [hidden]{display:none!important}
.llm-mind .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;padding:0;margin:-1px;border:0}

/* Álló telefonon egymás alatt a tér és a fa; a súgó a tárolón belül nyílik,
   nem takarja a webhely fejlécét. */
@media(max-width:680px) and (orientation:portrait){
  .llm-mind{grid-template-columns:1fr;grid-template-rows:44% 56%;height:calc(100dvh - 56px);min-height:520px}
  .llm-mind #space-panel{border-right:0;border-bottom:1px solid var(--mind-line)}
  .llm-mind #thought{font-size:32px;inset:52px 16px 14px}
  /* Telefonon a súgó teljes képernyős réteg (a felső panel túl kicsi az
     olvasáshoz); nyitva a bezáró gomb és a nyelvváltó is a rétegen marad. */
  .llm-mind #help{position:fixed;inset:max(8px,env(safe-area-inset-top)) 8px max(8px,env(safe-area-inset-bottom));padding:60px 20px 24px;background:rgba(22,35,63,.98);z-index:60}
  .llm-mind #help-toggle[aria-expanded=true]{position:fixed;top:max(18px,env(safe-area-inset-top));right:18px;z-index:61}
  .llm-mind:has(#help:not([hidden])) .mind-toolbar{position:fixed;top:max(18px,env(safe-area-inset-top));left:18px;z-index:61}
  .llm-mind #help h2{font-size:26px}
}
@media(prefers-reduced-motion:reduce){.llm-mind *{scroll-behavior:auto}}
