/* App-matched refinement. Ornamental layers do not clip text or hit targets. */
:root{
 --paper:#f8eee7;--surface:#fff9f1;--surface-soft:#f0dcd4;--glass-fill:#fff9f1f5;
 --ribbon-ink:#603844;--title-ribbon:url('../letter/light/ribbon.png');--tab-ribbon:url('../letter/light/tab-selected.png');
 --arch:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1000 100' preserveAspectRatio='none'%3E%3Cpath d='M28 7 Q500 -7 972 7 Q998 8 999 30 L999 68 Q998 91 972 94 Q500 106 28 94 Q2 91 1 68 L1 30 Q2 8 28 7Z' fill='black'/%3E%3C/svg%3E");
}
:root[data-theme=dark]{--paper:#19352b;--surface:#294639;--surface-soft:#284c3d;--glass-fill:#254135f7;--ribbon-ink:#fffbed;--title-ribbon:url('../letter/dark/ribbon.png');--tab-ribbon:url('../letter/dark/tab-selected.png')}
body{background:radial-gradient(ellipse at 95% 0,var(--surface-soft),transparent 48%),var(--paper)}
body::before{content:"";display:block;position:fixed;inset:0;z-index:-1;pointer-events:none;background:url('../ornaments/paper.png') center/520px;opacity:.045;mix-blend-mode:multiply}
html{scroll-padding-top:100px}
.site-header{height:72px;top:10px;padding:10px 24px;gap:20px;background:transparent;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;isolation:isolate}
.site-header::before,.mobile-dock::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(160deg,var(--surface),var(--surface-soft));mask:var(--arch) center/100% 100% no-repeat;box-shadow:inset 0 -3px var(--line);pointer-events:none}
.site-header::after,.mobile-dock::after{content:"";position:absolute;inset:6px 16px;border-block:1px dashed var(--line);border-radius:50% / 10%;pointer-events:none;z-index:-1}
.brand{gap:10px;min-width:0}.brand img{width:42px;height:42px;filter:drop-shadow(0 2px 3px #41212920)}
.brand span{font-size:18px;line-height:1.35}.brand small{font-size:11px;margin-top:3px}
.site-header nav{gap:24px}.site-header nav a{font-size:13px;min-height:44px;display:flex;align-items:center}
.header-cta{border:0;border-radius:16px 16px 19px 7px;padding:0 18px;min-height:44px;background:var(--button);color:var(--button-text);box-shadow:inset 0 0 0 3px var(--surface),0 0 0 1px var(--line);clip-path:none}
.theme-toggle{flex-shrink:0;width:44px;height:44px;border:1px dashed var(--line);background:var(--surface);border-radius:15px 19px 13px 18px;color:var(--ink);font-size:22px;margin-left:0}
.hero{grid-template-columns:1.1fr 1fr;gap:28px 64px;padding:68px 28px 24px}
.hero h1{font-size:clamp(40px,4.8vw,64px)}.hero-lead{line-height:1.85;margin-bottom:28px}
.download-button{border-radius:16px;padding-inline:26px;height:52px;min-height:52px}
.download-button::before{inset:-5px;border-radius:19px}.download-button::after{inset:2px;border:1px dashed #fff5;border-radius:14px}.download-button:hover::after{left:2px}
.build-meta{gap:10px}.release-note{line-height:1.8}.mobile-quicklinks{gap:22px;font-size:13px;margin-top:12px}
.hero-visual{padding:20px 36px 38px;border-radius:0;height:auto;max-height:none;overflow:visible}
.hero-visual::before{inset:14% 0 0;opacity:.85;border-radius:0}.envelope-back{inset:20% 20px 8%;border-radius:24px 24px 30px 30px;transform:rotate(-7deg)}.envelope-back::after{border-radius:0 0 30px 30px}
.hero-phone,.gallery-phone{isolation:isolate;width:254px;border:0;border-radius:14px;background:none;box-shadow:none;padding:8px 8px 16px;filter:drop-shadow(0 10px 14px #211b1922)}
.hero-phone::after,.gallery-phone::after{inset:-5px;z-index:-1;background:var(--letter-fill);border:0;border-radius:20px;mask:var(--stamp-mask);-webkit-mask:var(--stamp-mask);pointer-events:none}
.hero-phone img,.gallery-phone img{border-radius:8px}.visual-label{bottom:8px;font-size:11px}
.letter-note{min-height:98px;padding:20px 125px;margin:12px 30px 10px;background:var(--surface);border:0;border-radius:38% 14px 38% 14px / 12px 16px 12px 16px;box-shadow:0 5px 10px #41212908;transform:none}
.letter-note p{letter-spacing:.06em;color:var(--ink)}.note-botanical{width:140px;height:155px;left:-22px;bottom:-15px}.wax-seal{right:25px;bottom:10px;width:65px;height:65px}.wax-seal img{width:36px;height:36px}
.trust-strip{padding:18px 10px;margin-bottom:50px;gap:22px}.trust-strip strong{font-size:14px}.trust-strip span{font-size:12px}
.features{padding-bottom:68px}.features .section-heading{margin-bottom:22px}
.ribbon-title,.section-heading .ribbon-title,.screens .ribbon-title{min-height:112px;width:min(460px,100%);padding:24px 44px 32px 70px;font-size:26px;background-image:var(--title-ribbon);color:var(--ribbon-ink)}
.stamp-grid{gap:20px}.feature-stamp{min-height:235px;padding:49px 24px 27px;filter:drop-shadow(0 5px 7px #4b273211)}
.feature-stamp::before{border-radius:24px;background:linear-gradient(135deg,#ffffff48,transparent),var(--letter-fill)}.feature-stamp::after{content:none}
.feature-stamp h3{font-size:22px;margin:12px 0 8px}.feature-stamp p{font-size:13px;line-height:1.9;padding:0}.feature-stamp>img{position:static;width:62px;height:62px}
.stamp-tag{right:16px;top:14px;padding:5px 14px 7px;border-radius:4px 13px 5px 16px;border:0}
.screens{padding:0 28px 32px;isolation:isolate;background:transparent;border:0;border-radius:0;box-shadow:none}
.screens::before{content:"";position:absolute;inset:30px 0 0;z-index:-1;border-radius:32px;background:var(--surface);mask:var(--stamp-mask);-webkit-mask:var(--stamp-mask)}
.screens .ribbon-title{margin:0 auto 12px}.screenshot-source{max-width:610px;font-size:12px!important;margin:8px auto 16px;line-height:1.8!important}
.appearance-switch{gap:8px;flex-wrap:wrap}.appearance-switch button{padding:0 15px;border:1px dashed var(--line);border-radius:13px 17px 12px 16px;color:var(--ink)}.appearance-switch button[aria-pressed=true]{background:var(--surface-soft);box-shadow:none;border-style:solid}
.screen-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;width:min(730px,100%);margin:22px 0 12px}
.screen-tab,.screen-tab.is-active{flex:1 1 85px;max-width:135px;border:0;border-radius:0;padding:12px 14px 17px 24px;min-height:57px;font-size:14px;background:var(--title-ribbon) center/100% 100% no-repeat;color:var(--ribbon-ink);box-shadow:none;position:relative}
.screen-tab.is-active{background-image:var(--tab-ribbon);font-weight:700;color:#603844;filter:drop-shadow(0 3px 3px #392d2320)}
:root[data-theme=dark] .screen-tab.is-active{color:#f2eedb}
.screen-tab:not(.is-active):hover{background:var(--title-ribbon) center/100% 100% no-repeat;filter:brightness(.97)}
.screen-tab.is-active::after{content:"";position:absolute;bottom:8px;left:46%;width:18px;height:2px;background:currentColor;border-radius:2px}
.screen-caption{padding:8px 14px;margin-bottom:28px;gap:6px}.screen-caption strong{font-size:17px}.screen-caption span{font-size:13px;line-height:1.8}
.gallery-stage{grid-template-columns:minmax(0,310px) minmax(0,220px);gap:28px 54px;padding:4px 14px 0;border-radius:0}.gallery-phone{width:290px;justify-self:center}
.album-note{min-height:220px;padding:28px 24px 85px;border-radius:24px 12px 40px 13px;box-shadow:0 5px 12px #211b1910;transform:rotate(3deg);border:0}.album-note>span:first-child{font-size:20px;letter-spacing:.05em}.album-note .botanical{width:125px;height:125px;right:-12px;bottom:-12px}
.zoom-trigger{padding:9px 24px;border:1px dashed var(--line);border-radius:14px 18px 13px 17px;background:var(--surface-soft);color:var(--ink)}
.journey{padding-bottom:62px}.journey .section-heading{margin-bottom:24px}.journey-track article{padding:26px;background:var(--surface);border:0;border-radius:25px 13px 25px 13px}.journey-track h3{font-size:22px}
.guide-intro h2{font-size:30px}.guide-card,.faq-list details{background:var(--surface);border:1px solid var(--line);border-radius:22px 12px 22px 12px;box-shadow:0 4px 7px #3d243006}
.guide-card{padding:22px}.guide-card[open]{background:var(--surface);border-color:var(--accent)}.guide-card summary{font-size:16px}.guide-content,.faq-list p{font-size:14px;line-height:1.9}
.step-number{border-radius:12px 16px 11px 15px}.guide-tip{border-radius:14px;background:var(--surface-soft);padding:14px}
.faq-list details{padding-inline:22px}.faq-list summary{font-size:15px;line-height:1.6;padding-block:16px}
.safety-panel{border-radius:28px 14px 28px 14px}.final-cta{background:var(--surface);border:1px dashed var(--line);border-radius:30px 16px 30px 16px}
.ghost-button,.dialog-primary{border-radius:14px 19px 13px 18px}dialog{border-radius:26px 15px 26px 15px;background:var(--surface);padding:30px}.dialog-close,[data-close-image]{border-radius:13px}.image-dialog{padding:18px}
.mobile-dock{background:none;border:0;border-radius:0;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}
.mobile-dock::before{background:linear-gradient(165deg,var(--letter-fill),var(--envelope-fold));clip-path:none;height:auto;opacity:1;border:0}.mobile-dock::after{inset:7px 16px;border-color:#96796150;border-radius:50% / 14%}
.mobile-dock .dock-icon{border-radius:11px}.mobile-dock>div{min-width:0}.mobile-dock span{font-size:11px}
.mobile-dock a{background:var(--button);border:1px dashed var(--line);border-radius:16px 20px 13px 18px;padding-inline:18px;font-size:13px;box-shadow:none}.mobile-dock a::before{content:none}
.album-thumbnail{border-radius:15px 10px 18px 9px}.album-thumbnail img{border-radius:6px}.pswp__button--arrow{border-radius:14px 18px 13px 17px}
@media(min-width:761px) and (max-width:1100px){.hero{padding-inline:8px;gap:24px}.site-header{padding-inline:20px;gap:12px}.site-header nav{gap:14px}.brand small{display:none}}
@media(max-width:760px){
 .site-header{height:68px;top:6px;width:calc(100% - 20px);padding:10px 14px;gap:8px;border-radius:0}
 .brand img{width:36px;height:36px}.brand{gap:8px;flex:1}.brand span{font-size:16px}.brand small{font-size:10px;margin-top:2px}
 .header-cta{padding-inline:14px;min-height:44px;font-size:12px}.theme-toggle{margin-left:0;font-size:21px}
 .hero{grid-template-columns:1fr;gap:20px;padding:36px 8px 20px}.hero-copy{width:100%;text-align:center}.hero .eyebrow{font-size:11px;margin-bottom:14px}
 .hero h1{font-size:clamp(32px,9vw,42px);line-height:1.3;letter-spacing:.02em;margin-bottom:14px}.hero-lead{font-size:14px;margin:0 auto 22px;max-width:270px}
 .hero-actions{justify-content:center;gap:16px}.download-button{min-width:190px;height:50px;min-height:50px;font-size:14px;padding-inline:24px;gap:10px}
 .build-meta{justify-content:center;font-size:11px;gap:10px}.release-note{text-align:center;font-size:11px;margin:8px auto 0;max-width:275px}
 .mobile-quicklinks{gap:24px;font-size:12px;margin-top:4px;justify-content:center}.hero-visual{max-width:360px;justify-self:center;padding:12px 26px 28px;margin:0}
 .hero-phone{width:min(246px,100%);padding:7px 7px 13px;border:0}.hero-phone::after{inset:-4px}.hero-visual::before{inset:18% 0 0}.envelope-back{inset:20% 14px 7%;transform:rotate(-6deg)}.visual-label{font-size:10px;bottom:0}
 .letter-note{min-height:84px;margin:10px 4px 0;padding:14px 63px 14px 65px;border-radius:30% 12px 30% 12px / 10px 14px 10px 14px}.letter-note p{font-size:14px;line-height:1.7;letter-spacing:.03em}.note-botanical{width:94px;height:108px;left:-12px;bottom:-9px}.wax-seal{width:44px;height:44px;right:10px;bottom:17px;border-width:3px}.wax-seal img{width:25px;height:25px}
 .trust-strip{gap:16px;padding:14px 4px;margin-bottom:30px}.trust-strip strong{font-size:12px}.trust-strip span{font-size:11px;line-height:1.7}
 .features{padding-bottom:38px}.ribbon-title,.section-heading .ribbon-title,.screens .ribbon-title{min-height:90px;padding:22px 28px 28px 51px;font-size:clamp(18px,5.2vw,22px);width:100%}.features .section-heading{margin-bottom:12px}
 .stamp-grid{gap:12px}.feature-stamp{min-height:215px;padding:41px 19px 24px}.feature-stamp h3{font-size:18px;margin:9px 0 7px}.feature-stamp p{font-size:12px;line-height:1.85;padding:0}.feature-stamp>img{width:48px;height:48px}.stamp-tag{font-size:10px;right:13px;top:13px;padding:4px 11px 6px}
 .screens{padding:0 16px 25px;margin-bottom:40px}.screens .ribbon-title{width:calc(100% + 16px);margin-left:-8px}.screenshot-source{font-size:11px!important;margin:2px auto 14px}.appearance-switch{gap:5px;flex-wrap:nowrap}.appearance-switch button{font-size:11px;padding-inline:10px}
 .screen-tabs{gap:6px;margin-block:16px 10px}.screen-tab,.screen-tab.is-active{flex:0 0 calc(33.333% - 4px);max-width:none;min-height:47px;font-size:12px;padding:9px 9px 13px 19px}.screen-tab.is-active::after{bottom:6px;width:13px}
 .screen-caption{padding:4px;margin-bottom:22px}.screen-caption strong{font-size:15px}.screen-caption span{font-size:12px;line-height:1.8}
 .gallery-stage{grid-template-columns:minmax(0,1fr);padding:0;gap:20px}.gallery-phone{width:min(290px,100%);padding:7px 7px 13px;border:0}.gallery-phone::after{inset:-3px}
 .album-note{padding:16px 80px 16px 22px;min-height:76px;width:min(290px,100%);justify-self:center;transform:none;border-radius:20px 10px 25px 12px;order:2}.album-note>span:first-child{font-size:15px;line-height:1.7}.album-note .botanical{width:82px;height:94px;right:-4px;bottom:-5px}
 .zoom-trigger{font-size:12px;padding:9px 22px;order:1}.album-rail{order:3}
 .journey{padding-bottom:38px}.journey .section-heading h2{font-size:27px}.journey-track{gap:12px}.journey-track article{padding:20px 20px 20px 42px}.journey-track article::before{left:19px;top:26px}.journey-track h3{font-size:19px;margin:7px 0}.journey-track p{font-size:13px}
 .guide,.faq{padding-bottom:40px}.guide-intro h2,.faq .section-heading h2{font-size:27px}.guide-card{padding:18px}.guide-card summary{font-size:15px}.faq-list details{padding-inline:18px}.faq-list summary{font-size:14px}
 .mobile-dock{gap:10px;padding:14px 18px;min-height:74px}.mobile-dock a{padding-inline:18px}footer{padding-bottom:calc(118px + env(safe-area-inset-bottom))}
}
@media(max-width:350px){.brand span{font-size:14px}.brand small{display:none}.brand img{width:32px;height:32px}.site-header{padding-inline:13px}.header-cta{padding-inline:12px}.feature-stamp{padding-inline:17px}.feature-stamp h3{font-size:17px}.feature-stamp p{font-size:11px}.ribbon-title,.section-heading .ribbon-title,.screens .ribbon-title{padding-left:42px;padding-right:24px;min-height:80px}.mobile-dock{gap:8px;padding-inline:15px}.mobile-dock a{padding-inline:14px;font-size:12px}}
@media(prefers-reduced-transparency:reduce){.site-header::before,.screens::before{background:var(--surface)}}
