/* shared base rules this page uses that learn.css leaves out */
:where(main.learn) .grid-bg{position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(rgba(77,158,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(77,158,255,.07) 1px,transparent 1px),linear-gradient(rgba(77,158,255,.032) 1px,transparent 1px),linear-gradient(90deg,rgba(77,158,255,.032) 1px,transparent 1px);background-size:80px 80px,80px 80px,16px 16px,16px 16px;-webkit-mask-image:radial-gradient(80% 70% at 50% 40%,#000 25%,transparent 85%);mask-image:radial-gradient(80% 70% at 50% 40%,#000 25%,transparent 85%)}
.tt-art{position:relative;padding:0 0 24px}
.tt-wide{max-width:1168px;margin:0 auto;padding:0 24px}
.tt-hero{position:relative;padding:40px 0 64px;border-bottom:1px solid rgba(120,170,255,.12);overflow:hidden}
.tt-heroin{position:relative}
.tt-crumb{font:500 12px 'JetBrains Mono',monospace;letter-spacing:.06em;color:#7d92b3;margin-bottom:24px}
.tt-crumb a{color:#8a95a8}
.tt-crumb span{color:#cfd8e6}
.tt-kick{font:600 11.5px 'JetBrains Mono',monospace;letter-spacing:.18em;text-transform:uppercase;color:#4d9eff;margin:0 0 14px}
.tt-h1{margin:0;font-size:clamp(38px,5vw,62px);font-weight:800;letter-spacing:-.035em;line-height:1.02;color:#f2f5fa}
.tt-h1s{display:block;margin-top:14px;font-size:clamp(18px,1.9vw,24px);font-weight:600;letter-spacing:-.012em;line-height:1.3;color:#a9b6ca}
.tt-dek{margin:18px 0 0;max-width:720px;font-size:18px;line-height:1.6;color:#cdd6e3}
.tt-gridh{position:relative;margin:38px 0 14px;font:600 11.5px 'JetBrains Mono',monospace;letter-spacing:.18em;text-transform:uppercase;color:#7d92b3}
.tt-gridh::after{content:"";display:inline-block;width:36px;height:1px;background:#4d9eff;vertical-align:middle;margin-left:12px;opacity:.6}
.tt-cards{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.tt-card{position:relative;display:flex;flex-direction:column;background:#0b1324;border:1px solid rgba(120,170,255,.14);border-top:2px solid var(--fc);border-radius:6px;overflow:hidden;transition:transform .2s}
.tt-card:hover,.tt-card:focus-within{border-color:var(--fc);background:#0e1830}
.tt-card:hover{transform:translateY(-2px)}
.tt-prev{padding:14px 14px 10px;background:#070d1a;background-image:linear-gradient(rgba(120,170,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(120,170,255,.05) 1px,transparent 1px);background-size:20px 20px;border-bottom:1px solid rgba(120,170,255,.12)}
.tt-pv{display:block;width:100%;height:auto;overflow:visible}
.tt-cbody{display:flex;flex-direction:column;gap:10px;flex:1;padding:16px 20px 18px}
.tt-cardk{display:flex;gap:12px;margin:0;font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase}
.tt-cardk span{color:#7d92b3}
.tt-cardk b{color:var(--fc);font-weight:600}
.tt-cardt{margin:0;font-size:20px;font-weight:800;letter-spacing:-.015em;line-height:1.25}
.tt-open{color:#f2f5fa}
.tt-open::after{content:"";position:absolute;inset:0;z-index:1}
.tt-open:focus-visible{outline:none}
.tt-card:has(.tt-open:focus-visible){outline:2px solid var(--fc);outline-offset:3px}
.tt-ans{margin:0;font-size:15px;line-height:1.55;color:#c3cede}
.tt-ins{display:flex;flex-direction:column;gap:7px}
.tt-insk{font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#7d92b3}
.tt-ins ul{display:flex;flex-wrap:wrap;gap:6px;margin:0;padding:0;list-style:none}
.tt-ins li{padding:4px 8px;font:500 11.5px 'JetBrains Mono',monospace;line-height:1.35;color:#cfe0ff;background:rgba(120,170,255,.07);border:1px solid rgba(120,170,255,.14);border-radius:3px}
.tt-ex{margin:0;padding-top:10px;border-top:1px dashed rgba(120,170,255,.16);font-size:13.5px;line-height:1.55;color:#a3adbd}
.tt-ex b{margin-right:6px;font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:var(--fc)}
.tt-cfoot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 16px;margin-top:auto;padding-top:6px}
.tt-go{font-size:14.5px;font-weight:700;color:var(--fc)}
.tt-go::after{content:"";display:inline-block;width:18px;height:1px;background:var(--fc);vertical-align:middle;margin-left:10px}
.tt-card:hover .tt-go::after{width:28px}
.tt-guide{position:relative;z-index:2;font-size:13px;color:#8a9bb8;text-decoration:underline;text-decoration-color:rgba(138,155,184,.4);text-underline-offset:3px}
.tt-guide:hover{color:#e8edf5}
.tt-note{position:relative;max-width:820px;margin:18px 0 0;font-size:14px;line-height:1.6;color:#8a9bb8}
.tt-tl{font:500 8.5px 'JetBrains Mono',monospace;letter-spacing:.06em;fill:#7d92b3}
.tt-tn{fill:#cfe0ff;font-weight:600}
.tt-tb{fill:#f2f5fa;font-weight:600}
.tt-big{font:800 26px Inter,system-ui,sans-serif;fill:#f2f5fa}
.tt-bigl{font-size:40px;letter-spacing:-.03em}
.tt-rule{fill:none;stroke:#2a3a5c;stroke-width:1}
.tt-wall{fill:rgba(77,158,255,.04);stroke:#3a4d72;stroke-width:1.5}
.tt-wall2{fill:none;stroke:#2a3a5c;stroke-width:1.2}
.tt-door{stroke:#cfe0ff;stroke-width:3;stroke-linecap:round}
.tt-fx{fill:#1a2742;stroke:#3a4d72}
.tt-wedge{fill:var(--fc);fill-opacity:.22;stroke:var(--fc);stroke-opacity:.5;stroke-width:.8}
.tt-wedge-o{fill-opacity:.07;stroke-opacity:.3}
.tt-cam{fill:var(--fc);stroke:#060910;stroke-width:1.2}
.tt-cone{fill:rgba(77,158,255,.04);stroke:rgba(77,158,255,.35);stroke-width:1}
.tt-band{fill:var(--fc)}
.tt-camb{fill:#1a2742;stroke:var(--fc);stroke-width:1.2}
.tt-pp{fill:#e8edf5}
.tt-ppl{fill:none;stroke:#e8edf5;stroke-width:1.6;stroke-linecap:round}
.tt-cell{fill:var(--fc);fill-opacity:.72}
.tt-cell0{fill:none;stroke:#2a3a5c;stroke-dasharray:2 2}
.tt-strm{fill:none;stroke:#1e2c48;stroke-width:1.2}
.tt-flow{fill:none;stroke:var(--fc);stroke-width:1.4;stroke-linecap:round;stroke-dasharray:3 9}
.tt-camd{fill:var(--fc)}
.tt-pipe{fill:#0a1222;stroke:#3a4d72;stroke-width:1.5}
.tt-ok{fill:var(--fc);fill-opacity:.8}
.tt-bad{fill:#ff6b6b;fill-opacity:.75}
.tt-cap{stroke:#e8edf5;stroke-width:1.2;stroke-dasharray:3 3}
.tt-cloud{fill:none;stroke:#7d92b3;stroke-width:1.3}
.tt-track{fill:#111b30;stroke:#2a3a5c}
.tt-seg-d{fill:var(--fc);fill-opacity:.5}
.tt-seg-b{fill:var(--fc);fill-opacity:.9}
.tt-sw{fill:#0d1628;stroke:#3a4d72;stroke-width:1.5}
.tt-led{fill:#4ade80}
.tt-port{fill:#060910;stroke:#2a3a5c}
.tt-pt-d{fill:var(--fc);fill-opacity:.45}
.tt-pt-b{fill:var(--fc);fill-opacity:.9}
.tt-pt-x{fill:#ff6b6b;fill-opacity:.22;stroke:#ff6b6b}
.tt-xx{fill:none;stroke:#ff6b6b;stroke-width:1.6;stroke-linecap:round}
.tt-batt{fill:#0a1222;stroke:#3a4d72;stroke-width:1.6}
.tt-battn{fill:#3a4d72}
.tt-bfill{fill:var(--fc);fill-opacity:.72}
.tt-low{fill:none;stroke:#ff6b6b;stroke-width:2;opacity:0}
.tt-bolt{fill:#060910;fill-opacity:.6;stroke:#f5c46b;stroke-opacity:.7;stroke-width:1}
.tt-mk{stroke:var(--fc);stroke-width:2}
.tt-mk2{stroke:#7d92b3;stroke-width:1.2;stroke-dasharray:3 3}
.tt-cur{fill:var(--fc);stroke:#060910;stroke-width:1.5}
.tt-in{animation:tt-in 8s linear infinite both;animation-delay:calc(var(--i) * var(--st,.5s))}
.tt-fill{animation:tt-in 8s linear infinite both;animation-delay:calc(var(--i) * .085s)}
[data-ttfig="tp"] .tt-in{--st:.22s}
[data-ttfig="td"] .tt-in{--st:.55s}
@keyframes tt-in{0%{opacity:0}5%{opacity:1}82%{opacity:1}92%,100%{opacity:0}}
.tt-flow{animation:tt-dash 1.1s linear infinite}
@keyframes tt-dash{from{stroke-dashoffset:24}to{stroke-dashoffset:0}}
.tt-grow,.tt-grow2,.tt-drain{transform-box:fill-box;transform-origin:0 50%}
.tt-grow{animation:tt-grow 8s ease-out infinite}
.tt-grow2{animation:tt-grow2 8s ease-out infinite}
@keyframes tt-grow{0%{transform:scaleX(0);opacity:1}30%{transform:scaleX(1)}88%{opacity:1;transform:scaleX(1)}96%,100%{opacity:0;transform:scaleX(1)}}
@keyframes tt-grow2{0%,30%{transform:scaleX(0);opacity:1}55%{transform:scaleX(1)}88%{opacity:1;transform:scaleX(1)}96%,100%{opacity:0;transform:scaleX(1)}}
.tt-drain{animation:tt-drain 8s linear infinite}
@keyframes tt-drain{0%{transform:scaleX(1)}78%{transform:scaleX(0)}90%{transform:scaleX(0)}100%{transform:scaleX(1)}}
.tt-low{animation:tt-low 8s linear infinite}
@keyframes tt-low{0%,58%{opacity:0}70%,88%{opacity:1}96%,100%{opacity:0}}
.tt-cur{animation:tt-cur 8s linear infinite}
@keyframes tt-cur{0%{transform:translateX(0)}78%{transform:translateX(171.7px)}90%{transform:translateX(171.7px)}100%{transform:translateX(0)}}
.tt-walk{animation:tt-walk 8s linear infinite}
@keyframes tt-walk{0%{transform:translateX(-32px);opacity:0}4%{opacity:1}84%{opacity:1}92%{transform:translateX(196px);opacity:0}100%{transform:translateX(196px);opacity:0}}
.tt-sec{position:relative;padding:72px 0 0}
.tt-h2{margin:0;font-size:clamp(28px,3.2vw,40px);font-weight:800;letter-spacing:-.03em;line-height:1.1;color:#f2f5fa}
.tt-lead{max-width:780px;margin:12px 0 0;font-size:17px;line-height:1.65;color:#a9b6ca}
.tt-flows{display:grid;grid-template-columns:minmax(0,2fr) minmax(0,1fr);gap:16px;margin-top:26px}
.tt-flow{padding:22px 22px 24px;background:#0b1324;border:1px solid rgba(120,170,255,.14);border-radius:6px}
.tt-flk{margin:0;font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#7d92b3}
.tt-flt{margin:6px 0 20px;font-size:19px;font-weight:800;letter-spacing:-.015em;color:#f2f5fa}
.tt-steps{display:grid;gap:0;margin:0;padding:0;list-style:none}
.tt-f4 .tt-steps{grid-template-columns:repeat(4,minmax(0,1fr))}
.tt-f2 .tt-steps{grid-template-columns:repeat(2,minmax(0,1fr))}
.tt-step{position:relative;display:flex;flex-direction:column;gap:6px;padding-right:18px}
.tt-stn{position:relative;z-index:1;display:grid;place-items:center;width:30px;height:30px;margin-bottom:6px;border-radius:50%;font:700 13px 'JetBrains Mono',monospace;color:#060910;background:var(--fc)}
.tt-wire{position:absolute;top:14px;left:38px;right:8px;height:2px;overflow:hidden;background:rgba(120,170,255,.18)}
.tt-wire i{position:absolute;top:0;left:0;width:34%;height:2px;background:linear-gradient(90deg,transparent,var(--fc));animation:tt-pulse 2.4s linear infinite}
@keyframes tt-pulse{from{transform:translateX(-100%)}to{transform:translateX(300%)}}
.tt-stl{font-size:16px;font-weight:700;color:#f2f5fa;text-decoration:underline;text-decoration-color:rgba(120,170,255,.35);text-underline-offset:4px}
.tt-stl:hover{color:#fff;text-decoration-color:var(--fc)}
.tt-stp{font-size:14px;line-height:1.5;color:#a3adbd}
.tt-mores{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-top:24px}
.tt-more{display:flex;flex-direction:column;gap:7px;padding:16px 16px 18px;background:#0b1324;border:1px solid rgba(120,170,255,.14);border-radius:4px;color:#e8edf5}
.tt-more:hover{border-color:#4d9eff;background:#0e1830;color:#fff}
.tt-morek{font:600 10.5px 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase;color:#4d9eff}
.tt-moret{font-size:16px;font-weight:700;line-height:1.3;color:#f2f5fa}
.tt-morep{font-size:13.5px;line-height:1.5;color:#a3adbd}
.tt-end{padding-top:64px}
.tt-cta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:24px;padding:30px;background:linear-gradient(135deg,rgba(29,123,255,.16),rgba(11,19,36,.9));border:1px solid rgba(77,158,255,.35);border-radius:6px}
.tt-cta>div:first-child{flex:1 1 380px}
.tt-ctah{margin:0 0 8px;font-size:30px;font-weight:800;letter-spacing:-.03em;color:#fff}
.tt-cta p{margin:0;font-size:16px;line-height:1.6;color:#c3cede}
.tt-ctab{display:flex;flex-wrap:wrap;gap:10px}
@media (max-width:1100px){.tt-mores{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:1020px){.tt-cards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:1020px){.tt-flows{grid-template-columns:minmax(0,1fr)}}
@media (max-width:680px){.tt-wide{padding:0 16px}}
@media (max-width:680px){.tt-hero{padding:28px 0 44px}}
@media (max-width:680px){.tt-crumb{margin-bottom:18px}}
@media (max-width:680px){.tt-dek{font-size:17px}}
@media (max-width:680px){.tt-gridh{margin-top:28px}}
@media (max-width:680px){.tt-cards{grid-template-columns:minmax(0,1fr);gap:14px}}
@media (max-width:680px){.tt-cbody{padding:14px 16px 16px}}
@media (max-width:680px){.tt-sec{padding-top:56px}}
@media (max-width:680px){.tt-flow{padding:18px 16px 20px}}
@media (max-width:680px){.tt-f4 .tt-steps,.tt-f2 .tt-steps{grid-template-columns:minmax(0,1fr)}}
@media (max-width:680px){.tt-step{display:grid;grid-template-columns:30px minmax(0,1fr);column-gap:14px;row-gap:2px;padding:0 0 18px}}
@media (max-width:680px){.tt-step:last-child{padding-bottom:0}}
@media (max-width:680px){.tt-stn{grid-row:1 / span 2;margin:0}}
@media (max-width:680px){.tt-wire{top:34px;bottom:2px;left:14px;right:auto;width:2px;height:auto}}
@media (max-width:680px){.tt-wire i{width:2px;height:34%;background:linear-gradient(180deg,transparent,var(--fc));animation-name:tt-pulsev}}
@media (max-width:680px){.tt-stl{grid-column:2;padding-top:4px}}
@media (max-width:680px){.tt-stp{grid-column:2}}
@media (max-width:680px){.tt-mores{grid-template-columns:minmax(0,1fr)}}
@media (max-width:680px){.tt-cta{padding:22px}}
@media (max-width:680px){.tt-ctah{font-size:26px}}
@keyframes tt-pulsev{from{transform:translateY(-100%)}to{transform:translateY(300%)}}
[data-ttp] *{animation-play-state:paused!important}
@media (prefers-reduced-motion:reduce){.tt-art *,.tt-art *::before,.tt-art *::after{animation:none!important;transition:none!important}}
@media (prefers-reduced-motion:reduce){.tt-card:hover{transform:none}}
@media (prefers-reduced-motion:reduce){.tt-wire i{display:none}}
@media print{.tt-prev,.tt-wire{display:none}}
@media print{.tt-card,.tt-flow,.tt-more{break-inside:avoid}}
main.learn .tl-off,main.learn .tl-off *,main.learn .tl-off *::before,main.learn .tl-off *::after{animation-play-state:paused!important}