:root {
  color-scheme:dark;
  --bg:#130F03;
  --bg-panel:#1E1910;
  --bg-panel-2:#282116;
  --border:#3D3425;
  --border-strong:#66563C;
  --accent:#FF5E1A;
  --accent-dark:#FF8A50;
  --accent-soft:#482719;
  --text:#F3EDE0;
  --text-muted:#BFB39D;
  --text-soft:#A89B84;
  --success:#2F8F5B;
  --warn:#C7871A;
  --error:#E04B44;
  --ink:#130F03;
  --ink-panel:#1E1910;
  --ink-panel-a:rgb(30 25 16 / .94);
  --ink-border:#2E281C;
  --ink-text:#F3EDE0;
  --ink-muted:#9C927E;
  --dial-1:#E04B44;
  --dial-2:#EE5532;
  --dial-3:#FF5E1A;
  --dial-4:#F27B33;
  --dial-5:#DE984C;
  --dial-6:#C8A86C;
  --sky-1:#EFE6D1;
  --sky-2:#F3D8BF;
  --sky-3:#EEC3A7;
  --sun:#FAE6CF;
  --skyline:#E5B597;
  --mullion:#B39374;
  --mullion-lit:#C9AE90;
  --wall:#E8DAC3;
  --desk-1:#7B4E33;
  --desk-2:#946140;
  --walnut-edge:#5C3A25;
  --walnut-lip:#A87352;
  --walnut-grain:#B07B58;
  --shell:#DCD2C2;
  --shell-dark:#BDB09B;
  --bezel:#2A231A;
  --screen-bg:#FCFAF5;
  --screen-side:#F3EDE2;
  --screen-block:#E7E0D2;
  --screen-dot:#D3C9B7;
  --cat:#FFFCF5;
  --cat-line:#5A4836;
  --cat-ear:#F5CDB6;
  --cup:#FFFDF8;
  --cup-shade:#D9CBB6;
  --tea:#B8784B;
  --steam:#FFF9F0;
  --veil:rgb(19 15 3 / .45);
  --clear:transparent;
  --font-display:"Iowan Old Style","Charter","Georgia","Songti SC","STSong","Noto Serif SC","Source Han Serif SC",serif;
  --font-body:"Inter","Noto Sans SC","PingFang SC","Microsoft YaHei",system-ui,sans-serif;
  --font-mono:"JetBrains Mono","SFMono-Regular","Menlo","Consolas",monospace;
  --r-focus:6px;
  --r-icon:8px;
  --r-sm:10px;
  --r-md:14px;
  --r-lg:20px;
  --r-xl:28px;
  --r-pill:999px;
  --r-circle:50%;
  --shadow-panel:0 1px 2px rgb(92 62 28 / .06),0 18px 36px -22px rgb(92 62 28 / .30),0 42px 80px -48px rgb(92 62 28 / .38);
  --shadow-dark-float:0 2px 6px rgb(19 15 3 / .18),0 26px 54px -18px rgb(19 15 3 / .55);
  --shadow-light-float:0 2px 6px rgb(60 36 18 / .14),0 22px 44px -18px rgb(46 26 12 / .48);
  --shadow-menu:0 12px 32px -14px rgb(92 62 28 / .30);
  --shadow-btn:0 8px 18px -10px rgb(217 72 15 / .65);
  --shadow-switch:0 1px 2px rgb(23 19 10 / .18);
  --nav-h:72px;
  --peek:64px;
  --frame:1360px;
  --reading:1120px;
  --gutter:24px;
  --space-section:88px;
  --speed:.18s;
}
*,*::before,*::after {box-sizing:border-box}
html {-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:24px}
html.nav-open {overflow:hidden}
body {margin:0;background:var(--bg);color:var(--text);font-family:var(--font-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a {color:inherit;text-decoration:none}
button,input,select,textarea {font:inherit}
button {cursor:pointer}
button,svg,img {flex-shrink:0}
img,svg {max-width:100%}
img {height:auto}
button {color:inherit}
[hidden] {display:none!important}
:focus-visible {outline:2px solid var(--accent);outline-offset:3px;border-radius:var(--r-focus)}
h1,h2,h3,h4,p {margin-top:0}
h1,h2,h3 {font-family:var(--font-display);font-weight:400;text-wrap:balance;overflow-wrap:normal}
h1 {font-size:clamp(34px,3.2vw,48px);line-height:1.18;letter-spacing:-.012em}
h2 {font-size:clamp(26px,2.6vw,36px);line-height:1.3}
h3 {font-size:24px;line-height:1.35}
p {margin-bottom:1.2em}
code,kbd,pre {font-family:var(--font-mono)}
code {overflow-wrap:anywhere;font-size:.9em}
pre {max-width:100%;min-width:0;overflow-x:auto;padding:22px;border:1px solid var(--ink-border);border-radius:var(--r-md);background:var(--ink-panel);color:var(--ink-text);line-height:1.7;font-size:13px}
pre code {overflow-wrap:normal;white-space:pre;font-size:inherit}
hr {border:0;border-top:1px solid var(--border);margin-block:32px}
ul.clean {margin:0;padding:0;list-style:none}
.frame {max-width:var(--frame);margin-inline:auto;border-inline:1px solid var(--border);min-width:0}
.wrap {width:100%;max-width:calc(var(--reading) + var(--gutter)*2);margin-inline:auto;padding-inline:var(--gutter);min-width:0}
.section {padding-top:var(--space-section);padding-bottom:var(--space-section)}
.grid {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.grid>* , .hero__grid>*, .footer__grid>* {min-width:0}
.stack>*+* {margin-top:24px}
.nowrap {white-space:nowrap}
.muted {color:var(--text-muted)}
.text-link {color:var(--accent-dark);text-decoration:underline;text-underline-offset:4px}
.sr-only {position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link {position:fixed;top:8px;left:16px;z-index:100;padding:10px 18px;background:var(--ink);color:var(--ink-text);border-radius:var(--r-sm);transform:translateY(-160%)}
.skip-link:focus {transform:none}
.btn {display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:10px 26px;border:1px solid var(--clear);border-radius:var(--r-pill);font-size:16px;font-weight:500;letter-spacing:.01em;text-align:center;line-height:1.4;transition:background var(--speed),border-color var(--speed),transform var(--speed);max-width:100%}
.btn svg {width:18px;height:18px}
.btn--primary {background:var(--accent);color:var(--bg-panel);box-shadow:var(--shadow-btn)}
.btn--primary:hover,.btn--primary.is-hover {background:var(--accent-dark);color:var(--bg-panel);transform:translateY(-1px)}
.btn:active,.btn.is-pressed {transform:translateY(1px)}
.btn--ghost {border-color:var(--text);background:var(--clear);color:var(--text)}
.btn--ghost:hover {background:var(--bg-panel);color:var(--text)}
.btn--sm {min-height:40px;padding:8px 18px;font-size:14.5px;box-shadow:none}
.btn:disabled,.btn[aria-disabled="true"] {background:var(--bg-panel-2);color:var(--text-muted);border-color:var(--border);box-shadow:none;cursor:not-allowed;transform:none}
.button-row {display:flex;align-items:center;flex-wrap:wrap;gap:12px}
.masthead {position:relative;z-index:40;background:var(--bg);color:var(--text);border-bottom:1px solid var(--border)}
.masthead__row {position:relative;max-width:min(100%,calc(1280px + var(--gutter)*2));height:var(--nav-h);margin-inline:auto;padding-inline:var(--gutter);display:flex;align-items:center;gap:44px}
.brand {display:inline-flex;align-items:center;gap:11px;flex-shrink:0}
.brand__mark {display:block;width:34px;height:34px}
.brand__name {font-family:var(--font-display);font-size:21px;font-weight:400;letter-spacing:-.01em}
.nav {height:100%;min-width:0}
.nav>ul {display:flex;align-items:center;list-style:none;margin:0;padding:0;gap:4px;height:100%}
.nav li {list-style:none}
.nav__link,.nav__btn {position:relative;display:inline-flex;align-items:center;gap:6px;min-height:var(--nav-h);padding-inline:14px;color:var(--text-muted);font-size:15px;font-weight:450;white-space:nowrap}
.nav__link:hover,.nav__btn:hover,.nav__link[aria-current="page"] {color:var(--text)}
.nav__link[aria-current="page"]::after {content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;border-radius:var(--r-pill);background:var(--accent);color:var(--text)}
.nav__btn {border:0;background:var(--clear);color:var(--text-muted)}
.nav__btn svg {width:12px;height:12px}
.nav__more {position:relative;height:100%}
.nav__menu,.language__menu {position:absolute;top:calc(100% - 6px);left:2px;min-width:252px;padding:8px;background:var(--bg-panel);color:var(--text);border:1px solid var(--border);border-radius:var(--r-md);box-shadow:var(--shadow-menu);z-index:45}
.nav__group-label {display:block;padding:6px 12px;color:var(--text-muted);font-size:12px;letter-spacing:.06em}
.nav__item {display:block;min-height:44px;padding:9px 12px;border-radius:var(--r-sm)}
.nav__item:hover,.nav__item[aria-current="page"] {background:var(--bg-panel-2);color:var(--text)}
.nav__item strong {display:block;font-size:14.5px;font-weight:500}
.nav__item span {display:block;font-size:12.5px;color:var(--text-muted);line-height:1.5}
.masthead__aside {display:flex;align-items:center;gap:10px;margin-left:auto;flex-shrink:0}
.language {position:relative}
.lang {display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:40px;padding:7px 16px;border:1px solid var(--text);border-radius:var(--r-pill);background:var(--clear);color:var(--text);font-size:14.5px;white-space:nowrap}
.lang:hover {background:var(--bg-panel-2);color:var(--text)}
.lang__short {display:none}
.language__menu {left:auto;right:0;top:calc(100% + 10px);min-width:180px}
.language__menu a {display:flex;align-items:center;min-height:44px;padding:8px 12px;border-radius:var(--r-sm)}
.language__menu a:hover,.language__menu a[aria-current="true"] {background:var(--bg-panel-2);color:var(--text)}
.hamburger {display:none;min-width:44px;min-height:44px;align-items:center;justify-content:center;border:1px solid var(--border-strong);border-radius:var(--r-sm);background:var(--bg);color:var(--text)}
.hamburger svg {width:22px;height:22px}
.mobile-drawer {position:absolute;left:0;right:0;top:100%;background:var(--bg);color:var(--text);border-bottom:1px solid var(--border);max-height:calc(100dvh - var(--nav-h));overflow-y:auto;overscroll-behavior:contain;padding:16px var(--gutter) 24px;z-index:42}
.mobile-drawer ul {list-style:none;margin:0;padding:0}
.mobile-drawer a {display:flex;align-items:center;width:100%;min-height:48px;padding:10px 12px;border-radius:var(--r-sm)}
.mobile-drawer a:hover,.mobile-drawer a[aria-current] {background:var(--bg-panel-2);color:var(--text)}
.mobile-drawer__label {display:block;margin:16px 12px 6px;color:var(--text-muted);font-size:13px}
.nav-veil {position:fixed;inset:var(--nav-h) 0 0;z-index:30;background:var(--veil);color:var(--ink-text);border:0}
.panel,.card {padding:28px;border:1px solid var(--border);border-radius:var(--r-xl);background:var(--bg-panel);color:var(--text);box-shadow:var(--shadow-panel);min-width:0}
.panel--quiet {background:var(--bg-panel-2);color:var(--text);box-shadow:none}
.prose {min-width:0;max-width:100%;line-height:1.85}
.prose h2 {margin-top:2.2em}
.prose h3 {margin-top:1.8em}
.prose a {color:var(--accent-dark);text-decoration:underline;text-underline-offset:3px}
.prose li+li {margin-top:8px}
.prose> :first-child {margin-top:0}
.prose div,.prose section {min-width:0;max-width:100%}
.reveal {opacity:1;transform:none}
html.reveal-ready .reveal:not(.shown) {opacity:0;transform:translateY(16px)}
.reveal {transition:opacity .55s ease,transform .55s ease}
.reveal.shown {opacity:1;transform:none}
.hero {overflow-x:clip}
.hero__frame {min-height:calc(100vh - var(--nav-h) - var(--peek));min-height:calc(100svh - var(--nav-h) - var(--peek));display:grid;align-content:center;padding:40px 24px 40px 64px}
.hero__grid {display:grid;grid-template-columns:minmax(0,46fr) minmax(0,54fr);gap:48px;align-items:center}
.hero__copy {max-width:560px}
.chips {display:flex;flex-wrap:wrap;gap:8px;margin:0 0 28px;padding:0;list-style:none}
.chip {display:inline-flex;align-items:center;gap:8px;min-height:30px;padding:4px 14px 4px 12px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--bg-panel);color:var(--text-muted);font-size:13px;max-width:100%;overflow-wrap:anywhere}
.chip::before {content:"";width:6px;height:6px;flex-shrink:0;border-radius:var(--r-circle);background:var(--accent);color:var(--text)}
.chip:hover {border-color:var(--border-strong);color:var(--text)}
.hero__title {margin:0;font-family:var(--font-display);font-weight:400;font-size:clamp(2rem,.6rem + 2.6vw,3rem);line-height:1.18;letter-spacing:-.012em}
.hero__title span {display:inline-block}
.hero__lead {margin:22px 0 0;font-size:19px;font-weight:500;line-height:1.5}
.hero__desc {margin:10px 0 0;font-size:16px;line-height:1.72;color:var(--text-muted)}
.hero__desc strong {font-weight:600;color:var(--text);background-image:linear-gradient(var(--clear) 64%,var(--accent-soft) 64%)}
.hero__cta {display:flex;flex-wrap:wrap;gap:12px;margin-top:32px}
.platforms {display:flex;align-items:center;flex-wrap:wrap;gap:8px 22px;margin-top:36px;padding-top:20px;border-top:1px solid var(--border)}
.platforms__label {font-size:12.5px;letter-spacing:.08em;color:var(--text-muted)}
.platforms ul {display:flex;flex-wrap:wrap;gap:8px 20px;margin:0;padding:0;list-style:none}
.platforms a {display:inline-flex;align-items:center;gap:7px;font-size:14px;color:var(--text-muted)}
.platforms svg {width:16px;height:16px;flex-shrink:0}
.platforms a:hover {color:var(--text)}
.platforms a:hover svg {color:var(--accent)}
.stage {position:relative;height:600px;border-radius:var(--r-xl);border:1px solid var(--border);background:var(--bg-panel-2);color:var(--text);box-shadow:var(--shadow-panel);overflow:hidden;isolation:isolate}
.scene {position:absolute;inset:0;width:100%;height:100%;display:block}
.st-sky-1 {stop-color:var(--sky-1)}
.st-sky-2 {stop-color:var(--sky-2)}
.st-sky-3 {stop-color:var(--sky-3)}
.st-desk-1 {stop-color:var(--desk-1)}
.st-desk-2 {stop-color:var(--desk-2)}
.f-sky {fill:url(#g-sky)}
.f-sun {fill:var(--sun);opacity:.9}
.f-skyline {fill:var(--skyline);opacity:.5}
.s-mullion {stroke:var(--mullion);stroke-width:4}
.f-sill {fill:var(--mullion)}
.f-sill-lit {fill:var(--mullion-lit)}
.f-wall {fill:var(--wall)}
.f-desk {fill:url(#g-desk)}
.s-grain {fill:none;stroke:var(--walnut-grain);stroke-width:1.2;opacity:.45}
.f-desk-edge {fill:var(--walnut-edge)}
.f-desk-lip {fill:var(--walnut-lip)}
.f-shadow {fill:var(--walnut-edge);opacity:.5}
.f-bezel {fill:var(--bezel)}
.f-screen {fill:var(--screen-bg)}
.f-side {fill:var(--screen-side)}
.s-divide {stroke:var(--screen-block);stroke-width:1}
.f-dot {fill:var(--screen-dot)}
.f-block {fill:var(--screen-block)}
.f-row {fill:var(--bg-panel);stroke:var(--screen-block);stroke-width:.8}
.f-row-on {fill:var(--bg-panel);stroke:var(--accent);stroke-width:.9;stroke-opacity:.55}
.f-accent {fill:var(--accent)}
.f-accent-soft {fill:var(--accent-soft)}
.f-white {fill:var(--bg-panel)}
.t-ui {font-family:var(--font-body);font-size:9.5px;fill:var(--text-muted)}
.t-ui-on {font-family:var(--font-body);font-size:9.5px;font-weight:600;fill:var(--accent-dark)}
.t-title {font-family:var(--font-body);font-size:7px;fill:var(--text-muted)}
.f-shell {fill:var(--shell)}
.f-shell-dark {fill:var(--shell-dark)}
.f-cat {fill:var(--cat);stroke:var(--cat-line);stroke-width:2;stroke-linejoin:round}
.f-cat-ear {fill:var(--cat-ear)}
.f-cat-eye {fill:var(--cat-line)}
.s-tail-out {fill:none;stroke:var(--cat-line);stroke-width:9;stroke-linecap:round}
.s-tail-in {fill:none;stroke:var(--cat);stroke-width:5;stroke-linecap:round}
.f-cup {fill:var(--cup);stroke:var(--cat-line);stroke-width:1.5;stroke-linejoin:round}
.s-handle {fill:none;stroke:var(--cat-line);stroke-width:3}
.f-saucer {fill:var(--cup-shade)}
.f-tea {fill:var(--tea)}
.s-steam {fill:none;stroke:var(--steam);stroke-width:3;stroke-linecap:round}
.s-steam--a {opacity:.85;animation:tea-breath 6s ease-in-out infinite}
.s-steam--b {opacity:.55;animation:tea-breath 6s 2s ease-in-out infinite}
.float-dial {position:absolute;top:24px;left:24px;width:286px;padding:16px 18px 14px;border-radius:var(--r-lg);border:1px solid var(--ink-border);background:var(--ink-panel-a);color:var(--ink-text);box-shadow:var(--shadow-dark-float);backdrop-filter:blur(6px)}
.dial {display:block;width:100%;height:auto}
.dial__track {fill:none;stroke:var(--ink-border);stroke-width:18}
.dial__seg {fill:none;stroke-width:11}
.dial__seg--1 {stroke:var(--dial-1)}
.dial__seg--2 {stroke:var(--dial-2)}
.dial__seg--3 {stroke:var(--dial-3)}
.dial__seg--4 {stroke:var(--dial-4)}
.dial__seg--5 {stroke:var(--dial-5)}
.dial__seg--6 {stroke:var(--dial-6)}
.dial__lbl {font-family:var(--font-mono);font-size:10px;fill:var(--ink-muted)}
.dial__on {fill:var(--ink-text);opacity:0}
.dial__on--trojan {opacity:1}
.dial__center {font-family:var(--font-display);font-size:17px;fill:var(--ink-text)}
.dial__stem {stroke:var(--ink-text);stroke-width:2.4;stroke-linecap:round}
.dial__tip {fill:var(--ink-text);stroke:var(--ink-panel);stroke-width:2.5}
.dial__needle {transform-box:view-box;transform-origin:0 0;transform:rotate(-15deg);animation:needle-patrol 36s ease-in-out infinite}
.dial__on--ss {animation:on-ss 36s linear infinite}
.dial__on--vmess {animation:on-vmess 36s linear infinite}
.dial__on--trojan {animation:on-trojan 36s linear infinite}
.dial__on--vless {animation:on-vless 36s linear infinite}
.dial__on--hy2 {animation:on-hy2 36s linear infinite}
.dial__on--tuic {animation:on-tuic 36s linear infinite}
.dial__note {margin:4px 0 0;text-align:center;font-size:12px;line-height:1.5;color:var(--ink-muted)}
.dial__note a {color:var(--ink-text);border-bottom:1px solid var(--ink-border)}
.float-settings {position:absolute;right:24px;bottom:24px;width:236px;padding:14px 16px 8px;border-radius:var(--r-lg);border:1px solid var(--border);background:var(--bg);color:var(--text);box-shadow:var(--shadow-light-float)}
.fs__head {display:flex;align-items:center;gap:9px;padding-bottom:10px;border-bottom:1px solid var(--border)}
.fs__icon {width:24px;height:24px;display:grid;place-items:center;border-radius:var(--r-icon);background:var(--accent-soft);color:var(--accent-dark)}
.fs__icon svg {width:14px;height:14px}
.fs__title {font-size:14px;font-weight:600}
.fs__sub {margin-left:auto;font-size:11.5px;color:var(--text-muted)}
.fs__list {list-style:none;margin:0;padding:0}
.fs__list li {display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:38px;font-size:13.5px}
.fs__list li+li {border-top:1px solid var(--bg-panel-2)}
.switch {position:relative;flex-shrink:0;width:34px;height:20px;border-radius:var(--r-pill);background:var(--bg-panel-2);color:var(--text);border:1px solid var(--border-strong)}
.switch::after {content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:var(--r-circle);background:var(--bg-panel);color:var(--text);box-shadow:var(--shadow-switch)}
.switch.is-on {background:var(--accent);color:var(--text);border-color:var(--accent)}
.switch.is-on::after {left:auto;right:2px}
.pitfalls {background:var(--ink);color:var(--ink-text);overflow-x:clip}
.pitfalls__frame {border-inline-color:var(--ink-border);padding:34px 64px 112px}
.pitfalls__eyebrow {display:inline-flex;align-items:center;gap:8px;margin:0;font-size:13px;letter-spacing:.08em;color:var(--error)}
.pitfalls__title {margin:18px 0 0;max-width:820px;font-size:2rem;line-height:1.3}
.pitfalls__title em {font-style:normal;color:var(--error)}
.pitfalls__text {margin:16px 0 0;max-width:640px;line-height:1.75;color:var(--ink-muted)}
.site-footer {background:var(--ink);color:var(--ink-text);padding-top:64px;padding-bottom:28px}
.footer__grid {display:grid;grid-template-columns:1.2fr .7fr 1.3fr .7fr;gap:40px}
.site-footer .brand__name {color:var(--ink-text)}
.footer__intro {max-width:300px;margin-top:20px;color:var(--ink-muted);font-size:14px;line-height:1.8}
.footer__heading {font-family:var(--font-body);font-size:14px;font-weight:500;margin-bottom:16px}
.footer__links {list-style:none;margin:0;padding:0}
.footer__links a {display:inline-block;padding-block:5px;color:var(--ink-muted);font-size:14px}
.footer__links a:hover {color:var(--ink-text);text-decoration:underline;text-underline-offset:4px}
.footer__bottom {display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid var(--ink-border);margin-top:44px;padding-top:24px;color:var(--ink-muted);font-size:13px}
@keyframes tea-breath {0%,100%{opacity:.35}50%{opacity:.85}}
@keyframes needle-patrol {
  0%,7%{transform:rotate(-75deg)}10%,17%{transform:rotate(-45deg)}20%,27%{transform:rotate(-15deg)}30%,37%{transform:rotate(15deg)}40%,47%{transform:rotate(45deg)}50%,57%{transform:rotate(75deg)}60%,67%{transform:rotate(45deg)}70%,77%{transform:rotate(15deg)}80%,87%{transform:rotate(-15deg)}90%,97%{transform:rotate(-45deg)}100%{transform:rotate(-75deg)}
}
@keyframes on-ss {0%,7%{opacity:1}9%,98%{opacity:0}100%{opacity:1}}
@keyframes on-vmess {0%,8%{opacity:0}10%,17%{opacity:1}19%,88%{opacity:0}90%,97%{opacity:1}99%,100%{opacity:0}}
@keyframes on-trojan {0%,18%{opacity:0}20%,27%{opacity:1}29%,78%{opacity:0}80%,87%{opacity:1}89%,100%{opacity:0}}
@keyframes on-vless {0%,28%{opacity:0}30%,37%{opacity:1}39%,68%{opacity:0}70%,77%{opacity:1}79%,100%{opacity:0}}
@keyframes on-hy2 {0%,38%{opacity:0}40%,47%{opacity:1}49%,58%{opacity:0}60%,67%{opacity:1}69%,100%{opacity:0}}
@keyframes on-tuic {0%,48%{opacity:0}50%,57%{opacity:1}59%,100%{opacity:0}}
@media(max-width:1200px) {
  .masthead__row {gap:24px}
  .nav__link,.nav__btn {padding-inline:10px}
  .masthead__aside>.btn {display:none}
}
@media(max-width:1120px) {
  .hero__frame {padding-inline:40px 20px}
  .footer__grid {gap:24px}
}
@media(max-width:960px) {
  .frame {border-inline:0}
  .nav {display:none}
  .hamburger {display:inline-flex}
  .masthead__aside {margin-left:auto}
  .masthead__row {gap:12px}
  .hero__frame {padding:32px var(--gutter) 48px;min-height:0}
  .hero__grid {grid-template-columns:minmax(0,1fr);gap:36px}
  .hero__copy {max-width:640px}
  .hero__lead {font-size:17px}
  .stage {height:460px}
  .float-dial {width:240px;top:16px;left:16px;padding:12px 14px 10px}
  .float-settings {width:210px;right:16px;bottom:16px}
  .pitfalls__frame {padding:40px var(--gutter) 72px}
  .pitfalls__title {font-size:1.5rem}
  .footer__grid {grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:768px) {
  h1,.hero__title {font-size:clamp(24px,5vw,30px)}
}
@media(max-width:640px) {
  :root {--gutter:16px;--space-section:56px}
  .grid {grid-template-columns:minmax(0,1fr)}
  .tilt,[data-tilt] {transform:none!important}
  .brand__name {font-size:19px}
  .brand {gap:8px}
  .brand__mark {width:30px;height:30px}
  .masthead__aside {gap:6px;margin-left:auto}
  .lang {padding-inline:12px}
  .lang__full {display:none}
  .lang__short {display:inline}
  .chips {gap:6px;margin-bottom:24px}
  .hero__cta {margin-top:24px}
  .hero__desc {font-size:15px}
  .platforms {margin-top:28px;gap:10px}
  .platforms ul {gap:10px 16px}
  .stage {height:460px}
  .float-dial {width:230px}
  .float-settings {width:200px}
  .panel,.card {padding:22px}
  .footer__grid {grid-template-columns:minmax(0,1fr)}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  *,*::before,*::after {transition:none!important;animation:none!important}
  html.reveal-ready .reveal:not(.shown) {opacity:1;transform:none}
  .dial__needle {transform:rotate(-15deg)}
  .dial__on {opacity:0}
  .dial__on--trojan {opacity:1}
}