/* AeroSpeak · componentes de interação, Estação de Escuta, cockpit e movimento */
:root{--ease:cubic-bezier(.2,.8,.2,1);--spring:cubic-bezier(.34,1.56,.64,1);--ink:#1d1d1f;--paper:#fff;--soft:#f5f5f7;--hair:#e5e5ea;--blue:#2f7cf6}

/* ---------- Dock de leitura (página inteira) ---------- */
.reader-dock{position:sticky;top:76px;z-index:20;display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:0 0 14px;padding:6px;border-radius:16px;background:rgba(255,255,255,.8);backdrop-filter:blur(20px) saturate(1.7);-webkit-backdrop-filter:blur(20px) saturate(1.7);box-shadow:0 1px 0 #0000000a,0 8px 28px #0000000f,inset 0 0 0 1px #0000000d;overflow:hidden}
.rd-btn{position:relative;display:inline-flex;align-items:center;gap:7px;height:40px;padding:0 14px;border:0;border-radius:11px;background:transparent;color:var(--ink);font:600 13.5px var(--body);cursor:pointer;transition:background .15s,color .15s,transform .12s var(--ease)}
.rd-btn:hover{background:#0000000a}
.rd-btn svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linejoin:round;stroke-linecap:round}
.rd-play{background:var(--ink);color:#fff}
.rd-play:hover{background:#000}
.rd-play svg{fill:currentColor;stroke:none}
.rd-play .i-pause,.rd-play[aria-pressed=true] .i-play{display:none}
.rd-play[aria-pressed=true] .i-pause{display:block}
.rd-play[aria-pressed=true]{background:#D71920}
.rd-btn b{display:grid;place-items:center;width:24px;height:20px;border-radius:5px;background:var(--blue);color:#fff;font:700 10px var(--mono)}
.rd-tr[aria-pressed=true]{background:#2f7cf614;color:#1a5fd0}
.rd-rate{font:600 12.5px var(--mono);color:#6e6e73}
.rd-progress{position:absolute;left:0;right:0;bottom:0;height:2px}
.rd-progress i{display:block;height:100%;width:0;background:var(--blue);transition:width .3s var(--ease)}
@media(max-width:700px){.reader-dock{top:64px;gap:2px;padding:4px}.rd-btn{padding:0 10px;font-size:12.5px;height:38px}.rd-btn[data-rd=copy] span{display:none}}

/* ---------- Barra por bloco ---------- */
.block-bar{position:fixed;z-index:58;display:flex;gap:2px;padding:4px;border-radius:12px;background:rgba(22,22,24,.88);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);box-shadow:0 10px 30px #0000003a,inset 0 0 0 1px #ffffff14;opacity:0;transform:translateY(4px) scale(.96);transition:opacity .14s var(--ease),transform .14s var(--ease)}
.block-bar.is-on{opacity:1;transform:none}
.block-bar button{display:inline-flex;align-items:center;gap:6px;padding:7px 10px;border:0;border-radius:9px;background:transparent;color:#fff;font:600 12px var(--body);cursor:pointer}
.block-bar button:hover{background:#ffffff1f}
.block-bar svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.block-bar b{display:grid;place-items:center;width:22px;height:17px;border-radius:4px;background:var(--blue);font:700 9px var(--mono)}
.block-bar:not(.is-docked) span{display:none}
.block-bar.is-docked{left:50%!important;top:auto!important;bottom:calc(var(--tabbar-h,64px) + 14px + env(safe-area-inset-bottom));transform:translate(-50%,8px);padding:5px}
.block-bar.is-docked.is-on{transform:translate(-50%,0)}
.block-bar.is-docked button{padding:10px 14px;font-size:13px}
@media(min-width:981px){.block-bar.is-docked{bottom:24px}}

/* ---------- Seletor de tema ---------- */
.theme-switch{display:grid;gap:6px;margin-bottom:14px}
.theme-switch>span{font:600 9px var(--mono);letter-spacing:.08em;color:#777}
.theme-switch>div{display:grid;grid-template-columns:repeat(3,1fr);gap:3px;padding:3px;border-radius:11px;background:#0000000d}
.theme-switch button{padding:8px 4px;border:0;border-radius:8px;background:transparent;color:#424245;font:600 12px var(--body);cursor:pointer;transition:background .15s,box-shadow .15s}
.theme-switch button[aria-checked=true]{background:#fff;color:#1d1d1f;box-shadow:0 1px 4px #00000024}

/* ---------- Cockpit (hero) ---------- */
.cockpit{position:relative;padding:18px 18px 14px;border-radius:22px;background:radial-gradient(120% 90% at 50% -10%,#1d2127,#0b0d10 70%);color:#e8e8ec;box-shadow:0 30px 60px -20px #00000066,inset 0 0 0 1px #ffffff12;overflow:hidden}
.cockpit::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(0deg,#ffffff03 0 2px,transparent 2px 4px);pointer-events:none}
.ck-head{display:flex;justify-content:space-between;gap:10px;font:500 9.5px var(--mono);letter-spacing:.12em;color:#8b8d93}
.ck-head b{color:#ff5a60;font-weight:600}
.ck-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}
.ck-inst{margin:0;text-align:center}
.ck-inst svg{width:100%;max-width:150px;aspect-ratio:1;display:block;margin:auto;overflow:visible}
.ck-inst figcaption{margin-top:4px;font:500 8.5px var(--mono);letter-spacing:.16em;color:#6c6f76}
.ck-inst .bezel{fill:#121418;stroke:#2a2e35;stroke-width:3}
.ck-inst .ticks line{stroke:#9aa0a8;stroke-width:1.2}
.ck-inst .arc-bg{fill:none;stroke:#23272e;stroke-width:6}
.ck-inst .arc{fill:none;stroke:#ff3b42;stroke-width:6;stroke-linecap:round;transform:rotate(-90deg);transform-origin:60px 60px;filter:drop-shadow(0 0 6px #ff3b4288);animation:ck-arc 1.6s var(--ease) both}
@keyframes ck-arc{from{stroke-dasharray:0 100}}
.ck-inst text{fill:#f2f2f5;text-anchor:middle;font-family:var(--mono)}
.ck-inst .big{font-size:15px;font-weight:700;letter-spacing:.02em}
.ck-inst .small{font-size:6.5px;fill:#8b8d93;letter-spacing:.12em}
.ck-hdg .rose{transform-origin:60px 60px;transform:rotate(var(--hdg));animation:ck-rose 2.2s var(--ease) both}
@keyframes ck-rose{from{transform:rotate(calc(var(--hdg) + 120deg))}}
.ck-hdg .rose text{font-size:9px;font-weight:700;fill:#cfd2d8}
.ck-hdg .rose text:first-of-type{fill:#ff5a60}
.ck-hdg .needle{fill:#ff3b42;filter:drop-shadow(0 0 4px #ff3b4299)}
.ck-att .sky{fill:#1f4f8f}.ck-att .earth{fill:#6b4423}.ck-att .hz{stroke:#fff;stroke-width:1.4}
.ck-att .pitch line{stroke:#ffffffb0;stroke-width:1}
.ck-att .horizon{transform-origin:60px 60px;animation:ck-bank 7s ease-in-out infinite}
@keyframes ck-bank{0%,100%{transform:rotate(-7deg) translateY(3px)}50%{transform:rotate(6deg) translateY(-4px)}}
.ck-att .wings{fill:none;stroke:#ffb020;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}
.ck-route{display:flex;align-items:center;gap:12px;margin-top:10px}
.ck-route svg{flex:1;height:30px}
.ck-route .rt-bg{fill:none;stroke:#2a2e35;stroke-width:2;stroke-dasharray:4 5}
.ck-route .rt-fg{fill:none;stroke:#ff3b42;stroke-width:2.5;stroke-linecap:round;animation:ck-arc 1.8s var(--ease) both}
.ck-route span{font:500 10px var(--mono);color:#8b8d93;white-space:nowrap}
.hero-side .cockpit + .stats{margin-top:12px}
@media(max-width:520px){.ck-row{gap:4px}.ck-inst figcaption{font-size:7.5px}}

/* ---------- Entrada em cascata ---------- */
.rv{opacity:0;transform:translateY(14px);transition:opacity .55s var(--ease),transform .55s var(--ease);transition-delay:var(--d,0ms)}
.rv.is-in{opacity:1;transform:none}

/* ---------- Transições de tela ---------- */
::view-transition-old(root),::view-transition-new(root){animation-duration:.32s;animation-timing-function:var(--ease)}
html[data-vt=page]::view-transition-old(root){animation-name:vt-out}
html[data-vt=page]::view-transition-new(root){animation-name:vt-in}
@keyframes vt-out{to{opacity:0;transform:translateY(-8px)}}
@keyframes vt-in{from{opacity:0;transform:translateY(10px)}}
::view-transition-group(hero-title){animation-duration:.45s;animation-timing-function:var(--ease)}
.top{view-transition-name:topbar}
.tabbar{view-transition-name:tabbar}
.listen-dock{view-transition-name:listendock}

/* ---------- Microinterações ---------- */
.btn,.course-card,.topic-card,.track,.rd-btn,.icon-btn,.tabbar a,.tabbar button{transition-property:transform,background,border-color,box-shadow,color;transition-duration:.18s;transition-timing-function:var(--ease)}
.is-press{transform:scale(.97)!important}
#markRead.just-done{animation:done-pop .55s var(--spring)}
@keyframes done-pop{0%{transform:scale(.92)}60%{transform:scale(1.06)}100%{transform:none}}
#topPct.bump{animation:bump .7s var(--spring)}
@keyframes bump{40%{transform:translateY(-4px) scale(1.25);color:#D71920}}

/* ---------- Carimbo de conquista ---------- */
.stamp{position:fixed;inset:0;z-index:90;display:grid;place-items:center;pointer-events:none;background:radial-gradient(circle,#00000040,transparent 60%);animation:fade-in .2s}
.stamp div{display:grid;gap:6px;padding:22px 34px;border:4px solid #D71920;border-radius:14px;background:#fffffff0;color:#D71920;text-align:center;transform:rotate(-8deg);animation:stamp-in .5s var(--spring) both;box-shadow:0 20px 60px #00000040}
.stamp b{font:700 clamp(34px,7vw,64px)/1 var(--display);letter-spacing:.06em}
.stamp small{font:600 11px var(--mono);letter-spacing:.1em;color:#5a5a5f}
.stamp.is-out{opacity:0;transition:opacity .5s}
@keyframes stamp-in{from{transform:rotate(-14deg) scale(2.2);opacity:0}}
@keyframes fade-in{from{opacity:0}}

/* ---------- Missões: TX / RX ---------- */
.mission-recorder{position:relative}
.ptt-light{display:inline-flex;align-items:center;gap:6px;margin-right:8px;padding:5px 9px;border-radius:999px;background:#0000000d;color:#8a8a8f;font:700 10px var(--mono);letter-spacing:.12em}
.ptt-light i{width:8px;height:8px;border-radius:50%;background:#bdbdc2}
.is-tx .ptt-light{background:#D71920;color:#fff}
.is-tx .ptt-light i{background:#fff;animation:pulse 1s infinite}
@keyframes pulse{50%{opacity:.25}}
.rx-wave{display:flex;align-items:center;gap:3px;height:42px;margin-bottom:8px;padding:0 12px;border-radius:12px;background:#111315}
.rx-wave i{flex:1;max-width:6px;height:12%;border-radius:3px;background:#3a3e46;transition:height .2s}
.rx-wave span{margin-left:auto;padding-left:10px;font:600 9px var(--mono);letter-spacing:.12em;color:#6c6f76;white-space:nowrap}
.is-rx .rx-wave i{background:#ff4a51;animation:eq .9s ease-in-out infinite;animation-delay:calc(var(--i) * -63ms)}
.is-rx .rx-wave span{color:#ff8a8f}
@keyframes eq{0%,100%{height:15%}50%{height:85%}}

/* ---------- Mapa ICAO: subida ---------- */
.icao-climb{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:20px;align-items:center;margin:0 0 26px;padding:22px;border-radius:20px;background:radial-gradient(120% 120% at 100% 0,#1d2127,#0b0d10 70%);color:#e8e8ec;box-shadow:inset 0 0 0 1px #ffffff12}
.ic-copy span{font:600 9.5px var(--mono);letter-spacing:.14em;color:#ff5a60}
.ic-copy h2{margin:8px 0;font:600 30px/1.05 var(--display);text-transform:uppercase;color:#fff}
.ic-copy h2 b{color:#ff3b42;font-size:1.4em}
.ic-copy p{margin:0;color:#a7a9b0;font:14px/1.55 var(--body)}
.icao-climb svg{width:100%;overflow:visible}
.ic-lv line{stroke:#2a2e35;stroke-dasharray:3 5}
.ic-lv text{fill:#6c6f76;font:600 12px var(--mono)}
.ic-lv.is-min line{stroke:#ffb02066;stroke-dasharray:none}
.ic-lv .ic-tag{fill:#ffb020;font-size:8.5px;letter-spacing:.12em;text-anchor:end}
.ic-path{fill:none;stroke:#ff3b42;stroke-width:3;stroke-linecap:round;stroke-dasharray:100;stroke-dashoffset:100;animation:draw 1.6s var(--ease) .2s forwards;filter:drop-shadow(0 0 6px #ff3b4277)}
@keyframes draw{to{stroke-dashoffset:0}}
.ic-plane{fill:#fff;transform:translate(40px,174px);animation:climb 1.6s var(--ease) .2s forwards}
@keyframes climb{to{transform:translate(var(--x),var(--y))}}
@media(max-width:760px){.icao-climb{grid-template-columns:1fr}}

/* ---------- Estação de Escuta ---------- */
.listen-hero{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px;align-items:center;margin:16px 0 18px;padding:clamp(24px,4vw,44px);border-radius:26px;background:radial-gradient(90% 120% at 100% 0,#2a0d10,#0b0d10 62%);color:#f2f2f5;overflow:hidden;box-shadow:inset 0 0 0 1px #ffffff12}
.listen-hero .eyebrow{color:#ff6a70}
.listen-hero h1{margin:10px 0 12px;font:700 clamp(38px,5.6vw,70px)/.92 var(--display);text-transform:uppercase;letter-spacing:.005em}
.listen-hero h1 em{font-style:normal;color:#ff3b42}
.listen-hero p{max-width:46ch;margin:0;color:#b5b7be;font:16px/1.6 var(--body)}
.lh-stats{display:flex;gap:26px;margin-top:24px}
.lh-stats b{display:block;font:600 30px/1 var(--display);color:#fff}
.lh-stats small{color:#8b8d93;font:500 10px var(--mono);letter-spacing:.08em;text-transform:uppercase}
.lh-wave{display:flex;align-items:center;gap:4px;height:180px}
.lh-wave i{flex:1;height:var(--h);border-radius:4px;background:linear-gradient(#ff5a60,#D71920);opacity:.85;transform-origin:center;animation:wave 2.4s ease-in-out infinite;animation-delay:calc(var(--i) * -90ms)}
@keyframes wave{0%,100%{transform:scaleY(.35)}50%{transform:scaleY(1)}}
.is-listening .lh-wave i{animation-duration:.9s}
@media(max-width:820px){.listen-hero{grid-template-columns:1fr}.lh-wave{height:70px;order:-1}}

.listen-today{display:grid;gap:10px;margin:0 0 18px;padding:18px 20px;border-radius:20px;background:var(--paper);border:1px solid var(--hair);box-shadow:0 12px 34px #0000000d}
.lt-tag{font:600 9.5px var(--mono);letter-spacing:.14em;color:#D71920}
.lt-main{display:flex;flex-wrap:wrap;align-items:center;gap:16px}
.lt-play{display:grid;place-items:center;width:58px;height:58px;border:0;border-radius:50%;background:#D71920;color:#fff;cursor:pointer;box-shadow:0 10px 24px #d7192055;transition:transform .2s var(--spring)}
.lt-play:hover{transform:scale(1.07)}
.lt-play svg{width:24px;height:24px;fill:currentColor;margin-left:3px}
.lt-main h2{margin:0;font:600 26px/1 var(--display);text-transform:uppercase}
.lt-main p{margin:4px 0 0;color:#6e6e73;font:14px var(--body)}
.lt-go{margin-left:auto;color:#D71920;font:600 13px var(--body);text-decoration:none}
.listen-today.is-waiting .lt-play{background:#c7c7cc;box-shadow:none}

.listen-setup{display:flex;gap:16px;align-items:flex-start;margin:0 0 18px;padding:18px 20px;border-radius:18px;border:1.5px dashed #d7192055;background:#d7192008}
.ls-icon{flex:none;display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:#D71920;color:#fff}
.ls-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.listen-setup h3{margin:0 0 4px;font:600 17px var(--body)}
.listen-setup p{margin:0;color:#424245;font:14px/1.55 var(--body)}
.listen-setup code{padding:1px 6px;border-radius:5px;background:#0000000d;font:12.5px var(--mono)}

.listen-filters{position:sticky;top:72px;z-index:15;display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:0 -6px 18px;padding:10px 6px;background:linear-gradient(var(--bg,#fff) 70%,transparent)}
.lf-chips,.lf-units{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none}
.lf-units{flex-basis:100%}
.lf-chips button,.lf-units button{flex:none;padding:8px 14px;border:1px solid var(--hair);border-radius:999px;background:var(--paper);color:#424245;font:600 12.5px var(--body);cursor:pointer;white-space:nowrap}
.lf-chips button[aria-pressed=true],.lf-units button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.lf-search{display:flex;align-items:center;gap:8px;margin-left:auto;padding:0 12px;height:38px;border:1px solid var(--hair);border-radius:999px;background:var(--paper)}
.lf-search svg{width:16px;height:16px;fill:none;stroke:#8e8e93;stroke-width:2;stroke-linecap:round}
.lf-search input{width:170px;border:0;outline:0;background:transparent;font:14px var(--body);color:inherit}
@media(max-width:700px){.listen-filters{top:60px}.lf-search{margin-left:0;flex:1}.lf-search input{width:100%}}

.listen-unit{margin:0 0 26px}
.listen-unit[hidden]{display:none}
.listen-unit header{display:flex;align-items:center;gap:12px;margin-bottom:10px}
.lu-ring{width:40px;height:40px;flex:none;transform:rotate(-90deg)}
.lu-ring circle{fill:none;stroke:#e5e5ea;stroke-width:3.5}
.lu-ring circle+circle{stroke:#D71920;stroke-linecap:round;transition:stroke-dasharray .6s var(--ease)}
.listen-unit header small{font:600 9.5px var(--mono);letter-spacing:.12em;color:#D71920;text-transform:uppercase}
.listen-unit header h2{margin:2px 0 0;font:600 20px/1.1 var(--display);text-transform:uppercase}
.listen-unit header>span{margin-left:auto;font:500 12px var(--mono);color:#8e8e93}
.lu-all{padding:8px 12px;border:1px solid var(--hair);border-radius:10px;background:var(--paper);font:600 12px var(--body);color:var(--ink);cursor:pointer;white-space:nowrap}
@media(max-width:600px){.lu-all{display:none}}
.lu-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px}
.track{position:relative;display:flex;align-items:center;gap:12px;padding:10px 12px 10px 10px;border-radius:14px;background:var(--paper);border:1px solid var(--hair)}
.track:hover{border-color:#c7c7cc;box-shadow:0 6px 18px #0000000d}
.track.is-hidden{display:none}
.tr-play{position:relative;display:grid;place-items:center;flex:none;width:40px;height:40px;border:0;border-radius:50%;background:var(--ink);color:#fff;cursor:pointer}
.tr-play svg{width:16px;height:16px;fill:currentColor;margin-left:2px}
.tr-eq{display:none;align-items:flex-end;gap:2px;height:14px}
.tr-eq i{width:3px;height:40%;background:#fff;border-radius:2px;animation:eq .8s ease-in-out infinite}
.tr-eq i:nth-child(2){animation-delay:-.25s}.tr-eq i:nth-child(3){animation-delay:-.5s}
.is-listening .track.is-current .tr-eq{display:flex}
.is-listening .track.is-current .tr-play svg{display:none}
.track.is-current{border-color:#D71920;box-shadow:0 0 0 3px #d719201a}
.track.is-current .tr-play{background:#D71920}
.tr-body{min-width:0;display:grid}
.tr-body b{font:600 16px var(--mono);letter-spacing:-.01em}
.tr-body small{color:#8e8e93;font:12px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.tr-state{width:8px;height:8px;margin-left:auto;border-radius:50%;background:transparent;flex:none}
.track[data-status=done] .tr-state,.track.is-listened .tr-state{background:#34c759}
.track[data-status=due] .tr-state{background:#ff9f0a}
.tr-go{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;color:#8e8e93;text-decoration:none;font:600 15px var(--body)}
.tr-go:hover{background:#0000000a;color:#D71920}
.track.is-missing .tr-play{background:#e5e5ea;color:#aeaeb2;pointer-events:none}
.track.is-missing .tr-body b{color:#aeaeb2}

/* Player fixo */
.listen-dock{position:fixed;left:50%;bottom:16px;z-index:52;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 14px;width:min(760px,calc(100vw - 20px));padding:10px 14px 10px;border-radius:20px;background:rgba(22,22,24,.9);backdrop-filter:blur(24px) saturate(1.6);-webkit-backdrop-filter:blur(24px) saturate(1.6);color:#fff;box-shadow:0 20px 50px #00000059,inset 0 0 0 1px #ffffff14;transform:translateX(-50%);animation:dock-in .4s var(--spring)}
.listen-dock[hidden]{display:none}
@keyframes dock-in{from{transform:translate(-50%,120%)}}
.ld-meta{display:flex;align-items:center;gap:10px;min-width:0}
.ld-meta b{display:block;font:600 14px var(--mono)}
.ld-meta small{display:block;color:#9a9ca3;font:12px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ld-eq{display:flex;align-items:flex-end;gap:2px;width:18px;height:18px}
.ld-eq i{flex:1;height:30%;background:#ff4a51;border-radius:2px}
.is-playing .ld-eq i{animation:eq .8s ease-in-out infinite}
.is-playing .ld-eq i:nth-child(2){animation-delay:-.2s}.is-playing .ld-eq i:nth-child(3){animation-delay:-.45s}.is-playing .ld-eq i:nth-child(4){animation-delay:-.65s}
.ld-ctrl{display:flex;align-items:center;gap:2px}
.ld-ctrl button,.ld-bar button{position:relative;display:grid;place-items:center;min-width:36px;height:36px;border:0;border-radius:10px;background:transparent;color:#fff;cursor:pointer}
.ld-ctrl button:hover,.ld-bar button:hover{background:#ffffff1a}
.ld-ctrl svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ld-ctrl em{position:absolute;font:700 7px var(--mono);font-style:normal;top:14px}
.ld-play{width:44px;height:44px!important;border-radius:50%!important;background:#fff!important;color:#111!important}
.ld-play svg{fill:currentColor;stroke:none;width:20px;height:20px}
.ld-play .i-pause,.is-playing .ld-play .i-play{display:none}
.is-playing .ld-play .i-pause{display:block}
.ld-ctrl [data-ld=loop] span{font:700 10px var(--mono)}
.loop-a [data-ld=loop]{color:#ffb020}.loop-b [data-ld=loop]{background:#ffb020!important;color:#111}
.ld-bar{grid-column:1/-1;display:flex;align-items:center;gap:10px;font:500 11px var(--mono);color:#9a9ca3}
.ld-bar input{flex:1;height:4px;appearance:none;-webkit-appearance:none;border-radius:4px;background:linear-gradient(90deg,#ff4a51 var(--p,0%),#ffffff2e var(--p,0%));cursor:pointer}
.ld-bar input::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:#fff;box-shadow:0 1px 4px #0006}
.ld-bar input::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:50%;background:#fff}
.ld-rate{font:600 11px var(--mono)!important;min-width:40px!important}
body.has-listen-dock{padding-bottom:150px}
@media(max-width:980px){
  .listen-dock{bottom:calc(var(--tabbar-h,64px) + 18px + env(safe-area-inset-bottom));grid-template-columns:1fr;padding:10px 12px}
  .ld-ctrl{justify-content:center}
  body.has-listen-dock{padding-bottom:calc(var(--tabbar-h,64px) + 190px)}
  body.has-listen-dock .sel-bar.is-docked,body.has-listen-dock .block-bar.is-docked{bottom:calc(var(--tabbar-h,64px) + 170px + env(safe-area-inset-bottom))}
}

@media(prefers-reduced-motion:reduce){
  .rv{opacity:1!important;transform:none!important}
  .lh-wave i,.ck-att .horizon,.is-rx .rx-wave i,.tr-eq i,.ld-eq i,.ck-inst .arc,.ck-route .rt-fg,.ck-hdg .rose,.ic-path,.ic-plane,.stamp div{animation:none!important}
  .ic-path{stroke-dashoffset:0}.ic-plane{transform:translate(var(--x),var(--y))}
}

/* ---------- Ajustes de leitura nos cards ---------- */
.ck-att .bezel{fill:none}
.topic-card-body h3{text-transform:none!important;font:600 19px/1.18 var(--body)!important;letter-spacing:-.005em;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
.topic-card-body p{font-size:13.5px!important;line-height:1.5!important}
@media(max-width:620px){.topic-card-body h3{font-size:16px!important}}
.reader-dock{background:rgba(255,255,255,.94)}
html[data-theme=dark] .reader-dock{background:rgba(20,23,27,.95)}
@media(max-width:700px){
  .r-answers-box summary{display:grid;grid-template-columns:1fr auto;align-items:center;gap:4px 10px}
  .r-answers-box summary em{grid-column:1;grid-row:2;margin:0}
  .r-answers-box summary::after{grid-column:2;grid-row:1}
}

/* ---------- Velocidade e tamanho do texto na barra de leitura ---------- */
.content-top .reader-size{display:none}
.rd-group{display:inline-flex;align-items:center;height:40px;padding:0 3px;border-radius:11px;background:#0000000a}
.rd-mini{display:grid;place-items:center;min-width:32px;height:34px;padding:0 6px;border:0;border-radius:8px;background:transparent;color:var(--ink);font:600 17px/1 var(--body);cursor:pointer;transition:background .15s,transform .1s}
.rd-mini:hover:not(:disabled){background:#00000012}
.rd-mini:active:not(:disabled){transform:scale(.92)}
.rd-mini:disabled{opacity:.3;cursor:default}
.rd-group .rd-rate{min-width:44px;text-align:center;font:600 13px var(--mono);color:var(--ink)}
.rd-a{font:700 13px/1 var(--body)}
.rd-a-big{font-size:17px}
.rd-a small{font-size:10px;margin-left:1px}
html[data-theme=dark] .rd-group{background:#ffffff0d}
html[data-theme=dark] .rd-mini,html[data-theme=dark] .rd-group .rd-rate{color:#ececf0}
html[data-theme=dark] .rd-mini:hover:not(:disabled){background:#ffffff14}
@media(max-width:700px){.rd-group{height:38px}.rd-mini{min-width:28px}.rd-group .rd-rate{min-width:38px;font-size:12px}.rd-tr span{display:none}}

/* ---------- Botão explícito Claro / Escuro no cabeçalho ---------- */
.theme-toggle{display:inline-flex;gap:2px;height:38px;padding:3px;border:1px solid var(--line);border-radius:12px;background:#fff}
.theme-toggle button{display:inline-flex;align-items:center;gap:6px;padding:0 10px;border:0;border-radius:9px;background:transparent;color:#6e6e73;font:600 12.5px var(--body);cursor:pointer;transition:background .2s,color .2s}
.theme-toggle svg{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle [data-theme-set=light][aria-checked=true]{background:#fff4d6;color:#a15c00}
.theme-toggle [data-theme-set=dark][aria-checked=true]{background:#1d2127;color:#fff}
.theme-switch>div{grid-template-columns:repeat(2,1fr)}
html[data-theme=dark] .theme-toggle{background:#ffffff08;border-color:#ffffff14}
html[data-theme=dark] .theme-toggle button{color:#9a9ca3}
html[data-theme=dark] .theme-toggle [data-theme-set=dark][aria-checked=true]{background:#2a2e35;color:#fff}
@media(max-width:1180px){.theme-toggle span{display:none}.theme-toggle button{padding:0 8px}}

/* ---------- Escala ICAO: cada nível tem a sua cor, e a seleção usa a cor do nível ---------- */
.icao-module{--l5:#D71920;--l4:#6b6b6b;--l3:#202020;--sel:#D71920}
html[data-theme=dark] .icao-module{--l4:#8b8e96;--l3:#c3c5cb}
.icao-module[data-sel="5"]{--sel:var(--l5)}
.icao-module[data-sel="4"]{--sel:var(--l4)}
.icao-module[data-sel="3"]{--sel:var(--l3)}
.icao-level[data-level="5"]{--lv:var(--l5)}
.icao-level[data-level="4"]{--lv:var(--l4)}
.icao-level[data-level="3"]{--lv:var(--l3)}
.icao-level>b,.icao-level:nth-child(2)>b,.icao-level:nth-child(3)>b{background:var(--lv);transition:transform .25s var(--spring),box-shadow .25s}
html[data-theme=dark] .icao-level[data-level="3"]>b{color:#0c0e11}
.icao-level:hover{border-color:color-mix(in srgb,var(--lv) 55%,transparent);box-shadow:0 3px 12px color-mix(in srgb,var(--lv) 14%,transparent)}
.icao-level.active{border-color:var(--lv);border-width:2px;background:color-mix(in srgb,var(--lv) 9%,var(--panel,#fff));box-shadow:0 0 0 4px color-mix(in srgb,var(--lv) 18%,transparent),0 10px 26px color-mix(in srgb,var(--lv) 20%,transparent);transform:translateY(-2px)}
.icao-level.active>b{transform:scale(1.1);box-shadow:0 0 0 4px color-mix(in srgb,var(--lv) 25%,transparent)}
.icao-level.active span{color:var(--lv)}
html[data-theme=dark] .icao-level.active span{color:#fff}
.icao-module.level-filtered .icao-level:not(.active){opacity:.55}
/* barras: acende a do nível escolhido */
.icao-progress i{opacity:1!important;transition:background .25s,transform .25s}
.icao-progress i[data-l="5"]{background:var(--l5)}
.icao-progress i[data-l="4"]{background:var(--l4)}
.icao-progress i[data-l="3"]{background:var(--l3)}
.icao-module[data-sel] .icao-progress i{opacity:.25!important}
.icao-module[data-sel="5"] .icao-progress i[data-l="5"],.icao-module[data-sel="4"] .icao-progress i[data-l="4"],.icao-module[data-sel="3"] .icao-progress i[data-l="3"]{opacity:1!important;transform:scaleY(2)}
/* descritores: rótulo e destaque na cor do nível */
.icao-descriptor.level-5{--lv:var(--l5)}.icao-descriptor.level-4{--lv:var(--l4)}.icao-descriptor.level-3{--lv:var(--l3)}
.icao-descriptor-label b{color:var(--lv)}
.icao-module.level-filtered .icao-descriptor:not(.is-dim){background:color-mix(in srgb,var(--lv) 8%,transparent)!important;box-shadow:inset 3px 0 var(--lv)!important}
.icao-foot button{color:var(--sel)}
html[data-theme=dark] .icao-module[data-sel="3"] .icao-foot button,html[data-theme=dark] .icao-module[data-sel="4"] .icao-foot button{color:#fff}

/* ---------- Paleta única dos níveis ICAO (site inteiro) ---------- */
:root{--lv1:#8e1b1b;--lv2:#d63a2a;--lv3:#ef7d00;--lv4:#e0a800;--lv5:#1f9d63;--lv6:#2f6fe0}
html[data-theme=dark]{--lv1:#c0392b;--lv2:#ff5a47;--lv3:#ff9a1f;--lv4:#ffc21a;--lv5:#34c77b;--lv6:#5b93ff}
.icao-module,html[data-theme=dark] .icao-module{--l5:var(--lv5);--l4:var(--lv4);--l3:var(--lv3)}
.icao-level[data-level="4"]>b{color:#1d1d1f!important}

/* ---------- Mapa ICAO: gráfico completo ---------- */
.icao-climb{grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr)!important;gap:24px!important;padding:24px!important}
.ic-copy h2{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 10px}
.ic-copy h2 b{font-size:1.6em!important}
.ic-copy h2 em{font-style:normal;font:600 15px var(--mono);letter-spacing:.06em;text-transform:uppercase;padding:3px 8px;border-radius:6px;background:#ffffff14}
.icao-climb.lv-1 .ic-copy h2 b{color:var(--lv1)!important}.icao-climb.lv-2 .ic-copy h2 b{color:var(--lv2)!important}.icao-climb.lv-3 .ic-copy h2 b{color:var(--lv3)!important}
.icao-climb.lv-4 .ic-copy h2 b{color:var(--lv4)!important}.icao-climb.lv-5 .ic-copy h2 b{color:var(--lv5)!important}.icao-climb.lv-6 .ic-copy h2 b{color:var(--lv6)!important}
.ic-copy p strong{color:#fff}
.ic-gap{margin-top:10px!important;padding:10px 12px;border-radius:10px;background:#ffffff0d;color:#e8e8ec!important}
.ic-legend{display:grid;gap:6px;margin:14px 0 0;padding:0;list-style:none;font:500 12px var(--body);color:#a7a9b0}
.ic-legend li{display:flex;align-items:center;gap:8px}
.ic-legend i{width:12px;height:12px;border-radius:3px}
.ic-legend .z-min i{background:var(--lv4)}.ic-legend .z-goal i{background:var(--lv5)}.ic-legend .z-top i{background:var(--lv6)}
.ic-chart svg{width:100%;height:auto;overflow:visible;font-family:var(--body)}
.ic-band rect{fill:currentColor;opacity:.09}
.ic-band.is-you rect{opacity:.28}
.ic-band.l1{color:var(--lv1)}.ic-band.l2{color:var(--lv2)}.ic-band.l3{color:var(--lv3)}.ic-band.l4{color:var(--lv4)}.ic-band.l5{color:var(--lv5)}.ic-band.l6{color:var(--lv6)}
.ic-num{fill:currentColor}
.ic-numt{fill:#fff;font:700 15px var(--display);text-anchor:middle}
.ic-band.l4 .ic-numt{fill:#1d1d1f}
.ic-name{fill:#f2f2f5;font:700 12px var(--mono);letter-spacing:.06em}
.ic-name2{fill:#8b8d93;font:500 10.5px var(--body)}
.ic-band.is-you .ic-name{fill:currentColor}
.ic-minline{stroke:var(--lv4);stroke-width:2.5}
.ic-mintag{fill:var(--lv4);font:700 9.5px var(--mono);letter-spacing:.12em;text-anchor:end}
.ic-zone path{fill:none;stroke-width:2.5;stroke-linecap:round}
.ic-zone.z-below path{stroke:var(--lv2)}.ic-zone.z-min path{stroke:var(--lv4)}.ic-zone.z-goal path{stroke:var(--lv5)}.ic-zone.z-top path{stroke:var(--lv6)}
.ic-zt{font:700 11px var(--mono);letter-spacing:.1em}
.ic-zone.z-below .ic-zt{fill:var(--lv2)}.ic-zone.z-min .ic-zt{fill:var(--lv4)}.ic-zone.z-goal .ic-zt{fill:var(--lv5)}.ic-zone.z-top .ic-zt{fill:var(--lv6)}
.ic-zs{fill:#9a9ca3;font:500 10.5px var(--body)}
.icao-climb .ic-path{fill:none;stroke:#fff;stroke-width:2.5;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:100;animation:draw 1.4s var(--ease) .2s forwards;filter:drop-shadow(0 0 5px #ffffff55);opacity:.9}
.ic-dot circle{fill:#0b0d10;stroke-width:3.5;transform-box:fill-box;transform-origin:center;animation:dot-in .45s var(--spring) both;animation-delay:var(--d)}
.ic-dot.l1 circle{stroke:var(--lv1)}.ic-dot.l2 circle{stroke:var(--lv2)}.ic-dot.l3 circle{stroke:var(--lv3)}.ic-dot.l4 circle{stroke:var(--lv4)}.ic-dot.l5 circle{stroke:var(--lv5)}.ic-dot.l6 circle{stroke:var(--lv6)}
.ic-dot.is-weak circle{fill:currentColor;stroke:#fff;r:10}
.ic-dot.l1{color:var(--lv1)}.ic-dot.l2{color:var(--lv2)}.ic-dot.l3{color:var(--lv3)}.ic-dot.l4{color:var(--lv4)}.ic-dot.l5{color:var(--lv5)}.ic-dot.l6{color:var(--lv6)}
.ic-dot.is-unset circle{stroke-dasharray:3 3}
@keyframes dot-in{from{transform:scale(0)}}
.ic-sk{fill:#9a9ca3;font:600 9px var(--mono);letter-spacing:.06em;text-anchor:middle}
.ic-dot.is-weak .ic-sk{fill:#fff}
.ic-stem{stroke:#ffffff1a;stroke-dasharray:2 4}
.icao-climb .ic-plane{fill:#fff;transform:translate(var(--x),var(--y0));animation:climb2 1.6s var(--ease) .3s forwards;filter:drop-shadow(0 4px 8px #0008)}
@keyframes climb2{to{transform:translate(var(--x),var(--y))}}
@media(max-width:900px){.icao-climb{grid-template-columns:1fr!important}}
@media(prefers-reduced-motion:reduce){.icao-climb .ic-path{stroke-dashoffset:0}.icao-climb .ic-plane{transform:translate(var(--x),var(--y))}.ic-dot circle{animation:none}}
/* claro: o painel continua escuro (cockpit), então as cores de texto acima valem nos dois temas */
.profile-levels button[data-profile-level="3"].selected{background:var(--lv3)!important;border-color:var(--lv3)!important;color:#fff!important}
.profile-levels button[data-profile-level="4"].selected{background:var(--lv4)!important;border-color:var(--lv4)!important;color:#1d1d1f!important}
.profile-levels button[data-profile-level="5"].selected{background:var(--lv5)!important;border-color:var(--lv5)!important;color:#fff!important}
@media(max-width:700px){.ic-chart{margin:0 -24px;padding:0 24px 6px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}.ic-chart svg{min-width:640px}}

/* ---------- Seletor de idioma 🇧🇷 | 🇬🇧 ---------- */
.lang-toggle{display:inline-flex;gap:2px;height:38px;padding:3px;border:1px solid var(--line);border-radius:12px;background:#fff}
.lang-toggle button{display:inline-flex;align-items:center;gap:6px;padding:0 9px;border:0;border-radius:9px;background:transparent;color:#6e6e73;font:700 12px var(--mono);letter-spacing:.04em;cursor:pointer;transition:background .2s,color .2s,box-shadow .2s}
.lang-toggle .flag{width:22px;height:15px;border-radius:3px;box-shadow:0 0 0 1px #0000001a;filter:saturate(.35) opacity(.75);transition:filter .2s,transform .25s var(--spring)}
.lang-toggle button[aria-checked=true]{background:#f2f2f7;color:#1d1d1f;box-shadow:0 1px 3px #0000001f}
.lang-toggle button[aria-checked=true] .flag{filter:none;transform:scale(1.08)}
html[data-theme=dark] .lang-toggle{background:#ffffff08;border-color:#ffffff14}
html[data-theme=dark] .lang-toggle button{color:#9a9ca3}
html[data-theme=dark] .lang-toggle button[aria-checked=true]{background:#2a2e35;color:#fff}
.xl-btn span{font:600 12.5px var(--body)}
.xl-btn[aria-expanded=true]{border-color:#2f7cf6;color:#2f7cf6}
@media(max-width:1400px){.xl-btn span,.theme-toggle span{display:none}.theme-toggle button{padding:0 8px}}
@media(max-width:1180px){.lang-toggle span{display:none}.lang-toggle button{padding:0 7px}}
@media(max-width:560px){.top .top-tools{gap:5px}.xl-btn{display:none}.icon-btn{min-width:36px;padding:0 8px}}

/* ---------- Tradutor lateral ---------- */
.xl-panel{position:fixed;inset:0;z-index:65;pointer-events:none}
.xl-panel[hidden]{display:none}
.xl-box{position:absolute;top:12px;right:12px;bottom:12px;width:min(420px,calc(100vw - 24px));display:flex;flex-direction:column;gap:12px;padding:18px;overflow-y:auto;border-radius:22px;background:rgba(255,255,255,.9);backdrop-filter:blur(28px) saturate(1.8);-webkit-backdrop-filter:blur(28px) saturate(1.8);box-shadow:0 30px 80px #0000003a,inset 0 0 0 1px #0000000f;pointer-events:auto;transform:translateX(calc(100% + 24px));transition:transform .32s var(--ease)}
.xl-panel.is-on .xl-box{transform:none}
.xl-head{display:flex;justify-content:space-between;align-items:flex-start}
.xl-eyebrow{font:600 9.5px var(--mono);letter-spacing:.14em;color:#2f7cf6}
.xl-head h2{margin:4px 0 0;font:700 28px/1 var(--display);text-transform:uppercase}
.xl-x{width:34px;height:34px;border:0;border-radius:50%;background:#0000000d;font-size:22px;line-height:1;cursor:pointer;color:inherit}
.xl-langs{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px}
.xl-l{display:flex;align-items:center;gap:8px;padding:10px 12px;border-radius:12px;background:#0000000a;font:600 14px var(--body)}
.xl-l .flag{width:24px;height:16px;border-radius:3px;box-shadow:0 0 0 1px #0000001a}
.xl-l[data-side=to]{justify-content:flex-end}
.xl-swap{display:grid;place-items:center;width:42px;height:42px;border:0;border-radius:50%;background:#1d1d1f;color:#fff;cursor:pointer;transition:transform .3s var(--spring)}
.xl-swap svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.xl-swap.spin{animation:swap-spin .45s var(--spring)}
@keyframes swap-spin{from{transform:rotate(-180deg)}}
.xl-card{display:grid;border-radius:16px;background:#fff;box-shadow:0 1px 0 #0000000a,inset 0 0 0 1px #0000000f;overflow:hidden}
.xl-card textarea{min-height:120px;padding:14px;border:0;outline:0;resize:vertical;background:transparent;color:inherit;font:400 17px/1.5 var(--body)}
.xl-result{min-height:120px;padding:14px;font:500 17px/1.5 var(--body);white-space:pre-wrap;transition:opacity .2s}
.xl-out{background:linear-gradient(#2f7cf60a,#2f7cf605),#fff;box-shadow:inset 0 0 0 1px #2f7cf62e}
.xl-result.is-loading{opacity:.45}
.xl-ph{color:#aeaeb2;font-weight:400}
.xl-act{display:flex;align-items:center;gap:4px;padding:6px 8px;border-top:1px solid #0000000d}
.xl-act button{display:grid;place-items:center;min-width:34px;height:34px;border:0;border-radius:9px;background:transparent;color:#424245;cursor:pointer}
.xl-act button:hover{background:#0000000d}
.xl-act svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.xl-act span{flex:1}
.xl-count{flex:1;text-align:right;padding-right:6px;color:#aeaeb2;font:11px var(--mono)}
.xl-txt{padding:0 12px!important;font:600 12.5px var(--body)}
.xl-save{background:#2f7cf6!important;color:#fff!important}
.xl-hist h3{margin:4px 0 8px;font:600 10px var(--mono);letter-spacing:.12em;color:#8e8e93;text-transform:uppercase}
.xl-hist ol{display:grid;gap:4px;margin:0;padding:0;list-style:none}
.xl-hist button{display:grid;gap:2px;width:100%;padding:9px 10px;border:0;border-radius:10px;background:#0000000a;text-align:left;cursor:pointer;color:inherit}
.xl-hist button:hover{background:#00000012}
.xl-hist span{display:flex;align-items:center;gap:6px;font:500 13px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xl-hist .flag{width:16px;height:11px;flex:none;border-radius:2px}
.xl-hist small{color:#6e6e73;font:12.5px var(--body);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xl-note{margin:auto 0 0;color:#8e8e93;font:12px/1.45 var(--body)}
@media(min-width:1200px){body.xl-open .wrap{margin-right:440px;transition:margin .32s var(--ease)}}
@media(max-width:700px){
  .xl-box{top:auto;left:0;right:0;bottom:0;width:auto;max-height:88vh;border-radius:24px 24px 0 0;padding:16px 16px calc(16px + env(safe-area-inset-bottom));transform:translateY(100%)}
  .xl-panel.is-on{pointer-events:auto;background:#00000040}
}
html[data-theme=dark] .xl-box{background:rgba(22,24,28,.92);box-shadow:0 30px 80px #000b,inset 0 0 0 1px #ffffff14}
html[data-theme=dark] .xl-x,html[data-theme=dark] .xl-l,html[data-theme=dark] .xl-hist button{background:#ffffff0d}
html[data-theme=dark] .xl-swap{background:#f2f2f5;color:#0c0e11}
html[data-theme=dark] .xl-card{background:#0f1114;box-shadow:inset 0 0 0 1px #ffffff12}
html[data-theme=dark] .xl-out{background:linear-gradient(#2f7cf61a,#2f7cf60a),#0f1114;box-shadow:inset 0 0 0 1px #2f7cf64d}
html[data-theme=dark] .xl-act{border-top-color:#ffffff10}
html[data-theme=dark] .xl-act button{color:#c3c5cb}
html[data-theme=dark] .xl-act button:hover{background:#ffffff12}
html[data-theme=dark] .xl-hist small{color:#9a9ca3}

/* ---------- Modo 🇧🇷: parágrafo em português com o inglês a um toque ---------- */
.reader .is-swapping{position:relative;opacity:.55;transition:opacity .3s}
.reader .is-swapping::after{content:"";position:absolute;left:0;right:0;bottom:-3px;height:2px;border-radius:2px;background:linear-gradient(90deg,transparent,#2f7cf6,transparent);background-size:200% 100%;animation:shimmer 1s linear infinite}
.reader .is-pt,.reader .is-en{animation:r-open .35s var(--ease)}
.peek{display:inline-grid;place-items:center;vertical-align:.12em;margin-left:.45em;height:1.35em;padding:0 .45em;border:0;border-radius:.4em;background:#2f7cf61a;color:#1a5fd0;font:700 .62em/1 var(--mono);letter-spacing:.06em;cursor:pointer;transition:background .15s,transform .15s var(--spring)}
.peek:hover{background:#2f7cf633;transform:scale(1.06)}
.reader .is-en{color:var(--r-ink)}
.reader .is-en .peek{background:#00976f1f;color:#007a5a}
.rd-btn .b-en{background:#1d1d1f}
html[data-theme=dark] .peek{background:#2f7cf633;color:#9cc0ff}
html[data-theme=dark] .reader .is-en .peek{background:#34c77b26;color:#6fe0a5}
html[data-theme=dark] .rd-btn .b-en{background:#f2f2f5;color:#0c0e11}
.xl-fab{display:none}
@media(max-width:980px){
  .xl-fab{position:fixed;right:14px;bottom:calc(var(--tabbar-h,64px) + 22px + env(safe-area-inset-bottom));z-index:49;display:grid;place-items:center;width:50px;height:50px;border:0;border-radius:50%;background:#2f7cf6;color:#fff;box-shadow:0 10px 26px #2f7cf666;cursor:pointer;transition:transform .2s var(--spring)}
  .xl-fab:active{transform:scale(.92)}
  .xl-fab svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
  body.has-listen-dock .xl-fab{bottom:calc(var(--tabbar-h,64px) + 190px + env(safe-area-inset-bottom))}
  body.xl-open .xl-fab{opacity:0;pointer-events:none}
}

/* =========================================================
 * MARCA · avião, logo, abertura, identidade de idioma
 * ========================================================= */
.aero-plane{fill:#fff}
.aero-plane .pl-glass{fill:#0b0d10;opacity:.75}
.aero-plane rect{fill:inherit;opacity:.95}

/* Cabeçalho */
.brand{gap:10px!important}
.brand .aero-mark{width:40px;height:40px;flex:none;filter:drop-shadow(0 4px 10px #d7192040);transition:transform .35s var(--spring)}
.brand:hover .aero-mark{transform:rotate(-6deg) scale(1.06)}
.brand .brand-mark{display:none}
.brand-word b{display:flex;gap:1px;font:700 21px/1 var(--display)!important;letter-spacing:.06em!important}
.brand-word b i{font-style:normal;color:var(--fg)}
.brand-word b em{font-style:normal;color:#D71920}
html[data-theme=dark] .brand-word b em{color:#ff4a51}
.brand-word small{margin-top:3px!important}
.mk-wave{animation:wave-pulse 2.4s ease-in-out infinite}
.mk-wave.w2{animation-delay:.3s}
@keyframes wave-pulse{0%,100%{opacity:.25}50%{opacity:1}}

/* Abertura */
html.intro-on{overflow:hidden}
.intro{position:fixed;inset:0;z-index:200;display:grid;place-items:center;background:radial-gradient(70% 60% at 50% 45%,#2a0c10,#07080a 70%);color:#fff;cursor:pointer;transition:opacity .6s var(--ease),transform .6s var(--ease)}
.intro.is-out{opacity:0;transform:scale(1.04);pointer-events:none}
.in-grid{position:absolute;inset:0;background-image:linear-gradient(#ffffff08 1px,transparent 1px),linear-gradient(90deg,#ffffff08 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(circle at 50% 50%,#000,transparent 70%)}
.in-route{position:absolute;inset:auto 0 6% 0;width:100%;height:60%;overflow:visible}
.in-line{fill:none;stroke:#ff3b42;stroke-width:3;stroke-dasharray:10 9;stroke-linecap:round;opacity:.9;filter:drop-shadow(0 0 6px #ff3b4288);animation:in-dash 2.4s linear infinite}
@keyframes in-dash{to{stroke-dashoffset:-76}}
.in-start{fill:#ff3b42;filter:drop-shadow(0 0 8px #ff3b42)}
.in-end{fill:#fff;opacity:.9}
.in-lbl{fill:#8b8d93;font:600 12px var(--mono);letter-spacing:.16em;text-anchor:middle}
.in-plane .aero-plane{fill:#fff;filter:drop-shadow(0 0 10px #ff3b42) drop-shadow(0 6px 10px #000a)}
.in-center{position:relative;display:grid;justify-items:center;gap:14px;text-align:center;transform:translateY(-8%)}
.in-center .aero-mark{width:clamp(84px,12vw,120px);height:auto;animation:in-pop .7s var(--spring) .1s both;filter:drop-shadow(0 18px 40px #d7192066)}
@keyframes in-pop{from{transform:scale(.3) rotate(-20deg);opacity:0}}
.in-center .mk-bubble{stroke:#fff;stroke-width:1.2;stroke-dasharray:220;stroke-dashoffset:220;animation:in-draw 1s var(--ease) .15s forwards}
@keyframes in-draw{to{stroke-dashoffset:0}}
.in-word{display:flex;gap:.06em;font:700 clamp(54px,10vw,112px)/.9 var(--display);letter-spacing:.04em}
.in-aero{animation:in-up .6s var(--ease) .45s both}
.in-speak{display:flex;color:#ff3b42}
.in-speak i{font-style:normal;display:inline-block;animation:in-letter .45s var(--spring) both;animation-delay:calc(.75s + var(--i) * 70ms)}
@keyframes in-up{from{transform:translateY(40%);opacity:0}}
@keyframes in-letter{from{transform:translateY(60%) scale(.6);opacity:0}}
.in-tag{font:600 clamp(10px,1.2vw,13px) var(--mono);letter-spacing:.42em;color:#9a9ca3;animation:in-up .6s var(--ease) 1.15s both}
.in-rt{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;animation:in-up .6s var(--ease) 1.45s both}
.in-rt span{padding:8px 14px;border-radius:14px 14px 14px 4px;font:500 15px var(--body)}
.in-en{background:#ffffff14;box-shadow:inset 0 0 0 1px #ffffff1f}
.in-pt{background:#2f7cf633;color:#cfe0ff;border-radius:14px 14px 4px 14px!important}
.in-skip{position:absolute;right:20px;bottom:calc(20px + env(safe-area-inset-bottom));padding:8px 14px;border:0;border-radius:999px;background:#ffffff14;color:#c3c5cb;font:600 12px var(--body);cursor:pointer}

/* Home: rota de estudo (a animação original, sem o preenchimento preto) */
.lang-home{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:14px;margin:0 0 30px}
.flight-strip{grid-row:span 2;position:relative;padding:18px 20px 10px;border-radius:22px;background:radial-gradient(80% 90% at 60% 30%,#2a0c10,#0b0d10 70%);color:#e8e8ec;box-shadow:inset 0 0 0 1px #ffffff12,0 20px 50px -20px #0007;overflow:hidden}
.fs-head{display:flex;justify-content:space-between;gap:10px;font:600 10.5px var(--mono);letter-spacing:.16em;color:#9a9ca3}
.fs-head b{color:#ff4a51}
.flight-strip svg{width:100%;height:auto;margin-top:6px;overflow:visible}
.fs-route{fill:none;stroke:#ff3b42;stroke-width:3;stroke-dasharray:10 9;stroke-linecap:round;opacity:.55}
.fs-done{fill:none;stroke:#ff3b42;stroke-width:4;stroke-linecap:round;filter:drop-shadow(0 0 6px #ff3b4299)}
.fs-beacon{fill:#ff3b42;filter:drop-shadow(0 0 8px #ff3b42)}
.fs-beacon.end{fill:#f2f2f5;filter:drop-shadow(0 0 8px #fff8)}
.fs-lbl{fill:#9a9ca3;font:600 11px var(--mono);letter-spacing:.14em;text-anchor:middle}
.fs-cnt{fill:#fff;font:700 13px var(--mono);text-anchor:middle}
.fs-plane .aero-plane{filter:drop-shadow(0 0 8px #ff3b42cc) drop-shadow(0 4px 6px #000a)}
.fs-plane .aero-plane path:first-child{stroke:#ff3b42;stroke-width:.9}

/* Frase do dia: balões EN / PT */
.phrase-day{display:grid;gap:12px;padding:18px 20px;border-radius:22px;background:var(--panel,#fff);border:1px solid var(--line)}
.phrase-day header,.alpha header{display:flex;justify-content:space-between;gap:10px;font:600 10.5px var(--mono);letter-spacing:.14em;color:#D71920}
.phrase-day header small,.alpha header small{color:var(--mute);letter-spacing:.08em}
.pd-bubbles{display:grid;gap:8px}
.pd-bubbles p{position:relative;display:flex;align-items:center;gap:10px;width:fit-content;max-width:100%;margin:0;padding:12px 16px;font:600 clamp(18px,1.6vw,22px)/1.3 var(--body)}
.pd-en{border-radius:18px 18px 18px 6px;background:#1d1d1f;color:#fff}
.pd-pt{justify-self:end;border-radius:18px 18px 6px 18px;background:#2f7cf61a;color:#1a5fd0;font-weight:500!important;font-size:clamp(15px,1.3vw,18px)!important}
.pd-flag .flag{width:22px;height:15px;border-radius:3px;display:block}
.pd-ipa{margin:0;color:var(--dim);font:14px var(--mono)}
.pd-ipa b{margin-right:6px;font:600 10px var(--mono);letter-spacing:.12em;color:var(--mute);text-transform:uppercase}
.pd-act{display:flex;flex-wrap:wrap;gap:8px}
html[data-theme=dark] .pd-en{background:#f2f2f5;color:#0c0e11}
html[data-theme=dark] .pd-pt{background:#2f7cf62e;color:#a9c8ff}

/* Alfabeto fonético ICAO: faixa contínua, toque para ouvir */
.alpha{display:grid;gap:12px;padding:18px 0 16px;border-radius:22px;background:var(--panel,#fff);border:1px solid var(--line);overflow:hidden}
.alpha header{padding:0 20px}
.alpha-track{overflow:hidden;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.alpha-row{display:flex;gap:8px;width:max-content;padding:2px 0;animation:marquee 60s linear infinite}
.alpha-track:hover .alpha-row,.alpha-track:focus-within .alpha-row{animation-play-state:paused}
@keyframes marquee{to{transform:translateX(-50%)}}
.al{display:grid;justify-items:start;gap:2px;min-width:104px;padding:10px 12px;border:1px solid var(--line);border-radius:14px;background:transparent;color:var(--fg);cursor:pointer;text-align:left;transition:border-color .15s,transform .2s var(--spring)}
.al:hover{border-color:#D71920}
.al b{font:700 26px/1 var(--display);color:#D71920}
.al span{font:600 14px var(--body)}
.al small{font:11px var(--mono);color:var(--mute)}
.al.is-hit{animation:al-hit .5s var(--spring)}
@keyframes al-hit{40%{transform:scale(1.1)}}
html[data-theme=dark] .al b{color:#ff4a51}
@media(max-width:900px){.lang-home{grid-template-columns:1fr}.flight-strip{grid-row:auto}}
@media(prefers-reduced-motion:reduce){.alpha-row,.in-line,.mk-wave{animation:none}}

/* =========================================================
 * BILÍNGUE: inglês e português lado a lado, cores e bandeiras fixas
 * EN = tinta (branco no escuro) · PT = azul
 * ========================================================= */
:root{--flag-en:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2060%2040%22%3E%3Crect%20width%3D%2260%22%20height%3D%2240%22%20rx%3D%226%22%20fill%3D%22%23012169%22/%3E%3Cpath%20d%3D%22M0%200%2060%2040M60%200%200%2040%22%20stroke%3D%22%23fff%22%20stroke-width%3D%228%22/%3E%3Cpath%20d%3D%22M0%200%2060%2040M60%200%200%2040%22%20stroke%3D%22%23C8102E%22%20stroke-width%3D%223%22/%3E%3Cpath%20d%3D%22M30%200v40M0%2020h60%22%20stroke%3D%22%23fff%22%20stroke-width%3D%2213%22/%3E%3Cpath%20d%3D%22M30%200v40M0%2020h60%22%20stroke%3D%22%23C8102E%22%20stroke-width%3D%227%22/%3E%3C/svg%3E");--flag-pt:url("data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20viewBox%3D%220%200%2028%2020%22%3E%3Crect%20width%3D%2228%22%20height%3D%2220%22%20rx%3D%223%22%20fill%3D%22%23009c3b%22/%3E%3Cpath%20d%3D%22M14%202.6%2025.4%2010%2014%2017.4%202.6%2010Z%22%20fill%3D%22%23ffdf00%22/%3E%3Ccircle%20cx%3D%2214%22%20cy%3D%2210%22%20r%3D%224.3%22%20fill%3D%22%23002776%22/%3E%3C/svg%3E");--en-ink:#1d1d1f;--pt-ink:#1a5fd0;--pt-bg:#2f7cf60f;--pt-line:#2f7cf6}
html[data-theme=dark]{--en-ink:#f5f5f7;--pt-ink:#8fb8ff;--pt-bg:#2f7cf614;--pt-line:#5b93ff}
.bi-tag{display:inline-flex;align-items:center;gap:6px;margin-bottom:8px;font:700 11px var(--mono);letter-spacing:.12em}
.bi-tag::before{content:"";width:22px;height:15px;border-radius:3px;background:center/cover no-repeat;box-shadow:0 0 0 1px #0000001f}

/* Mapa ICAO: cards em largura total, EN | PT em duas colunas, texto grande */
.icao-profile-grid,.profile-grid{grid-template-columns:1fr!important}
.icao-profile-card{display:grid!important;grid-template-columns:1fr 1fr;column-gap:clamp(18px,3vw,44px);row-gap:14px;padding:clamp(18px,2.4vw,30px)!important}
.icao-profile-card>.icao-profile-title,.icao-profile-card>.profile-levels{grid-column:1/-1}
.icao-profile-card>p{margin:0!important;font:500 clamp(20px,2.1vw,30px)/1.38 var(--body)!important;letter-spacing:-.005em}
.icao-profile-card>p:not(.profile-pt){color:var(--en-ink)!important}
.icao-profile-card>p.profile-pt{color:var(--pt-ink)!important;padding-left:clamp(14px,2vw,24px);border-left:3px solid var(--pt-line)}
.icao-profile-card>p::before{content:"ENGLISH";display:flex;align-items:center;gap:8px;margin-bottom:10px;font:700 11px var(--mono);letter-spacing:.14em;color:var(--mute);padding-left:30px;min-height:15px;background:var(--flag-en) left center/22px 15px no-repeat}
.icao-profile-card>p.profile-pt::before{content:"PORTUGUÊS";background-image:var(--flag-pt);color:var(--pt-ink)}
@media(max-width:760px){.icao-profile-card{grid-template-columns:1fr}.icao-profile-card>p.profile-pt{padding-left:14px}}

/* Escala ICAO na aula: EN e PT com as mesmas cores */
.icao-descriptor p.en{color:var(--en-ink)}
.icao-descriptor p.pt{color:var(--pt-ink)}

/* Aulas: parágrafo + tradução lado a lado */
.reader.is-bilingual>*{max-width:none!important}
.bi-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,40px);align-items:start;margin:0 0 1.2em;padding:0 0 1.2em;border-bottom:1px dashed var(--r-line)}
.bi-row>p{margin:0!important;color:var(--en-ink)}
.bi-row>p::before,.bi-row>.ptr::before{display:block;margin-bottom:6px;padding-left:28px;min-height:15px;font:700 10px/15px var(--mono);letter-spacing:.14em;background:var(--flag-en) left center/20px 14px no-repeat;color:var(--r-mute)}
.bi-row>p::before{content:"EN"}
.bi-row>.ptr::before{content:"PT";background-image:var(--flag-pt);color:var(--pt-ink)}
.reader .bi-row>.ptr{margin:0!important;padding:0 0 0 clamp(12px,2vw,22px)!important;border:0!important;border-left:3px solid var(--pt-line)!important;border-radius:0!important;background:none!important;color:var(--pt-ink)!important;font:400 1em/1.72 var(--body)!important}
.reader li>.ptr{display:block;margin:.5em 0 .2em!important;padding:.2em 0 .2em .9em!important;background:none!important;border-left:3px solid var(--pt-line)!important;color:var(--pt-ink)!important;font-size:1em!important}
@media(max-width:820px){.bi-row{grid-template-columns:1fr;gap:10px}}

/* Modo 🇧🇷 com os dois idiomas visíveis */
.reader .is-both{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,3vw,40px);align-items:start}
.reader li.is-both{display:grid}
.is-both>.bi-en{color:var(--en-ink)}
.is-both>.bi-pt{color:var(--pt-ink);padding-left:clamp(12px,2vw,22px);border-left:3px solid var(--pt-line)}
.is-both>.bi-en::before,.is-both>.bi-pt::before{display:block;margin-bottom:6px;padding-left:28px;min-height:15px;font:700 10px/15px var(--mono);letter-spacing:.14em;background:var(--flag-en) left center/20px 14px no-repeat;color:var(--r-mute);content:"EN"}
.is-both>.bi-pt::before{content:"PT";background-image:var(--flag-pt);color:var(--pt-ink)}
.is-both>.peek{display:none}
.reader.show-both>*{max-width:none!important}
.reader .is-pt{color:var(--pt-ink)}
@media(max-width:820px){.reader .is-both{grid-template-columns:1fr;gap:8px}}
.reader:not(.is-bilingual) .bi-row:not(:has(.ptr:not([hidden]))){display:block;margin:0;padding:0;border:0}
.reader:not(.is-bilingual) .bi-row:not(:has(.ptr:not([hidden])))>p::before{display:none}
.rd-btn .b-en{width:auto;padding:0 5px}

/* Botão de áudio explícito por bloco */
.spk{display:flex;align-items:center;gap:8px;width:fit-content;margin-top:14px;padding:9px 14px 9px 11px;border:0;border-radius:999px;background:var(--en-ink);color:var(--paper,#fff);font:600 13px/1 var(--body);letter-spacing:0;cursor:pointer;transition:transform .2s var(--spring),background .2s}
.spk svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.spk:hover{transform:translateY(-1px)}
.spk.spk-pt{background:var(--pt-line);color:#fff}
.spk.is-on{background:#D71920;color:#fff}
.spk.is-on svg path:last-child{animation:pulse .8s infinite}
html[data-theme=dark] .spk:not(.spk-pt):not(.is-on){background:#f2f2f5;color:#0c0e11}
.icao-descriptor .spk{margin-top:8px;padding:6px 11px 6px 9px;font-size:11.5px}
.icao-descriptor .spk svg{width:15px;height:15px}
.is-speaking .spk{box-shadow:0 0 0 4px #d7192033}
/* ajustes finais de layout */
@media(max-width:1500px){.brand-word small{display:none}}
@media(max-width:560px){#settingsOpen{display:none}.brand-word b{font-size:18px!important}.brand .aero-mark{width:34px;height:34px}.lang-toggle button,.theme-toggle button{padding:0 6px}.lang-toggle .flag{width:20px;height:14px}}
@media(max-width:380px){.brand-word{display:none}}
.flight-strip{grid-row:auto!important;display:flex;flex-direction:column}
.flight-strip svg{flex:1}
.alpha{grid-column:1/-1}

/* Abertura mais longa (~5,5 s) e botões para rever */
.intro{cursor:default}
.in-center .aero-mark{animation-delay:.2s;animation-duration:.9s}
.in-center .mk-bubble{animation-duration:1.4s;animation-delay:.25s}
.in-aero{animation-delay:1s;animation-duration:.8s}
.in-speak i{animation-delay:calc(1.5s + var(--i) * 110ms);animation-duration:.6s}
.in-tag{animation-delay:2.4s;animation-duration:.8s}
.in-rt{animation-delay:3.1s;animation-duration:.8s}
.in-rt .in-pt{animation:in-up .7s var(--ease) 3.7s both}
.intro.is-out{transition-duration:.8s}
.in-skip{transition:background .2s}.in-skip:hover{background:#ffffff26}
.fs-replay{position:absolute;right:16px;bottom:14px;z-index:2;padding:8px 14px;border:0;border-radius:999px;background:#ffffff14;color:#f2f2f5;font:600 12.5px var(--body);cursor:pointer;backdrop-filter:blur(8px);transition:background .2s,transform .2s var(--spring)}
.fs-replay:hover{background:#ff3b42;transform:translateY(-1px)}
.flight-strip{position:relative}
.intro-replay{width:100%;margin-top:12px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--fg);font:600 13px var(--body);cursor:pointer;text-align:left}
.intro-replay:hover{border-color:#D71920;color:#D71920}
/* Mapa ICAO: meta nível 5 em destaque */
.ic-goal-sub{margin:-4px 0 8px!important;color:var(--lv5)!important;font:600 13px var(--body)!important}
.icao-climb .ic-copy h2 em{background:color-mix(in srgb,var(--lv5) 22%,transparent);color:var(--lv5)}
.ic-band.is-goal rect{opacity:.32}
.ic-band.is-goal .ic-name{fill:var(--lv5)}
.ic-dot.is-weak circle{r:9;fill:#0b0d10;stroke:#fff}
.ic-dot.is-weak .ic-sk{fill:#c3c5cb}