:root{color-scheme:dark;--bg:#111b18;--panel:#192823;--raised:#21342c;--line:#40554b;--text:#f0f6ec;--muted:#b7c9be;--lime:#d9fc81;--dark:#15231c;font:16px/1.5 system-ui,-apple-system,sans-serif}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text)}[hidden]{display:none!important}a{color:inherit;text-decoration:none}a:hover{text-decoration:underline}button,input{font:inherit}button{cursor:pointer;min-height:46px;padding:10px 16px;border:1px solid transparent;border-radius:10px;font-weight:670}button:disabled{opacity:.6;cursor:default}button:not(:disabled):hover{filter:brightness(1.12)}:focus-visible{outline:3px solid #f6c778;outline-offset:3px}
header,main,footer{max-width:1176px;margin:auto;padding-inline:32px}header{display:flex;align-items:center;justify-content:space-between;min-height:82px;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:770;letter-spacing:-.025em}.quiet,.caption{color:var(--muted);font-size:14px}.intro{display:grid;grid-template-columns:1fr 1fr;gap:clamp(32px,7vw,100px);align-items:center;padding-block:60px 70px}.intro-copy h1{font-size:clamp(49px,7.9vw,102px);line-height:.94;font-weight:790;letter-spacing:-.055em;margin:0}.intro-copy h1 span{color:var(--lime)}.intro-copy>p:not(.caption){font-size:clamp(17px,2vw,21px);line-height:1.52;max-width:34ch;margin:24px 0}.caption{margin-top:12px}.actions{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.primary{background:var(--lime);color:var(--dark)}.soft{background:var(--raised);color:var(--text);border-color:var(--line)}.plain{background:transparent;color:var(--muted)}
.stage{border:1px solid var(--line);border-radius:18px;background:var(--panel);overflow:hidden;scroll-margin-top:16px}.stage-top{display:flex;align-items:center;justify-content:space-between;padding:15px 21px;border-bottom:1px solid var(--line)}.pill{font-size:12px;color:var(--muted);border:1px solid var(--line);padding:3px 8px;border-radius:99px;max-width:50%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.visual{height:clamp(210px,27vw,305px);position:relative;background:#14211c}iframe{border:0;display:block;width:100%;height:100%;pointer-events:none}.stage-copy{padding:18px 21px 21px}.edge-line{display:flex;align-items:center;justify-content:space-between;gap:8px;color:var(--muted);font-size:13px}.edges{display:flex;gap:5px}.edges i{width:11px;height:11px;border:1px solid #71877c;border-radius:3px}.edges i.on{background:var(--lime);border-color:var(--lime)}h2,h3,p{margin:0}h2{font-size:clamp(24px,3vw,32px);line-height:1.12;letter-spacing:-.025em}.stage h2{margin-top:9px}.stage p{margin-top:8px;color:var(--muted);max-width:55ch}.stage-actions{margin-top:12px}.stage-actions:empty{display:none}.notice{font-size:14px;color:#ffdd9d!important}.explainer{border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:20px 32px;padding-block:38px 54px}.explainer h2{grid-column:1/-1}.explainer h3{font-size:17px}.explainer p{color:var(--muted);margin-top:6px;max-width:38ch}footer{border-top:1px solid var(--line);padding-block:20px;display:flex;flex-wrap:wrap;gap:10px 28px;color:var(--muted);font-size:13px}footer a{margin-left:auto}
#pad{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:12px}#pad button{padding:6px;font-size:13px}#flat{height:100%;align-content:center}#flat svg{display:block;margin:auto;width:min(84%,240px);height:94%}.pair-help{margin-top:20px;padding-top:18px;border-top:1px solid var(--line)}
.pair-help h2{font-size:22px}.pair-help p{margin:8px 0;color:var(--muted)}.pair-help strong{color:var(--text);overflow-wrap:anywhere}
.pair-help details{margin-top:12px;padding:0 14px 0;border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.pair-help summary{display:list-item;align-content:center;cursor:pointer;font-weight:670;min-height:46px}.pair-help a{color:var(--lime);text-decoration:underline;text-underline-offset:3px}
.pair-help ol{padding-left:22px;margin:0 0 14px;color:var(--muted)}.pair-help li+li{margin-top:7px}
.pair-help form{padding:12px 0 14px;border-top:1px solid var(--line)}.pair-help input{display:block;width:100%;padding:10px;margin-top:4px;background:var(--bg);border:1px solid var(--line);border-radius:8px;color:var(--text)}
.pair-help input::placeholder{color:var(--muted)}.pair-help form p{font-size:14px}.pair-help>.plain{padding-inline:0;margin-top:4px}

@media(max-width:760px){header,main,footer{padding-inline:19px}header{min-height:66px}.intro{grid-template-columns:minmax(0,1fr);padding-block:34px 42px;gap:24px}.intro-copy h1 br{display:none}.intro-copy>p:not(.caption){margin:14px 0 16px}.caption{margin:7px 0 0}.visual{height:218px}.explainer{grid-template-columns:1fr;gap:16px;padding-block:26px 34px}.stage-copy{padding:14px 16px 16px}.stage-top{padding:12px 16px}}@media(prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}

iframe.live-view{pointer-events:auto}
.intro-copy h1{font-size:clamp(43px,6vw,82px);letter-spacing:-.04em;text-wrap:balance}
.android-link{display:inline-flex;align-items:center;min-height:46px;padding:8px 10px;color:var(--text);text-decoration:underline;text-underline-offset:3px;font-weight:670}
.browser-pairing{margin-top:12px;color:var(--muted);font-size:14px}
.browser-pairing summary{align-content:center;min-height:44px;cursor:pointer}
.browser-pairing p{max-width:40ch;margin-bottom:8px}
#android{scroll-margin-top:24px}
