/* One OFL-licensed family throughout the interface; hierarchy uses size/weight. */
@font-face{font-family:"Lele UI";src:url("/assets/fonts/lele-ui.woff2") format("woff2");font-style:normal;font-weight:400 700;font-display:swap}
:root{--paper:#f8f6f3;--white:#fff;--ink:#2d2926;--muted:#776e65;--soft:#efebe6;--line:#e5dfd8;--accent:#70584b;--danger:#a03f45;--sans:"Lele UI",sans-serif;--editorial:var(--sans);--display:var(--sans);--lettering:var(--sans);--motion:cubic-bezier(.2,.75,.2,1);font-family:var(--sans);background:var(--paper);color:var(--ink)}
html{scroll-padding-top:24px;scroll-padding-bottom:112px}
body{max-width:480px;background:var(--paper);letter-spacing:.1px;-webkit-font-smoothing:antialiased}
.shell{width:calc(100% - 40px)}
button,input,textarea,select,summary{font-family:var(--sans)}
button,a,summary{touch-action:manipulation}button:disabled{cursor:default}
button:focus-visible,a:focus-visible,summary:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
button,a,input,textarea,summary{scroll-margin-block:24px 120px}
button,a{transition:color 160ms,background-color 160ms,transform 160ms var(--motion)}
button:active:not(:disabled),.button:active{transform:translateY(1px)}
.skip-link{position:fixed;top:8px;left:16px;z-index:100;background:var(--ink);color:#fff;padding:12px 16px;border-radius:8px;transform:translateY(-160%)}.skip-link:focus{transform:none}
.site-header{min-height:70px;gap:20px;padding:7px 0;border:0}
.brand{flex-direction:column;gap:1px;align-items:flex-start;min-height:48px}.brand-wordmark{width:151px;height:auto;filter:none}
.footer-brand img{width:125px;height:auto;object-fit:contain;filter:none}
.brand-caption{padding-left:4px;font:10px/1.7 var(--sans);letter-spacing:1.3px;color:#6f665e;white-space:nowrap}
.header-library{display:flex;align-items:center;gap:6px;min-height:44px;font-size:13px;color:#4c433c;padding:5px 0}.header-library svg{width:17px;height:17px;stroke-width:1.5}
.discover-intro{position:relative;padding:10px 0 14px}
.collection-mast{display:flex;align-items:center;gap:9px;margin:0 0 15px;color:#6f665e;font:9px/1.5 var(--sans);letter-spacing:2.1px}.collection-mast:before{content:"";width:21px;height:1px;background:#8c7d70}
.discover-intro h1{display:block;height:auto;min-height:0;white-space:normal;font-family:var(--editorial);font-size:28px;font-weight:500;font-style:normal;line-height:1.5;letter-spacing:-.8px;margin:0;text-wrap:balance}
.discover-intro h1>span{display:block;font:inherit}.discover-intro h1>span:last-child{color:#6f665e}
.intro-note{font:14px/1.8 var(--sans);color:#6f665e;letter-spacing:0;margin:7px 0 0}
.filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px;padding:5px;margin:0 0 12px;border:0;border-radius:14px;background:#efebe6}.filters:after,.filter:after{display:none}
.filter{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:10px 8px;border:0;border-radius:10px;background:transparent;color:#6f665e;font-size:16px;font-weight:500;letter-spacing:1px;line-height:1.5}
.filter.active{background:var(--white);color:#352f2a;font-weight:600;box-shadow:0 2px 5px #3a302710}.filter.active:before{content:"";width:4px;height:4px;border-radius:50%;background:#8c7d70}
.photo-types{display:block;margin:0 0 14px}.photo-type-options{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:7px;width:100%}
.photo-type{min-width:0;min-height:44px;padding:10px 5px;border:1px solid transparent;border-radius:10px;background:transparent;color:#6f665e;font-size:14px;letter-spacing:.5px;line-height:1.5;white-space:nowrap;box-shadow:none}
#main .photo-type.selected{border-color:#e5dfd8;color:#4c433c;background:#ede7e0;box-shadow:none;font-weight:600}.photo-type:before,.photo-type.selected:before{display:none}
.section-top{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:0;margin:0 0 14px;min-height:20px;border:0}
.section-note,.collection-help{font-size:12px;line-height:1.6;color:#6f665e;letter-spacing:.2px;font-variant-numeric:tabular-nums}.collection-help{font-size:12px;color:#6f665e}
.styles-section{padding-bottom:34px}.template-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:29px 14px}
.template-card{min-width:0;display:flex;flex-direction:column;border:0;background:transparent;animation:gallery-reveal 280ms var(--motion) both}.template-card:nth-child(2n){animation-delay:35ms}
.template-image{order:0;width:100%;aspect-ratio:9/16;padding:0;border:0;border-radius:9px;background:transparent;box-shadow:none;overflow:hidden}
.template-image img{display:block;width:100%;height:100%;object-fit:cover;object-position:50% 38%;transition:transform 320ms var(--motion)}.template-image.is-magazine img{object-fit:contain;object-position:center;background:transparent}
.template-image .preview-hint{display:grid;place-items:center;right:8px;bottom:8px;min-width:28px;width:28px;height:28px;padding:0;border-radius:50%;background:#ffffffe8;color:#4c433c;font-size:16px;box-shadow:none;opacity:.93}.template-image.is-magazine .preview-hint{display:none}
.template-heading{order:1;display:flex;align-items:center;gap:5px;min-height:0;padding:13px 0 0}
.template-heading h3{display:block;overflow:visible;height:auto;margin:0;font-family:var(--sans);font-size:19px;font-weight:500;line-height:1.55;letter-spacing:.25px;text-wrap:balance}.template-heading h3.display-lettering{font-family:var(--editorial)}.template-number{display:none}
.template-detail{order:2;padding:6px 0 2px}.template-story{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:47px;height:47px;font:13px/1.8 var(--sans);color:#6f665e;letter-spacing:.1px;margin:0}
.template-footer{order:3;margin-top:auto;padding-top:9px}
#main .template-cta{display:flex;align-items:center;justify-content:space-between;width:100%;min-height:46px;padding:10px 12px;border:0;border-radius:9px;background:#ede7e0;color:#352f2a;font-size:14px;font-weight:600;letter-spacing:0;box-shadow:none}
.template-cta .cta-arrow{display:grid;place-items:center;width:23px;height:23px;flex-shrink:0;border:0;border-radius:0;font-size:18px;color:#70584b;background:transparent;transition:transform 180ms var(--motion)}.template-cta:after,.button-dark:after{display:none}
.template-grid[data-layout="single"] .template-card{grid-column:1 / -1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto 1fr auto;column-gap:14px;row-gap:0;align-items:start}
.template-grid[data-layout="single"] .template-image{grid-column:1;grid-row:1/4;aspect-ratio:9/16;align-self:start}
.template-grid[data-layout="single"] .template-heading{grid-column:2;grid-row:1;padding:8px 0 0}.template-grid[data-layout="single"] .template-detail{grid-column:2;grid-row:2;padding-top:10px}
.template-grid[data-layout="single"] .template-story{display:block;height:auto;min-height:0;overflow:visible;line-height:1.9}.template-grid[data-layout="single"] .template-footer{grid-column:2;grid-row:3;align-self:end;width:100%}
.template-grid[data-layout="single"] .template-framing{position:static;display:block;width:auto;height:auto;clip:auto;overflow:visible;white-space:normal;font:11px/1.7 var(--sans);color:#8c7d70;margin-top:15px}
.how-it-works{gap:12px;padding:24px 18px;margin:0 0 22px;border:0;border-radius:16px;background:#efebe6}.how-step>span{font:500 22px/1.2 var(--sans);color:#8c7d70;margin-bottom:15px}.how-step h3{font-size:14px;font-weight:600;margin:0 0 6px;color:#4c433c}.how-step p{font-size:12px;line-height:1.8;color:#8c7d70;margin:0}
.privacy-bar{gap:8px;font-size:13px;line-height:1.9;color:#8c7d70;margin-bottom:20px;padding:0 3px}.privacy-bar svg{width:15px;height:15px}
.site-footer{gap:7px 12px;border:0;padding:22px 0 118px;font-size:12px;color:#8c7d70}.footer-brand{font-family:var(--editorial);font-size:16px;font-weight:500;color:#70584b;letter-spacing:1px}.site-footer p{font-size:12px;margin-left:auto}#environment-label{min-height:44px;font-size:12px;color:#8c7d70;text-decoration:none}
.mobile-nav{width:calc(100% - 32px);max-width:448px;left:50%;bottom:calc(12px + env(safe-area-inset-bottom));padding:5px;gap:5px;border:1px solid #e5dfd8;border-radius:20px;background:#fffffff5;box-shadow:0 7px 28px #3a302712;backdrop-filter:blur(14px)}
.mobile-nav a{min-height:53px;gap:4px;padding:7px 3px;border-radius:15px;color:#6f665e;font-size:12px;font-weight:500;line-height:1.4}.mobile-nav a:before{display:none}.mobile-nav a.active{background:#ede7e0;color:#352f2a;font-weight:600}.mobile-nav svg{width:18px;height:18px;stroke-width:1.45}.mobile-nav a.active svg{stroke:#352f2a;fill:none}
.button{min-height:48px;border-radius:12px;font-size:14px;font-weight:500;letter-spacing:.3px}.button-dark{background:#352f2a;color:#fff;border:0;box-shadow:0 4px 12px #3a30270c}.button-light{background:#efebe6;color:#4c433c;border:0}.button-ghost{border-color:#e5dfd8;color:#4c433c;background:transparent}
.back-link{min-height:44px;font:12px/1.5 var(--sans);color:#6f665e;padding:8px 0}.eyebrow{font-family:var(--sans);font-size:11px;font-weight:400;letter-spacing:1px;color:#6f665e}.tag-row{gap:8px}.tag{font:11px/1.5 var(--sans);background:transparent;color:#6f665e;letter-spacing:.1px}
.count-options .count-number{white-space:nowrap}.count-options .count-kind{white-space:nowrap}.case-image-error,.case-image-pending{font-family:var(--sans);font-size:12px}
.view:not(.hidden){animation:page-arrive 190ms var(--motion)}.toast{border-radius:12px;font:13px/1.6 var(--sans);background:#302b27ef;box-shadow:0 6px 25px #302b2720}.pending-return{border:0;border-radius:12px;padding:12px 14px;background:#efebe6;color:#4c433c;font:12px/1.8 var(--sans);margin:8px 0 18px}
@keyframes gallery-reveal{from{opacity:.3;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes page-arrive{from{opacity:.6;transform:translateY(3px)}to{opacity:1;transform:none}}
@media(hover:hover){.filter:hover:not(.active){background:#ffffff70}.photo-type:hover:not(.selected){background:#efebe6}.template-image:hover img{transform:scale(1.025)}.template-image.is-magazine:hover img{transform:none}.template-cta:hover .cta-arrow{transform:translate(2px,-2px)}.header-library:hover{color:#4c433c}.button-dark:hover{background:#352f2a}}
@media(max-width:370px){.shell{width:calc(100% - 32px)}.brand-name{font-size:26px}.brand-meta{padding-left:8px}.brand-caption{font-size:7px;letter-spacing:.7px}.header-library{font-size:11px}.discover-intro h1{font-size:26px;letter-spacing:-.6px}.discover-intro{padding:18px 0 22px}.template-grid{column-gap:12px}.template-heading h3,.template-heading h3.display-lettering{font-size:17px}.template-story{font-size:13px}.photo-types{margin-bottom:21px}.how-it-works{padding:22px 13px;gap:8px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.template-image:hover img,button:active:not(:disabled),.button:active{transform:none}}
