:root{--purple:#833eff;--ink:#27242b;--muted:#6d6871;--paper:#fbfaf7;--line:#dedbd6;--soft:#f0eeea}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,'PingFang SC','Microsoft YaHei',sans-serif;font-size:15px;line-height:1.8;background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,textarea{font:inherit}button{cursor:pointer}img{display:block;max-width:100%}figure{margin:0}[hidden]{display:none!important}a,button,input,textarea,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible{outline:2px solid var(--purple);outline-offset:5px}a:hover{color:var(--purple)}.section{max-width:1240px;margin:auto;padding:88px 40px}.site-header{height:88px;position:sticky;top:0;z-index:20;background:var(--paper);border-bottom:1px solid var(--line)}.nav-inner{max-width:1240px;height:100%;margin:auto;padding:0 40px;display:flex;align-items:center;justify-content:space-between;gap:35px}.brand{font-family:Arial,sans-serif;font-size:24px;font-weight:700;letter-spacing:-1px;display:inline-flex;align-items:center;gap:10px;flex-shrink:0}.brand:hover{color:inherit}.logo{display:inline-block;position:relative;overflow:hidden;width:30px;height:30px;flex-shrink:0;border-radius:28%;background:var(--purple)}.logo img{position:absolute;width:825.882353%;max-width:none;height:auto;left:-277.647059%;top:-931.176471%}nav{display:flex;gap:36px;margin-left:auto}nav a{font-size:13px;color:#625d68}.button{display:inline-flex;justify-content:center;align-items:center;min-height:44px;padding:10px 24px;border:1px solid var(--purple);border-radius:3px;background:var(--purple);color:#fff;font-size:13px;line-height:1.6;font-weight:500;text-align:center}.button:hover{background:#6f2ddd;border-color:#6f2ddd;color:#fff}.button.compact{min-height:36px;padding:7px 20px;font-size:12px}.button:disabled{opacity:.55;cursor:wait}.section-label{font-size:12px;color:#79717c;margin:0 0 22px;line-height:1.5}h1,h2,h3,p{margin-top:0}h1{font-size:54px;line-height:1.28;letter-spacing:-2px;font-weight:500;margin-bottom:27px}h2{font-size:32px;font-weight:500;line-height:1.5;letter-spacing:-.8px;margin-bottom:22px}h3{font-size:17px;font-weight:500;line-height:1.6;margin-bottom:12px}p{color:var(--muted);font-size:14px;line-height:1.95;margin-bottom:24px}.family-hero{display:grid;grid-template-columns:.85fr 1.25fr;gap:52px;align-items:center;padding-top:60px;padding-bottom:65px}.hero-copy{padding-bottom:20px}.family-hero h1{font-family:Georgia,'Songti SC','STSong',serif;font-size:55px;font-weight:500;line-height:1.4;letter-spacing:-1px}.hero-description{font-size:14px;line-height:2;margin:0 0 32px;max-width:365px}.hero-description br{display:none}.hero-photo{position:relative}.hero-photo>img{width:100%;height:480px;object-fit:cover;object-position:68% center}.hero-photo figcaption{text-align:right;font-size:9px;color:#9c958a;margin-top:10px}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:35px}.section-heading h2{margin-bottom:0}.section-heading>p{font-size:13px;margin-bottom:3px}.family-product{padding-top:65px;border-top:1px solid var(--line)}.workspace{border:1px solid #d9d5df;background:#fff;border-radius:4px;overflow:hidden}.workspace-bar{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid #e8e5ec;font-size:12px;color:#5d5367}.workspace-bar>span+span{font-size:10px;color:#968c9e}.workspace-tabs{display:flex;gap:30px;padding:0 24px;border-bottom:1px solid #e8e5ec;background:#fbfafc}.workspace-tabs button{border:0;border-bottom:2px solid transparent;background:none;color:#8a818f;padding:15px 0;font-size:12px}.workspace-tabs button.active{color:#7134c9;border-bottom-color:#833eff}.workspace-panel{display:grid;grid-template-columns:.75fr 1.25fr;align-items:center;gap:65px;padding:40px 50px;min-height:390px}.album-select h3,.greeting-controls h3{font-size:16px;margin-bottom:5px}.album-select>p,.greeting-controls>p{font-size:11px;color:#928899;line-height:1.8;margin-bottom:22px}.photo-options{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-bottom:24px}.photo-options button{background:#fff;border:1px solid transparent;border-radius:2px;padding:4px;min-width:0;color:#817887}.photo-options button.selected{border-color:#833eff;color:#6e36b7}.photo-options img{width:100%;height:64px;object-fit:cover}.photo-options span{display:block;font-size:9px;margin-top:5px;white-space:nowrap}.album-select>.button{font-size:11px;padding:8px 19px;min-height:36px}.demo-note{font-size:9px!important;color:#a096a7!important;margin:10px 0 0!important}.frame-preview{width:100%;max-width:480px;justify-self:center}.preview-screen{position:relative;background:#d7d0c6;padding:14px;border:1px solid #beb6aa;border-radius:2px}.preview-screen>img{width:100%;aspect-ratio:1.5;object-fit:cover;border:7px solid #f4f0e9}.preview-screen>span{position:absolute;bottom:35px;left:35px;color:white;font-size:12px;text-shadow:0 1px 5px #000;max-width:calc(100% - 70px)}.preview-caption{display:flex;justify-content:space-between;gap:15px;font-size:10px;color:#958c9a;margin-top:14px}.preview-caption>span+span{text-align:right;color:#6b5d78}.greeting-controls>p{max-width:240px}.wish-options{display:flex;gap:8px;margin:28px 0}.wish-options button{border:1px solid #ded8e5;border-radius:2px;background:#fff;color:#8b7c97;font-size:11px;padding:6px 17px}.wish-options button.active{border-color:#a885d8;background:#f3ecfc;color:#7134c9}.greeting-preview{padding:45px 30px;background:#eee7f4;text-align:center;min-height:260px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#755c8d}.greeting-preview>span{font-size:10px;color:#9d88ad}.greeting-preview h3{font-family:Georgia,'Songti SC',serif;font-weight:400;font-size:29px;margin:28px 0 14px;color:#75578d}.greeting-preview p{font-size:12px;color:#957ba7;margin-bottom:28px}.device-panel{display:block}.device-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:22px}.device-heading h3{margin:0;font-size:16px}.device-heading>span{font-size:10px;color:#96899e}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;text-align:left;font-size:12px;white-space:nowrap}th{font-size:10px;font-weight:400;color:#9a8fa2;background:#f7f5fa}td,th{border-bottom:1px solid #e9e5ed;padding:15px 12px}td{color:#776d80}.device-state{color:#4a7a70;font-size:10px}.device-state.offline{color:#a49ca9}.feature-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:50px;margin-top:40px}.feature-columns article+article{border-left:1px solid var(--line);padding-left:35px}.feature-columns h3{font-size:16px;margin-bottom:12px}.feature-columns p{font-size:12px;margin:0;line-height:1.95}.daily-section{background:#f0ede7}.daily-inner{display:grid;grid-template-columns:1.15fr .85fr;align-items:center;gap:100px;padding-top:70px;padding-bottom:70px}.daily-inner figure>img{width:100%;height:360px;object-fit:cover}.daily-inner>div{max-width:340px}.daily-inner p{font-size:13px}.simple-link{display:inline-block;font-size:12px;padding-bottom:3px;border-bottom:1px solid #ada4b2;color:#756182}.partnership{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:start}.partner-copy>p:not(.section-label){font-size:13px;max-width:420px;line-height:2}.questions h3{font-size:15px;margin:0 0 15px}.questions details{border-bottom:1px solid var(--line)}summary{cursor:pointer;font-size:12px;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:15px;padding:19px 0;color:#625a68}summary::-webkit-details-marker{display:none}summary:after{content:'+';font-size:17px;font-weight:300;color:#aaa0b0}details[open] summary:after{content:'−'}details p{font-size:12px;color:#8b7e94;margin:0 0 20px;line-height:1.9}.contact{border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;gap:100px;padding-top:75px;padding-bottom:80px}.contact-intro{font-size:13px;line-height:2}.contact-note{font-size:10px;color:#a198a7;margin-top:45px;max-width:310px}form{margin:0}form label{display:block;font-size:11px;margin-bottom:20px;color:#776a82}.form-pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}input,textarea{width:100%;padding:10px 12px;border:1px solid #dcd5e3;background:#fff;border-radius:2px;color:#504457;font-size:12px;line-height:1.8;margin-top:7px}input::placeholder,textarea::placeholder{color:#b0a5b8}textarea{resize:vertical;min-height:90px}.form-submit{display:flex;align-items:center;gap:18px;margin-top:6px}.form-submit>span{font-size:10px;color:#a99dae}.result{font-size:12px;background:#eee8f5;padding:12px 15px;margin:20px 0 0;border-left:2px solid #9b71d3;color:#725b87}footer{max-width:1240px;margin:auto;padding:35px 40px 28px;border-top:1px solid var(--line)}.footer-top{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-top .brand{font-size:20px}.footer-top .logo{width:25px;height:25px}.version-switch{display:flex;gap:18px;align-items:center;font-size:10px;color:#94889c}.version-switch>span{color:#aaa1af;margin-right:5px}.version-switch a[aria-current]{color:#833eff}.footer-bottom{display:flex;justify-content:space-between;gap:20px;font-size:9px;color:#a198a7;margin-top:25px} /* Product direction: cool white page and a single charcoal product surface. */ .technology{--ink:#24252c;--muted:#73747f;--paper:#fff;--line:#e1e2e7;--soft:#f5f5f7}.technology .site-header{background:#fff}.technology .section-label{color:#8c8894}.tech-intro{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:end;padding-top:70px;padding-bottom:45px}.tech-intro h1{font-size:52px;line-height:1.35;margin:0;letter-spacing:-1.5px}.tech-intro-copy{padding-bottom:5px;max-width:430px}.tech-intro-copy>p{font-size:14px;line-height:2;margin-bottom:24px}.tech-product{padding-top:0;padding-bottom:60px}.technology .workspace{border:1px solid #33323e;background:#212127}.technology .workspace-bar{border-color:#3a3744;color:#ddd9e6;padding-top:18px;padding-bottom:18px}.technology .workspace-bar>span+span{color:#797380}.technology .workspace-tabs{background:#212127;border-color:#3b3744}.technology .workspace-tabs button{color:#86818f}.technology .workspace-tabs button.active{color:#cdb1f9;border-color:#b18ce6}.technology .workspace-panel{padding:45px 55px;min-height:410px;gap:80px}.technology .album-select h3,.technology .greeting-controls h3{color:#ddd5e9}.technology .album-select>p,.technology .greeting-controls>p{color:#93909f}.technology .photo-options button{background:transparent;color:#a9a0b4}.technology .photo-options button.selected{border-color:#b49bd5;color:#d9c7f4}.technology .photo-options img{height:75px}.technology .preview-screen{background:#45424c;border-color:#5d5765}.technology .preview-screen>img{border-color:#9d96a5}.technology .preview-caption{color:#88808f}.technology .preview-caption>span+span{color:#b6a7c7}.technology .wish-options button{background:#2c2735;border-color:#484050;color:#b4a7c3}.technology .wish-options button.active{background:#40304f;color:#e5d4f6;border-color:#9277ac}.technology .greeting-preview{background:#35303e}.technology .greeting-preview h3{color:#d5c5df}.technology .greeting-preview p{color:#b4a3bf}.technology .greeting-preview>span{color:#8a7998}.technology .device-heading h3{color:#d6cfe0}.technology .device-heading>span{color:#8e829b}.technology th{background:#2c2833;color:#8f819c}.technology td,.technology th{border-color:#393340;padding-top:18px;padding-bottom:18px}.technology td{color:#b6a8c3}.technology .device-state{color:#91b8ac}.technology .device-state.offline{color:#817788}.workspace-description{font-size:11px;color:#9c939f;text-align:center;margin:20px 0 0}.capabilities{display:grid;grid-template-columns:.9fr 1.1fr;gap:100px;padding-top:65px;padding-bottom:90px}.capability-rows article{display:grid;grid-template-columns:80px 1fr;gap:25px;padding:25px 0;border-top:1px solid var(--line)}.capability-rows article:first-child{padding-top:0;border-top:0}.capability-rows h3{font-size:14px;margin:0}.capability-rows p{font-size:13px;margin-bottom:12px}.capability-rows span{font-size:10px;color:#9c94a4}.partner-band{background:#f5f5f7}.technology .contact{border-top:0}.technology h2{font-size:30px}.technology .questions summary{color:#6e6577}.technology footer{margin-top:0} @media(min-width:1500px){.section,.nav-inner,footer{max-width:1320px}.hero-photo>img{height:520px}.family-hero{gap:65px}.family-hero h1{font-size:60px}} @media(max-width:1000px){.section{padding:65px 32px}.nav-inner{padding:0 32px;gap:25px}nav{gap:24px}.family-hero{gap:30px;padding-top:45px;padding-bottom:45px}.family-hero h1{font-size:46px}.hero-photo>img{height:430px}.hero-description{font-size:13px}.workspace-panel{padding:35px;gap:35px;min-height:350px}.feature-columns{gap:25px}.feature-columns article+article{padding-left:25px}.daily-inner{gap:60px}.partnership,.contact{gap:60px}.tech-intro{gap:50px;padding-bottom:40px}.tech-intro h1{font-size:45px}.tech-intro-copy>p{font-size:13px}.tech-product{padding-top:0;padding-bottom:35px}.technology .workspace-panel{padding:35px;gap:45px;min-height:370px}.technology .photo-options img{height:65px}.capabilities{gap:60px}.capability-rows article{grid-template-columns:65px 1fr;gap:18px}h2{font-size:29px}.technology h2{font-size:28px}footer{padding:30px 32px}} @media(max-width:700px){html{scroll-padding-top:85px}.site-header{height:72px}.nav-inner{padding:0 22px;gap:15px}.brand{font-size:22px}.logo{width:28px;height:28px}nav{display:none}.button.compact{font-size:11px;padding:6px 16px;min-height:34px}.section{padding:52px 24px}.family-hero{grid-template-columns:1fr;gap:30px;padding-top:35px;padding-bottom:40px}.family-hero h1{font-size:44px;line-height:1.35;margin-bottom:22px}.section-label{font-size:11px;margin-bottom:17px}.hero-copy{padding:0}.hero-description{max-width:480px;font-size:13px;line-height:1.9;margin-bottom:25px}.hero-photo>img{height:auto;aspect-ratio:1.25;object-position:68% center}.hero-photo figcaption{font-size:8px;margin-top:7px}.button{font-size:12px;padding:10px 20px;min-height:40px}.family-product{padding-top:40px}.section-heading{display:block;margin-bottom:25px}.section-heading>p{font-size:12px;margin-top:18px}.section-heading h2{font-size:27px}.workspace-bar{padding:12px 16px;font-size:11px}.workspace-bar>span+span{font-size:8px}.workspace-tabs{gap:22px;padding:0 16px}.workspace-tabs button{font-size:11px;padding:13px 0}.workspace-panel{grid-template-columns:1fr;gap:25px;padding:24px 20px;min-height:520px}.album-select h3,.greeting-controls h3{font-size:14px}.album-select>p,.greeting-controls>p{font-size:10px;margin-bottom:14px}.photo-options{gap:10px;margin-bottom:16px;max-width:330px}.photo-options img{height:65px}.photo-options span{font-size:9px}.album-select>.button{font-size:10px;min-height:32px;padding:7px 15px}.album-select>.demo-note{display:inline-block;margin-left:12px!important}.frame-preview{max-width:400px}.preview-screen{padding:11px}.preview-screen>img{border-width:5px}.preview-screen>span{font-size:11px;left:28px;bottom:28px}.preview-caption{font-size:9px;margin-top:10px}.greeting-panel{min-height:520px}.greeting-preview{min-height:250px;padding:30px 20px}.wish-options{margin:18px 0}.greeting-preview h3{font-size:27px}.device-panel{min-height:520px;padding-top:30px}.device-heading h3{font-size:14px}.device-heading>span{font-size:9px}table{font-size:10px}th{font-size:9px}td,th{padding:17px 9px}.feature-columns{grid-template-columns:1fr;gap:24px;margin-top:28px}.feature-columns article+article{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:24px}.feature-columns h3{font-size:15px;margin-bottom:8px}.feature-columns p{font-size:12px}.daily-inner{grid-template-columns:1fr;gap:30px}.daily-inner figure>img{height:280px}.daily-inner>div{max-width:none}.daily-inner h2{font-size:27px}.daily-inner p{font-size:12px;max-width:440px}.partnership{grid-template-columns:1fr;gap:40px}h2{font-size:27px}.partner-copy>p:not(.section-label){font-size:12px;max-width:none}.questions h3{font-size:14px}.contact{grid-template-columns:1fr;gap:25px}.contact-intro{font-size:12px;margin-bottom:18px}.contact-note{margin-top:0;font-size:9px;max-width:none}.form-pair{gap:15px}form label{font-size:10px;margin-bottom:18px}input,textarea{font-size:12px}.form-submit>span{font-size:9px}footer{padding:25px 24px}.footer-top .brand{font-size:18px}.footer-top .logo{width:23px;height:23px}.version-switch{gap:12px;font-size:9px}.version-switch>span{display:none}.footer-bottom{display:block;font-size:8px;margin-top:20px}.footer-bottom>span{display:block;margin-top:5px}.tech-intro{grid-template-columns:1fr;gap:20px;padding-top:40px;padding-bottom:30px}.tech-intro h1{font-size:42px}.tech-intro-copy{max-width:none}.tech-intro-copy>p{font-size:12px;margin-bottom:20px}.tech-product{padding-top:0;padding-bottom:30px}.technology .workspace-panel{padding:25px 20px;gap:25px;min-height:530px}.technology .photo-options img{height:65px}.technology .device-panel{min-height:530px}.workspace-description{font-size:9px;text-align:left;line-height:1.8}.capabilities{grid-template-columns:1fr;gap:30px;padding-top:35px}.technology h2{font-size:27px}.capability-rows article{grid-template-columns:70px 1fr;gap:20px}.capability-rows h3{font-size:13px}.capability-rows p{font-size:12px}.capability-rows span{font-size:9px}} @media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}} .technology{--ink:#1d1d1f;--muted:#6e6e73;--paper:#fff;--line:#dedee2;line-height:1.6}.technology .site-header{height:64px;background:rgba(255,255,255,.94);backdrop-filter:blur(18px);border-bottom:1px solid #dedee280}.technology .brand{font-size:22px}.technology .logo{width:27px;height:27px}.technology nav a{font-size:12px}.technology .button{border-radius:28px;font-size:14px;padding:11px 23px}.technology .button.compact{font-size:11px;padding:6px 18px;min-height:31px}.product-launch{background:#f5f5f7;text-align:center;overflow:hidden;padding-top:50px}.launch-copy>p{font-size:19px;font-weight:600;color:#1d1d1f;margin-bottom:20px}.launch-copy h1{font-size:66px;line-height:1.18;font-weight:650;letter-spacing:-2.8px;margin:0 20px 22px}.launch-copy h1 span{color:#833eff}.launch-subtitle{font-size:17px;line-height:1.8;color:#6e6e73;margin-bottom:23px}.launch-actions{display:flex;align-items:center;justify-content:center;gap:27px}.launch-link{font-size:14px;color:#833eff}.launch-link>span{font-size:23px;vertical-align:-2px;margin-left:6px}.launch-visual{max-width:1040px;margin:12px auto 0;padding-bottom:24px}.launch-visual img{width:100%;height:auto;mix-blend-mode:multiply}.launch-visual figcaption{font-size:9px;color:#8d8d93;margin-top:-12px}.sharing-section>.section{padding-top:110px;padding-bottom:95px}.editorial-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:60px;margin-bottom:52px}.technology .editorial-heading h2{font-size:48px;line-height:1.25;letter-spacing:-1.8px;font-weight:650;margin:0}.editorial-heading>p{max-width:430px;font-size:17px;line-height:1.8;margin:0;color:#86868b}.editorial-heading strong{font-weight:500;color:#1d1d1f}.technology .workspace{background:#f5f5f7;border:0;border-radius:28px;overflow:visible;padding-top:22px}.technology .workspace-bar{display:none}.technology .workspace-tabs{justify-content:center;gap:5px;background:#e9e9ed;border:0;border-radius:30px;width:max-content;margin:auto;padding:5px}.technology .workspace-tabs button{padding:9px 23px;font-size:12px;border:0;border-radius:25px;color:#6e6e73}.technology .workspace-tabs button.active{background:#fff;color:#1d1d1f;box-shadow:0 2px 5px #0000000b}.technology .workspace-panel{grid-template-columns:255px 1fr;padding:55px 65px;gap:70px;min-height:455px}.technology .album-select{position:relative;border:6px solid #343437;border-radius:34px;background:white;padding:35px 18px 25px;box-shadow:0 12px 22px -19px #262629}.technology .album-select:before{content:'';position:absolute;top:9px;left:50%;transform:translateX(-50%);width:65px;height:10px;border-radius:10px;background:#343437}.technology .album-select h3,.technology .greeting-controls h3{color:#1d1d1f;font-size:16px}.technology .album-select>p,.technology .greeting-controls>p{color:#86868b;font-size:11px}.technology .photo-options{grid-template-columns:1fr 1fr;gap:7px;margin-bottom:14px}.technology .photo-options button{background:#fff;border-radius:5px;padding:3px;color:#86868b}.technology .photo-options button:first-child{grid-column:1/-1}.technology .photo-options img{height:65px;border-radius:2px}.technology .photo-options button:first-child img{height:90px}.technology .photo-options button.selected{border-color:#833eff;color:#833eff}.technology .photo-options span{font-size:8px}.technology .album-select>.button{font-size:10px;padding:9px 12px;min-height:34px;width:100%}.technology .demo-note{font-size:8px!important;text-align:center}.technology .frame-preview{max-width:580px}.technology .preview-screen{background:#dedcd7;border:1px solid #cac7c0;border-radius:3px;padding:7px;box-shadow:0 20px 25px -24px #4d4658}.technology .preview-screen>img{border:30px solid #fbfaf7;aspect-ratio:1.5}.technology .preview-screen>span{left:50px;bottom:50px}.technology .preview-caption{color:#8b8990;font-size:10px;margin-top:20px}.technology .preview-caption>span+span{color:#77717f}.technology .greeting-panel{grid-template-columns:.8fr 1.2fr}.technology .greeting-controls{padding:20px 0}.technology .wish-options button{background:#fff;color:#817589;border-color:#e0d8e8;border-radius:20px}.technology .wish-options button.active{background:#833eff;color:#fff;border-color:#833eff}.technology .greeting-preview{background:#eee4f8;min-height:300px;border:7px solid #d9d5df;outline:1px solid #c5c0cd;box-shadow:inset 0 0 0 20px #fbfaf7}.technology .greeting-preview h3{color:#72508a}.technology .greeting-preview p{color:#8c739d}.technology .greeting-preview>span{color:#9d88ad}.workspace-description{font-size:10px;text-align:center;color:#99999f;margin:20px 0 0}.album-story{background:#f5f5f7}.album-story>.section{padding-top:100px;padding-bottom:70px}.album-cinema{position:relative;border-radius:24px;overflow:hidden;background:#2a343c;aspect-ratio:1.96}.album-cinema>img{width:100%;height:100%;object-fit:cover}.album-cinema:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#0006)}.cinema-label{position:absolute;bottom:35px;left:40px;color:white;z-index:1}.cinema-label span{font-size:12px}.cinema-label h3{font-size:27px;font-weight:500;letter-spacing:-.7px;margin:8px 0 0}.album-picker{display:flex;width:max-content;padding:5px;border-radius:25px;margin:28px auto 0;background:#e5e5ea;gap:4px}.album-picker button{border:0;background:none;padding:8px 27px;border-radius:20px;font-size:12px;color:#77777d}.album-picker button.active{background:white;color:#1d1d1f}.daily-story{background:#17151c;color:#fff}.daily-story-inner{display:grid;grid-template-columns:1.1fr 1fr;gap:100px;align-items:center;padding-top:100px;padding-bottom:100px}.night-display{background:#242129;border-radius:25px;min-height:290px;padding:40px 20px;display:flex;flex-direction:column;align-items:center;justify-content:center}.night-display>span{color:#a59baa;font-size:13px;margin-bottom:25px}.night-display strong{font-size:45px;font-weight:400;letter-spacing:-2px;color:#e7ddf0;white-space:nowrap}.night-display i{font-size:22px;font-style:normal;color:#74697f;vertical-align:5px;margin:0 5px}.night-display small{color:#918798;font-size:10px;margin-top:25px}.technology .daily-story h2{font-size:41px;font-weight:600;line-height:1.3}.technology .daily-story .section-label{color:#a88ccc}.daily-story p{color:#a39caa;font-size:14px}.setting-note{font-size:9px;color:#746b7b}.function-index{display:grid;grid-template-columns:1fr 1.2fr;gap:100px;padding-top:95px;padding-bottom:95px}.technology .function-index h2{font-size:34px;font-weight:600;line-height:1.35}.function-list details{border-bottom:1px solid #dedee2}.function-list summary{font-size:16px;font-weight:600;padding:16px 0;color:#1d1d1f}.function-list p{font-size:13px;color:#86868b;line-height:1.9;margin-bottom:25px}.technology .partner-band{background:#f5f5f7}.technology .partnership{padding-top:80px;padding-bottom:80px}.technology .partner-copy h2{font-size:32px;font-weight:600}.technology .contact{border:0}.technology .contact h2{font-size:34px;font-weight:600}.technology .contact-note{margin-top:25px}.technology input,.technology textarea{border-radius:8px}.technology footer{border-top:1px solid #dedee2}.reveal-ready{opacity:0;transform:translateY(20px);transition:opacity .7s,transform .7s}.reveal-ready.is-visible{opacity:1;transform:none} @media(min-width:1500px){.launch-copy h1{font-size:76px}.launch-visual{max-width:1160px}} @media(max-width:1000px){.launch-copy h1{font-size:58px}.technology .editorial-heading h2{font-size:39px}.editorial-heading>p{font-size:14px}.technology .workspace-panel{padding:45px 30px;grid-template-columns:220px 1fr;gap:35px}.technology .greeting-panel{grid-template-columns:.8fr 1.2fr}.technology .preview-screen>img{border-width:20px}.technology .preview-screen>span{bottom:35px;left:35px}.daily-story-inner{gap:50px}.night-display strong{font-size:34px}.technology .daily-story h2{font-size:34px}.function-index{gap:55px}} @media(max-width:700px){.technology .site-header{height:64px}.technology .brand{font-size:20px}.technology .logo{width:25px;height:25px}.product-launch{padding-top:37px}.launch-copy>p{font-size:14px;margin-bottom:19px}.launch-copy h1{font-size:41px;line-height:1.25;letter-spacing:-1.8px;margin:0 10px 20px}.launch-subtitle{font-size:13px;line-height:1.8;margin:0 18px 20px}.launch-actions{gap:22px}.technology .launch-actions .button{font-size:12px;padding:9px 20px;min-height:38px}.launch-link{font-size:12px}.launch-visual{margin:20px -12px 0;padding-bottom:20px}.launch-visual figcaption{font-size:8px;margin-top:0}.sharing-section>.section{padding:55px 24px}.editorial-heading{display:block;margin-bottom:30px}.technology .editorial-heading h2{font-size:33px;letter-spacing:-1px;margin-bottom:20px}.editorial-heading>p{font-size:13px}.technology .workspace{border-radius:22px;margin:0 -8px;padding-top:18px}.technology .workspace-tabs button{font-size:11px;padding:8px 20px}.technology .workspace-panel{grid-template-columns:1fr;padding:30px 22px;gap:35px;min-height:0}.technology .album-select{width:220px;justify-self:center;padding:30px 16px 20px;border-width:5px;border-radius:29px}.technology .album-select>.demo-note{display:block;margin-left:0!important}.technology .preview-screen>img{border-width:17px}.technology .preview-screen>span{left:34px;bottom:34px;font-size:10px}.technology .preview-caption{font-size:8px;margin-top:14px}.technology .greeting-panel{grid-template-columns:1fr;gap:20px}.technology .greeting-controls{padding:0 10px}.technology .greeting-preview{min-height:270px}.workspace-description{font-size:8px;line-height:1.8;text-align:center}.album-story>.section{padding:55px 24px}.album-cinema{aspect-ratio:.95;border-radius:20px}.cinema-label{left:24px;bottom:25px;right:20px}.cinema-label span{font-size:10px}.cinema-label h3{font-size:22px}.album-picker{margin-top:20px}.album-picker button{font-size:11px;padding:8px 22px}.daily-story-inner{display:flex;flex-direction:column-reverse;align-items:stretch;gap:30px;padding:55px 24px}.technology .daily-story h2{font-size:33px}.daily-story p{font-size:12px}.night-display{min-height:225px}.night-display strong{font-size:39px}.function-index{grid-template-columns:1fr;padding:55px 24px;gap:12px}.technology .function-index h2{font-size:30px}.function-list p{font-size:12px}.function-list summary{font-size:15px}.technology .partnership{padding:55px 24px}.technology .partner-copy h2{font-size:28px}.technology .contact h2{font-size:29px}.technology .contact-note{margin-top:0}} @media(prefers-reduced-motion:reduce){.reveal-ready{opacity:1;transform:none;transition:none}} .product-launch{padding-top:38px}.launch-copy h1{font-size:62px;line-height:1.2;margin-bottom:19px}.launch-copy>p{font-size:16px;margin-bottom:17px}.launch-subtitle{font-size:15px;margin-bottom:21px}.launch-visual{max-width:1000px;margin-top:5px}.launch-visual img{mask-image:linear-gradient(to right,transparent,#000 9%,#000 91%,transparent),linear-gradient(to bottom,transparent,#000 9%,#000 91%,transparent);mask-composite:intersect}@media(max-width:700px){.product-launch{padding-top:35px}.launch-copy h1{font-size:38px;line-height:1.25;max-width:330px;margin:0 auto 19px}.launch-copy h1 span{display:block}.launch-copy>p{font-size:13px}.launch-subtitle{font-size:12px;max-width:280px;margin:0 auto 20px}.launch-visual{margin-top:20px}} /* Real Figma mobile design, with the website demo controls outside the phone. */ .tech-mobile-design{justify-self:center;text-align:center;width:210px}.tech-phone-shell{border:5px solid #343437;border-radius:30px;background:white;overflow:hidden;box-shadow:0 16px 25px -22px #262629}.tech-phone-shell img{width:100%;height:auto;display:block}.tech-mobile-design figcaption{font-size:9px;color:#8b8791;margin-top:17px}.technology .workspace-panel[data-panel="photos"]{grid-template-columns:250px 1fr;align-items:center;gap:60px;padding-top:45px;padding-bottom:45px}.demo-send-controls{margin-top:26px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:12px 20px}.demo-send-controls>p{grid-column:1/-1;font-size:10px;color:#8b8791;margin:0}.technology .demo-send-controls .photo-options{display:flex;gap:8px;margin:0}.technology .demo-send-controls .photo-options button{width:67px;padding:3px}.technology .demo-send-controls .photo-options img,.technology .demo-send-controls .photo-options button:first-child img{height:43px;width:100%;object-fit:cover}.technology .demo-send-controls .photo-options span{font-size:7px}.technology .demo-send-controls>.button{font-size:11px;padding:9px 18px;min-height:36px;white-space:nowrap}.sleep-scene{position:relative;isolation:isolate;overflow:hidden;background:#17151c;min-height:650px}.sleep-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center center;z-index:-2}.sleep-scene:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(16,13,20,.84),rgba(16,13,20,.5) 36%,rgba(16,13,20,.05) 68%);z-index:-1}.technology .sleep-scene .daily-story-inner{display:flex;align-items:center;min-height:650px;padding-top:85px;padding-bottom:85px}.sleep-copy{max-width:440px}.technology .sleep-copy h2{font-size:48px;font-weight:600;line-height:1.3;letter-spacing:-1.3px;color:#f5eff8;margin-bottom:24px}.technology .sleep-copy .section-label{color:#c4aad8;font-size:12px;margin-bottom:25px}.sleep-copy>p:not(.section-label){font-size:15px;color:#c2b8c9;line-height:1.9}.sleep-schedule{display:flex;align-items:center;gap:30px;padding:26px 0 24px;border-top:1px solid #ffffff25;border-bottom:1px solid #ffffff25;margin:30px 0 24px;max-width:350px}.sleep-schedule>div{display:flex;flex-direction:column;gap:10px}.sleep-schedule span{font-size:10px;color:#b2a3bf}.sleep-schedule strong{font-size:39px;font-weight:400;letter-spacing:-1.5px;line-height:1.1;color:#eee4f5;font-variant-numeric:tabular-nums}.sleep-schedule i{font-style:normal;color:#887b94;font-size:20px;margin-top:19px}.sleep-copy>p.sleep-extra{font-size:11px;margin-bottom:12px;color:#a69aac}.sleep-copy .setting-note{font-size:9px;color:#897b93} @media(max-width:1000px){.technology .workspace-panel[data-panel="photos"]{grid-template-columns:210px 1fr;gap:35px;padding:35px 30px}.tech-mobile-design{width:190px}.demo-send-controls{gap:12px}.technology .demo-send-controls .photo-options button{width:56px}.technology .demo-send-controls>.button{padding:8px 13px}.technology .sleep-copy h2{font-size:40px}.sleep-background{object-position:60% center}} @media(max-width:700px){.technology .workspace-panel[data-panel="photos"]{grid-template-columns:1fr;gap:30px;padding:30px 22px}.tech-mobile-design{width:195px}.tech-mobile-design figcaption{font-size:8px;margin-top:13px}.demo-send-controls{grid-template-columns:1fr;gap:13px;margin-top:24px}.demo-send-controls>p{grid-column:auto;font-size:9px;text-align:center}.technology .demo-send-controls .photo-options{justify-content:center}.technology .demo-send-controls .photo-options button{width:68px}.technology .demo-send-controls>.button{justify-self:center;font-size:10px;padding:9px 23px}.sleep-scene{min-height:0}.sleep-background{position:relative;width:100%;height:310px;object-fit:cover;object-position:78% center;z-index:0}.sleep-scene:after{inset:225px 0 auto;height:85px;background:linear-gradient(transparent,#17151c);z-index:1;pointer-events:none}.technology .sleep-scene .daily-story-inner{min-height:0;display:block;padding:24px 28px 50px;position:relative;z-index:2}.technology .sleep-copy h2{font-size:34px;letter-spacing:-.8px;margin-bottom:22px}.technology .sleep-copy .section-label{font-size:10px;margin-bottom:20px}.sleep-copy>p:not(.section-label){font-size:13px}.sleep-schedule{margin:24px 0 20px;padding:22px 0;gap:34px;max-width:300px}.sleep-schedule strong{font-size:35px}.sleep-copy>p.sleep-extra{font-size:10px}.sleep-copy .setting-note{font-size:8px}} .physical-frame{position:relative;aspect-ratio:3/2;width:100%;isolation:isolate;filter:drop-shadow(0 12px 12px #483e4e15)} .physical-frame:before{content:'';position:absolute;inset:0;background:url('img/frame-bezel.jpg') center/100% 100% no-repeat;clip-path:inset(10.6% 4.6% 11.7% 4.6%)} .physical-frame .frame-content{position:absolute;left:11.7%;top:21.1%;width:76.6%;height:56.7%;object-fit:cover;border:0;border-radius:0;margin:0;display:block} .physical-frame .screen-caption{position:absolute;left:15%;bottom:25%;max-width:70%;color:#fff;font-size:11px;text-shadow:0 1px 5px #000} .family .memory-frame.real-memory{padding:0;border:0;background:none;box-shadow:none;width:54%}.family .real-memory figcaption{background:none;padding:0;margin:0;color:#8b786b} .album-product{margin:25px -12px 0}.album-mini-labels{display:flex;justify-content:center;gap:20px;color:#8b7b96;font-size:11px;margin-top:10px} .wish-product{margin:25px -12px 20px}.family .feature-wishes{display:flex;flex-direction:column}.family .feature-wishes .wish-product{margin-top:auto;padding-top:20px} .family .family-feature-grid .feature-night{position:relative;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0;background:#211b23;min-height:260px}.family-sleep-image{width:100%;height:100%;object-fit:cover;object-position:right center}.feature-night>div{padding:35px}.family .feature-night h3{font-size:25px} .family .greeting-panel,.technology .greeting-panel{grid-template-columns:.85fr 1.3fr;gap:45px;align-items:center}.greeting-product{margin:0;min-width:0}.greeting-product figcaption{text-align:center;margin:15px 0 0}.greeting-product figcaption strong{display:block;font-size:17px;font-weight:500;color:var(--ink)}.greeting-product figcaption span{display:block;font-size:12px;color:var(--muted);margin:6px 0}.greeting-product figcaption small{font-size:10px;color:#958a9d}.greeting-controls .section-label{font-size:10px!important;color:#833eff!important}.greeting-controls h3{line-height:1.6} .template-options{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:22px 0 12px}.template-options button,.technology .template-options button{padding:4px;background:transparent;border:1px solid #ded5e5;border-radius:6px;overflow:hidden;color:#776b80;min-width:0}.template-options button.active,.technology .template-options button.active{border-color:#833eff;background:#f0e7ff;color:#7034d8}.template-options img{width:100%;aspect-ratio:1.6;object-fit:cover;border-radius:3px}.template-options span{display:block;font-size:9px;white-space:nowrap;padding:7px 0 3px}.template-source{font-size:9px!important;color:#958a9d!important} .album-product-large{max-width:980px;margin:auto}.album-product-caption{text-align:center;padding-top:22px}.album-product-caption>span{font-size:11px;color:#8a8193}.album-product-caption h3{font-size:25px;font-weight:500;margin:8px 0;color:#1d1d1f}.technology .album-picker{margin-top:20px} .contact-direct{align-items:center;gap:65px}.contact-methods{display:flex;align-items:center;gap:35px;justify-content:space-between}.wechat-contact{display:flex;flex-direction:column;gap:14px;text-align:center}.wechat-contact>img{width:144px;height:144px;background:#fff;padding:7px;border:1px solid #eee8f3;border-radius:8px}.wechat-contact h3{font-size:16px;margin:0 0 5px}.wechat-contact p{font-size:11px;margin:0 0 7px}.demo-contact-label{display:block;color:#a197aa;font-size:10px}.phone-contact{border-left:1px solid #e7dfed;padding-left:35px}.phone-contact>p{font-size:13px;margin:0 0 12px}.phone-contact strong{font-size:26px;letter-spacing:-.5px;display:block;font-weight:500;white-space:nowrap;color:var(--ink);margin-bottom:14px} @media(max-width:1000px){.contact-direct{gap:35px}.contact-methods{gap:25px}.phone-contact{padding-left:25px}.phone-contact strong{font-size:23px}.family .greeting-panel,.technology .greeting-panel{gap:25px}} @media(max-width:700px){.physical-frame .screen-caption{font-size:8px}.family .memory-frame.real-memory{width:60%}.family .real-memory figcaption{font-size:7px}.family .greeting-panel,.technology .greeting-panel{grid-template-columns:1fr;gap:25px;padding:25px 20px}.template-options{max-width:340px}.template-options span{font-size:10px}.greeting-product figcaption strong{font-size:15px}.greeting-product figcaption span{font-size:11px}.greeting-product figcaption small{font-size:9px}.family .family-feature-grid .feature-night{grid-template-columns:1fr}.family-sleep-image{height:210px}.feature-night>div{padding:28px}.family .feature-night h3{font-size:23px}.album-product-caption{padding-top:14px}.album-product-caption h3{font-size:19px}.contact-direct{gap:30px}.contact-methods{justify-content:flex-start;gap:25px}.wechat-contact>img{width:125px;height:125px}.phone-contact{padding-left:20px}.phone-contact strong{font-size:20px}.wechat-contact h3{font-size:14px}} /* The supplied three-up image is shown through exact rectangular artwork windows. */ .wish-art{position:relative;width:100%;aspect-ratio:354/222;background-image:url('img/greeting-templates.jpg');background-size:377.6836% 132.8829%;background-repeat:no-repeat;border-radius:0} .art-mother{background-position:4.98474% 76.71233%}.art-valentine{background-position:49.1353% 76.71233%}.art-birthday{background-position:93.3876% 76.71233%} .wish-frame{aspect-ratio:1.1838}.wish-screen{position:absolute;left:11.7%;top:21.1%;width:76.6%;height:56.7%;overflow:hidden;background:#f8e6da}.wish-screen .wish-art{width:100%;height:100%;aspect-ratio:auto} .template-options .wish-art{border-radius:0}.template-options>button{border-radius:3px!important}.greeting-product{max-width:620px;width:100%;justify-self:center}.greeting-product figcaption{margin-top:-8px}.family .greeting-controls h3{font-size:27px}.technology .greeting-controls h3{font-size:23px} .family-features{padding-bottom:70px}.family-stories{margin-top:55px}.family-story{display:grid;grid-template-columns:1fr 1.35fr;align-items:center;gap:65px;padding:20px 0 65px}.story-copy h3{font-size:35px;font-weight:500;letter-spacing:-.8px;line-height:1.45;margin:15px 0 22px}.story-copy>p:not(.section-label){font-size:14px;line-height:2;color:#8a7a92}.story-tags{display:flex;gap:24px;font-size:11px;color:#a08aaf;margin-top:26px}.story-wishes{grid-template-columns:1.2fr 1fr;gap:95px;border-top:1px solid #eee7ef;padding-top:65px;padding-bottom:0}.story-wishes .story-visual{max-width:570px}.story-wishes .simple-link{font-size:12px;margin-top:18px;display:inline-block} .family-routine{position:relative;display:block;min-height:620px;background:#211b23;isolation:isolate}.routine-visual{position:absolute;inset:0;width:100%;height:100%;min-height:0;z-index:-2}.routine-visual img{object-position:center;display:block}.family-routine:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#211b23d9,#211b2366 42%,transparent 72%)}.routine-copy{padding:100px 40px 100px max(40px,calc((100vw - 1160px)/2));max-width:calc(50vw + 50px)}.routine-copy h2{font-size:39px;color:#fff8ef}.routine-copy .section-label{color:#d2badf}.routine-copy>p:not(.section-label){color:#d1c4c7}.routine-schedule{border-color:#ffffff2e}.routine-schedule>span{color:#eee0f0}.routine-schedule small{color:#b8a5b9}.routine-schedule i{color:#ab91ac} .family .workspace-panel.carousel-panel{display:block;padding:0}.photo-carousel{max-width:850px;margin:0 auto;min-width:0}.carousel-window{position:absolute;left:11.7%;top:21.1%;width:76.6%;height:56.7%;overflow:hidden;touch-action:pan-y;background:#29262b}.photo-track{width:100%;height:100%;display:flex;transform:translateX(-100%);will-change:transform}.photo-slide{width:100%;height:100%;flex:0 0 100%}.photo-slide img{width:100%;height:100%;object-fit:cover;display:block;pointer-events:none;user-select:none}.carousel-caption{display:flex;justify-content:space-between;margin:-22px 5% 22px;color:#8a7d93;font-size:12px}.carousel-caption>span+span{font-size:10px;font-variant-numeric:tabular-nums}.carousel-controls{display:flex;align-items:center;justify-content:center;gap:20px}.carousel-arrow{width:38px;height:38px;border:1px solid #e4dce9;background:transparent;border-radius:50%;font-size:25px;line-height:1;color:#715b81;cursor:pointer}.carousel-arrow:hover{border-color:#833eff;background:#f1e8ff}.carousel-dots{display:flex;align-items:center;gap:5px}.carousel-dots button{width:28px;height:36px;border:0;background:transparent;position:relative;cursor:pointer}.carousel-dots button:after{content:'';width:6px;height:6px;border-radius:50%;background:#d7cce0;position:absolute;top:15px;left:11px}.carousel-dots button.active:after{background:#833eff}.carousel-pause{background:none;border:0;border-left:1px solid #e4dce9;padding:3px 0 3px 20px;color:#94859c;font-size:11px;cursor:pointer}.carousel-note{text-align:center;font-size:9px;color:#ad9fb5;margin-top:16px}.technology .workspace-panel.carousel-panel{grid-template-columns:200px 1fr;gap:45px;padding:30px 40px}.technology .tech-mobile-design{width:170px;margin:0}.technology .tech-mobile-design figcaption{line-height:1.8}.technology .carousel-caption{margin-top:-12px}.technology .carousel-controls{gap:14px}.technology .carousel-arrow{width:32px;height:32px;font-size:23px} @media(max-width:1000px){.family-story{gap:35px}.story-copy h3{font-size:29px}.story-wishes{gap:50px}.routine-copy{padding:80px 32px;max-width:55%}.routine-copy h2{font-size:34px}.technology .workspace-panel.carousel-panel{grid-template-columns:160px 1fr;gap:25px;padding:30px 25px}.technology .tech-mobile-design{width:150px}} @media(max-width:700px){.family-stories{margin-top:35px}.family-story,.story-wishes{display:flex;flex-direction:column;gap:12px;padding:0 0 35px;align-items:stretch}.story-wishes{padding:35px 0 0}.story-wishes .story-copy{order:-1}.story-copy h3{font-size:28px;margin:12px 0 18px}.story-copy>p:not(.section-label){font-size:12px}.story-tags{margin-top:18px}.family-features{padding-bottom:45px}.family-routine{min-height:660px;display:flex;align-items:flex-end}.routine-visual{height:100%}.routine-visual img{object-position:72% center}.family-routine:after{background:linear-gradient(0deg,#211b23 1%,#211b23df 39%,#211b2340 72%,transparent)}.routine-copy{padding:260px 26px 40px;max-width:none;width:100%}.routine-copy h2{font-size:29px}.routine-copy>p:not(.section-label){font-size:12px}.routine-schedule{max-width:255px}.carousel-caption{font-size:10px;margin:-3px 5% 20px}.carousel-controls{gap:15px}.carousel-arrow{width:35px;height:35px}.carousel-note{font-size:9px}.technology .workspace-panel.carousel-panel{display:flex;flex-direction:column;gap:20px;padding:25px 15px}.technology .tech-mobile-design{width:135px}.technology .tech-phone-shell{border-radius:22px;border-width:4px}.technology .photo-carousel{width:100%}.technology .carousel-caption{margin-top:0;font-size:9px}.greeting-product figcaption{margin-top:0}.family .greeting-controls h3,.technology .greeting-controls h3{font-size:23px}.template-options{gap:7px}.template-options span{font-size:9px}} @media(prefers-reduced-motion:reduce){.photo-track{transition:none!important}} /* Shared website type scale. Device screenshots retain their original UI type. */ body.family,body.technology{font-size:18px;--body-size:18px;--support-size:14px;--section-size:48px;--subhead-size:32px;--muted:#6e6675} body:is(.family,.technology) p{line-height:1.85} body:is(.family,.technology) .site-header{height:80px} body:is(.family,.technology) .brand{font-size:26px} body:is(.family,.technology) .logo{width:32px;height:32px} body:is(.family,.technology) nav a{font-size:16px;color:#59515f} body:is(.family,.technology) .button{font-size:17px;min-height:48px;padding:12px 26px} body:is(.family,.technology) .button.compact{font-size:15px;min-height:42px;padding:9px 22px} body:is(.family,.technology) .section-label{font-size:14px!important;line-height:1.6;letter-spacing:.3px} body.family .cover-copy h1{font-size:clamp(48px,4.3vw,64px);line-height:1.3} body.family .cover-copy>p:not(.section-label){font-size:20px;line-height:1.85} body.technology .launch-copy h1{font-size:clamp(58px,5.2vw,76px);line-height:1.16} body.technology .launch-copy>p{font-size:21px} body.technology .launch-subtitle{font-size:21px;line-height:1.8} body.technology .launch-link{font-size:18px} body:is(.family,.technology) :is(.center-heading h2,.family-demo-heading h2,.editorial-heading h2,.routine-copy h2,.sleep-copy h2){font-size:var(--section-size);line-height:1.3;letter-spacing:-1.2px} body:is(.family,.technology) :is(.partner-copy h2,.contact h2,.function-index h2){font-size:40px;line-height:1.4} body:is(.family,.technology) :is(.story-copy h3,.greeting-controls h3){font-size:var(--subhead-size);line-height:1.45} body:is(.family,.technology) :is(.cover-copy>p:not(.section-label),.center-heading>p:not(.section-label),.family-demo-heading>p:last-child,.story-copy>p:not(.section-label),.editorial-heading>p,.greeting-controls>p:not(.section-label),.routine-copy>p:not(.section-label),.sleep-copy>p:not(.section-label),.partner-copy>p:not(.section-label),.contact-intro,.function-list p){font-size:var(--body-size)} body:is(.family,.technology) .editorial-heading>p{max-width:460px} body:is(.family,.technology) .greeting-controls>p{max-width:none} body.family .simple-steps h3{font-size:21px} body.family .simple-steps p{font-size:16px;line-height:1.8} body.family .simple-steps article>span{width:42px;height:42px;line-height:42px;font-size:18px} body.family :is(.story-tags,.send-connection span){font-size:15px;color:#776782} body:is(.family,.technology) .simple-link{font-size:17px;line-height:1.8} body:is(.family,.technology) .workspace-tabs button{font-size:17px;min-height:48px;padding:11px 28px} /* Auto margins previously let the grid item shrink to its controls' intrinsic width. */ body:is(.family,.technology) .photo-carousel{width:100%;max-width:1000px;min-width:0;justify-self:stretch} body.technology .workspace-panel.carousel-panel{grid-template-columns:220px minmax(0,1fr);gap:42px;padding:35px 28px 40px;align-items:center} body.technology .tech-mobile-design{width:210px;max-width:100%} body.technology .tech-phone-shell{border-radius:30px} body.technology .tech-mobile-design figcaption{font-size:15px;line-height:1.7;margin-top:18px;color:#6d6575} body:is(.family,.technology) .carousel-caption{font-size:16px;line-height:1.6;color:#6d6278;margin:-8px 5% 20px;gap:20px} body:is(.family,.technology) .carousel-caption>span+span{font-size:14px;white-space:nowrap} body:is(.family,.technology) .carousel-controls{gap:18px} body:is(.family,.technology) .carousel-arrow{width:46px;height:46px;flex-shrink:0;font-size:29px} body:is(.family,.technology) .carousel-dots button{width:30px;height:44px} body:is(.family,.technology) .carousel-dots button:after{width:8px;height:8px;top:18px;left:11px} body:is(.family,.technology) .carousel-pause{font-size:15px;min-height:44px;padding-left:20px;color:#74637f} body:is(.family,.technology) .carousel-note{font-size:14px;color:#81738b;margin-top:18px} body:is(.family,.technology) .template-options{gap:12px} body:is(.family,.technology) .template-options>button{padding:5px} body:is(.family,.technology) .template-options span{font-size:15px;padding:10px 2px 6px} body:is(.family,.technology) .greeting-product figcaption strong{font-size:22px} body:is(.family,.technology) .greeting-product figcaption span{font-size:16px} body:is(.family,.technology) .album-product-caption>span{font-size:15px} body:is(.family,.technology) .album-product-caption h3{font-size:30px} body:is(.family,.technology) .album-picker button{font-size:16px;min-height:44px;padding:10px 28px} body:is(.family,.technology) :is(.workspace-description,.scene-note,.real-memory figcaption,.cover-caption,.launch-visual figcaption,.setting-note){font-size:13px;line-height:1.7} body.family .memory-frame.real-memory figcaption{font-size:14px;margin-top:6px} body.family .routine-schedule>span{font-size:36px} body.family .routine-schedule small{font-size:14px;margin-top:14px} body.technology .sleep-copy{max-width:500px} body.technology .sleep-schedule{max-width:400px} body.technology .sleep-schedule span{font-size:14px} body.technology .sleep-schedule strong{font-size:46px} body.technology .sleep-copy>p.sleep-extra{font-size:16px} body:is(.family,.technology) .function-list summary{font-size:22px;padding:20px 0} body:is(.family,.technology) .questions h3{font-size:22px} body:is(.family,.technology) .questions summary{font-size:17px;line-height:1.7;padding:22px 0} body:is(.family,.technology) .questions details p{font-size:16px;line-height:1.9} body:is(.family,.technology) .contact-methods{gap:28px} body:is(.family,.technology) .wechat-contact>img{width:156px;height:156px} body:is(.family,.technology) .wechat-contact h3{font-size:21px} body:is(.family,.technology) .wechat-contact p{font-size:15px} body:is(.family,.technology) .phone-contact{padding-left:28px} body:is(.family,.technology) .phone-contact>p{font-size:17px} body:is(.family,.technology) .phone-contact strong{font-size:30px} body:is(.family,.technology) .demo-contact-label{font-size:13px;color:#81738b} body:is(.family,.technology) .footer-top .brand{font-size:24px} body:is(.family,.technology) .version-switch{font-size:15px;color:#766781} body:is(.family,.technology) .footer-bottom{font-size:12px;line-height:1.8;color:#81738b} @media(min-width:1500px){body.family,body.technology{--body-size:20px;--section-size:56px;--subhead-size:38px}body.technology .workspace-panel.carousel-panel{grid-template-columns:240px minmax(0,1fr);gap:55px;padding:40px 35px}body.technology .tech-mobile-design{width:230px}} @media(min-width:701px) and (max-width:1000px){body.family,body.technology{--body-size:17px;--section-size:40px;--subhead-size:29px}body.technology .workspace-panel.carousel-panel{grid-template-columns:170px minmax(0,1fr);gap:24px;padding:30px 20px}body.technology .tech-mobile-design{width:165px}body:is(.family,.technology) nav{gap:20px}body:is(.family,.technology) nav a{font-size:14px}body:is(.family,.technology) .contact-direct{grid-template-columns:1fr;gap:35px}body:is(.family,.technology) .contact-methods{justify-content:flex-start;gap:50px}} @media(max-width:700px){ body.family,body.technology{font-size:16px;--body-size:16px;--section-size:34px;--subhead-size:27px} body:is(.family,.technology) .site-header{height:72px} body:is(.family,.technology) .brand{font-size:23px} body:is(.family,.technology) .logo{width:29px;height:29px} body:is(.family,.technology) .button.compact{font-size:14px;padding:8px 17px;min-height:40px} body:is(.family,.technology) .button{font-size:16px;min-height:46px;padding:11px 23px} body:is(.family,.technology) .section-label{font-size:13px!important} body.family .cover-copy h1{font-size:39px;line-height:1.35} body.technology .launch-copy h1{font-size:46px;max-width:350px} body.technology .launch-copy>p{font-size:17px} body.technology .launch-subtitle{font-size:17px;max-width:330px;padding:0 16px} body.technology .launch-actions{gap:18px} body.technology .launch-actions .button{font-size:15px} body.technology .launch-link{font-size:15px} body:is(.family,.technology) :is(.partner-copy h2,.contact h2,.function-index h2){font-size:32px} body.family .family-demo-heading>p:last-child{max-width:none} body.family .simple-steps h3{font-size:20px} body.family .simple-steps p{font-size:15px} body.family :is(.story-tags,.send-connection span){font-size:14px} body:is(.family,.technology) .workspace-tabs button{font-size:16px;padding:10px 23px;min-height:44px} body.technology .workspace-panel.carousel-panel{display:flex;gap:26px;padding:28px 12px} body.technology .tech-mobile-design{width:190px} body.technology .tech-mobile-design figcaption{font-size:14px} body:is(.family,.technology) .carousel-caption{font-size:14px;margin:3px 3% 16px;gap:10px} body:is(.family,.technology) .carousel-caption>span+span{font-size:12px} body:is(.family,.technology) .carousel-controls{gap:10px} body:is(.family,.technology) .carousel-arrow{width:44px;height:44px} body:is(.family,.technology) .carousel-dots{gap:0} body:is(.family,.technology) .carousel-pause{font-size:14px;padding-left:12px} body:is(.family,.technology) .carousel-note{font-size:12px} body:is(.family,.technology) .template-options{gap:7px} body:is(.family,.technology) .template-options span{font-size:13px;padding:9px 0 5px} body:is(.family,.technology) .greeting-product figcaption strong{font-size:20px} body:is(.family,.technology) .greeting-product figcaption span{font-size:15px} body:is(.family,.technology) .album-product-caption h3{font-size:24px} body:is(.family,.technology) .album-picker button{font-size:15px;padding:8px 23px} body:is(.family,.technology) :is(.workspace-description,.scene-note,.cover-caption,.launch-visual figcaption,.setting-note){font-size:12px} body.family .memory-frame.real-memory figcaption{font-size:12px} body.family .routine-schedule>span{font-size:32px} body.family .routine-schedule small{font-size:13px} body.technology .sleep-schedule strong{font-size:39px} body.technology .sleep-copy>p.sleep-extra{font-size:15px} body:is(.family,.technology) .function-list summary{font-size:20px} body:is(.family,.technology) .questions h3{font-size:21px} body:is(.family,.technology) .questions summary{font-size:16px} body:is(.family,.technology) .questions details p{font-size:15px} body:is(.family,.technology) .contact-methods{gap:20px} body:is(.family,.technology) .wechat-contact>img{width:126px;height:126px} body:is(.family,.technology) .wechat-contact h3{font-size:18px} body:is(.family,.technology) .wechat-contact p{font-size:13px} body:is(.family,.technology) .phone-contact{padding-left:18px} body:is(.family,.technology) .phone-contact>p{font-size:15px} body:is(.family,.technology) .phone-contact strong{font-size:21px} body:is(.family,.technology) .demo-contact-label{font-size:12px} body:is(.family,.technology) .footer-top .brand{font-size:21px} body:is(.family,.technology) .version-switch{font-size:14px;gap:14px} } @media(max-width:360px){body:is(.family,.technology) .contact-methods{gap:12px}body:is(.family,.technology) .phone-contact{padding-left:12px}body:is(.family,.technology) .phone-contact strong{font-size:19px}body:is(.family,.technology) .brand{font-size:21px}body:is(.family,.technology) .button.compact{font-size:13px;padding:8px 13px}} .greetings-section{background:#f5eff4}.technology .greetings-section{background:#f5f5f7} /* Partnership starts a separate neutral section after the product showcase. */ body.family .partnership{background:#fffdfa;margin-top:48px;border-top:1px solid #e6dfe9} body.technology .partner-band{background:#fff;border-top:1px solid #e1e2e7} @media(max-width:700px){body.family .partnership{margin-top:30px}} body:is(.family,.technology) .greetings-section>.section{padding-top:90px;padding-bottom:90px} body:is(.family,.technology) .greetings-section .greeting-panel{display:grid;grid-template-columns:.85fr 1.3fr;gap:65px;padding:0;min-height:0;align-items:center} body:is(.family,.technology) .greetings-section .greeting-title{font-size:var(--section-size);line-height:1.3;letter-spacing:-1.2px;color:var(--ink);margin-bottom:26px} body:is(.family,.technology) .greetings-section .greeting-controls{padding:0} body:is(.family,.technology) .greetings-section .template-options{margin-top:32px} body:is(.family,.technology) .greetings-section .greeting-product{max-width:none} body.technology .sharing-section .workspace{padding-top:0} body.family .family-product{padding-bottom:75px} @media(max-width:1000px){body:is(.family,.technology) .greetings-section .greeting-panel{gap:35px}} @media(max-width:700px){body:is(.family,.technology) .greetings-section>.section{padding-top:55px;padding-bottom:55px}body:is(.family,.technology) .greetings-section .greeting-panel{grid-template-columns:1fr;gap:18px}body:is(.family,.technology) .greetings-section .greeting-title{font-size:32px}body.family .family-product{padding-bottom:55px}} /* Product-led technology direction: neutral stages, large devices, precise hierarchy. */ body.technology{--ink:#1d1d1f;--muted:#6e6e73;background:#fff;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue","PingFang SC","Microsoft YaHei",sans-serif} body.technology .site-header{height:72px;background:rgba(18,18,20,.92);border-bottom:1px solid #ffffff20;color:#f5f5f7} body.technology .site-header .brand{color:#f5f5f7;font-size:24px} body.technology nav a{color:#d2d2d7;font-size:15px} body.technology .product-launch{background:#080809;padding-top:65px;color:#f5f5f7} body.technology .launch-copy>p{color:#a1a1a6;font-size:20px;margin-bottom:24px;font-weight:500} body.technology .launch-copy h1{font-size:clamp(64px,6.2vw,96px);font-weight:650;line-height:1.12;letter-spacing:-3.6px;margin:0 auto 26px} body.technology .launch-copy h1 span{color:#f5f5f7} body.technology .launch-subtitle{color:#a1a1a6;font-size:21px;line-height:1.6;margin:0 auto 26px} body.technology .launch-actions{gap:30px} body.technology .launch-link{color:#ad80ff;font-size:18px} body.technology .launch-visual{width:min(960px,85%);max-width:none;margin:5px auto 0;padding-bottom:45px;perspective:1400px} body.technology .launch-frame{transform:rotateY(-9deg) rotateX(4deg);filter:drop-shadow(0 25px 30px #000);margin:-25px 0 -35px} body.technology .launch-frame img{mix-blend-mode:normal;mask-image:none} body.technology .launch-visual figcaption{color:#86868b;margin:0;font-size:13px} body.technology .section{max-width:1320px} body.technology :is(.sharing-section,.greetings-section,.album-story)>.section{padding:110px 48px 95px} body.technology .editorial-heading{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:0;margin:0 auto 30px} body.technology .editorial-heading .section-label{margin:0 0 20px;color:#6e6e73;font-weight:600;font-size:17px!important} body.technology .editorial-heading h2,body.technology .greetings-section .greeting-title{font-size:clamp(48px,4.5vw,68px);line-height:1.18;letter-spacing:-2px;font-weight:650;margin:0 0 28px} body.technology .editorial-heading h2 span{color:#86868b} body.technology .editorial-heading>p:not(.section-label){max-width:650px;font-size:20px;line-height:1.7;color:#6e6e73} body.technology .sharing-section{background:#f5f5f7} body.technology .workspace{background:transparent;border-radius:0;margin:0;padding:0} body.technology .workspace-panel.carousel-panel{grid-template-columns:220px minmax(0,1fr);gap:40px;padding:20px 0 0;min-height:0} body.technology .tech-mobile-design{width:220px;align-self:center} body.technology .tech-phone-shell{border:6px solid #252527;box-shadow:0 22px 45px -25px #0008;border-radius:32px} body.technology .tech-mobile-design figcaption{color:#6e6e73;font-size:15px} body.technology .photo-carousel{width:100%;max-width:none} body.technology .carousel-caption{color:#6e6e73;margin-top:-15px} body.technology .carousel-controls{gap:20px} body.technology .carousel-arrow{background:#e8e8ed;border-color:transparent;color:#424245} body.technology .carousel-arrow:hover{background:#dddde5} body.technology .carousel-pause{color:#6e6e73;border-color:#d2d2d7} body.technology .carousel-note,body.technology .workspace-description{color:#86868b} body.technology .greetings-section{background:#101012;color:#f5f5f7} body.technology .greetings-section .greeting-panel{display:flex;flex-direction:column;gap:0;text-align:center} body.technology .greetings-section .greeting-controls{display:contents} body.technology .greetings-section .section-label{order:0;color:#a1a1a6!important;font-size:17px!important;margin:0 0 20px;font-weight:600} body.technology .greetings-section .greeting-title{order:1;color:#f5f5f7} body.technology .greetings-section .greeting-controls>p:not(.section-label){order:2;font-size:20px;color:#a1a1a6;line-height:1.7;margin:0} body.technology .greetings-section .greeting-product{order:3;width:min(800px,100%);max-width:800px;margin:-15px 0 0} body.technology .greeting-product figcaption{margin:-35px 0 25px} body.technology .greeting-product figcaption strong{color:#f5f5f7;font-size:22px} body.technology .greeting-product figcaption span{color:#a1a1a6;font-size:16px} body.technology .greetings-section .template-options{order:4;width:490px;max-width:100%;gap:16px;margin:15px 0 0} body.technology .template-options>button{border:1px solid #424245;background:transparent;color:#a1a1a6;padding:6px} body.technology .template-options>button.active{border-color:#a675ff;background:#25202f;color:#f5f5f7} body.technology .album-story{background:#fff} body.technology .album-product-large{max-width:1000px;margin:-25px auto 0} body.technology .album-product-caption{padding-top:0;margin-top:-10px} body.technology .album-product-caption>span{color:#6e6e73} body.technology .album-product-caption h3{font-size:28px} body.technology .album-picker{background:#f5f5f7;margin-top:24px} body.technology .album-picker button{color:#6e6e73} body.technology .album-picker button.active{background:#1d1d1f;color:white} body.technology .sleep-scene .daily-story-inner{min-height:700px} body.technology .sleep-copy h2{font-size:56px;line-height:1.2;letter-spacing:-1.8px} body.technology .sleep-copy .section-label{color:#d2d2d7!important} body.technology .sleep-copy>p:not(.section-label){color:#d2d2d7} body.technology .sleep-schedule strong{font-size:52px;font-weight:500;color:#f5f5f7} body.technology .sleep-schedule span{color:#a1a1a6} body.technology .function-index{padding:110px 48px;gap:90px} body.technology :is(.function-index,.partner-band,.contact) .section-label{color:#6e6e73} body.technology .function-list p{color:#6e6e73} body.technology .partner-band{background:#f5f5f7;border-top:1px solid #e5e5e7} body.technology .partnership{padding:95px 48px;gap:75px} body.technology .partner-copy>p:not(.section-label),body.technology .questions p{color:#6e6e73} body.technology .contact{padding:95px 48px} body.technology footer{background:#f5f5f7} @media(min-width:1500px){body.technology .workspace-panel.carousel-panel{grid-template-columns:240px minmax(0,1fr);gap:60px}body.technology .tech-mobile-design{width:240px}} @media(max-width:1000px){body.technology .workspace-panel.carousel-panel{grid-template-columns:180px minmax(0,1fr);gap:25px}body.technology .tech-mobile-design{width:180px}body.technology .function-index{gap:40px}body.technology .partnership{gap:40px}body.technology .launch-copy h1{font-size:68px}} @media(max-width:700px){ body.technology .site-header{height:72px}body.technology .site-header .brand{font-size:23px} body.technology .product-launch{padding-top:55px} body.technology .launch-copy>p{font-size:16px;margin-bottom:22px} body.technology .launch-copy h1{font-size:49px;line-height:1.14;letter-spacing:-1.7px;max-width:none;margin:0 18px 24px} body.technology .launch-subtitle{font-size:17px;max-width:350px;padding:0 10px;margin-bottom:24px} body.technology .launch-actions{gap:20px}body.technology .launch-link{font-size:15px} body.technology .launch-visual{width:100%;margin:24px auto 0;padding-bottom:35px} body.technology .launch-frame{transform:rotateY(-6deg);margin:0 0 12px} body.technology .launch-visual figcaption{font-size:12px} body.technology :is(.sharing-section,.greetings-section,.album-story)>.section{padding:65px 24px} body.technology .editorial-heading{margin-bottom:25px} body.technology .editorial-heading .section-label,body.technology .greetings-section .section-label{font-size:14px!important;margin-bottom:18px} body.technology .editorial-heading h2,body.technology .greetings-section .greeting-title{font-size:36px;letter-spacing:-1px;line-height:1.23;margin-bottom:24px} body.technology .editorial-heading>p:not(.section-label),body.technology .greetings-section .greeting-controls>p:not(.section-label){font-size:16px;line-height:1.8} body.technology .workspace-panel.carousel-panel{display:flex;flex-direction:column;gap:15px;padding:0} body.technology .tech-mobile-design{width:180px}body.technology .tech-phone-shell{border-radius:28px;border-width:5px} body.technology .photo-carousel{width:calc(100% + 28px);max-width:none} body.technology .carousel-caption{margin:0 5% 20px} body.technology .carousel-controls{gap:12px} body.technology .greetings-section .greeting-product{width:calc(100% + 28px);max-width:none;margin:12px -14px 0} body.technology .greeting-product figcaption{margin:0 0 22px} body.technology .greeting-product figcaption strong{font-size:20px} body.technology .greeting-product figcaption span{font-size:15px} body.technology .greetings-section .template-options{gap:8px;margin:0} body.technology .template-options>button{padding:4px}body.technology .template-options span{font-size:13px} body.technology .album-product-large{width:calc(100% + 28px);margin:0 -14px} body.technology .album-product-caption{margin:5px 0 0}body.technology .album-product-caption h3{font-size:24px} body.technology .sleep-scene .daily-story-inner{min-height:0;padding:28px 24px 55px} body.technology .sleep-copy h2{font-size:36px;letter-spacing:-1px}body.technology .sleep-schedule strong{font-size:42px} body.technology .function-index{padding:65px 24px;gap:20px} body.technology .partnership{padding:65px 24px;gap:40px} body.technology .contact{padding:65px 24px} } @media(min-width:701px){ body.technology .product-launch{padding-top:38px} body.technology .launch-copy>p{margin-bottom:15px} body.technology .launch-copy h1{font-size:clamp(56px,5.4vw,82px);margin-bottom:20px} body.technology .launch-copy h1 br,body.technology .launch-subtitle br{display:none} body.technology .launch-subtitle{margin-bottom:22px} body.technology .launch-visual{width:min(840px,82%);margin:-10px auto 0;padding-bottom:32px} body.technology .launch-frame{margin:-25px 0 -35px} } @media(min-width:701px){body.technology .greeting-title br{display:none}} @media(max-width:700px){body.technology .photo-carousel{margin:0 -14px;align-self:center}} /* V13: one photographic composition with three distinct frame materials. */ body.technology .launch-visual.material-lineup{width:min(1440px,96%);max-width:none;perspective:none;margin:18px auto 0;padding-bottom:35px} body.technology .material-lineup-image{display:block;width:100%;height:auto;mix-blend-mode:normal;mask-image:linear-gradient(to right,transparent,#000 4%,#000 96%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 86%,transparent);mask-composite:intersect} body.technology .material-lineup figcaption{font-size:15px;color:#b6b6bc;margin:8px 0 0;letter-spacing:.4px} body.technology .material-lineup figcaption span{display:block;font-size:12px;color:#86868b;margin-top:8px;letter-spacing:0} @media(max-width:700px){body.technology .launch-visual.material-lineup{width:100%;margin-top:32px;padding-bottom:35px}body.technology .material-lineup figcaption{font-size:13px;margin-top:16px}body.technology .material-lineup figcaption span{font-size:12px}} /* V14: one shared center axis for titles, descriptions and physical products. */ body.technology .editorial-heading{width:100%;text-align:center} body.technology .editorial-heading h2{width:100%;text-align:center;text-wrap:balance} body.technology .editorial-heading>p{width:100%;text-align:center;margin-left:auto;margin-right:auto;text-wrap:balance} body.technology .editorial-heading>p:not(.section-label){font-size:20px;font-weight:400;line-height:1.8} @media(max-width:700px){body.technology .editorial-heading h2{font-size:34px}body.technology .editorial-heading>p:not(.section-label){font-size:16px}} /* Individual templates captured directly from Figma at 200%, not the user-uploaded composite. */ .wish-art{aspect-ratio:726/453;background-size:100% 100%;background-position:center} .art-mother{background-image:url('img/wish-mother.jpg')} .art-valentine{background-image:url('img/wish-valentine.jpg')} .art-birthday{background-image:url('img/wish-birthday.jpg')} .wish-frame{aspect-ratio:1.1863} @media(max-width:700px){body.technology .album-story .editorial-heading h2{font-size:clamp(25px,7.2vw,34px);white-space:nowrap}} /* Real device UI fills the screen without clipping time, weather or toolbar. */ .physical-frame .frame-content,.photo-slide img{object-fit:fill} body.technology svg.material-lineup-image{height:auto;aspect-ratio:1983/793;overflow:hidden} .family svg.cover-image{overflow:hidden} .physical-frame:not(.wish-frame){aspect-ratio:1.318} body.technology .material-lineup-image foreignObject img{mask-image:none!important;-webkit-mask-image:none!important;mix-blend-mode:normal} /* Technology edition — deliberate type hierarchy and calibrated product stages. */ body.technology{--ink:#1d1d1f;--muted:#707075;--body-size:19px;--section-size:54px;font-size:18px;line-height:1.6;-webkit-font-smoothing:antialiased} body.technology p{line-height:1.75} body.technology :is(h1,h2,h3,p,figure){text-wrap:pretty} body.technology :is(h1,h2){font-weight:600;letter-spacing:-.045em} body.technology .section{max-width:1280px;padding-left:60px;padding-right:60px} body.technology .site-header{height:68px;background:rgba(18,18,20,.88);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)} body.technology .nav-inner{max-width:1280px;padding:0 60px} body.technology .site-header .brand{font-size:24px;letter-spacing:-.8px} body.technology nav{gap:30px} body.technology nav a{font-size:14px;color:#d4d4d8;transition:color .2s} body.technology nav a:hover{color:white} body.technology .button{font-size:17px;font-weight:500;min-height:46px;padding:11px 25px;box-shadow:none} body.technology .button.compact{font-size:14px;min-height:38px;padding:8px 20px} body.technology :is(a,button,summary):focus-visible{outline:3px solid #a577ff;outline-offset:5px} body.technology .product-launch{padding-top:66px;background:#080809} body.technology .launch-copy>p{font-size:19px;font-weight:500;color:#c3c3c8;margin-bottom:21px;letter-spacing:.01em} body.technology .launch-copy h1{font-size:clamp(54px,5.6vw,82px);line-height:1.15;max-width:1100px;margin:0 auto 25px;letter-spacing:-.045em} body.technology .launch-subtitle{font-size:21px;line-height:1.65;color:#a7a7ae;max-width:630px;margin:0 auto 28px} body.technology .launch-subtitle br{display:none} body.technology .launch-actions{gap:28px} body.technology .launch-link{font-size:17px;color:#b28bff} body.technology .launch-visual.material-lineup{width:min(1380px,100%);margin:22px auto 0;padding-bottom:40px} body.technology .material-lineup figcaption{margin:-3px 0 0;letter-spacing:0} body.technology .material-lineup figcaption .material-names{display:flex;justify-content:center;align-items:center;gap:10px;font-size:14px;color:#babac1;margin:0} body.technology .material-names i{width:11px;height:11px;border-radius:50%;display:inline-block;margin-left:18px;border:1px solid #ffffff30} body.technology .material-names i:first-child{margin-left:0} .wood-light{background:#b98c5f}.wood-white{background:#e6e3de}.wood-dark{background:#65432e} body.technology .material-lineup figcaption small{display:block;font-size:12px;color:#85858c;line-height:1.6;margin-top:12px} body.technology :is(.sharing-section,.album-story)>.section{padding-top:104px;padding-bottom:96px} body.technology .sharing-section{background:#fff} body.technology .album-story{background:#f5f5f7} body.technology .editorial-heading{max-width:960px;margin:0 auto 56px;gap:0} body.technology .editorial-heading .section-label{font-size:15px!important;line-height:1.5;color:#707075;margin:0 0 18px;font-weight:500;letter-spacing:.04em} body.technology .editorial-heading h2{font-size:clamp(42px,4vw,58px);line-height:1.2;letter-spacing:-.04em;font-weight:600;margin:0 0 24px;white-space:normal} body.technology .editorial-heading h2 span{color:#77777e;margin-left:.24em} body.technology .editorial-heading>p:not(.section-label){font-size:20px;max-width:700px;line-height:1.7;font-weight:400;color:#74747b;margin:0 auto} /* Remove the invisible margins in the source device photograph without changing its screen ratio. */ body.technology .physical-frame{aspect-ratio:1.5402;filter:drop-shadow(0 22px 20px #1d1d1f13)} body.technology .physical-frame:before{inset:-13.6422% -5.0661% -15.0579%;background-size:100% 100%;clip-path:inset(10.6% 4.6% 11.7% 4.6%)} body.technology .physical-frame :is(.frame-content,.carousel-window,.wish-screen){left:7.8194%;top:13.5135%;width:84.3612%;height:72.973%} body.technology .physical-frame.wish-frame{aspect-ratio:1.3863} body.technology .workspace-panel.carousel-panel{grid-template-columns:214px minmax(0,1fr);gap:64px;padding:12px 0 0;align-items:center} body.technology .tech-mobile-design{width:214px;margin:0;align-self:center} body.technology .tech-phone-shell{border:5px solid #28282b;outline:1px solid #969699;border-radius:31px;box-shadow:0 15px 25px #00000012,0 3px 5px #00000010} body.technology .tech-mobile-design figcaption{font-size:14px;color:#74747b;margin-top:22px;line-height:1.5} body.technology .tech-mobile-design figcaption span{font-size:12px;font-weight:600;color:#8a52e2;margin-right:8px;font-variant-numeric:tabular-nums} body.technology .photo-carousel{width:100%;margin:0;max-width:none} body.technology .carousel-caption{font-size:16px;margin:24px 0 16px;color:#515157;font-weight:500} body.technology .carousel-caption>span+span{font-size:13px;color:#86868d;font-weight:400;letter-spacing:.04em} body.technology .carousel-controls{gap:16px} body.technology .carousel-arrow{width:40px;height:40px;font-size:26px;background:#f0f0f3;color:#505058} body.technology .carousel-dots{gap:0} body.technology .carousel-dots button:after{width:6px;height:6px;background:#d1d1d7} body.technology .carousel-dots button.active:after{background:#833eff} body.technology .carousel-note{font-size:13px;color:#797981;margin:12px 0 0} body.technology .interface-details{display:grid;grid-template-columns:repeat(3,1fr);gap:48px;max-width:1010px;border-top:1px solid #dedee3;margin:68px auto 0;padding-top:30px} body.technology .interface-details h3{font-size:20px;font-weight:600;margin:0 0 12px;letter-spacing:-.02em;color:#252529} body.technology .interface-details p{font-size:16px;line-height:1.8;color:#77777e;margin:0} body.technology .workspace-description{font-size:12px;color:#85858d;margin-top:28px} body.technology .album-product-large{max-width:960px;margin:0 auto} body.technology .album-product-caption{margin:28px 0 0;padding:0} body.technology .album-product-caption>span{font-size:13px;color:#7d7d84;letter-spacing:.02em} body.technology .album-product-caption h3{font-size:23px;font-weight:500;line-height:1.5;letter-spacing:-.02em;margin:8px 0 0} body.technology .album-picker{margin:24px auto 0;background:#e8e8ed;padding:5px;gap:3px} body.technology .album-picker button{font-size:15px;min-height:42px;padding:9px 27px;color:#66666e} body.technology .album-picker button.active{background:#fff;color:#1d1d1f;box-shadow:0 2px 6px #00000008} /* Blessings get an editorial product layout, distinct from the sharing and library stages. */ body.technology .greetings-section{background:#fff;color:#1d1d1f} body.technology .greetings-section>.section{padding-top:116px;padding-bottom:106px} body.technology .greetings-section .greeting-panel{display:grid;grid-template-columns:minmax(270px,.82fr) minmax(0,1.5fr);gap:64px;align-items:center;text-align:left;padding:0} body.technology .greetings-section .greeting-controls{display:block;padding:0} body.technology .greetings-section .section-label{color:#75757c!important;font-size:15px!important;font-weight:500;margin-bottom:18px} body.technology .greetings-section .greeting-title{font-size:54px;font-weight:600;letter-spacing:-.04em;line-height:1.2;color:#1d1d1f;margin:0 0 22px} body.technology .greetings-section .greeting-controls>p.greeting-lead{font-size:26px;line-height:1.5;font-weight:500;color:#515158;margin:0 0 22px;letter-spacing:-.02em} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){font-size:17px;color:#74747b;line-height:1.8;margin:0} body.technology .greetings-section .greeting-product{width:100%;max-width:none;margin:0;order:initial} body.technology .greeting-product figcaption{margin:25px 0 0;text-align:center} body.technology .greeting-product figcaption strong{font-size:20px;font-weight:500;color:#1d1d1f} body.technology .greeting-product figcaption span{font-size:13px;color:#8a8a91;margin-top:6px} body.technology .greetings-section .template-options{width:100%;max-width:330px;gap:12px;margin:32px 0 0} body.technology .template-options>button{background:transparent;border:1px solid #dedee3;padding:4px;transition:border-color .2s,background .2s} body.technology .template-options>button:hover{border-color:#a090b7} body.technology .template-options>button.active{border-color:#833eff;background:#f7f3fe;color:#7032d4} body.technology .template-options span{font-size:13px;color:#707078;padding:8px 0 4px} body.technology .template-options .active span{color:#7032d4} body.technology .sleep-scene{background:#181619} body.technology .sleep-background{object-position:center} body.technology .sleep-scene:after{background:linear-gradient(90deg,#131115ed 0%,#131115b0 29%,#13111525 55%,transparent 70%)} body.technology .sleep-scene .daily-story-inner{min-height:710px;padding-top:95px;padding-bottom:95px} body.technology .sleep-copy{max-width:500px} body.technology .sleep-copy .section-label{font-size:15px!important;color:#bcb5bf!important;margin-bottom:22px} body.technology .sleep-copy h2{font-size:50px;font-weight:600;line-height:1.2;letter-spacing:-.04em;margin:0 0 28px} body.technology .sleep-copy h2 span{display:block;font-size:36px;color:#b5afb9;margin-top:12px;letter-spacing:-.03em} body.technology .sleep-copy>p:not(.section-label){font-size:18px;line-height:1.85;color:#c3bec7} body.technology .sleep-schedule{max-width:370px;margin:32px 0 22px;padding:24px 0;gap:32px} body.technology .sleep-schedule strong{font-size:46px;font-weight:400;letter-spacing:-.03em;line-height:1.15} body.technology .sleep-schedule span{font-size:13px;color:#a9a2ae} body.technology .sleep-copy>p.sleep-extra{font-size:15px;color:#b3abb8} body.technology .sleep-copy .setting-note{font-size:12px;color:#9c939f} body.technology .function-index{padding-top:100px;padding-bottom:100px;grid-template-columns:1fr 1.1fr;gap:110px} body.technology :is(.function-intro,.partner-copy,.contact) .section-label{font-size:15px!important;font-weight:500;margin:0 0 20px;color:#74747b} body.technology :is(.function-index,.partner-copy,.contact) h2{font-size:42px;font-weight:600;line-height:1.25;letter-spacing:-.04em;margin-bottom:24px} body.technology .function-intro-copy{font-size:18px;color:#77777e;margin:0} body.technology .function-list summary{font-size:21px;font-weight:500;padding:20px 0} body.technology .function-list ul{list-style:none;margin:0;padding:0 0 24px;display:grid;gap:10px} body.technology .function-list li{font-size:16px;line-height:1.75;color:#74747b;padding-left:18px;position:relative} body.technology .function-list li:before{content:'';position:absolute;top:.78em;left:0;width:4px;height:4px;background:#a7a7b0;border-radius:50%} body.technology .partner-band{background:#f5f5f7;border-top:0} body.technology .partnership{padding-top:96px;padding-bottom:96px;gap:100px} body.technology .partner-copy>p:not(.section-label){font-size:17px;line-height:1.9;max-width:465px;color:#74747b} body.technology .simple-link{font-size:17px;color:#7634df} body.technology .questions h3{font-size:21px;font-weight:500;margin:0 0 15px} body.technology .questions summary{font-size:16px;font-weight:500;padding:22px 0;line-height:1.65} body.technology .questions details p{font-size:15px;color:#77777e;line-height:1.85} body.technology .contact{padding-top:92px;padding-bottom:92px;gap:70px} body.technology .contact-intro{font-size:17px;line-height:1.85;color:#74747b} body.technology .wechat-contact h3{font-size:18px;font-weight:500} body.technology .wechat-contact p{font-size:14px;color:#74747b} body.technology .wechat-contact>img{width:140px;height:140px;border-radius:8px;border-color:#e5e5eb} body.technology .phone-contact strong{font-size:29px;letter-spacing:-.04em;font-weight:500} body.technology .phone-contact>p{font-size:16px} body.technology .demo-contact-label{font-size:12px;color:#929299} body.technology footer{background:#f5f5f7;border-top:1px solid #e5e5ea;padding-top:35px;padding-bottom:28px} body.technology .footer-bottom{color:#85858c;font-size:12px} body.technology .version-switch{font-size:14px;color:#7c7c85} @media(max-width:1100px){ body.technology .section{padding-left:40px;padding-right:40px}body.technology .nav-inner{padding:0 32px}body.technology nav{gap:20px} body.technology .workspace-panel.carousel-panel{grid-template-columns:185px minmax(0,1fr);gap:40px}body.technology .tech-mobile-design{width:185px} body.technology .greetings-section .greeting-panel{gap:36px;grid-template-columns:280px minmax(0,1fr)}body.technology .greetings-section .greeting-title{font-size:46px} body.technology .function-index{gap:60px}body.technology .partnership{gap:55px}body.technology .contact{gap:40px} } @media(max-width:760px){ body.technology .section{padding-left:24px;padding-right:24px}body.technology .nav-inner{padding:0 22px}body.technology nav{display:none} body.technology .site-header{height:64px}body.technology .site-header .brand{font-size:23px}body.technology .button.compact{font-size:13px;min-height:36px;padding:7px 17px} body.technology .product-launch{padding-top:55px}body.technology .launch-copy>p{font-size:16px;margin-bottom:20px} body.technology .launch-copy h1{font-size:clamp(38px,8.7vw,56px);max-width:none;margin:0 20px 22px;letter-spacing:-.045em;line-height:1.2} body.technology .launch-subtitle{font-size:17px;line-height:1.75;max-width:340px;padding:0 8px;margin-bottom:25px}body.technology .launch-subtitle br{display:block} body.technology .launch-actions{gap:22px}body.technology .launch-actions .button,body.technology .launch-link{font-size:15px} body.technology .launch-visual.material-lineup{width:100%;margin-top:28px;padding-bottom:32px} body.technology .material-lineup figcaption .material-names{font-size:12px;gap:7px}body.technology .material-names i{width:9px;height:9px;margin-left:10px} body.technology :is(.sharing-section,.album-story)>.section{padding:68px 24px} body.technology .editorial-heading{margin-bottom:38px}body.technology .editorial-heading .section-label{font-size:13px!important;margin-bottom:16px} body.technology .editorial-heading h2,body.technology .album-story .editorial-heading h2{font-size:34px;line-height:1.25;white-space:normal;margin-bottom:20px} body.technology .editorial-heading h2 span{display:block;margin:8px 0 0;font-size:28px;letter-spacing:-.03em} body.technology .editorial-heading>p:not(.section-label){font-size:16px;line-height:1.8} body.technology .workspace-panel.carousel-panel{display:flex;flex-direction:column;gap:34px;padding:0} body.technology .tech-mobile-design{width:180px}body.technology .tech-mobile-design figcaption{font-size:13px;margin-top:16px} body.technology .tech-phone-shell{border-radius:28px;border-width:4px} body.technology .photo-carousel{width:100%;margin:0}body.technology .carousel-caption{font-size:14px;margin:20px 0 12px}body.technology .carousel-caption>span+span{font-size:12px} body.technology .interface-details{grid-template-columns:1fr;gap:22px;margin-top:40px;padding-top:26px}body.technology .interface-details article{display:grid;grid-template-columns:105px 1fr;gap:16px} body.technology .interface-details h3{font-size:17px;margin:0}body.technology .interface-details p{font-size:14px;line-height:1.75}body.technology .interface-details br{display:none} body.technology .workspace-description{font-size:11px;margin-top:24px} body.technology .album-product-large{width:100%;margin:0}body.technology .album-product-caption{margin-top:24px}body.technology .album-product-caption h3{font-size:21px} body.technology .album-picker{max-width:100%;margin-top:20px;gap:0;padding:4px}body.technology .album-picker button{padding:8px 17px;font-size:14px;min-height:40px} body.technology .greetings-section>.section{padding:68px 24px} body.technology .greetings-section .greeting-panel{display:flex;flex-direction:column;gap:35px;text-align:center} body.technology .greetings-section .greeting-controls{width:100%;display:contents} body.technology .greetings-section .section-label{order:0;margin:0;font-size:13px!important} body.technology .greetings-section .greeting-title{order:1;font-size:36px;margin:-18px 0 0} body.technology .greetings-section .greeting-controls>p.greeting-lead{order:2;font-size:24px;line-height:1.45;margin:-17px 0 0} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){order:3;font-size:16px;margin:-17px 0 0} body.technology .greetings-section .greeting-product{order:4;width:100%;margin:0} body.technology .greetings-section .template-options{order:5;width:100%;max-width:330px;margin:-8px 0 0} body.technology .greeting-product figcaption{margin:22px 0 0}body.technology .greeting-product figcaption strong{font-size:19px} body.technology .sleep-background{position:relative;height:330px;object-position:77% center} body.technology .sleep-scene:after{top:240px;height:90px;background:linear-gradient(transparent,#181619);bottom:auto} body.technology .sleep-scene .daily-story-inner{min-height:0;padding:25px 26px 60px} body.technology .sleep-copy h2{font-size:35px;margin-bottom:24px}body.technology .sleep-copy h2 span{font-size:28px;margin-top:9px} body.technology .sleep-copy .section-label{font-size:13px!important;margin-bottom:17px}body.technology .sleep-copy>p:not(.section-label){font-size:16px} body.technology .sleep-schedule{gap:30px;max-width:330px;margin:28px 0 20px}body.technology .sleep-schedule strong{font-size:40px} body.technology .sleep-copy>p.sleep-extra{font-size:14px}body.technology .sleep-copy .setting-note{font-size:11px} body.technology .function-index{grid-template-columns:1fr;padding:65px 24px;gap:28px} body.technology :is(.function-index,.partner-copy,.contact) h2{font-size:33px;line-height:1.3;margin-bottom:22px} body.technology .function-intro-copy{font-size:16px}body.technology .function-list summary{font-size:20px}body.technology .function-list li{font-size:15px} body.technology .partnership{padding:65px 24px;gap:36px;grid-template-columns:1fr} body.technology .partner-copy>p:not(.section-label){font-size:16px} body.technology .contact{padding:65px 24px;gap:32px;grid-template-columns:1fr}body.technology .contact-intro{font-size:16px} body.technology .contact-methods{gap:22px;justify-content:flex-start}body.technology .wechat-contact>img{width:125px;height:125px}body.technology .phone-contact{padding-left:20px} body.technology .phone-contact strong{font-size:23px}body.technology .wechat-contact p{font-size:13px} body.technology .version-switch{font-size:13px} } @media(prefers-reduced-motion:reduce){body.technology *{scroll-behavior:auto!important}} /* Repair the source template's capture seam; keep the original family asset unchanged. */ body.technology .art-birthday{background-image:url('img/wish-birthday-large.jpg')} /* Product storytelling: measured Chinese typography, generous imagery, focused copy. */ body.technology{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"PingFang SC","Helvetica Neue","Microsoft YaHei",Arial,sans-serif;font-synthesis:none} body.technology :is(h1,h2,h3){letter-spacing:0} body.technology p{line-height:1.6} body.technology .section{max-width:1320px;padding-left:72px;padding-right:72px} body.technology .site-header{height:60px;background:rgba(22,22,23,.9)} body.technology .nav-inner{max-width:1320px;padding:0 72px} body.technology .site-header .brand{font-size:22px} body.technology nav a{font-size:13px} body.technology .button.compact{font-size:13px;min-height:34px;padding:7px 18px} body.technology section[id]{scroll-margin-top:60px} body.technology .product-launch{padding-top:68px} body.technology .launch-copy>p{font-size:24px;color:#f5f5f7;font-weight:600;margin-bottom:20px} body.technology .launch-copy h1{font-size:clamp(64px,7vw,100px);line-height:1.12;letter-spacing:-.025em;margin-bottom:26px} body.technology .launch-copy h1 span{color:#bba2f8} body.technology .launch-subtitle{font-size:21px;font-weight:500;color:#b8b8c0;line-height:1.55;max-width:800px;margin-bottom:28px} body.technology .launch-subtitle br{display:block} body.technology .launch-visual.material-lineup{width:min(1600px,100%);margin:0 auto;padding-bottom:48px} body.technology .launch-actions{gap:28px} body.technology .launch-copy .button{background:#833eff} body.technology :is(.sharing-section,.album-story)>.section{padding-top:124px;padding-bottom:112px} body.technology .editorial-heading{max-width:980px;margin:0 auto 72px;align-items:flex-start;text-align:left} body.technology .editorial-heading .section-label{font-size:22px!important;line-height:1.3;color:#1d1d1f;font-weight:600;letter-spacing:0;margin:0 0 23px;text-align:inherit} body.technology .editorial-heading h2{font-size:clamp(54px,5.7vw,80px);line-height:1.16;letter-spacing:-.025em;font-weight:600;text-align:inherit;margin:0} body.technology .editorial-heading h2 span{display:inline;margin:0;font-size:.86em;line-height:inherit;color:#86868b} body.technology .workspace-panel.carousel-panel{gap:70px;grid-template-columns:220px minmax(0,1fr);padding:0;align-items:center} body.technology .tech-mobile-design{width:220px} body.technology .tech-mobile-design figcaption span{display:none} body.technology .carousel-note{display:none} body.technology .carousel-caption{margin:24px 0 16px} body.technology .feature-narrative{max-width:800px;font-size:21px;line-height:1.65;font-weight:500;color:#86868b;margin:64px auto 0;text-align:left} body.technology .feature-narrative strong,body.technology .screen-details strong{color:#1d1d1f;font-weight:600} body.technology .screen-details{display:grid;grid-template-columns:1fr 1fr;gap:36px;margin:72px auto 0;max-width:1080px} body.technology .screen-detail-visual{height:330px;overflow:hidden;border-radius:24px;position:relative;background:#e6eaf0;isolation:isolate} body.technology .screen-detail-visual img{position:absolute;width:160%;max-width:none;height:auto;display:block;top:0} body.technology .notification-detail img{left:0} body.technology .clock-detail img{right:0} body.technology .screen-details p{font-size:19px;line-height:1.6;font-weight:500;color:#86868b;margin:24px 22px 0} body.technology .screen-details p strong{display:block;margin-bottom:7px} body.technology .workspace-description{margin:46px 0 0;color:#86868b} body.technology .album-story .editorial-heading{align-items:center;text-align:center;margin-bottom:70px} body.technology .album-story .editorial-heading h2 span{color:#7b52b5} body.technology .album-product-large{max-width:1040px} body.technology .album-product-caption{margin-top:30px} body.technology .album-product-caption>span{display:none} body.technology .album-product-caption h3{font-size:24px;font-weight:600} body.technology .album-picker{margin-top:25px} body.technology .album-story .feature-narrative{margin-top:52px} body.technology .greetings-section>.section{padding-top:132px;padding-bottom:130px} body.technology .greetings-section .greeting-panel{grid-template-columns:minmax(0,1fr) minmax(0,1.35fr);gap:56px;align-items:center} body.technology .greetings-section .section-label{font-size:22px!important;font-weight:600;color:#1d1d1f!important;line-height:1.3;margin-bottom:24px} body.technology .greetings-section .greeting-title{font-size:clamp(40px,3.75vw,54px);line-height:1.2;letter-spacing:-.025em;margin:0 0 30px;white-space:nowrap} body.technology .greetings-section .greeting-title br{display:block} body.technology .greeting-title span{color:#86868b;font-size:.9em} body.technology .greetings-section .greeting-controls>p.greeting-lead{font-size:21px;font-weight:600;color:#1d1d1f;margin-bottom:8px;line-height:1.5} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){font-size:19px;font-weight:500;line-height:1.65;color:#86868b;max-width:390px} body.technology .greetings-section .template-options{margin-top:30px;max-width:300px} body.technology .greeting-product figcaption{margin-top:28px} body.technology .sleep-scene .daily-story-inner{min-height:780px;padding-top:105px;padding-bottom:105px} body.technology .sleep-copy{max-width:570px} body.technology .sleep-copy .section-label{font-size:21px!important;color:#e2dee5!important;font-weight:600} body.technology .sleep-copy h2{font-size:clamp(48px,5vw,68px);line-height:1.2;letter-spacing:-.025em;margin-bottom:32px} body.technology .sleep-copy h2 span{display:inline;font-size:inherit;line-height:inherit;color:#b9b3c0;margin:0} body.technology .sleep-copy>p:not(.section-label){font-size:20px;line-height:1.65;color:#b9b3c0;font-weight:500} body.technology .sleep-copy>p strong{color:#f5f5f7;font-weight:600} body.technology .sleep-copy>p.sleep-extra{font-size:16px} body.technology .sleep-schedule{margin:38px 0 24px} body.technology :is(.function-index,.partner-copy,.contact) h2{font-size:48px;line-height:1.2;letter-spacing:-.02em} body.technology :is(.function-index,.partner-copy,.contact) .section-label{font-size:19px!important;color:#1d1d1f;font-weight:600} body.technology .partner-copy h2 span{color:#86868b} body.technology .partner-copy>p:not(.section-label){font-size:19px;color:#77777d;line-height:1.7} body.technology .function-intro-copy{font-size:20px;line-height:1.6} body.technology .function-list li{font-size:17px} body.technology .partnership{gap:80px;padding-top:116px;padding-bottom:116px} @media(max-width:1100px){ body.technology .section,body.technology .nav-inner{padding-left:44px;padding-right:44px} body.technology .workspace-panel.carousel-panel{grid-template-columns:190px minmax(0,1fr);gap:44px}body.technology .tech-mobile-design{width:190px} body.technology .greetings-section .greeting-panel{grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:36px} body.technology .greetings-section .greeting-title{font-size:40px} body.technology .screen-detail-visual{height:280px} } @media(max-width:760px){ body.technology .section,body.technology .nav-inner{padding-left:26px;padding-right:26px} body.technology .site-header{height:60px}body.technology .site-header .brand{font-size:21px} body.technology .product-launch{padding-top:52px}body.technology .launch-copy>p{font-size:19px;margin-bottom:22px} body.technology .launch-copy h1{font-size:clamp(38px,10.5vw,64px);line-height:1.18;margin:0 20px 26px;letter-spacing:-.03em} body.technology .launch-copy h1 span{display:block} body.technology .launch-subtitle{font-size:17px;line-height:1.65;padding:0 28px;margin-bottom:26px} body.technology .launch-actions{gap:22px}body.technology .launch-actions .button{font-size:15px;padding:10px 18px} body.technology .launch-link{font-size:15px} body.technology .launch-visual.material-lineup{margin-top:20px;padding-bottom:36px} body.technology :is(.sharing-section,.album-story)>.section{padding-top:76px;padding-bottom:72px} body.technology .editorial-heading{margin:0 auto 42px} body.technology .editorial-heading .section-label{font-size:18px!important;margin-bottom:18px} body.technology .editorial-heading h2{font-size:42px;line-height:1.18;letter-spacing:-.025em} body.technology .editorial-heading h2 span{font-size:.86em} body.technology .workspace-panel.carousel-panel{display:flex;gap:38px} body.technology .tech-mobile-design{width:176px} body.technology .feature-narrative{font-size:18px;line-height:1.7;margin-top:38px} body.technology .screen-details{grid-template-columns:1fr;gap:36px;margin-top:44px} body.technology .screen-detail-visual{height:auto;aspect-ratio:1.2;border-radius:18px} body.technology .screen-details p{font-size:17px;margin:18px 6px 0;line-height:1.65} body.technology .workspace-description{margin-top:32px} body.technology .album-story .editorial-heading{margin-bottom:44px} body.technology .album-product-caption h3{font-size:21px} body.technology .album-story .feature-narrative{margin-top:34px} body.technology .greetings-section>.section{padding:76px 26px} body.technology .greetings-section .greeting-panel{display:flex;gap:0;text-align:left;align-items:stretch} body.technology .greetings-section .section-label{font-size:18px!important;margin:0 0 18px} body.technology .greetings-section .greeting-title{font-size:40px;line-height:1.2;margin:0 0 28px;white-space:normal} body.technology .greetings-section .greeting-controls>p.greeting-lead{font-size:19px;margin:0 0 7px} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){font-size:17px;line-height:1.7;margin:0 0 34px} body.technology .greetings-section .greeting-product{width:100%;margin:0} body.technology .greetings-section .template-options{margin:25px auto 0} body.technology .sleep-scene .daily-story-inner{min-height:0;padding:32px 26px 70px} body.technology .sleep-copy .section-label{font-size:18px!important} body.technology .sleep-copy h2{font-size:40px;line-height:1.2;margin-bottom:26px} body.technology .sleep-copy h2 span{font-size:inherit} body.technology .sleep-copy>p:not(.section-label){font-size:17px} body.technology .sleep-copy>p.sleep-extra{font-size:14px} body.technology :is(.function-index,.partner-copy,.contact) h2{font-size:34px;line-height:1.25} body.technology :is(.function-index,.partner-copy,.contact) .section-label{font-size:17px!important} body.technology .function-intro-copy{font-size:17px} body.technology .function-list li{font-size:16px} body.technology .partnership{padding:72px 26px;gap:42px} body.technology .partner-copy>p:not(.section-label){font-size:17px} } /* Let the product story carry the explanation; remove presentation-only captions. */ body.technology .launch-visual.material-lineup{padding-bottom:30px} body.technology .photo-carousel .carousel-controls{margin-top:28px} body.technology .album-picker{margin-top:36px} body.technology .screen-details p{line-height:1.7} body.technology .greetings-section .greeting-controls>p.greeting-lead{font-size:20px;line-height:1.6} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){margin-top:10px} @media(max-width:760px){ body.technology .launch-visual.material-lineup{padding-bottom:24px} body.technology .photo-carousel .carousel-controls{margin-top:24px} body.technology .greetings-section .greeting-controls>p.greeting-lead{font-size:18px} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){margin-top:8px} } /* A violet-lit product launch, scoped to the technology edition. */ body.technology{--ink:#f5f5f7;--muted:#a1a1ab;--paper:#09090d;--line:#ffffff20;background:#09090d;color:#f5f5f7} body.technology .site-header{background:rgba(10,10,16,.78);border-bottom:1px solid #ffffff13} body.technology .site-header:after{content:'';position:absolute;left:0;bottom:-1px;height:2px;width:100%;background:linear-gradient(90deg,#833eff,#d0b8ff);transform:scaleX(var(--read-progress,0));transform-origin:left;pointer-events:none} body.technology .button{background:#833eff;border:1px solid #b68aff55;box-shadow:inset 0 1px 0 #ffffff35,0 4px 28px #833eff25;transition:background .2s,box-shadow .2s,transform .2s} body.technology .button:hover{background:#9155ff;box-shadow:inset 0 1px 0 #ffffff50,0 8px 32px #833eff50;transform:translateY(-2px)} body.technology .product-launch{position:relative;isolation:isolate;padding-top:78px;background:#08080d;overflow:hidden} body.technology .product-launch:after{content:'';position:absolute;bottom:0;left:8%;right:8%;height:1px;background:linear-gradient(90deg,transparent,#b58aff66,transparent)} body.technology .launch-copy{position:relative;z-index:2} body.technology .launch-copy>p{font-size:22px;color:#ccc9d7;font-weight:500;letter-spacing:.03em} body.technology .launch-copy h1{font-size:clamp(72px,7.3vw,108px);font-weight:600;letter-spacing:-.03em;margin-bottom:28px} body.technology .launch-copy h1 span{background:linear-gradient(115deg,#fff 0%,#d8bdff 36%,#aa76ff 72%,#8d72ff 100%);color:#c7a6ff;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent} body.technology .launch-subtitle{color:#aaa6ba;font-weight:400;font-size:20px} body.technology .launch-actions{margin-top:30px} body.technology .launch-link{color:#c8a6ff} body.technology .launch-aura{position:absolute;z-index:0;pointer-events:none;inset:0;overflow:hidden;background:radial-gradient(ellipse at 50% 60%,#702edc38,transparent 62%)} body.technology .launch-aura i:first-child{position:absolute;width:1100px;height:620px;left:calc(50% - 550px);top:140px;border:1px solid #b48aff60;border-radius:50%;transform:rotate(-12deg);box-shadow:0 0 25px #7d3bff22,inset 0 0 35px #7d3bff1a;mask-image:linear-gradient(transparent 12%,#000 50%,transparent 94%)} body.technology .launch-aura i:last-child{position:absolute;left:10%;right:10%;top:340px;height:290px;background:radial-gradient(ellipse,#a365ff35,transparent 65%);filter:blur(40px)} body.technology .launch-visual.material-lineup{position:relative;z-index:1;width:min(1600px,100%);margin:20px auto 0;padding-bottom:50px;transform:perspective(1800px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg));transition:transform .55s ease-out} body.technology .launch-visual.material-lineup:after{content:'';position:absolute;pointer-events:none;bottom:8%;left:14%;right:14%;height:1px;background:linear-gradient(90deg,transparent,#b180ff90,transparent);box-shadow:0 0 28px 7px #8b4cff24} body.technology .material-lineup-image{filter:drop-shadow(0 18px 50px #0009)} body.technology .sharing-section{background:radial-gradient(ellipse at 72% 38%,#231532 0%,transparent 47%),#111116;position:relative} body.technology :is(.sharing-section,.album-story)>.section{padding-top:120px;padding-bottom:115px} body.technology .editorial-heading .section-label{color:#b69acb;font-size:18px!important;letter-spacing:.06em} body.technology .editorial-heading h2{color:#f5f5f7} body.technology .editorial-heading h2 span{color:#97909f} body.technology .workspace{position:relative;isolation:isolate} body.technology .workspace-panel.carousel-panel{position:relative;isolation:isolate;padding:22px 0 0} body.technology .tech-mobile-design{position:relative;z-index:2;transform:translateY(-12px) rotate(-3deg);transition:transform .6s ease} body.technology .tech-phone-shell{outline:1px solid #9d92b166;border-color:#29272f;box-shadow:0 30px 55px #0008,0 0 36px #9654ff1a} body.technology .photo-carousel{position:relative;z-index:2} body.technology .physical-frame{filter:drop-shadow(0 22px 30px #0008)} body.technology .connection-path{position:absolute;left:12%;right:8%;height:2px;top:45%;z-index:0;background:linear-gradient(90deg,transparent,#9f6bff95 20%,#c0a3ff80 65%,transparent);box-shadow:0 0 18px #9955ff55;pointer-events:none;overflow:hidden} body.technology .connection-path i{display:block;position:absolute;height:2px;width:80px;top:0;left:-80px;background:linear-gradient(90deg,transparent,#e3cfff);box-shadow:0 0 10px #d5aaff;animation:signal-flow 5s linear infinite;animation-play-state:paused} body.technology .connection-path i:nth-child(2){animation-delay:1.6s} body.technology .connection-path i:nth-child(3){animation-delay:3.2s} body.technology .sharing-section.in-view .connection-path i{animation-play-state:running} @keyframes signal-flow{to{left:100%}} body.technology .carousel-arrow{background:#2d2936;border:1px solid #ffffff0d;color:#d9c9ee;transition:background .2s} body.technology .carousel-arrow:hover{background:#463455} body.technology .carousel-dots button:after{background:#5e566a} body.technology .carousel-dots button.active:after{background:#bd92ff;box-shadow:0 0 10px #b477ff80} body.technology .feature-narrative{color:#aaa4b4;font-weight:400} body.technology .feature-narrative strong,body.technology .screen-details strong{color:#efedf5;font-weight:600} body.technology .screen-details{gap:28px;margin-top:70px} body.technology .screen-details article{border:1px solid #ffffff14;border-radius:26px;overflow:hidden;background:linear-gradient(140deg,#25232c,#1a1820);transition:transform .5s,border-color .5s} body.technology .screen-details article:hover{transform:translateY(-6px);border-color:#b78aff66} body.technology .screen-detail-visual{border-radius:0;height:320px} body.technology .screen-details p{margin:0;padding:27px 30px 32px;color:#aaa4b4;font-size:18px;font-weight:400} body.technology .screen-details strong{font-size:21px;margin-bottom:9px} body.technology .album-story{background:#08080c;overflow:hidden;position:relative} body.technology .album-story:before{content:'';position:absolute;pointer-events:none;inset:23% 0 18%;background:radial-gradient(ellipse at center,#6527ad24,transparent 65%)} body.technology .album-story>.section{position:relative} body.technology .album-story .editorial-heading h2 span{color:#b494e6} body.technology .album-product-large{position:relative;max-width:1030px;isolation:isolate} body.technology .album-product-large:after{content:'';position:absolute;left:9%;right:9%;height:2px;bottom:-20px;background:linear-gradient(90deg,transparent,#bd8cff88,transparent);box-shadow:0 10px 50px 12px #8043c326;z-index:-1} body.technology .album-picker{position:relative;margin-top:54px;background:#25222c;border:1px solid #ffffff0e;padding:6px;box-shadow:0 8px 25px #0005} body.technology .album-picker button{color:#aaa3b4;transition:background .25s,color .25s} body.technology .album-picker button.active{color:#fff;background:#7341be;box-shadow:inset 0 1px 0 #ffffff30} body.technology .greetings-section{background:linear-gradient(130deg,#1a1622,#111016 65%);color:#f5f5f7;border-top:1px solid #ffffff08;border-bottom:1px solid #ffffff08} body.technology .greetings-section .section-label{color:#b69acb!important;font-size:18px!important} body.technology .greetings-section .greeting-title{color:#f5f5f7} body.technology .greeting-title span{color:#a99ab8} body.technology .greetings-section .greeting-controls>p.greeting-lead{color:#ebe4f3} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){color:#aaa2b5;font-weight:400} body.technology .template-options>button{border-color:#ffffff20;background:#25212c;color:#c5bbd0} body.technology .template-options>button.active{background:#342145;border-color:#ba8aff;color:white;box-shadow:0 0 20px #9c5afa18} body.technology .template-options span{color:#bfb3ca} body.technology .template-options .active span{color:#e1caff} body.technology .sleep-scene{border-bottom:1px solid #ffffff12} body.technology .sleep-schedule{border-color:#bba4ce35} body.technology .sleep-schedule strong{font-variant-numeric:tabular-nums;color:#e9dafb} body.technology .function-index{padding-top:110px;padding-bottom:110px;background:#09090d} body.technology .function-intro .section-label{color:#ad8fc5!important} body.technology .function-intro h2{color:#f5f5f7} body.technology .function-intro-copy{color:#a6a0b1} body.technology .function-list details{border-color:#ffffff20} body.technology .function-list summary{color:#eee9f5} body.technology .function-list summary:after{color:#b49cc9} body.technology .function-list li{color:#aaa4b4} body.technology .function-list li:before{background:#a871f4} body.technology .partner-band{background:radial-gradient(ellipse at 12% 50%,#3a22582b,transparent 55%),#17131e;border-top:1px solid #ffffff10} body.technology .partner-copy .section-label{color:#b69acb!important} body.technology .partner-copy h2{color:#f5f5f7} body.technology .partner-copy h2 span{color:#b294d7} body.technology .partner-copy>p:not(.section-label){color:#b5aebf} body.technology .simple-link{color:#c69cf9;border-color:#80619e} body.technology .questions h3{color:#e7deef} body.technology .questions details{border-color:#ffffff1a} body.technology .questions summary{color:#c3b9cc} body.technology .questions p{color:#aaa0b5} body.technology .contact{color:#f5f5f7;background:#09090d} body.technology .contact .section-label{color:#b69acb!important} body.technology .contact h2{color:#f5f5f7} body.technology .contact-intro{color:#aaa4b4} body.technology .contact-methods{color:#e7dfef} body.technology .phone-contact{border-color:#ffffff20} body.technology .phone-contact strong,body.technology .wechat-contact h3{color:#f1eaf8} body.technology .phone-contact>p,body.technology .wechat-contact p{color:#b8adc4} body.technology .demo-contact-label{color:#8b8197} body.technology .wechat-contact>img{border-radius:16px;border:8px solid #fff;background:#fff} body.technology footer{background:#111015;color:#9c92a9;border-top:1px solid #ffffff12} body.technology footer .brand{color:#e6dfed} body.technology .footer-bottom{border-color:#ffffff15;color:#91869d} body.technology .version-switch a{color:#bcb1c9} body.technology .version-switch a[aria-current]{color:#c695ff} /* Animation stays subtle and has a static, visible fallback. */ body.technology .stage-reveal{opacity:0;transform:translateY(32px) scale(.97);transition:opacity .9s ease,transform 1.2s cubic-bezier(.2,.65,.25,1)} body.technology .stage-reveal.is-visible{opacity:1;transform:none} @media(min-width:761px){body.technology .greeting-product{transition:transform .6s ease}body.technology .greeting-product:hover{transform:translateY(-6px)}} @media(max-width:1100px){body.technology .screen-detail-visual{height:280px}body.technology .screen-details p{padding:24px;font-size:17px}body.technology .screen-details strong{font-size:19px}} @media(max-width:760px){ body.technology .product-launch{padding-top:54px} body.technology .launch-copy>p{font-size:18px} body.technology .launch-copy h1{font-size:clamp(42px,12vw,66px);line-height:1.15;margin-bottom:27px} body.technology .launch-subtitle{font-size:16px;max-width:370px;padding:0 22px} body.technology .launch-actions{margin-top:26px} body.technology .launch-aura i:first-child{width:560px;height:350px;left:calc(50% - 280px);top:200px} body.technology .launch-aura i:last-child{top:300px;left:-10%;right:-10%;height:250px;filter:blur(20px)} body.technology .launch-visual.material-lineup{margin-top:30px;padding-bottom:40px;transform:none} body.technology :is(.sharing-section,.album-story)>.section{padding-top:76px;padding-bottom:76px} body.technology .editorial-heading .section-label,body.technology .greetings-section .section-label{font-size:17px!important} body.technology .tech-mobile-design{transform:rotate(-3deg);margin:0 auto 12px} body.technology .connection-path{left:50%;top:12%;height:66%;width:1px;right:auto;background:linear-gradient(transparent,#b280f4,transparent)} body.technology .connection-path i{display:none} body.technology .screen-details{gap:24px;margin-top:42px} body.technology .screen-detail-visual{height:auto;aspect-ratio:1.2} body.technology .screen-details article{border-radius:20px} body.technology .screen-details p{padding:22px;font-size:16px} body.technology .screen-details strong{font-size:19px} body.technology .album-picker{margin-top:38px;padding:4px} body.technology .album-picker button{padding:9px 16px} body.technology .function-index{padding-top:76px;padding-bottom:76px} body.technology .wechat-contact>img{border-width:6px} } @media(prefers-reduced-motion:reduce){body.technology .connection-path i{animation:none}body.technology .stage-reveal{opacity:1;transform:none;transition:none}body.technology .launch-visual.material-lineup{transform:none!important;transition:none}body.technology :is(.button,.screen-details article,.greeting-product){transition:none;transform:none!important}} /* Product-first copy and a dedicated external-storage feature. */ body.technology .launch-copy h1{font-size:clamp(68px,7vw,100px);line-height:1.15} body.technology .launch-copy h1 span{display:block} body.technology .launch-subtitle{max-width:820px;font-size:21px;line-height:1.7} body.technology .editorial-heading h2{font-size:clamp(48px,5vw,68px)} body.technology .editorial-heading h2 span{display:block;font-size:.7em;line-height:1.35;margin-top:14px} body.technology .editorial-heading h2 br{display:none} body.technology .greetings-section .greeting-title{font-size:clamp(32px,3vw,43px);white-space:normal;line-height:1.3} body.technology .sleep-copy h2{font-size:clamp(40px,4.2vw,58px)} body.technology .import-story{background:radial-gradient(ellipse at 50% 45%,#312043 0%,transparent 60%),#141219;border-block:1px solid #ffffff0b} body.technology .import-story>.section{padding-top:110px;padding-bottom:105px} body.technology .import-heading{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:end;margin-bottom:66px} body.technology .import-heading .section-label{font-size:18px;color:#b69acb;margin-bottom:22px;font-weight:600} body.technology .import-heading h2{font-size:clamp(40px,4vw,58px);line-height:1.2;letter-spacing:-.02em;margin:0;color:#f5f5f7} body.technology .import-heading>p{font-size:20px;line-height:1.75;color:#b4aebe;margin:0;max-width:490px} body.technology .import-product{width:min(100%,1030px);margin:auto;position:relative;isolation:isolate} body.technology .import-product:after{content:'';position:absolute;left:15%;right:15%;bottom:-25px;height:28px;z-index:-1;background:#9056d64a;filter:blur(26px);border-radius:50%} body.technology .import-product .physical-frame{width:100%} body.technology .import-flow{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin:65px 0 0;padding:30px 0 0;border-top:1px solid #ffffff20} body.technology .import-flow li{display:flex;align-items:baseline;gap:20px} body.technology .import-flow li>span{color:#bd90f6;font-size:17px;font-variant-numeric:tabular-nums} body.technology .import-flow h3{font-size:21px;font-weight:600;color:#f0eaf7;margin:0 0 10px} body.technology .import-flow p{font-size:17px;color:#aaa2b5;line-height:1.65;margin:0} body.technology .feature-narrative strong{display:block;margin-bottom:10px} @media(max-width:1100px){body.technology .import-heading{gap:35px}body.technology .import-heading>p{font-size:18px}body.technology .import-flow{gap:24px}body.technology .import-flow li{gap:12px}body.technology .import-flow h3{font-size:19px}} @media(max-width:760px){ body.technology .launch-copy h1{font-size:clamp(42px,12vw,66px)} body.technology .launch-subtitle{font-size:17px;padding:0 26px} body.technology .editorial-heading h2{font-size:38px} body.technology .editorial-heading h2 span{font-size:28px;margin-top:12px} body.technology .greetings-section .greeting-title,body.technology .sleep-copy h2{font-size:34px} body.technology .import-story>.section{padding-top:76px;padding-bottom:76px} body.technology .import-heading{display:block;margin-bottom:38px} body.technology .import-heading .section-label{font-size:17px;margin-bottom:18px} body.technology .import-heading h2{font-size:36px} body.technology .import-heading>p{font-size:17px;margin-top:24px;line-height:1.7} body.technology .import-heading>p br{display:none} body.technology .import-flow{grid-template-columns:1fr;gap:25px;margin-top:38px;padding-top:28px} body.technology .import-flow li{gap:20px} body.technology .import-flow h3{font-size:20px;margin-bottom:6px} body.technology .import-flow p{font-size:16px} } /* Import is a visible, one-way flow from external storage to the frame. */ body.technology .import-heading{align-items:center;margin-bottom:68px} body.technology .import-heading h2{font-size:clamp(40px,4.1vw,58px);line-height:1.2} body.technology .import-heading h2 span{display:block;font-size:.77em;color:#b89adc;margin-top:12px} body.technology .import-heading h2 br{display:none} body.technology .import-transfer{display:grid;grid-template-columns:minmax(230px,.85fr) 70px minmax(0,2fr);gap:24px;align-items:center} body.technology .import-source-heading{display:flex;align-items:baseline;gap:14px;margin-bottom:26px} body.technology .import-number{color:#b793e5;font-size:16px;font-variant-numeric:tabular-nums;letter-spacing:.05em} body.technology .import-source-heading h3{color:#f3edf9;font-size:23px;font-weight:600;margin:0} body.technology .import-device-card{padding:17px 13px;background:#f2f2f2;border-radius:19px;box-shadow:0 22px 45px #0005,inset 0 1px #fff;overflow:hidden} body.technology .import-device-card img{display:block;width:100%;height:auto;border-radius:9px} body.technology .import-transfer p{font-size:18px;line-height:1.7;color:#b0a7bc;margin:25px 0 0} body.technology .import-direction{display:flex;flex-direction:column;align-items:center;gap:12px;color:#c2a1ed;margin-top:20px} body.technology .import-direction span{font-size:17px;font-weight:500;letter-spacing:.08em} body.technology .import-direction svg{display:block;width:70px;height:24px;overflow:visible;filter:drop-shadow(0 0 8px #a65aff66)} body.technology .import-direction path{fill:none;stroke:#b98dec;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round} body.technology .import-destination{min-width:0} body.technology .import-product{width:100%} body.technology .import-product:after{bottom:-12px} @media(max-width:1100px) and (min-width:761px){body.technology .import-transfer{grid-template-columns:minmax(200px,.8fr) 46px minmax(0,1.8fr);gap:18px}body.technology .import-direction svg{width:46px}body.technology .import-source-heading h3{font-size:21px}body.technology .import-transfer p{font-size:16px}} @media(max-width:760px){ body.technology .import-heading{margin-bottom:42px} body.technology .import-heading h2{font-size:36px} body.technology .import-heading h2 span{font-size:29px} body.technology .import-transfer{display:flex;flex-direction:column;align-items:stretch;gap:24px} body.technology .import-source{max-width:330px;width:100%;margin:auto} body.technology .import-source-heading{margin-bottom:20px} body.technology .import-source-heading h3{font-size:22px} body.technology .import-transfer p{font-size:17px;margin-top:20px} body.technology .import-direction{height:60px;margin:0;position:relative;justify-content:center} body.technology .import-direction svg{transform:rotate(90deg);width:52px} body.technology .import-direction span{position:absolute;left:calc(50% + 24px);top:18px;font-size:16px} body.technology .import-destination{padding-top:8px} } /* Varied Figma photo assets retain the digital-frame playback information. */ body.technology .digital-photo{position:relative;width:100%;height:100%;overflow:hidden;color:#fff;container-type:inline-size;background:#18171d} body.technology .digital-photo>img{display:block;width:100%;height:100%;object-fit:cover} body.technology .digital-photo:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,#0002,transparent 25%,transparent 65%,#0006)} body.technology .photo-ui-clock{position:absolute;right:3%;top:4.5%;z-index:1;display:flex;flex-direction:column;align-items:flex-end;text-shadow:0 1px 6px #0005;line-height:1.1} body.technology .photo-ui-clock strong{font-family:Arial,sans-serif;font-size:clamp(17px,4.7cqw,36px);font-weight:700;letter-spacing:.01em;color:white} body.technology .photo-ui-clock>span{font-size:clamp(9px,1.9cqw,15px);line-height:1.6;color:white} body.technology .photo-ui-sender{position:absolute;bottom:4%;left:3%;z-index:1;display:flex;flex-direction:column;gap:3px;text-shadow:0 1px 4px #0007;font-family:Arial,sans-serif} body.technology .photo-ui-sender>span{font-size:clamp(10px,1.85cqw,15px);line-height:1.2;color:white} body.technology .photo-ui-sender small{font-size:clamp(8px,1.2cqw,10px);line-height:1.2;color:#ffffffd9} body.technology .album-story .feature-narrative{margin-top:64px} @media(max-width:760px){body.technology .album-story .feature-narrative{margin-top:38px}} /* The selected greeting also selects its surrounding lifestyle scene. */ body.technology .greetings-section{position:relative;isolation:isolate;overflow:hidden;background:#16111b;--scene-accent:#e2b5cd} body.technology .greetings-section[data-scene="valentine"]{--scene-accent:#e3a7bb} body.technology .greetings-section[data-scene="birthday"]{--scene-accent:#e7c99e} body.technology .greeting-scenes{position:absolute;inset:0 0 auto;height:100%;z-index:-2;pointer-events:none} body.technology .greeting-scenes:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,transparent 65%,#16111b 100%)} body.technology .greeting-scene{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:0;transition:opacity .65s ease} body.technology .greeting-scene.is-active{opacity:1} body.technology .greetings-section:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(11,8,16,.91) 0%,rgba(11,8,16,.76) 35%,rgba(11,8,16,.23) 70%,rgba(11,8,16,.08) 100%),linear-gradient(0deg,rgba(11,8,16,.68),transparent 40%,rgba(11,8,16,.08))} body.technology .greetings-section>.section{padding-top:56px;padding-bottom:56px} body.technology .greetings-section .greeting-panel{min-height:520px;align-items:center;gap:56px} body.technology .greetings-section .greeting-controls{position:relative;z-index:2} body.technology .greetings-section .greeting-title{color:#fff;text-shadow:0 2px 18px #0003} body.technology .greetings-section .section-label{color:var(--scene-accent)!important} body.technology .greetings-section .greeting-controls>p.greeting-lead{color:#faf5fa} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){color:#ded4df} body.technology .greetings-section .greeting-product{align-self:end;justify-self:start;width:min(560px,100%);margin-bottom:4px;filter:drop-shadow(0 25px 32px #0006)} body.technology .greetings-section .greeting-product:hover{transform:none} body.technology .template-options>button{background:#1d1424d9;border-color:#ffffff40;backdrop-filter:blur(8px);transition:border-color .2s,background .2s} body.technology .template-options>button.active{background:#302037ef;border-color:var(--scene-accent);box-shadow:0 0 0 1px var(--scene-accent)} body.technology .template-options span{color:#ddd3df} body.technology .template-options .active span{color:#fff} @media(max-width:1100px){body.technology .greetings-section .greeting-panel{min-height:520px;gap:36px}body.technology .greeting-scene{object-position:60% center}} @media(max-width:760px){ body.technology .greetings-section>.section{padding:68px 26px 62px} body.technology .greetings-section .greeting-panel{min-height:0;gap:22px} body.technology .greeting-scenes{height:100%} body.technology .greeting-scenes:after{display:none} body.technology .greeting-scene{object-position:72% center} body.technology .greetings-section:before{background:linear-gradient(180deg,#0b0812eb 0%,#0b0812c4 35%,#0b081235 65%,#0b081294 100%)} body.technology .greetings-section .greeting-product{margin:90px 0 0;align-self:auto} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){color:#e4dce7} } @media(prefers-reduced-motion:reduce){body.technology .greeting-scene{transition:none}} /* Photo import uses the Figma photo asset, without video transport controls. */ body.technology .import-photo-screen{overflow:hidden;container-type:inline-size} .import-photo-screen>img{width:100%;height:100%;object-fit:cover} .import-back,.import-filename,.import-photo-actions{position:absolute;background:#fffffff5;color:#151515} .import-back{top:4%;left:2.5%;width:3.5cqw;height:3.5cqw;border-radius:50%;text-align:center;line-height:3cqw;font-size:3cqw} .import-filename{top:3.3%;left:50%;transform:translateX(-50%);border-radius:30px;padding:.7cqw 2cqw;text-align:center;font-size:1.1cqw;font-weight:600;line-height:1.3} .import-filename small{display:block;font-size:.95cqw;color:#777;font-weight:400;margin-top:.25cqw} .import-photo-actions{bottom:5.5%;left:50%;transform:translateX(-50%);display:flex;gap:3.3cqw;border-radius:60px;padding:1.1cqw 2.8cqw;white-space:nowrap} .import-photo-actions>span{display:flex;align-items:center;flex-direction:column;gap:.5cqw;font-size:1.15cqw;line-height:1.3} .import-photo-actions svg{width:1.7cqw;height:1.7cqw;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} body.technology .import-transfer{grid-template-columns:minmax(230px,.85fr) 112px minmax(0,2fr);gap:22px} body.technology .import-direction{gap:18px} .transfer-stream{position:relative;width:112px;height:60px;border-radius:50%;background:radial-gradient(ellipse,#9c5bff30,transparent 72%)} .transfer-stream:before,.transfer-stream:after{content:'';position:absolute;inset:14px 0;border-top:1px solid #a976fa30;border-bottom:1px solid #a976fa30;border-radius:50%;transform:rotate(-8deg)} .transfer-stream:after{inset:22px 0;transform:rotate(8deg)} .transfer-stream i{position:absolute;left:0;top:27px;width:20px;height:3px;border-radius:100%;background:linear-gradient(90deg,transparent,#d7bdff);box-shadow:4px 0 10px #a66cff;animation:import-flow 2.4s linear infinite;opacity:0} .transfer-stream i:nth-child(2){top:15px;animation-delay:.6s;width:12px} .transfer-stream i:nth-child(3){top:41px;animation-delay:1.2s;width:14px} .transfer-stream i:nth-child(4){animation-delay:1.8s;width:24px} .transfer-stream b{position:absolute;right:-1px;top:24px;width:9px;height:9px;border-radius:50%;background:#e5d6ff;box-shadow:0 0 14px 4px #a66cff77;animation:import-receive 2.4s ease-in-out infinite} @keyframes import-flow{0%{transform:translateX(0);opacity:0}20%,75%{opacity:1}100%{transform:translateX(96px);opacity:0}} @keyframes import-receive{0%,100%{opacity:.45;transform:scale(.7)}50%{opacity:1;transform:scale(1.15)}} @media(max-width:1100px) and (min-width:761px){body.technology .import-transfer{grid-template-columns:minmax(190px,.85fr) 80px minmax(0,1.8fr);gap:16px}.transfer-stream{transform:scale(.72)}} @media(max-width:760px){body.technology .import-transfer{display:flex}body.technology .import-direction{height:100px}.transfer-stream{transform:rotate(90deg)}body.technology .import-direction span{top:38px;left:calc(50% + 35px)}} @media(prefers-reduced-motion:reduce){.transfer-stream i,.transfer-stream b{animation:none}.transfer-stream i{opacity:.7}.transfer-stream i:nth-child(2){left:30px}.transfer-stream i:nth-child(3){left:60px}.transfer-stream i:nth-child(4){left:85px}} /* Scene photographs now include the frame standing on the actual tabletop. */ body.technology .greetings-section .greeting-product{display:none} body.technology .greeting-scenes{left:auto;right:0;width:100%;max-width:1440px} body.technology .greeting-scene{object-position:right 72%} body.technology .greeting-scenes:after{background:linear-gradient(90deg,#16111b 0%,transparent 23%),linear-gradient(0deg,#16111b55,transparent 15%)} body.technology .greetings-section:before{background:linear-gradient(90deg,#16111bf5 0%,#16111bd9 25%,#16111b70 42%,transparent 62%)} body.technology .greetings-section .greeting-panel{grid-template-columns:minmax(310px,.8fr) minmax(0,1.5fr)} @media(max-width:760px){ body.technology .greetings-section>.section{padding:44px 24px 0} body.technology .greetings-section .greeting-panel{display:block;min-height:0} body.technology .greetings-section .greeting-controls{display:block} body.technology .greetings-section .greeting-title{margin:0 0 16px} body.technology .greetings-section .greeting-controls>p.greeting-lead{margin:0 0 16px} body.technology .greetings-section .greeting-controls>p:not(.section-label):not(.greeting-lead){margin:0} body.technology .greetings-section .template-options{margin:26px auto 0} body.technology .greeting-scenes{position:relative;height:auto;aspect-ratio:1.35;max-width:none;order:2} body.technology .greetings-section{display:flex;flex-direction:column} body.technology .greeting-scene{object-fit:cover;object-position:right center} body.technology .greeting-scenes:after{display:block;background:linear-gradient(180deg,#16111b,transparent 16%)} body.technology .greetings-section:before{display:none} } /* Alternate image and copy between sections, preserving the greeting scenes. */ body.technology .launch-visual.material-lineup:after,body.technology .product-launch:after{display:none} @media(min-width:761px){ body.technology .album-story>.section{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(300px,1fr);gap:70px;align-items:center;padding-top:110px;padding-bottom:110px} body.technology .album-editorial-copy{grid-column:2;grid-row:1} body.technology .album-story .album-product-large{grid-column:1;grid-row:1;width:100%;margin:0} body.technology .album-story .editorial-heading{display:block;text-align:left;margin:0 0 30px;max-width:none} body.technology .album-story .editorial-heading .section-label{text-align:left;margin-bottom:24px} body.technology .album-story .editorial-heading h2{font-size:clamp(36px,3.2vw,46px);line-height:1.25;letter-spacing:-.035em;text-align:left;white-space:normal;margin:0} body.technology .album-story .editorial-heading h2 span{display:block;font-size:.78em;margin-top:10px} body.technology .album-story .feature-narrative{text-align:left;font-size:18px;line-height:1.85;margin:0;max-width:none} body.technology .sleep-background{transform:scaleX(-1)} body.technology .sleep-scene:after{background:linear-gradient(270deg,#131115f2 0%,#131115b8 31%,#13111520 60%,transparent 78%)} body.technology .sleep-scene .daily-story-inner{display:flex;justify-content:flex-end;min-height:650px;padding-top:74px;padding-bottom:74px} body.technology .sleep-copy{width:43%;max-width:480px} } @media(min-width:761px) and (max-width:1100px){ body.technology .album-story>.section{gap:36px;grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr)} body.technology .album-story .feature-narrative{font-size:17px} body.technology .sleep-copy{width:46%} } @media(max-width:760px){ body.technology .album-story .feature-narrative{margin:0 auto 32px;text-align:center} body.technology .album-story .editorial-heading{margin-bottom:24px} } /* 待定稿标记:上线前必须全部替换(website-publish.sh 会拦) */ .todo{background:#fff4ce;color:#5c4400;padding:0 4px;border-radius:4px} .footer-links a{color:inherit;margin-left:16px}.footer-links a:first-child{margin-left:0} .contact-email a{color:inherit} /* 英文模板名比中文长:放开换行、略加宽,避免 "Valentine's Da" 截断 */ body.technology .greetings-section .template-options{max-width:360px} body.technology .template-options span{white-space:normal;line-height:1.25;font-size:12px}