:root{color-scheme:light;--bg: #f4f5f7;--surface: #ffffff;--border: #d8dbe0;--text: #1b1e23;--text-dim: #5d646f;--accent: #b8532a;--stage-bg: #f9fafb;--actor-fill: #ffffff;--actor-stroke: #c3c8d0;--actor-text: #1b1e23;--pipe: #c3c8d0;--marble-instance: #d2691e;--marble-instance-b: #2f7d68;--marble-instance-c: #7b5ea7;--marble-ref: #3f7ea8;--marble-pulse: #8b929e;--tether: #3f7ea8;--highlight: #d2691e;--code-comment: #8a919c;--code-literal: #3f6b57;--code-keyword: #47559b;--radius: 10px;--gap: 16px;--font-ui: system-ui, -apple-system, "Segoe UI", sans-serif;--font-mono: ui-monospace, "Cascadia Code", "Consolas", monospace}:root[data-theme=dark]{color-scheme:dark;--bg: #121417;--surface: #1a1d21;--border: #2b3037;--text: #e8eaed;--text-dim: #9aa1ac;--accent: #e08b5f;--stage-bg: #15181c;--actor-fill: #1e2227;--actor-stroke: #3a4048;--actor-text: #e8eaed;--pipe: #3a4048;--marble-instance: #ffa657;--marble-instance-b: #5fc9a8;--marble-instance-c: #b99bec;--marble-ref: #6fb3d9;--marble-pulse: #7d848f;--tether: #6fb3d9;--highlight: #ffa657;--code-comment: #737a86;--code-literal: #7fb8a0;--code-keyword: #9aa9e0}*{box-sizing:border-box}body{margin:0;min-height:100vh;display:flex;flex-direction:column;background:var(--bg);color:var(--text);font-family:var(--font-ui);line-height:1.55}#app{flex:1 0 auto;width:100%;max-width:1560px;margin:0 auto;padding:32px 20px 72px}a{color:var(--accent)}.topbar{position:sticky;top:0;z-index:20;background:var(--bg);border-bottom:1px solid var(--border)}.topbar__inner{max-width:1560px;margin:0 auto;padding:10px 20px;display:flex;align-items:center;gap:16px;min-height:34px}.logo{display:inline-flex;align-items:center;gap:9px;text-decoration:none;color:var(--text)}.logo__mark{height:20px;width:auto;display:block}.logo__word{font-family:var(--font-mono);font-size:1.05rem;font-weight:600;letter-spacing:.02em}.logo:hover .logo__word{color:var(--accent)}.topbar__home{font-size:.92rem;text-decoration:none;color:var(--text-dim)}.topbar__home:before{content:"←";margin-right:7px}.topbar__home:hover{color:var(--accent)}.topbar__menu{position:relative;margin-left:auto}.menu-panel{display:none;position:absolute;right:0;top:calc(100% + 8px);min-width:190px;padding:6px;border:1px solid var(--border);border-radius:10px;background:var(--surface);box-shadow:0 12px 32px #00000024}.topbar__menu.is-open .menu-panel{display:block}.theme-toggle{font:inherit;font-size:.9rem;display:block;width:100%;text-align:left;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--text);cursor:pointer}.theme-toggle:hover{background:var(--bg);color:var(--accent)}@media(min-width:768px){.topbar__menu>.icon-btn{display:none}.menu-panel{display:block;position:static;min-width:0;padding:0;border:0;border-radius:0;background:none;box-shadow:none}.theme-toggle{width:auto;font-size:.85rem;padding:6px 14px;border:1px solid var(--border);border-radius:8px;color:var(--text-dim)}.theme-toggle:hover{background:none;border-color:var(--accent);color:var(--accent)}}.site-head h1{font-size:1.9rem;margin:0 0 6px}.site-head p{color:var(--text-dim);margin:0 0 32px}.group-title{font-size:.8rem;text-transform:uppercase;letter-spacing:.08em;color:var(--text-dim);margin:32px 0 12px}.cards{display:grid;gap:var(--gap);grid-template-columns:repeat(auto-fill,minmax(260px,1fr))}.card{display:block;padding:16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);text-decoration:none;color:inherit}.card--ready:hover{border-color:var(--accent)}.card--soon{opacity:.5}.card h3{margin:0 0 6px;font-size:1.05rem}.card p{margin:0 0 10px;color:var(--text-dim);font-size:.9rem}.badge{font-size:.72rem;padding:2px 8px;border-radius:6px;border:1px solid var(--border);color:var(--text-dim)}.card--ready .badge{border-color:var(--accent);color:var(--accent)}.stage{border:1px solid var(--border);border-radius:var(--radius);background:var(--stage-bg);overflow:hidden}.stage__panel{display:flex;gap:6px;align-items:center;padding:8px 10px;border-bottom:1px solid var(--border);background:var(--surface)}.stage__canvas canvas{display:block;width:100%;height:auto}.narration{min-height:3.2em;margin:16px 0;font-size:1.05rem}.narration__step{color:var(--text-dim);font-variant-numeric:tabular-nums;margin-right:8px}.controls{display:flex;gap:6px;align-items:center;flex-wrap:wrap}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;padding:0;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--text-dim);cursor:pointer}.icon-btn:hover{border-color:var(--accent);color:var(--accent)}.icon-btn svg{width:17px;height:17px;fill:currentColor}.icon-btn[data-state=playing]{color:var(--accent);border-color:var(--accent)}.icon-btn--stroke svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.speed{font:inherit;font-size:.85rem;height:34px;padding:0 8px;margin-left:4px;border:1px solid var(--border);border-radius:8px;background:var(--bg);color:var(--text-dim);cursor:pointer}.code{margin:0;padding:16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);font-family:var(--font-mono);font-size:.86rem;overflow-x:auto}.code__line{display:block;padding:0 6px;border-left:2px solid transparent;white-space:pre}.code__line--on{background:color-mix(in srgb,var(--accent) 14%,transparent);border-left-color:var(--accent)}.code .token.comment,.code .token.prolog,.code .token.doctype,.code .token.cdata{color:var(--code-comment);font-style:italic}.code .token.string,.code .token.number,.code .token.boolean,.code .token.regex,.code .token.char{color:var(--code-literal)}.code .token.keyword,.code .token.control-flow{color:var(--code-keyword);font-weight:600}.code .token.punctuation,.code .token.operator{opacity:.7}.board{display:grid;gap:20px;grid-template-columns:1fr;align-items:start}@media(min-width:1024px){.board{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}}.board__code{min-width:0}.prose{display:grid;gap:0 44px;grid-template-columns:1fr;max-width:78ch}@media(min-width:1024px){.prose{grid-template-columns:1fr 1fr;max-width:none;align-items:start}}.paticka{display:flex;flex-direction:column;align-items:center;gap:14px;padding:26px 20px 30px;font-size:.92rem;color:var(--text-dim);background:var(--surface);border-top:1px solid var(--border)}.paticka__vzory{width:100%;max-width:60rem;display:flex;flex-wrap:wrap;justify-content:center;align-items:baseline;gap:3px 12px;font-size:.86rem}.paticka__nadpis{flex-basis:100%;text-align:center;font-weight:700;color:var(--text-dim);margin-bottom:2px}.paticka__vzory a{color:var(--text-dim);text-decoration:none;white-space:nowrap}.paticka__vzory a:hover{color:var(--accent);text-decoration:underline}@media(max-width:640px){.paticka__vzory{display:none}}.paticka__spodok{width:100%;max-width:60rem;display:flex;justify-content:center;align-items:center;flex-wrap:wrap;gap:6px}.paticka .odd{opacity:.55}.paticka__spodok a{color:var(--text-dim);text-decoration:underline}.paticka__spodok a:hover{color:var(--accent)}.odkaz-kava{display:inline-flex;align-items:center;gap:5px}.ikona-kava{width:16px;height:16px;flex:none}.notfound{min-height:44vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;text-align:center}.notfound__cislo{margin:0;font-family:var(--font-mono);font-weight:700;font-size:clamp(5rem,18vw,11rem);line-height:1;letter-spacing:-.03em}.notfound__nula{color:var(--marble-instance)}.notfound__spat{color:var(--text-dim)}.notfound__spat:hover{color:var(--accent)}.text{max-width:44rem}.text h1{font-size:1.8rem;margin:0 0 10px}.text .uvod{font-size:1.05rem}.text p{margin:0 0 14px}.text ul{margin:0 0 14px;padding-left:22px}.text li{margin-bottom:6px}.text code{font-family:var(--font-mono);font-size:.92em;padding:1px 5px;border:1px solid var(--border);border-radius:5px;background:var(--bg)}.podpora{margin:26px 0}.podpora img{display:block;border:1px solid var(--border);border-radius:var(--radius);background:#fff}.podpora figcaption{margin-top:8px;font-size:.88rem;color:var(--text-dim)}.podpora__chyba{margin:0;color:var(--text-dim)}.text .spat{margin-top:26px}.error-panel{padding:16px;border:1px solid var(--accent);border-radius:var(--radius);background:var(--surface)}.error-panel ul{margin:8px 0 0;padding-left:20px;font-family:var(--font-mono);font-size:.84rem}
