:root {
  --bg:#FFFFFF;
  --bg-panel:#F7F8FA;
  --bg-panel-2:#EEF0F5;
  --border:#E3E6EE;
  --border-strong:#D3D8E3;
  --accent:#5A31F4;
  --accent-dark:#3A1FB0;
  --accent-tint:rgba(90,49,244,.07);
  --accent-halo:rgba(90,49,244,.16);
  --on-accent:#FFFFFF;
  --text:#0E1530;
  --text-muted:#56607A;
  --text-slate:#475B80;
  --text-faint:#9AA2B6;
  --success:#1C9E6A;
  --warn:#D97A0B;
  --error:#D93A4A;
  --rib-orange:#FF8A1F;
  --rib-pink:#F25BB0;
  --rib-violet:#8B5CF6;
  --rib-sky:#B9DCFF;
  --rib-lilac:#C8B9FF;
  --glass:rgba(255,255,255,.72);
  --clear:transparent;
  --shadow-1:0 1px 2px rgba(14,21,48,.06);
  --shadow-2:0 12px 32px rgba(14,21,48,.08);
  --shadow-card:var(--shadow-1),var(--shadow-2);
  --shadow-lift:0 2px 4px rgba(14,21,48,.08),0 16px 36px rgba(14,21,48,.11);
  --shadow-win:0 1px 2px rgba(14,21,48,.08),0 26px 60px rgba(14,21,48,.16);
  --shadow-chip:0 1px 2px rgba(14,21,48,.06),0 8px 20px rgba(14,21,48,.07);
  --shadow-btn:0 1px 2px rgba(14,21,48,.10),0 8px 22px rgba(90,49,244,.24);
  --radius:8px;
  --radius-sm:6px;
  --radius-xs:4px;
  --radius-side:5px;
  --radius-mark:2px;
  --radius-dot:50%;
  --radius-pill:999px;
  --font-display:'Inter','Noto Sans SC','PingFang SC','Hiragino Sans','Microsoft YaHei','Malgun Gothic',system-ui,sans-serif;
  --font-body:'Inter','Noto Sans SC','PingFang SC','Hiragino Sans','Microsoft YaHei','Malgun Gothic',system-ui,-apple-system,sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  --weight-normal:400;
  --weight-medium:500;
  --weight-strong:600;
  --size-body:16px;
  --size-small:14px;
  --size-h1:clamp(30px,3.1vw,46px);
  --size-h2:clamp(26px,2.6vw,36px);
  --size-h3:22px;
  --tracking-heading:-.02em;
  --wrap:1280px;
  --reading:800px;
  --gutter:40px;
  --nav-h:72px;
  --section-space:88px;
  --ease:cubic-bezier(.2,.7,.2,1);
  --duration:.2s;
  --ribbon-gradient:linear-gradient(120deg,var(--rib-orange),var(--rib-pink),var(--rib-violet));
  --keyword-gradient:linear-gradient(100deg,var(--accent-dark) 0%,var(--accent) 46%,var(--rib-violet) 100%);
}
*,*::before,*::after { box-sizing:border-box; }
* { margin:0; }
html { -webkit-text-size-adjust:100%; text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:24px; }
html.nav-open { overflow:hidden; }
body {
  background:var(--bg); color:var(--text); font-family:var(--font-body);
  font-size:var(--size-body); line-height:1.6;
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
}
a { color:inherit; text-decoration:none; }
button,input,select,textarea { font:inherit; }
button { color:inherit; background:none; border:0; cursor:pointer; }
button:disabled { cursor:not-allowed; }
img,svg { vertical-align:middle; }
img { max-width:100%; height:auto; }
svg { flex-shrink:0; }
ul,ol { padding-left:1.5em; }
nav ul { list-style:none; padding:0; margin:0; }
[hidden] { display:none !important; }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:var(--radius-xs); }
::selection { background:var(--accent-halo); color:var(--text); }
h1,h2,h3,h4 {
  font-family:var(--font-display); font-weight:var(--weight-normal);
  line-height:1.25; letter-spacing:var(--tracking-heading); text-wrap:balance;
}
h1,.h1 { font-size:var(--size-h1); line-height:1.16; }
h2 { font-size:var(--size-h2); }
h3 { font-size:var(--size-h3); }
strong,b { font-weight:var(--weight-medium); }
code,kbd,pre { font-family:var(--font-mono); }
code { overflow-wrap:anywhere; }
pre { max-width:100%; overflow-x:auto; padding:20px; background:var(--bg-panel); color:var(--text); border:1px solid var(--border); border-radius:var(--radius); }
pre code { overflow-wrap:normal; white-space:pre; }
input,textarea,select { max-width:100%; padding:10px 12px; border:1px solid var(--border-strong); border-radius:var(--radius-sm); background:var(--bg); color:var(--text); }
input::placeholder,textarea::placeholder { color:var(--text-muted); }
:where(.wrap,.header-wrap,.grid,.card,.panel,.prose,.hero,.copy,.footer-grid) > * { min-width:0; }
.wrap { width:min(100% - 48px,var(--wrap)); margin-inline:auto; padding-inline:var(--gutter); }
.reading { max-width:var(--reading); margin-inline:auto; }
.section { padding-top:var(--section-space); padding-bottom:var(--section-space); border-bottom:1px solid var(--border); }
.section-head { max-width:760px; margin-bottom:36px; }
.section-head p { margin-top:16px; color:var(--text-muted); }
.eyebrow { font-family:var(--font-mono); font-size:12px; color:var(--accent); margin-bottom:12px; }
.nowrap { white-space:nowrap; }
.muted { color:var(--text-muted); }
.mono { font-family:var(--font-mono); }
.text-link,.prose a { color:var(--accent); text-decoration:underline; text-underline-offset:4px; }
.text-link:hover,.prose a:hover { color:var(--accent-dark); }
.grid { display:grid; gap:24px; }
.grid-two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid-three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.flow > * + * { margin-top:20px; }
.prose { min-width:0; }
.prose > * + * { margin-top:20px; }
.prose h2 { margin-top:56px; }
.prose h3 { margin-top:32px; }
.prose p,.prose li { line-height:1.85; }
.prose li + li { margin-top:8px; }
.prose :where(h2,h3,[id]) { scroll-margin-top:24px; }
.prose :not(pre) > code { padding:2px 5px; border-radius:var(--radius-xs); background:var(--bg-panel); color:var(--text); font-size:.9em; }
.skip { position:absolute; left:16px; top:-80px; z-index:100; padding:8px 14px; border-radius:var(--radius-sm); background:var(--accent); color:var(--on-accent); font-size:14px; }
.skip:focus { top:12px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; border:0; }
.page { position:relative; }
.page::before,.page::after { content:""; position:absolute; top:0; bottom:0; width:1px; background:var(--border); z-index:1; pointer-events:none; }
.page::before { left:max(24px,calc(50% - var(--wrap) / 2)); }
.page::after { right:max(24px,calc(50% - var(--wrap) / 2)); }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  min-height:46px; padding:10px 20px; border:1px solid var(--clear);
  border-radius:var(--radius-sm); font-size:15px; font-weight:var(--weight-medium); letter-spacing:.005em;
  text-align:center; max-width:100%;
  transition:background-color var(--duration) var(--ease),border-color var(--duration) var(--ease),transform var(--duration) var(--ease),box-shadow var(--duration) var(--ease);
}
.btn svg { width:14px; height:14px; }
.btn-primary { background:var(--accent); color:var(--on-accent); box-shadow:var(--shadow-btn); }
.btn-primary:hover,.btn-primary.is-hover { background:var(--accent-dark); color:var(--on-accent); transform:translateY(-1px); }
.btn-primary:active,.btn-primary.is-active { background:var(--accent-dark); color:var(--on-accent); transform:translateY(0); box-shadow:var(--shadow-1); }
.btn-ghost { background:var(--bg); color:var(--accent); border-color:var(--border-strong); }
.btn-ghost:hover { border-color:var(--accent); box-shadow:var(--shadow-1); }
.btn:disabled,.btn[aria-disabled="true"] { background:var(--bg-panel-2); color:var(--text-muted); border-color:var(--border); box-shadow:none; transform:none; }
.btn.is-focus { outline:2px solid var(--accent); outline-offset:3px; }
.cta { margin-top:32px; display:flex; flex-wrap:wrap; gap:12px; }
.card,.panel { border:1px solid var(--border); border-radius:var(--radius); background:var(--bg); color:var(--text); padding:28px; }
.card { box-shadow:var(--shadow-card); transition:transform var(--duration) var(--ease),box-shadow var(--duration) var(--ease); }
.card:hover { transform:translateY(-2px); box-shadow:var(--shadow-lift); }
.panel { background:var(--bg-panel); color:var(--text); }
.card p { margin-top:14px; color:var(--text-muted); }
.card-corner { position:relative; isolation:isolate; overflow:hidden; }
.card-corner::before { content:""; position:absolute; right:-60px; bottom:-90px; width:320px; height:260px; background:var(--ribbon-gradient); color:var(--text); filter:blur(52px); opacity:.18; z-index:-1; pointer-events:none; }
.top,#site-header { position:relative; z-index:30; min-height:var(--nav-h); }
.top { height:var(--nav-h); border-bottom:1px solid var(--border); background:var(--glass); color:var(--text); backdrop-filter:blur(16px) saturate(1.3); -webkit-backdrop-filter:blur(16px) saturate(1.3); }
.header-wrap {
  width:100%; max-width:min(100%,calc(1280px + var(--gutter) * 2));
  height:100%; margin-inline:auto; padding-inline:var(--gutter);
  display:flex; align-items:center; gap:40px;
}
.brand { display:inline-flex; align-items:center; gap:10px; flex-shrink:0; font-family:var(--font-display); font-size:17px; font-weight:var(--weight-medium); letter-spacing:-.01em; color:var(--text); }
.brand img { width:28px; height:28px; flex-shrink:0; }
.nav { margin-left:auto; min-width:0; }
.nav ul { display:flex; align-items:center; list-style:none; margin:0; padding:0; gap:30px; }
.nav a { display:block; padding-block:12px; white-space:nowrap; font-size:14.5px; color:var(--text); font-weight:var(--weight-normal); transition:color var(--duration) var(--ease); }
.nav a:hover { color:var(--accent); }
.nav a[aria-current="page"] { font-weight:var(--weight-strong); }
.header-tools { display:flex; align-items:center; gap:8px; flex-shrink:0; }
.lang-picker { position:relative; }
.lang { display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:34px; padding:5px 12px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg); color:var(--text); font-size:13.5px; white-space:nowrap; }
.lang:hover { border-color:var(--border-strong); }
.caret { font-size:11px; color:var(--text-muted); }
.lang-menu { position:absolute; right:0; top:calc(100% + 10px); min-width:170px; padding:6px; list-style:none; border:1px solid var(--border); border-radius:var(--radius); background:var(--bg); color:var(--text); box-shadow:var(--shadow-card); z-index:4; }
.lang-menu a { display:flex; align-items:center; min-height:44px; padding:8px 12px; font-size:14px; border-radius:var(--radius-xs); }
.lang-menu a:hover,.lang-menu a[aria-current] { background:var(--bg-panel); color:var(--accent); }
.menu-toggle { display:none; align-items:center; justify-content:center; min-width:44px; min-height:44px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg); color:var(--accent); }
.menu-toggle svg { width:20px; height:20px; }
.mobile-nav { display:none; }
.menu-veil { position:fixed; inset:var(--nav-h) 0 0; z-index:1; background:var(--accent-halo); color:var(--text); width:100%; }
.mobile-nav { position:absolute; top:var(--nav-h); left:0; right:0; z-index:2; max-height:calc(100dvh - var(--nav-h)); overflow-y:auto; overscroll-behavior:contain; padding:16px var(--gutter) 28px; border-bottom:1px solid var(--border); background:var(--bg); color:var(--text); }
.mobile-nav a { display:flex; align-items:center; width:100%; min-height:44px; padding:10px 12px; border-radius:var(--radius-xs); }
.mobile-nav a:hover,.mobile-nav a[aria-current] { background:var(--bg-panel); color:var(--accent); }
.mobile-nav .mobile-languages { border-top:1px solid var(--border); margin-top:12px; padding-top:12px; }
.site-footer { padding-top:56px; padding-bottom:28px; border-top:1px solid var(--border); background:var(--bg-panel); color:var(--text); }
.footer-grid { display:grid; grid-template-columns:1.4fr 1fr 1.3fr; gap:48px; }
.footer-brand p { max-width:29em; margin-top:18px; color:var(--text-muted); font-size:14px; }
.footer-title { font-size:14px; font-weight:var(--weight-medium); margin-bottom:14px; }
.footer-links { list-style:none; padding:0; display:grid; gap:10px; font-size:14px; color:var(--text-muted); }
.footer-links a:hover { color:var(--accent); }
.footer-languages { display:flex; flex-wrap:wrap; gap:8px 24px; padding-top:28px; margin-top:36px; border-top:1px solid var(--border); font-size:13px; color:var(--text-muted); }
.footer-languages a { padding-block:6px; }
.footer-languages a[aria-current],.footer-languages a:hover { color:var(--accent); }
.copyright { margin-top:18px; color:var(--text-muted); font-size:12px; }
.reveal { opacity:1; transform:none; }
html.reveal-ready .reveal:not(.shown) { opacity:0; transform:translateY(12px); }
.reveal { transition:opacity .65s var(--ease),transform .65s var(--ease); }
.reveal.shown { opacity:1; transform:none; }

/* 拍板首屏：左右导轨、46/54 文图与固定窗口尺度。 */
.first { position:relative; min-height:100vh; min-height:100svh; display:grid; grid-template-rows:auto 1fr auto; overflow:hidden; }
.first-main { display:contents; }
.hero { position:relative; z-index:2; display:grid; align-content:center; padding-top:28px; padding-bottom:28px; overflow-x:clip; }
.hero .wrap { display:grid; grid-template-columns:46fr 54fr; column-gap:40px; align-items:center; }
.copy { position:relative; z-index:3; }
.badge { display:inline-flex; align-items:center; gap:10px; max-width:100%; padding:5px 14px 5px 11px; border:1px solid var(--border); border-radius:var(--radius-pill); background:var(--bg); color:var(--text-muted); box-shadow:var(--shadow-1); font-size:13px; overflow-wrap:anywhere; }
.badge .dot { width:8px; height:8px; flex-shrink:0; border-radius:var(--radius-dot); background:var(--accent); box-shadow:0 0 0 4px var(--accent-halo); }
.badge b { font-weight:var(--weight-medium); color:var(--text); }
.badge .sep { color:var(--text-muted); }
.h1 { margin-top:26px; font-family:var(--font-display); font-weight:var(--weight-normal); letter-spacing:var(--tracking-heading); }
.h1 > span { display:block; }
.h1-a { color:var(--text); }
.h1-b { color:var(--text-slate); }
.kw { font-style:normal; background:var(--keyword-gradient); color:var(--clear); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:var(--clear); }
.lead { margin-top:22px; max-width:31em; font-size:17px; line-height:1.75; color:var(--text-muted); }
.lead strong { font-weight:var(--weight-medium); color:var(--text); }
.plats { margin-top:40px; padding-top:22px; border-top:1px solid var(--border); max-width:520px; }
.plats-label { font-size:12.5px; color:var(--text-muted); letter-spacing:.02em; }
.plats ul { margin-top:12px; padding:0; list-style:none; display:flex; flex-wrap:wrap; gap:8px; }
.plat { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:34px; padding:5px 12px; border:1px solid var(--border); border-radius:var(--radius-sm); background:var(--bg); color:var(--text); font-size:13.5px; transition:border-color var(--duration) var(--ease),box-shadow var(--duration) var(--ease),transform var(--duration) var(--ease); }
.plat svg { width:15px; height:15px; color:var(--text-muted); }
.plat:hover { border-color:var(--accent); box-shadow:var(--shadow-1); transform:translateY(-1px); }
.plat:hover svg { color:var(--accent); }
.stage { position:relative; width:620px; height:640px; }
.ribbons { position:absolute; left:0; top:0; overflow:visible; z-index:0; width:800px; height:640px; }
.c-orange { stop-color:var(--rib-orange); }
.c-pink { stop-color:var(--rib-pink); }
.c-violet { stop-color:var(--rib-violet); }
.c-sky { stop-color:var(--rib-sky); }
.c-lilac { stop-color:var(--rib-lilac); }
.c-accent { stop-color:var(--accent); }
.c-white { stop-color:var(--bg); }
.so0 { stop-opacity:0; }
.drift { transform-box:view-box; transform-origin:420px 150px; animation:ribbon-drift 18s ease-in-out infinite alternate; }
@keyframes ribbon-drift { from { transform:translate(0,0) skewX(0); opacity:1; } to { transform:translate(-6px,5px) skewX(-.8deg); opacity:.9; } }
.ribbon-line { fill:none; stroke:url(#ribbon-color); }
.fiber { fill:none; stroke:var(--bg); stroke-width:.5; opacity:.15; }
.ribbon-branches { fill:none; opacity:.92; }
.branch-direct { stroke:var(--rib-orange); }
.branch-proxy { stroke:var(--rib-pink); }
.branch-reject { stroke:var(--rib-violet); }
.particles { fill:var(--accent); opacity:.3; }
.particles-pink { fill:var(--rib-pink); opacity:.4; }
.win { position:absolute; left:20px; top:110px; z-index:2; width:480px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--radius); box-shadow:var(--shadow-win); overflow:hidden; transform:rotate(-4deg); }
.win-bar { height:34px; display:grid; grid-template-columns:60px 1fr 60px; align-items:center; padding:0 12px; border-bottom:1px solid var(--border); }
.dots { display:flex; gap:6px; }
.dots i { width:9px; height:9px; flex-shrink:0; border-radius:var(--radius-dot); background:var(--border-strong); }
.win-title { text-align:center; font-size:12px; font-weight:var(--weight-medium); color:var(--text-muted); letter-spacing:.01em; }
.win-body { display:grid; grid-template-columns:108px 1fr; min-height:296px; }
.side { display:flex; flex-direction:column; gap:2px; padding:12px 8px; background:var(--bg-panel); color:var(--text-muted); border-right:1px solid var(--border); }
.side span { position:relative; display:block; padding:6px 10px 6px 14px; border-radius:var(--radius-side); font-size:12.5px; }
.side .on { background:var(--bg); color:var(--text); font-weight:var(--weight-medium); box-shadow:var(--shadow-1); }
.side .on::before { content:""; position:absolute; left:0; top:7px; bottom:7px; width:2px; border-radius:var(--radius-mark); background:var(--accent); }
.win-main { min-width:0; display:flex; flex-direction:column; gap:10px; padding:14px 16px 12px; }
.main-head { display:flex; align-items:center; justify-content:space-between; height:20px; }
.main-head strong { font-size:13.5px; font-weight:var(--weight-medium); color:var(--text); }
.file { padding:1px 6px; border:1px solid var(--border); border-radius:var(--radius-xs); background:var(--bg-panel); color:var(--text-muted); font-family:var(--font-mono); font-size:10.5px; }
.code { padding:8px 0; background:var(--bg-panel); color:var(--text); border:1px solid var(--border); border-radius:var(--radius-sm); font-family:var(--font-mono); font-size:11.5px; line-height:21px; overflow-x:auto; }
.ln { display:grid; grid-template-columns:30px 1fr; padding-right:10px; white-space:pre; }
.ln .n { padding-right:10px; text-align:right; color:var(--text-muted); }
.ln.cur { background:var(--accent-tint); color:var(--text); }
.k { color:var(--text); font-weight:var(--weight-medium); }
.v { color:var(--text-slate); }
.p { color:var(--accent); font-weight:var(--weight-medium); }
.main-foot { display:flex; gap:20px; padding-top:10px; border-top:1px solid var(--border); }
.tg { display:inline-flex; align-items:center; gap:8px; font-size:12px; color:var(--text-muted); }
.sw { position:relative; width:26px; height:15px; flex-shrink:0; border-radius:var(--radius-pill); background:var(--bg-panel-2); border:1px solid var(--border-strong); }
.sw::after { content:""; position:absolute; top:1px; left:1px; width:11px; height:11px; border-radius:var(--radius-dot); background:var(--bg); box-shadow:var(--shadow-1); }
.sw.on { background:var(--accent); border-color:var(--accent); }
.sw.on::after { left:12px; }
.route { position:absolute; top:540px; z-index:3; transform:translateX(-50%); display:inline-flex; align-items:center; gap:7px; height:30px; padding:0 13px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--radius-pill); box-shadow:var(--shadow-chip); font-family:var(--font-mono); font-size:11.5px; font-weight:var(--weight-medium); letter-spacing:.06em; }
.route i { width:6px; height:6px; flex-shrink:0; border-radius:var(--radius-dot); }
.r-direct { left:124px; }
.r-direct i { background:var(--success); }
.r-proxy { left:310px; }
.r-proxy i { background:var(--accent); }
.r-reject { left:496px; }
.r-reject i { background:var(--error); }
.statusbar { position:relative; z-index:3; background:var(--bg-panel); color:var(--text-muted); border-block:1px solid var(--border); }
.statusbar .wrap { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.fact { display:flex; align-items:center; gap:10px; min-height:56px; padding:8px 16px; border-left:1px solid var(--border); font-family:var(--font-mono); font-size:12.5px; letter-spacing:.01em; }
.fact:first-child { border-left:0; }
.fact i { width:6px; height:6px; flex-shrink:0; border:1px solid var(--accent); border-radius:var(--radius-mark); }
.fact b { font-weight:var(--weight-medium); color:var(--text); }
@media (max-width:1180px) {
  .nav ul { gap:20px; }
  .header-wrap { gap:24px; }
}
@media (max-width:1080px) {
  .nav { display:none; }
  .header-tools { margin-left:auto; }
  .menu-toggle { display:inline-flex; }
  .mobile-nav:not([hidden]) { display:block; }
  .hero .wrap { grid-template-columns:minmax(0,1fr); row-gap:24px; }
  .stage { margin-inline:auto; }
  .statusbar .wrap { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .fact:nth-child(3) { border-left:0; }
  .fact:nth-child(n+3) { border-top:1px solid var(--border); }
  .footer-grid { grid-template-columns:1.2fr 1fr; }
  .footer-brand { grid-column:1/-1; }
}
@media (max-width:768px) {
  :root { --gutter:24px; --section-space:56px; --size-h1:clamp(24px,4vw,30px); }
  .grid-three { grid-template-columns:minmax(0,1fr); }
  .stage { zoom:.8; }
  .hero { padding-top:36px; }
}
@media (max-width:640px) {
  :root { --gutter:20px; }
  .wrap { width:100%; padding-inline:var(--gutter); }
  .header-wrap { padding-inline:var(--gutter); gap:12px; }
  .brand { font-size:15px; gap:7px; }
  .brand img { width:26px; height:26px; }
  .lang { padding-inline:9px; font-size:12px; }
  .header-tools { gap:6px; margin-left:auto; }
  .grid-two,.footer-grid { grid-template-columns:minmax(0,1fr); }
  .footer-grid { gap:28px; }
  .footer-brand { grid-column:auto; }
  .card,.panel { padding:22px; }
  .stage { zoom:.54; }
  .tilt,.win { transform:none; }
  .lead { font-size:16px; }
  .badge { gap:7px; font-size:11px; padding-inline:10px; }
  .plats { margin-top:28px; }
  .plats ul { flex-direction:row; flex-wrap:wrap; }
  .plat { font-size:12px; padding-inline:9px; gap:6px; }
  .fact { min-height:48px; padding-inline:10px; font-size:11px; gap:7px; }
  .page::before { left:0; }
  .page::after { right:0; }
}
@media (max-width:359px) {
  :root { --gutter:16px; }
  .brand { font-size:14px; }
  .lang { padding-inline:7px; }
  .stage { zoom:.45; }
  .badge { font-size:10px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation:none !important; transition:none !important; }
  html.reveal-ready .reveal:not(.shown) { opacity:1; transform:none; }
}