/* Visual-first lessons; every source-reviewed explanation remains expandable. */
.visual-topic-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-bottom:32px}
.visual-topic-card{display:block;background:var(--paper);border:1px solid var(--border);border-radius:16px;overflow:hidden;transition:transform .2s,border-color .2s,box-shadow .2s}
.visual-topic-card:hover{transform:translateY(-3px);border-color:#afc39b;box-shadow:var(--shadow)}
.visual-topic-card.done{border-color:#afc39b}.visual-topic-card.done .visual-topic-number{background:#345e47;color:white}
.visual-topic-image{position:relative;padding:14px 22px 0;background:#f2f5ec;border-bottom:1px solid #e7ecde;aspect-ratio:1.85;overflow:hidden;display:flex;align-items:center;justify-content:center}
.visual-topic-image img{display:block;width:100%;height:100%;object-fit:contain;transition:transform .3s}
.visual-topic-card:hover img{transform:scale(1.035)}
.visual-topic-number{position:absolute;left:13px;top:13px;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fffefa;border:1px solid #dae2cf;font-size:10px;font-weight:600;color:#6c8056}
.visual-topic-copy{position:relative;padding:18px 22px 20px}.visual-topic-copy h3{font-size:17px;font-weight:650}.visual-topic-copy p{font-size:11px;margin:6px 24px 0 0;color:#77846b}.visual-topic-copy>span{position:absolute;right:21px;top:23px;font-size:22px;color:#81966b}
.visual-overview-link{display:flex;align-items:center;justify-content:space-between;padding:17px 20px;border:1px solid var(--border);border-radius:12px;margin:0 0 32px;background:#eef3e5;font-size:13px;color:#4d6940}
.visual-overview-link>span{font-size:11px;color:#7c8e68}
.lesson-visual{border:1px solid #dbe4d0;background:var(--paper);border-radius:17px;overflow:hidden;margin-bottom:21px;box-shadow:0 5px 22px #304d2805}
.visual-tabs{display:flex;gap:10px;padding:13px 16px;border-bottom:1px solid #e1e7d9;background:#eef2e7;overflow-x:auto}
.visual-tab{display:flex;align-items:center;gap:9px;border:1px solid transparent;border-radius:9px;background:transparent;color:#758364;padding:5px 11px 5px 5px;cursor:pointer;text-align:left;font-size:11px;line-height:1.4;min-height:46px;flex-shrink:0;max-width:245px}
.visual-tab img{width:53px;height:34px;object-fit:contain;border-radius:5px;background:#fffefa}.visual-tab.active{background:#fffefa;border-color:#b4c59e;color:#3e5e31;box-shadow:0 2px 4px #40552808}.visual-tab:hover{background:#fffefa}
.visual-toolbar{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:18px 22px 6px}.visual-toolbar h2{font-size:16px;font-weight:600}.visual-toolbar>div{display:flex;gap:7px;flex-shrink:0}.visual-toolbar .btn{padding:8px 11px;font-size:10px;min-height:35px}.visual-toolbar .btn:disabled{opacity:.5;cursor:wait}
.lesson-visual-scroll{overflow-x:auto;margin:4px 12px 0;border-radius:12px;overscroll-behavior-x:contain}
#lesson-visual-svg{width:100%;min-width:0;display:block;padding:0 4px}#lesson-visual-svg>svg{display:block;width:100%;height:auto;max-height:560px;margin:0 auto}
#lesson-visual-svg.visual-enlarged{min-width:1100px}#lesson-visual-svg.visual-enlarged>svg{max-height:none}
#lesson-visual-svg.labels-hidden text:not(.diagram-heading),#lesson-visual-svg.labels-hidden .diagram-leader{visibility:hidden}
.visual-recall{display:flex;align-items:center;gap:12px;padding:18px 23px;background:#f0f4e8;border-top:1px solid #e5ebda}
.visual-recall-icon{display:grid;place-items:center;width:32px;height:32px;border:1px solid #bccda9;border-radius:50%;font:italic 22px Georgia,serif;flex:none;color:#67854a}.visual-recall strong{display:block;font-size:11px;font-weight:650;color:#68814e}.visual-recall p{font-size:12px;color:#5c6f4e;margin:4px 0 0;line-height:1.65}
.visual-description{padding:0 23px;border-top:1px solid #e5ebda}.visual-description>summary{padding:11px 0;font-size:10px;color:#7d8b6d;cursor:pointer}.visual-description p{font-size:12px;line-height:1.8;margin:0 0 11px}.visual-description small{display:block;font-size:10px;margin-bottom:16px;color:#7c8b6b}.visual-description[hidden]{display:none}
.visual-key-points{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-bottom:25px}
.visual-key-point{padding:18px 17px;background:#ecf2e2;border:1px solid #dce5d1;border-radius:12px}.visual-key-point:nth-child(2){background:#f2eddf;border-color:#e6dfcc}.visual-key-point:nth-child(3){background:#eaf0f0;border-color:#d8e4e2}
.visual-key-point>span{display:block;font-size:9px;letter-spacing:1px;color:#819368;margin-bottom:8px}.visual-key-point strong{font-size:13px;font-weight:650}.visual-key-point p{font-size:12px;line-height:1.6;margin:6px 0 0;color:#6c7a60}
.lesson-full-notes{background:var(--paper);border:1px solid var(--border);border-radius:13px;margin:0 0 25px;padding:0 23px}
.lesson-full-notes>summary{display:flex;align-items:center;gap:14px;padding:23px 0;cursor:pointer;list-style:none}.lesson-full-notes>summary::-webkit-details-marker{display:none}.lesson-full-notes>summary strong{display:block;font-size:15px;font-weight:650}.lesson-full-notes>summary small{display:block;margin-top:5px;font-size:11px;color:#7b876f}.lesson-full-notes>summary:after{content:'+';font-size:23px;color:#7e9467;margin-left:auto}.lesson-full-notes[open]>summary:after{content:'−'}
.lesson-full-notes>summary>.ui-icon{width:24px;height:24px;color:#8b9e72}.lesson-full-notes[open]>summary{border-bottom:1px solid var(--border);margin-bottom:22px}
.lesson-full-notes .learn-grid{margin-bottom:24px;gap:22px;grid-template-columns:minmax(0,1.7fr) minmax(210px,1fr)}.lesson-full-notes .terms-panel{position:static;padding:18px;background:#f8faf3}.lesson-full-notes .terms-panel h3{font-size:16px}.lesson-full-notes .essential{padding:20px}.lesson-full-notes .essential li{font-size:13px}.lesson-summary{font-size:14px;line-height:1.85;margin-bottom:21px;color:#68765e}.lesson-full-notes .takeaway{font-size:13px}
.lesson-bottom{margin-top:25px}.lesson-source{margin-top:18px;line-height:1.7}
@media(min-width:1450px){.visual-topic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.visual-topic-copy{padding:18px}.visual-topic-copy h3{font-size:16px}}
@media(max-width:1000px){.lesson-full-notes .learn-grid{grid-template-columns:1fr}.visual-toolbar{align-items:flex-start}.visual-toolbar h2{padding-top:5px;font-size:14px}.visual-key-point{padding:15px 13px}.visual-key-point strong{font-size:12px}.visual-key-point p{font-size:11px}}
@media(max-width:600px){.visual-topic-grid{gap:14px}.visual-topic-copy{padding:15px}.visual-topic-copy h3{font-size:14px}.visual-topic-copy p{font-size:10px}.visual-topic-copy>span{right:13px;top:16px;font-size:18px}.visual-topic-image{padding:10px 7px 0;aspect-ratio:1.5}.visual-topic-number{width:24px;height:24px;left:8px;top:8px;font-size:9px}.visual-toolbar{padding:15px 15px 4px;flex-direction:column;gap:11px}.visual-toolbar>div{width:100%}.visual-toolbar .btn{min-height:38px;font-size:11px}.visual-tabs{padding:10px;gap:5px}.visual-tab{font-size:10px;max-width:200px}.visual-tab img{width:44px;height:30px}.lesson-visual-scroll{margin:0 4px}#lesson-visual-svg{min-width:0;padding:0}.visual-toolbar:after{content:"Povečaj za lažje branje oznak.";font-size:10px;color:#7c8a6b}.visual-recall{padding:15px;align-items:flex-start}.visual-recall p{font-size:11px}.visual-description{padding:0 15px}.visual-key-points{grid-template-columns:1fr;gap:7px;margin-bottom:20px}.visual-key-point{display:grid;grid-template-columns:20px minmax(100px,.8fr) 1fr;align-items:baseline;column-gap:8px;padding:13px 14px}.visual-key-point>span{margin:0}.visual-key-point strong{font-size:12px}.visual-key-point p{margin:0;font-size:11px}.lesson-full-notes{padding:0 17px}.lesson-full-notes>summary{padding:21px 0}.lesson-full-notes>summary strong{font-size:14px}.lesson-full-notes>summary small{font-size:10px}.visual-overview-link{font-size:12px;padding:16px}.visual-overview-link>span{font-size:10px}}
@media(max-width:450px){.visual-topic-grid{grid-template-columns:1fr}.visual-topic-image{aspect-ratio:1.85;padding:12px 24px 0}.visual-topic-copy{padding:17px 21px}.visual-topic-copy h3{font-size:17px}.visual-topic-copy p{font-size:11px}.visual-topic-copy>span{right:22px;top:20px}.visual-overview-link{align-items:flex-start;flex-direction:column;gap:7px}}
@media(max-width:600px){.lesson-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:7px;margin-bottom:23px}.lesson-tabs .chip{flex-shrink:0}.lesson-head>.tiny-pill{display:none}}
@media(prefers-reduced-motion:reduce){.visual-topic-card,.visual-topic-image img{transition:none}.visual-topic-card:hover,.visual-topic-card:hover img{transform:none}}