.teaching-slide.slide-tay-nguyen{padding:8px 0;overflow:hidden}
.tn-saban{position:relative;flex:1;min-height:0;overflow:hidden;border-radius:12px;border:1px solid #a89155;background:#132c30;display:grid;grid-template-rows:minmax(0,1fr);isolation:isolate}
.tn-saban::before{content:'';position:absolute;inset:-35px;z-index:0;background:url('../../assets/experience/tay-nguyen-3d-v2.png') center/cover no-repeat;filter:blur(30px) brightness(.55);opacity:.75;pointer-events:none}
.tn-saban::after{content:'';position:absolute;inset:0;z-index:0;background:#071b1b3b;pointer-events:none}
.tn-viewport{position:relative;min-height:0;overflow:hidden;margin:8px;z-index:1;border-radius:6px;touch-action:none;user-select:none;cursor:zoom-in}
.tn-viewport.is-panning{cursor:grabbing}.tn-viewport:focus-visible{outline:2px solid #ffe5ab;outline-offset:-3px}
.tn-world{position:absolute;background:url('../../assets/experience/tay-nguyen-3d-v2.png') center/100% 100% no-repeat}
.tn-scene{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible}
.tn-scene text{font-family:var(--sans,Arial,sans-serif);font-size:22px;font-weight:650;fill:#1e281c;stroke:#fff5d5;stroke-width:5px;stroke-linejoin:round;paint-order:stroke;letter-spacing:0}
.tn-city>circle{fill:#fff3bd;stroke:#4d3a1f;stroke-width:2}.tn-major-city>text{font-size:31px;font-weight:750;stroke-width:6px}.tn-major-city>circle{fill:#ffe081;stroke-width:3}.tn-city[data-tn-place="2"]>text{fill:#8b241d}
.tn-scene .tn-sea-label{font-size:31px;font-style:italic;fill:#e2f9ff;stroke:#126895;stroke-width:5px;letter-spacing:7px}.tn-scene .tn-neighbor-label{font-size:22px;fill:#edf4d0;stroke:#466e3c;stroke-width:4px;letter-spacing:6px}
.tn-north path{fill:#ffeba7;stroke:#4f4a29;stroke-width:1.5}.tn-scene .tn-north text{font-size:22px;fill:#fff0b7;stroke:#40552e;stroke-width:3px}
.tn-layer{opacity:0;visibility:hidden}.tn-layer.is-visible{opacity:1;visibility:visible}
.tn-solid-arrow>path{stroke:#fff2bd;stroke-width:2.3;stroke-linejoin:round;stroke-linecap:round;paint-order:stroke fill}.tn-solid-arrow.tn-blue>path{fill:#155ed4}.tn-solid-arrow.tn-red>path{fill:#fa3122}.tn-solid-arrow.tn-black>path{fill:#212728;stroke:#fff2bd;stroke-width:2}.tn-solid-arrow .tn-dashed-arrow{fill:none;stroke:#212728;stroke-width:13;stroke-linecap:butt;stroke-dasharray:16 12}
.tn-solid-arrow.tn-black>path.tn-dashed-arrow{fill:none;stroke:#212728;stroke-width:13;stroke-dasharray:16 12}
.tn-reveal{fill:none;stroke:#fff;stroke-width:100;stroke-dasharray:1;stroke-dashoffset:1;stroke-linecap:square}
.tn-layer.is-visible .tn-reveal{stroke-dashoffset:0}.tn-layer.is-current .tn-reveal{animation:tn-draw 3.2s var(--tn-delay,0s) ease both}
.tn-focus{stroke-width:5;stroke-dasharray:8 9}.tn-focus-blue{stroke:#1253ba;fill:#1253ba10}.tn-focus-red{stroke:#ef281c;fill:#ef281c14}
.tn-flag>circle{fill:#be201b;stroke:#ffe9a4;stroke-width:3}.tn-flag .tn-star{fill:#ffe260;stroke:none}.tn-layer.is-current .tn-flag{animation:tn-flag-reveal .5s 1.8s both}
.tn-saban:has(.tn-layer[data-tn-layer="3"].is-visible) .tn-major-city>circle{opacity:0}
.tn-info{position:absolute;left:39%;top:64.5%;transform:translate(-50%,-50%);width:36px;height:36px;padding:0;display:grid;place-items:center;border:2px solid #ffe3a1;border-radius:50%;background:#152e29ed;color:#fff2cc;font:700 italic 24px/1 Georgia,serif;cursor:pointer;animation:tn-pulse 1.8s ease-in-out infinite}.tn-info span{animation:tn-blink 1.8s ease-in-out infinite}.tn-info:hover,.tn-info:focus-visible,.tn-info:hover span,.tn-info:focus-visible span{animation:none}.tn-info:focus-visible{outline:3px solid #fff1c8;outline-offset:4px}
.teaching-slide .tn-title{position:absolute;left:19px;top:18px;z-index:2;pointer-events:none;padding:8px 18px 10px 12px;background:linear-gradient(90deg,#122b24e8,#122b2480,transparent);border-radius:5px;color:#fff0c8}
.teaching-slide .tn-title h2{font:750 clamp(22px,2.4vw,38px)/1.2 var(--serif);color:#fff0c8;margin:0;text-shadow:0 2px 3px #102a21}
.teaching-slide .tn-title p{font:550 12px/1.5 var(--sans);color:#f1d896;margin:5px 0 0;letter-spacing:1px}
.tn-controls{position:absolute;right:20px;bottom:35px;z-index:3;display:flex;flex-direction:column;gap:12px;margin:0;padding:0;background:none;border:0}
.tn-controls button{position:relative;appearance:none;box-sizing:border-box;width:64px;height:64px;min-height:64px;display:grid;place-items:center;margin:0;padding:0;border:1px solid #b6a071;border-radius:50%;background:radial-gradient(circle at 35% 25%,#3d514b,#182b29 75%);color:#f6e5bf;font:750 13px/1 var(--sans);letter-spacing:0;box-shadow:inset 0 0 0 4px #18201d,inset 0 0 0 5px #b69c5f55,0 4px 12px #0005;cursor:pointer;transition:transform .2s,box-shadow .2s,border-color .2s}
.tn-controls button[data-tn-phase="2"]{background:radial-gradient(circle at 35% 25%,#883c37,#4b2023 75%);border-color:#c6aa71;box-shadow:inset 0 0 0 4px #4b2023,inset 0 0 0 5px #d6b87655,0 4px 12px #0005;font-size:11px}
.tn-controls button[data-tn-phase="3"]{background:radial-gradient(circle at 35% 25%,#8c7140,#3b3524 75%)}
.tn-controls button:hover{transform:translateY(-2px);border-color:#ffe0a2}.tn-controls button[aria-pressed=true]{border-color:#ffe5ab;box-shadow:inset 0 0 0 4px #352b20,inset 0 0 0 5px #e8c78499,0 0 18px #f7c96c77,0 4px 12px #0005}.tn-controls button:focus-visible{outline:2px solid #ffe5ab;outline-offset:4px}
.tn-controls button::after{content:attr(data-tooltip);position:absolute;right:calc(100% + 12px);top:50%;transform:translate(5px,-50%);padding:7px 10px;border:1px solid #b6a07188;border-radius:5px;background:#14251cf0;color:#f6e5bf;font:500 13px/1.4 var(--sans);white-space:nowrap;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .18s,transform .18s}.tn-controls button:hover::after,.tn-controls button:focus-visible::after{opacity:1;visibility:visible;transform:translate(0,-50%)}
.teaching-slide .tn-caption{position:absolute;left:20px;bottom:25px;z-index:2;max-width:min(730px,calc(100% - 130px));margin:0;padding:10px 15px;border-left:3px solid #dfbd75;border-radius:0 5px 5px 0;background:#112c25ed;color:#fff0cd;font:500 clamp(14px,1.2vw,20px)/1.6 var(--sans);pointer-events:none}.tn-caption[hidden]{display:none}.tn-caption>b{display:inline-block;color:#f0cc7d;margin-right:12px}.tn-caption>span strong{font-weight:750;color:#ffdfa0}
.teaching-slide .tn-map-credit{position:absolute;right:18px;bottom:9px;z-index:2;margin:0;color:#e5d4ad;font:400 8px/1.4 var(--sans);pointer-events:none}
.tn-info-dialog{width:min(900px,94vw);max-width:none;max-height:90dvh;box-sizing:border-box;padding:22px 26px;border:2px solid #c5a365;border-radius:12px;background:#14271ffb;color:#fff0cd;box-shadow:0 12px 60px #0008;overflow:hidden}.tn-info-dialog[open]{display:flex;flex-direction:column;gap:16px}.tn-info-dialog::backdrop{background:#07110cc4;backdrop-filter:blur(3px)}
.tn-info-dialog>header{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-shrink:0;padding:0 0 13px;margin:0;border-bottom:1px solid #c5a36566}.tn-info-dialog header p{font:500 10px/1.5 var(--sans);letter-spacing:1px;color:#dfbd75;margin:0 0 5px}.tn-info-dialog h2{font:650 27px/1.3 var(--serif);margin:0;color:#fff0cd}.tn-info-dialog [data-tn-close]{flex-shrink:0;width:38px;height:38px;border:1px solid #c5a36588;border-radius:8px;background:#ffffff08;color:#f3d598;font:26px/1 var(--sans);cursor:pointer}.tn-info-scroll{min-height:0;overflow:auto;scrollbar-width:thin;scrollbar-color:#bca371 #163529;padding-right:4px}
.tn-info-timeline{list-style:none;margin:0;padding:0;display:grid;gap:15px}.tn-info-timeline li{padding:0 0 13px;border-bottom:1px solid #c5a36533}.tn-info-timeline h3{font:700 21px/1.3 var(--serif);margin:0 0 7px;color:#ebcc8c}.tn-info-timeline p{font:400 18px/1.6 var(--sans);margin:0;color:#fff0cd}.tn-info-timeline strong{font-weight:700;color:#ffe0a5}
.tn-info-legend{display:flex;gap:10px 20px;flex-wrap:wrap;margin:20px 0;color:#e1d4b6;font:400 12px/1.5 var(--sans)}.tn-info-legend>span{display:flex;gap:7px;align-items:center}.tn-info-legend i{display:inline-block;width:23px;height:4px;background:#151a1a;box-shadow:0 0 0 1px #e9d79d55}.tn-info-legend .tn-blue{background:#1253ba}.tn-info-legend .tn-red{background:#ee281b}
.tn-info-photos{display:grid;grid-template-columns:1fr 1.5fr;align-items:center;gap:25px;margin:15px 0}.tn-info-photos figure{margin:0;text-align:center}.tn-info-photos img{display:block;height:auto;max-height:230px;max-width:100%;width:auto;margin:0 auto;border:3px solid #f5e4b9}.tn-info-photos figure:first-child img{max-width:137px;max-height:92px}.tn-info-photos figcaption{font:400 10px/1.5 var(--sans);color:#c8b48c;margin-top:7px}
.tn-original{margin-top:20px;border-top:1px solid #c5a36555;padding-top:12px}.tn-original summary{cursor:pointer;font:500 14px/1.5 var(--sans);color:#ebcc8c;padding:8px 0}.tn-original img{width:100%;height:auto;display:block;margin-top:12px}.tn-info-dialog .tn-source-note{font:400 11px/1.7 var(--sans);color:#c6b99a;margin:18px 0 0}
@keyframes tn-draw{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}@keyframes tn-flag-reveal{from{opacity:0}to{opacity:1}}@keyframes tn-pulse{0%,100%{box-shadow:0 0 0 4px #f7d17d38}50%{box-shadow:0 0 0 10px #f7d17d00}}@keyframes tn-blink{0%,100%{opacity:1}50%{opacity:.45}}
@media(max-width:720px){.teaching-slide.slide-tay-nguyen{padding:8px 0;min-height:400px}.tn-controls{right:12px;bottom:35px;gap:10px}.tn-controls button{width:54px;height:54px;min-height:54px;font-size:12px}.tn-controls button[data-tn-phase="2"]{font-size:10px}.tn-controls button::after{white-space:normal;width:180px;font-size:11px}.teaching-slide .tn-title{left:12px;top:12px;padding:7px 12px}.teaching-slide .tn-title h2{font-size:21px}.teaching-slide .tn-title p{font-size:10px}.teaching-slide .tn-caption{left:12px;bottom:35px;max-width:calc(100% - 100px);padding:7px 10px;font-size:12px;line-height:1.55}.tn-caption>b{display:block;margin:0 0 3px}.tn-info{width:29px;height:29px;font-size:20px}.tn-controls button[data-tn-phase="3"]:after{top:auto;bottom:0;transform:none}.teaching-slide .tn-map-credit{right:12px;bottom:10px;font-size:7px}.tn-info-dialog{padding:17px 18px}.tn-info-dialog h2{font-size:23px}.tn-info-timeline p{font-size:16px}.tn-info-photos{gap:15px;grid-template-columns:1fr 1.2fr}}
@media(prefers-reduced-motion:reduce){.tn-info,.tn-info span,.tn-layer.is-current .tn-reveal,.tn-layer.is-current .tn-flag{animation:none}.tn-layer.is-visible .tn-reveal{stroke-dashoffset:0}.tn-controls button,.tn-controls button::after{transition:none}}