/* Git series additions to the shared tutorial design. */
@import url('../../ai/assets/style.css');

.skip-link{position:fixed;top:-100px;left:1rem;z-index:2000;background:var(--white);padding:.6rem 1rem;border:2px solid var(--blue);border-radius:6px}.skip-link:focus{top:.5rem}
:focus-visible{outline:3px solid var(--sky);outline-offset:3px}
.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.module-card.planned:hover{transform:none;box-shadow:none;border-color:var(--border)}
.card-status{font-size:.78rem;color:var(--slate);margin-top:.75rem}
.mobile-toc{display:none}
.index-body{overflow-wrap:anywhere}.index-grid .module-card{min-width:0}.index-hero h1{font-size:clamp(2rem,5vw,3.5rem)}
.content{overflow-wrap:anywhere}.content table{width:100%}

/* Command sessions: one copyable block per command, its output underneath */
.term{border:1px solid var(--border);border-radius:12px;padding:1rem 1.1rem;margin:1.75rem 0;background:var(--white)}
.term-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:.4rem .75rem;margin-bottom:.6rem}
.term-label{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#C2410C}
.term-title{font-weight:600;color:var(--navy)}
.term pre.command{margin:.6rem 0 0;padding:.6rem 1rem;background:#0F172A;color:#E2E8F0;border-color:#0F172A}
.term pre.command code::before{content:"$ ";color:#64748B;user-select:none}
.term pre.command .hljs-keyword{color:#FDBA74}.term pre.command .hljs-title{color:#7DD3FC;font-weight:600}
.term pre.command .hljs-attr{color:#C4B5FD}.term pre.command .hljs-string{color:#86EFAC}.term pre.command .hljs-built_in{color:#FDBA74}
.term .output{margin:0 0 .6rem;background:#1E293B;border-color:#0F172A;border-top:none;border-radius:0 0 10px 10px}
.term .output-label{display:none}
.term .output pre{padding-top:.5rem}
.term-edit,.term-who{font-size:.9rem;margin:1rem 0 .3rem;color:var(--slate)}
.term-who{font-weight:600;color:var(--navy);border-left:3px solid #C2410C;padding-left:.6rem}
.term-caption{font-size:.78rem;color:var(--slate);margin-top:.9rem}
.graph{margin:1rem 0;padding:.75rem;overflow-x:auto;background:var(--white);border:1px solid var(--border);border-radius:10px}
.graph svg{display:block;max-width:none}
.g-hash{font:600 12px var(--font-mono);fill:#475569}.g-subject{font:13px var(--font-body);fill:#0F172A}
.g-ref{stroke-width:1.2}.g-head{fill:#DBEAFE;stroke:#1D4ED8}.g-branch{fill:#E0F2FE;stroke:#0284C7}
.g-tag{fill:#FEF3C7;stroke:#B45309}.g-remote{fill:#F1F5F9;stroke:#94A3B8}.g-ref-text{font:600 11px var(--font-body);fill:#0F172A}

@media(max-width:900px){.mobile-toc{display:block;margin:1rem 0}.mobile-toc nav{display:flex;flex-wrap:wrap;gap:.5rem;padding:1rem}.mobile-toc a{font-size:.85rem}#main{width:100%}}
@media(max-width:440px){#topbar{padding:0 .75rem;gap:.45rem}.module-dropdown .dropdown-menu{min-width:260px;max-width:calc(100vw - 20px)}.lang-switch{margin-left:0}.index-grid{grid-template-columns:1fr}.term{padding:.8rem}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important}}
@media print{.skip-link,.mobile-toc{display:none!important}details:not([open])>.details-body{display:block!important}.quiz-expl[hidden]{display:block}.term pre.command{background:none;color:inherit}}
