@charset "UTF-8";
:root{--bg:#f8f9fb;--ink:#252932;--muted:#6f747e;--line:#e6e8ed;--accent:#dc623d;--mint:#e5efe9;--lavender:#eeebf7;--peach:#f7eae2;--font:"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif;--display:"Arial","PingFang SC","Microsoft YaHei",sans-serif}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:15px;-webkit-font-smoothing:antialiased}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button,a{touch-action:manipulation}button:focus-visible,a:focus-visible{outline:3px solid var(--accent);outline-offset:5px}svg{display:block;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.6}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}.icon{width:20px;height:20px;flex-shrink:0}.container{width:min(1200px,calc(100% - 96px));margin-inline:auto}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-80px;left:16px;padding:14px;background:var(--ink);color:white;z-index:20}.skip-link:focus{top:10px}.site-header{border-bottom:1px solid var(--line)}.nav-shell{height:94px;display:flex;align-items:center;justify-content:space-between}.brand{display:inline-flex;align-items:center;font-family:var(--display);font-size:29px;font-weight:750;letter-spacing:-1.3px}.brand-dot{color:var(--accent)}.brand-mark{display:grid;place-items:center;width:33px;height:33px;margin-right:10px;color:var(--accent)}.brand-mark svg{width:32px;height:32px;stroke-width:1.9}.nav-shell nav{display:flex;align-items:center;gap:38px;font-size:14px}.nav-link{color:var(--muted);transition:color .2s;padding-block:14px}.nav-link:hover,.nav-link.active{color:var(--ink)}.nav-link.active{position:relative}.nav-link.active:after{content:"";position:absolute;bottom:3px;left:50%;width:4px;height:4px;border-radius:50%;background:var(--accent)}.nav-contact{border:1px solid #dfe1e6;display:flex;align-items:center;gap:16px;border-radius:9px;padding:11px 17px;transition:background .2s}.nav-contact:hover{background:white}.nav-contact .icon{width:16px;height:16px}
.hero{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:26px;min-height:640px;padding-block:76px 62px}.eyebrow{display:flex;align-items:center;gap:10px;font-size:12px;letter-spacing:2px;color:#626873;margin-bottom:28px}.status-dot{display:inline-block;width:6px;height:6px;flex-shrink:0;background:#718c78;border-radius:50%;box-shadow:0 0 0 4px #718c780d}.eyebrow-line{height:1px;width:38px;background:#cdd0d6;margin-left:2px}h1{font-family:var(--display);font-size:clamp(44px,5.25vw,72px);line-height:1.32;letter-spacing:-3px;margin:0;font-weight:750}.accent-word{position:relative;color:var(--accent);white-space:nowrap}.underline{position:absolute;width:101%;height:12px;left:0;bottom:-7px;color:#eeab94;stroke-width:2.5;z-index:-1}.title-period{margin-left:0}.hero-description{font-size:16px;line-height:1.95;color:var(--muted);margin:27px 0 30px}.hero-actions{display:flex;align-items:center;gap:28px}.button{display:inline-flex;justify-content:center;align-items:center;gap:23px;min-height:48px;padding:14px 22px;border:0;border-radius:9px;font-size:14px;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.button-dark{background:var(--ink);color:white}.button-dark:hover{background:#414750}.button .icon{width:18px;height:18px}.story-link{display:flex;align-items:center;gap:7px;font-size:14px;min-height:44px}.story-link .icon{width:16px;height:16px}.story-link:hover{color:var(--accent)}.hero-note{display:flex;align-items:center;color:#7b8089;margin-top:40px;font-size:11px;letter-spacing:.3px}.tiny-app{display:grid;place-items:center;width:28px;height:28px;border-radius:8px;border:3px solid var(--bg);margin-left:-6px;transform:rotate(-7deg)}.tiny-app:first-child{margin-left:0}.tiny-app .icon{width:14px;height:14px}.tiny-note{background:#e7e1f3;color:#7e6a9d;transform:rotate(5deg)}.hero-note>span:last-child{margin-left:10px}
.hero-art{height:470px;position:relative;min-width:0}.art-dots{position:absolute;inset:6px -10px -4px 12px;background-image:radial-gradient(#d5dae2 1px,transparent 1px);background-size:17px 17px;mask-image:radial-gradient(ellipse,black 25%,transparent 72%)}.art-label{position:absolute;top:3px;left:76px;color:#969ba4;font-family:Georgia,serif;font-size:12px;font-style:italic;transform:rotate(-6deg)}.mock-window{position:absolute;background:white;border:1px solid #e5e6e9;border-radius:13px;box-shadow:0 18px 44px #24323c0a;overflow:hidden}.window-bar{height:35px;display:flex;justify-content:space-between;align-items:center;padding:0 13px;border-bottom:1px solid #ecedf0;color:#7b8089;font-size:9px;gap:10px}.window-bar>.icon{width:12px;height:12px}.window-dots{display:flex;gap:4px}.window-dots i{width:5px;height:5px;border-radius:50%;background:#dbdde1}.window-dots i:first-child{background:#e9b7ad}.window-dots i:nth-child(2){background:#e7d19e}.window-dots i:nth-child(3){background:#bbd0b8}.notes-window{display:block;width:340px;top:100px;left:50%;transform:translateX(-50%) rotate(-6deg)}.notes-inner{padding:25px 24px 26px;background:#fdfcf9}.note-mini-date{font-size:7px;letter-spacing:1.4px;color:#98928d}.notes-inner h3{font-size:16px;letter-spacing:.5px;margin:17px 0 12px}.notes-inner p{font-size:9px;color:#93918d;margin:0 0 12px}.note-highlight{font-size:9px;color:#77694c;background:#f5eacb;display:inline-block;padding:4px}.note-lines{margin:16px 0;display:grid;gap:8px}.note-lines i{height:3px;border-radius:3px;background:#eae7e1}.note-lines i:last-child{width:77%}.note-mini-tag{font-size:8px;color:#8c8b82}.floating-note{position:absolute;right:9px;top:40px;background:white;padding:11px 14px;border:1px solid #ececef;border-radius:8px;font-size:10px;display:flex;align-items:center;gap:8px;transform:rotate(3deg);box-shadow:0 5px 12px #21273504;z-index:3}.floating-note .icon{width:14px;height:14px;color:#dc8157}.hero-spark{position:absolute;bottom:18px;right:26px;width:54px;height:54px;stroke:#dd805d;stroke-width:2.2;transform:rotate(12deg)}.art-caption{position:absolute;bottom:-13px;left:65px;display:flex;align-items:center;gap:9px;font-family:Georgia,serif;font-style:italic;font-size:11px;color:#8a8e95;transform:rotate(-5deg)}.caption-line{width:25px;height:1px;background:#b6bac1}
.principles{display:flex;align-items:center;gap:48px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);min-height:76px;color:#7b818b;font-size:12px}.principles>span{display:flex;align-items:center;gap:9px}.principles .icon{width:16px;height:16px;color:#858b95}.principles-sign{margin-left:auto;font-family:Georgia,serif;font-style:italic;color:#9398a0;letter-spacing:.2px}.apps-section{padding-top:82px;padding-bottom:83px}.section-heading{display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:29px}.section-kicker{font-size:10px;letter-spacing:2px;font-weight:500;color:#8b9099;margin-bottom:12px}h2{font-family:var(--display);font-weight:700;letter-spacing:-1px;font-size:32px;margin:0;line-height:1.5}.section-heading h2{display:flex;gap:13px;align-items:center}.count{font-size:10px;letter-spacing:0;color:#8b9099;border:1px solid #dfe2e8;border-radius:6px;padding:0 6px;line-height:20px;font-family:var(--font);font-weight:400}.section-heading p{margin:8px 0 0;color:var(--muted);font-size:13px}.app-grid{display:grid;grid-template-columns:1fr;gap:24px}.app-card{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-width:0;background:white;border:1px solid var(--line);border-radius:13px;overflow:hidden;transition:transform .25s,box-shadow .25s}.app-card:hover{transform:translateY(-4px);box-shadow:0 12px 30px #25293207}.app-preview{border:0;width:100%;height:257px;display:block;position:relative;overflow:hidden;text-align:left;color:var(--ink);padding:0}.preview-notes{background:#eceaf3}.preview-badge{position:absolute;left:17px;top:15px;border:1px solid #ffffff7a;background:#ffffff64;padding:4px 8px;font-size:9px;border-radius:4px;color:#58665c}.preview-notes .preview-badge{color:#706782}.preview-caption{position:absolute;bottom:14px;left:0;width:100%;text-align:center;font-family:Georgia,serif;font-size:10px;font-style:italic;color:#78867d}.preview-notes .preview-caption{color:#8b8299}.mini-notebook{position:absolute;width:min(340px,calc(100% - 40px));height:165px;left:50%;top:54px;display:flex;box-shadow:0 7px 20px #7865860d;border:1px solid #ddd8e8;border-radius:7px;background:white;overflow:hidden;transform:translateX(-50%) rotate(-5deg);transition:transform .35s}.app-preview:hover .mini-notebook{transform:translateX(-50%) rotate(-2deg) translateY(-3px)}.notebook-side{width:34px;background:#f2eff8;flex-shrink:0;padding:12px 8px;border-right:1px solid #e9e4f1;display:flex;flex-direction:column;align-items:center;gap:12px;color:#9d8cb2}.notebook-side .icon{width:15px;height:15px}.notebook-side i{width:12px;height:3px;background:#d7cfe2;border-radius:2px}.notebook-page{padding:13px 15px;flex:1;min-width:0}.notebook-page>span{font-size:7px;color:#99909e;display:flex;justify-content:space-between}.notebook-page h4{font-size:12px;margin:14px 0 6px}.notebook-page p{font-size:6px;margin:0 0 12px;color:#9b929f}.check-line{font-size:6px;display:flex;align-items:center;gap:5px;margin:7px 0;color:#867990;white-space:nowrap}.check-line b{display:grid;place-items:center;font-size:5px;width:8px;height:8px;border-radius:2px;background:#ad9abd;color:white}.empty-check b{background:white;border:1px solid #d6cce0}.notebook-tag{font-size:5px;color:#9584a6;margin-top:10px;background:#f1edf7;display:inline-block;padding:2px 4px}.app-info{padding:22px 23px 17px}.app-title-row{display:flex;align-items:center;gap:11px}.app-icon{width:42px;height:42px;border:1px solid #00000004;border-radius:11px;display:grid;place-items:center;flex-shrink:0}.app-icon svg{width:24px;height:24px;stroke-width:1.5}.notes-icon{background:#ece5f3;color:#9a84b1}.app-title-row h3{font-size:18px;letter-spacing:-.4px;margin:0;font-family:var(--display)}.app-title-row h3 span{font-family:var(--font);font-size:11px;font-weight:400;color:#838792;letter-spacing:0;margin-left:5px}.platform{font-size:10px;color:#8b9099;margin-top:5px}.detail-arrow{display:grid;place-items:center;background:transparent;border:0;width:44px;height:44px;margin-left:auto;color:#606772;border-radius:50%;transition:background .2s,color .2s}.detail-arrow:hover{background:#f5f5f7;color:var(--accent)}.detail-arrow .icon{width:18px;height:18px}.app-info>p{font-size:12px;line-height:1.9;color:#797e89;margin:17px 0 20px}.app-meta{border-top:1px solid #f0f1f4;padding-top:13px;display:flex;justify-content:space-between;font-size:10px;color:#9397a0}.collection-note{display:flex;align-items:center;gap:9px;margin-top:26px;font-size:11px;color:#90959d;min-height:24px}.collection-note .status-dot{width:5px;height:5px;background:#a7adb5}
.about-section{display:grid;grid-template-columns:1fr 1fr;gap:80px;padding-block:54px 69px;border-top:1px solid var(--line);align-items:center}.about-art{height:275px;border-radius:14px;background:#eceef2;position:relative;overflow:hidden;display:grid;place-items:center;background-image:linear-gradient(45deg,transparent 49.8%,#dfe3e9 50%,transparent 50.2%)}.maker-label{position:absolute;top:23px;left:24px;font-size:8px;letter-spacing:1.5px;color:#9298a3}.code-tile{height:110px;width:110px;border-radius:27px;transform:rotate(-12deg);background:#fafbfc;border:1px solid white;box-shadow:8px 12px 0 #dce0e6,0 17px 30px #4853650a;display:grid;place-items:center;color:#798491}.code-tile svg{width:46px;height:46px;stroke-width:1.2}.about-orbit{position:absolute;bottom:29px;left:30px;right:30px;text-align:center;font-size:12px;font-family:Georgia,serif;color:#8b929c;font-style:italic}.about-spark{position:absolute;top:56px;right:69px;font-size:44px;color:#dd8a6e;transform:rotate(15deg)}.about-copy h2{font-size:28px;line-height:1.55}.about-copy p{color:var(--muted);font-size:12px;line-height:1.95;max-width:420px;margin:14px 0}.maker-signature{display:flex;align-items:center;gap:16px;font-size:12px;margin-top:22px;color:#555e69}.maker-signature .icon{color:var(--accent);width:18px;height:18px}.contact-section{border-top:1px solid var(--line);padding-block:48px;display:flex;align-items:center;justify-content:space-between;gap:20px}.contact-section h2{font-size:29px}.contact-section h2 span{color:var(--accent)}.contact-section p{font-size:12px;color:var(--muted);margin:9px 0 0}.contact-placeholder{display:flex;align-items:center;gap:16px;padding:18px 22px;border:1px dashed #d6dae1;border-radius:10px;color:#6f7681;font-size:12px}.contact-placeholder>.icon{width:24px;height:24px;color:#a6acb5}.contact-placeholder small{display:block;font-size:10px;color:#959ba4;margin-top:7px}.site-footer{display:flex;align-items:center;gap:24px;border-top:1px solid var(--line);min-height:98px;color:#8d929b;font-size:10px}.footer-brand{font-size:22px;color:#5b626d}.footer-brand .brand-mark{width:24px;height:24px;margin-right:5px}.footer-brand .brand-mark svg{width:23px;height:23px}.site-footer>a:last-child{margin-left:auto;min-height:44px;display:flex;align-items:center}.site-footer>a:last-child:hover{color:var(--accent)}
.accent-word{isolation:isolate}.hero-note .tiny-app,.principles .icon{flex-shrink:0}
@media(min-width:1450px){.hero{padding-block:86px 72px;min-height:680px}.hero-art{height:490px}}
@media(max-width:1100px){.container{width:calc(100% - 64px)}.hero{gap:14px;min-height:590px}.hero-art{transform:scale(.88);transform-origin:center right;margin-left:-35px}.hero h1{font-size:56px}.principles{gap:25px}.principles-sign{font-size:10px}.app-grid{gap:16px}.app-info{padding:20px 16px 16px}.app-title-row{gap:8px}.app-title-row h3{font-size:16px}.app-title-row h3 span{font-size:10px}.app-icon{width:36px;height:36px}.detail-arrow{width:32px;min-height:44px}.notebook-page{padding:13px 10px}.about-section{gap:45px}.about-spark{right:40px}}
@media(max-width:850px){.hero{grid-template-columns:1fr 1fr;gap:0;min-height:550px;padding-block:48px}.hero h1{font-size:45px;letter-spacing:-2px}.hero-description{font-size:13px}.hero-art{transform:scale(.74);transform-origin:center right;margin-left:-100px}.eyebrow{font-size:10px;letter-spacing:1px}.hero-actions{gap:17px}.button{font-size:12px;padding:13px 16px;gap:15px}.story-link{font-size:12px}.hero-note{font-size:9px}.principles{gap:24px;font-size:11px}.principles-sign{display:none!important}.section-heading{align-items:start;flex-direction:column;gap:22px}.app-grid{grid-template-columns:1fr}.app-preview{height:257px}.about-copy h2{font-size:24px}.about-section{gap:30px}.about-art{height:290px}.about-spark{right:25px}.contact-section h2{font-size:24px}.contact-placeholder{padding:16px}.site-footer{gap:20px}}
@media(max-width:600px){.container{width:calc(100% - 40px)}.nav-shell{height:78px}.brand{font-size:25px}.brand-mark{width:27px;height:27px;margin-right:7px}.brand-mark svg{width:27px;height:27px}.nav-shell nav{gap:18px;font-size:12px}.nav-contact{display:none}.hero{grid-template-columns:1fr;padding-block:44px 33px;gap:16px}.eyebrow{margin-bottom:23px;font-size:10px}.hero h1{font-size:clamp(43px,10.9vw,61px);letter-spacing:-2px;line-height:1.35}.hero-description{font-size:14px;line-height:1.9;margin-block:24px}.hero-actions{gap:25px}.button{font-size:13px;padding:13px 19px}.story-link{font-size:13px}.hero-note{font-size:10px;margin-top:26px}.hero-art{height:420px;width:100%;margin-left:0;transform:none;max-width:420px;justify-self:center}.art-label{left:25px;font-size:10px;top:20px}.notes-window{width:280px;left:50%;top:90px}.notes-inner{padding:21px 18px}.notes-inner h3{font-size:13px}.floating-note{font-size:8px;right:1px;top:52px;padding:10px;gap:5px}.hero-spark{width:37px;height:37px;right:13px;bottom:12px}.art-caption{font-size:9px;left:36px;bottom:-18px}.principles{justify-content:space-between;gap:8px;min-height:70px;font-size:9px}.principles>span{gap:5px}.principles .icon{width:13px;height:13px}.apps-section{padding-block:52px}.section-kicker{font-size:9px}.section-heading{gap:22px;margin-bottom:23px}h2{font-size:28px}.section-heading p{font-size:12px}.app-grid{grid-template-columns:1fr;gap:24px}.app-card{display:block}.app-preview{height:272px}.mini-notebook{width:270px;left:50%;top:62px;transform:translateX(-50%) rotate(-5deg) scale(1.04)}.preview-caption{bottom:18px}.app-info{padding:22px}.app-title-row h3{font-size:19px}.app-title-row h3 span{font-size:12px}.app-icon{width:44px;height:44px}.app-info>p{font-size:13px;margin-block:18px}.detail-arrow{width:44px}.app-meta{font-size:11px}.collection-note{font-size:10px;margin-top:23px}.about-section{grid-template-columns:1fr;padding-block:37px 42px;gap:30px}.about-art{height:235px}.about-spark{right:65px;top:42px}.about-copy h2{font-size:27px}.about-copy p{font-size:13px}.contact-section{align-items:flex-start;flex-direction:column;padding-block:35px;gap:24px}.contact-section h2{font-size:25px}.contact-placeholder{width:100%;padding:16px 20px}.site-footer{flex-wrap:wrap;gap:8px 15px;padding-block:25px;min-height:120px}.footer-brand{font-size:22px}.site-footer>span{order:3;flex-basis:100%;font-size:9px}.site-footer>a:last-child{font-size:10px}.footer-brand .brand-mark svg{width:23px;height:23px}}
@media(max-width:360px){.container{width:calc(100% - 32px)}.nav-shell nav{gap:13px}.hero-art{transform:scale(.92);transform-origin:center top;margin-bottom:-30px}.principles{font-size:8px}.mini-notebook{width:244px}.hero-actions{gap:18px}.hero-note{font-size:9px}}
.app-icon img{display:block;width:100%;height:100%;border-radius:inherit}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}