@charset "UTF-8";

/* Portal theme for the shared likes and sharing modules. */
.portal-page :is(.likes-dialog,.site-share-dialog){
    box-sizing:border-box;
    width:min(520px,calc(100% - 32px));
    max-width:none;
    max-height:calc(100dvh - 32px);
    margin:auto;
    padding:24px;
    overflow:auto;
    overscroll-behavior:contain;
    border:1px solid var(--portal-border)!important;
    border-radius:18px;
    background:var(--portal-panel)!important;
    color:var(--portal-text)!important;
    box-shadow:0 24px 80px #0008;
    font:14px/1.6 var(--font);
    scrollbar-width:thin;
    scrollbar-color:#454b55 var(--portal-panel);
}
.portal-page .site-share-dialog{width:min(660px,calc(100% - 32px))}
.portal-page :is(.likes-dialog,.site-share-dialog)::backdrop{background:#080a0dc9;backdrop-filter:blur(5px)}
.portal-page :is(.likes-dialog,.site-share-dialog) [hidden]{display:none!important}
.portal-page :is(.likes-dialog,.site-share-dialog) :is(.likes-dialog-heading,.site-share-heading){
    display:flex;
    align-items:flex-start;
    justify-content:space-between;
    gap:16px;
    margin:0;
    padding:0 0 18px;
    border:0;
    border-bottom:1px solid var(--portal-border)!important;
    border-radius:0;
    background:transparent!important;
    color:var(--portal-text)!important;
}
.portal-page :is(.likes-dialog-heading,.site-share-heading) h2{
    margin:3px 0 0;
    color:var(--portal-text);
    font:700 24px/1.25 var(--font);
    letter-spacing:-.025em;
}
.portal-page .site-share-heading .eyebrow{margin:0 0 6px;color:var(--portal-accent);font:650 9px/1.4 var(--font);letter-spacing:.1em}
.portal-page .site-share-heading h2{margin:0}
.portal-page :is(.likes-close,.site-share-close){
    display:grid;
    place-items:center;
    flex:none;
    width:36px;
    height:36px;
    padding:0;
    margin:0;
    border:1px solid #3c424c;
    border-radius:9px;
    background:var(--portal-raised);
    color:#aeb6c2;
    cursor:pointer;
    transition:background .15s,border-color .15s,color .15s;
}
.portal-page :is(.likes-close,.site-share-close):hover{background:#2c313a;border-color:#65616a;color:var(--portal-accent)}
.portal-page :is(.likes-close,.site-share-close) .icon{width:18px;height:18px}
.portal-page :is(.likes-target,.site-share-caption){margin:17px 0 20px;color:#abb3c0;font:400 13px/1.65 var(--font);overflow-wrap:anywhere}
.portal-page .likes-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.portal-page .likes-summary>div{
    display:grid;
    gap:3px;
    min-width:0;
    padding:14px 8px;
    border:1px solid var(--portal-border)!important;
    border-radius:10px;
    background:var(--portal-raised)!important;
    text-align:center;
}
.portal-page .likes-summary strong{color:var(--portal-accent);font:700 26px/1.2 var(--font);font-variant-numeric:tabular-nums}
.portal-page .likes-summary span{color:#a3adbb;font:500 11px/1.4 var(--font)}
.portal-page .likes-help{margin:15px 0 20px;color:var(--portal-muted);font:400 11px/1.65 var(--font)}
.portal-page .likes-participants{display:grid;gap:0;margin:0;padding:0;list-style:none;border:1px solid var(--portal-border);border-radius:11px;overflow:hidden;background:#181b20}
.portal-page .likes-participants:empty{display:none}
.portal-page .likes-participants li{margin:0;padding:0;border:0;overflow-wrap:anywhere;font:500 13px/1.5 var(--font)}
.portal-page .likes-participants li+li{border-top:1px solid var(--portal-border)}
.portal-page .likes-person{display:flex;align-items:center;gap:11px;min-width:0;padding:12px 14px;color:#d6dbe4;text-decoration:none;transition:background .15s,color .15s}
.portal-page .likes-person>span{min-width:0;overflow-wrap:anywhere}
.portal-page .likes-person[href]:hover{background:var(--portal-raised);color:var(--portal-accent)}
.portal-page .likes-avatar{display:block;flex:none;width:36px;height:36px;object-fit:cover;border:1px solid #3b414a;border-radius:9px;background:var(--portal-raised)}
.portal-page .likes-dialog [data-likes-status]{margin:18px 0 0;padding:12px 14px;border:1px solid var(--portal-border);border-radius:10px;background:var(--portal-raised);color:#aeb7c5;font:400 12px/1.6 var(--font);overflow-wrap:anywhere}
.portal-page .likes-dialog [data-likes-status]:empty{display:none}
.portal-page .likes-dialog [data-likes-more]{width:100%;min-height:40px;margin:14px 0 0;padding:10px 15px;border:1px solid #484e59;border-radius:9px;background:var(--portal-raised);color:var(--portal-text)!important;font:650 12px/1.4 var(--font);box-shadow:none;transform:none}
.portal-page .likes-dialog [data-likes-more]:hover{border-color:#f5a53b70;background:#f5a53b14;color:var(--portal-accent)!important}
.portal-page .likes-dialog [data-likes-more]:disabled{opacity:.55;cursor:wait}
.portal-page .site-share-local{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;padding:0 0 20px;border-color:var(--portal-border)}
.portal-page .site-share-local:not(:has(.site-share-option:not([hidden]))){display:none}
.portal-page .site-share-option{
    min-width:0;
    gap:9px;
    padding:13px 8px;
    border:1px solid var(--portal-border);
    border-radius:10px;
    background:var(--portal-raised);
    color:#d0d7e1;
    font:600 11px/1.45 var(--font);
    text-decoration:none;
    transition:background .15s,border-color .15s,color .15s;
}
.portal-page .site-share-option:hover{background:#2b3038;border-color:#f5a53b66;color:var(--portal-text)}
.portal-page .site-share-option small{margin-top:3px;color:var(--portal-muted);font:400 10px/1.4 var(--font)}
.portal-page .site-share-local .site-share-option{display:flex;flex-direction:column;align-items:flex-start;gap:10px;padding:14px;background:var(--portal-raised);border-color:var(--portal-border);text-align:left}
.portal-page .site-share-local .site-share-option:hover{background:#2b3038;border-color:#f5a53b66}
.portal-page .site-share-icon{width:40px;height:40px;border-radius:10px}
.portal-page .site-share-icon svg{width:22px;height:22px}
.portal-page .site-share-icon[data-brand=site]{background:#f5a53b18;color:var(--portal-accent);border:1px solid #f5a53b3b}
.portal-page .site-share-section-label{margin:18px 0 10px;color:var(--portal-muted);font:600 11px/1.5 var(--font)}
.portal-page .site-share-networks{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px}
.portal-page .site-share-networks .site-share-option{display:flex;flex-direction:column;align-items:center;text-align:center}
.portal-page .site-share-copy{margin-top:20px;padding-top:18px;border-color:var(--portal-border)}
.portal-page .site-share-copy label{display:block;margin-bottom:9px;color:#b7c0cd;font:600 11px/1.45 var(--font)}
.portal-page .site-share-copy>div{display:flex;align-items:stretch;min-width:0;border:1px solid #3a414d;border-radius:10px;background:#15181d;overflow:hidden;transition:border-color .15s,box-shadow .15s}
.portal-page .site-share-copy>div:focus-within{border-color:var(--portal-accent);box-shadow:0 0 0 2px #f5a53b18}
.portal-page .site-share-dialog .site-share-copy input[type="url"][readonly][data-share-link]{min-width:0;flex:1;width:100%;padding:12px 13px;border:0;border-radius:0!important;outline:0;background:transparent!important;color:#c1c9d5!important;box-shadow:none;font:400 12px/1.45 var(--font)}
.portal-page .site-share-copy button{display:flex;align-items:center;justify-content:center;gap:7px;flex:none;min-width:44px;min-height:42px;padding:11px 14px;border:0;border-left:1px solid #3a414d;border-radius:0;background:var(--portal-raised);color:var(--portal-accent);font:650 11px/1.4 var(--font);cursor:pointer;transition:background .15s}
.portal-page .site-share-copy button:hover{background:#f5a53b16}
.portal-page .site-share-copy svg{width:17px;height:17px}
.portal-page .site-share-status{min-height:0;margin:10px 0 0;color:var(--portal-accent);font:500 11px/1.6 var(--font);overflow-wrap:anywhere}
.portal-page .site-share-status:empty{display:none}
.portal-page .site-share-story{border-color:var(--portal-border);border-radius:11px;background:var(--portal-raised);color:var(--portal-text)}
.portal-page .site-share-story p{color:var(--portal-muted)}
.portal-page :is(.likes-dialog,.site-share-dialog) :is(button,a):focus-visible{outline:2px solid var(--portal-accent);outline-offset:3px}
.portal-page .likes-person[href]:focus-visible{outline-offset:-3px;border-radius:0}
.portal-page .site-share-copy button:focus-visible{outline-offset:-4px}

@media(max-width:540px){
    .portal-page :is(.likes-dialog,.site-share-dialog){width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:18px;border-radius:14px}
    .portal-page :is(.likes-dialog,.site-share-dialog) :is(.likes-dialog-heading,.site-share-heading){padding-bottom:15px;gap:12px}
    .portal-page :is(.likes-dialog-heading,.site-share-heading) h2{font-size:21px}
    .portal-page .site-share-heading .eyebrow{font-size:8px;letter-spacing:.07em}
    .portal-page :is(.likes-target,.site-share-caption){margin:14px 0 17px;font-size:12px}
    .portal-page .likes-summary{gap:7px}
    .portal-page .likes-summary>div{padding:12px 4px;border-radius:9px}
    .portal-page .likes-summary strong{font-size:23px}
    .portal-page .likes-summary span{font-size:10px}
    .portal-page .likes-help{font-size:10px}
    .portal-page .site-share-local{gap:7px;padding-bottom:16px}
    .portal-page .site-share-local .site-share-option{align-items:center;gap:8px;padding:12px 6px;text-align:center;font-size:10px}
    .portal-page .site-share-local .site-share-option small{font-size:9px}
    .portal-page .site-share-local .site-share-icon{width:36px;height:36px}
    .portal-page .site-share-networks{grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
    .portal-page .site-share-networks .site-share-option{padding:11px 5px;font-size:10px}
    .portal-page .site-share-copy input{padding:12px 10px}
    .portal-page .site-share-copy button{padding:10px 11px}
    .portal-page .site-share-copy button>span{display:none}
}
@media(prefers-reduced-motion:reduce){
    .portal-page :is(.likes-dialog,.site-share-dialog)::backdrop{backdrop-filter:none}
    .portal-page :is(.likes-close,.site-share-close,.site-share-option,.likes-person,.site-share-copy>div,.site-share-copy button){transition:none}
}

