:root{--bg:#fbfaf7;--surface:#fff;--text:#1d1f24;--muted:#5d6470;--border:#e2dfd8;--accent:#4f46b8;--accent-soft:#ecebfa;--done:#1f7a4d;--code-bg:#f4f2ed;--radius:10px;color-scheme:light dark}@media (prefers-color-scheme:dark){:root{--bg:#15161a;--surface:#1d1f25;--text:#e8e6e1;--muted:#a0a6b2;--border:#30333c;--accent:#a5a0f5;--accent-soft:#2a2947;--done:#5fcf97;--code-bg:#1d1f25}.astro-code,.astro-code span{color:var(--shiki-dark)!important;background-color:#0000!important}}*{box-sizing:border-box}body{background:var(--bg);color:var(--text);margin:0;font-family:system-ui,Segoe UI,sans-serif;line-height:1.6}a{color:var(--accent)}.topbar{border-bottom:1px solid var(--border);background:var(--surface);flex-wrap:wrap;align-items:center;gap:1.5rem;padding:.75rem 1.25rem;display:flex}.topbar .brand{color:var(--text);font-weight:700;text-decoration:none}.topbar nav{flex-wrap:wrap;gap:1rem;display:flex}.topbar nav a{color:var(--muted);border-bottom:2px solid #0000;padding:.15rem 0;text-decoration:none}.topbar nav a[aria-current=true]{color:var(--text);border-bottom-color:var(--accent)}.page{max-width:1100px;margin:0 auto;padding:1.5rem 1.25rem 4rem}.with-sidebar{grid-template-columns:260px minmax(0,1fr);gap:2.5rem;display:grid}@media (width<=800px){.with-sidebar{grid-template-columns:1fr;gap:1rem}}h1{margin:0 0 .5rem;font-size:1.9rem;line-height:1.2}h2{margin-top:2.2rem;font-size:1.35rem}.lead{color:var(--muted);margin-top:0;font-size:1.1rem}.cards{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:1rem;padding:0;list-style:none;display:grid}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);height:100%;color:var(--text);padding:1rem 1.1rem;text-decoration:none;display:block}a.card:hover{border-color:var(--accent)}.card h2,.card h3{margin:0 0 .3rem;font-size:1.1rem}.card p{color:var(--muted);margin:0;font-size:.95rem}.card.soon{opacity:.65}.badge{background:var(--accent-soft);color:var(--accent);border-radius:99px;margin-top:.6rem;padding:.1rem .55rem;font-size:.8rem;display:inline-block}.sidebar{font-size:.95rem}.sidebar h2{text-transform:uppercase;letter-spacing:.05em;color:var(--muted);margin:1.2rem 0 .3rem;font-size:.8rem}.sidebar h2:first-child{margin-top:0}.sidebar ul{margin:0;padding:0;list-style:none}.sidebar a{color:var(--text);border-radius:6px;gap:.5rem;padding:.25rem .5rem;text-decoration:none;display:flex}.sidebar a[aria-current=page]{background:var(--accent-soft);color:var(--accent);font-weight:600}.sidebar .soon{color:var(--muted);padding:.25rem .5rem}.check{width:1.1em;color:var(--done);flex:none}.lesson{max-width:46rem}.lesson img{max-width:100%}.lesson :not(pre)>code{background:var(--code-bg);border:1px solid var(--border);border-radius:4px;padding:.05em .35em;font-size:.92em}.lesson pre{border:1px solid var(--border);border-radius:var(--radius);padding:.9rem 1rem;font-size:.92rem;position:relative;overflow-x:auto;background:var(--code-bg)!important}.lesson blockquote{border-left:4px solid var(--accent);background:var(--accent-soft);border-radius:0 var(--radius) var(--radius) 0;margin:1.2rem 0;padding:.6rem 1rem}.lesson blockquote p{margin:.3rem 0}.lesson table{border-collapse:collapse}.lesson th,.lesson td{border:1px solid var(--border);text-align:left;padding:.35rem .7rem}.copy-btn{font:inherit;color:var(--muted);background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:.15rem .55rem;font-size:.8rem;position:absolute;top:.4rem;right:.4rem}.copy-btn:hover{color:var(--text)}.lesson-footer{border-top:1px solid var(--border);margin-top:3rem;padding-top:1.2rem}.done-btn{font:inherit;color:#fff;background:var(--accent);cursor:pointer;border:0;border-radius:8px;padding:.55rem 1.1rem;font-weight:600}@media (prefers-color-scheme:dark){.done-btn{color:#15161a}}.done-btn[aria-pressed=true]{color:var(--done);border:1px solid var(--done);background:0 0}.pager{justify-content:space-between;gap:1rem;margin-top:1.5rem;display:flex}.pager a{text-decoration:none}php-runner{border:1px solid var(--border);border-radius:var(--radius);background:var(--surface);margin:1.2rem 0;display:block;overflow:hidden}php-runner>textarea{background:var(--code-bg);width:100%;min-height:8rem;color:var(--text);resize:vertical;border:0;padding:.9rem 1rem;font:.92rem/1.5 ui-monospace,Consolas,monospace;display:block}.runner-bar{border-bottom:1px solid var(--border);align-items:center;gap:.5rem;padding:.4rem .6rem;display:flex}.runner-file{color:var(--muted);margin-right:auto;font:.85rem ui-monospace,Consolas,monospace}.runner-bar button{font:inherit;border:1px solid var(--border);background:var(--surface);color:var(--text);cursor:pointer;border-radius:6px;padding:.25rem .8rem;font-size:.88rem}.runner-bar .runner-run{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.runner-bar button:disabled{opacity:.6;cursor:progress}.runner-editor .cm-editor{font-size:.92rem}.runner-editor .cm-editor.cm-focused{outline:2px solid var(--accent);outline-offset:-2px}.runner-field{border-top:1px solid var(--border);align-items:flex-start;gap:.75rem;padding:.5rem .6rem;font-size:.88rem;display:flex}.runner-field>span{width:9.5rem;color:var(--muted);flex:none;padding-top:.25rem}.runner-field small{font-size:.75rem;line-height:1.3;display:block}.runner-field input,.runner-field textarea{min-width:0;color:var(--text);background:var(--bg);border:1px solid var(--border);resize:vertical;border-radius:6px;flex:1;padding:.3rem .5rem;font:.9rem ui-monospace,Consolas,monospace}.runner-command{border-top:1px solid var(--border);background:var(--code-bg);color:var(--muted);padding:.4rem .75rem 0;font:.85rem ui-monospace,Consolas,monospace}.lesson pre.runner-output{white-space:pre-wrap;word-break:break-word;border:0;border-radius:0;margin:0;padding:.3rem .75rem .75rem}.runner-command:has(+.runner-output[hidden]){padding-bottom:.4rem}.runner-output.is-error{color:#b3261e}@media (prefers-color-scheme:dark){.runner-bar .runner-run{color:#15161a}.runner-output.is-error{color:#ff8a80}}.lesson-header{position:relative}.present-btn{float:right;font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:6px;margin:.3rem 0 .5rem 1rem;padding:.3rem .8rem;font-size:.88rem}.present-btn:hover{border-color:var(--accent)}.present-bar{display:none}.presenting .topbar,.presenting .sidebar,.presenting .lesson-footer,.presenting .present-btn,.presenting .fordjupning,.presenting [data-off-slide]{display:none!important}.presenting .page{max-width:none;padding:0}.presenting .with-sidebar{display:block}.presenting .lesson{max-width:62rem;min-height:100vh;margin:0 auto;padding:6vh 2.5rem 6rem;font-size:clamp(1.25rem,1.75vw,1.9rem)}.presenting .lesson h1{font-size:2.2em}.presenting .lesson h2{margin-top:0;font-size:1.7em;line-height:1.2}.presenting .lesson .lead{font-size:1.15em}.presenting .lesson pre,.presenting .lesson :not(pre)>code,.presenting .runner-editor .cm-editor,.presenting .runner-command,.presenting .runner-file,.presenting .runner-field,.presenting .runner-field input,.presenting .runner-field textarea{font-size:.85em}.presenting .runner-bar button,.presenting .copy-btn{font-size:.65em}.presenting .lesson li{margin:.35em 0}.present-title-slide .lesson{flex-direction:column;justify-content:center;padding-top:0;display:flex}.presenting .present-bar{background:var(--surface);border-top:1px solid var(--border);color:var(--muted);opacity:.35;align-items:center;gap:.6rem;padding:.4rem .9rem;font-size:.9rem;transition:opacity .15s;display:flex;position:fixed;bottom:0;left:0;right:0}.presenting .present-bar:hover,.presenting .present-bar:focus-within{opacity:1}.present-bar button{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:.2rem .7rem}.present-count{text-align:center;font-variant-numeric:tabular-nums;min-width:3.5rem}.present-title{white-space:nowrap;text-overflow:ellipsis;margin:0 auto 0 .6rem;overflow:hidden}.presenting .runner-field input,.presenting .runner-field textarea{font-size:1em}.runner-browser{border-top:1px solid var(--border)}.runner-address{background:var(--code-bg);align-items:center;gap:.5rem;padding:.4rem .6rem;font-size:.85rem;display:flex}.runner-method{background:var(--accent-soft);color:var(--accent);border-radius:4px;flex:none;padding:.05rem .45rem;font:600 .75rem ui-monospace,Consolas,monospace}.runner-url{border:1px solid var(--border);background:var(--surface);white-space:nowrap;text-overflow:ellipsis;border-radius:99px;flex:1;min-width:0;padding:.15rem .6rem;font-family:ui-monospace,Consolas,monospace;overflow:hidden}.runner-address button{font:inherit;color:var(--text);background:var(--surface);border:1px solid var(--border);cursor:pointer;border-radius:6px;flex:none;padding:.15rem .6rem}.runner-cookies{background:var(--code-bg);border-top:1px solid var(--border);color:var(--muted);word-break:break-all;padding:.25rem .75rem;font:.8rem ui-monospace,Consolas,monospace}.runner-frame{border:0;border-top:1px solid var(--border);background:#fff;width:100%;height:12rem;display:block}.lesson pre.runner-source,.lesson pre.runner-status{border-top:1px solid var(--border);padding-top:.75rem}.presenting .runner-address,.presenting .runner-cookies{font-size:.7em}
