/* Sdílený styl prezentací do hodin (16:9, projektor). Obsah: <section class="slide">…, poznámky učitele v <div class="notes">. */
:root{--ink:#14202e;--muted:#5b6777;--line:#e3e8ee;--bg:#f3f5f8;--blue:#085ba2;--blue-2:#e7f0f9;--yel:#f3e35c;--yel-2:#fdf8d6;--green:#1f7a4d;--green-2:#e3f3ea;--red:#b3261e;--red-2:#fbe9e7}
*{box-sizing:border-box}
html,body{margin:0;height:100%;background:#0f1420;font-family:Inter,system-ui,sans-serif;color:var(--ink)}
.deck{position:fixed;inset:0;display:flex;align-items:center;justify-content:center}
.slide{display:none;width:min(100vw,177.78vh);height:min(56.25vw,100vh);background:#fff;padding:5.5vh 7vw;flex-direction:column;justify-content:center;position:relative;overflow:hidden}
.slide.on{display:flex}
.slide h1{font-size:clamp(28px,6vh,72px);line-height:1.08;margin:0 0 .3em;letter-spacing:-.02em;font-weight:800}
.slide h2{font-size:clamp(24px,5.2vh,58px);line-height:1.1;margin:0 0 .5em;letter-spacing:-.02em;font-weight:800}
.slide p,.slide li{font-size:clamp(16px,3.1vh,34px);line-height:1.35}
.slide ul{margin:0;padding-left:1.1em}.slide li{margin:.25em 0}
.slide ol{font-size:clamp(16px,3vh,32px);line-height:1.4;padding-left:1.2em;margin:0}
.kicker{font-size:clamp(12px,1.9vh,20px);text-transform:uppercase;letter-spacing:.12em;color:var(--blue);font-weight:700;margin-bottom:1.2em}
.muted{color:var(--muted)}
.big{font-size:clamp(34px,9vh,110px);font-weight:800;letter-spacing:-.03em;line-height:1;margin:0}
.q{font-size:clamp(22px,4.6vh,54px);font-weight:700;line-height:1.2;margin:0}
.cols{display:grid;grid-template-columns:1fr 1fr;gap:4vw;align-items:start}
.cols3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2.5vw}
.box{border-radius:1.6vh;padding:2.6vh 2.4vw;background:var(--bg)}
.box h3{margin:0 0 .4em;font-size:clamp(18px,3.4vh,38px);font-weight:800}
.box p,.box li{font-size:clamp(15px,2.6vh,28px)}
.box.b{background:var(--blue-2)}.box.y{background:var(--yel-2)}.box.g{background:var(--green-2)}.box.r{background:var(--red-2)}
.tag{display:inline-block;padding:.1em .55em;border-radius:.4em;font-weight:700;font-size:.8em;background:var(--blue-2);color:var(--blue)}
.tag.g{background:var(--green-2);color:var(--green)}.tag.y{background:var(--yel-2);color:#7a6a00}.tag.r{background:var(--red-2);color:var(--red)}
.scale{display:flex;gap:1vw;align-items:stretch;margin-top:2vh}
.scale div{flex:1;padding:2vh 1.5vw;border-radius:1.4vh;font-size:clamp(14px,2.5vh,26px);line-height:1.3}
.scale b{display:block;font-size:1.1em;margin-bottom:.3em}
.arrow{display:flex;align-items:center;gap:1.5vw;margin:2vh 0}
.arrow .step{flex:1;background:var(--bg);border-radius:1.4vh;padding:2vh 1.5vw;font-size:clamp(15px,2.7vh,30px);line-height:1.3;text-align:center}
.arrow .step b{display:block;font-size:1.05em}.arrow .step.hi{background:var(--blue);color:#fff}
.arrow .gt{font-size:clamp(20px,4vh,48px);color:var(--muted)}
.foot{position:absolute;left:7vw;right:7vw;bottom:2.6vh;display:flex;justify-content:space-between;font-size:clamp(11px,1.7vh,16px);color:var(--muted)}
.demo{background:var(--ink);color:#fff}.demo .kicker{color:var(--yel)}.demo .muted{color:#c9d3df}.demo .box{background:#1f2a3a;color:#fff}.demo a{color:var(--yel)}
.demo code{background:#2a3648;padding:.05em .4em;border-radius:.3em;font-size:.9em}
.title{background:var(--blue);color:#fff}.title .kicker{color:var(--yel)}.title .muted{color:#cfe0f2}
.slide .notes{display:none}
/* ovládání */
.ctl{position:fixed;right:1.2vw;bottom:1.4vh;display:flex;gap:.3rem;align-items:center;background:rgba(15,20,32,.85);color:#e8edf3;border-radius:999px;padding:.3rem .5rem;z-index:10;font-size:14px;backdrop-filter:blur(6px);transition:opacity .3s}
.ctl button{font:inherit;color:#e8edf3;background:transparent;border:0;border-radius:999px;padding:.35rem .6rem;cursor:pointer;line-height:1}
.ctl button:hover{background:rgba(255,255,255,.14)}
.ctl .cnt{padding:0 .5rem;font-variant-numeric:tabular-nums;color:#c9d3df;min-width:4.5rem;text-align:center}
.ctl button.act{background:var(--yel);color:#14202e}
body.idle .ctl,body.idle .back{opacity:0}
.back{position:fixed;left:1.2vw;top:1.4vh;z-index:10;color:#c9d3df;text-decoration:none;font-size:13px;background:rgba(15,20,32,.7);padding:.3rem .7rem;border-radius:999px;transition:opacity .3s}
.back:hover{color:#fff}
.notesbar{position:fixed;left:0;right:0;bottom:0;background:#111a27;color:#e8edf3;padding:1.5vh 3vw 6vh;font-size:clamp(13px,2vh,20px);line-height:1.4;display:none;max-height:34vh;overflow:auto;border-top:3px solid var(--yel);z-index:9}
body.notes .notesbar{display:block}
.overview{position:fixed;inset:0;background:#0f1420;overflow:auto;padding:4vh 3vw;display:none;z-index:8;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1rem;align-content:start}
body.ov .overview{display:grid}
.overview a{display:block;background:#fff;border-radius:8px;padding:.7rem .9rem;text-decoration:none;color:var(--ink);font-size:14px;border:3px solid transparent}
.overview a.on{border-color:var(--yel)}.overview a b{display:block;color:var(--muted);font-size:11px;margin-bottom:.2rem}
@media print{html,body{background:#fff;height:auto}.deck{position:static;display:block}.slide{display:flex;width:100%;height:auto;min-height:0;aspect-ratio:16/9;page-break-after:always;border-bottom:1px solid #ddd}.ctl,.back,.notesbar,.overview{display:none!important}}
