:root{--bg-color:#0a0a0f;--text-primary:#fff;--text-secondary:#ccc;--accent-color:#0fc;--glass-bg:#0a0a0f99;--glass-border:#ffffff1a;--card-bg:#162136b8;--accent-glow:#0fc6;--accent-2:#3178c6;--accent-2-glow:#3178c680;--accent-2-tint:#3178c629;--accent-2-bright:#5b9fe0}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-color);color:var(--text-primary);font-family:Helvetica Neue,Arial,Hiragino Kaku Gothic ProN,sans-serif;overflow:hidden}body #mapContainer{position:fixed;inset:0}body #demoOverlay{flex-direction:column;transition:all 1s;display:flex;position:fixed;inset:0}body #demoOverlay nav,body #demoOverlay footer{background:var(--glass-bg);color:var(--text-secondary);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}body #demoOverlay nav{border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;padding:1.5rem 2rem;display:flex}body #demoOverlay nav .logo{font-size:1.5em;font-weight:800}body #demoOverlay nav .logo svg{vertical-align:top;height:1.2em;stroke:var(--text-secondary);fill:none;stroke-width:6px;padding-right:.2em;display:inline-block}body #demoOverlay nav .links a{color:var(--text-secondary);align-items:center;margin-inline-start:1rem;font-size:1.2rem;font-weight:500;text-decoration:none;transition:color .2s;display:inline-flex}body #demoOverlay nav .links a:hover{color:var(--accent-color)}body #demoOverlay nav .links a svg{fill:currentColor;stroke:none;flex-shrink:0;width:22px;height:22px;margin-top:2px;display:block}body #demoOverlay nav .links a svg path,body #demoOverlay nav .links a svg ellipse{fill:currentColor;stroke:none;stroke-width:0}body #demoOverlay main{text-align:center;background:#0009;flex-direction:column;flex:1;justify-content:flex-start;align-items:center;padding:2.5rem 2rem;display:flex;overflow-y:auto}body #demoOverlay main .title{letter-spacing:-.01em;margin-bottom:1rem;font-size:clamp(2.6rem,8vw,5.6rem);font-weight:900;line-height:1.05}body #demoOverlay main .highlight{color:var(--accent-color);text-shadow:0 0 30px var(--accent-glow)}body #demoOverlay main .tagline{color:var(--text-secondary);white-space:pre-line;max-width:640px;margin-bottom:1.75rem;font-size:clamp(.95rem,2vw,1.15rem);line-height:1.6}body #demoOverlay main .apps{grid-template-columns:repeat(2,1fr);gap:1rem;width:100%;max-width:900px;margin-bottom:2rem;display:grid}body #demoOverlay main .apps .card{text-align:start;color:var(--text-primary);background:var(--card-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:16px;flex-direction:column;padding:1.5rem 1.6rem;text-decoration:none;transition:transform .25s,border-color .25s,box-shadow .25s;display:flex}body #demoOverlay main .apps .card:hover{border-color:var(--accent-color);transform:translateY(-4px);box-shadow:0 10px 30px #00000073}body #demoOverlay main .apps .card .card-eyebrow{letter-spacing:.15em;text-transform:uppercase;color:var(--accent-2-bright);margin-bottom:.5rem;font-size:.7rem;font-weight:700}body #demoOverlay main .apps .card .card-title{margin-bottom:.5rem;font-size:1.35rem;font-weight:800}body #demoOverlay main .apps .card .card-desc{color:var(--text-secondary);font-size:.9rem;line-height:1.55}body #demoOverlay main .apps .card .card-cta{color:var(--accent-color);margin-top:auto;padding-top:1.1rem;font-size:.85rem;font-weight:600}body #demoOverlay main .apps .card.featured{border-color:var(--accent-glow);flex-direction:row;grid-column:1/-1;padding:0;overflow:hidden;box-shadow:0 0 40px #00ffcc1f}body #demoOverlay main .apps .card.featured .card-poster{object-fit:cover;background:#0d0d12;flex:0 0 42%;align-self:center;width:42%;height:300px;display:block}body #demoOverlay main .apps .card.featured .card-body{flex-direction:column;flex:1;justify-content:center;padding:1.8rem 2rem;display:flex}body #demoOverlay main .apps .card.featured .card-title{font-size:1.9rem}body #demoOverlay main .apps .card.featured .card-desc{font-size:1rem}body #demoOverlay main .apps .card.featured .card-cta{margin-top:1.2rem;padding-top:0}body #demoOverlay footer{text-align:center;border-top:1px solid var(--glass-border);padding:1.5rem;font-size:.8rem}body #demoOverlay footer a{color:var(--text-secondary);text-decoration:none}body button{background-color:var(--accent-color);color:#000;cursor:pointer;border:none;border-radius:50px;padding:.8rem 2rem;font-size:1rem;font-weight:600;transition:all .5s}body button:hover{transform:translateY(-2px)}body button.primary{box-shadow:0 0 20px var(--accent-glow)}body button.primary:hover{box-shadow:0 0 30px var(--accent-glow)}body button.secondary{color:var(--text-primary);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#0000}body button.secondary:hover{background-color:#ffffff1a}@media (width<=640px){body #demoOverlay main{justify-content:flex-start;padding:1.5rem}body #demoOverlay main .apps{grid-template-columns:1fr}body #demoOverlay main .apps .card.featured{flex-direction:column}body #demoOverlay main .apps .card.featured .card-poster{flex-basis:auto;width:100%;height:168px;min-height:0}body #demoOverlay main .apps .card.featured .card-body{padding:1.4rem 1.5rem}body #demoOverlay main .apps .card.featured .card-title{font-size:1.6rem}}body #demoOverlay main .tabs{background:var(--card-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-radius:999px;gap:.3rem;margin-bottom:1.75rem;padding:.35rem;display:inline-flex}body #demoOverlay main .tabs .tab{color:var(--text-secondary);cursor:pointer;box-shadow:none;background:0 0;border:none;border-radius:999px;padding:.7rem 2rem;font-size:1.05rem;font-weight:600;transition:color .2s,background .2s,box-shadow .2s}body #demoOverlay main .tabs .tab:hover{color:var(--text-primary);background:var(--accent-2-tint);transform:none}body #demoOverlay main .tabs .tab.is-active{background:var(--accent-2);color:#fff;box-shadow:0 4px 18px var(--accent-2-glow)}body #demoOverlay main .tabs .tab.is-active:hover{color:#fff;background:var(--accent-2);transform:none}body #demoOverlay main .apps.tech{align-items:start}body #demoOverlay main .apps.tech .card.tech-card:hover{border-color:var(--glass-border);box-shadow:none;transform:none}body #demoOverlay main .apps.tech .card.tech-card .doclinks{flex-wrap:wrap;gap:.5rem;margin-top:1rem;display:flex}body #demoOverlay main .apps.tech .card.tech-card .doclinks a{color:var(--accent-color);background:#00ffcc14;border:1px solid #00ffcc40;border-radius:8px;align-items:center;padding:.35rem .8rem;font-size:.8rem;font-weight:600;text-decoration:none;transition:background .15s;display:inline-flex}body #demoOverlay main .apps.tech .card.tech-card .doclinks a:hover{background:#00ffcc29}body #demoOverlay main .apps.tech .card-desc .desc-more{margin-inline-start:.3em}body #demoOverlay main .apps.tech .tech-note{text-align:center;color:var(--text-secondary);grid-column:1/-1;margin:.25rem 0 0;font-size:.85rem}body #demoOverlay main .apps.tech .tech-note a{color:var(--accent-color);text-decoration:none}body #demoOverlay main .apps.tech .tech-note a:hover{text-decoration:underline}body #demoOverlay main .apps[hidden]{display:none}body #demoOverlay main .apps .card{position:relative}body #demoOverlay main .apps .card .card-badge{z-index:3;letter-spacing:.03em;white-space:nowrap;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid;border-radius:999px;padding:.24rem .62rem;font-size:.68rem;font-weight:700;position:absolute;top:1rem;right:1rem}body #demoOverlay main .apps .card .card-badge.v2{color:var(--accent-color);border-color:var(--accent-color);background:#0a0a0fb8}body #demoOverlay main .apps .card .card-badge.v1{color:var(--text-secondary);border-color:var(--glass-border);background:#0a0a0fb8}body #demoOverlay main .apps.tech .card.tech-card .doclinks-label{letter-spacing:.1em;text-transform:uppercase;color:var(--text-secondary);opacity:.7;margin-top:1rem;font-size:.66rem;display:block}body #demoOverlay main .apps.tech .card.tech-card .doclinks.demos{margin-top:.45rem}body #demoOverlay nav .links{align-items:center;display:flex}body #demoOverlay nav .links select.lang{color:var(--text-secondary);border:1px solid var(--glass-border);cursor:pointer;background:#ffffff0f;border-radius:999px;max-width:9rem;margin-inline-start:1rem;padding:.45rem .7rem;font:500 .85rem/1 inherit}body #demoOverlay nav .links select.lang:hover{border-color:var(--accent-color);color:var(--text-primary)}body #demoOverlay main .motto{color:var(--text-primary);max-width:720px;margin-bottom:.35rem;font-size:clamp(1rem,2.2vw,1.3rem);font-weight:600;line-height:1.5}body #demoOverlay main .motto-tr{color:var(--text-secondary);max-width:720px;margin-bottom:.2rem;font-size:.9rem}body #demoOverlay main .motto-tr[hidden]{display:none}body #demoOverlay main .tagline{margin-top:1rem}body #demoOverlay main #panel-demos{display:block}body #demoOverlay main #panel-demos[hidden]{display:none}body #demoOverlay main #panel-demos .card.featured{margin-bottom:1.4rem}body #demoOverlay main .apps .edu-note{text-align:center;color:var(--text-secondary);grid-column:1/-1;margin:1.2rem auto .2rem;font-size:.95rem;line-height:1.6}body #demoOverlay main .grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:.9rem;display:grid}body #demoOverlay main .grid .card{padding:1.15rem 1.25rem 1rem}body #demoOverlay main .grid .card[hidden]{display:none}body #demoOverlay main .grid .card .card-icon{margin-bottom:.55rem;font-size:1.6rem;line-height:1}body #demoOverlay main .grid .card .card-title{margin-bottom:.35rem;font-size:1.1rem}body #demoOverlay main .grid .card .card-desc{font-size:.84rem}body #demoOverlay main .grid .card .card-cta{align-self:flex-end;padding-top:.6rem}[dir=rtl] body #demoOverlay main .grid .card .card-cta{align-self:flex-start;transform:scaleX(-1)}@media (width<=640px){body #demoOverlay nav{padding:1rem}body #demoOverlay nav .logo{white-space:nowrap;font-size:1.1em}body #demoOverlay nav .links a{margin-inline-start:.7rem}body #demoOverlay nav .links a[href^="/docs/introduction"],body #demoOverlay nav .links a[href^=\/maps]{display:none}body #demoOverlay nav .links select.lang{max-width:6.5rem;margin-inline-start:.6rem}body #demoOverlay main .grid{grid-template-columns:1fr}}body #demoOverlay main .grid .card{padding:0 0 1rem;overflow:hidden}body #demoOverlay main .grid .card .card-head{justify-content:space-between;align-items:center;gap:.6rem;padding-block:.85rem .7rem;display:flex}body #demoOverlay main .grid .card .card-head .card-title{min-width:0;margin:0}body #demoOverlay main .grid .card .card-thumb{aspect-ratio:16/10;object-fit:cover;border-block:1px solid var(--glass-border);background:#111a2b;width:100%;height:auto;margin-bottom:.8rem;display:block}body #demoOverlay main .grid .card>:not(.card-thumb){margin-inline:1.15rem}body #demoOverlay main .grid .card .card-cta{margin-inline-end:1.15rem}body #demoOverlay main .apps.start{flex-direction:column;gap:1rem;max-width:760px;margin-inline:auto;display:flex}body #demoOverlay main .apps.start[hidden]{display:none}body #demoOverlay main .apps.start .start-lead{color:var(--text-primary);text-align:center;margin:0 0 .2rem;font-size:1rem;font-weight:600}body #demoOverlay main .apps.start .card.path{min-width:0;padding-inline-start:3.6rem;position:relative}body #demoOverlay main .apps.start .card.path.small{padding-inline-start:1.5rem}body #demoOverlay main .apps.start .card.path:hover{border-color:var(--glass-border);box-shadow:none;transform:none}body #demoOverlay main .apps.start .path-no{inset-inline-start:1.2rem;color:#0a0a0f;background:var(--accent-color);border-radius:50%;justify-content:center;align-items:center;width:1.8rem;height:1.8rem;font-size:.9rem;font-weight:700;display:inline-flex;position:absolute;top:1.35rem}body #demoOverlay main .apps.start .card-title{margin:0}body #demoOverlay main .apps.start .steps{flex-direction:column;gap:.85rem;margin:.9rem 0 0;padding-inline-start:1.2rem;display:flex}body #demoOverlay main .apps.start .steps li{color:var(--text-primary);font-size:.92rem;line-height:1.5}body #demoOverlay main .apps.start .steps li::marker{color:var(--accent-color);font-weight:700}body #demoOverlay main .apps.start pre.code{border:1px solid var(--glass-border);color:#d8f5ec;text-align:left;white-space:pre;-webkit-user-select:text;user-select:text;background:#0000008c;border-radius:8px;margin:.45rem 0 0;padding:.7rem .8rem;font:12px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace;overflow-x:auto}body #demoOverlay main .apps.start .steps .file{width:fit-content;color:var(--text-secondary);margin:.6rem 0 -.2rem;font:600 11px/1.4 ui-monospace,SFMono-Regular,Menlo,monospace;display:block}body #demoOverlay main .apps.start pre.code.prompt{white-space:pre-wrap;color:#f3e9c6}body #demoOverlay main .apps.start .copy-btn{cursor:pointer;color:var(--accent-color);background:#00ffcc14;border:1px solid #00ffcc40;border-radius:8px;margin-top:.4rem;padding:.3rem .8rem;font:600 .78rem/1 inherit}body #demoOverlay main .apps.start .copy-btn:hover{background:#00ffcc29}body #demoOverlay main .apps.start .path-note{color:var(--text-secondary);margin:.9rem 0 0;font-size:.82rem}body #demoOverlay main .apps.start .doclinks{flex-wrap:wrap;gap:.5rem;margin-top:.9rem;display:flex}body #demoOverlay main .apps.start .doclinks a{color:var(--accent-color);background:#00ffcc14;border:1px solid #00ffcc40;border-radius:8px;align-items:center;padding:.35rem .8rem;font-size:.8rem;font-weight:600;text-decoration:none;display:inline-flex}body #demoOverlay main .apps.start .doclinks a:hover{background:#00ffcc29}@media (width<=640px){body #demoOverlay main .apps.start .card.path{padding-inline-start:1.2rem;padding-top:3.2rem}body #demoOverlay main .apps.start .path-no{top:1rem}body #demoOverlay main .apps.start .card.path.small{padding-top:1.2rem}}body #demoOverlay main .grid .card{position:relative}body #demoOverlay main .grid .card .card-lang{letter-spacing:.02em;white-space:nowrap;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#0a0a0fc7;border:1px solid;border-radius:999px;flex:none;margin:0;padding:.2rem .55rem;font-size:.68rem;font-weight:700}body #demoOverlay main .grid .card .card-lang.all{color:var(--accent-color);border-color:#00ffcc8c}body #demoOverlay main .grid .card .card-lang.ja,body #demoOverlay main .grid .card .card-lang.en{color:#ffd479;border-color:#ffd4798c}body #demoOverlay nav .brand{align-items:center;gap:.9rem;min-width:0;display:flex}body #demoOverlay nav .back{border:1px solid var(--glass-border);background:var(--accent-2);color:#fff;font:inherit;cursor:pointer;white-space:nowrap;box-shadow:0 4px 18px var(--accent-2-glow);border-radius:999px;align-items:center;gap:.35rem;padding:.45rem 1rem;font-size:1rem;font-weight:700;display:inline-flex}body #demoOverlay nav .back:hover{filter:brightness(1.1)}body #demoOverlay nav .back[hidden]{display:none}@media (width<=640px){body #demoOverlay nav .brand{gap:.5rem}body #demoOverlay nav .back{padding:.35rem .7rem}body #demoOverlay nav .back [data-t=Back]{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}body #demoOverlay nav .links .popout{border:1px solid var(--glass-border);color:var(--text-secondary);white-space:nowrap;border-radius:999px;align-items:center;gap:.35rem;margin-inline-start:0;padding:.4rem .85rem;font-size:.9rem;font-weight:600;text-decoration:none;display:inline-flex}body #demoOverlay nav .links .popout:hover{color:var(--text-primary);border-color:var(--accent-color)}body #demoOverlay nav .links .popout[hidden]{display:none}body #demoOverlay nav .links .popout svg{fill:none;stroke:currentColor;width:15px;height:15px;margin-top:0}body #demoOverlay nav .links .popout svg path{fill:none;stroke:currentColor;stroke-width:2.2px}body #demoOverlay nav .logo{white-space:nowrap}body.in-demo #demoOverlay nav .links>:not(.popout){display:none}@media (width<=640px){body #demoOverlay nav .links .popout{padding:.4rem .6rem}body #demoOverlay nav .links .popout [data-t]{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}}body #demoOverlay iframe.demo-frame{background:#000;border:0;flex:1;width:100%;min-height:0;display:block}body #demoOverlay #demoFrame{display:none}body.in-demo #mapContainer{visibility:hidden}body.in-demo #demoOverlay main,body.in-demo #demoOverlay footer{display:none}body.in-demo #demoOverlay nav{padding-block:.7rem}body.in-demo #demoOverlay nav .logo{cursor:pointer}body.in-demo #demoOverlay nav .logo:hover{color:var(--text-primary)}
