:root {
  --bg-base:#0a0e17;--bg-surface:#0d1117;--bg-card:#111827;--bg-elevated:#1a2235;--bg-border:#1e2d40;
  --green:#00ff88;--green-dim:#00cc6a;--green-glow:rgba(0,255,136,.15);--green-bg:rgba(0,255,136,.07);
  --orange:#ff6b2b;--orange-glow:rgba(255,107,43,.15);--orange-bg:rgba(255,107,43,.07);
  --blue:#38bdf8;--blue-glow:rgba(56,189,248,.15);--blue-bg:rgba(56,189,248,.07);
  --teal:#2dd4bf;--pink:#f472b6;--amber:#fbbf24;
  --text-primary:#f0f6fc;--text-secondary:#8b949e;--text-muted:#484f58;
  --font-heading:'Sora',sans-serif;--font-body:'Inter',sans-serif;--font-mono:'JetBrains Mono',monospace;
  --r-sm:6px;--r-md:10px;--r-lg:16px;--r-xl:24px;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--bg-base);color:var(--text-primary);font-family:var(--font-body);font-size:16px;line-height:1.8;overflow-x:hidden}
body::before{content:'';position:fixed;inset:0;background:repeating-linear-gradient(0deg,transparent,transparent 2px,rgba(0,0,0,.03) 2px,rgba(0,0,0,.03) 4px);pointer-events:none;z-index:9999}
.grid-bg{position:fixed;inset:0;background-image:linear-gradient(rgba(0,255,136,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(0,255,136,.025) 1px,transparent 1px);background-size:40px 40px;pointer-events:none;z-index:0}
.reading-progress{position:fixed;top:0;left:0;height:3px;width:0%;background:linear-gradient(90deg,var(--orange),var(--blue));z-index:1000;transition:width .1s linear}
nav{position:fixed;top:3px;left:0;right:0;z-index:100;padding:0 2rem;height:60px;display:flex;align-items:center;gap:1.5rem;background:rgba(10,14,23,.88);backdrop-filter:blur(16px);border-bottom:1px solid var(--bg-border)}
.nav-back{display:flex;align-items:center;gap:6px;font-family:var(--font-mono);font-size:11px;color:var(--text-muted);text-decoration:none;transition:color .15s}
.nav-back:hover{color:var(--orange)}
.nav-back::before{content:'←';font-size:14px}
.nav-divider{width:1px;height:20px;background:var(--bg-border)}
.nav-breadcrumb{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);display:flex;align-items:center;gap:6px}
.nav-breadcrumb .cur{color:var(--orange)}
.nav-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.nav-btn{font-family:var(--font-mono);font-size:11px;padding:5px 12px;border-radius:6px;border:1px solid var(--bg-border);background:transparent;color:var(--text-muted);cursor:pointer;text-decoration:none;transition:all .15s}
.nav-btn:hover{border-color:var(--orange);color:var(--orange)}
.nav-btn.next{background:var(--orange-bg);border-color:rgba(255,107,43,.3);color:var(--orange)}
.nav-btn.next:hover{background:var(--orange);color:#0a0e17}
.page{position:relative;z-index:1;padding-top:63px;display:grid;grid-template-columns:260px 1fr;min-height:100vh}
aside{position:sticky;top:63px;height:calc(100vh - 63px);overflow-y:auto;border-right:1px solid var(--bg-border);padding:2rem 1.2rem;display:flex;flex-direction:column;gap:.4rem}
aside::-webkit-scrollbar{width:4px}
aside::-webkit-scrollbar-thumb{background:var(--bg-border);border-radius:2px}
.aside-label{font-family:var(--font-mono);font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);padding:.8rem 0 .4rem .4rem}
.aside-link{display:flex;align-items:center;gap:8px;padding:7px 10px;border-radius:8px;font-size:12px;color:var(--text-secondary);text-decoration:none;transition:background .15s,color .15s;border:1px solid transparent}
.aside-link:hover{background:var(--bg-elevated);color:var(--text-primary)}
.aside-link.active{background:var(--orange-bg);border-color:rgba(255,107,43,.2);color:var(--orange)}
.aside-link-dot{width:6px;height:6px;border-radius:50%;background:var(--bg-border);flex-shrink:0;transition:background .15s}
.aside-link.active .aside-link-dot{background:var(--orange)}
.aside-divider{height:1px;background:var(--bg-border);margin:.6rem 0}
.aside-meta{margin-top:auto;padding-top:1rem;border-top:1px solid var(--bg-border)}
.aside-meta-item{display:flex;justify-content:space-between;font-family:var(--font-mono);font-size:10px;color:var(--text-muted);padding:3px 0}
.aside-meta-item span:last-child{color:var(--text-secondary)}
.aside-prof{margin-top:.8rem;padding:.8rem;background:var(--bg-elevated);border-radius:var(--r-md);border:1px solid var(--bg-border)}
.aside-prof-name{font-family:var(--font-heading);font-size:11px;font-weight:600;color:var(--text-primary);margin-bottom:1px}
.aside-prof-inst{font-family:var(--font-mono);font-size:9px;color:var(--text-muted);line-height:1.4}
.content{padding:3rem 3rem 6rem;max-width:820px}
.reveal{opacity:0;transform:translateY(20px);transition:opacity .6s ease,transform .6s ease}
.reveal.visible{opacity:1;transform:translateY(0)}
.aula-header{background:var(--bg-card);border:1px solid var(--bg-border);border-radius:var(--r-xl);padding:2rem 2.2rem 1.8rem;margin-bottom:3rem;position:relative;overflow:hidden}
.aula-header::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--orange) 0%,var(--blue) 60%,transparent 100%)}
.aula-header-top{display:flex;align-items:center;gap:10px;margin-bottom:1.2rem;flex-wrap:wrap}
.badge{display:inline-flex;align-items:center;gap:5px;font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.08em;padding:3px 10px;border-radius:20px}
.badge-green{background:var(--green-bg);color:var(--green);border:1px solid rgba(0,255,136,.2)}
.badge-blue{background:var(--blue-bg);color:var(--blue);border:1px solid rgba(56,189,248,.2)}
.badge-orange{background:var(--orange-bg);color:var(--orange);border:1px solid rgba(255,107,43,.2)}
.badge-gray{background:var(--bg-elevated);color:var(--text-muted);border:1px solid var(--bg-border)}
.aula-time{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--text-muted);display:flex;align-items:center;gap:5px}
.aula-title{font-family:var(--font-heading);font-size:clamp(1.6rem,3.5vw,2.2rem);font-weight:800;letter-spacing:-.04em;line-height:1.15;margin-bottom:.7rem}
.aula-desc{font-size:15px;color:var(--text-secondary);line-height:1.7;margin-bottom:1.2rem;max-width:600px}
.aula-objetivos{display:flex;flex-wrap:wrap;gap:6px}
.obj-tag{font-size:11px;padding:3px 10px;border-radius:20px;background:var(--orange-bg);border:1px solid rgba(255,107,43,.2);color:var(--orange);font-family:var(--font-mono)}
.sec-title{font-family:var(--font-heading);font-size:1.3rem;font-weight:700;letter-spacing:-.02em;color:var(--text-primary);margin-bottom:.6rem;display:flex;align-items:center;gap:10px;scroll-margin-top:80px}
.sec-title::before{content:'';width:4px;height:22px;border-radius:2px;background:var(--green);flex-shrink:0}
.sec-title.orange::before{background:var(--orange)}
.sec-title.blue::before{background:var(--blue)}
.sec-body{font-size:15px;color:var(--text-secondary);line-height:1.8;margin-bottom:1.5rem}
.sec-body strong{color:var(--text-primary);font-weight:600}
.sec-body code{font-family:var(--font-mono);font-size:13px;background:var(--bg-elevated);color:var(--orange);padding:1px 6px;border-radius:4px;border:1px solid var(--bg-border)}
.callout{border-radius:var(--r-md);padding:1rem 1.3rem;margin:1.5rem 0;display:flex;gap:12px;border:1px solid transparent}
.callout-green{background:var(--green-bg);border-color:rgba(0,255,136,.2)}
.callout-orange{background:var(--orange-bg);border-color:rgba(255,107,43,.2)}
.callout-blue{background:var(--blue-bg);border-color:rgba(56,189,248,.2)}
.callout-icon{font-size:18px;flex-shrink:0;line-height:1.6}
.callout-body{font-size:14px;line-height:1.7}
.callout-green .callout-body{color:#a7f3d0}
.callout-orange .callout-body{color:#fed7aa}
.callout-blue .callout-body{color:#bae6fd}
.callout-title{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:3px}
.callout-green .callout-title{color:var(--green)}
.callout-orange .callout-title{color:var(--orange)}
.callout-blue .callout-title{color:var(--blue)}
.divider{height:1px;background:var(--bg-border);margin:3rem 0}
.code-block{background:var(--bg-surface);border:1px solid var(--bg-border);border-radius:var(--r-md);overflow:hidden;margin:1.5rem 0}
.code-header{display:flex;align-items:center;justify-content:space-between;padding:10px 16px;background:var(--bg-elevated);border-bottom:1px solid var(--bg-border)}
.code-lang{font-family:var(--font-mono);font-size:11px;color:var(--orange);font-weight:500}
.code-dots{display:flex;gap:6px}
.code-dot{width:10px;height:10px;border-radius:50%}
.dot-r{background:#ff5f57}.dot-y{background:#febc2e}.dot-g{background:#28c840}
.code-copy{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);background:transparent;border:1px solid var(--bg-border);border-radius:4px;padding:3px 8px;cursor:pointer;transition:color .15s,border-color .15s}
.code-copy:hover{color:var(--orange);border-color:var(--orange)}
.code-body{padding:1.3rem 1.5rem;overflow-x:auto}
.code-body pre{font-family:var(--font-mono);font-size:13px;line-height:1.85;color:#e6edf3;margin:0}
.ck{color:#ff79c6}.cf{color:var(--green)}.cs{color:var(--orange)}.cn{color:var(--blue)}.cc{color:var(--text-muted);font-style:italic}.cp{color:#cba6f7}.ct{color:var(--teal)}
.quiz{background:var(--bg-card);border:1px solid var(--bg-border);border-radius:var(--r-xl);padding:2rem 2.2rem;margin:2rem 0}
.quiz-header{display:flex;align-items:center;gap:12px;margin-bottom:1.5rem}
.quiz-icon{width:40px;height:40px;border-radius:10px;background:var(--blue-bg);border:1px solid rgba(56,189,248,.3);display:flex;align-items:center;justify-content:center;font-size:18px}
.quiz-label{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--blue);margin-bottom:2px}
.quiz-title{font-family:var(--font-heading);font-size:14px;font-weight:600;color:var(--text-primary)}
.quiz-progress{margin-left:auto;font-family:var(--font-mono);font-size:11px;color:var(--text-muted)}
.quiz-progress b{color:var(--blue)}
.quiz-items{display:flex;flex-direction:column;gap:1.5rem}
.quiz-q-num{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);margin-bottom:.3rem}
.quiz-q{font-family:var(--font-heading);font-size:15px;font-weight:600;color:var(--text-primary);margin-bottom:.8rem;line-height:1.4}
.quiz-opts{display:flex;flex-direction:column;gap:6px}
.quiz-opt{display:flex;align-items:center;gap:10px;padding:10px 14px;background:var(--bg-surface);border:1px solid var(--bg-border);border-radius:var(--r-md);cursor:pointer;font-size:14px;color:var(--text-secondary);text-align:left;font-family:var(--font-body);width:100%;transition:border-color .15s,background .15s,color .15s}
.quiz-opt:hover:not(:disabled){border-color:rgba(56,189,248,.4);background:var(--blue-bg);color:var(--text-primary)}
.quiz-opt.correct{border-color:rgba(0,255,136,.4);background:var(--green-bg);color:var(--green)}
.quiz-opt.wrong{border-color:rgba(248,113,113,.4);background:rgba(248,113,113,.07);color:#f87171}
.quiz-opt-l{width:26px;height:26px;border-radius:6px;background:var(--bg-elevated);display:flex;align-items:center;justify-content:center;font-family:var(--font-mono);font-size:11px;font-weight:700;flex-shrink:0;color:var(--text-muted)}
.quiz-feedback{margin-top:8px;padding:8px 12px;border-radius:var(--r-md);font-size:13px;line-height:1.5;display:none}
.quiz-feedback.show{display:block;animation:fadeIn .3s ease}
.quiz-feedback.ok{background:var(--green-bg);color:#a7f3d0;border:1px solid rgba(0,255,136,.2)}
.quiz-feedback.err{background:rgba(248,113,113,.07);color:#fca5a5;border:1px solid rgba(248,113,113,.2)}
.quiz-result{margin-top:1.5rem;padding:1rem 1.3rem;background:var(--bg-elevated);border:1px solid var(--bg-border);border-radius:var(--r-md);display:none;text-align:center}
.quiz-result.show{display:block;animation:fadeIn .4s ease}
.quiz-result-score{font-family:var(--font-heading);font-size:2rem;font-weight:800;color:var(--blue);line-height:1;margin-bottom:.3rem}
.quiz-result-msg{font-size:13px;color:var(--text-secondary)}
.aula-nav-bottom{display:flex;align-items:center;justify-content:space-between;padding:1.5rem 2rem;background:var(--bg-card);border:1px solid var(--bg-border);border-radius:var(--r-xl);margin-top:3rem}
.nav-aula-prev,.nav-aula-next{display:flex;flex-direction:column;gap:2px;text-decoration:none;padding:.8rem 1rem;border-radius:var(--r-md);border:1px solid var(--bg-border);transition:all .15s;max-width:220px}
.nav-aula-prev:hover{border-color:var(--text-muted)}
.nav-aula-next:hover{border-color:var(--orange);background:var(--orange-bg)}
.nav-aula-dir{font-family:var(--font-mono);font-size:10px;color:var(--text-muted);letter-spacing:.08em}
.nav-aula-next .nav-aula-dir{color:var(--orange);text-align:right}
.nav-aula-name{font-family:var(--font-heading);font-size:13px;font-weight:600;color:var(--text-secondary);line-height:1.3}
.nav-aula-next .nav-aula-name{text-align:right}
.nav-aula-center{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);text-align:center}
/* Java progress steps */
.steps{display:flex;flex-direction:column;gap:8px;margin:1.5rem 0}
.step{background:var(--bg-card);border:1px solid var(--bg-border);border-left:3px solid var(--orange);border-radius:var(--r-md);padding:.8rem 1.2rem;display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start}
.step-num{font-family:var(--font-heading);font-size:15px;font-weight:800;color:var(--orange);min-width:24px}
.step-body{font-size:13px;color:var(--text-secondary);line-height:1.6}
.step-body strong{color:var(--text-primary)}
/* Complexity table */
.complexity-table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:13px}
.complexity-table th{font-family:var(--font-mono);font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);padding:.6rem .8rem;border-bottom:2px solid var(--bg-border);text-align:left}
.complexity-table td{padding:.55rem .8rem;border-bottom:1px solid var(--bg-border);color:var(--text-secondary);font-family:var(--font-mono);font-size:12px}
.complexity-table tr:hover td{background:var(--bg-elevated)}
.complexity-table .ok{color:var(--green)}.complexity-table .warn{color:var(--amber)}.complexity-table .bad{color:#f87171}
/* UML block */
.uml-block{background:var(--bg-surface);border:1px solid var(--bg-border);border-radius:var(--r-md);padding:1.3rem;margin:1.5rem 0;font-family:var(--font-mono);font-size:13px;line-height:2;overflow-x:auto}
.uml-class{color:var(--orange);font-weight:700}.uml-attr{color:var(--blue)}.uml-method{color:var(--green)}.uml-rel{color:var(--teal)}
@keyframes fadeIn{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:768px){.page{grid-template-columns:1fr}aside{display:none}.content{padding:2rem 1.2rem 4rem}nav{padding:0 1rem}.nav-breadcrumb{display:none}}