.template-preview{--preview-accent:#80745d;min-height:calc(100svh - 82px);display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,430px);background:#f3efe7;color:#28241f}.template-preview__stage{min-width:0;padding:20px clamp(24px,5vw,76px) 28px;display:grid;align-content:start;justify-items:center;background:radial-gradient(circle at 18% 12%,color-mix(in srgb,var(--preview-accent) 11%,transparent),transparent 30%),linear-gradient(115deg,#f7f4ee,#e9e2d7)}.template-preview__browse{width:min(100%,760px);min-height:52px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-size:.84rem}.template-preview__browse a{min-height:44px;display:inline-flex;align-items:center;gap:7px;color:inherit;text-decoration:none;border-radius:999px;padding:0 12px}.template-preview__browse a:focus-visible,.template-preview__details a:focus-visible,.template-preview__details button:focus-visible{outline:3px solid color-mix(in srgb,var(--preview-accent) 62%,#ffffff);outline-offset:3px}.template-preview__card{width:min(100%,640px,calc(max(240px, 100svh - 220px) * var(--preview-card-ratio, .8)));--tmpl-accent:var(--preview-accent);filter:drop-shadow(0 30px 35px rgba(45,37,27,.18))}.template-preview__card .hv-card-frame{padding:8px}.template-preview__card--paused *,.template-preview__card--paused :after,.template-preview__card--paused :before{animation-play-state:paused!important}.template-preview__details{padding:clamp(44px,7vw,96px) clamp(28px,4vw,58px);display:flex;flex-direction:column;align-items:flex-start;border-left:1px solid #ded8ce;background:#fffdf9}.template-preview__heading>p{margin:0 0 12px;color:#756d62;font-size:.76rem;letter-spacing:.12em;text-transform:capitalize}.template-preview__heading h1{margin:0;max-width:12ch;font-family:var(--font-serif,Georgia,serif);font-size:clamp(2.25rem,4vw,4.2rem);font-weight:500;line-height:.98;letter-spacing:-.035em}.template-preview__animated{display:inline-flex;margin-top:18px;min-height:28px;align-items:center;padding:0 11px;border:1px solid color-mix(in srgb,var(--preview-accent) 45%,#d8d0c4);border-radius:999px;color:color-mix(in srgb,var(--preview-accent) 76%,#2c271f);font-size:.76rem}.template-preview__summary{max-width:35ch;margin:30px 0;color:#665f55;font-size:1rem;line-height:1.65}.template-preview__colourways>span{display:block;margin-bottom:12px;color:#5e574e;font-size:.8rem}.template-preview__colourways>div{display:flex;gap:10px}.template-preview__colourways a{--colourway:#777;width:44px;height:44px;display:block;border-radius:50%;border:8px solid #fffdf9;background:var(--colourway);box-shadow:0 0 0 1px #cec6b8}.template-preview__colourways a[aria-current=true]{box-shadow:0 0 0 2px #2f2a24}.template-preview__motion{display:flex;gap:8px;margin-top:24px;flex-wrap:wrap}.template-preview__motion button{min-height:44px;padding:0 15px;border:1px solid #d2cabd;border-radius:999px;background:transparent;color:inherit;cursor:pointer}.template-preview__actions{width:100%;margin-top:auto;padding-top:40px}.template-preview__use{min-height:56px;width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 22px;border-radius:999px;background:#28241f;color:#fff;text-decoration:none;font-weight:650}.template-preview__actions p{margin:12px 0 0;color:#7b746b;font-size:.76rem;text-align:center}@media (max-width:820px){.template-preview{display:block;min-height:auto;padding-bottom:94px}.template-preview__stage{padding:8px 18px 24px}.template-preview__browse{padding:0 2px}.template-preview__browse a{padding-inline:8px}.template-preview__card{width:min(100%,520px,calc(max(220px, 100svh - 210px) * var(--preview-card-ratio, .8)))}.template-preview__details{border:0;border-top:1px solid #ded8ce;padding:34px 22px 26px}.template-preview__heading h1{font-size:clamp(2.2rem,11vw,3.4rem)}.template-preview__summary{margin:22px 0}.template-preview__actions{position:fixed;z-index:40;left:0;right:0;bottom:0;padding:10px max(14px,env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));background:color-mix(in srgb,#fffdf9 94%,transparent);border-top:1px solid #ddd5c9;backdrop-filter:blur(14px)}.template-preview__actions p{display:none}}@media (prefers-reduced-motion:reduce){.template-preview__card *,.template-preview__card :after,.template-preview__card :before{animation:none!important;transition:none!important}}