:root {
  --bg:#ffffff;
  --bg-panel:#f8f7f4;
  --bg-panel2:#f1efea;
  --border:#e8e6e1;
  --hairline:#efede8;
  --device-line:#d6d3cc;
  --accent:#9c6b0a;
  --accent-dark:#6f4c07;
  --text:#1c1b19;
  --text-muted:#6b6862;
  --success:#2f8a5b;
  --warn:#b8650f;
  --error:#c0392b;
  --ink:#1c1b19;
  --ink-hover:#34322e;
  --on-ink:#ffffff;
  --glow:#fdf3d6;
  --glow-mid:rgba(253,243,214,.55);
  --glow-0:rgba(253,243,214,0);
  --tint-cream:#fdf5e1;
  --tint-sage:#ebf3ec;
  --tint-mist:#ebf1f8;
  --tint-lilac:#f3eefa;
  --pill-cream:#fbf1d8;
  --pill-cream-line:#efdcae;
  --dot-halo:rgba(156,107,10,.15);
  --band-honey:#f5dfa6;
  --band-mist:#d3e1f2;
  --band-lilac:#e2d5f2;
  --veil:rgba(28,27,25,.18);
  --transparent:transparent;
  --shadow-xs:0 1px 2px rgba(28,27,25,.05);
  --shadow-float:0 1px 2px rgba(28,27,25,.04),0 10px 24px -12px rgba(28,27,25,.13),0 28px 56px -30px rgba(28,27,25,.16);
  --shadow-key:0 2px 0 #e3e0da,0 10px 20px -10px rgba(28,27,25,.2);
  --shadow-ink:0 1px 0 rgba(255,255,255,.08) inset,0 12px 24px -12px rgba(28,27,25,.55);
  --shadow-device:0 2px 6px rgba(28,27,25,.04),0 34px 80px -36px rgba(28,27,25,.26);
  --shadow-press:0 -24px 48px -30px rgba(28,27,25,.24),0 1px 2px rgba(28,27,25,.04);
  --r-section:28px;
  --r-float:18px;
  --r-btn:12px;
  --r-pill:999px;
  --r-key:10px;
  --r-inset:12px;
  --r-mark:9px;
  --r-badge-mark:7.5px;
  --r-focus:6px;
  --r-shot:8px;
  --r-lid:30px 30px 0 0;
  --r-lid-inner:25px 25px 0 0;
  --r-screen:16px 16px 0 0;
  --r-notch:0 0 10px 10px;
  --r-lid-mobile:20px 20px 0 0;
  --r-lid-inner-mobile:16px 16px 0 0;
  --r-screen-mobile:11px 11px 0 0;
  --r-notch-mobile:0 0 7px 7px;
  --font-display:'Inter','Noto Sans SC','PingFang SC','Hiragino Sans','Apple SD Gothic Neo','Microsoft YaHei',system-ui,sans-serif;
  --font-body:'Inter','Noto Sans SC','PingFang SC','Hiragino Sans','Apple SD Gothic Neo','Microsoft YaHei',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'JetBrains Mono',ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --fs-h1:clamp(34px,3.4vw,48px);
  --fs-h1-mobile:clamp(24px,7.2vw,30px);
  --fs-h2:clamp(26px,3vw,36px);
  --fs-h3:22px;
  --fs-body:16px;
  --fs-small:14px;
  --fs-caption:13px;
  --fs-code:12.5px;
  --track-display:-.02em;
  --track-latin:-.035em;
  --gutter:24px;
  --content-width:1200px;
  --reading-width:780px;
  --section-space:160px;
  --speed:.2s;
  --reveal-speed:.65s;
}
*,*::before,*::after { box-sizing:border-box; }
html { background:var(--bg); color:var(--text); scroll-behavior:smooth; scroll-padding-top:24px; }
body {
  margin:0; background:var(--bg); color:var(--text);
  font:400 var(--fs-body)/1.8 var(--font-body);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
[hidden] { display:none!important; }
img,svg { max-width:100%; }
img { display:block; }
svg { flex-shrink:0; }
button,input,select,textarea { font:inherit; }
button,a { -webkit-tap-highlight-color:var(--transparent); }
button { cursor:pointer; }
a { color:var(--accent); text-underline-offset:.2em; }
a:hover { color:var(--accent-dark); }
:focus-visible { outline:2px solid var(--accent); outline-offset:3px; border-radius:var(--r-focus); }
::selection { background:var(--pill-cream); color:var(--text); }
h1,h2,h3,h4 { font-family:var(--font-display); font-weight:800; color:var(--text); text-wrap:balance; overflow-wrap:break-word; }
h1 { margin:0; font-size:var(--fs-h1); line-height:1.2; letter-spacing:var(--track-display); }
h2 { margin:0 0 24px; font-size:var(--fs-h2); line-height:1.3; letter-spacing:var(--track-display); }
h3 { margin:0 0 16px; font-size:var(--fs-h3); line-height:1.45; letter-spacing:var(--track-display); }
p { margin:0 0 20px; }
ul,ol { padding-inline-start:1.5em; }
code,kbd,pre { font-family:var(--font-mono); }
code { overflow-wrap:anywhere; font-size:.88em; }
pre { max-width:100%; min-width:0; overflow-x:auto; padding:22px; border:1px solid var(--border); border-radius:var(--r-inset); background:var(--bg-panel); color:var(--text); line-height:1.7; }
pre code { white-space:pre; overflow-wrap:normal; word-break:normal; font-size:var(--fs-small); }
hr { border:0; border-top:1px solid var(--border); margin:40px 0; }
:where(section,article,aside,div,li) { min-width:0; }
.wrap { width:100%; max-width:calc(var(--content-width) + var(--gutter) * 2); margin-inline:auto; padding-inline:var(--gutter); }
.reading { max-width:calc(var(--reading-width) + var(--gutter) * 2); margin-inline:auto; padding-inline:var(--gutter); }
.section { padding-top:var(--section-space); padding-bottom:var(--section-space); }
.section-panel { background:var(--bg-panel); color:var(--text); }
.prose { min-width:0; overflow-wrap:break-word; }
.prose :where(h2,h3) { margin-top:2.4em; scroll-margin-top:32px; }
.prose p { max-width:76ch; }
.prose li + li { margin-top:8px; }
.prose :where(section,div) { max-width:100%; }
.nowrap { white-space:nowrap; }
.muted { color:var(--text-muted); }
.eyebrow { margin:0; display:flex; align-items:center; gap:9px; font-size:var(--fs-caption); font-weight:600; color:var(--accent-dark); }
.dot { display:inline-block; flex-shrink:0; width:7px; height:7px; border-radius:var(--r-pill); background:var(--accent); color:var(--text); box-shadow:0 0 0 3px var(--dot-halo); }
.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:var(--gutter); z-index:100; padding:10px 18px; background:var(--bg); color:var(--text); border:1px solid var(--accent); border-radius:var(--r-btn); transform:translateY(-160%); }
.skip-link:focus { transform:none; }
.btn {
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  min-height:50px; padding:12px 22px; border:1px solid var(--transparent);
  border-radius:var(--r-btn); font:600 15.5px/1.35 var(--font-body);
  letter-spacing:-.005em; text-align:center; text-decoration:none;
  transition:background-color var(--speed),border-color var(--speed),transform var(--speed),box-shadow var(--speed);
}
.btn svg { width:18px; height:18px; }
.btn-primary { background:var(--ink); color:var(--on-ink); box-shadow:var(--shadow-ink); }
.btn-primary:hover,.btn-primary.is-hover { background:var(--ink-hover); color:var(--on-ink); transform:translateY(-1px); }
.btn-ghost { background:var(--bg); color:var(--text); border-color:var(--border); box-shadow:var(--shadow-xs); }
.btn-ghost:hover,.btn-ghost.is-hover { background:var(--bg); color:var(--text); border-color:var(--device-line); transform:translateY(-1px); }
.btn-ghost svg { color:var(--text-muted); }
.btn:active { transform:translateY(1px); }
.btn:disabled,.btn[aria-disabled="true"] { cursor:not-allowed; opacity:.5; transform:none; box-shadow:none; }
.btn.is-focus { outline:2px solid var(--accent); outline-offset:3px; }
.card,.panel { padding:32px; border:1px solid var(--border); border-radius:var(--r-section); background:var(--bg); color:var(--text); box-shadow:var(--shadow-float); }
.card h3,.panel h3 { margin-top:0; }
.card-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; }
.card-grid > * { min-width:0; }
.t-cream { background:var(--tint-cream); color:var(--text); }
.t-sage { background:var(--tint-sage); color:var(--text); }
.t-mist { background:var(--tint-mist); color:var(--text); }
.t-lilac { background:var(--tint-lilac); color:var(--text); }

/* 页头使用独立宽版心，不借用正文版心。 */
.topbar,#site-header { position:relative; z-index:40; background:var(--bg); color:var(--text); }
.topbar-in {
  width:100%; max-width:min(100%,calc(1280px + var(--gutter) * 2));
  min-height:68px; padding-inline:var(--gutter); margin-inline:auto;
  display:flex; align-items:center; gap:32px;
}
.brand { display:inline-flex; align-items:center; gap:10px; flex-shrink:0; text-decoration:none; color:var(--text); font-weight:700; font-size:16.5px; line-height:1.4; letter-spacing:-.01em; }
.brand:hover { color:var(--text); }
.brand-mark { display:block; width:32px; height:32px; flex-shrink:0; border-radius:var(--r-mark); border:1px solid var(--border); background:linear-gradient(145deg,var(--bg),var(--bg-panel2)); color:var(--text); box-shadow:var(--shadow-xs); }
.mainnav { min-width:0; margin-left:auto; }
.mainnav ul { display:flex; align-items:center; list-style:none; margin:0; padding:0; gap:30px; }
.mainnav a { display:block; padding-block:12px; text-decoration:none; font-size:14.5px; line-height:1.5; font-weight:500; white-space:nowrap; color:var(--text-muted); transition:color var(--speed); }
.mainnav a:hover { color:var(--text); }
.mainnav a[aria-current="page"] { color:var(--text); font-weight:700; }
.header-tools { display:flex; align-items:center; gap:10px; flex-shrink:0; }
.language-picker { position:relative; }
.lang {
  appearance:none; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  min-height:34px; padding:9px 14px; font:500 13.5px/1 var(--font-body);
  color:var(--text); background:var(--bg); border:1px solid var(--border);
  border-radius:var(--r-pill); text-decoration:none;
}
.lang:hover { border-color:var(--device-line); color:var(--text); }
.lang-arrow { font-size:11px; color:var(--text-muted); }
.lang-short { display:none; }
.language-menu { position:absolute; right:0; top:calc(100% + 10px); width:190px; padding:8px; list-style:none; margin:0; border:1px solid var(--border); border-radius:var(--r-float); background:var(--bg); color:var(--text); box-shadow:var(--shadow-float); z-index:5; }
.language-menu a { display:flex; align-items:center; min-height:44px; padding:10px 14px; text-decoration:none; color:var(--text); border-radius:var(--r-btn); }
.language-menu a:hover,.language-menu a[aria-current="true"] { background:var(--bg-panel); color:var(--accent-dark); }
.menu-toggle { display:none; min-width:44px; min-height:44px; align-items:center; justify-content:center; padding:10px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--r-btn); }
.menu-toggle svg { width:22px; height:22px; }
.mobile-drawer { display:none; }
.menu-veil { position:fixed; inset:68px 0 0; z-index:-1; border:0; background:var(--veil); color:var(--text); }
html.nav-open { overflow:hidden; }

/* 已确认的静态首屏装置。 */
.hero { position:relative; isolation:isolate; overflow-x:clip; }
.hero::before { content:""; position:absolute; inset:0 0 auto; height:780px; z-index:-1; background:radial-gradient(82% 80% at 50% 0%,var(--glow) 0%,var(--glow-mid) 40%,var(--glow-0) 78%); color:var(--text); pointer-events:none; }
.stage { position:relative; width:min(1328px,calc(100% - 48px)); margin-inline:auto; padding-top:52px; display:flex; flex-direction:column; align-items:center; text-align:center; }
.badge-row { margin:0; display:flex; align-items:center; gap:10px; min-height:30px; }
.badge-mark { width:26px; height:26px; flex-shrink:0; border-radius:var(--r-badge-mark); border:1px solid var(--border); background:linear-gradient(145deg,var(--bg),var(--bg-panel2)); color:var(--text); box-shadow:var(--shadow-xs); }
.badge-pill { display:inline-flex; align-items:center; gap:8px; padding:6px 13px; font-size:var(--fs-caption); line-height:1.3; font-weight:600; color:var(--accent-dark); background:var(--pill-cream); border:1px solid var(--pill-cream-line); border-radius:var(--r-pill); }
.hero h1 { margin:26px 0 0; max-width:760px; }
.hl { position:relative; display:inline-block; line-height:1; white-space:nowrap; }
.hl::after { content:""; position:absolute; left:.02em; right:.08em; bottom:-.1em; height:.13em; border-radius:var(--r-pill); background:var(--accent); color:var(--text); }
.lede { margin:22px 0 0; max-width:620px; font-size:17px; line-height:1.7; color:var(--text-muted); }
.lede strong { color:var(--text); font-weight:650; }
.cta { margin-top:30px; display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }
.platforms { list-style:none; margin:30px 0 0; padding:0; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:22px; min-height:34px; }
.platforms li { display:inline-flex; align-items:center; gap:7px; font-size:13.5px; font-weight:500; color:var(--text); }
.platforms a { display:inline-flex; align-items:center; gap:7px; text-decoration:none; color:var(--text); white-space:nowrap; }
.platforms a:hover { color:var(--accent); }
.platforms svg { width:16px; height:16px; color:var(--text-muted); }
.platforms .price-pill { margin-left:4px; gap:8px; padding:7px 13px; font-size:12.5px; line-height:1.4; font-weight:600; background:var(--bg-panel); color:var(--text); border:1px solid var(--border); border-radius:var(--r-pill); }
.orbit { display:contents; }
.obj { position:absolute; z-index:1; text-align:left; color:var(--text); border:1px solid var(--border); border-radius:var(--r-float); padding:13px 15px 14px; box-shadow:var(--shadow-float); transform:rotate(var(--tilt,0deg)); }
.obj-head { display:flex; align-items:center; gap:6px; margin-bottom:8px; font-size:11.5px; font-weight:600; letter-spacing:.02em; color:var(--text-muted); }
.obj-head svg,.obj-title svg { width:13px; height:13px; color:var(--text-muted); }
.obj-title { display:flex; align-items:center; gap:7px; font-size:14.5px; line-height:1.5; font-weight:700; letter-spacing:-.01em; }
.rule { display:block; font:500 var(--fs-code)/1.6 var(--font-mono); white-space:nowrap; color:var(--text); }
.rule .kw { color:var(--accent-dark); font-weight:600; }
.rule .c { color:var(--text-muted); }
.rule b { font-weight:700; }
.glist { list-style:none; margin:10px 0 0; padding:0; min-width:214px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--r-inset); }
.glist li { display:flex; align-items:center; justify-content:space-between; gap:18px; min-height:31px; padding:4px 12px; font-size:var(--fs-caption); line-height:1.5; font-weight:600; }
.glist li + li { border-top:1px solid var(--hairline); }
.glist em { font-style:normal; font-weight:400; font-size:12px; color:var(--text-muted); }
.url { display:block; margin-top:9px; padding:6px 9px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--r-mark); font:500 11.5px/1.4 var(--font-mono); white-space:nowrap; }
.obj-note { margin:7px 0 0; font-size:11.5px; color:var(--text-muted); }
.obj-text { margin:5px 0 0; font-size:var(--fs-caption); color:var(--text-muted); }
.chips { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:6px; max-width:236px; }
.chips li { padding:4px 10px; font-size:12px; line-height:1.5; font-weight:600; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--r-pill); }
.pos-l1 { left:24px; top:36px; --tilt:-4deg; }
.pos-l2 { left:0; top:132px; --tilt:2deg; }
.pos-l3 { left:40px; top:312px; --tilt:-2deg; }
.pos-r1 { right:40px; top:30px; --tilt:3deg; }
.pos-r2 { right:96px; top:186px; --tilt:-3deg; }
.pos-r3 { right:20px; top:318px; --tilt:1.5deg; }
.key { position:absolute; z-index:1; display:grid; place-items:center; min-width:46px; height:46px; padding:0 12px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--r-key); box-shadow:var(--shadow-key); font:600 15px/1 var(--font-body); transform:rotate(var(--tilt,0deg)); }
.key-sm { font-size:var(--fs-caption); }
.k1 { left:330px; top:44px; --tilt:-5deg; }
.k2 { right:318px; top:28px; --tilt:4deg; }
.k3 { right:300px; top:330px; --tilt:-3deg; }
.device { position:relative; z-index:1; width:min(1000px,calc(100% - 48px)); height:290px; margin:52px auto 0; }
.lid { position:relative; height:430px; padding:15px 15px 0; background:var(--bg); color:var(--text); border:1.5px solid var(--device-line); border-bottom:0; border-radius:var(--r-lid); box-shadow:var(--shadow-device); clip-path:inset(-90px -90px 140px -90px); }
.lid::before { content:""; position:absolute; inset:5px 5px 0; border:1px solid var(--hairline); border-bottom:0; border-radius:var(--r-lid-inner); pointer-events:none; }
.screen { position:relative; height:100%; overflow:hidden; display:flex; align-items:flex-start; justify-content:center; padding-top:84px; background:linear-gradient(180deg,var(--bg),var(--bg-panel)); color:var(--text); border:1px solid var(--border); border-bottom:0; border-radius:var(--r-screen); }
.notch { position:absolute; top:-1px; left:50%; z-index:2; width:132px; height:18px; transform:translateX(-50%); background:var(--bg); color:var(--text); border:1px solid var(--border); border-top:0; border-radius:var(--r-notch); }
.notch::after { content:""; position:absolute; left:50%; top:5px; width:6px; height:6px; margin-left:-3px; border-radius:var(--r-pill); border:1px solid var(--device-line); }
.band { position:absolute; left:6%; right:6%; top:50px; height:112px; border-radius:var(--r-pill); background:linear-gradient(90deg,var(--band-honey),var(--band-mist) 52%,var(--band-lilac)); color:var(--text); filter:blur(26px); opacity:.95; }
.screen-word { position:relative; z-index:1; margin:0; font-family:var(--font-display); font-size:30px; font-weight:800; line-height:44px; letter-spacing:-.03em; color:var(--text); white-space:nowrap; }
.screen-word span { margin:0 .38em; font-weight:500; color:var(--text-muted); }
.next { position:relative; z-index:3; margin-top:-44px; padding-bottom:var(--section-space); }
.next-card { width:min(1200px,calc(100% - 48px)); margin-inline:auto; padding:26px 56px 64px; background:var(--bg); color:var(--text); border:1px solid var(--border); border-radius:var(--r-section); box-shadow:var(--shadow-press); }
.next-card h2 { margin:28px 0 0; font-size:32px; line-height:1.25; letter-spacing:var(--track-display); }
.next-lede { margin:14px 0 0; max-width:720px; font-size:var(--fs-body); line-height:1.75; color:var(--text-muted); }
.next-grid { margin-top:32px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; }
.next-tile { display:flex; flex-direction:column; gap:6px; padding:22px 24px; text-decoration:none; background:var(--bg-panel); color:var(--text); border:1px solid var(--border); border-radius:var(--r-float); transition:border-color var(--speed),transform var(--speed); }
.next-tile:hover { color:var(--text); border-color:var(--device-line); transform:translateY(-1px); }
.next-tile strong { font-size:var(--fs-body); font-weight:700; }
.next-tile span { font-size:var(--fs-small); color:var(--text-muted); }

/* 页脚与渐入。默认内容可见，只有工具脚本启用后才进入待显状态。 */
.site-footer { padding-top:80px; padding-bottom:32px; border-top:1px solid var(--border); background:var(--bg); color:var(--text); }
.footer-grid { display:grid; grid-template-columns:1.4fr .8fr 1.2fr; gap:64px; }
.footer-brand p { margin-top:20px; max-width:34em; font-size:var(--fs-small); color:var(--text-muted); }
.footer-title { margin:0 0 16px; font-size:var(--fs-small); font-weight:700; }
.footer-links { display:flex; flex-wrap:wrap; gap:8px 20px; list-style:none; margin:0; padding:0; }
.footer-links a { display:inline-block; padding-block:5px; font-size:var(--fs-small); color:var(--text-muted); text-decoration:none; overflow-wrap:anywhere; }
.footer-links a:hover { color:var(--accent); }
.footer-nav .footer-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); }
.footer-bottom { display:flex; flex-wrap:wrap; justify-content:space-between; gap:18px 32px; margin-top:56px; padding-top:24px; border-top:1px solid var(--border); font-size:var(--fs-caption); color:var(--text-muted); }
.footer-bottom p { margin:0; }
.footer-legal { display:flex; gap:20px; flex-wrap:wrap; }
.footer-legal a { color:var(--text-muted); }
.reveal { opacity:1; transform:none; }
.reveal-pending { opacity:0; transform:translateY(16px); transition:opacity var(--reveal-speed),transform var(--reveal-speed); }
.reveal.shown { opacity:1; transform:none; }

@media (max-width:1360px) {
  .obj { transform:rotate(var(--tilt,0deg)) scale(.9); }
  .pos-l1,.pos-l2,.pos-l3 { transform-origin:left center; }
  .pos-r1,.pos-r2,.pos-r3 { transform-origin:right center; }
}
@media (max-width:1199px) {
  .topbar-in { gap:16px; }
  .mainnav { display:none; }
  .header-tools { margin-left:auto; }
  .menu-toggle { display:inline-flex; }
  .mobile-drawer { position:absolute; left:0; right:0; top:100%; z-index:3; padding:16px var(--gutter) 24px; max-height:calc(100dvh - 68px); overflow-y:auto; overscroll-behavior:contain; background:var(--bg); color:var(--text); border-top:1px solid var(--border); box-shadow:var(--shadow-float); }
  .mobile-drawer:not([hidden]) { display:block; }
  .mobile-drawer ul { list-style:none; padding:0; margin:0; }
  .mobile-drawer a { display:flex; width:100%; min-height:44px; align-items:center; padding:11px 12px; color:var(--text); text-decoration:none; border-radius:var(--r-btn); }
  .mobile-drawer a:hover,.mobile-drawer a[aria-current] { background:var(--bg-panel); color:var(--accent-dark); }
  .drawer-languages { margin-top:16px!important; padding-top:16px!important; border-top:1px solid var(--border); }
}
@media (max-width:1199px) {
  .stage { padding-top:40px; }
  .orbit { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; width:100%; }
  .orbit-top { margin:22px 0 0; }
  .orbit-bottom { margin:28px 0 0; }
  .orbit .obj { position:static; transform:rotate(calc(var(--tilt,0deg) * .5)); }
  .desk-only,.key { display:none; }
  .hero h1 { margin-top:24px; }
}
@media (max-width:768px) {
  h1 { font-size:var(--fs-h1-mobile); }
  .card-grid { grid-template-columns:minmax(0,1fr); }
  .footer-grid { grid-template-columns:1fr 1fr; gap:32px; }
  .footer-brand { grid-column:1/-1; }
}
@media (max-width:760px) {
  .stage { width:calc(100% - 40px); padding-top:32px; }
  .lede { font-size:15.5px; }
  .platforms { gap:12px 18px; max-width:420px; }
  .platforms .price-pill { margin-left:0; }
  .rule { font-size:11.5px; }
  .url { font-size:10.5px; }
  .device { height:170px; margin-top:40px; width:calc(100% - 32px); }
  .lid { height:260px; padding:9px 9px 0; border-radius:var(--r-lid-mobile); clip-path:inset(-60px -60px 90px -60px); }
  .lid::before { border-radius:var(--r-lid-inner-mobile); left:4px; right:4px; top:4px; }
  .screen { padding-top:50px; border-radius:var(--r-screen-mobile); }
  .notch { width:78px; height:12px; border-radius:var(--r-notch-mobile); }
  .notch::after { top:3px; width:4px; height:4px; margin-left:-2px; }
  .band { top:28px; height:72px; filter:blur(18px); }
  .screen-word { font-size:clamp(15px,4.6vw,22px); line-height:30px; }
  .next { margin-top:-28px; }
  .next-card { width:calc(100% - 32px); padding:22px 22px 36px; }
  .next-card h2 { font-size:24px; }
  .next-grid { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:640px) {
  :root { --gutter:16px; }
  .wrap,.reading { padding-inline:var(--gutter); }
  .topbar-in { gap:10px; }
  .brand { font-size:var(--fs-small); gap:8px; }
  .header-tools { gap:6px; margin-left:auto; }
  .lang { min-height:40px; padding:9px 12px; }
  .lang-full { display:none; }
  .lang-short { display:inline; }
  .obj,.tilt,[class*="tilt-"],.orbit .obj { transform:none; }
  .orbit { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:8px; }
  .orbit .obj { padding:10px; }
  .orbit .desk-only { display:none; }
  .orbit .rule,.orbit .url { white-space:normal; overflow-wrap:anywhere; }
  .orbit .obj-head { font-size:10px; }
  .orbit .obj-title { font-size:12px; }
  .orbit .obj-note,.orbit .obj-text { font-size:10.5px; }
  .orbit .chips { gap:4px; }
  .orbit .chips li { padding:3px 6px; font-size:10px; }
  .card,.panel { padding:24px; }
  .footer-grid { gap:28px; grid-template-columns:minmax(0,1fr); }
  .footer-brand { grid-column:auto; }
  .footer-bottom { margin-top:32px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none!important; animation:none!important; }
  .reveal,.reveal-pending { opacity:1; transform:none; }
}