:root{
  --r-device:3cqw;
  --r-screen:1.7cqw;
  --r-phone:3.4cqw;
  --table-min:680px;
  --float-space:88px;
  --float-cycle:7s;
  --float-distance:6px;
  --preview-swatch-height:64px;
  --price-size:44px;
}
.tabs{min-width:0}
[role="tablist"]{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:8px;background:var(--panel-2);border-radius:var(--r-panel);width:fit-content;max-width:100%;box-shadow:inset 0 1px 3px var(--shade-brown-06)}
[role="tab"]{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:12px 24px;border:1px solid var(--clear);background:var(--clear);border-radius:var(--r-pill);font-weight:var(--weight-bold);white-space:nowrap}
[role="tab"][aria-selected="true"]{background:var(--panel);border-color:var(--border);box-shadow:var(--shadow-panel);color:var(--text)}
[role="tabpanel"]{margin-top:24px;min-width:0}
.toc-tabs{position:sticky;top:var(--toc-offset);z-index:10;display:flex;align-items:center;gap:8px;max-width:100%;padding:8px;margin-block:24px;background:var(--panel);border:1px solid var(--border);border-radius:var(--r-panel);box-shadow:var(--shadow-panel);overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:thin}
.toc-tabs a{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;min-height:44px;padding:10px 18px;border-radius:var(--r-pill);font-size:var(--fs-ui);font-weight:var(--weight-semibold);text-decoration:none;white-space:nowrap}
.toc-tabs a:hover,.toc-tabs a.is-current{background:var(--panel-2);color:var(--text)}
.toc-tabs a.is-current{box-shadow:inset 0 0 0 1px var(--border-warm)}
.toc-tabs.toc-static{position:static}
body:has(.toc-tabs) section[id]{scroll-margin-top:var(--anchor-offset)}
.faq-item{border-bottom:1px solid var(--border);background:var(--panel);border-radius:var(--r-groove);margin-bottom:12px;padding-inline:24px;box-shadow:inset 0 1px 0 var(--hi-white)}
.faq-item summary{position:relative;min-height:64px;padding:20px 32px 20px 0;cursor:pointer;font-weight:var(--weight-bold);list-style:none}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";position:absolute;right:0;top:18px;font-size:var(--fs-subtitle)}
.faq-item[open] summary::after{content:"−"}
.faq-item>p,.faq-answer{padding-bottom:24px;margin:0;color:var(--muted)}
.pricing-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;align-items:stretch}
.plan-card{position:relative;min-width:0;display:flex;flex-direction:column;padding:32px;border:1px solid var(--border);border-radius:var(--r-card);background:var(--panel);box-shadow:var(--shadow-panel)}
.plan-card.is-current{background:linear-gradient(145deg,var(--accent-soft),var(--apricot-soft));border:2px solid var(--border-warm);padding:31px;box-shadow:var(--shadow-deep)}
.plan-card .price{font:var(--weight-display) var(--price-size)/1.2 var(--font-display);letter-spacing:var(--tracking-latin);margin:16px 0}
.price small{font:var(--weight-medium) var(--fs-body)/1.5 var(--font-body);letter-spacing:normal;color:var(--muted)}
.plan-card h3{font-size:var(--fs-h3)}
.plan-card ul{padding-left:1.2em;margin-bottom:32px}
.plan-card .btn{margin-top:auto;align-self:flex-start}
.plan-badge{display:inline-flex;align-items:center;align-self:flex-start;max-width:100%;padding:6px 12px;margin-bottom:16px;border-radius:var(--r-pill);background:var(--text);color:var(--panel);font-size:var(--fs-xs);font-weight:var(--weight-bold);overflow-wrap:anywhere}
.plan-cycle{font:var(--weight-semibold) var(--fs-sm)/1.5 var(--font-mono);color:var(--muted)}
.table-scroll{width:100%;max-width:100%;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--border);border-radius:var(--r-panel);background:var(--panel);box-shadow:var(--shadow-panel)}
.data-table,.route-table{width:100%;min-width:var(--table-min);font-size:var(--fs-ui)}
.data-table caption,.route-table caption{text-align:start;padding:20px 24px;font-weight:var(--weight-bold);color:var(--text)}
.data-table th,.data-table td,.route-table th,.route-table td{padding:16px 24px;border-bottom:1px solid var(--border);word-break:keep-all;color:var(--text);vertical-align:top}
.table-scroll th,.data-table th,.route-table th{font-weight:var(--weight-bold);white-space:nowrap;background:var(--panel-2);color:var(--text)}
.data-table tr:last-child td,.route-table tr:last-child td{border-bottom:0}
.route-group th{background:var(--clay-mid);font-size:var(--fs-body)}
.prose>.data-table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%;min-width:0}
.platform-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:16px}
.platform-card{display:flex;flex-direction:column;align-items:flex-start;min-width:0;padding:24px;border-radius:var(--r-panel);background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-panel)}
.platform-card svg{width:32px;height:32px;fill:currentColor;display:block;margin-bottom:20px;color:var(--muted)}
.platform-card h3{font-size:var(--fs-lede)}
.platform-card .btn{padding-inline:16px;min-height:44px;font-size:var(--fs-sm);margin-top:auto}
.article-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.article-card{min-width:0;padding:28px;border-radius:var(--r-panel);background:var(--panel);border:1px solid var(--border);box-shadow:var(--shadow-panel)}
.article-card h3{font-size:var(--fs-subtitle);line-height:1.5}
.article-card h3 a{text-decoration:none}
.article-card h3 a:hover{text-decoration:underline}
.article-card p{color:var(--muted)}
.article-meta{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-bottom:20px;font:var(--weight-medium) var(--fs-xs)/1.5 var(--font-mono);color:var(--muted)}
.tag,.chip{display:inline-flex;align-items:center;max-width:100%;padding:5px 10px;border:1px solid var(--border);border-radius:var(--r-pill);background:var(--panel-2);font:var(--weight-semibold) var(--fs-xs)/1.5 var(--font-body);color:var(--text);overflow-wrap:anywhere;white-space:normal}
.callout{margin:24px 0;padding:24px 28px;border-left:4px solid var(--border-warm);border-radius:var(--r-groove);background:var(--panel-2);box-shadow:inset 0 1px 0 var(--hi-white)}
.callout p:last-child{margin-bottom:0}
.promo-block{display:flex;align-items:center;justify-content:space-between;gap:32px;padding:32px;border:1px solid var(--border);border-radius:var(--r-panel);background:linear-gradient(120deg,var(--panel),var(--accent-soft));box-shadow:var(--shadow-panel);margin-block:40px}
.promo-block>*{min-width:0}
.promo-block p{margin:8px 0 0;color:var(--muted)}
.promo-block .btn{flex-shrink:0;white-space:nowrap}
.promo-brand{font:var(--weight-display) var(--fs-h3)/1.3 var(--font-display);letter-spacing:var(--tracking-latin)}
.float-cta{position:fixed;right:24px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:15;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:14px 22px;border-radius:var(--r-pill);text-decoration:none;font-weight:var(--weight-bold);font-size:var(--fs-ui);color:var(--panel);background:linear-gradient(160deg,var(--accent),var(--accent-dark));box-shadow:0 16px 40px var(--shade-berry-14),inset 0 1px 0 var(--hi-white-soft);white-space:nowrap}
.float-cta svg{width:18px;height:18px}
body:has(.float-cta)::after{content:"";display:block;height:calc(88px + env(safe-area-inset-bottom,0px))}
.feature-card{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:48px;padding:48px;border-radius:var(--r-card);box-shadow:var(--shadow-panel);overflow-x:clip;min-width:0}
.feature-card>*{min-width:0}
.feature-card:nth-child(even) .feature-window{order:-1}
.candy-berry{background:linear-gradient(125deg,var(--accent-mist),var(--apricot-soft))}
.candy-mint{background:linear-gradient(125deg,var(--mint),var(--mint-soft))}
.candy-cobalt{background:linear-gradient(125deg,var(--cobalt-soft),var(--accent-mist))}
.feature-window{border:1px solid var(--border);border-radius:var(--r-panel);background:var(--panel);box-shadow:var(--shadow-deep);overflow:hidden}
.window-bar{display:flex;align-items:center;gap:6px;padding:14px 18px;background:var(--panel-2);border-bottom:1px solid var(--border);font:var(--weight-semibold) var(--fs-xs)/1.4 var(--font-mono)}
.window-dot{display:block;width:8px;height:8px;flex-shrink:0;border-radius:var(--r-round)}
.dot-error{background:var(--error)}
.dot-warn{background:var(--warn)}
.dot-success{background:var(--success)}
.window-body{padding:24px}
.passport-spread{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:linear-gradient(90deg,var(--panel),var(--bg),var(--panel-2) 49.8%,var(--clay-deep) 50%,var(--bg) 50.5%,var(--panel));border:1px solid var(--border);border-radius:var(--r-card);box-shadow:var(--shadow-panel);overflow:hidden}
.passport-entry{padding:40px 28px;text-align:center;min-width:0}
.passport-entry+.passport-entry{border-left:2px dashed var(--border-warm)}
.entry-seal{display:inline-flex;align-items:center;justify-content:center;min-width:112px;min-height:112px;padding:20px;margin-bottom:24px;border:2px solid var(--stamp-ink);outline:1px solid var(--stamp-ink);outline-offset:-7px;border-radius:var(--r-round);color:var(--text);font-weight:var(--weight-heavy)}
.passport-entry h3{font-size:var(--fs-subtitle)}
.passport-entry p{color:var(--muted);margin-bottom:0}
.stats-band{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:24px;padding:24px 32px;border:1px solid var(--border);border-radius:var(--r-panel);background:var(--panel-2);font-family:var(--font-mono)}
.stage{position:relative;z-index:1;container-type:inline-size;aspect-ratio:72/62;min-width:0;max-width:100%}
.rig{--u:calc(100cqw / 72);position:absolute;inset:0;font-family:var(--font-body);font-size:calc(var(--u)*1.1);line-height:1.3;color:var(--text)}
.rig p,.rig ul{margin:0;padding:0;list-style:none}
.rig li{margin:0}
.rig>*{position:absolute}
.s-glow{left:calc(var(--u)*1);top:calc(var(--u)*12);width:calc(var(--u)*70);height:calc(var(--u)*44);z-index:0;border-radius:var(--r-round);background:radial-gradient(50% 50% at 36% 56%,var(--glow-apricot-18),var(--clear)),radial-gradient(46% 48% at 66% 46%,var(--glow-berry-14),var(--clear))}
.s-ground{z-index:1;border-radius:var(--r-round);background:radial-gradient(closest-side,var(--shade-brown-16),var(--clear))}
.g-mon{left:calc(var(--u)*12);top:calc(var(--u)*44.4);width:calc(var(--u)*44);height:calc(var(--u)*3.6)}
.g-mob{left:calc(var(--u)*46);top:calc(var(--u)*58);width:calc(var(--u)*24);height:calc(var(--u)*3.4)}
.g-stamp{left:calc(var(--u)*20);top:calc(var(--u)*56.2);width:calc(var(--u)*16);height:calc(var(--u)*3)}
.g-pass{left:0;top:calc(var(--u)*42.4);width:calc(var(--u)*14);height:calc(var(--u)*2.6)}
.s-globe{left:calc(var(--u)*.6);top:calc(var(--u)*2.6);width:calc(var(--u)*11);height:calc(var(--u)*11);z-index:1;opacity:.75;filter:blur(1.6px);animation:clay-float var(--float-cycle) ease-in-out infinite}
.globe-ball{position:absolute;inset:0;border-radius:var(--r-round);background:radial-gradient(circle at 34% 28%,var(--clay-hi) 0 12%,var(--apricot-soft) 42%,var(--apricot-clay) 78%,var(--accent-mist) 100%);box-shadow:inset 0 calc(var(--u)*-1) calc(var(--u)*2) var(--shade-berry-10),0 calc(var(--u)*1.2) calc(var(--u)*2.4) var(--shade-berry-10)}
.globe-grid{position:absolute;inset:0;width:100%;height:100%;display:block}
.globe-line{fill:none;stroke:var(--hi-white-soft)}
.monitor{left:calc(var(--u)*7);top:calc(var(--u)*4);width:calc(var(--u)*54);height:calc(var(--u)*42.4);z-index:3;isolation:isolate}
.bezel{position:relative;z-index:2;padding:calc(var(--u)*1.2) calc(var(--u)*1.2) calc(var(--u)*2.4);border-radius:var(--r-device);background:linear-gradient(165deg,var(--clay-hi) 0%,var(--clay-mid) 45%,var(--clay-lo) 100%);box-shadow:inset 0 1px 0 var(--white),inset 0 0 0 1px var(--hi-white-soft),inset 0 calc(var(--u)*-.8) calc(var(--u)*1.6) var(--shade-brown-06),0 calc(var(--u)*3) calc(var(--u)*6) calc(var(--u)*-1) var(--shade-berry-10),0 calc(var(--u)*1) calc(var(--u)*2) var(--shade-brown-10)}
.chin{position:absolute;left:0;right:0;bottom:calc(var(--u)*.6);text-align:center;font:var(--weight-bold) calc(var(--u)*.8)/1 var(--font-mono);letter-spacing:.32em;color:var(--clay-deep);text-shadow:0 1px 0 var(--hi-white)}
.neck{position:absolute;z-index:1;left:50%;top:calc(var(--u)*35);width:calc(var(--u)*7);height:calc(var(--u)*5.6);margin-left:calc(var(--u)*-3.5);background:linear-gradient(90deg,var(--clay-lo),var(--clay-mid) 40%,var(--clay-lo));box-shadow:inset 0 calc(var(--u)*.8) calc(var(--u)*1) var(--shade-brown-10)}
.foot{position:absolute;z-index:1;left:50%;top:calc(var(--u)*40.2);width:calc(var(--u)*20);height:calc(var(--u)*2.2);margin-left:calc(var(--u)*-10);border-radius:var(--r-pill);background:linear-gradient(180deg,var(--clay-hi),var(--clay-lo));box-shadow:inset 0 1px 0 var(--white),0 calc(var(--u)*.8) calc(var(--u)*1.6) var(--shade-brown-10)}
.screen{position:relative;height:calc(var(--u)*32);border-radius:var(--r-screen);overflow:hidden;background:var(--panel);border:1px solid var(--clay-deep)}
.screen::after{content:"";position:absolute;z-index:5;top:-30%;bottom:-30%;left:58%;width:calc(var(--u)*8);background:linear-gradient(90deg,var(--clear),var(--glass-streak),var(--clear));transform:rotate(20deg);opacity:.55;pointer-events:none}
.chrome{position:relative;display:flex;align-items:center;gap:calc(var(--u)*.5);height:calc(var(--u)*2.8);padding:0 calc(var(--u)*1.1);background:linear-gradient(180deg,var(--panel),var(--panel-2));border-bottom:1px solid var(--border)}
.cd{width:calc(var(--u)*.85);height:calc(var(--u)*.85);border-radius:var(--r-round);flex:none}
.cd-r{background:var(--error)}
.cd-y{background:var(--warn)}
.cd-g{background:var(--success)}
.chrome-title{position:absolute;left:50%;transform:translateX(-50%);font:var(--weight-semibold) calc(var(--u)*.9)/1 var(--font-mono);color:var(--muted);white-space:nowrap}
.chrome-tag{margin-left:auto;padding:calc(var(--u)*.25) calc(var(--u)*.6);border-radius:var(--r-pill);background:var(--success-soft);color:var(--success);font:var(--weight-bold) calc(var(--u)*.8)/1 var(--font-body)}
.app{display:grid;grid-template-columns:calc(var(--u)*4.4) calc(var(--u)*14.8) 1fr calc(var(--u)*11);height:calc(100% - var(--u)*2.8)}
.app>*{min-width:0}
.rail{display:flex;flex-direction:column;align-items:center;gap:calc(var(--u)*.8);padding:calc(var(--u)*1.2) 0;background:var(--panel-2);border-right:1px solid var(--border)}
.rail-item{position:relative;width:100%;display:flex;justify-content:center}
.rail-item.is-on::before{content:"";position:absolute;left:0;top:50%;width:calc(var(--u)*.4);height:calc(var(--u)*1.8);margin-top:calc(var(--u)*-.9);border-radius:var(--r-pill);background:var(--text)}
.fdot{display:block;flex:none;border-radius:var(--r-round);overflow:hidden;box-shadow:0 0 0 1px var(--flag-edge)}
.fdot svg{display:block;width:100%;height:100%}
.fdot-rail{width:calc(var(--u)*2.6);height:calc(var(--u)*2.6)}
.rail-item.is-on .fdot{box-shadow:0 0 0 calc(var(--u)*.22) var(--panel-2),0 0 0 calc(var(--u)*.46) var(--accent-mist)}
.chan{display:flex;flex-direction:column;padding:calc(var(--u)*1.2) calc(var(--u)*.8);background:var(--panel);border-right:1px solid var(--border)}
.chan-head{margin:0 calc(var(--u)*.3) calc(var(--u)*.8);font:var(--weight-semibold) calc(var(--u)*.9)/1.2 var(--font-mono);letter-spacing:var(--tracking-meta);color:var(--muted)}
.chan-list{display:grid;gap:calc(var(--u)*.25)}
.chan-item{display:flex;align-items:center;gap:calc(var(--u)*.35);padding:calc(var(--u)*.55) calc(var(--u)*.7);border-radius:var(--r-flag);font:var(--weight-semibold) calc(var(--u)*1.05)/1.3 var(--font-body);color:var(--muted);white-space:nowrap}
.hash{color:var(--clay-deep);font-weight:var(--weight-bold)}
.chan-item.is-on{background:var(--accent-soft);color:var(--text);box-shadow:inset calc(var(--u)*.3) 0 0 var(--accent-mist)}
.chan-item.is-on .hash{color:var(--accent-clay)}
.me{margin-top:auto;display:flex;align-items:center;gap:calc(var(--u)*.6);padding:calc(var(--u)*.6);border-radius:var(--r-flag);background:var(--panel-2)}
.me-ava{display:grid;place-items:center;flex:none;width:calc(var(--u)*2.2);height:calc(var(--u)*2.2);border-radius:var(--r-round);background:linear-gradient(160deg,var(--text-soft),var(--text));color:var(--panel);font:var(--weight-heavy) calc(var(--u)*.8)/1 var(--font-display)}
.me-txt{display:grid;gap:calc(var(--u)*.15)}
.me-a{font:var(--weight-bold) calc(var(--u)*.95)/1.2 var(--font-body);white-space:nowrap}
.me-b{font:var(--weight-medium) calc(var(--u)*.8)/1.2 var(--font-body);color:var(--muted);white-space:nowrap}
.main{display:flex;align-items:center;padding:calc(var(--u)*1.2);background:linear-gradient(180deg,var(--bg-top),var(--panel-2))}
.conn{width:100%;display:flex;flex-direction:column;align-items:center;padding:calc(var(--u)*1.3) calc(var(--u)*1.2) calc(var(--u)*1.4);border-radius:var(--r-sm);background:var(--panel);box-shadow:0 calc(var(--u)*1.2) calc(var(--u)*2.4) calc(var(--u)*-.6) var(--shade-berry-14),0 0 0 1px var(--border),inset 0 1px 0 var(--white)}
.conn-label{align-self:flex-start;margin-bottom:calc(var(--u)*.8);font:var(--weight-semibold) calc(var(--u)*.85)/1.2 var(--font-mono);letter-spacing:var(--tracking-meta);color:var(--muted)}
.conn-toggle{display:grid;place-items:center;width:calc(var(--u)*6);height:calc(var(--u)*6);margin:calc(var(--u)*.4) 0 calc(var(--u)*1.4);border-radius:var(--r-round);background:radial-gradient(circle at 35% 30%,var(--panel) 0 18%,var(--accent-soft) 50%,var(--accent-mist) 100%);box-shadow:0 0 0 calc(var(--u)*.7) var(--accent-soft),0 calc(var(--u)*1) calc(var(--u)*2) var(--shade-berry-14),inset 0 1px 0 var(--white)}
.conn-toggle svg{width:calc(var(--u)*2.4);height:calc(var(--u)*2.4);display:block}
.conn-title{display:flex;align-items:center;gap:calc(var(--u)*.5);font:var(--weight-heavy) calc(var(--u)*1.2)/1.3 var(--font-body);white-space:nowrap}
.live-dot{display:block;flex:none;width:calc(var(--u)*.7);height:calc(var(--u)*.7);border-radius:var(--r-round);background:var(--success);box-shadow:0 0 0 calc(var(--u)*.25) var(--success-soft);animation:breathe 2.4s ease-in-out infinite}
.conn-sub{margin:calc(var(--u)*.3) 0 calc(var(--u)*1);font:var(--weight-medium) calc(var(--u)*.85)/1.3 var(--font-body);color:var(--muted)}
.conn-chips{display:flex;flex-wrap:wrap;justify-content:center;gap:calc(var(--u)*.4)}
.conn-chips li{padding:calc(var(--u)*.25) calc(var(--u)*.55);border-radius:var(--r-pill);background:var(--panel-2);box-shadow:inset 0 0 0 1px var(--border);font:var(--weight-semibold) calc(var(--u)*.9)/1.3 var(--font-body);white-space:nowrap}
.conn-fact{margin-top:calc(var(--u)*1.1);padding:calc(var(--u)*.45) calc(var(--u)*.9);border-radius:var(--r-pill);background:linear-gradient(180deg,var(--text-soft),var(--text));color:var(--panel);font:var(--weight-semibold) calc(var(--u)*.95)/1.3 var(--font-mono);white-space:nowrap;box-shadow:inset 0 1px 0 var(--hi-white-faint)}
.devs{padding:calc(var(--u)*1.2) calc(var(--u)*.9);background:var(--bg-top);border-left:1px solid var(--border)}
.devs-head{margin-bottom:calc(var(--u)*.5);font:var(--weight-semibold) calc(var(--u)*.9)/1.2 var(--font-mono);letter-spacing:var(--tracking-meta);color:var(--muted)}
.dev{display:flex;align-items:center;gap:calc(var(--u)*.5);height:calc(var(--u)*2.4);border-bottom:1px dashed var(--border);font:var(--weight-semibold) calc(var(--u)*1)/1 var(--font-body);white-space:nowrap}
.dev-ico{width:calc(var(--u)*1.3);height:calc(var(--u)*1.3);display:block;flex:none;color:var(--muted);fill:currentColor}
.dev-on{margin-left:auto;width:calc(var(--u)*.5);height:calc(var(--u)*.5);border-radius:var(--r-round);background:var(--success);flex:none}
.devs-note{display:grid;gap:calc(var(--u)*.15);margin-top:calc(var(--u)*1.4);font-size:calc(var(--u)*.9);color:var(--muted)}
.devs-note strong{font-size:calc(var(--u)*1.15);color:var(--text)}
.phone{left:calc(var(--u)*49);top:calc(var(--u)*27);width:calc(var(--u)*18);height:calc(var(--u)*31);z-index:6;padding:calc(var(--u)*.85);border-radius:var(--r-phone);transform:rotate(8deg);background:linear-gradient(145deg,var(--clay-hi),var(--clay-lo));box-shadow:inset 0 1px 0 var(--white),0 calc(var(--u)*2) calc(var(--u)*4) var(--shade-berry-10),0 calc(var(--u)*.5) calc(var(--u)*1.2) var(--shade-brown-16)}
.phone-screen{height:100%;border-radius:var(--r-device);padding:calc(var(--u)*2.8) calc(var(--u)*1.1) calc(var(--u)*1.5);background:linear-gradient(180deg,var(--panel),var(--panel-2));border:1px solid var(--border-warm);overflow:hidden}
.phone::before{content:"";position:absolute;top:calc(var(--u)*1.4);left:37%;right:37%;height:calc(var(--u)*.6);border-radius:var(--r-pill);background:var(--clay-deep)}
.phone-title{font-weight:var(--weight-heavy);font-size:calc(var(--u)*1.3);margin-bottom:calc(var(--u)*1.4)}
.phone-stamps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:calc(var(--u)*.7)}
.mini-seal{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*.3);aspect-ratio:1;border:1px dashed var(--stamp-ink);border-radius:var(--r-round);font-size:calc(var(--u)*.9);color:var(--muted)}
.mini-seal .fdot{width:calc(var(--u)*2);height:calc(var(--u)*2)}
.mobile-connect{display:flex;align-items:center;justify-content:center;gap:calc(var(--u)*.5);margin-top:calc(var(--u)*1.3);padding:calc(var(--u)*1) calc(var(--u)*.5);border-radius:var(--r-pill);background:var(--text);color:var(--panel);font-weight:var(--weight-bold);font-size:calc(var(--u)*1)}
.mobile-traffic{text-align:center;margin-top:calc(var(--u)*.8);font:var(--weight-semibold) calc(var(--u)*.9)/1.4 var(--font-mono)}
.passport{left:calc(var(--u)*.7);top:calc(var(--u)*29);width:calc(var(--u)*12);height:calc(var(--u)*15);z-index:5;transform:rotate(-15deg);animation:passport-float 8s ease-in-out infinite;border-radius:var(--r-flag) var(--r-sm) var(--r-sm) var(--r-flag);background:linear-gradient(145deg,var(--accent-soft),var(--accent-clay));border-left:calc(var(--u)*.7) solid var(--accent-mist);box-shadow:inset 0 1px 0 var(--hi-white),0 calc(var(--u)*1.2) calc(var(--u)*2.4) var(--shade-berry-10);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:calc(var(--u)*1);color:var(--foil)}
.passport svg{width:calc(var(--u)*6);height:calc(var(--u)*6);stroke:currentColor;fill:none}
.passport span{font:var(--weight-heavy) calc(var(--u)*1.1)/1 var(--font-mono);letter-spacing:.12em}
.stamp{left:calc(var(--u)*24);top:calc(var(--u)*44);width:calc(var(--u)*11);height:calc(var(--u)*13);z-index:7;transform:rotate(14deg);animation:stamp-float 9s ease-in-out infinite}
.stamp-handle{position:absolute;left:35%;top:0;width:30%;height:65%;border-radius:var(--r-pill);background:linear-gradient(90deg,var(--wood-lo),var(--wood-light) 40%,var(--wood-hi));box-shadow:inset 0 1px 0 var(--hi-white-soft)}
.stamp-base{position:absolute;bottom:0;width:100%;height:45%;display:grid;place-items:center;border-radius:var(--r-round);border:calc(var(--u)*.7) solid var(--wood-hi);background:var(--clay-hi);box-shadow:0 calc(var(--u)*.7) calc(var(--u)*1) var(--shade-brown-16);color:var(--stamp-ink);font-size:calc(var(--u)*2);font-weight:var(--weight-heavy)}
.lock{left:calc(var(--u)*65);top:calc(var(--u)*39);width:calc(var(--u)*6.6);height:calc(var(--u)*9);z-index:7;animation:clay-float 6s ease-in-out -2s infinite}
.lock-loop{position:absolute;top:0;left:18%;width:64%;height:60%;border:calc(var(--u)*1) solid var(--clay-lo);border-radius:var(--r-pill);box-shadow:inset 0 1px 0 var(--hi-white)}
.lock-body{position:absolute;inset:38% 0 0;border-radius:var(--r-sm);background:linear-gradient(145deg,var(--apricot-soft),var(--apricot-clay));box-shadow:inset 0 1px 0 var(--hi-white),0 calc(var(--u)*.8) calc(var(--u)*1.6) var(--shade-berry-10)}
.lock-body::after{content:"";position:absolute;inset:34% 43%;border-radius:var(--r-pill);background:var(--keyhole)}
.travel-bubble{padding:calc(var(--u)*.8) calc(var(--u)*1.2);border:1px solid var(--border);border-radius:var(--r-pill);background:var(--panel);box-shadow:var(--shadow-panel);font-size:calc(var(--u)*1.15);font-weight:var(--weight-bold);z-index:4;white-space:nowrap}
.bubble-jp{left:calc(var(--u)*49);top:calc(var(--u)*.1)}
.bubble-us{left:calc(var(--u)*12);top:calc(var(--u)*48)}
@keyframes clay-float{0%,100%{transform:translateY(0)}50%{transform:translateY(calc(var(--float-distance)*-1))}}
@keyframes passport-float{0%,100%{transform:translateY(0) rotate(-15deg)}50%{transform:translateY(-5px) rotate(-15deg)}}
@keyframes stamp-float{0%,100%{transform:translateY(0) rotate(14deg)}50%{transform:translateY(-4px) rotate(14deg)}}
@keyframes breathe{0%,100%{opacity:1}50%{opacity:.5}}
.preview-section{padding-top:64px;padding-bottom:64px;border-top:1px solid var(--border)}
.preview-label{font:var(--weight-semibold) var(--fs-xs)/1.5 var(--font-mono);letter-spacing:var(--tracking-meta);color:var(--muted);margin-bottom:16px}
.swatch-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px}
.swatch{border:1px solid var(--border);border-radius:var(--r-sm);overflow:hidden;background:var(--panel);min-width:0}
.swatch-color{height:var(--preview-swatch-height)}
.swatch code{display:block;padding:12px;background:var(--panel);font-size:var(--fs-xs)}
.sw-bg{background:var(--bg)}.sw-top{background:var(--bg-top)}.sw-bottom{background:var(--bg-bottom)}.sw-panel{background:var(--panel)}.sw-panel2{background:var(--panel-2)}.sw-border{background:var(--border)}.sw-warm{background:var(--border-warm)}.sw-accent{background:var(--accent)}.sw-dark{background:var(--accent-dark)}.sw-text{background:var(--text)}.sw-soft{background:var(--text-soft)}.sw-muted{background:var(--muted)}.sw-success{background:var(--success)}.sw-warn{background:var(--warn)}.sw-error{background:var(--error)}.sw-mint{background:var(--mint)}.sw-apricot{background:var(--apricot)}.sw-cobalt{background:var(--cobalt)}.sw-white{background:var(--white)}.sw-berrysoft{background:var(--accent-soft)}.sw-mist{background:var(--accent-mist)}.sw-berryclay{background:var(--accent-clay)}.sw-apricotsoft{background:var(--apricot-soft)}.sw-apricotclay{background:var(--apricot-clay)}.sw-mintsoft{background:var(--mint-soft)}.sw-cobaltsoft{background:var(--cobalt-soft)}.sw-successsoft{background:var(--success-soft)}.sw-hi{background:var(--clay-hi)}.sw-mid{background:var(--clay-mid)}.sw-lo{background:var(--clay-lo)}.sw-deep{background:var(--clay-deep)}.sw-keyhole{background:var(--keyhole)}.sw-woodlight{background:var(--wood-light)}.sw-woodhi{background:var(--wood-hi)}.sw-woodlo{background:var(--wood-lo)}.sw-foil{background:var(--foil)}.sw-ink{background:var(--stamp-ink)}.sw-red{background:var(--flag-red)}.sw-blue{background:var(--flag-blue)}
.preview-row{display:flex;flex-wrap:wrap;align-items:center;gap:16px;margin-bottom:24px}
.type-display{font:var(--weight-display) var(--fs-h2)/1.2 var(--font-display);letter-spacing:var(--tracking-zh)}
.preview-columns{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.preview-columns>*{min-width:0}
@media(max-width:1100px){.platform-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.plan-card{padding:24px}.plan-card.is-current{padding:23px}}
@media(max-width:768px){
  .pricing-grid,.article-grid{grid-template-columns:1fr}
  .feature-card{grid-template-columns:1fr;gap:32px;padding:32px}
  .feature-card .feature-window{order:-1}
  .passport-spread{grid-template-columns:1fr}
  .passport-entry+.passport-entry{border-left:0;border-top:2px dashed var(--border-warm)}
  .promo-block{flex-direction:column;align-items:flex-start;gap:24px}
  .s-globe,.stamp,.g-stamp,.travel-bubble{display:none}
  .stage{width:100%;max-width:660px;margin-inline:auto}
  .preview-columns{grid-template-columns:1fr}
}
@media(max-width:640px){
  .platform-grid{grid-template-columns:1fr 1fr}
  .platform-card{padding:20px 16px}
  .platform-card .btn{padding-inline:10px;font-size:var(--fs-xs)}
  .float-cta{right:16px}
  .plan-card{border-radius:var(--r-panel)}
  .feature-card{padding:24px;border-radius:var(--r-panel)}
  .passport-spread{border-radius:var(--r-panel)}
  .promo-block{padding:24px}
  .phone{transform:rotate(8deg)}
  .passport{transform:rotate(-15deg)}
}
@media(prefers-reduced-motion:reduce){.s-globe,.passport,.stamp,.lock,.live-dot{animation:none}}