@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600;650;700&family=Libre+Caslon+Display&display=swap');
:root{color-scheme:light;--ink:#274238;--muted:#66756d;--paper:#f8faf8;--line:#dce5dd;--accent:#457a58;font-family:'DM Sans',sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit}button:focus-visible,a:focus-visible{outline:3px solid #347bdb;outline-offset:7px}.topbar{max-width:1320px;margin:auto;padding:25px 48px;display:flex;align-items:center;justify-content:space-between}.wordmark{text-decoration:none;color:var(--ink);display:flex;align-items:center;gap:11px;font-size:16px;font-weight:650;letter-spacing:-.4px}.brand-mark{font-family:Georgia,serif;width:33px;height:33px;background:var(--ink);color:white;border-radius:11px;font-size:28px;text-align:center;line-height:30px}.header-note{font-size:14px;color:var(--muted)}main{max-width:1100px;margin:auto}.intro{text-align:center;padding:30px 24px 0}.eyebrow{font-size:12px!important;font-weight:650;letter-spacing:2.7px;color:#667969;margin:0 0 12px!important}.intro h1{font-family:'Libre Caslon Display',Georgia,serif;font-size:clamp(42px,5vw,65px);font-weight:400;letter-spacing:-1.8px;margin:0;line-height:1.1}.intro h1 em{font-weight:400;color:#4d805c}.intro>p:last-child{font-size:16px;color:var(--muted);line-height:1.6;margin:16px 0 0}.world{height:550px;position:relative;margin:4px auto 0;background-image:radial-gradient(#c7d5c9 0.7px,transparent .7px);background-size:20px 20px;background-position:center;isolation:isolate}.world:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse,transparent 35%,var(--paper) 72%);z-index:-1}.connections{position:absolute;inset:0;width:100%;height:100%;z-index:-1;fill:none;stroke:#d8e2d9;stroke-width:1.2}.connections ellipse{stroke-dasharray:3 7;stroke:#dae4dc}.connections path{stroke-dasharray:2 7;opacity:.65}.companion{position:absolute;display:flex;align-items:center;flex-direction:column;gap:5px;padding:9px 13px 10px;background:transparent;border:0;border-radius:20px;color:var(--ink);cursor:pointer;transform:translate(-50%,-50%);transition:background .2s,box-shadow .2s;min-width:148px}.companion:hover,.companion[aria-pressed=true]{background:#fff;box-shadow:0 6px 30px #2945360c}.app-icon{width:64px;height:64px;display:grid;place-content:center;border-radius:19px;font-size:36px;font-weight:600;letter-spacing:-2px;box-shadow:0 4px 0 #2742380b, inset 0 0 0 1px #ffffff65;margin-bottom:5px;transition:transform .22s;position:relative}.companion:hover .app-icon{transform:translateY(-5px) rotate(-5deg)}.app-name{font-size:16px;font-weight:650;letter-spacing:-.3px}.app-caption{font-size:13px;color:var(--muted);white-space:nowrap}.flomo{left:19%;top:18%}.flomo .app-icon{background:#39b986;color:white;font-family:Georgia,serif;font-size:52px;font-style:italic;line-height:1}.flomo-dot{position:absolute;bottom:2px;right:12px}.obsidian{left:37%;top:10%}.obsidian .app-icon{background:#ede5fe;color:#7850bd;font-family:Georgia,serif;font-style:italic;font-size:44px;transform:rotate(-7deg)}.chatgpt{left:65%;top:11%}.chatgpt .app-icon{background:#e0eee6;color:#2b624e;font-size:23px;letter-spacing:-1.5px}.claude{left:83%;top:21%}.claude .app-icon{background:#f7e6dd;color:#aa5e41;font-family:Georgia,serif;font-size:36px}.code-dot{position:absolute;font-size:28px;right:7px;top:2px}.codex{left:87%;top:54%}.codex .app-icon{background:#293f37;color:#f5faf6;font-family:monospace;font-size:29px;letter-spacing:-2px;transform:rotate(6deg)}.github{left:72%;top:84%}.github .app-icon{background:#e6e8ee;color:#30333e;font-family:monospace;font-size:27px}.calendar{left:29%;top:84%}.calendar .app-icon{background:#e3ecff;color:#4272c0;font-size:33px;border-top:9px solid #7096dc;border-radius:14px;line-height:1}.omi{left:13%;top:56%}.omi .app-icon{background:#e7dfff;color:#655196;font-size:24px;letter-spacing:-1px;border-radius:50%;transform:rotate(-7deg)}.portrait{position:absolute;left:50%;top:49%;transform:translate(-50%,-50%);width:305px;text-align:center}.portrait img{width:100%;height:305px;object-fit:contain;mix-blend-mode:multiply;display:block}.hello-note{font-family:'Libre Caslon Display',Georgia,serif;position:absolute;left:9px;top:10px;transform:rotate(-10deg);font-size:24px;z-index:1}.hello-note span{display:inline-block;color:#d5a34c;font-size:27px;margin-left:6px}.bo-label{margin:-8px auto 0;background:var(--paper);border:0;border-radius:12px;padding:5px 12px;color:var(--ink);font-size:20px;font-weight:700;cursor:pointer}.bo-label span{display:block;font-size:13px;font-weight:400;color:var(--muted);margin-top:4px}.detail{display:grid;grid-template-columns:1fr 2.15fr;gap:35px;border-top:1px solid var(--line);margin:35px 50px 0;padding:28px 0 32px;min-height:172px}.detail-category{font-size:12px;font-weight:650;letter-spacing:1.6px;color:#718475}.detail h2{font-family:'Libre Caslon Display',Georgia,serif;font-weight:400;font-size:33px;letter-spacing:-.5px;margin:7px 0 0}.detail-right p{font-size:16px;line-height:1.65;margin:0;color:#516258}.detail-right .detail-connection{font-size:14px;margin-top:12px;color:#3b7150}footer{max-width:1224px;border-top:1px solid var(--line);margin:auto;padding:22px 0 25px;display:flex;justify-content:space-between;color:#788379;font-size:12px}.footer-divider{padding:0 10px;color:#bdc8be}@media(min-width:1500px){.intro{padding-top:42px}.world{height:585px}.detail{margin-top:38px}}@media(max-width:800px){.topbar{padding:22px 24px}.header-note{font-size:12px}.intro{padding-top:23px}.world{height:560px}.portrait{width:245px;top:49%}.portrait img{height:245px}.hello-note{left:0;top:-8px;font-size:20px}.companion{min-width:114px;padding:8px}.app-icon{width:55px;height:55px;border-radius:16px}.app-name{font-size:14px}.app-caption{font-size:12px}.flomo{left:18%;top:19%}.obsidian{left:39%;top:8%}.chatgpt{left:67%;top:10%}.claude{left:84%;top:30%}.codex{left:85%;top:62%}.github{left:70%;top:86%}.calendar{left:29%;top:86%}.omi{left:15%;top:56%}.detail{margin:32px 28px 0;gap:22px;grid-template-columns:1fr 1.8fr}.detail h2{font-size:29px}footer{margin:0 25px}}@media(max-width:540px){.header-note{display:none}.topbar{padding:20px}.intro{padding:20px 24px 0}.intro h1{font-size:44px;letter-spacing:-1px}.intro>p:last-child{font-size:15px;max-width:285px;margin:14px auto 0}.eyebrow{font-size:11px!important;letter-spacing:2px}.world{height:auto;min-height:805px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px 0;padding:338px 12px 43px;margin-top:8px;align-content:start}.connections{display:none}.portrait{top:4px;left:50%;transform:translateX(-50%);width:260px}.portrait img{height:260px}.hello-note{left:4px;top:19px}.bo-label{margin-top:-4px}.companion{position:relative;left:auto;top:auto;transform:none;min-width:0;padding:10px 2px;gap:5px;min-height:129px}.app-caption{font-size:12px;white-space:normal;max-width:112px;line-height:1.4}.app-icon{width:55px;height:55px}.companion:last-of-type{grid-column:3}.detail{display:block;margin:22px 22px 0;padding-top:23px;min-height:260px}.detail h2{font-size:32px;margin:8px 0 15px}.detail-right p{font-size:16px}footer{gap:12px;flex-direction:column;margin:0 22px;padding:20px 0;font-size:12px}}@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}