/* Shared appearance tokens: public pages, studio previews and template cards. */
.wl-design{background:var(--design-image,none) center/cover no-repeat,var(--design-background);color:var(--design-text);font-family:var(--design-font);--profile-accent:var(--design-accent);--profile-bg:var(--design-background);--profile-fg:var(--design-text);--profile-button:var(--design-button);--profile-border:color-mix(in srgb,var(--design-text) 15%,transparent);position:relative;isolation:isolate}
.wl-design::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit}
.wl-design[data-background-pattern=dots]::before{background-image:radial-gradient(var(--design-text) .8px,transparent .8px);background-size:18px 18px;opacity:.13}
.wl-design[data-background-pattern=grid]::before{background-image:linear-gradient(var(--design-text) 1px,transparent 1px),linear-gradient(90deg,var(--design-text) 1px,transparent 1px);background-size:30px 30px;opacity:.07}
.wl-design[data-background-pattern=orbs]::before{background:radial-gradient(ellipse at 5% 15%,#ffffff70,transparent 45%),radial-gradient(ellipse at 90% 70%,var(--design-accent),transparent 58%);opacity:.5}
.wl-design[data-background-pattern=stripes]::before{background-image:repeating-linear-gradient(135deg,transparent 0 12px,var(--design-text) 12px 14px,transparent 14px 26px);opacity:.08}
.wl-design[data-background-pattern=waves]::before{background-color:var(--design-text);mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='24' viewBox='0 0 48 24'%3E%3Cpath d='M-24 12Q-12 0 0 12T24 12T48 12T72 12' fill='none' stroke='black' stroke-width='1.3'/%3E%3C/svg%3E");mask-size:48px 24px;opacity:.1}
.wl-design[data-background-pattern=zigzag]::before{background-image:linear-gradient(135deg,var(--design-text) 25%,transparent 25%),linear-gradient(225deg,var(--design-text) 25%,transparent 25%),linear-gradient(315deg,var(--design-text) 25%,transparent 25%),linear-gradient(45deg,var(--design-text) 25%,transparent 25%);background-position:-18px 0,-18px 0,0 0,0 0;background-size:36px 36px;opacity:.06}
.wl-design[data-background-pattern=diamonds]::before{background-image:repeating-linear-gradient(45deg,transparent 0 20px,var(--design-text) 20px 21px),repeating-linear-gradient(135deg,transparent 0 20px,var(--design-text) 20px 21px);opacity:.08}
.profile-canvas{min-height:100vh;min-height:100svh}
.wl-design .public-profile{max-width:var(--design-width);font-family:var(--design-font);text-align:var(--design-align);color:var(--design-text);padding:42px 24px 32px}
.wl-design .public-profile h1{font-family:inherit;font-size:calc(var(--design-font-size)*1.85);line-height:1.15;overflow-wrap:anywhere}
.wl-design .public-profile-tools,.wl-design .mini-profile-tools{display:flex;align-items:center;justify-content:space-between;direction:ltr;gap:12px;margin:-18px 0 28px;min-height:44px}
.wl-design .public-share-button{display:inline-flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;margin-left:auto;padding:0;border:1px solid color-mix(in srgb,var(--design-text) 25%,transparent);border-radius:16px;background:color-mix(in srgb,var(--design-bg-start) 75%,transparent);color:var(--design-text)}
.wl-design .public-share-button:hover{background:color-mix(in srgb,var(--design-text) 12%,var(--design-bg-start))}
.wl-design .public-share-button:focus-visible,.wl-design .public-profile-tools :focus-visible,.wl-design .public-share-fallback :focus-visible{outline:3px solid var(--design-text);outline-offset:3px}
.wl-design .public-profile-languages{display:flex;align-items:center;gap:6px;min-width:0;max-width:calc(100% - 56px);margin-right:auto}
.wl-design .public-language-select,.wl-design .public-language-submit{min-height:44px;min-width:0;border:1px solid color-mix(in srgb,var(--design-text) 25%,transparent);border-radius:12px;background:var(--design-bg-start);color:var(--design-text);font:inherit;font-size:14px;padding:8px 10px}
.wl-design .public-language-select{max-width:100%;flex:1}
.wl-design .public-language-submit{flex-shrink:0}
.wl-design .public-share-fallback{padding:16px;margin-bottom:28px;text-align:start;border:1px solid color-mix(in srgb,var(--design-text) 25%,transparent);border-radius:16px;background:var(--design-bg-start);color:var(--design-text)}
.wl-design .public-share-fallback label{font-size:14px;display:block;margin-bottom:8px}
.wl-design .public-share-fallback input{width:100%;min-height:44px;padding:10px;border:1px solid currentColor;border-radius:8px;font-size:16px;background:transparent;color:inherit}
.wl-design .public-share-fallback p{font-size:14px;line-height:1.5;margin:10px 0}
.wl-design .public-share-fallback button{min-height:44px;padding:8px 14px;border:1px solid currentColor;border-radius:8px;background:transparent;color:inherit;font-size:14px}
.wl-design .mini-profile-tools{margin:0 0 14px;min-height:32px}
.wl-design .mini-profile-tools .public-share-button{width:32px;height:32px;flex-basis:32px;border-radius:11px}
.wl-design .mini-profile-tools .public-share-button svg{width:16px;height:16px}
.wl-design .mini-profile-tools select{max-width:calc(100% - 44px);min-width:0;min-height:32px;padding:5px 8px;border:1px solid color-mix(in srgb,var(--design-text) 25%,transparent);border-radius:9px;background:var(--design-bg-start);color:var(--design-text);font:inherit;font-size:12px}
[dir=rtl] .wl-design .public-profile-languages,[dir=rtl] .wl-design .public-language-select,.wl-design [dir=rtl] .mini-profile-tools select{direction:rtl}
@media(max-width:760px){.wl-design .public-profile-tools{margin-top:-8px;margin-bottom:24px}}
.wl-design .public-bio{font-size:calc(var(--design-font-size)*.9);line-height:1.65}
.wl-design .public-avatar,.wl-design .mini-avatar,.wl-design .wl-mini-avatar{border-radius:var(--design-avatar-radius);object-fit:cover}
.wl-design .public-avatar.avatar-initials,.wl-design .mini-avatar,.wl-design .wl-mini-avatar{background:var(--design-accent);color:#fff}
.wl-design .public-links{gap:var(--design-gap)}
.wl-design .public-link,.wl-design .mini-link,.wl-design .wl-mini-link{border-radius:var(--design-radius);background:var(--design-button);color:var(--design-button-text);border:var(--design-border) solid color-mix(in srgb,var(--design-button-text) 16%,transparent);box-shadow:var(--design-shadow);font-family:inherit;text-align:var(--design-align)}
.wl-design .public-link{min-height:64px;padding:18px 20px;transition:transform .16s,box-shadow .16s}
.wl-design .public-link:hover{transform:translateY(-2px);filter:brightness(1.03)}
.wl-design .public-link:focus-visible,.wl-design .public-socials a:focus-visible{outline:3px solid var(--design-accent);outline-offset:4px}
.wl-design .public-link strong{font-size:var(--design-font-size);font-weight:650;line-height:1.4}
.wl-design .public-link small{font-size:calc(var(--design-font-size)*.77);line-height:1.45}
.wl-design .public-link.public-link-featured,.wl-design .mini-link.featured{border-color:var(--design-accent);box-shadow:0 0 0 2px var(--design-accent),var(--design-shadow);font-weight:700}
.wl-design[data-button-fill=outline] .public-link,.wl-design[data-button-fill=outline] .mini-link,.wl-design[data-button-fill=outline] .wl-mini-link{background:transparent;color:var(--design-text);border-color:var(--design-text)}
.wl-design[data-button-fill=glass] .public-link,.wl-design[data-button-fill=glass] .mini-link,.wl-design[data-button-fill=glass] .wl-mini-link{background:color-mix(in srgb,var(--design-button) 14%,transparent);color:var(--design-button-text);border-color:color-mix(in srgb,var(--design-button) 36%,transparent);backdrop-filter:blur(12px)}
.wl-design .profile-section-title,.wl-design .profile-text-block h2{font-size:calc(var(--design-font-size)*1.15);font-family:inherit}
.wl-design .profile-text-block{border-radius:var(--design-radius)}
.wl-design .profile-text-block p{font-size:calc(var(--design-font-size)*.86)}
.wl-design .subscribe-card{background:color-mix(in srgb,var(--design-bg-start) 70%,transparent);color:var(--design-text);border-color:color-mix(in srgb,var(--design-text) 15%,transparent);border-radius:var(--design-radius)}
.wl-design .subscribe-card .button{background:var(--design-button);color:var(--design-button-text);border-color:var(--design-button-text);border-radius:var(--design-radius)}
.wl-design[data-layout=left] .public-avatar,.wl-design[data-layout=left] .public-bio,.wl-design[data-layout=left] .mini-avatar{margin-left:0}
.wl-design .public-brand,.wl-design .public-legal{color:var(--design-text)}
.wl-design .mini-profile,.mini-profile.wl-design{font-family:var(--design-font);background:transparent;color:var(--design-text);text-align:var(--design-align)}
.wl-design .mini-profile h2{font-family:inherit;font-size:calc(var(--design-font-size)*1.1)}
.wl-design .mini-bio{font-size:calc(var(--design-font-size)*.57)}
.wl-design .mini-link{margin-top:calc(var(--design-gap)*.6);font-size:calc(var(--design-font-size)*.58);border-radius:calc(var(--design-radius)*.65);padding:13px 12px}
.wl-design .mini-link small{font-size:calc(var(--design-font-size)*.45)}
.wl-theme-card{position:relative;display:block;padding:0;width:100%;background:#fff;border:2px solid #e5e8ed;border-radius:18px;text-align:left;overflow:hidden;cursor:pointer;color:var(--ink);transition:transform .18s,border-color .18s,box-shadow .18s}
.wl-theme-card:hover{transform:translateY(-3px);box-shadow:0 10px 30px #182b3f12}
.wl-theme-card.selected{border-color:var(--primary)}
.wl-theme-card:focus-visible{outline:3px solid var(--primary);outline-offset:4px}
.wl-theme-scene{display:flex;flex-direction:column;align-items:center;padding:25px 18px 22px;min-height:250px;overflow:hidden;text-align:center}
.wl-mini-avatar{display:flex;align-items:center;justify-content:center;flex-shrink:0;width:46px;height:46px;border-radius:var(--design-avatar-radius);font-size:20px;margin:0 auto 10px;box-shadow:0 0 0 3px #ffffff55}
.wl-mini-name{font-size:17px;line-height:1.3;font-weight:700;margin-bottom:4px;letter-spacing:-.02em}
.wl-mini-bio{font-size:8px;opacity:.75;margin-bottom:13px}
.wl-mini-link{display:block;width:100%;padding:9px 8px;font-size:8px;margin-top:calc(var(--design-gap)*.45);border-radius:calc(var(--design-radius)*.55)!important;line-height:1.4}
.wl-theme-scene[data-layout=left]{align-items:flex-start;text-align:left}
.wl-theme-scene[data-layout=left] .wl-mini-avatar{margin-left:0}
.wl-theme-caption{display:flex;flex-direction:column;gap:5px;padding:14px 15px;line-height:1.4;background:#fff}
.wl-theme-caption strong{font-size:14px;color:#182b3f}
.wl-theme-caption>span{font-size:14px;color:#68768a}
.wl-theme-check{display:none;position:absolute;right:9px;top:9px;width:24px;height:24px;background:var(--primary);color:#fff;border:2px solid #fff;border-radius:50%;align-items:center;justify-content:center;font-size:15px}
.wl-theme-card.selected .wl-theme-check{display:flex}
.wl-theme-card.compact .wl-theme-scene{min-height:195px;padding:16px 12px}
.wl-theme-card.compact .wl-mini-avatar{width:34px;height:34px;font-size:15px}
.wl-theme-card.compact .wl-mini-name{font-size:13px}
.wl-theme-card.compact .wl-mini-link{font-size:7px;padding:7px}
.wl-theme-card.compact .wl-theme-caption{padding:10px 12px}
.wl-theme-card.compact .wl-theme-caption>span{display:none}
.template-filters{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:0 auto 15px}
.template-filters button{padding:10px 17px;border-radius:99px;border:1px solid var(--line);background:#fff;color:var(--ink);font-size:16px;font-weight:550}
.template-filters button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.template-count{text-align:center;color:var(--muted);font-size:14px;margin:0 0 28px}
.design-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}
.design-gallery article[hidden]{display:none}
.design-gallery .wl-theme-scene{min-height:300px;padding:30px 24px}
.design-gallery .wl-mini-avatar{width:58px;height:58px;font-size:25px;margin-bottom:14px}
.design-gallery .wl-mini-name{font-size:22px}
.design-gallery .wl-mini-bio{font-size:10px;margin-bottom:15px}
.design-gallery .wl-mini-link{font-size:10px;padding:12px;margin-top:11px}
.gallery-theme-caption{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:17px 0 5px}
.gallery-theme-caption h2{font-size:20px;margin:0 0 5px}
.gallery-theme-caption p{font-size:14px;margin:0;line-height:1.5;color:var(--muted)}
.gallery-theme-actions{display:flex;gap:15px;margin-top:10px;font-size:16px;font-weight:650}
.gallery-theme-actions a{padding:5px 0;border-bottom:1px solid currentColor}
.gallery-theme-frame{border-radius:22px;overflow:hidden;border:1px solid #182b3f0a}
@media(max-width:1100px){.design-gallery{grid-template-columns:repeat(3,minmax(0,1fr));gap:25px 18px}.design-gallery .wl-theme-scene{padding:28px 18px}}
@media(max-width:760px){.design-gallery{grid-template-columns:repeat(2,minmax(0,1fr));gap:25px 15px}.template-filters{gap:6px}.template-filters button{font-size:16px;padding:9px 12px}.design-gallery .wl-theme-scene{min-height:270px;padding:24px 15px}.design-gallery .wl-mini-name{font-size:19px}.gallery-theme-caption h2{font-size:18px}.wl-design .public-profile{padding:28px 20px}}
@media(max-width:420px){.design-gallery{gap:25px 12px}.design-gallery .wl-theme-scene{padding:20px 10px;min-height:248px}.design-gallery .wl-mini-name{font-size:16px}.design-gallery .wl-mini-bio{font-size:8px}.design-gallery .wl-mini-link{font-size:8px;padding:10px 7px}.gallery-theme-caption h2{font-size:17px}.gallery-theme-caption p{font-size:14px}.gallery-theme-actions{font-size:16px;gap:11px}}
@media(prefers-reduced-motion:reduce){.wl-theme-card,.wl-design .public-link{transition:none}}

.wl-theme-caption strong{font-size:15px;overflow-wrap:anywhere}
.wl-theme-caption>span{font-size:14px}
.template-filters button{font-size:16px;min-height:44px}
.gallery-theme-caption{flex-wrap:wrap}
.gallery-theme-caption p{font-size:14px}
.gallery-theme-actions{font-size:15px;flex-wrap:wrap}
.gallery-theme-actions a{min-height:44px;align-content:center}
@media(max-width:420px){.gallery-theme-actions{gap:10px}.wl-theme-caption{padding:12px 10px}}

/* One profile header for every template, from gallery cards to public pages. */
.wl-design .wl-profile-header{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:18px;width:100%;min-width:0;margin:0 0 22px}
.wl-design .wl-profile-header>.public-avatar,.wl-design .wl-profile-header>.mini-avatar,.wl-design .wl-profile-header>.wl-mini-avatar,.wl-design .wl-profile-header>.setup-profile-avatar{flex-shrink:0;margin:0}
.wl-design .wl-socials{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;max-width:100%;margin:0;opacity:1}
.wl-design .wl-social-icon{display:inline-flex;flex:0 0 auto;align-items:center;justify-content:center;width:var(--social-size,44px);height:var(--social-size,44px);min-height:var(--social-size,44px);padding:0;border:1px solid color-mix(in srgb,var(--design-text) 16%,transparent);border-radius:50%;background:color-mix(in srgb,var(--design-bg-start) 65%,transparent);color:var(--design-text);text-decoration:none;line-height:1;box-shadow:0 2px 6px #00000005}
.wl-design .wl-social-icon .wl-icon{width:var(--social-icon-size,20px);height:var(--social-icon-size,20px)}
.wl-design a.wl-social-icon{transition:transform .16s,background .16s}
.wl-design a.wl-social-icon:hover{transform:translateY(-2px);background:color-mix(in srgb,var(--design-text) 12%,var(--design-bg-start))}
.wl-design a.wl-social-icon:focus-visible{outline:3px solid var(--design-text);outline-offset:3px}
.wl-design[data-layout=left] .wl-profile-header,.wl-design[data-layout=left] .wl-socials{justify-content:flex-start}
/* Many channels get the full width instead of squeezing the avatar. */
.wl-design .wl-profile-header:has(.wl-social-icon:nth-child(n+7))>.wl-socials{flex-basis:100%}
.wl-design .mini-profile .wl-profile-header{gap:12px;margin-bottom:16px}
.wl-design .mini-profile .wl-socials{--social-size:30px;--social-icon-size:15px;gap:6px}
.setup-phone.wl-design .wl-profile-header{gap:12px;margin-bottom:16px}
.setup-phone.wl-design .wl-socials{--social-size:30px;--social-icon-size:15px;gap:6px}
.wl-theme-scene .wl-profile-header{gap:10px;margin-bottom:12px}
.wl-theme-scene .wl-socials{--social-size:24px;--social-icon-size:13px;gap:5px}
.wl-theme-card.compact .wl-profile-header{gap:8px;margin-bottom:10px}
.wl-theme-card.compact .wl-socials{--social-size:20px;--social-icon-size:12px;gap:4px}
.design-gallery .wl-profile-header{gap:12px;margin-bottom:16px}
.design-gallery .wl-socials{--social-size:28px;--social-icon-size:15px;gap:6px}
@media(prefers-reduced-motion:reduce){.wl-design a.wl-social-icon{transition:none}}

/* Explicit social alignment also works independently of the page layout. */
.wl-design .wl-socials-positioned{width:100%;margin:18px 0}
.wl-design .public-links>.wl-socials-positioned{margin:0}
.wl-design .wl-socials[data-social-alignment=left]{justify-content:flex-start}
.wl-design .wl-socials[data-social-alignment=center]{justify-content:center}
.wl-design .wl-socials[data-social-alignment=right]{justify-content:flex-end}
.wl-design .wl-profile-header>.wl-socials:not([data-social-alignment=auto])[data-social-alignment]{flex:1}
.wl-design .mini-profile .wl-socials-positioned,.setup-phone.wl-design .wl-socials-positioned{margin:14px 0}
