/* HolaLuci classroom: illustrated routes and a learn-before-practice lesson flow. */
.journey{min-height:580px;background:#d9edf0;border:1px solid #d4e5dd;box-shadow:inset 0 0 0 5px #fffefa80}
#leaflet-map{background:linear-gradient(145deg,#cde6e6 0%,#e8efdd 48%,#f3e6c9 100%)}
#leaflet-map .leaflet-tile-pane{filter:saturate(1.18) sepia(.11) brightness(1.04)}
#leaflet-map .leaflet-control-attribution{border-radius:7px 0 0 0;padding:2px 5px}
#leaflet-map .leaflet-control-zoom{border:0;box-shadow:0 3px 12px #263b3218}
.pin-card{width:76px;transform:translateY(-7px);filter:drop-shadow(0 4px 4px #26362a27)}
.pin-icon{width:42px;height:42px;border-radius:16px;background:#4c896d;border:3px solid #fffefa;box-shadow:0 4px 0 #326149,0 0 0 3px #ffffff70;font-size:20px}
.pin-card.current .pin-icon{background:#e9925c;box-shadow:0 4px 0 #bf7145,0 0 0 4px #fff5e5}
.pin-card.done .pin-icon{background:#6b9b69;box-shadow:0 4px 0 #477646}
.pin-label{display:none;margin-top:7px;padding:5px 9px;border-radius:9px;background:#fffdf5;border:1px solid #e9dfcc;font-size:9px;letter-spacing:.1px;box-shadow:0 2px 7px #26362a12;color:#40584c}
.pin-card.current .pin-label,.leaflet-marker-icon:hover .pin-label,.leaflet-marker-icon:focus .pin-label{display:block}
.pin-region{display:block;margin-top:3px;color:#859084;font-size:7px;font-weight:800;letter-spacing:.55px;text-transform:uppercase}
.route-atlas{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:13px 0 5px;padding:10px 12px;border:1px solid #e7e4d8;border-radius:13px;background:linear-gradient(90deg,#f8f2e5,#f0f4e9)}
.route-atlas strong{margin-right:2px;color:#607362;font-size:9px;letter-spacing:.75px;text-transform:uppercase}
.atlas-chip{display:inline-flex;align-items:center;gap:5px;padding:6px 9px;border:1px solid #e8e3d6;border-radius:99px;background:#fffefa;color:#65736a;font-size:9px;font-weight:800}
.atlas-chip i{width:7px;height:7px;border-radius:50%;background:#72a781}
.atlas-chip:nth-of-type(3) i{background:#e6a15e}.atlas-chip:nth-of-type(4) i{background:#76a9b2}.atlas-chip:nth-of-type(5) i{background:#bd9d74}
.map-key{display:flex;gap:13px;align-items:center;flex-wrap:wrap;padding:9px 3px 0;color:#7b887d;font-size:9px}
.map-key span{display:inline-flex;align-items:center;gap:5px}.map-key i{width:9px;height:9px;border-radius:50%;background:#77a47a}.map-key .current-key{background:#e99560}.map-key .locked-key{background:#bac2b7}
.route-stops{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;padding:11px 2px 4px;scrollbar-color:#c9d5c9 transparent;scrollbar-width:thin}
.route-stop{flex:0 0 126px;min-height:57px;display:grid;grid-template-columns:25px 1fr;align-items:center;gap:7px;padding:8px;border:1px solid #e8e4d8;border-radius:12px;background:#fffefa;text-align:left;transition:.16s}
.route-stop:hover{transform:translateY(-2px);border-color:#a9c4a9}
.route-stop .stop-num{display:grid;place-items:center;width:24px;height:24px;border-radius:8px;background:#edf1e8;color:#78867a;font-size:9px;font-weight:900}
.route-stop b{display:block;overflow:hidden;color:#55675a;font-size:9px;text-overflow:ellipsis;white-space:nowrap}
.route-stop small{display:block;margin-top:3px;color:#97a095;font-size:7px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}
.route-stop.current{border-color:#edb286;background:#fff8ef}.route-stop.current .stop-num{background:#e99560;color:#fff}
.route-stop.done .stop-num{background:#6f9b6e;color:#fff}.route-stop.locked{opacity:.8}
.guidechar{width:83px;height:96px;flex:none;filter:drop-shadow(0 3px 4px #24353220)}
.guidechar svg{display:block;width:100%;height:100%;overflow:visible}
.guidebubble{max-width:235px;border-radius:15px 15px 5px 15px;font-size:10px;line-height:1.55}
.footer-note{margin-top:9px}
.lesson-teach[hidden],.question[hidden],.answers[hidden]{display:none!important}
.lesson-teach{margin:16px 0 11px;border:1px solid #e8e6d8;border-radius:19px;padding:16px;background:linear-gradient(145deg,#fffdf6,#eef5eb)}
.lesson-step{display:inline-flex;gap:6px;align-items:center;border-radius:99px;padding:6px 9px;background:#e6f0e4;color:#52745d;font-size:9px;font-weight:900;letter-spacing:.4px;text-transform:uppercase}
.lesson-teach h3{margin:11px 0 4px;font:900 18px Nunito;color:#30463b}
.lesson-teach .teacher-line{margin:0 0 13px;color:#728177;font-size:11px;line-height:1.5}
.phrase-card{display:grid;grid-template-columns:1fr auto;align-items:center;gap:10px;padding:13px;border:1px solid #e8e1d1;border-radius:14px;background:#fffefa}
.phrase-card strong{display:block;color:#345b4c;font:900 17px Nunito}
.phrase-card small{display:block;margin-top:3px;color:#899188;font-size:10px}
.lesson-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:9px 0}
.lesson-word{padding:9px 10px;border:1px solid #eae7dc;border-radius:12px;background:#fffefa}
.lesson-word b{display:block;color:#506951;font-size:11px}
.lesson-word span{display:block;margin-top:3px;color:#8b9188;font-size:9px}
.lesson-example{margin-top:8px;padding:11px 12px;border-left:3px solid #e9a36a;border-radius:0 11px 11px 0;background:#f9efe2;color:#645c50;font-size:10px;line-height:1.5}
.lesson-example b{display:block;color:#3c5749;font-size:12px}
.lesson-actions{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:13px}
.lesson-actions small{color:#899188;font-size:9px}
.lesson-next{background:#3d7565;color:white;border-radius:11px;padding:10px 14px;font-size:10px;font-weight:900;box-shadow:0 3px 0 #2d5a4c}
.lesson-next:hover{transform:translateY(-1px);box-shadow:0 4px 0 #2d5a4c}
.lesson-hear{width:32px;height:32px;border-radius:10px;background:#e9f1e7;color:#3f735d;font-size:14px}
.lesson-continue{display:inline-flex;margin:9px 0 1px;padding:8px 11px;border:0;border-radius:9px;background:#edf3e9;color:#42694e;font-size:10px;font-weight:900;cursor:pointer}
.modal{max-height:min(90vh,760px);overflow:auto}
.feedback{line-height:1.5}
.journey{background:#c9e7e5}
#leaflet-map{background:#c9e7e5}
.map-wait,#leaflet-map .leaflet-control-container{display:none!important}
.atlas-art{position:absolute;inset:0;width:100%;height:100%;display:block}
.atlas-route-svg{position:absolute;inset:0;width:100%;height:100%;z-index:2;overflow:visible;pointer-events:none}
.atlas-route-svg polyline{fill:none;stroke:#fffefa;stroke-width:13;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:2 21;filter:drop-shadow(0 2px 1px #42614e55);animation:route-drift 22s linear infinite}
.atlas-pins{position:absolute;inset:0;z-index:4;pointer-events:none}
.atlas-pin{position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);display:grid;justify-items:center;gap:5px;padding:0;background:transparent;pointer-events:auto;min-width:44px}
.atlas-pin-icon{display:grid;place-items:center;width:42px;height:42px;border:3px solid #fffefa;border-radius:15px;background:#548e70;box-shadow:0 4px 0 #326149,0 5px 13px #26362a35;font-size:20px;transition:transform .18s,box-shadow .18s;position:relative}
.atlas-pin.current .atlas-pin-icon{background:#e9925c;box-shadow:0 4px 0 #bf7145,0 0 0 5px #fffefa9c,0 7px 17px #26362a35;animation:pin-breathe 2.3s ease-in-out infinite}
.atlas-pin.done .atlas-pin-icon{background:#6b9b69}
.atlas-pin.done .atlas-pin-icon:after{content:'✓';position:absolute;right:-6px;top:-7px;width:17px;height:17px;border:2px solid #fffefa;border-radius:50%;display:grid;place-items:center;background:#3f8c63;color:white;font:900 10px 'DM Sans'}
.atlas-pin.locked .atlas-pin-icon{background:#879b89;filter:saturate(.7)}
.atlas-pin-label{display:block;padding:4px 7px;border:1px solid #fffefa;border-radius:8px;background:#fffefaed;color:#40584c;box-shadow:0 2px 6px #26362a20;font-size:8px;font-weight:900;white-space:nowrap;opacity:0;transform:translateY(-3px);transition:.16s}
.atlas-pin.current .atlas-pin-label,.atlas-pin:hover .atlas-pin-label,.atlas-pin:focus-visible .atlas-pin-label{opacity:1;transform:translateY(0)}
.atlas-pin:hover .atlas-pin-icon,.atlas-pin:focus-visible .atlas-pin-icon{transform:translateY(-3px) scale(1.08)}
.atlas-pin:focus-visible{outline:0}.atlas-pin:focus-visible .atlas-pin-icon{outline:3px solid #35495e;outline-offset:3px}
.map-guide{z-index:7;right:12px;top:12px;bottom:auto}
@keyframes route-drift{to{stroke-dashoffset:-138}}
@keyframes pin-breathe{50%{transform:translateY(-3px) scale(1.08)}}
@media(max-width:690px){.atlas-pin-icon{width:35px;height:35px;border-radius:13px;font-size:17px}.atlas-pin{gap:3px}.atlas-pin-label{font-size:7px;padding:3px 5px}.atlas-route-svg polyline{stroke-width:11}.map-landmark{font-size:80%}}
@media(prefers-reduced-motion:reduce){.atlas-pin.current .atlas-pin-icon,.atlas-route-svg polyline{animation:none}.atlas-pin-icon,.atlas-pin-label{transition:none}}
@media(max-width:690px){.journey{min-height:470px}.route-atlas{gap:6px;padding:9px}.atlas-chip{padding:5px 7px;font-size:8px}.map-key{gap:9px;font-size:8px}.route-stop{flex-basis:112px;min-height:54px}.guidechar{width:68px;height:82px}.guidebubble{max-width:172px;font-size:9px}.lesson-teach{padding:13px}.lesson-teach h3{font-size:16px}.lesson-list{gap:5px}.lesson-word{padding:8px 7px}.lesson-word b{font-size:10px}.lesson-word span{font-size:8px}.phrase-card strong{font-size:15px}.lesson-actions{align-items:flex-end}.lesson-actions small{max-width:125px;line-height:1.4}}
@media(prefers-reduced-motion:reduce){.lesson-next,.pin-icon{transition:none}}