/* Measured against Linktree's public profile menus. Bybre branding is retained. */
#panel{--menu-ink:#1e2330;--menu-muted:#676b5f;color:var(--menu-ink);box-shadow:none;max-height:calc(100dvh - 32px);scrollbar-width:thin;scrollbar-color:#d5d6d0 transparent}
#panel::backdrop{background:rgb(0 0 0 / .6)}
#panel #panel-title:focus{outline:none}
/* Shared close geometry is finalized in modal-controls.css. */
#panel .close,#panel.share-sheet .close,#panel.brand-sheet .close,.property-dialog .property-close{position:absolute;top:14px;right:14px;width:44px;height:44px;min-width:44px;padding:6px;display:grid;place-items:center;border:0;border-radius:8px;background:transparent;color:#1e2330;opacity:1;z-index:5;box-shadow:none}

#panel .close:focus:not(:focus-visible),.property-dialog .property-close:focus:not(:focus-visible){outline:none}
#panel .close:focus-visible,.property-dialog .property-close:focus-visible{outline:2px solid currentColor;outline-offset:-6px}
#panel .close .exit-icon{width:32px;height:32px}
.property-dialog .property-close svg{display:none}
.property-dialog .property-close:after{content:'';display:block;width:32px;height:32px;background:currentColor;mask:url('assets/exit-figma.svg') center/32px 32px no-repeat;-webkit-mask:url('assets/exit-figma.svg') center/32px 32px no-repeat}
#panel.profile-sheet{max-width:520px;margin:auto auto 0;padding:24px 24px max(24px,env(safe-area-inset-bottom));border-radius:24px 24px 0 0;background:#fff}
#panel.profile-sheet .menu-title{font-size:18px;line-height:24px;font-weight:500;text-align:center;padding:0 34px;margin:4px 0 24px}
#panel.profile-sheet p{font-size:14px;line-height:21px}
#panel .menu-intro{margin:0 0 24px;color:var(--menu-muted)}
#panel .fine{font-size:12px!important;line-height:18px!important;color:var(--menu-muted);margin-top:20px!important}
#panel.profile-sheet .action{min-height:48px;font-size:16px;line-height:24px;background:#000;color:#fff;border-radius:999px;margin-top:24px}
#panel.profile-sheet .action.secondary{color:#000;background:#fff;border:1px solid #e0e2d9}
#panel .account-identity{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;margin-bottom:16px}
#panel .account-identity .avatar{width:96px;height:96px;border-radius:50%;margin-bottom:4px;object-fit:cover;object-position:center 20%}
#panel .account-identity strong{font-size:16px;line-height:24px;font-weight:500}
#panel .account-identity p{font-size:12px;line-height:18px;color:var(--menu-muted)}
.account-details{border-top:1px solid #e8e8e6;padding-top:16px}
.account-detail{display:flex;gap:12px;align-items:center;margin-bottom:20px;font-size:14px;line-height:21px}
.account-detail strong{font-weight:500}.account-detail p{color:var(--menu-muted)}.account-detail-icon img{width:24px;height:24px}
#panel .menu-rows{display:flex;flex-direction:column}
#panel .menu-row{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:56px;border-bottom:1px solid #e8e8e6;font-size:14px;font-weight:500;line-height:21px;text-align:left;padding:16px 0}
#panel .menu-row:last-child{border-bottom:0}.menu-row svg{width:16px;height:16px;flex:none;color:#858982}.menu-row small{display:block;color:var(--menu-muted);font-size:12px;font-weight:400}
#panel.more-sheet{padding-left:16px;padding-right:16px}.more-sheet .menu-row{font-size:16px!important}
#panel .channels{gap:24px;margin-top:24px}#panel .channel{min-height:48px}.channel-icon img{width:28px;height:28px;object-fit:contain}.channel-copy strong{display:block;font-weight:500}.channel-copy>span{display:block;color:var(--menu-muted);font-size:12px;line-height:18px}#panel .outline{padding:8px 16px;min-height:40px;display:flex;align-items:center}
#panel .menu-prose h3{font-size:16px;line-height:24px;font-weight:500;margin:24px 0 8px}#panel .menu-prose h3:first-child{margin-top:0}#panel .menu-prose p{color:var(--menu-muted)}
.cookie-categories details{border-bottom:1px solid #e8e8e6}.cookie-categories details:last-child{border:0}.cookie-categories summary{display:flex;align-items:center;gap:12px;padding:22px 0;cursor:pointer;list-style:none;font-size:14px;line-height:20px;font-weight:500}.cookie-categories summary::-webkit-details-marker{display:none}.cookie-categories summary:before{content:'';width:6px;height:6px;border-top:1px solid currentColor;border-right:1px solid currentColor;transform:rotate(45deg);flex:none}.cookie-categories details[open] summary:before{transform:rotate(135deg)}.cookie-categories summary small{margin-left:auto;color:var(--menu-muted);font-size:12px;font-weight:400;white-space:nowrap}.cookie-categories details p{padding:0 0 20px 18px;color:var(--menu-muted)}
.report-identity{display:flex;align-items:center;gap:12px;padding:16px;background:#f3f3f1;border-radius:12px;margin-bottom:24px}.report-identity .avatar{width:48px;height:48px;border-radius:50%}.report-identity strong,.report-identity span{display:block;font-size:14px;line-height:21px}.report-identity span{color:var(--menu-muted);font-size:12px}
.explore-cards{display:flex;gap:8px;overflow-x:auto;padding:0 0 16px;scroll-snap-type:x proximity}.explore-card{flex:0 0 148px;min-width:0;padding:12px;background:white;border:1px solid #e0e2d9;border-radius:16px;box-shadow:0 4px 12px #0000000a;text-align:left;scroll-snap-align:start}.explore-card img{width:100px;height:100px;object-fit:cover;object-position:center 20%;border-radius:50%;margin:12px auto}.explore-card strong{display:block;font-size:14px;line-height:20px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.explore-card small{display:block;font-size:12px;line-height:18px;color:var(--menu-muted)}.menu-section-title{font-size:14px;font-weight:500;margin:16px 0}.discovery-links{display:flex;flex-wrap:wrap;gap:8px}.discovery-chip{font-size:12px;line-height:18px;padding:8px;border:1px solid #e8e8e6;border-radius:999px}
/* Share profile and share link use the two corresponding Linktree card layouts. */
#panel.share-sheet{max-width:520px;border-radius:16px 16px 0 0;color:#000}
.share-main{padding:24px 8px 0}.share-main h2{font-size:16px;line-height:24px;font-weight:500}
.share-preview{border-radius:24px;margin:24px 20px;aspect-ratio:1.9;padding:16px;gap:0}
.share-preview .share-avatar{width:24%;margin-bottom:4%;object-position:center 20%}
.share-preview strong{font-size:clamp(16px,4.5vw,22px);line-height:1.2;font-weight:600;max-width:100%;overflow-wrap:anywhere}
.share-link-preview{display:flex;flex-direction:column;align-items:center;gap:8px;width:calc(100% - 40px);max-width:327px;margin:24px auto 0;padding:24px;border:1px solid #d6d6d6;border-radius:24px;background:#d6dce0;color:#213344;box-shadow:0 4px 8px #0000000a;text-align:center}
.share-link-preview>img{height:120px;width:120px;object-fit:cover;object-position:center 20%;border-radius:8px;margin-bottom:8px}
.share-link-preview>strong{font-size:20px;line-height:24px;font-weight:600;text-wrap:balance;overflow-wrap:anywhere}
.share-link-preview>span{font-size:13px;line-height:19.5px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.share-options{align-items:flex-start;padding:24px 16px;gap:16px;min-height:122px;scroll-padding:16px}
.share-option{flex:0 0 60px;width:60px;font-size:12px;line-height:18px;gap:8px}.share-option svg{width:48px;height:48px}
.share-scroll{width:40px;height:40px;bottom:54px;right:8px;font-size:24px}.share-scroll[hidden]{display:none}
.share-join{padding:20px 20px max(20px,env(safe-area-inset-bottom));border-color:#c4c4c4}.share-join h3{font-size:16px;line-height:24px;font-weight:500}.share-join p{font-size:14px;line-height:21px;margin:0 0 16px;color:#676b5f}.share-join>div{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.share-join button{box-sizing:border-box;display:flex;align-items:center;justify-content:center;height:48px;min-height:48px;min-width:0;padding:0 16px;font-size:16px;line-height:24px;font-weight:500;border-radius:64px}.join-secondary{box-shadow:none}
.share-report{display:flex;gap:8px;align-items:center;padding:20px 24px;font-size:14px;line-height:20px;color:#676b5f;width:100%;text-align:left}.share-report svg{width:16px;height:16px}
/* Match the measured compact brand panel while allowing short screens to scroll. */
#panel.brand-sheet .close{color:#254f1a}.brand-content{padding:16px 20px 0}.brand-content>img{margin-bottom:16px}.sheet-handle{height:32px}.sheet-handle:before{display:none}.brand-content h2{font-size:32px;line-height:36px}.brand-content>p{font-size:16px;line-height:24px}.brand-bottom{min-height:176px}.brand-links{position:relative;z-index:1}.mini-homes img{object-position:center 20%}
@media(min-width:640px){#panel.profile-sheet{margin:auto;border-radius:32px}#panel.share-sheet{margin:auto;border-radius:16px}#panel.brand-sheet{margin:auto;border-radius:24px}.brand-content{padding:16px 28px 0}.brand-content h2{font-size:40px;line-height:40px}.brand-bottom{min-height:176px}#panel.profile-sheet[open]{animation:viewer-in .2s ease-out}}
@media(max-width:639px){#panel.profile-sheet[open]{animation:sheet-in .5s cubic-bezier(.32,.72,0,1)}.share-scroll{display:none}}
@media(max-width:359px){.share-join>div{gap:8px}.brand-content h2{font-size:30px;line-height:34px}.brand-bottom{min-height:200px}.brand-links{width:54%}.mini-profile{width:100px;margin-left:4px;margin-top:-32px}.share-link-preview{padding:20px}.cookie-categories summary{gap:8px}}
@media(prefers-reduced-motion:reduce){#panel.profile-sheet[open]{animation:none}}
/* Keep the common close control reachable while long menu contents scroll. */
#panel{overflow:hidden;padding:0}
#panel[open]{display:flex;flex-direction:column}
#panel .panel-header{position:relative;flex:0 0 72px;min-height:72px;background:inherit;z-index:6;display:flex;align-items:center;justify-content:center;padding:0 64px}
#panel .panel-header #panel-title{padding:0;margin:0;text-align:center;font-size:18px;line-height:24px;font-weight:500}
#panel.share-sheet .panel-header #panel-title{font-size:16px}
#panel #panel-content{overflow-y:auto;overscroll-behavior:contain;min-height:0;scrollbar-width:thin}
#panel.profile-sheet{padding:0}
#panel.profile-sheet #panel-content{padding:0 24px max(24px,env(safe-area-inset-bottom))}
#panel.more-sheet #panel-content{padding-left:16px;padding-right:16px}
#panel.share-sheet .share-main{padding-top:0}
#panel.share-sheet .share-preview,#panel.share-sheet .share-link-preview{margin-top:0}
#panel.brand-sheet .panel-header{flex-basis:48px;min-height:48px}
#panel.brand-sheet .sheet-handle{display:none}
#panel.brand-sheet .brand-content{padding-top:0}

/* Profile-colour previews mirror the softly green profile theme. */
.share-preview,.share-link-preview,.mini-profile{background-color:#d7e1da;color:#213b34}
.share-link-preview .share-link-description{font-size:12px;line-height:18px;text-wrap:balance;margin-top:4px}

/* Verification: Linktree's compact 420px dialog and mobile bottom sheet. */
#panel.verified-sheet{width:100%;max-width:420px;margin:auto auto 0;border-radius:24px 24px 0 0;padding:0;background:#fff;color:#000}
#panel.verified-sheet .panel-header{position:absolute;inset:0 0 auto;min-height:0;height:0;padding:0;flex-basis:0}
#panel.verified-sheet #panel-content{padding:32px 24px max(40px,env(safe-area-inset-bottom))}
.verified-content{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;text-align:center}
.verified-emblem{position:relative;width:80px;height:80px;margin-bottom:8px;flex:none}
.verified-brand{display:grid;place-items:center;width:80px;height:80px;border-radius:50%;background:#d7e1da}
.verified-brand img{width:40px;height:40px}
.verified-seal{position:absolute;bottom:0;right:0;width:32px;height:32px;filter:drop-shadow(0 4px 3px #00000012) drop-shadow(0 2px 2px #0000000f)}
#panel.verified-sheet h2{padding:0;margin:0;font-size:20px;font-weight:500;line-height:24px}
#panel.verified-sheet .verified-description,#panel.verified-sheet p,.verified-learn{font-size:14px;font-weight:400;line-height:20px;color:#0000008c}
.verified-learn{display:inline;padding:0;text-decoration:underline;text-underline-offset:1px}
@media(min-width:640px){#panel.verified-sheet{margin:auto;border-radius:24px}}

/* Shared circular close controls for every menu. */
#panel .close,#panel.share-sheet .close,#panel.brand-sheet .close,.property-dialog .property-close{border-radius:50%}

/* Measurements from the public itslindss and Linktree reference menus. */
#panel.followers-sheet .account-identity{margin:0;gap:8px}
#panel.followers-sheet .account-identity .avatar{width:80px;height:80px;margin:0 0 8px}
#panel.followers-sheet .account-identity h2{font-size:20px;line-height:24px;font-weight:500;margin:0;padding:0}
#panel.followers-sheet .account-identity p{font-size:14px;line-height:21px;margin:0}
#panel.followers-sheet .channel{min-height:42px;gap:12px}
#panel.followers-sheet .channel-copy{min-width:0;font-size:14px;line-height:21px}
#panel.followers-sheet .channel-copy>span{font-size:14px;line-height:21px}
#panel.followers-sheet .outline{min-height:35px;padding:6px 12px;line-height:21px;font-size:14px;font-weight:500;flex-shrink:0;border-color:rgb(0 0 0 / 15%)}
#panel:is(.more-sheet,.account-sheet,.explore-sheet){background:#fbfaf9}
#panel:is(.more-sheet,.account-sheet,.explore-sheet) .panel-header #panel-title{font-size:20px;line-height:27.5px}
