/* Banana Friends · Momentos · momentos-base.css */

[hidden]{display: none !important;}

*{margin: 0;
    padding: 0;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent;}

html,
body{width: 100%;
    height: 100%;
    font-family: "Inter", -apple-system, BlinkMacSystemFont, sans-serif;
    background: #000;
    color: #000000;
    overflow: hidden;
    overscroll-behavior: none;}

:root{--bg-main: #000;

    --glass-strong: rgba(0,0,0,0.55);
    --glass-soft: rgba(0,0,0,0.38);

    --text-main: #ffffff;
    --text-soft: rgba(255,255,255,0.78);
    --text-muted: rgba(255,255,255,0.55);

    
    --accent-1: #ffb07a;
    --accent-2: #ff6a4a;
    --accent-3: #ff3f8e;
    --accent: #ff6a4a;
    --accent-gradient: #ff5a12;

    --radius-xl: 28px;
    --radius-lg: 22px;
    --radius-md: 16px;}

.app{height: 100dvh;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    padding-bottom: 140px;

    
    scroll-snap-type: y mandatory;
    scroll-behavior: smooth;}

.app::-webkit-scrollbar{display: none;}

.app.snap-off{scroll-snap-type: none !important;
    scroll-behavior: auto !important;}

.app.locked{position: fixed;
    left: 0;
    right: 0;
    width: 100%;
    overflow: hidden;}

.top-snap{scroll-snap-align: start;
    scroll-snap-stop: always;}

.brand-mark,
.brand-mark-text,
.location-switcher-main,
.location-switcher-sub,
.location-switcher-item{font-family: ui-rounded, "SF Pro Rounded", "Nunito Sans", "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, sans-serif;}

.header{padding:16px 16px 10px;}

.header-top{position:relative;
    display:grid;
    grid-template-columns:max-content 1fr max-content;
    align-items:center;
    column-gap:14px;
    min-height:68px;}

.brand-mark{display:flex;
    align-items:center;
    gap:12px;
    min-width:0;
    justify-self:start;}

.brand-mark-logo{width:52px;
    height:52px;
    object-fit:contain;
    border-radius:14px;
    flex:0 0 auto;}

.brand-mark-text{font-size:24px;
    font-weight:400;
    letter-spacing:-0.03em;
    color:#fff;
    line-height:1;}

.location-switcher{position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    z-index:20;}

.location-switcher summary{list-style:none;}

.location-switcher summary::-webkit-details-marker{display:none;}

.location-switcher-trigger{position:relative;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:4px;
    min-width:auto;
    padding-right:0;
    cursor:pointer;
    user-select:none;}

.location-switcher-main{font-size:24px;
    font-weight:400;
    line-height:1;
    color:#fff;
    letter-spacing:-0.03em;
    text-align:center;}

.location-switcher-subrow{position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:auto;
    gap:8px;}

.location-switcher-sub{font-size:11px;
    font-weight:500;
    line-height:1;
    text-align:center;
    color:rgba(255,255,255,0.72);}

.location-switcher-caret{position:static;
    width:15px;
    height:15px;
    stroke:rgba(255,255,255,0.78);
    stroke-width:2.2;
    fill:none;
    transition:transform .18s ease;}

.location-switcher[open] .location-switcher-caret{transform:rotate(180deg);}

.location-switcher-menu{margin-top:10px;
    min-width:190px;
    padding:8px;
    border-radius:18px;
    background:rgba(18,18,18,0.88);
    border:1px solid rgba(255,255,255,0.12);
    box-shadow:0 20px 50px rgba(0,0,0,0.34);
    backdrop-filter:blur(18px);
    -webkit-backdrop-filter:blur(18px);}

.location-switcher-item{width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:10px;
    padding:12px 14px;
    border:0;
    border-radius:14px;
    background:rgba(255,255,255,0.04);
    color:#fff;
    font-size:14px;
    font-weight:700;
    text-align:left;
    opacity:.74;}

.location-switcher-item span{font-size:12px;
    font-weight:600;
    color:rgba(255,255,255,0.55);}

.header-actions{justify-self:end;
    display:flex;
    align-items:center;
    gap:10px;}

.action-btn{width: 54px;
    height: 54px;
    border-radius: 50%;
    border: none;
    background: rgba(255,255,255,0.08);
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: transform 0.15s ease, background .2s ease;
    position: relative;
    cursor:pointer;}

.action-btn:active{transform: scale(0.92);}

.action-btn svg{width: 24px; height: 24px; stroke: #111827; stroke-width: 2.3; fill: none;}

.notif-dot{position:absolute;
    top:10px;
    right:10px;
    width:10px;
    height:10px;
    border-radius:50%;
    background: var(--accent-gradient);
    box-shadow: 0 0 0 2px #000, 0 0 10px rgba(255,106,74,0.95);}

.filters{display: flex;
    gap: 12px;
    padding: 14px 18px 10px;
    overflow-x: auto;}

.filters::-webkit-scrollbar{display: none;}

.filter{padding: 10px 16px;
    border-radius: 999px;
    border: 1px solid #000000;
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: 0 8px 20px rgba(0,0,0,0.08);
    font-size: 14px;
    color: #111111;
    white-space: nowrap;
    flex: 0 0 auto;}

.filter.active{background: #000000;
    color: #ffffff;
    font-weight: 600;
    box-shadow: 0 8px 20px rgba(0,0,0,0.16);}

.filter-map{width: 50px;
    height: 50px;
    min-width: 50px;
    min-height: 50px;
    padding: 0 !important;
    border-radius: 50% !important;
    border: 1px solid #000000;

    display: flex;
    align-items: center;
    justify-content: center;

    background: rgba(255, 255, 255, 0.96);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);

    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.10),
                inset 0 0 0 1px rgba(0, 0, 0, 0.04);

    cursor: pointer;
    text-decoration: none;
    flex: 0 0 auto;

    transition: transform .15s ease, box-shadow .2s ease;}

.filter-map svg{width: 22px; height: 22px; fill: none; stroke: #111111; stroke-width: 2;}

.filter-map:active{transform: scale(0.92);}

.filter-map.active{box-shadow: 0 10px 22px rgba(0, 0, 0, 0.24);
    background: #000000;
    border-color: #000000;}

.filter-map.active svg{stroke: #ffffff;}

.map-wrap{position: relative;
    width: 100vw;
    max-width: 100vw;
    margin: 0 calc(50% - 50vw);
    padding: 0;
    height: calc(100dvh - 152px);
    min-height: calc(100dvh - 152px);
    overflow: hidden;
    background: #ffffff;
    border: 0;
    border-radius: 0;
    box-shadow: none;}

.map-head{display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;}

.map-head-floating{position:absolute;
    top:0;
    left:0;
    right:0;
    z-index:5;
    pointer-events:none;}

.map-title{display:none;}

.map-sub{position:absolute;
    top:12px;
    left:12px;
    z-index:6;
    max-width:calc(100vw - 24px);
    font-size: 12px;
    color: #111111;
    text-align:left;
    background: rgba(255,255,255,0.92);
    border-radius: 999px;
    padding: 9px 12px;
    box-shadow: 0 8px 18px rgba(0,0,0,0.10);}

.map-sub-inline{position:absolute;}

.map-canvas{width: 100vw;
    height: 100%;
    border: 0;
    border-radius: 0;
    display:block;
    background:#ffffff;}

.map-photo-marker{position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    width:72px;
    height:72px;
    border-radius:999px;
    overflow:visible;
    border:0;
    box-shadow:none;
    background:transparent;
    text-decoration:none;}

.map-photo-marker__pulse{position:absolute;
    inset:7px;
    border-radius:999px;
    border:1.2px solid rgba(84, 166, 255, 0.34);
    background:transparent;
    transform:scale(0.92);
    animation:mapMarkerPulse 2.6s ease-out infinite;
    pointer-events:none;}

.map-photo-marker__pulse--two{animation-delay:1.3s;}

.map-photo-marker__avatar{position:relative;
    z-index:2;
    width:56px;
    height:56px;
    border-radius:999px;
    overflow:hidden;
    border:1.5px solid rgba(0,0,0,0.16);
    box-shadow:0 6px 14px rgba(0,0,0,0.14);
    background:#ffffff;}

.map-photo-marker img{width:100%;
    height:100%;
    object-fit:cover;
    display:block;
    border-radius:999px;}

@keyframes mapMarkerPulse{0%{
        opacity:0;
        transform:scale(0.78);
    }
    18%{
        opacity:0.65;
    }
    100%{
        opacity:0;
        transform:scale(1.34);
    }}

.map-info-card{display:flex;
    align-items:center;
    gap:12px;
    text-decoration:none;
    color:#111111;
    min-width:0;}

.map-info-card img{width:56px;
    height:56px;
    border-radius:50%;
    object-fit:cover;
    border:1px solid rgba(0,0,0,0.12);
    flex:0 0 auto;}

.map-info-copy{min-width:0;}

.map-info-title{font-size:14px;
    font-weight:800;
    color:#111111;
    line-height:1.2;
    margin-bottom:4px;}

.map-info-desc{font-size:12px;
    color:#333333;
    line-height:1.35;}

.create-plan-wrap{padding: 8px 18px 4px;}

.create-plan-btn{width: 100%;
    height: 56px;
    border: none;
    border-radius: 18px;

    display: flex;
    align-items: center;
    justify-content: space-between;

    padding: 0 16px;

    background: rgba(15,23,42,0.04);
    backdrop-filter: blur(20px) saturate(160%);
    -webkit-backdrop-filter: blur(20px) saturate(160%);

    box-shadow: 0 10px 22px rgba(0,0,0,0.35),
                inset 0 0 0 1px rgba(255,255,255,0.10);

    color: rgba(0,0,0,0.92);
    cursor: pointer;}

.create-plan-btn:active{transform: scale(0.985);}

.create-plan-left{display: flex; align-items: center; gap: 12px;}

.create-plan-text{display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.05;}

.create-plan-dot{width: 12px;
    height: 12px;
    border-radius: 50%;
    background: var(--accent-gradient);
    box-shadow: 0 0 14px rgba(255,106,74,0.55);
    flex: 0 0 auto;}

.create-plan-title{font-size: 15px;
    font-weight: 800;
    letter-spacing: 0.2px;
    margin: 0;}

.create-plan-sub{font-size: 12px;
    color: rgba(255,255,255,0.65);
    margin: 2px 0 0 0;}

.create-plan-arrow{width: 42px;
    height: 42px;
    border-radius: 50%;
    border: none;

    background: rgba(255, 106, 74, 0.18);
    box-shadow: 0 10px 18px rgba(0,0,0,0.35),
                inset 0 0 0 1px rgba(255,255,255,0.10);

    display: flex;
    align-items: center;
    justify-content: center;}

.create-plan-arrow svg{width: 22px; height: 22px; stroke: #111827; stroke-width: 2.6; fill: none;}

.card{margin: 0 0 14px;
    border-radius: 0;
    overflow: hidden;
    position: relative;
    background: rgba(255,255,255,0.02);

    
    height: 100dvh;

    
    padding-top: 10px;

    scroll-snap-align: start;
    scroll-snap-stop: always;}

.card-image{width: 100%;
    height: calc(100% - 10px);
    position: relative;
    overflow: hidden;
    background: #ffffff;

    
    border-top-left-radius: 28px;
    border-top-right-radius: 28px;}

.card-image img{width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;

    border-top-left-radius: 28px;
    border-top-right-radius: 28px;}

.card-overlay{position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0,0,0,0.92), rgba(0,0,0,0.36), rgba(0,0,0,0.04));}

.card-glass-meta{position: absolute;
    left: 14px;
    right: 14px;
    bottom: calc(12px + 84px);
    color: #0f172a;
    background:
        linear-gradient(180deg, rgba(255,255,255,0.96) 0%, rgba(249,250,251,0.94) 100%),
        rgba(255,255,255,0.92);
    backdrop-filter: blur(26px) saturate(145%);
    -webkit-backdrop-filter: blur(26px) saturate(145%);
    border: 1px solid rgba(255,255,255,0.82);
    box-shadow:
        0 20px 48px rgba(0,0,0,0.22),
        0 2px 10px rgba(15,23,42,0.08),
        inset 0 1px 0 rgba(255,255,255,0.92);
    padding: 16px;
    border-radius: 30px;}

.card-glass-meta::before{content: "";
    position: absolute;
    inset: 1px;
    border-radius: 29px;
    background: linear-gradient(180deg, rgba(255,255,255,0.72), rgba(255,255,255,0.12));
    pointer-events: none;}

.card-glass-meta > *{position: relative;
    z-index: 1;}

.meta-title{font-size: 18px;
    font-weight: 900;
    letter-spacing: 0.2px;
    text-align: left;
    margin-bottom: 6px;
    line-height: 1.2;}

.meta-subdesc{font-size: 13px;
    color: rgba(15,23,42,0.70);
    text-align: left;
    margin: 0 0 10px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;}

.meta-location{display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
    font-size: 12.5px;
    color: rgba(15,23,42,0.78);
    padding: 10px 12px;
    margin-bottom: 10px;
    border-radius: 16px;
    background: rgba(15,23,42,0.04);
    border: 1px solid rgba(15,23,42,0.08);}

.meta-location svg{width: 16px;
    height: 16px;
    flex: 0 0 auto;
    stroke: #111827;
    stroke-width: 2;
    fill: none;}

.meta-location span{min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;}

.meta-stats{display: flex;
    justify-content: flex-start;
    gap: 8px;
    font-size: 12px;
    color: #0f172a;
    opacity: 0.96;
    margin-bottom: 14px;
    flex-wrap: wrap;}

.meta-stats span{display: inline-flex;
    align-items: center;
    min-height: 30px;
    padding: 0 12px;
    border-radius: 999px;
    background: rgba(15,23,42,0.06);
    border: 1px solid rgba(15,23,42,0.08);
    color: #0f172a;
    font-weight: 700;}

.plan-actions{display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;}

.plan-actions-left,
.plan-actions-right{display: flex;
    align-items: center;
    gap: 10px;}

.plan-actions-right{margin-left: auto;}

.plan-action-btn,
.plan-details-btn{width: 50px;
    height: 50px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.15s ease, background 0.2s ease, box-shadow 0.2s ease;}

.plan-action-btn{border: 1px solid rgba(255,255,255,0.12);
    background: rgba(255,255,255,0.12);
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.10);}

.plan-action-btn:hover{background: rgba(255,255,255,0.18);}

.plan-action-btn:active,
.plan-details-btn:active,
.plan-join-btn:active{transform: scale(0.95);}

.plan-action-btn svg{width: 22px; height: 22px; stroke: #111827; stroke-width: 2; fill: none;}

.plan-action-btn.btn-edit-plan svg{width: 21px; height: 21px;}

.plan-details-btn{border: 1px solid rgba(0,0,0,0.08);
    background: #ffffff;
    color: #111111;
    box-shadow: 0 12px 26px rgba(0,0,0,0.18), inset 0 0 0 1px rgba(0,0,0,0.04);}

.plan-details-btn svg{width: 22px; height: 22px; stroke: #111111; stroke-width: 2.6; fill: none;}

.plan-join-btn{min-width: 164px;
    height: 50px;
    padding: 0 16px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.08);
    background: #17171a;
    color: #ffffff;
    display: inline-flex;
    align-items: center;
    gap: 10px;
    box-shadow:
        0 14px 28px rgba(0,0,0,0.18),
        inset 0 1px 0 rgba(255,255,255,0.08);}

.plan-join-btn:hover{filter: brightness(1.03);}

.plan-join-btn__icon{width: 30px;
    height: 30px;
    border-radius: 999px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.10);
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.08);}

.plan-join-btn__icon svg{width: 17px;
    height: 17px;
    stroke: currentColor;
    stroke-width: 2.1;
    fill: none;}

.plan-join-btn__text{font-size: 13px;
    font-weight: 800;
    letter-spacing: -0.01em;
    white-space: nowrap;}

.plan-join-btn.is-joined{background: #123b7c;
    border-color: rgba(120,177,255,0.26);}

.plan-join-btn.is-banned{background: #7b1717;
    border-color: rgba(255,154,154,0.18);}

.plan-join-btn.is-closed{background: rgba(255,255,255,0.08);
    color: rgba(255,255,255,0.78);}

.plan-join-btn[disabled]{opacity: 0.72;
    cursor: default;}

.pill-nav{position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    z-index: 320;

    display: flex;
    align-items: stretch;
    justify-content: space-between;
    gap: 8px;

    height: 74px;
    padding: 8px;

    background: rgba(255,255,255,0.92);
    border: 1px solid rgba(15, 23, 42, 0.08);
    border-radius: 28px;
    backdrop-filter: blur(18px) saturate(160%);
    -webkit-backdrop-filter: blur(18px) saturate(160%);

    box-shadow:
        0 22px 55px rgba(15, 23, 42, 0.16),
        0 8px 22px rgba(15, 23, 42, 0.08),
        inset 0 1px 0 rgba(255,255,255,0.72);}

.pill-nav::before{content: "";
    position: absolute;
    inset: 1px;
    border-radius: 27px;
    background: linear-gradient(180deg, rgba(255,255,255,0.55), rgba(255,255,255,0.08));
    pointer-events: none;}

.pill-item{position: relative;
    z-index: 1;
    flex: 1;
    min-width: 0;
    height: 100%;
    border-radius: 22px;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 5px;

    text-decoration: none;
    color: #0f172a;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: -0.01em;

    transition:
        transform .18s ease,
        background .22s ease,
        color .22s ease,
        box-shadow .22s ease;}

.pill-item svg{width: 22px;
    height: 22px;
    stroke: currentColor;
    fill: none;
    stroke-width: 2;
    transition: transform .22s ease, stroke .22s ease;}

.pill-item .pill-text{white-space: nowrap;}

.pill-item:hover{background: rgba(15, 23, 42, 0.05);}

.pill-item:active{transform: translateY(1px) scale(0.97);}

.pill-item.active{background: #17171a;
    color: #ffffff;
    box-shadow:
        0 12px 24px rgba(17,17,17,0.28),
        inset 0 1px 0 rgba(255,255,255,0.12);}

.pill-item.active svg{stroke: #ffffff;
    transform: translateY(-1px) scale(1.02);}

.pill-item.active .pill-dot{background: #ffffff;
    box-shadow: 0 0 0 4px rgba(255,255,255,0.16);}

.pill-label{display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    line-height: 1;}

.pill-dot{width: 6px;
    height: 6px;
    border-radius: 999px;
    background: #111111;}

body{padding-bottom: 118px;}

.comments-sheet{position: fixed;
    left: 0;
    right: 0;
    bottom: -100%;
    height: 70vh;
    background: #ffffff;
    border-radius: 26px 26px 0 0;
    z-index: 300;
    padding: 18px;
    transition: bottom .35s ease;
    display: flex;
    flex-direction: column;
    gap: 14px;
    box-shadow: 0 -24px 60px rgba(0,0,0,0.55);}

.comments-sheet.open{bottom: 0;}

.comments-overlay{position: fixed;
    inset: 0;
    background: rgba(0,0,0,.55);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    z-index: 299;
    display: none;}

.sheet-handle{width: 58px;
    height: 5px;
    border-radius: 999px;
    background: rgba(0,0,0,0.14);
    margin: 4px auto 2px;}

.sheet-title{font-size: 16px; font-weight: 900; letter-spacing: 0.2px; text-align: center; color:#000;}

.comments-list{flex: 1; overflow-y: auto; padding-bottom: 92px;}

.comments-list::-webkit-scrollbar{width: 6px;}

.comments-list::-webkit-scrollbar-thumb{background: rgba(0,0,0,0.18); border-radius: 999px;}

.comment-item{display: flex; gap: 12px; padding: 14px 4px; border-bottom: 1px solid rgba(15,23,42,0.08);}

.comment-avatar-link{flex: 0 0 auto; display: inline-flex;}

.comment-avatar{width: 44px; height: 44px; border-radius: 50%; object-fit: cover;
    box-shadow: 0 0 0 1px rgba(15,23,42,0.08), 0 10px 22px rgba(15,23,42,0.12);}

.comment-body{flex: 1; min-width: 0;}

.comment-header{display: block;}

.comment-header-main{display:flex; flex-direction:column; gap:4px; min-width:0;}

.comment-meta{display:flex;
    align-items:center;
    gap:8px;
    flex-shrink:0;}

.comment-delete-btn{appearance:none;
    border:0;
    background: transparent;
    color: rgba(0,0,0,0.72);
    padding: 4px;
    border-radius: 10px;
    cursor: pointer;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    transition: opacity .15s ease, transform .15s ease, background .15s ease;}

.comment-delete-btn svg{width: 15px; height: 15px;}

.comment-delete-btn:hover{background: rgba(0,0,0,0.06); color: rgba(0,0,0,0.92);}

.comment-delete-btn:active{transform: scale(0.96);}

.comment-delete-btn:disabled{opacity: .35; cursor: default;}

.comment-name{font-weight: 900;
    font-size: 13px;
    color: rgba(0,0,0,0.94);
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
    flex-wrap: wrap;}

.verified-badge-img{width: 17px;
    height: 17px;
    object-fit: contain;
    flex: 0 0 auto;
    filter: drop-shadow(0 6px 12px rgba(255,106,74,0.22));}

.comment-date{font-size: 11px; color: rgba(0,0,0,0.52); white-space: nowrap;}

.comment-text{margin-top: 8px; font-size: 13px; color: rgba(0,0,0,0.86); line-height: 1.5; word-break: break-word;}

.comment-input{position: sticky;
    bottom: 0;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 14px 16px 18px;
    margin: 0 -16px;
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border-top: 1px solid rgba(0,0,0,0.10);
    z-index: 20;}

.comment-input input{flex: 1;
    height: 46px;
    padding: 0 18px;
    border-radius: 999px;
    border: 1px solid rgba(0,0,0,0.12);
    background: #ffffff;
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    color: #000000;
    font-size: 14px;
    outline: none;}

.comment-input input::placeholder{color: rgba(0,0,0,0.45);}

.comment-input button{width: 46px;
    height: 46px;
    border-radius: 50%;
    border: none;
    background: #000000;
    box-shadow: 0 8px 22px rgba(0,0,0,0.18),
                inset 0 0 0 1px rgba(255,255,255,0.08);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    transition: transform 0.15s ease, box-shadow 0.2s ease;}

.comment-input button:active{transform: scale(0.92);}

.comments-login-more{margin: 0 0 6px;
    padding: 14px 16px;
    border-radius: 18px;
    background: #000000;
    color: #ffffff;
    font-size: 13px;
    line-height: 1.4;
    text-align: center;}

.comments-login-link{display: inline-block;
    margin-left: 8px;
    color: #ffffff;
    font-weight: 800;
    text-decoration: underline;}

.comment-input button::before{content: "";
    width: 18px;
    height: 18px;
    display: block;
    background: currentColor;
    mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M22 2L11 13' stroke='black' stroke-width='2' fill='none'/><path d='M22 2L15 22L11 13L2 9L22 2Z' fill='black'/></svg>") center / contain no-repeat;
    -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M22 2L11 13' stroke='black' stroke-width='2' fill='none'/><path d='M22 2L15 22L11 13L2 9L22 2Z' fill='black'/></svg>") center / contain no-repeat;
    color: #ffffff;}

.create-overlay{position: fixed;
    inset: 0;
    background: rgba(0,0,0,.58);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    z-index: 349;
    display: none;}

.create-sheet{position: fixed;
    left: 0;
    right: 0;
    bottom: -120%;
    height: min(88vh, 880px);
    background: #ffffff;
    color: #090909;
    border-radius: 28px 28px 0 0;
    z-index: 350;
    padding: 18px 18px 0;
    transition: bottom .35s ease;
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-shadow: 0 -26px 60px rgba(0,0,0,0.18);
    border-top: 1px solid rgba(0,0,0,0.06);}

.create-sheet.open{bottom: 0;}

.create-header--pro{align-items:flex-start;}

.create-kicker{font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:rgba(0,0,0,.45);margin-bottom:6px;}

.create-header{display: flex; justify-content: space-between; gap: 14px;}

.create-title{font-size: 22px; line-height:1.1; font-weight: 900; color:#0d0d0d;}

.create-subtitle{font-size:13px;line-height:1.45;color:rgba(0,0,0,.58);max-width:46ch;margin-top:6px;}

.create-close{width: 44px;
    height: 44px;
    min-width:44px;
    border-radius: 50%;
    border: 1px solid rgba(0,0,0,0.08);
    background: #f4f4f4;
    color: #111;
    cursor: pointer;}

.create-close:active{transform: scale(0.96);}

.create-form{flex: 1; overflow-y: auto; padding-bottom: 120px;}

.create-form--pro{padding-right:2px;}

.create-section-card{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:24px;padding:16px 16px 14px;margin-top:12px;box-shadow:0 12px 26px rgba(0,0,0,.04);}

.create-section-title{font-size:13px;font-weight:900;color:#111;margin-bottom:8px;}

.form-row{display: grid; grid-template-columns: 1fr 1fr; gap: 12px;}

.form-field{display: flex; flex-direction: column; gap: 8px; margin-top: 12px;}

.form-field:first-child{margin-top:0;}

.form-field label{font-size: 12px; font-weight:800; color: rgba(0,0,0,0.62);}

.form-field input,
.form-field textarea,
.form-field select{width: 100%;
    border: 1px solid rgba(0,0,0,0.10);
    outline: none;
    border-radius: 18px;
    padding: 15px 16px;
    background: #fbfbfb;
    color: #121212;
    font-size: 14px;
    box-shadow: inset 0 1px 0 rgba(255,255,255,0.75);}

.form-field input:focus,
.form-field textarea:focus,
.form-field select:focus{border-color:#111; box-shadow:0 0 0 4px rgba(0,0,0,.05); background:#fff;}

.form-field textarea{min-height: 118px; resize: vertical;}

.form-field--location{position:relative;}

.location-input-wrap{position:relative;display:flex;align-items:center;}

.location-input-wrap input{padding-left:44px;padding-right:44px;}

.location-input-icon{position:absolute;left:16px;top:50%;transform:translateY(-50%);font-size:18px;color:rgba(0,0,0,.52);pointer-events:none;z-index:2;}

.location-clear{position:absolute;right:12px;top:50%;transform:translateY(-50%);width:28px;height:28px;border:none;border-radius:50%;background:#ececec;color:#111;display:flex;align-items:center;justify-content:center;cursor:pointer;}

.location-clear:active{transform:translateY(-50%) scale(.95);}

.location-selected-card{margin-top:10px;padding:12px 14px;border-radius:16px;background:#f6f6f6;border:1px solid rgba(0,0,0,.06);}

.location-selected-title{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:rgba(0,0,0,.45);}

.location-selected-address{font-size:14px;font-weight:800;color:#111;margin-top:4px;}

.location-selected-meta{font-size:12px;color:rgba(0,0,0,.56);margin-top:4px;}

.places-dropdown{position:relative;margin-top:10px;border:1px solid rgba(0,0,0,.08);background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 20px 34px rgba(0,0,0,.10);}

.pac-container{border-radius:18px !important;border:1px solid rgba(0,0,0,.08) !important;box-shadow:0 20px 34px rgba(0,0,0,.10) !important;padding:6px 0;}

.pac-item{padding:10px 14px !important;font-size:14px !important;}

.pac-item:hover{background:#f7f7f7 !important;}

.form-field--file input[type="file"]{padding:12px;background:#fff;}

.file-preview{margin-top:10px;border-radius:18px;overflow:hidden;border:1px solid rgba(0,0,0,.08);background:#f6f6f6;}

.file-preview img{display:block;width:100%;height:180px;object-fit:cover;}

.form-hint{font-size: 12px; color: rgba(0,0,0,0.50); margin-top: 6px; line-height:1.45;}

.create-footer{position: sticky;
    bottom: 0;
    margin: 0 -18px;
    padding: 14px 18px 18px;
    background: rgba(255,255,255,0.96);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border-top: 1px solid rgba(0,0,0,0.08);}

.create-submit{width: 100%;
    height: 56px;
    border: none;
    border-radius: 20px;
    background: #111;
    color: #fff;
    font-weight: 900;
    font-size: 15px;
    cursor: pointer;
    box-shadow: 0 14px 30px rgba(0,0,0,0.18);}

.create-submit:active{transform: scale(0.99);}

@media (min-width: 900px){
.create-sheet{left:50%;right:auto;transform:translateX(-50%);width:min(760px, calc(100vw - 48px));height:min(88vh, 920px);border-radius:30px;bottom:-140%;}

.create-sheet.open{bottom:24px;}
}

@media (max-width: 640px){
.form-row{grid-template-columns:1fr;}

.create-title{font-size:20px;}
}

.edit-overlay{position: fixed;
    inset: 0;
    background: rgba(0,0,0,.58);
    backdrop-filter: blur(7px);
    -webkit-backdrop-filter: blur(7px);
    z-index: 359;
    display: none;}

.edit-sheet{position: fixed;
    left: 0;
    right: 0;
    bottom: -120%;
    height: 82vh;
    background: #0b0b0d;
    border-radius: 26px 26px 0 0;
    z-index: 360;
    padding: 18px;
    transition: bottom .35s ease;
    display: flex;
    flex-direction: column;
    gap: 12px;
    box-shadow: 0 -26px 60px rgba(0,0,0,0.58);}

.edit-sheet.open{bottom: 0;}

.edit-header{display: flex; align-items: center; justify-content: space-between; gap: 12px;}

.edit-title{font-size: 16px; font-weight: 900;}

.edit-close{width: 44px;
    height: 44px;
    border-radius: 50%;
    border: none;
    background: rgba(15,23,42,0.04);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    color: #fff;
    cursor: pointer;}

.edit-close:active{transform: scale(0.92);}

.edit-form{flex: 1; overflow-y: auto; padding-bottom: 84px;}

.edit-footer{position: sticky;
    bottom: 0;
    margin: 0 -18px;
    padding: 14px 18px 18px;
    background: rgba(12,12,15,0.92);
    backdrop-filter: blur(22px);
    -webkit-backdrop-filter: blur(22px);
    border-top: 1px solid rgba(255,255,255,0.08);}

.edit-submit{width: 100%;
    height: 54px;
    border: none;
    border-radius: 18px;
    background: var(--accent-gradient);
    box-shadow: 0 12px 26px rgba(255,106,74,0.22),
                inset 0 0 0 1px rgba(255,255,255,0.14);
    color: #fff;
    font-weight: 900;
    font-size: 15px;
    cursor: pointer;}

.edit-submit:active{transform: scale(0.99);}

.ui-modal-overlay{position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: 600;
    display: none;}

.ui-modal{position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: min(92vw, 420px);
    z-index: 601;
    display: none;}

.ui-modal-card{background: rgba(15,23,42,0.04);
    backdrop-filter: blur(26px) saturate(160%);
    -webkit-backdrop-filter: blur(26px) saturate(160%);
    border-radius: 22px;
    padding: 16px 16px 14px;
    box-shadow: 0 26px 70px rgba(0,0,0,0.55),
                inset 0 0 0 1px rgba(255,255,255,0.10);}

.ui-modal-title{font-size: 15px; font-weight: 900; margin-bottom: 6px;}

.ui-modal-msg{font-size: 13px; color: rgba(255,255,255,0.78); line-height: 1.35;}

.ui-modal-actions{display: flex; gap: 10px; margin-top: 14px; justify-content: flex-end;}

.ui-btn{height: 44px;
    padding: 0 14px;
    border-radius: 14px;
    border: none;
    cursor: pointer;
    background: rgba(255,255,255,0.12);
    color: rgba(255,255,255,0.92);
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
    box-shadow: inset 0 0 0 1px rgba(255,255,255,0.10);
    font-weight: 800;}

.ui-btn:active{transform: scale(0.98);}

.ui-btn.primary{background: var(--accent-gradient);
    box-shadow: 0 12px 22px rgba(255,106,74,0.18),
                inset 0 0 0 1px rgba(255,255,255,0.14);
    color: #fff;}

@media (min-width: 769px){
.card{margin: 0; border-radius: 0; height: 100dvh; padding-top: 12px;}

.card-image{height: calc(100% - 12px);}

.pill-nav{left: 50%;
        right: auto;
        bottom: calc(18px + env(safe-area-inset-bottom, 0px));
        transform: translateX(-50%);
        width: min(760px, calc(100vw - 44px));
        max-width: 760px;
        min-width: 520px;
        height: 82px;
        padding: 10px;
        border-radius: 32px;}

.pill-nav::before{border-radius: 31px;}

.pill-item{font-size: 13px; gap: 7px; border-radius: 24px;}

.pill-item svg{width: 24px; height: 24px;}

.filters{touch-action: pan-y;
 padding: 16px 22px 12px;}

.create-plan-wrap{padding: 10px 22px 4px;
        max-width: 980px;
        margin: 0 auto;}

.map-wrap{width: 100vw;
        max-width: 100vw;
        margin: 0 calc(50% - 50vw);
        height: calc(100dvh - 160px);
        min-height: calc(100dvh - 160px);}
}

@media (max-width: 420px){
.pill-nav{left: 10px;
        right: 10px;
        height: 70px;
        padding: 7px;
        border-radius: 24px;}

.pill-nav::before{border-radius: 23px;}

.pill-item{border-radius: 19px; font-size: 10.5px;}

.pill-item svg{width: 21px; height: 21px;}

.card{padding-top: 10px;}

.card-image{height: calc(100% - 10px);}
}

.app.no-snap{scroll-snap-type: none !important;}

.plan-avatars{position: absolute;
    right: 14px;
    top: 14px;
    z-index: 6;
    display: flex;
    align-items: center;
    gap: 8px;
    pointer-events: auto;}

.plan-avatars-row{display: flex;
    align-items: center;
    flex-direction: row-reverse;}

.plan-avatars-row .pav{width: 34px;
    height: 34px;
    border-radius: 999px;
    overflow: hidden;
    background: rgba(15,23,42,0.04);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 10px 24px rgba(0,0,0,0.45), inset 0 0 0 1px rgba(255,255,255,0.16);
    margin-right: -10px;}

.plan-avatars-row .pav:first-child{margin-right: 0;}

.plan-avatars-row .pav img{width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;}

.plan-avatars-row .pav{display:block;
    text-decoration:none;
    position:relative;}

.plan-avatars-row .pav.pav-creator{width: 40px;
    height: 40px;
    z-index: 2;}

.plan-avatars-row .pav.pav-creator img{box-shadow: 0 0 0 2px rgba(255,255,255,0.75);}

.plan-avatars-hint{font-size: 12px;
    color: rgba(15,23,42,0.78);
    background: rgba(255,255,255,0.92);
    border-radius: 999px;
    padding: 6px 10px;
    box-shadow: inset 0 0 0 1px rgba(15,23,42,0.08), 0 8px 20px rgba(0,0,0,0.12);}

.card.card-updated .card-glass-meta{animation: planMetaPop 650ms ease;}

.card.card-updated .card-image img{animation: planImgSoft 650ms ease;}

@keyframes planMetaPop{0%{ transform: translate3d(0,6px,0); opacity: .86; }
    100%{ transform: translate3d(0,0,0); opacity: 1; }}

@keyframes planImgSoft{0%{ transform: scale(1.01); filter: saturate(1.02); }
    100%{ transform: scale(1); filter: none; }}

.action-btn.notify{position: relative;}

.action-btn.notify .notif-dot{position:absolute;
  top:6px;
  right:6px;
  width:8px;
  height:8px;
  border-radius:999px;
  background: var(--accent-2, #ff6a4a);}

@media (max-width: 640px){
.header{padding-inline:12px;}

.header-top{column-gap:10px; min-height:62px;}

.brand-mark{gap:10px;}

.brand-mark-logo{width:40px; height:40px;}

.brand-mark-text,
.location-switcher-main{font-size:18px;}
}

html,
body{background: #ffffff !important;
    color: #000000 !important;}

.app{background: #ffffff !important;}

.top-snap,
.header,
.header-top{background: transparent !important;}

.brand-mark-text,
.location-switcher-main,
.location-switcher-sub,
.action-btn,
.action-btn svg{color: #000000 !important;
    stroke: #000000 !important;}

.location-switcher-main{color:#000000 !important;}

.location-switcher-sub{color:rgba(0,0,0,0.72) !important;}

.location-switcher-caret{stroke:rgba(0,0,0,0.78) !important;}

.header{padding-inline:16px !important;}

.header-top{position:relative !important;
    display:grid !important;
    grid-template-columns:max-content 1fr max-content;
    align-items:center;
    column-gap:14px;
    min-height:68px;}

.brand-mark{justify-self:start;
    align-items:center;}

.location-switcher{position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%);
    margin:0;}

.location-switcher-trigger{min-width:auto;
    padding-right:18px;}

.location-switcher-subrow{position:relative;
    justify-content:center;
    width:100%;
    gap:0;}

.location-switcher-sub{display:block;
    width:100%;
    text-align:center;}

.location-switcher-caret{position:absolute;
    right:-2px;
    top:50%;
    transform:translateY(1px);}

.location-switcher[open] .location-switcher-caret{transform:translateY(1px) rotate(180deg);}

.header-actions{justify-self:end;
    align-items:center;}

.action-btn{width: 54px;
    height: 54px;
    border-radius: 50%;
    border: none;
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    box-shadow: none !important;}

.notif-dot{box-shadow: 0 0 0 2px #ffffff, 0 0 10px rgba(255,106,74,0.95);}

@media (max-width: 640px){
.header{padding-inline:12px !important;}

.brand-mark-logo{width:40px;
        height:40px;}

.brand-mark-text,
.location-switcher-main{font-size:18px;}

.location-switcher-trigger{min-width:128px;
        padding-right:20px;}

.location-switcher-sub{font-size:10px;}

.location-switcher-menu{min-width:176px;}
}

.header{padding:16px 16px 10px !important;
    background:transparent !important;}

.header-top{position:relative !important;
    display:grid !important;
    grid-template-columns:max-content 1fr max-content !important;
    align-items:center !important;
    column-gap:14px !important;
    min-height:68px !important;
    background:transparent !important;}

.brand-mark{display:flex !important;
    align-items:center !important;
    gap:12px !important;
    min-width:0 !important;
    justify-self:start !important;}

.brand-mark-logo{width:52px !important;
    height:52px !important;
    object-fit:contain !important;
    border-radius:14px !important;
    flex:0 0 auto !important;}

.brand-mark-text{font-size:24px !important;
    font-weight:400 !important;
    letter-spacing:-0.03em !important;
    line-height:1 !important;}

.location-switcher{position:absolute !important;
    top:50% !important;
    left:50% !important;
    transform:translate(-50%, -50%) !important;
    z-index:20 !important;
    margin:0 !important;}

.location-switcher-trigger{position:relative !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    min-width:auto !important;
    padding-right:0 !important;
    cursor:pointer !important;
    user-select:none !important;}

.location-switcher-main{font-size:24px !important;
    font-weight:400 !important;
    line-height:1 !important;
    letter-spacing:-0.03em !important;
    text-align:center !important;}

.location-switcher-subrow{position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:auto !important;
    gap:8px !important;}

.location-switcher-sub{display:block !important;
    width:100% !important;
    font-size:11px !important;
    font-weight:500 !important;
    line-height:1 !important;
    text-align:center !important;}

.location-switcher-caret{position:absolute !important;
    right:-2px !important;
    top:50% !important;
    width:15px !important;
    height:15px !important;
    transform:translateY(1px) !important;
    stroke-width:2.2 !important;
    fill:none !important;
    transition:transform .18s ease !important;}

.location-switcher[open] .location-switcher-caret{transform:translateY(1px) rotate(180deg) !important;}

.header-actions{justify-self:end !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;}

.action-btn{width:54px !important;
    height:54px !important;
    border-radius:50% !important;
    border:none !important;
    background:transparent !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    box-shadow:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    transition:transform .15s ease !important;
    position:relative !important;
    cursor:pointer !important;}

.action-btn:active{transform:scale(.92) !important;}

.action-btn svg{width:24px !important;
    height:24px !important;
    stroke-width:2.3 !important;
    fill:none !important;}

.action-btn.notify{position:relative !important;}

.action-btn.notify .notif-dot,
.notif-dot{position:absolute !important;
    top:10px !important;
    right:10px !important;
    width:10px !important;
    height:10px !important;
    border-radius:50% !important;
    box-shadow:0 0 0 2px #ffffff, 0 0 10px rgba(255,106,74,0.95) !important;}

@media (max-width: 640px){
.header{padding-inline:12px !important;}

.header-top{column-gap:10px !important;
        min-height:62px !important;}

.brand-mark{gap:10px !important;}

.brand-mark-logo{width:40px !important;
        height:40px !important;}

.brand-mark-text,
.location-switcher-main{font-size:18px !important;}

.location-switcher-trigger{min-width:128px !important;
        padding-right:20px !important;}

.location-switcher-sub{font-size:10px !important;}

.location-switcher-menu{min-width:176px !important;}

.location-switcher-caret{right:0 !important;}
}

#mapTabWrap{width:100vw;
    max-width:100vw;
    margin:0 calc(50% - 50vw);
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;}

#mapTabWrap .map-canvas,
#mapTabWrap #map{width:100vw !important;
    border:0 !important;
    border-radius:0 !important;}

.biz-wrap{width:min(1120px, calc(100% - 24px));
    margin:16px auto 32px;
    display:grid;
    gap:18px;
    color:#111;}

.biz-hero,
.biz-card,
.biz-section,
.biz-contact-card{background:#fff;
    border:1px solid rgba(0,0,0,.08);
    border-radius:28px;
    box-shadow:0 18px 42px rgba(0,0,0,.10);}

.biz-hero{padding:26px;
    display:grid;
    gap:18px;
    overflow:hidden;
    position:relative;}

.biz-hero::after{content:"";
    position:absolute;
    inset:auto -50px -70px auto;
    width:220px;
    height:220px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(0,0,0,.06), transparent 65%);
    pointer-events:none;}

.biz-eyebrow{display:inline-flex;
    align-items:center;
    width:max-content;
    padding:8px 12px;
    border-radius:999px;
    background:#f6f6f6;
    border:1px solid rgba(0,0,0,.08);
    font-size:12px;
    font-weight:700;
    color:#111;}

.biz-title{font-size:clamp(26px, 4vw, 40px);
    line-height:1.02;
    letter-spacing:-.04em;
    color:#111;}

.biz-text{max-width:760px;
    font-size:15px;
    line-height:1.65;
    color:rgba(17,17,17,.78);}

.biz-hero-badges{display:flex;
    gap:10px;
    flex-wrap:wrap;}

.biz-badge{padding:10px 14px;
    border-radius:999px;
    background:#111;
    color:#fff;
    font-size:13px;
    font-weight:600;}

.biz-grid{display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:16px;}

.biz-card{padding:22px;
    display:flex;
    gap:16px;
    align-items:flex-start;}

.biz-card-icon{width:54px;
    height:54px;
    border-radius:18px;
    background:#111;
    color:#fff;
    display:grid;
    place-items:center;
    font-size:24px;
    flex:0 0 auto;}

.biz-card-body h3,
.biz-section-head h3,
.biz-contact-card h3{font-size:20px;
    line-height:1.15;
    letter-spacing:-.03em;
    color:#111;
    margin-bottom:8px;}

.biz-card-body p,
.biz-section-head p,
.biz-contact-card p,
.biz-feature span{font-size:14px;
    line-height:1.65;
    color:rgba(17,17,17,.78);}

.biz-section{padding:24px;
    display:grid;
    gap:20px;}

.biz-feature-list{display:grid;
    grid-template-columns:repeat(3, minmax(0,1fr));
    gap:14px;}

.biz-feature{border-radius:22px;
    background:#f8f8f8;
    border:1px solid rgba(0,0,0,.06);
    padding:18px;
    display:grid;
    gap:8px;}

.biz-feature strong{color:#111;
    font-size:15px;
    letter-spacing:-.02em;}

.biz-contact-card{padding:24px;
    display:flex;
    align-items:flex-end;
    justify-content:space-between;
    gap:16px;}

.biz-contact-actions{display:flex;
    flex-wrap:wrap;
    gap:12px;}

.biz-cta{min-height:48px;
    padding:0 18px;
    border-radius:16px;
    border:1px solid rgba(0,0,0,.14);
    background:#fff;
    color:#111;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    font-weight:700;
    font-size:14px;}

.biz-cta-primary{background:#111;
    color:#fff;
    border-color:#111;}

@media (max-width: 980px){
.biz-grid,
.biz-feature-list{grid-template-columns:1fr;}

.biz-contact-card{flex-direction:column;
        align-items:flex-start;}
}

@media (max-width: 640px){
.biz-wrap{width:calc(100% - 16px);
        margin:14px auto 26px;}

.biz-hero,
.biz-card,
.biz-section,
.biz-contact-card{border-radius:24px;}

.biz-hero,
.biz-section,
.biz-contact-card,
.biz-card{padding:18px;}

.biz-title{font-size:28px;}

.biz-card{gap:14px;}

.biz-card-icon{width:48px;height:48px;border-radius:16px;font-size:21px;}

.biz-contact-actions{width:100%;}

.biz-cta{flex:1 1 100%; width:100%;}
}

.comment-login-gate{display: grid;
    gap: 8px;
    padding: 16px;
    border-radius: 22px;
    border: 1px solid rgba(15,23,42,0.08);
    background: linear-gradient(180deg, rgba(248,250,252,0.98), rgba(255,255,255,0.98));
    box-shadow: 0 16px 36px rgba(15,23,42,0.08);}

.comment-login-gate strong{font-size: 15px; color: #111827;}

.comment-login-gate span{font-size: 13px; line-height: 1.45; color: #667085;}

.comment-login-btn{justify-self: start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 144px;
    height: 44px;
    padding: 0 18px;
    border-radius: 999px;
    background: #111111;
    color: #ffffff;
    text-decoration: none;
    font-weight: 800;}

.comments-login-more{display: grid;
    gap: 10px;
    margin-top: 8px;
    padding: 16px;
    border-radius: 22px;
    border: 1px solid rgba(15,23,42,0.08);
    background: rgba(248,250,252,0.9);
    color: #475467;
    font-size: 13px;
    line-height: 1.45;}

.comments-login-link{justify-self: start;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 142px;
    height: 42px;
    padding: 0 18px;
    border-radius: 999px;
    background: #111111;
    color: #ffffff;
    text-decoration: none;
    font-weight: 800;}

.meta-title-row{display:flex;align-items:center;justify-content:space-between;gap:10px;}

.meta-plan-status{flex:0 0 auto;display:inline-flex;align-items:center;min-height:28px;padding:0 12px;border-radius:999px;background:rgba(10,10,12,.88);color:#fff;font-size:12px;font-weight:800;letter-spacing:.01em;}

.meta-plan-status-past{background:rgba(12,12,14,.92);}

.meta-date{display:inline-flex;align-items:center;padding:0 10px;min-height:28px;border-radius:999px;background:rgba(8,8,10,.08);color:#10131a;font-size:12px;font-weight:700;}

.plan-join-btn.is-expired{background:#1a1b20;color:#fff;border-color:#1a1b20;}

.plan-join-btn.is-expired .plan-join-btn__icon{background:rgba(255,255,255,.12);color:#fff;}

.card-overlay .plan-people-strip{position: absolute;
    left: 14px;
    right: 14px;
    top: 14px;
    z-index: 8;
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    pointer-events: none;}

.card-overlay .plan-creator-slot,
.card-overlay .plan-avatars{pointer-events: auto;}

.card-overlay .plan-creator-slot{min-width: 58px;
    min-height: 58px;
    display: flex;
    align-items: center;
    justify-content: flex-start;}

.card-overlay .plan-creator-slot:empty{display: none;}

.card-overlay .plan-creator-slot .pav.pav-creator{width: 56px;
    height: 56px;
    border-radius: 999px;
    overflow: hidden;
    display: block;
    position: relative;
    background: rgba(255,255,255,0.26);
    box-shadow:
        0 18px 42px rgba(0,0,0,0.36),
        0 0 0 3px rgba(255,255,255,0.92),
        inset 0 0 0 1px rgba(255,255,255,0.18);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);}

.card-overlay .plan-creator-slot .pav.pav-creator::after{content: "";
    position: absolute;
    right: 2px;
    bottom: 2px;
    width: 13px;
    height: 13px;
    border-radius: 50%;
    background: linear-gradient(135deg, #111827, #334155);
    box-shadow: 0 0 0 2px rgba(255,255,255,0.96);}

.card-overlay .plan-creator-slot .pav.pav-creator img,
.card-overlay .plan-avatars-row .pav img{width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;}

.card-overlay .plan-avatars{position: static !important;
    inset: auto !important;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 8px;
    max-width: calc(100% - 80px);}

.card-overlay .plan-avatars-row{display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-direction: row-reverse;
    min-width: 0;}

.card-overlay .plan-avatars-row .pav{width: 34px;
    height: 34px;
    min-width: 34px;
    border-radius: 999px;
    overflow: hidden;
    display: block;
    position: relative;
    background: rgba(255,255,255,0.24);
    margin-right: -9px;
    box-shadow:
        0 12px 26px rgba(0,0,0,0.34),
        0 0 0 2px rgba(255,255,255,0.84),
        inset 0 0 0 1px rgba(255,255,255,0.14);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    transition: transform .18s ease, box-shadow .18s ease;}

.card-overlay .plan-avatars-row .pav:first-child{margin-right: 0;}

.card-overlay .plan-creator-slot .pav:hover,
.card-overlay .plan-avatars-row .pav:hover{transform: translateY(-2px) scale(1.035);
    z-index: 4;}

.card-overlay .plan-avatars-hint{font-size: 12px;
    font-weight: 800;
    color: rgba(15,23,42,0.82);
    background: rgba(255,255,255,0.94);
    border-radius: 999px;
    padding: 6px 9px;
    line-height: 1;
    white-space: nowrap;
    box-shadow: inset 0 0 0 1px rgba(15,23,42,0.08), 0 10px 24px rgba(0,0,0,0.16);}

@media (max-width: 520px){
.card-overlay .plan-people-strip{left: 12px;
        right: 12px;
        top: 12px;
        gap: 8px;}

.card-overlay .plan-creator-slot{min-width: 52px;
        min-height: 52px;}

.card-overlay .plan-creator-slot .pav.pav-creator{width: 52px;
        height: 52px;}

.card-overlay .plan-avatars-row .pav{width: 32px;
        height: 32px;
        min-width: 32px;
        margin-right: -10px;}

.card-overlay .plan-avatars-hint{padding: 5px 8px;
        font-size: 11px;}
}

.feed .header,
.header{padding:22px 18px 12px !important;
    background:rgba(255,255,255,0.92) !important;
    backdrop-filter:blur(18px) saturate(140%) !important;
    -webkit-backdrop-filter:blur(18px) saturate(140%) !important;}

.header::after{display:none !important;}

.header-top{min-height:56px !important;
    display:grid !important;
    grid-template-columns:max-content 1fr max-content !important;
    align-items:center !important;
    column-gap:14px !important;
    position:relative !important;
    background:transparent !important;}

.logo{display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    min-width:0 !important;
    justify-self:start !important;}

.planes-logo-mark{width:26px !important;
    height:26px !important;
    object-fit:contain !important;
    border-radius:8px !important;
    flex:0 0 auto !important;
    display:block !important;
    filter:none !important;}

.logo:has(.planes-logo-mark){gap:8px !important;}

.logo-text{color:#0e0e11 !important;
    font-size:24px !important;
    font-weight:800 !important;
    line-height:1 !important;
    letter-spacing:-.03em !important;}

.location-switcher.location-switcher--chatlike{position:absolute !important;
    top:50% !important;
    left:50% !important;
    transform:translate(-50%, -50%) !important;
    z-index:20 !important;
    margin:0 !important;}

.location-switcher--chatlike summary{list-style:none !important;}

.location-switcher--chatlike summary::-webkit-details-marker{display:none !important;}

.location-switcher--chatlike .location-switcher-trigger{display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
    min-width:0 !important;
    padding:0 !important;
    cursor:pointer !important;
    user-select:none !important;}

.location-switcher--chatlike .location-switcher-main{color:#0e0e11 !important;
    font-size:18px !important;
    font-weight:800 !important;
    line-height:1 !important;
    letter-spacing:-.025em !important;
    text-align:center !important;}

.location-switcher--chatlike .location-switcher-subrow,
.location-switcher--chatlike .location-switcher-sub{display:none !important;}

.location-switcher--chatlike .location-switcher-caret{position:static !important;
    width:16px !important;
    height:16px !important;
    stroke:#0e0e11 !important;
    stroke-width:2.6 !important;
    fill:none !important;
    transform:none !important;
    transition:transform .18s ease !important;
    margin-top:2px !important;}

.location-switcher--chatlike[open] .location-switcher-caret{transform:rotate(180deg) !important;}

.location-switcher--chatlike .location-switcher-menu{position:absolute !important;
    left:50% !important;
    transform:translateX(-50%) !important;
    margin-top:12px !important;
    min-width:190px !important;
    padding:8px !important;
    border-radius:18px !important;
    background:rgba(255,255,255,.96) !important;
    border:1px solid rgba(0,0,0,.08) !important;
    box-shadow:0 18px 45px rgba(0,0,0,.16) !important;
    backdrop-filter:blur(18px) !important;
    -webkit-backdrop-filter:blur(18px) !important;}

.location-switcher--chatlike .location-switcher-item{color:#111 !important;
    background:#f6f6f6 !important;
    border:0 !important;}

.location-switcher--chatlike .location-switcher-item span{color:rgba(0,0,0,.52) !important;}

.header-actions{justify-self:end !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;}

.action-btn{width:54px !important;
    height:54px !important;
    border-radius:50% !important;
    border:none !important;
    background:#fff !important;
    box-shadow:0 10px 26px rgba(0,0,0,.08) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    color:#0e0e11 !important;
    stroke:#0e0e11 !important;}

.action-btn svg{width:24px !important;
    height:24px !important;
    stroke:#0e0e11 !important;
    stroke-width:2.3 !important;
    fill:none !important;}

.action-btn.notify{position:relative !important;}

.action-btn.notify .notif-dot,
.notif-dot{top:8px !important;
    right:8px !important;
    width:10px !important;
    height:10px !important;
    box-shadow:0 0 0 2px #fff !important;}

.brand-mark,
.brand-mark-logo,
.brand-mark-text{display:none !important;}

@media (max-width:640px){
.feed .header,
.header{padding:22px 18px 12px !important;}

.header-top{min-height:56px !important;
        column-gap:10px !important;}

.logo-text{font-size:24px !important;}

.location-switcher--chatlike .location-switcher-main{font-size:18px !important;}

.location-switcher--chatlike .location-switcher-trigger{padding:0 !important;
        min-width:0 !important;}

.action-btn{width:54px !important;
        height:54px !important;}
}

.header .logo-text,
.feed .header .logo-text{font-family: ui-rounded, "SF Pro Rounded", "Nunito Sans", "Plus Jakarta Sans", "Inter", -apple-system, BlinkMacSystemFont, sans-serif !important;
    color:#0e0e11 !important;
    font-size:24px !important;
    font-weight:800 !important;
    line-height:1 !important;
    letter-spacing:-.03em !important;}

.location-switcher--chatlike[open] .location-switcher-menu{position:fixed !important;
    top:50% !important;
    left:50% !important;
    right:auto !important;
    bottom:auto !important;
    transform:translate(-50%, -50%) !important;
    margin:0 !important;
    width:min(86vw, 330px) !important;
    min-width:0 !important;
    padding:12px !important;
    border-radius:26px !important;
    background:rgba(255,255,255,.97) !important;
    color:#111 !important;
    border:1px solid rgba(17,17,17,.08) !important;
    box-shadow:0 30px 80px rgba(0,0,0,.22) !important;
    backdrop-filter:blur(22px) saturate(145%) !important;
    -webkit-backdrop-filter:blur(22px) saturate(145%) !important;
    z-index:650 !important;}

.location-switcher--chatlike[open] .location-switcher-menu::before{content:"";
    position:fixed;
    inset:0;
    pointer-events:none;}

.location-switcher--chatlike .location-switcher-item{width:100% !important;
    min-height:58px !important;
    border-radius:18px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:0 16px !important;
    background:#f5f5f6 !important;
    color:#111 !important;
    font-weight:900 !important;}

.location-switcher--chatlike .location-switcher-item span{font-size:12px !important;
    font-weight:800 !important;
    color:rgba(17,17,17,.54) !important;}

.ui-modal-overlay{background:rgba(17,17,17,.34) !important;
    backdrop-filter:blur(8px) !important;
    -webkit-backdrop-filter:blur(8px) !important;}

.ui-modal{width:min(92vw, 420px) !important;}

.ui-modal-card{background:#fff !important;
    color:#111 !important;
    border:1px solid rgba(17,17,17,.08) !important;
    border-radius:24px !important;
    padding:18px 18px 16px !important;
    box-shadow:0 26px 70px rgba(17,17,17,.18) !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;}

.ui-modal-title{color:#111 !important;
    font-size:16px !important;
    font-weight:900 !important;
    letter-spacing:-.02em !important;
    margin-bottom:6px !important;}

.ui-modal-msg{color:#1b1b1b !important;
    font-size:14px !important;
    line-height:1.5 !important;}

.ui-modal-actions{display:flex !important;
    gap:10px !important;
    margin-top:16px !important;
    justify-content:flex-end !important;
    flex-wrap:wrap !important;}

.ui-btn{min-height:44px !important;
    padding:0 14px !important;
    border-radius:14px !important;
    border:1px solid rgba(17,17,17,.10) !important;
    background:#fff !important;
    color:#111 !important;
    box-shadow:none !important;
    backdrop-filter:none !important;
    -webkit-backdrop-filter:none !important;
    font-weight:850 !important;}

.ui-btn.primary{background:#111 !important;
    border-color:#111 !important;
    color:#fff !important;
    box-shadow:0 14px 24px rgba(17,17,17,.14) !important;}

.meta-plan-status,
.meta-plan-status-past,
.plan-join-btn.is-expired{background:#fff !important;
    color:#111 !important;
    border:1px solid rgba(17,17,17,.10) !important;
    box-shadow:0 10px 24px rgba(17,17,17,.10) !important;}

.plan-join-btn.is-expired .plan-join-btn__icon{background:#111 !important;
    color:#fff !important;}

@media (max-width:640px){
.location-switcher--chatlike[open] .location-switcher-menu{width:min(88vw, 320px) !important;
        border-radius:24px !important;}

.ui-modal-actions .ui-btn{flex:1 1 auto !important;}
}

@media (min-width: 900px){
html,
body{background:#ffffff !important;}

.app{background:#ffffff !important;
        padding-bottom:160px !important;
        scroll-snap-type:y proximity !important;}

.top-snap{scroll-snap-align:start !important;}

.card{width:min(720px, calc(100vw - 48px)) !important;
        max-width:720px !important;
        height:min(760px, calc(100dvh - 130px)) !important;
        min-height:620px !important;
        margin:24px auto 28px !important;
        padding:0 !important;
        border-radius:32px !important;
        overflow:hidden !important;
        background:#ffffff !important;
        border:1px solid rgba(17,17,17,.08) !important;
        box-shadow:0 22px 60px rgba(17,17,17,.13) !important;
        scroll-snap-align:start !important;
        scroll-snap-stop:normal !important;}

.card-image{width:100% !important;
        height:100% !important;
        border-radius:32px !important;
        overflow:hidden !important;
        background:#ffffff !important;}

.card-image img{width:100% !important;
        height:100% !important;
        object-fit:cover !important;
        border-radius:32px !important;}

.card-overlay{border-radius:32px !important;
        overflow:hidden !important;
        background:linear-gradient(to top, rgba(0,0,0,.86), rgba(0,0,0,.25) 52%, rgba(0,0,0,.04)) !important;}

.card-glass-meta{left:24px !important;
        right:24px !important;
        bottom:112px !important;
        padding:18px !important;
        border-radius:30px !important;
        max-width:none !important;
        background:rgba(255,255,255,.96) !important;
        color:#111111 !important;
        border:1px solid rgba(255,255,255,.82) !important;
        box-shadow:0 22px 54px rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.92) !important;}

.meta-title{font-size:22px !important;
        line-height:1.1 !important;
        letter-spacing:-.03em !important;}

.meta-subdesc{font-size:14px !important;
        line-height:1.45 !important;
        -webkit-line-clamp:3 !important;
        max-height:62px !important;
        height:auto !important;}

.meta-stats{gap:8px !important;
        flex-wrap:wrap !important;}

.plan-actions{gap:10px !important;
        align-items:center !important;}

.plan-action-btn,
.plan-join-btn{min-height:46px !important;}

.card-overlay .plan-people-strip{top:22px !important;
        left:22px !important;
        right:22px !important;}

.pill-nav{width:min(760px, calc(100vw - 44px)) !important;
        max-width:760px !important;}
}

.pill-item .pill-icon-flips circle{fill: none;
    stroke: currentColor;
    stroke-width: 2;}

.pill-item .pill-icon-flips path{fill: currentColor !important;
    stroke: none !important;}

.pill-nav:has(.pill-item:nth-child(6)){gap: 6px;}

.pill-nav:has(.pill-item:nth-child(6)) .pill-item{font-size: 10px;
    gap: 4px;}

.pill-nav:has(.pill-item:nth-child(6)) .pill-item svg{width: 21px;
    height: 21px;}

@media (min-width: 769px){
.pill-nav:has(.pill-item:nth-child(6)){width: min(820px, calc(100vw - 44px));
        max-width: 820px;}

.pill-nav:has(.pill-item:nth-child(6)) .pill-item{font-size: 12px;
        gap: 6px;}

.pill-nav:has(.pill-item:nth-child(6)) .pill-item svg{width: 24px;
        height: 24px;}
}

@media (max-width: 420px){
.pill-nav:has(.pill-item:nth-child(6)){gap: 4px;
        padding: 6px;}

.pill-nav:has(.pill-item:nth-child(6)) .pill-item{font-size: 9px;
        border-radius: 18px;}

.pill-nav:has(.pill-item:nth-child(6)) .pill-item svg{width: 20px;
        height: 20px;}
}

/* Variante legacy "join" eliminada: Momentos no la utiliza. */

*{box-sizing: border-box;
  -webkit-tap-highlight-color: transparent;}

html,
body{height: 100%;
  margin: 0;
  
  background: #000;
  overflow: hidden;
  font-family:
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif;
  color: #111111;}

.brand-mark,
.brand-mark-text,
.location-switcher-main,
.location-switcher-sub,
.location-switcher-item{font-family:
    ui-rounded,
    "SF Pro Rounded",
    "Nunito Sans",
    "Plus Jakarta Sans",
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif;}

.brand-mark{display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;}

.brand-mark-logo{width: 52px;
  height: 52px;
  object-fit: contain;
  border-radius: 14px;
  flex: 0 0 auto;}

.brand-mark-text{font-size: 24px;
  font-weight: 400;
  letter-spacing: -0.03em;
  color: #000;
  line-height: 1;}

.location-switcher{position: absolute;
  left: 50%;
  transform: translateX(-50%);
  z-index: 20;}

.location-switcher summary{list-style: none;}

.location-switcher summary::-webkit-details-marker{display: none;}

.location-switcher-trigger{position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 142px;
  padding-right: 14px;
  cursor: pointer;
  user-select: none;}

.location-switcher-main{font-size: 24px;
  font-weight: 400;
  line-height: 1;
  color: #000;
  letter-spacing: -0.03em;
  text-align: center;}

.location-switcher-subrow{display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;}

.location-switcher-sub{font-size: 11px;
  font-weight: 500;
  line-height: 1;
  text-align: center;
  color: rgba(0, 0, 0, 0.72);}

.location-switcher-caret{position: absolute;
  right: 2px;
  top: 50%;
  transform: translateY(1px);
  width: 15px;
  height: 15px;
  stroke: rgba(0, 0, 0, 0.78);
  stroke-width: 2.2;
  fill: none;
  transition: transform 0.18s ease;}

.location-switcher[open] .location-switcher-caret{transform: translateY(1px) rotate(180deg);}

.location-switcher-menu{margin-top: 10px;
  min-width: 190px;
  padding: 8px;
  border-radius: 18px;
  background: rgba(18, 18, 18, 0.88);
  border: 1px solid rgba(255, 255, 255, 0.12);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.34);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);}

.location-switcher-item{width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 12px 14px;
  border: 0;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.04);
  color: #fff;
  font-size: 14px;
  font-weight: 700;
  text-align: left;
  opacity: 0.74;}

.location-switcher-item span{font-size: 12px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.55);}

.post-profile-btn{display: flex;
  align-items: center;
  gap: 14px;
  background: transparent;
  border: 0;
  padding: 0;
  color: inherit;
  text-align: left;
  cursor: pointer;}

.post-profile-btn:active{transform: scale(0.99);}

.like-count.like-count-btn{background: transparent;
  border: 0;
  padding: 0 2px;
  color: rgba(255, 255, 255, 0.7);
  cursor: pointer;
  font-size: 12px;
  line-height: 1;
  opacity: 0.85;}

.like-count.like-count-btn:hover{opacity: 1;}

.likes-list{display: flex;
  flex-direction: column;
  gap: 10px;
  margin-top: 10px;
  max-height: 52vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding-right: 4px;}

.likes-item{display: flex;
  align-items: center;
  gap: 10px;}

.likes-avatar{width: 38px;
  height: 38px;
  border-radius: 999px;
  object-fit: cover;
  flex: 0 0 auto;}

.likes-name{display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: #ffffff;}

.likes-name span{color: #ffffff;}

.likes-verified{width: 16px;
  height: 16px;
  object-fit: contain;}

.likes-empty{opacity: 0.7;
  text-align: center;
  padding: 10px 0;}

.feed{height: 100dvh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;

  
  background: #000;}

.feed-posts{padding: 14px 0 120px;
  display: flex;
  flex-direction: column;
  gap: 18px;}

.post{--post-pad: 14px;
  max-width: 480px;
  width: calc(100% - 24px);
  margin: 0 auto;

  padding: 14px;
  border-radius: 0;
  overflow: hidden;

  background: #ffffff;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;

  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);}

.post.post--with-media{padding-top: 0 !important;
  border-top-left-radius: 0 !important;
  border-top-right-radius: 0 !important;}

.post.post--with-media .post-media{margin-top: 0 !important;}

.post-header{display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 12px;}

.post-avatar{width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
  user-select: none;
  -webkit-user-drag: none;}

.post-header-info{display: flex;
  flex-direction: column;
  gap: 4px;}

.post-username{font-size: 14px;
  font-weight: 600;
  color: #ffffff;
  display: flex;
  align-items: center;
  gap: 6px;}

.post-name-text{display: inline-block;
  max-width: 100%;}

.verified-badge{width: 22px;
  height: 22px;
  flex: 0 0 22px;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;}

.post-username .verified-badge{background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  padding: 0 !important;
  display: inline-block !important;
  object-fit: contain !important;}

.post-meta-inline{font-size: 12px;
  color: rgba(17, 17, 17, 0.68);
  display: flex;
  gap: 6px;
  flex-wrap: wrap;}

.meta-separator{opacity: 0.5;}

.post-content{margin: 8px 0 12px;
  font-size: 14px;
  line-height: 1.45;
  color: #111111;
  word-break: break-word;}

.post-media{position: relative;
  width: calc(100% + (2 * var(--post-pad)));
  margin-left: calc(-1 * var(--post-pad));
  margin-right: calc(-1 * var(--post-pad));
  margin-top: 10px;
  margin-bottom: 12px;

  background: #000;
  border-radius: 0;
  overflow: hidden;

  
  height: clamp(468px, 75vh, 806px);}

.post-media-track{display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;}

.post-media-track::-webkit-scrollbar{display: none;}

.post-media-item{flex: 0 0 100%;
  scroll-snap-align: center;
  display: flex;
  align-items: center;
  justify-content: center;}

.post-media-overlay{position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 3;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  padding: 14px;
  background: linear-gradient(
    to bottom,
    rgba(0, 0, 0, 0.56),
    rgba(0, 0, 0, 0.22) 58%,
    rgba(0, 0, 0, 0)
  );
  pointer-events: none;}

.post-profile-btn-overlay,
.post-sound-btn-overlay{pointer-events: auto;}

.post-profile-btn-overlay{max-width: calc(100% - 58px);}

.post-media-overlay .post-header-info{gap: 3px;}

.post-media-overlay .post-header-info{padding: 8px 12px;
  border-radius: 18px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.34), rgba(0, 0, 0, 0.18));
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.22),
    inset 0 0 0 1px rgba(255, 255, 255, 0.1);}

.post-media-overlay .post-username{color: #fff;
  text-shadow:
    0 2px 14px rgba(0, 0, 0, 0.72),
    0 1px 3px rgba(0, 0, 0, 0.65);}

.post-media-overlay .post-meta-inline{color: rgba(255, 255, 255, 0.96);
  text-shadow:
    0 2px 14px rgba(0, 0, 0, 0.72),
    0 1px 3px rgba(0, 0, 0, 0.65);}

.post-media-overlay .post-avatar{width: 56px;
  height: 56px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.18);}

.post-sound-btn-overlay{margin-left: auto;}

.post-media-dots{position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 6px;}

.post-media-dots span{width: 6px;
  height: 6px;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);}

.post-media-dots span.active{background: #ffffff;}

.post-actions{display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  margin-top: 0;
  padding: 14px 14px 16px;
  background: #ffffff;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;}

.post-action-group{display: flex;
  align-items: center;
  gap: 12px;}

.post-action-btn{width: auto;
  height: auto;
  padding: 0;
  border: 0 !important;
  border-radius: 0;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition:
    transform 0.15s ease,
    opacity 0.2s ease;}

.post-action-btn:active{transform: scale(0.92);}

.post-action-btn svg{width: 26px;
  height: 26px;
  stroke: #111111;
  fill: none;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;}

.comment-btn svg{width: 27px;
  height: 27px;}

.like-btn.liked svg{fill: #ff3b30;
  stroke: #ff3b30;}

.like-count,
.comment-count{font-size: 13px;
  line-height: 1;
  color: #111111;
  min-width: 14px;
  text-align: left;
  font-weight: 600;}

.like-count{cursor: pointer;}

.post-action-right .post-action-btn svg{stroke: #111111;}

.create-sheet{position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;

  background: rgba(15, 15, 18, 0.95);
  backdrop-filter: blur(22px);

  border-radius: 22px 22px 0 0;
  padding: 16px;

  
  max-height: 92vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;

  
  padding-bottom: 92px;

  transform: translateY(100%);
  transition: transform 0.35s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;}

.create-sheet.open{transform: translateY(0);
  pointer-events: auto;}

.create-sheet-header{display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;}

.create-title-wrap{display: flex;
  flex-direction: column;
  gap: 2px;}

.create-subtitle{font-size: 12px;
  opacity: 0.7;
  font-weight: 500;}

.create-sheet-header span{font-size: 15px;
  font-weight: 600;}

.close-sheet{background: none;
  border: none;
  color: rgba(255, 255, 255, 0.8);
  font-size: 20px;
  cursor: pointer;}

.create-textarea{width: 100%;
  resize: none;
  border: 1px solid rgba(255, 255, 255, 0.12);
  outline: none;

  background: rgba(255, 255, 255, 0.08);
  color: #ffffff;

  border-radius: 14px;
  padding: 12px;
  font-size: 14px;
  line-height: 1.4;
  margin-bottom: 12px;
  transition:
    border-color 0.2s ease,
    box-shadow 0.2s ease,
    background 0.2s ease;}

.create-textarea:focus{border-color: rgba(255, 106, 74, 0.55);
  box-shadow: 0 0 0 4px rgba(255, 106, 74, 0.16);
  background: rgba(255, 255, 255, 0.08);}

.create-actions{display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 12px;}

.create-primary-btn{display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.12);
  cursor: pointer;}

.create-primary-icon{width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 999px;
  background: rgba(255, 106, 74, 0.18);
  border: 1px solid rgba(255, 106, 74, 0.35);
  font-size: 18px;
  color: #fff;
  flex: 0 0 auto;}

.create-primary-text{font-size: 14px;
  font-weight: 600;
  color: #fff;}

.create-primary-hint{margin-left: auto;
  font-size: 12px;
  opacity: 0.7;}

.create-round-row{display: grid;
  grid-template-columns: 44px 1fr 44px 1fr;
  gap: 10px;
  align-items: center;}

.create-round-btn{width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  background: rgba(255, 255, 255, 0.08);
  color: #fff;
  font-size: 18px;
  cursor: pointer;}

.create-round-btn.active{border-color: rgba(255, 106, 74, 0.55);
  box-shadow: 0 0 0 4px rgba(255, 106, 74, 0.12);}

.create-round-meta{display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;}

.create-round-label{font-size: 12px;
  opacity: 0.75;}

.create-location-text{font-size: 13px;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;}

.create-sheet-footer{position: sticky;
  bottom: 0;
  left: 0;
  right: 0;
  padding-top: 12px;
  background: rgba(15, 15, 18, 0.98);
  border-top: 1px solid rgba(255, 255, 255, 0.1);}

.post--uploading{border: 1px solid rgba(255, 255, 255, 0.1);}

.uploading-card{padding: 12px;}

.uploading-title{font-weight: 700;
  font-size: 13px;
  margin-bottom: 10px;}

.uploading-media{display: grid;
  grid-template-columns: repeat(auto-fill, minmax(110px, 1fr));
  gap: 10px;
  margin-bottom: 10px;}

.uploading-media img,
.uploading-media video{width: 100%;
  aspect-ratio: 4 / 5;
  border-radius: 14px;
  object-fit: cover;
  background: rgba(255, 255, 255, 0.06);}

.uploading-text{font-size: 13px;
  line-height: 1.35;
  opacity: 0.9;
  margin-bottom: 10px;}

.upload-progress{width: 100%;
  height: 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.1);
  overflow: hidden;}

.upload-progress-bar{height: 100%;
  width: 0%;
  border-radius: 999px;
  background: rgba(255, 106, 74, 0.95);
  transition: width 0.15s ease;}

.post--upload-error .upload-progress-bar{background: rgba(255, 255, 255, 0.35);}

.uploading-error{margin-top: 10px;
  font-size: 12px;
  opacity: 0.85;}

.create-media-preview{display: grid;
  grid-template-columns: repeat(auto-fill, minmax(120px, 1fr));
  gap: 12px;
  margin-top: 12px;
  margin-bottom: 16px;}

.media-preview-item{position: relative;
  width: 100%;
  aspect-ratio: 4 / 5; 
  border-radius: 16px;
  overflow: hidden;

  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(10px);

  display: flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;}

.media-preview-item img,
.media-preview-item video{width: 100%;
  height: 100%;
  object-fit: cover;

  display: block;
  user-select: none;
  -webkit-user-drag: none;}

.media-preview-item video::before{content: "";}

.media-remove{position: absolute;
  top: 8px;
  left: 8px;

  width: 26px;
  height: 26px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.12);

  background: rgba(0, 0, 0, 0.75);
  color: #ffffff;
  font-size: 16px;

  display: flex;
  align-items: center;
  justify-content: center;

  cursor: pointer;
  z-index: 5;}

.media-remove:active{transform: scale(0.9);}

.publish-btn{width: 100%;
  padding: 12px;
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.12);

  background: #ff5a12;
  color: #ffffff;
  font-size: 14px;
  font-weight: 600;

  cursor: pointer;}

.publish-btn:disabled{opacity: 0.5;
  cursor: not-allowed;}

.create-overlay{position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
  z-index: 999;}

.create-overlay.active{opacity: 1;
  pointer-events: auto;}

.post-media{aspect-ratio: 4 / 5;}

.post-media-item{height: 100%;}

.create-media-preview{grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));}

.media-preview-item{aspect-ratio: 4 / 5;}

.media-preview-item video{object-fit: cover;
  background: #000;}

.media-preview-item::after{content: "▶";
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 42px;
  color: rgba(255, 255, 255, 0.85);
  pointer-events: none;}

.media-preview-item img + .media-remove ~ ::after{content: "";}

.post-media-item{cursor: pointer;}

.media-preview-item{cursor: zoom-in;}

.post-media video,
.media-preview-item video{controls: none !important;}

.post-media video::-webkit-media-controls,
.post-media video::-webkit-media-controls-panel,
.post-media video::-webkit-media-controls-play-button,
.post-media video::-webkit-media-controls-start-playback-button,
.media-preview-item video::-webkit-media-controls{display: none !important;
  opacity: 0 !important;}

.post-media video::-moz-media-controls{display: none !important;}

.media-preview-item::after{content: none;}

.media-preview-item:has(video)::after{content: "▶";
  position: absolute;
  inset: 0;

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 44px;
  color: rgba(255, 255, 255, 0.85);
  text-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);

  pointer-events: none;}

.post-media:has(video)::before{display: none !important;
  content: none !important;}

.global-sound-btn.active ~ .feed .post-media:has(video)::before{display: none !important;
  content: none !important;}

.post-media{aspect-ratio: 4 / 5;}

.post-media-item,
.post-media-item video{height: 100%;}

.post-media-item video{object-fit: cover;
  background: #000;}

.post{padding: 14px;}

@media (min-width: 768px){
.post{max-width: 620px; 
    width: calc(100% - 32px);
    padding: 16px;
    border-radius: 22px;}

.feed-posts{gap: 20px;}
}

@media (hover: hover) and (pointer: fine){
.post{transition:
      transform 0.18s ease,
      box-shadow 0.22s ease,
      background 0.22s ease;}

.post:hover{transform: translateY(-1px);
    box-shadow:
      inset 0 0 0 1px rgba(255, 255, 255, 0.05),
      0 14px 34px rgba(0, 0, 0, 0.45);
    background: rgba(255, 255, 255, 0.07);}
}

.post-action-btn:focus-visible,
.close-sheet:focus-visible,
.publish-btn:focus-visible,
.media-remove:focus-visible,
.media-btn:focus-visible,
#globalSoundToggle:focus-visible{outline: 2px solid rgba(255, 0, 79, 0.68);
  outline-offset: 3px;}

#createPostText:focus-visible{outline: 2px solid rgba(255, 90, 18, 0.58) !important;
  outline-offset: 3px;}

.post-media{border-radius: 18px;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);}

.post-media-track{scroll-snap-type: x mandatory;
  scroll-padding: 0;}

.post-media-item{position: relative;}

@media (prefers-reduced-motion: reduce){
.post,
.post-action-btn,
.create-sheet,
.create-overlay{transition: none !important;}
}

.create-media-preview{gap: 12px;}

@media (min-width: 768px){
.create-media-preview{grid-template-columns: repeat(auto-fill, minmax(180px, 1fr));
    gap: 14px;}
}

.media-preview-item{border-radius: 18px;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    0 10px 22px rgba(0, 0, 0, 0.35);}

#globalSoundToggle.global-sound-btn,
#globalSoundToggle{position: fixed;
  top: 78px; 
  right: 14px;
  z-index: 1200;

  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);

  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    0 10px 26px rgba(0, 0, 0, 0.45);

  color: #fff;
  font-size: 18px;
  cursor: pointer;

  display: flex;
  align-items: center;
  justify-content: center;

  transition:
    transform 0.15s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;}

#globalSoundToggle:active{transform: scale(0.94);}

#globalSoundToggle.active{background: rgba(255, 0, 79, 0.16);
  box-shadow:
    inset 0 0 0 1px rgba(255, 0, 79, 0.28),
    0 12px 30px rgba(0, 0, 0, 0.5);}

.media-viewer{position: fixed;
  inset: 0;
  z-index: 2000;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.18s ease;}

.media-viewer.open{opacity: 1;
  pointer-events: auto;}

.media-viewer__backdrop{position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.78);}

.media-viewer__panel{position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;}

.media-viewer__stage{flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;

  padding: 18px;}

.media-viewer__img,
.media-viewer__video{max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;

  border-radius: 18px;
  background: #000;

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.06),
    0 18px 50px rgba(0, 0, 0, 0.6);}

.media-viewer__close,
.media-viewer__sound{position: absolute;
  top: 14px;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.12);

  background: rgba(255, 255, 255, 0.1);
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.08),
    0 10px 26px rgba(0, 0, 0, 0.45);

  color: #fff;
  cursor: pointer;

  display: flex;
  align-items: center;
  justify-content: center;

  transition:
    transform 0.15s ease,
    background 0.2s ease;}

.media-viewer__close{right: 14px;}

.media-viewer__sound{left: 14px;
  font-size: 18px;}

.media-viewer__close:active,
.media-viewer__sound:active{transform: scale(0.94);}

.media-viewer__sound.active{background: rgba(255, 0, 79, 0.16);}

@supports selector(:has(*)){
.media-preview-item:has(video)::after{content: "▶";
    position: absolute;
    inset: 0;

    display: flex;
    align-items: center;
    justify-content: center;

    font-size: 44px;
    color: rgba(255, 255, 255, 0.85);
    text-shadow: 0 4px 12px rgba(0, 0, 0, 0.6);
    pointer-events: none;}

.post-media:has(video)::before{content: " ";
    position: absolute;
    top: 10px;
    right: 10px;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: rgba(0, 0, 0, 0);
    pointer-events: none;
    z-index: 10;}
}

.post-media{position: relative;}

.post-sound-toggle{position: absolute;
  top: 12px;
  right: 12px;
  z-index: 20;

  width: 38px;
  height: 38px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.12);

  background: rgba(0, 0, 0, 0.65);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);

  display: flex;
  align-items: center;
  justify-content: center;

  font-size: 16px;
  color: #ffffff;

  cursor: pointer;
  user-select: none;

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.12),
    0 6px 16px rgba(0, 0, 0, 0.45);

  transition:
    transform 0.15s ease,
    background 0.2s ease,
    box-shadow 0.2s ease;}

.post-sound-toggle:active{transform: scale(0.92);}

.post-sound-toggle.muted{background: rgba(0, 0, 0, 0.65);}

.post-sound-toggle.active{background: #ff5a12;

  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.35),
    0 10px 26px rgba(255, 0, 79, 0.28);}

@media (hover: hover) and (pointer: fine){
.post-sound-toggle:hover{transform: scale(1.05);}
}

.post-sound-toggle:focus-visible{outline: 2px solid rgba(255, 0, 79, 0.72);
  outline-offset: 3px;}

.post-action-right{display: flex;
  align-items: center;
  margin-left: auto;}

.post-delete-btn .icon-trash{width: 20px;
  height: 20px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  opacity: 0.92;}

.post-delete-btn{width: 42px;
  height: 42px;
  
  color: rgba(255, 255, 255, 0.92) !important;}

.post{will-change: transform, opacity, filter;
  opacity: 1;
  transform: translateY(0) scale(1);
  filter: blur(0);
  transition:
    transform 0.52s cubic-bezier(0.22, 1, 0.36, 1),
    opacity 0.52s ease,
    filter 0.52s ease;}

.post.post--pre-enter,
.post.post--enter{opacity: 0;
  transform: translateY(18px) scale(0.985);
  filter: blur(10px);}

.post.post--leave{opacity: 0;
  transform: translateY(-10px) scale(0.985);
  filter: blur(6px);}

.post{--post-pad: 14px;
  overflow: hidden;}

@media (min-width: 768px){
.post{--post-pad: 16px;}
}

.post-media{width: calc(100% + (2 * var(--post-pad)));
  margin-left: calc(-1 * var(--post-pad));
  margin-right: 0;
  border-radius: 0 !important;
  box-shadow: none !important;}

.post-media-track{height: 100%;}

.post-media-item{height: 100%;}

.post-media-item img,
.post-media-item video{width: 100%;
  height: 100%;
  max-height: none;
  object-fit: cover;
  display: block;
  background: #000;}

.feed-login-gate{width: 100%;
  padding: 16px 0 32px;}

.feed-login-gate-card{position: relative;
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  overflow: hidden;
  padding: 28px 24px 24px;
  border-radius: 0;
  background:
    radial-gradient(
      115% 120% at 0% 0%,
      rgba(255, 255, 255, 0.94) 0%,
      rgba(255, 255, 255, 0.74) 38%,
      rgba(255, 255, 255, 0.4) 56%,
      rgba(255, 255, 255, 0.16) 70%,
      rgba(255, 255, 255, 0) 100%
    ),
    radial-gradient(
      130% 110% at 100% 100%,
      rgba(221, 232, 255, 0.95) 0%,
      rgba(235, 242, 255, 0.78) 32%,
      rgba(245, 248, 255, 0.58) 58%,
      rgba(255, 255, 255, 0.92) 100%
    ),
    linear-gradient(180deg, #fbfdff 0%, #eef4ff 54%, #f8fbff 100%);
  box-shadow: 0 18px 42px rgba(15, 23, 42, 0.08);
  isolation: isolate;}

.feed-login-gate-card::before,
.feed-login-gate-card::after{content: "";
  position: absolute;
  inset: auto;
  pointer-events: none;
  z-index: 0;}

.feed-login-gate-card::before{width: 280px;
  height: 280px;
  top: -138px;
  left: -128px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(163, 205, 255, 0.4) 0%,
    rgba(193, 222, 255, 0.24) 40%,
    rgba(229, 240, 255, 0.14) 62%,
    rgba(255, 255, 255, 0) 78%
  );}

.feed-login-gate-card::after{width: 310px;
  height: 310px;
  right: -148px;
  bottom: -164px;
  border-radius: 50%;
  background: radial-gradient(
    circle,
    rgba(128, 177, 255, 0.28) 0%,
    rgba(177, 210, 255, 0.16) 42%,
    rgba(235, 243, 255, 0.1) 62%,
    rgba(255, 255, 255, 0) 80%
  );}

.feed-login-gate-logo-wrap,
.feed-login-gate h2,
.feed-login-gate p,
.feed-login-gate-actions{position: relative;
  z-index: 1;}

.feed-login-gate-logo-wrap{position: absolute;
  top: 18px;
  right: 18px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 58px;
  height: 58px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.54);
  border: 1px solid rgba(255, 255, 255, 0.74);
  box-shadow: 0 12px 28px rgba(30, 64, 175, 0.1);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);}

.feed-login-gate-logo{width: 34px;
  height: 34px;
  object-fit: contain;
  display: block;}

.feed-login-gate h2{margin: 0 72px 10px 0;
  max-width: 360px;
  color: #111111;
  font-size: 30px;
  line-height: 1.04;
  font-weight: 800;
  letter-spacing: -0.04em;
  text-wrap: balance;}

.feed-login-gate p{margin: 0;
  max-width: 372px;
  color: #111111;
  font-size: 15px;
  line-height: 1.55;
  font-weight: 540;}

.feed-login-gate-actions{display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 22px;}

.feed-login-gate-btn{position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 54px;
  padding: 0 24px;
  border-radius: 999px;
  background: #ff5a12;
  color: #ffffff;
  font-weight: 800;
  font-size: 15px;
  letter-spacing: -0.01em;
  text-decoration: none;
  box-shadow: 0 18px 34px rgba(4, 9, 18, 0.22);
  transition:
    transform 0.2s ease,
    box-shadow 0.2s ease,
    filter 0.2s ease;}

.feed-login-gate-btn::after{content: "→";
  margin-left: 10px;
  font-size: 16px;
  line-height: 1;}

.feed-login-gate-btn:hover,
.feed-login-gate-btn:focus-visible{transform: translateY(-1px);
  box-shadow: 0 22px 40px rgba(4, 9, 18, 0.26);
  filter: brightness(1.04);}

@media (max-width: 767px){
.feed-login-gate{width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    padding: 14px 0 26px;}

.feed-login-gate-card{max-width: none;
    width: 100%;
    padding: 22px 18px 22px;}

.feed-login-gate-card::before{width: 220px;
    height: 220px;
    top: -112px;
    left: -98px;}

.feed-login-gate-card::after{width: 240px;
    height: 240px;
    right: -112px;
    bottom: -126px;}

.feed-login-gate-logo-wrap{top: 16px;
    right: 16px;
    width: 54px;
    height: 54px;}

.feed-login-gate-logo{width: 31px;
    height: 31px;}

.feed-login-gate h2{margin-right: 74px;
    font-size: 25px;
    max-width: 270px;}

.feed-login-gate p{font-size: 14px;
    max-width: 278px;}

.feed-login-gate-actions{margin-top: 18px;}

.feed-login-gate-btn{width: 100%;}
}

@media (min-width: 768px){
.feed-posts .feed-login-gate{width: 100%;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;}
}

html,
body{background: #ffffff !important;
  color: #000000 !important;}

.feed{background: #ffffff !important;}

.header,
.header-top,
.feed-posts{background: transparent !important;}

.logo-text,
.logo-subtext,
.post-username,
.likes-name,
.likes-name span,
.post-content,
.action-btn,
.action-btn svg,
.post-meta-inline,
.like-count.like-count-btn,
.guest-lock-title,
.guest-lock-text,
.guest-lock-card,
.guest-lock-card *{color: #000000 !important;
  stroke: #000000 !important;}

.post{background: rgba(0, 0, 0, 0.06) !important;
  box-shadow:
    inset 0 0 0 1px rgba(0, 0, 0, 0.08),
    0 8px 20px rgba(0, 0, 0, 0.08) !important;}

.post-content{color: rgba(0, 0, 0, 0.92) !important;}

.post-meta-inline,
.like-count.like-count-btn{color: rgba(0, 0, 0, 0.65) !important;}

.post-media{background: #ffffff !important;}

.header-top{position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  min-height: 64px;}

.header-actions{justify-self: end;
  display: flex;
  align-items: center;
  gap: 10px;}

@media (max-width: 640px){
.brand-mark-logo{width: 40px;
    height: 40px;}

.brand-mark-text,
.location-switcher-main{font-size: 18px;}

.location-switcher-trigger{min-width: 128px;
    padding-right: 20px;}

.location-switcher-sub{font-size: 10px;}

.location-switcher-menu{min-width: 176px;}
}

.post .post-username,
.post .post-username .post-name-text,
.post .post-meta-inline,
.post .post-meta-inline span,
.post .post-meta-inline svg,
.post .post-meta-inline i,
.post .post-media-overlay .post-username,
.post .post-media-overlay .post-username .post-name-text,
.post .post-media-overlay .post-meta-inline,
.post .post-media-overlay .post-meta-inline span,
.post .post-media-overlay .post-meta-inline svg,
.post .post-media-overlay .post-meta-inline i{color: #ffffff !important;
  fill: #ffffff !important;
  stroke: #ffffff !important;}

.post .post-media-overlay .post-header-info{background: linear-gradient(
    180deg,
    rgba(0, 0, 0, 0.48),
    rgba(0, 0, 0, 0.28)
  ) !important;
  box-shadow:
    0 10px 28px rgba(0, 0, 0, 0.34),
    inset 0 0 0 1px rgba(255, 255, 255, 0.12) !important;}

.post .post-username,
.post .post-name-text,
.post .post-meta-inline{text-shadow:
    0 2px 14px rgba(0, 0, 0, 0.85),
    0 1px 3px rgba(0, 0, 0, 0.78) !important;}

.post-sound-btn{position: absolute;
  top: 12px;
  right: 12px;
  z-index: 20;
  width: 42px;
  height: 42px;
  border-radius: 50%;
  border: 1px solid rgba(255, 255, 255, 0.16);
  background: rgba(0, 0, 0, 0.62);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  cursor: pointer;
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.1),
    0 8px 20px rgba(0, 0, 0, 0.36);
  transition:
    transform 0.15s ease,
    background 0.2s ease,
    box-shadow 0.2s ease,
    border-color 0.2s ease;}

.post-sound-btn .sound-icon{width: 20px;
  height: 20px;
  display: block;}

.post-sound-btn:active{transform: scale(0.94);}

.post-sound-btn.active{background: rgba(0, 0, 0, 0.78);
  border-color: rgba(255, 255, 255, 0.24);
  box-shadow:
    inset 0 0 0 1px rgba(255, 255, 255, 0.14),
    0 10px 26px rgba(0, 0, 0, 0.42);}

.post-sound-btn:focus-visible{outline: 2px solid rgba(255, 255, 255, 0.9);
  outline-offset: 3px;}

.post-media-overlay{position: absolute;}

.post-profile-btn-overlay{position: relative;
  z-index: 4;}

.post-sound-btn,
.post-sound-btn-overlay{position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  left: auto !important;
  margin-left: 0 !important;
  z-index: 8 !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  overflow: hidden !important;
  font-size: 0 !important;
  line-height: 0 !important;}

.post-sound-btn .sound-icon{display: block !important;
  width: 22px !important;
  height: 22px !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
  background-size: contain !important;
  flex: 0 0 22px !important;}

.post-sound-btn .sound-icon--off{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 5 6 9H3v6h3l5 4V5Z'/%3E%3Cpath d='m23 9-6 6'/%3E%3Cpath d='m17 9 6 6'/%3E%3C/svg%3E") !important;}

.post-sound-btn .sound-icon--on{background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ffffff' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 5 6 9H3v6h3l5 4V5Z'/%3E%3Cpath d='M15.5 8.5a5 5 0 0 1 0 7'/%3E%3Cpath d='M18.5 5.5a9 9 0 0 1 0 13'/%3E%3C/svg%3E") !important;}

.post-sound-btn::before,
.post-sound-btn::after,
.post-sound-btn-overlay::before,
.post-sound-btn-overlay::after{display: none !important;
  content: none !important;}

.header{padding-inline: 16px !important;}

.header-top{position: relative !important;
  display: grid !important;
  grid-template-columns: max-content 1fr max-content;
  align-items: center;
  column-gap: 14px;
  min-height: 68px;}

.brand-mark{justify-self: start;
  align-items: center;}

.location-switcher{position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  margin: 0;}

.location-switcher-trigger{min-width: auto;
  padding-right: 18px;}

.location-switcher-subrow{position: relative;
  justify-content: center;}

.location-switcher-sub{display: block;
  width: 100%;
  text-align: center;}

.location-switcher-caret{right: -2px;}

.header-actions{justify-self: end;
  align-items: center;}

@media (max-width: 767px){
.feed-posts{padding-left: 0;
    padding-right: 0;}

.post{width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;}
}

@media (max-width: 640px){
.header{padding-inline: 12px !important;}

.header-top{column-gap: 10px;
    min-height: 62px;}

.brand-mark{gap: 10px;}

.location-switcher-trigger{padding-right: 16px;}

.location-switcher-caret{right: 0;}
}

.location-switcher-trigger{gap: 4px;
  padding-right: 0;}

.location-switcher-subrow{width: auto;
  gap: 8px;
  justify-content: center;}

.location-switcher-sub{width: auto;
  font-size: 13px;
  line-height: 1;
  color: rgba(0, 0, 0, 0.78);}

.location-switcher-caret{position: static;
  transform: none;
  width: 16px;
  height: 16px;
  margin-top: 1px;
  flex: 0 0 auto;}

.location-switcher[open] .location-switcher-caret{transform: rotate(180deg);}

@media (max-width: 640px){
.location-switcher-trigger{padding-right: 0;}

.location-switcher-subrow{gap: 6px;}

.location-switcher-sub{font-size: 11px;}

.location-switcher-caret{width: 15px;
    height: 15px;}
}

.feed-posts .post{background: #ffffff !important;}

.feed-posts .post.post--with-media{padding-bottom: 0 !important;}

.feed-posts .post.post--with-media .post-media{margin-bottom: 0 !important;}

.feed-posts .post .post-actions{width: calc(100% + (2 * var(--post-pad))) !important;
  margin-left: calc(-1 * var(--post-pad)) !important;
  margin-right: calc(-1 * var(--post-pad)) !important;
  margin-bottom: calc(-1 * var(--post-pad)) !important;
  margin-top: 0 !important;
  padding: 16px 16px 18px !important;
  background: #ffffff !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  outline: 0 !important;}

.feed-posts .post .post-action-group,
.feed-posts .post .post-action-right{background: transparent !important;}

.feed-posts .post,
.feed-posts .post.post--with-media,
.feed-posts .post .post-media,
.feed-posts .post .post-media-track,
.feed-posts .post .post-media-item,
.feed-posts .post .post-actions{border-radius: 0 !important;}

.feed-posts .post{overflow: hidden;}

.feed-posts .post .post-actions{display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;}

.feed-posts .post .post-action-group,
.feed-posts .post .post-action-right{display: flex !important;
  align-items: center !important;}

.feed-posts .post .post-action-group{gap: 12px !important;}

.feed-posts .post .post-action-right{gap: 10px !important;}

.post-action-btn{width: 28px;
  height: 28px;
  flex: 0 0 28px;}

.post-action-btn svg{width: 25px;
  height: 25px;
  stroke-width: 1.85;}

.comment-btn svg{width: 25px;
  height: 25px;
  stroke-width: 1.85;}

.like-count,
.comment-count,
.like-count.like-count-btn{display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 14px;
  height: 24px;
  padding: 0;
  margin: 0;}

@media (min-width: 768px){
.feed-posts{display: flex;
    flex-direction: column;
    align-items: center;}

.feed-posts .post{width: 100%;
    max-width: 480px;
    margin-left: auto;
    margin-right: auto;}
}

.feed .header{padding: 22px 18px 12px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;}

.feed .header::after{display: none !important;}

.feed .header-top{min-height: 56px !important;
  display: grid !important;
  grid-template-columns: max-content 1fr max-content !important;
  align-items: center !important;
  column-gap: 14px !important;
  position: relative !important;
  background: transparent !important;}

.feed .logo{display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 8px !important;
  min-width: 0 !important;
  justify-self: start !important;}

.feed .planes-logo-mark{width: 26px !important;
  height: 26px !important;
  object-fit: contain !important;
  border-radius: 8px !important;
  flex: 0 0 auto !important;
  display: block !important;
  filter: none !important;}

.feed .logo-text{font-family:
    ui-rounded,
    "SF Pro Rounded",
    "Nunito Sans",
    "Plus Jakarta Sans",
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
  color: #0e0e11 !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.03em !important;
  text-shadow: none !important;}

.feed .location-switcher.location-switcher--chatlike{position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 20 !important;
  margin: 0 !important;}

.feed .location-switcher--chatlike summary{list-style: none !important;}

.feed .location-switcher--chatlike summary::-webkit-details-marker{display: none !important;}

.feed .location-switcher--chatlike .location-switcher-trigger{display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  user-select: none !important;}

.feed .location-switcher--chatlike .location-switcher-main{color: #0e0e11 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.025em !important;
  text-align: center !important;
  text-shadow: none !important;}

.feed .location-switcher--chatlike .location-switcher-subrow,
.feed .location-switcher--chatlike .location-switcher-sub{display: none !important;}

.feed .location-switcher--chatlike .location-switcher-caret{position: static !important;
  width: 16px !important;
  height: 16px !important;
  stroke: #0e0e11 !important;
  stroke-width: 2.6 !important;
  fill: none !important;
  transform: none !important;
  transition: transform 0.18s ease !important;
  margin-top: 2px !important;
  flex: 0 0 16px !important;}

.feed .location-switcher--chatlike[open] .location-switcher-caret{transform: rotate(180deg) !important;}

.feed .location-switcher--chatlike .location-switcher-menu{position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  width: min(86vw, 330px) !important;
  min-width: 0 !important;
  padding: 10px !important;
  border-radius: 22px !important;
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 18px 45px rgba(0, 0, 0, 0.16) !important;
  backdrop-filter: blur(18px) !important;
  -webkit-backdrop-filter: blur(18px) !important;
  z-index: 999 !important;}

.feed .location-switcher--chatlike .location-switcher-item{width: 100% !important;
  color: #111 !important;
  background: #f6f6f6 !important;
  border: 0 !important;
  border-radius: 16px !important;
  padding: 14px 16px !important;
  font-weight: 800 !important;}

.feed .location-switcher--chatlike .location-switcher-item span{color: rgba(0, 0, 0, 0.52) !important;
  font-weight: 700 !important;}

.feed .header-actions{justify-self: end !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;}

.feed .action-btn{width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  min-height: 54px !important;
  border-radius: 50% !important;
  border: none !important;
  background: #fff !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #0e0e11 !important;
  stroke: #0e0e11 !important;}

.feed .action-btn svg{width: 24px !important;
  height: 24px !important;
  stroke: #0e0e11 !important;
  stroke-width: 2.3 !important;
  fill: none !important;}

.feed .action-btn.notify{position: relative !important;}

.feed .action-btn.notify .notif-dot,
.feed .notif-dot{top: 8px !important;
  right: 8px !important;
  width: 10px !important;
  height: 10px !important;
  box-shadow: 0 0 0 2px #fff !important;}

.feed .brand-mark,
.feed .brand-mark-logo,
.feed .brand-mark-text{display: none !important;}

@media (max-width: 640px){
.feed .header{padding: 22px 18px 12px !important;}

.feed .header-top{min-height: 56px !important;
    column-gap: 10px !important;}

.feed .logo-text{font-size: 24px !important;}

.feed .location-switcher--chatlike .location-switcher-main{font-size: 18px !important;}

.feed .location-switcher--chatlike .location-switcher-trigger{padding: 0 !important;
    min-width: 0 !important;}

.feed .action-btn{width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    min-height: 54px !important;}
}

.feed .header .logo-text,
.feed header.header .logo-text,
.feed .logo .logo-text{font-family:
    ui-rounded,
    "SF Pro Rounded",
    "Nunito Sans",
    "Plus Jakarta Sans",
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
  color: #0e0e11 !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.03em !important;
  text-shadow: none !important;
  font-style: normal !important;
  text-transform: none !important;}

.feed .location-switcher--chatlike .location-switcher-main,
.feed .header .location-switcher-main,
.feed header.header .location-switcher-main{font-family:
    ui-rounded,
    "SF Pro Rounded",
    "Nunito Sans",
    "Plus Jakarta Sans",
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
  color: #0e0e11 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.025em !important;
  text-align: center !important;
  text-shadow: none !important;
  font-style: normal !important;
  text-transform: none !important;}

@media (max-width: 640px){
.feed .header .logo-text,
.feed header.header .logo-text,
.feed .logo .logo-text{font-size: 24px !important;}

.feed .location-switcher--chatlike .location-switcher-main,
.feed .header .location-switcher-main,
.feed header.header .location-switcher-main{font-size: 18px !important;}
}

.feed .logo[aria-label="Friends"] .logo-text{font-family:
    ui-rounded,
    "SF Pro Rounded",
    "Nunito Sans",
    "Plus Jakarta Sans",
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  letter-spacing: -0.03em !important;
  line-height: 1 !important;
  color: #0e0e11 !important;}

.feed .feed-posts{width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  gap: 18px !important;}

.feed .post{width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;}

.feed .post.post--with-media{padding-top: 10px !important;
  border-radius: 0 !important;}

.feed .post-media{width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-top: 0 !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  background: #000 !important;}

.feed .post-media-track,
.feed .post-media-item,
.feed .post-media-item img,
.feed .post-media-item video{border-radius: 28px !important;
  overflow: hidden !important;}

.feed .post-media-item img,
.feed .post-media-item video{width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;}

.feed .post-media-overlay{border-top-left-radius: 28px !important;
  border-top-right-radius: 28px !important;
  overflow: hidden !important;}

.feed .post-content,
.feed .post-actions,
.feed .post-header:not(.post-media-overlay .post-header){width: calc(100% - 28px) !important;
  margin-left: auto !important;
  margin-right: auto !important;}

@media (min-width: 768px){
.feed .post{width: 100% !important;
    max-width: none !important;
    padding-left: 0 !important;
    padding-right: 0 !important;}
}

.feed .feed-posts{background: #000 !important;
  width: 100% !important;
  max-width: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;}

.feed .post,
.feed .post.post--with-media{width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  padding-top: 10px !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;}

.feed .post-media{width: 100% !important;
  max-width: none !important;
  margin: 0 0 12px 0 !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  background: transparent !important;
  box-shadow: none !important;
  isolation: isolate !important;
  transform: translateZ(0);
  -webkit-mask-image: -webkit-radial-gradient(white, black);}

.feed .post-media-track,
.feed .post-media-item{height: 100% !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  background: transparent !important;}

.feed .post-media-item img,
.feed .post-media-item video{width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  border-radius: 28px !important;
  background: #000 !important;}

.feed .post-media-overlay{border-radius: 28px 28px 0 0 !important;
  overflow: hidden !important;}

.feed .post-content,
.feed .post-actions,
.feed .post > .post-header{width: calc(100% - 28px) !important;
  margin-left: auto !important;
  margin-right: auto !important;}

html body .feed-posts,
html body main.feed-posts{background: #000 !important;}

html body .feed-posts > .post,
html body .feed-posts > article.post,
html body article.post,
html body .post.post--with-media{border-radius: 28px !important;
  background: transparent !important;
  overflow: visible !important;
  box-shadow: none !important;}

html body .feed-posts > .post .post-media,
html body article.post .post-media,
html body .post-media{border-radius: 28px !important;
  overflow: hidden !important;
  background: transparent !important;
  clip-path: inset(0 round 28px) !important;
  isolation: isolate !important;
  transform: translateZ(0) !important;
  -webkit-mask-image: -webkit-radial-gradient(white, black) !important;}

html body .feed-posts > .post .post-media-track,
html body .feed-posts > .post .post-media-item,
html body article.post .post-media-track,
html body article.post .post-media-item,
html body .post-media-track,
html body .post-media-item{border-radius: 28px !important;
  overflow: hidden !important;
  background: transparent !important;
  clip-path: inset(0 round 28px) !important;}

html body .feed-posts > .post .post-media-item img,
html body .feed-posts > .post .post-media-item video,
html body article.post .post-media-item img,
html body article.post .post-media-item video,
html body .post-media-item img,
html body .post-media-item video{border-radius: 28px !important;
  overflow: hidden !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  background: #000 !important;
  clip-path: inset(0 round 28px) !important;}

html body .feed-posts > .post .post-media-overlay,
html body article.post .post-media-overlay,
html body .post-media-overlay{border-radius: 28px 28px 0 0 !important;
  overflow: hidden !important;}

html,
body,
.feed,
.feed .feed-posts,
html body .feed-posts,
html body main.feed-posts{background: #ffffff !important;}

.feed .post,
.feed .post.post--with-media,
html body .feed-posts > .post,
html body .feed-posts > article.post,
html body article.post,
html body .post.post--with-media,
.feed .post--uploading,
.feed .uploading-card{border-radius: 28px !important;
  background: #ffffff !important;
  overflow: hidden !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.08) !important;
  border: 0 !important;}

.feed .post.post--with-media,
html body .post.post--with-media{padding-top: 0 !important;}

.feed .post-media,
html body .feed-posts > .post .post-media,
html body article.post .post-media,
html body .post-media,
.feed .post-media-track,
.feed .post-media-item,
html body .post-media-track,
html body .post-media-item,
.feed .uploading-media{background: #ffffff !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  clip-path: inset(0 round 28px) !important;
  isolation: isolate !important;
  transform: translateZ(0) !important;
  -webkit-mask-image: -webkit-radial-gradient(white, black) !important;}

.feed .post-media-item img,
.feed .post-media-item video,
html body .post-media-item img,
html body .post-media-item video,
.feed .uploading-media img,
.feed .uploading-media video{background: #ffffff !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  clip-path: inset(0 round 28px) !important;}

.feed .post-media-overlay,
html body .post-media-overlay{border-radius: 28px 28px 0 0 !important;
  overflow: hidden !important;}

.feed .post-actions,
html body .feed-posts .post .post-actions{background: #ffffff !important;
  border-radius: 0 0 28px 28px !important;
  border: 0 !important;
  box-shadow: none !important;}

.feed .post-content,
.feed .post-header,
.feed .post-meta-inline,
.feed .post-action-group,
.feed .post-action-right{background: transparent !important;}

.feed .header{padding: 22px 18px 12px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  backdrop-filter: blur(18px) saturate(140%) !important;
  -webkit-backdrop-filter: blur(18px) saturate(140%) !important;}

.feed .header::after{display: none !important;}

.feed .header-top{min-height: 56px !important;
  display: grid !important;
  grid-template-columns: max-content 1fr max-content !important;
  align-items: center !important;
  column-gap: 14px !important;
  position: relative !important;
  background: transparent !important;}

.feed .logo{display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  min-width: 0 !important;
  justify-self: start !important;
  gap: 8px !important;}

.feed .planes-logo-mark{width: 26px !important;
  height: 26px !important;
  object-fit: contain !important;
  border-radius: 8px !important;
  flex: 0 0 auto !important;
  display: block !important;
  filter: none !important;}

.feed .logo-text,
.feed .header .logo-text,
.feed header.header .logo-text,
.feed .logo .logo-text{font-family:
    ui-rounded,
    "SF Pro Rounded",
    "Nunito Sans",
    "Plus Jakarta Sans",
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
  color: #0e0e11 !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.03em !important;
  text-shadow: none !important;
  font-style: normal !important;
  text-transform: none !important;}

.feed .location-switcher.location-switcher--chatlike{position: absolute !important;
  top: 50% !important;
  left: 50% !important;
  transform: translate(-50%, -50%) !important;
  z-index: 20 !important;
  margin: 0 !important;}

.feed .location-switcher--chatlike summary{list-style: none !important;}

.feed .location-switcher--chatlike summary::-webkit-details-marker{display: none !important;}

.feed .location-switcher--chatlike .location-switcher-trigger{display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px !important;
  min-width: 0 !important;
  padding: 0 !important;
  cursor: pointer !important;
  user-select: none !important;}

.feed .location-switcher--chatlike .location-switcher-main,
.feed .header .location-switcher-main,
.feed header.header .location-switcher-main{font-family:
    ui-rounded,
    "SF Pro Rounded",
    "Nunito Sans",
    "Plus Jakarta Sans",
    "Inter",
    -apple-system,
    BlinkMacSystemFont,
    sans-serif !important;
  color: #0e0e11 !important;
  font-size: 18px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  letter-spacing: -0.025em !important;
  text-align: center !important;
  text-shadow: none !important;
  font-style: normal !important;
  text-transform: none !important;}

.feed .location-switcher--chatlike .location-switcher-subrow,
.feed .location-switcher--chatlike .location-switcher-sub{display: none !important;}

.feed .location-switcher--chatlike .location-switcher-caret{position: static !important;
  width: 16px !important;
  height: 16px !important;
  stroke: #0e0e11 !important;
  stroke-width: 2.6 !important;
  fill: none !important;
  transform: none !important;
  transition: transform 0.18s ease !important;
  margin-top: 2px !important;
  flex: 0 0 16px !important;}

.feed .location-switcher--chatlike[open] .location-switcher-caret{transform: rotate(180deg) !important;}

.feed .location-switcher--chatlike[open] .location-switcher-menu{position: fixed !important;
  top: 50% !important;
  left: 50% !important;
  right: auto !important;
  bottom: auto !important;
  transform: translate(-50%, -50%) !important;
  margin: 0 !important;
  width: min(86vw, 330px) !important;
  min-width: 0 !important;
  padding: 12px !important;
  border-radius: 26px !important;
  background: rgba(255, 255, 255, 0.97) !important;
  color: #111 !important;
  border: 1px solid rgba(17, 17, 17, 0.08) !important;
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: blur(22px) saturate(145%) !important;
  -webkit-backdrop-filter: blur(22px) saturate(145%) !important;
  z-index: 650 !important;}

.feed .location-switcher--chatlike .location-switcher-item{width: 100% !important;
  min-height: 58px !important;
  border-radius: 18px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 12px !important;
  padding: 0 16px !important;
  background: #f5f5f6 !important;
  color: #111 !important;
  border: 0 !important;
  font-weight: 900 !important;}

.feed .location-switcher--chatlike .location-switcher-item span{font-size: 12px !important;
  font-weight: 800 !important;
  color: rgba(17, 17, 17, 0.54) !important;}

.feed .header-actions{justify-self: end !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;}

.feed .action-btn{width: 54px !important;
  height: 54px !important;
  min-width: 54px !important;
  min-height: 54px !important;
  border-radius: 50% !important;
  border: none !important;
  background: #fff !important;
  box-shadow: 0 10px 26px rgba(0, 0, 0, 0.08) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #0e0e11 !important;
  stroke: #0e0e11 !important;
  transition: transform 0.15s ease !important;
  position: relative !important;
  cursor: pointer !important;}

.feed .action-btn:active{transform: scale(0.92) !important;}

.feed .action-btn svg{width: 24px !important;
  height: 24px !important;
  stroke: #0e0e11 !important;
  stroke-width: 2.3 !important;
  fill: none !important;}

.feed .action-btn.notify{position: relative !important;}

.feed .action-btn.notify .notif-dot,
.feed .notif-dot{position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  width: 10px !important;
  height: 10px !important;
  border-radius: 50% !important;
  box-shadow: 0 0 0 2px #fff !important;}

.feed .brand-mark,
.feed .brand-mark-logo,
.feed .brand-mark-text{display: none !important;}

@media (max-width: 640px){
.feed .header{padding: 22px 18px 12px !important;}

.feed .header-top{min-height: 56px !important;
    column-gap: 10px !important;}

.feed .logo-text,
.feed .header .logo-text,
.feed header.header .logo-text,
.feed .logo .logo-text{font-size: 24px !important;}

.feed .location-switcher--chatlike .location-switcher-main,
.feed .header .location-switcher-main,
.feed header.header .location-switcher-main{font-size: 18px !important;}

.feed .location-switcher--chatlike .location-switcher-trigger{padding: 0 !important;
    min-width: 0 !important;}

.feed .action-btn{width: 54px !important;
    height: 54px !important;
    min-width: 54px !important;
    min-height: 54px !important;}
}

@media (min-width: 900px){
html,
body{background: #ffffff !important;}

.feed{background: #ffffff !important;}

.feed-posts{width: min(720px, calc(100vw - 48px)) !important;
    max-width: 720px !important;
    margin: 0 auto !important;
    padding: 22px 0 150px !important;
    gap: 24px !important;
    align-items: stretch !important;}

.feed-posts .post{width: 100% !important;
    max-width: 720px !important;
    margin: 0 auto !important;
    --post-pad: 18px !important;
    padding: 18px !important;
    border-radius: 28px !important;
    overflow: hidden !important;
    background: #ffffff !important;
    border: 1px solid rgba(17, 17, 17, 0.08) !important;
    box-shadow: 0 18px 46px rgba(17, 17, 17, 0.1) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;}

.feed-posts .post.post--with-media{padding-top: 0 !important;
    border-radius: 28px !important;}

.feed-posts .post:hover{background: #ffffff !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 24px 58px rgba(17, 17, 17, 0.13) !important;}

.feed-posts .post-media{width: calc(100% + (2 * var(--post-pad))) !important;
    margin-left: calc(-1 * var(--post-pad)) !important;
    margin-right: calc(-1 * var(--post-pad)) !important;
    margin-top: 0 !important;
    border-radius: 28px 28px 0 0 !important;
    overflow: hidden !important;
    background: #ffffff !important;}

.feed-posts .post-media-track,
.feed-posts .post-media-item,
.feed-posts .post-media-item img,
.feed-posts .post-media-item video{border-radius: 28px 28px 0 0 !important;
    overflow: hidden !important;}

.feed-posts .post-media-item{max-height: 760px !important;}

.feed-posts .post-media-item img,
.feed-posts .post-media-item video{object-fit: cover !important;}

.feed-posts .post-actions{margin-left: calc(-1 * var(--post-pad)) !important;
    margin-right: calc(-1 * var(--post-pad)) !important;
    margin-bottom: calc(-1 * var(--post-pad)) !important;
    padding: 14px 18px 16px !important;
    background: #ffffff !important;
    border-top: 1px solid rgba(17, 17, 17, 0.06) !important;
    border-radius: 0 0 28px 28px !important;}

.feed-posts .post-content{font-size: 15px !important;
    line-height: 1.55 !important;
    color: rgba(17, 17, 17, 0.92) !important;}

.feed-posts .post-header{padding-top: 2px !important;}
}

.create-sheet.create-sheet--feed-pro{left: 50% !important;
  right: auto !important;
  bottom: max(10px, env(safe-area-inset-bottom)) !important;
  width: min(720px, calc(100vw - 24px)) !important;
  max-height: min(88vh, 820px) !important;
  transform: translate(-50%, calc(100% + 32px)) !important;
  border-radius: 28px !important;
  padding: 10px 14px 92px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  color: #09090b !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 30px 90px rgba(0, 0, 0, 0.34) !important;
  backdrop-filter: blur(28px) saturate(1.15) !important;
  -webkit-backdrop-filter: blur(28px) saturate(1.15) !important;}

.create-sheet.create-sheet--feed-pro.open{transform: translate(-50%, 0) !important;}

.create-sheet--feed-pro .sheet-handle{width: 46px;
  height: 5px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.16);
  margin: 4px auto 12px;}

.create-sheet--feed-pro .create-sheet-header{margin: 0 0 14px !important;
  padding: 4px 2px 0;}

.create-sheet--feed-pro .create-title-wrap{gap: 4px !important;}

.create-sheet--feed-pro .create-kicker{color: #ff5b37;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;}

.create-sheet--feed-pro .create-title{display: block;
  color: #0b0b0d;
  font-size: 24px !important;
  line-height: 1.05;
  font-weight: 850 !important;
  letter-spacing: -0.04em;}

.create-sheet--feed-pro .create-subtitle{color: rgba(9, 9, 11, 0.62) !important;
  opacity: 1 !important;
  font-size: 13px !important;
  line-height: 1.35;
  max-width: 520px;}

.create-sheet--feed-pro .close-sheet,
.create-sheet--feed-pro .create-close{width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  background: rgba(0, 0, 0, 0.05) !important;
  color: #0b0b0d !important;
  display: grid;
  place-items: center;
  font-size: 18px;}

.create-type-grid{display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin: 0 0 12px;}

.create-type-btn{border: 1px solid rgba(0, 0, 0, 0.08);
  background: #fff;
  color: #111;
  border-radius: 22px;
  padding: 14px;
  display: grid;
  grid-template-columns: 42px 1fr;
  grid-template-areas: "icon title" "icon sub";
  gap: 2px 10px;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.06);
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease;}

.create-type-btn:hover{transform: translateY(-1px);}

.create-type-btn.active{border-color: rgba(255, 91, 55, 0.42);
  background: rgba(255, 250, 247, 0.98);
  box-shadow: 0 16px 34px rgba(255, 91, 55, 0.13);}

.create-type-icon{grid-area: icon;
  width: 42px;
  height: 42px;
  border-radius: 16px;
  display: grid;
  place-items: center;
  background: rgba(255, 91, 55, 0.11);
  color: #ff5b37;
  font-weight: 900;}

.create-type-btn strong{grid-area: title;
  font-size: 14px;
  line-height: 1.15;}

.create-type-btn small{grid-area: sub;
  color: rgba(0, 0, 0, 0.54);
  font-weight: 650;}

.create-sheet--feed-pro .create-section-card{background: #fff;
  border: 1px solid rgba(0, 0, 0, 0.07);
  border-radius: 24px;
  padding: 14px;
  margin: 0 0 12px;
  box-shadow: 0 18px 44px rgba(0, 0, 0, 0.07);}

.create-sheet--feed-pro .create-section-title{color: #101014;
  font-size: 13px;
  font-weight: 850;
  margin: 0 0 10px;
  letter-spacing: -0.01em;}

.create-sheet--feed-pro .create-primary-btn{min-height: 74px;
  border-radius: 22px !important;
  background: rgba(255, 250, 247, 0.98) !important;
  border: 1px dashed rgba(255, 91, 55, 0.42) !important;
  color: #101014 !important;
  padding: 14px !important;}

.create-sheet--feed-pro .create-primary-icon{width: 46px !important;
  height: 46px !important;
  background: #ff5a12 !important;
  color: #fff !important;
  border: 0 !important;
  box-shadow: 0 14px 26px rgba(255, 91, 55, 0.28);}

.create-primary-copy{display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;}

.create-sheet--feed-pro .create-primary-text{color: #101014 !important;
  font-size: 15px !important;
  font-weight: 850 !important;}

.create-sheet--feed-pro .create-primary-hint{margin: 0 !important;
  color: rgba(0, 0, 0, 0.55) !important;
  font-size: 12px !important;
  opacity: 1 !important;}

.create-sheet--feed-pro .create-textarea{display: block !important;
  min-height: 116px;
  margin: 0 !important;
  border-radius: 20px !important;
  background: #f7f7f8 !important;
  color: #111 !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  font-size: 15px !important;}

.create-sheet--feed-pro .create-textarea::placeholder{color: rgba(0, 0, 0, 0.42);}

.create-sheet--feed-pro .create-textarea:focus{background: #fff !important;
  border-color: rgba(255, 91, 55, 0.55) !important;
  box-shadow: 0 0 0 4px rgba(255, 91, 55, 0.13) !important;}

.create-sheet--feed-pro .create-media-preview{display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin-top: 12px;}

.create-sheet--feed-pro .media-preview-item{aspect-ratio: 1/1.18;
  border-radius: 20px !important;
  overflow: hidden;
  background: #f0f0f1 !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  position: relative;
  box-shadow: 0 14px 30px rgba(0, 0, 0, 0.09);
  cursor: grab;}

.create-sheet--feed-pro .media-preview-item.dragging{opacity: 0.55;
  cursor: grabbing;}

.create-sheet--feed-pro .media-preview-item.drag-over{outline: 3px solid rgba(255, 91, 55, 0.38);
  outline-offset: 2px;}

.create-sheet--feed-pro .media-preview-item img,
.create-sheet--feed-pro .media-preview-item video{width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;}

.media-order-badge{position: absolute;
  top: 8px;
  left: 8px;
  min-width: 26px;
  height: 26px;
  padding: 0 8px;
  border-radius: 999px;
  display: grid;
  place-items: center;
  background: rgba(0, 0, 0, 0.68);
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  backdrop-filter: blur(10px);}

.media-order-controls{position: absolute;
  left: 8px;
  bottom: 8px;
  display: flex;
  gap: 6px;}

.media-order-btn{width: 30px;
  height: 30px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.22);
  background: rgba(0, 0, 0, 0.58);
  color: #fff;
  font-weight: 900;
  cursor: pointer;
  backdrop-filter: blur(10px);}

.media-order-btn:disabled{opacity: 0.28;
  cursor: not-allowed;}

.create-sheet--feed-pro .media-remove{top: 8px !important;
  right: 8px !important;
  background: rgba(0, 0, 0, 0.62) !important;
  color: #fff !important;
  border: 1px solid rgba(255, 255, 255, 0.2) !important;
  backdrop-filter: blur(10px);}

.create-sheet--feed-pro .location-input-wrap{display: flex;
  align-items: center;
  gap: 10px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: #f7f7f8;
  border-radius: 20px;
  padding: 0 10px 0 14px;
  min-height: 52px;}

.create-sheet--feed-pro .location-input-icon{color: #ff5b37;
  font-weight: 900;}

.create-sheet--feed-pro #createLocationInput{flex: 1;
  min-width: 0;
  border: 0;
  outline: 0;
  background: transparent;
  color: #111;
  font-size: 14px;
  font-weight: 650;}

.create-sheet--feed-pro #createLocationInput::placeholder{color: rgba(0, 0, 0, 0.42);
  font-weight: 600;}

.create-sheet--feed-pro .location-clear{width: 32px;
  height: 32px;
  border-radius: 999px;
  border: 0;
  background: rgba(0, 0, 0, 0.06);
  color: #111;
  font-weight: 850;}

.create-location-actions{display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
  margin-top: 10px;}

.create-location-btn{height: 38px;
  padding: 0 14px;
  border-radius: 999px;
  border: 1px solid rgba(255, 91, 55, 0.25);
  background: rgba(255, 91, 55, 0.09);
  color: #d9401d;
  font-size: 13px;
  font-weight: 850;}

.create-location-btn.active{background: #ff5b37;
  color: #fff;}

.create-sheet--feed-pro .create-location-text{max-width: 100%;
  padding: 8px 10px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.06);
  color: #111 !important;
  font-size: 12px;
  font-weight: 750;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;}

.create-sheet--feed-pro .location-selected-card{margin-top: 10px;
  border-radius: 18px;
  padding: 12px;
  background: linear-gradient(135deg, rgba(255, 246, 242, 0.96), #fff);
  border: 1px solid rgba(255, 91, 55, 0.18);}

.create-sheet--feed-pro .location-selected-title{font-size: 12px;
  font-weight: 900;
  color: #ff5b37;
  margin-bottom: 4px;}

.create-sheet--feed-pro .location-selected-address{font-size: 14px;
  font-weight: 850;
  color: #111;
  line-height: 1.25;}

.create-sheet--feed-pro .location-selected-meta{font-size: 12px;
  color: rgba(0, 0, 0, 0.55);
  margin-top: 3px;
  font-weight: 650;}

.create-sheet--feed-pro .form-hint{font-size: 12px;
  line-height: 1.35;
  color: rgba(0, 0, 0, 0.52);
  margin-top: 10px;
  font-weight: 600;}

.create-sheet--feed-pro .create-sheet-footer{position: sticky !important;
  bottom: -92px !important;
  margin: 12px -14px -92px;
  padding: 14px 14px calc(14px + env(safe-area-inset-bottom)) !important;
  background: rgba(255, 255, 255, 0.94) !important;
  border-top: 1px solid rgba(0, 0, 0, 0.08) !important;
  backdrop-filter: blur(18px);}

.create-sheet--feed-pro .publish-btn{width: 100%;
  min-height: 52px;
  border-radius: 18px;
  border: 0;
  background: #ff5a12;
  color: #fff;
  font-size: 15px;
  font-weight: 900;
  box-shadow: 0 16px 34px rgba(255, 91, 55, 0.28);}

.create-sheet--feed-pro .publish-btn:disabled{background: #e8e8ea;
  color: rgba(0, 0, 0, 0.38);
  box-shadow: none;}

.pac-container{z-index: 3000 !important;
  border-radius: 18px !important;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.18) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  overflow: hidden;
  font-family:
    Inter,
    system-ui,
    -apple-system,
    BlinkMacSystemFont,
    "Segoe UI",
    sans-serif !important;}

@media (max-width: 899px){
.create-sheet.create-sheet--feed-pro{left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    width: 100% !important;
    max-height: 92vh !important;
    transform: translateY(100%) !important;
    border-radius: 28px 28px 0 0 !important;
    padding-left: 14px !important;
    padding-right: 14px !important;}

.create-sheet.create-sheet--feed-pro.open{transform: translateY(0) !important;}

.create-sheet--feed-pro .create-title{font-size: 21px !important;}

.create-type-grid{grid-template-columns: 1fr 1fr;
    gap: 8px;}

.create-type-btn{padding: 12px;
    grid-template-columns: 36px 1fr;}

.create-type-icon{width: 36px;
    height: 36px;
    border-radius: 14px;}

.create-sheet--feed-pro .create-media-preview{grid-template-columns: repeat(2, minmax(0, 1fr));}
}

.feed .logo-text,
.feed .header .logo-text,
.feed header.header .logo-text,
.feed .logo .logo-text,
.feed .logo[aria-label="Friends"] .logo-text{font-weight: 400 !important;}

.post-media{position: relative !important;}

.post-media-arrow{display: none;}

@media (min-width: 900px){
.post-media-arrow{position: absolute !important;
    top: 50% !important;
    z-index: 18 !important;
    width: 44px !important;
    height: 44px !important;
    border-radius: 999px !important;
    border: 1px solid rgba(255, 255, 255, 0.5) !important;
    background: rgba(8, 8, 10, 0.4) !important;
    color: #fff !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    transform: translateY(-50%) !important;
    box-shadow: 0 14px 34px rgba(0, 0, 0, 0.24) !important;
    backdrop-filter: blur(14px) saturate(130%) !important;
    -webkit-backdrop-filter: blur(14px) saturate(130%) !important;
    cursor: pointer !important;
    opacity: 0.86 !important;
    transition:
      opacity 0.18s ease,
      transform 0.18s ease,
      background 0.18s ease !important;}

.post-media-arrow:hover{opacity: 1 !important;
    background: rgba(8, 8, 10, 0.58) !important;}

.post-media-arrow:active{transform: translateY(-50%) scale(0.94) !important;}

.post-media-arrow--prev{left: 16px !important;}

.post-media-arrow--next{right: 16px !important;}

.post-media-arrow svg{width: 25px !important;
    height: 25px !important;
    fill: none !important;
    stroke: currentColor !important;
    stroke-width: 2.7 !important;
    stroke-linecap: round !important;
    stroke-linejoin: round !important;}
}

@media (max-width: 899px){
.post-media-arrow{display: none !important;}
}

.feed-posts .post .post-actions{min-height: 62px !important;
  padding: 14px 18px 16px !important;}

.feed-posts .post .post-action-group{display: grid !important;
  grid-template-columns: 28px auto 28px auto !important;
  align-items: center !important;
  column-gap: 8px !important;
  row-gap: 0 !important;}

.feed-posts .post .post-action-btn,
.feed-posts .post .like-count,
.feed-posts .post .comment-count{align-self: center !important;
  justify-self: center !important;}

.feed-posts .post .like-count,
.feed-posts .post .comment-count,
.feed-posts .post .like-count-btn{display: inline-flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  height: 28px !important;
  min-width: 18px !important;
  margin: 0 !important;
  padding: 0 2px !important;
  border: 0 !important;
  background: transparent !important;
  font-size: 13px !important;
  line-height: 1 !important;
  font-weight: 700 !important;
  color: #111 !important;
  transform: translateY(1px);}

.feed-posts .post .post-action-right{min-height: 28px !important;}

.feed-posts .post.post--focus-return{animation: feedPostFocusReturn 1.45s ease both;}

@keyframes feedPostFocusReturn{0% {
    box-shadow:
      0 0 0 0 rgba(255, 255, 255, 0),
      0 0 0 0 rgba(0, 0, 0, 0);
    transform: scale(1);
  }
  18% {
    box-shadow:
      0 0 0 4px rgba(255, 255, 255, 0.92),
      0 18px 60px rgba(0, 0, 0, 0.35);
    transform: scale(1.012);
  }
  100% {
    box-shadow: none;
    transform: scale(1);
  }}

.comment-input[hidden],
.feed-comment-login-note[hidden],
.feed-comment-input-wrap[hidden],
.feed-comments-gate[hidden],
#feedCommentsSheet .comment-input[hidden],
#feedCommentsSheet .feed-comment-input-wrap[hidden],
#feedCommentsSheet .feed-comments-gate[hidden]{display: none !important;}

.comment-input textarea{flex: 1 1 auto;
  width: 100%;
  min-height: 46px;
  max-height: 118px;
  resize: none;
  border: 0;
  outline: 0;
  background: rgba(0, 0, 0, 0.055);
  border-radius: 22px;
  padding: 13px 15px;
  font: inherit;
  line-height: 1.35;
  color: #111;}

.comment-input textarea::placeholder{color: rgba(0, 0, 0, 0.45);}

.feed-comment-login-note,
.feed-comments-gate{margin: 12px 18px 18px;
  padding: 16px;
  border-radius: 22px;
  background: linear-gradient(
    180deg,
    rgba(255, 255, 255, 0.94),
    rgba(245, 245, 247, 0.9)
  );
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 18px 50px rgba(0, 0, 0, 0.12);
  display: grid;
  gap: 8px;
  text-align: left;}

.feed-comments-gate{margin: 16px 4px 4px;}

.feed-comment-login-note strong,
.feed-comments-gate strong{font-size: 15px;
  line-height: 1.15;
  color: #111;}

.feed-comment-login-note span,
.feed-comments-gate span{font-size: 13px;
  line-height: 1.35;
  color: rgba(0, 0, 0, 0.62);}

.feed-inline-auth-btn{margin-top: 4px;
  width: max-content;
  min-height: 38px;
  padding: 0 16px;
  border: 0;
  border-radius: 999px;
  background: #111;
  color: #fff;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.18);}

.feed-inline-auth-btn:active{transform: scale(0.96);}

#feedCommentsOverlay.comments-overlay{z-index: 900 !important;
  background: rgba(0, 0, 0, 0.34) !important;
  backdrop-filter: blur(4px) !important;
  -webkit-backdrop-filter: blur(4px) !important;}

#feedCommentsSheet.comments-sheet{z-index: 901 !important;
  background: #fff !important;
  border-radius: 28px 28px 0 0 !important;
  box-shadow: 0 -18px 48px rgba(15, 23, 42, 0.16) !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
  border-bottom: 0 !important;
  color: #111 !important;}

#feedCommentsSheet .sheet-title{color: #111 !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;}

#feedCommentsSheet .comments-list{padding-bottom: 20px !important;}

#feedCommentsSheet .comment-item{border-bottom: 0 !important;
  padding: 14px 4px !important;}

.feed-comment-input-wrap{display: grid !important;
  gap: 12px !important;
  margin-top: 8px !important;
  background: #fff !important;}

#feedCommentsSheet .comment-input{position: sticky !important;
  bottom: 0 !important;
  display: flex !important;
  align-items: flex-end !important;
  gap: 12px !important;
  margin: 0 !important;
  padding: 8px 0 2px !important;
  background: #fff !important;
  border-top: 0 !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;}

#feedCommentsSheet .comment-input textarea{flex: 1 !important;
  min-height: 52px !important;
  max-height: 112px !important;
  border-radius: 24px !important;
  border: 1px solid rgba(15, 23, 42, 0.1) !important;
  outline: none !important;
  padding: 14px 18px !important;
  background: #fff !important;
  color: #111 !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08) !important;
  resize: none !important;
  overflow-y: hidden !important;
  line-height: 1.45 !important;
  font: inherit !important;
  white-space: pre-wrap !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;}

#feedCommentsSheet .comment-input textarea::placeholder{color: rgba(15, 23, 42, 0.45) !important;}

#feedCommentsSheet .comment-input button{width: 52px !important;
  min-width: 52px !important;
  height: 52px !important;
  border-radius: 50% !important;
  border: none !important;
  background: #111 !important;
  box-shadow: 0 14px 26px rgba(17, 17, 17, 0.16) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  cursor: pointer !important;}

.feed-comment-login-note,
.feed-comments-gate{margin: 14px 0 4px !important;
  padding: 16px 18px !important;
  border-radius: 22px !important;
  border: 1px solid rgba(15, 23, 42, 0.1) !important;
  background: linear-gradient(180deg, #ffffff 0%, #f8fafc 100%) !important;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.08) !important;
  display: grid !important;
  gap: 8px !important;
  text-align: left !important;}

.feed-comment-login-note strong,
.feed-comments-gate strong{font-size: 14px !important;
  font-weight: 800 !important;
  color: #111 !important;
  line-height: 1.3 !important;}

.feed-comment-login-note span,
.feed-comments-gate span{font-size: 13px !important;
  line-height: 1.55 !important;
  color: rgba(15, 23, 42, 0.58) !important;}

.feed-inline-auth-btn{width: max-content !important;
  min-height: 42px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  border: 1px solid #111 !important;
  background: #111 !important;
  color: #fff !important;
  font: inherit !important;
  font-weight: 800 !important;
  cursor: pointer !important;
  box-shadow: 0 12px 22px rgba(17, 17, 17, 0.12) !important;}

.feed-inline-auth-btn:active{transform: scale(0.98) !important;}

#feedCommentsSheet .comment-profile-link{display: block !important;
  flex: 0 0 auto !important;
  width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  overflow: hidden !important;
  text-decoration: none !important;
  cursor: pointer !important;}

#feedCommentsSheet .comment-profile-link .comment-avatar,
#feedCommentsSheet .comment-avatar{width: 42px !important;
  height: 42px !important;
  border-radius: 50% !important;
  object-fit: cover !important;
  display: block !important;}

#feedCommentsSheet .feed-comments-gate{margin: 14px 0 6px !important;}

.feed-posts .post .post-actions{display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: start !important;
  gap: 10px 14px !important;}

.feed-posts .post .post-footer-copy{grid-column: 1 / -1 !important;
  width: 100% !important;
  margin-top: 2px !important;
  padding-top: 0 !important;
  color: #111 !important;
  background: transparent !important;}

.feed-posts .post .post-description{max-width: 100% !important;
  font-size: 14px !important;
  line-height: 1.35 !important;
  font-weight: 500 !important;
  color: #111 !important;
  overflow: hidden !important;}

.feed-posts .post .post-description.is-collapsed span{display: -webkit-box !important;
  -webkit-line-clamp: 1 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;}

.feed-posts .post .post-description-more{margin: 4px 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #6f6f78 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  font-weight: 700 !important;
  letter-spacing: -0.01em !important;
  cursor: pointer !important;}

.feed-posts .post .post-featured-comment{display: flex !important;
  align-items: flex-start !important;
  gap: 8px !important;
  max-width: 100% !important;}

.feed-posts .post .post-featured-avatar-link{flex: 0 0 auto !important;
  width: 24px !important;
  height: 24px !important;
  border-radius: 999px !important;
  overflow: hidden !important;
  display: inline-flex !important;
  background: #f0f0f2 !important;
  text-decoration: none !important;}

.feed-posts .post .post-featured-avatar{width: 24px !important;
  height: 24px !important;
  border-radius: 999px !important;
  object-fit: cover !important;
  display: block !important;}

.feed-posts .post .post-featured-body{min-width: 0 !important;
  flex: 1 1 auto !important;}

.feed-posts .post .post-featured-user{display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  min-width: 0 !important;
  font-size: 13px !important;
  line-height: 1.15 !important;
  font-weight: 800 !important;
  color: #111 !important;}

.feed-posts .post .post-featured-user a{color: inherit !important;
  text-decoration: none !important;
  max-width: 160px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  white-space: nowrap !important;}

.feed-posts .post .post-featured-user .verified-badge{width: 14px !important;
  height: 14px !important;
  flex: 0 0 auto !important;}

.feed-posts .post .post-featured-text{margin-top: 2px !important;
  font-size: 14px !important;
  line-height: 1.32 !important;
  font-weight: 500 !important;
  color: #202026 !important;
  display: -webkit-box !important;
  -webkit-line-clamp: 1 !important;
  -webkit-box-orient: vertical !important;
  overflow: hidden !important;}

.feed-posts .post .post-time-ago{display: block !important;
  margin-top: 7px !important;
  font-size: 12px !important;
  line-height: 1.15 !important;
  font-weight: 700 !important;
  letter-spacing: 0.01em !important;
  color: #8a8a94 !important;}

.feed .feed-posts,
html body .feed .feed-posts,
html body main.feed-posts{display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 14px !important;
  padding-right: 14px !important;
  box-sizing: border-box !important;}

.feed .feed-posts > .post,
html body .feed-posts > article.post,
html body article.post{width: 100% !important;
  max-width: 640px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  border-radius: 28px !important;
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: 0 12px 30px rgba(0, 0, 0, 0.08) !important;
  box-sizing: border-box !important;}

.feed .feed-posts > .post.post--with-media,
html body .feed-posts > article.post.post--with-media{padding: 0 !important;}

.feed .feed-posts > .post .post-media,
html body .feed-posts > article.post .post-media,
html body article.post .post-media{width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  border-radius: 28px 28px 0 0 !important;
  overflow: hidden !important;
  clip-path: inset(0 round 28px 28px 0 0) !important;
  background: #000 !important;}

.feed .feed-posts > .post .post-media-track,
.feed .feed-posts > .post .post-media-item,
.feed .feed-posts > .post .post-media-item img,
.feed .feed-posts > .post .post-media-item video,
html body article.post .post-media-track,
html body article.post .post-media-item,
html body article.post .post-media-item img,
html body article.post .post-media-item video{border-radius: 0 !important;
  clip-path: none !important;}

.feed .feed-posts > .post .post-media-overlay,
html body article.post .post-media-overlay{border-radius: 28px 28px 0 0 !important;
  overflow: hidden !important;}

.feed .feed-posts > .post .post-actions,
html body .feed-posts .post .post-actions{width: 100% !important;
  margin: 0 !important;
  padding: 14px 16px 16px !important;
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: 1fr auto !important;
  align-items: start !important;
  gap: 10px 12px !important;
  background: #fff !important;
  border-radius: 0 0 28px 28px !important;
  overflow: hidden !important;}

.feed .feed-posts > .post .post-action-group{min-width: 0 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;}

.feed .feed-posts > .post .post-action-right{display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;}

.feed .feed-posts > .post .post-action-btn,
.feed .feed-posts > .post .like-count,
.feed .feed-posts > .post .comment-count{display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;}

.feed .feed-posts > .post .post-footer-copy{grid-column: 1 / -1 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 2px 0 0 !important;
  box-sizing: border-box !important;}

.feed .feed-posts > .post .post-description,
.feed .feed-posts > .post .post-featured-comment,
.feed .feed-posts > .post .post-time-ago{width: 100% !important;
  max-width: 100% !important;}

.feed .feed-posts > .post .post-description-more{display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;}

@media (min-width: 768px){
.feed .feed-posts,
html body .feed .feed-posts,
html body main.feed-posts{padding-left: 20px !important;
    padding-right: 20px !important;}

.feed .feed-posts > .post,
html body .feed-posts > article.post,
html body article.post{max-width: 660px !important;}
}

@media (max-width: 767px){
.feed .feed-posts,
html body .feed .feed-posts,
html body main.feed-posts{padding-left: 0 !important;
    padding-right: 0 !important;}

.feed .feed-posts > .post,
html body .feed-posts > article.post,
html body article.post{max-width: 100% !important;
    border-radius: 28px !important;}
}

.feed .feed-posts > article.post,
.feed-posts > article.post,
html body .feed-posts > article.post{border-radius: 28px !important;
  overflow: hidden !important;
  background: #fff !important;}

.feed .feed-posts > article.post.post--with-media,
.feed-posts > article.post.post--with-media,
html body .feed-posts > article.post.post--with-media{border-radius: 28px !important;
  overflow: hidden !important;}

.feed .feed-posts > article.post .post-media,
.feed-posts > article.post .post-media,
html body .feed-posts > article.post .post-media{border-radius: 28px 28px 0 0 !important;
  overflow: hidden !important;
  clip-path: inset(0 round 28px 28px 0 0) !important;}

.feed .feed-posts > article.post .post-actions,
.feed-posts > article.post .post-actions,
html body .feed-posts > article.post .post-actions{border-radius: 0 0 28px 28px !important;
  overflow: hidden !important;
  background: #fff !important;
  clip-path: inset(0 round 0 0 28px 28px) !important;}

.feed .feed-posts > article.post .post-footer-copy,
.feed-posts > article.post .post-footer-copy,
html body .feed-posts > article.post .post-footer-copy{border-radius: 0 0 24px 24px !important;}

#feedCommentsSheet.comments-sheet{left: 12px !important;
  right: 12px !important;
  bottom: calc(-100vh - 80px) !important;
  width: auto !important;
  max-width: 660px !important;
  height: min(70vh, 720px) !important;
  margin: 0 auto !important;
  padding: 18px !important;
  border-radius: 28px !important;
  border: 1px solid rgba(15, 23, 42, 0.08) !important;
  background: #fff !important;
  overflow: hidden !important;
  box-shadow: 0 24px 70px rgba(15, 23, 42, 0.24) !important;}

#feedCommentsSheet.comments-sheet.open{bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;}

#feedCommentsSheet .comments-list{padding-bottom: 12px !important;}

#feedCommentsSheet .feed-comment-input-wrap{margin-top: 10px !important;
  padding-top: 4px !important;
  border-radius: 24px !important;
  background: #fff !important;}

@media (min-width: 768px){
#feedCommentsSheet.comments-sheet{left: 50% !important;
    right: auto !important;
    transform: translateX(-50%) !important;
    width: min(660px, calc(100vw - 40px)) !important;
    bottom: calc(-100vh - 80px) !important;}

#feedCommentsSheet.comments-sheet.open{bottom: 24px !important;}
}

@media (max-width: 767px){
#feedCommentsSheet.comments-sheet{left: 10px !important;
    right: 10px !important;
    max-width: none !important;
    height: min(72vh, 720px) !important;}

#feedCommentsSheet.comments-sheet.open{bottom: calc(12px + env(safe-area-inset-bottom, 0px)) !important;}
}

.feed .feed-posts > article.post,
.feed-posts > article.post,
html body .feed-posts > article.post,
html body article.post{background: transparent !important;
  box-shadow: none !important;
  border-radius: 28px !important;
  overflow: visible !important;}

.feed .feed-posts > article.post.post--with-media,
.feed-posts > article.post.post--with-media,
html body .feed-posts > article.post.post--with-media{background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
  padding: 0 !important;}

.feed .feed-posts > article.post .post-media,
.feed-posts > article.post .post-media,
html body .feed-posts > article.post .post-media,
html body article.post .post-media{border-radius: 28px !important;
  clip-path: inset(0 round 28px) !important;
  overflow: hidden !important;
  box-shadow: 0 14px 34px rgba(0, 0, 0, 0.16) !important;
  background: #000 !important;}

.feed .feed-posts > article.post .post-media-overlay,
html body article.post .post-media-overlay{border-radius: 28px !important;
  overflow: hidden !important;}

.feed .feed-posts > article.post .post-actions,
.feed-posts > article.post .post-actions,
html body .feed-posts > article.post .post-actions,
html body .feed-posts .post .post-actions{width: calc(100% - 16px) !important;
  margin: 10px auto 0 !important;
  padding: 14px 16px 16px !important;
  border-radius: 28px !important;
  clip-path: inset(0 round 28px) !important;
  overflow: hidden !important;
  background: #fff !important;
  box-shadow: 0 14px 34px rgba(15, 23, 42, 0.12) !important;}

.feed .feed-posts > article.post:not(.post--with-media) .post-actions,
.feed-posts > article.post:not(.post--with-media) .post-actions,
html body .feed-posts > article.post:not(.post--with-media) .post-actions{width: 100% !important;
  margin-top: 0 !important;}

.feed .feed-posts > article.post .post-footer-copy,
.feed-posts > article.post .post-footer-copy,
html body .feed-posts > article.post .post-footer-copy{border-radius: 0 !important;}

@media (max-width: 767px){
.feed .feed-posts > article.post .post-actions,
.feed-posts > article.post .post-actions,
html body .feed-posts > article.post .post-actions,
html body .feed-posts .post .post-actions{width: calc(100% - 20px) !important;
    margin-top: 10px !important;}
}

.feed-posts > article.post .post-media,
html body .feed-posts > article.post .post-media{position: relative !important;}

.feed-posts > article.post .post-media-track,
.feed-posts > article.post .post-media-item,
.feed-posts > article.post .post-media-item img,
.feed-posts > article.post .post-media-item video,
html body .feed-posts > article.post .post-media-track,
html body .feed-posts > article.post .post-media-item,
html body .feed-posts > article.post .post-media-item img,
html body .feed-posts > article.post .post-media-item video{width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  min-width: 0 !important;
  object-fit: cover !important;
  box-sizing: border-box !important;}

.feed-posts > article.post .post-delete-btn--media,
html body .feed-posts > article.post .post-delete-btn--media{position: absolute !important;
  left: 14px !important;
  bottom: 14px !important;
  z-index: 9 !important;
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  min-height: 46px !important;
  padding: 0 !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #fff !important;
  background: rgba(0, 0, 0, 0.48) !important;
  box-shadow:
    0 14px 34px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  backdrop-filter: blur(16px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(150%) !important;}

.feed-posts > article.post .post-delete-btn--media .icon-trash,
html body .feed-posts > article.post .post-delete-btn--media .icon-trash{width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.1 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;}

@media (hover: hover) and (pointer: fine){
.feed-posts > article.post .post-delete-btn--media:hover,
html body .feed-posts > article.post .post-delete-btn--media:hover{transform: translateY(-1px) scale(1.03) !important;
    background: rgba(0, 0, 0, 0.62) !important;
    box-shadow:
      0 18px 44px rgba(0, 0, 0, 0.34),
      inset 0 1px 0 rgba(255, 255, 255, 0.22) !important;}
}

@media (min-width: 900px){
html body main.feed-posts,
html body .feed-posts{width: 100% !important;
    max-width: 100% !important;
    padding-left: 24px !important;
    padding-right: 24px !important;
    gap: 30px !important;
    align-items: center !important;
    box-sizing: border-box !important;}

html body .feed-posts > article.post,
html body article.post{width: min(720px, calc(100vw - 64px)) !important;
    max-width: 720px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;}

html body .feed-posts > article.post.post--with-media{width: min(720px, calc(100vw - 64px)) !important;
    max-width: 720px !important;
    padding: 0 !important;}

html body .feed-posts > article.post.post--with-media .post-media{width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    aspect-ratio: 4 / 5 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: calc(100vh - 190px) !important;
    border-radius: 28px !important;
    overflow: hidden !important;
    clip-path: inset(0 round 28px) !important;
    box-sizing: border-box !important;}

html body .feed-posts > article.post.post--with-media .post-media-track,
html body .feed-posts > article.post.post--with-media .post-media-item{width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;}

html body .feed-posts > article.post.post--with-media .post-media-item img,
html body .feed-posts > article.post.post--with-media .post-media-item video{width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    display: block !important;}

html body .feed-posts > article.post.post--with-media .post-actions{width: calc(100% - 16px) !important;
    max-width: calc(100% - 16px) !important;
    margin: 12px auto 0 !important;
    border-radius: 28px !important;
    box-sizing: border-box !important;}
}

.post-header{position: relative !important;}

.post-stats-btn{border: 0 !important;
  border-radius: 999px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  z-index: 12 !important;
  transition:
    transform 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease !important;}

.post-stats-btn svg{width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.1 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;}

.post-stats-btn--media{position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  width: 46px !important;
  height: 46px !important;
  color: #fff !important;
  background: rgba(0, 0, 0, 0.5) !important;
  border: 1px solid rgba(255, 255, 255, 0.24) !important;
  box-shadow:
    0 14px 34px rgba(0, 0, 0, 0.28),
    inset 0 1px 0 rgba(255, 255, 255, 0.18) !important;
  backdrop-filter: blur(16px) saturate(150%) !important;
  -webkit-backdrop-filter: blur(16px) saturate(150%) !important;}

.post-stats-btn--plain{position: absolute !important;
  top: 14px !important;
  right: 14px !important;
  width: 44px !important;
  height: 44px !important;
  color: #111827 !important;
  background: #f4f5f7 !important;
  box-shadow: 0 10px 24px rgba(15, 23, 42, 0.1) !important;}

@media (hover: hover) and (pointer: fine){
.post-stats-btn:hover{transform: translateY(-1px) scale(1.03) !important;}

.post-stats-btn--media:hover{background: rgba(0, 0, 0, 0.64) !important;}

.post-stats-btn--plain:hover{background: #eceff3 !important;}
}

.feed-stats-overlay{position: fixed !important;
  inset: 0 !important;
  z-index: 100000 !important;
  background: rgba(15, 23, 42, 0.34) !important;
  backdrop-filter: blur(14px) saturate(120%) !important;
  -webkit-backdrop-filter: blur(14px) saturate(120%) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 22px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  transition: opacity 0.22s ease !important;}

.feed-stats-overlay[hidden]{display: none !important;}

.feed-stats-overlay.is-open{opacity: 1 !important;
  pointer-events: auto !important;}

.feed-stats-modal{position: relative !important;
  width: min(520px, calc(100vw - 32px)) !important;
  border-radius: 28px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  color: #0f172a !important;
  box-shadow:
    0 28px 80px rgba(15, 23, 42, 0.24),
    inset 0 1px 0 rgba(255, 255, 255, 0.78) !important;
  padding: 24px !important;
  transform: translateY(14px) scale(0.98) !important;
  transition: transform 0.22s ease !important;}

.feed-stats-overlay.is-open .feed-stats-modal{transform: translateY(0) scale(1) !important;}

.feed-stats-close{position: absolute !important;
  top: 16px !important;
  right: 16px !important;
  width: 40px !important;
  height: 40px !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: #f2f4f7 !important;
  color: #111827 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;}

.feed-stats-close svg{width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2.2 !important;
  stroke-linecap: round !important;}

.feed-stats-head{padding-right: 48px !important;
  margin-bottom: 18px !important;}

.feed-stats-kicker{display: inline-flex !important;
  padding: 7px 11px !important;
  border-radius: 999px !important;
  background: #f1f5f9 !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em !important;
  text-transform: uppercase !important;}

.feed-stats-head h2{margin: 12px 0 4px !important;
  font-size: 28px !important;
  line-height: 1.05 !important;
  font-weight: 900 !important;
  letter-spacing: -0.04em !important;}

.feed-stats-head p{margin: 0 !important;
  color: #64748b !important;
  font-size: 14px !important;
  line-height: 1.35 !important;}

.feed-stats-grid{display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 12px !important;}

.feed-stats-card{min-height: 116px !important;
  padding: 15px !important;
  border-radius: 22px !important;
  background: #fff !important;
  border: 1px solid rgba(15, 23, 42, 0.06) !important;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.08) !important;
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
  gap: 12px !important;}

.feed-stats-card--wide{grid-column: 1 / -1 !important;
  min-height: 98px !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;}

.feed-stats-icon{width: 38px !important;
  height: 38px !important;
  border-radius: 15px !important;
  background: #f8fafc !important;
  color: #111827 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;}

.feed-stats-icon svg{width: 20px !important;
  height: 20px !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 2 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;}

.feed-stats-card span{display: block !important;
  color: #64748b !important;
  font-size: 12px !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;}

.feed-stats-card strong{display: block !important;
  margin-top: 5px !important;
  color: #0f172a !important;
  font-size: 24px !important;
  line-height: 1 !important;
  font-weight: 950 !important;
  letter-spacing: -0.035em !important;}

.feed-stats-card--wide strong{font-size: 19px !important;
  letter-spacing: -0.02em !important;}

.feed-stats-loading,
.feed-stats-error{grid-column: 1 / -1 !important;
  min-height: 130px !important;
  border-radius: 22px !important;
  background: #fff !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  color: #64748b !important;
  font-weight: 800 !important;
  text-align: center !important;}

@media (max-width: 520px){
.feed-stats-modal{padding: 20px !important;}

.feed-stats-grid{grid-template-columns: 1fr !important;}

.feed-stats-card--wide{grid-column: auto !important;}
}

.feed-stories{width: min(100%, 760px);
  margin: 14px auto 8px;
  padding: 0 14px;
  box-sizing: border-box;}

.feed-stories-track{display: flex;
  align-items: flex-start;
  gap: 16px;
  overflow-x: auto;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  padding: 10px 2px 12px;}

.feed-stories-track::-webkit-scrollbar{display: none;}

.story-bubble{flex: 0 0 auto;
  width: 88px;
  border: 0;
  background: transparent;
  color: #111111;
  padding: 0;
  cursor: pointer;
  text-align: center;}

.story-ring{width: 80px;
  height: 80px;
  display: grid;
  place-items: center;
  margin: 0 auto 8px;
  border-radius: 999px;
  padding: 4px;
  background: #111111;}

.story-bubble.is-viewed .story-ring{background: #b7b7b7;}

.story-avatar-wrap{display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  border-radius: 999px;
  background: #ffffff;
  border: 3px solid #ffffff;}

.story-avatar-wrap img{width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;}

.story-name{display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 4px;
  color: #111111;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.15;
  max-width: 88px;}

.story-name span{display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;}

.story-name img{width: 13px;
  height: 13px;
  flex: 0 0 auto;}

.story-viewer{position: fixed;
  inset: 0;
  z-index: 99999;
  display: none;
  align-items: center;
  justify-content: center;}

.story-viewer.is-open{display: flex;}

.story-viewer-backdrop{position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.88);
  backdrop-filter: blur(16px);}

.story-viewer-shell{position: relative;
  width: min(100vw, 480px);
  height: min(100vh, 860px);
  border-radius: 28px;
  overflow: hidden;
  background: #ffffff;
  box-shadow: 0 28px 80px rgba(15, 23, 42, 0.18);
  isolation: isolate;}

.story-progress{position: absolute;
  left: 14px;
  right: 14px;
  top: 10px;
  height: 4px;
  z-index: 6;
  display: flex;
  align-items: stretch;
  gap: 5px;}

.story-progress-segment{flex: 1 1 0;
  min-width: 0;
  height: 100%;
  border-radius: 999px;
  background: rgba(17, 17, 17, 0.12);
  overflow: hidden;}

.story-progress-fill{display: block;
  width: 0%;
  height: 100%;
  border-radius: inherit;
  background: #111111;
  transition: width 0.08s linear;}

.story-viewer-top{position: absolute;
  z-index: 7;
  left: 0;
  right: 0;
  top: 0;
  padding: 22px 14px 12px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0.94),
    rgba(255, 255, 255, 0.58),
    rgba(255, 255, 255, 0)
  );}

.story-viewer-author{display: inline-flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  background: transparent;
  border: 0;
  color: #111111;
  padding: 0;
  cursor: pointer;
  text-align: left;}

.story-viewer-author img{width: 42px;
  height: 42px;
  border-radius: 999px;
  object-fit: cover;
  border: 2px solid rgba(17, 17, 17, 0.1);}

.story-viewer-author span{min-width: 0;
  display: grid;
  gap: 2px;}

.story-viewer-author strong{display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 14px;
  font-weight: 800;
  max-width: 240px;
  color: #111111;}

.story-viewer-author strong span{display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;}

.story-viewer-author strong img{width: 14px;
  height: 14px;
  border: 0;
  flex: 0 0 auto;}

.story-viewer-author small{font-size: 11px;
  color: rgba(17, 17, 17, 0.66);}

.story-viewer-actions{display: inline-flex;
  align-items: center;
  gap: 8px;}

.story-viewer-close,
.story-stats-btn,
.story-pause-btn{width: 38px;
  height: 38px;
  border-radius: 999px;
  display: inline-grid;
  place-items: center;
  border: 1px solid rgba(17, 17, 17, 0.08);
  background: rgba(255, 255, 255, 0.94);
  color: #111111;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.1);
  cursor: pointer;}

.story-stats-btn svg,
.story-pause-btn svg{width: 18px;
  height: 18px;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;}

.story-stage{position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: #ffffff;}

.story-media-node{width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
  background: #ffffff;}

.story-nav{position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 8;
  width: 44px;
  height: 72px;
  border: 0;
  background: rgba(255, 255, 255, 0.94);
  color: #111111;
  cursor: pointer;
  border-radius: 999px;
  display: grid;
  place-items: center;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.12);}

.story-nav[hidden]{display: none;}

.story-nav span{font-size: 36px;
  line-height: 1;
  margin-top: -3px;}

.story-nav--prev{left: 10px;}

.story-nav--next{right: 10px;}

.story-caption{position: absolute;
  z-index: 7;
  left: 18px;
  right: 18px;
  bottom: 94px;
  color: #111111;
  font-size: 14px;
  line-height: 1.4;}

.story-reply{position: absolute;
  z-index: 12;
  left: 14px;
  right: 14px;
  bottom: calc(18px + env(safe-area-inset-bottom));
  display: flex;
  align-items: flex-end;
  gap: 10px;
  padding: 8px;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(17, 17, 17, 0.08);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.12);
  backdrop-filter: blur(14px);}

.story-reply[hidden]{display: none;}

.story-reply textarea{flex: 1;
  min-width: 0;
  min-height: 48px;
  max-height: 120px;
  resize: none;
  border: 1px solid rgba(17, 17, 17, 0.1);
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.96);
  color: #111111;
  padding: 13px 16px;
  outline: none;
  box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1);}

.story-reply textarea::placeholder{color: rgba(17, 17, 17, 0.46);}

.story-reply button{height: 48px;
  border: 0;
  border-radius: 999px;
  background: #111111;
  color: #ffffff;
  padding: 0 18px;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  box-shadow: 0 14px 30px rgba(17, 17, 17, 0.16);}

@media (max-width: 640px){
.feed-stories{width: 100%;
    margin-top: 10px;
    padding: 0 10px;}

.story-bubble{width: 84px;}

.story-ring{width: 76px;
    height: 76px;}

.story-viewer-shell{width: 100vw;
    height: 100vh;
    border-radius: 0;}

.story-nav{display: none;}
}

.feed-posts .post .post-action-group{gap: 8px !important;}

.feed-posts .post .feed-posts .post .comment-btn{width: 28px !important;
  height: 28px !important;
  flex: 0 0 28px !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 999px !important;
  background: transparent !important;
  box-shadow: none !important;
  color: #111111 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition:
    transform 0.15s ease,
    opacity 0.2s ease,
    color 0.2s ease !important;}

.feed-posts .post .comment-btn svg{width: 25px !important;
  height: 25px !important;
  display: block !important;
  fill: none !important;
  stroke: currentColor !important;
  stroke-width: 1.85 !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;}

.feed-posts .post .comment-btn .icon-comment circle{fill: currentColor !important;
  stroke: none !important;}

.feed-posts .post .comment-btn:hover{transform: translateY(-1px) scale(1.03) !important;}

.feed-posts .post .comment-btn:active{transform: scale(0.92) !important;}

.create-sheet.create-sheet--feed-pro{width: min(680px, calc(100vw - 24px)) !important;
  padding: 12px 14px 92px !important;
  background: rgba(255, 255, 255, 0.98) !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.22) !important;
  backdrop-filter: blur(24px) saturate(1.08) !important;
  -webkit-backdrop-filter: blur(24px) saturate(1.08) !important;}

.create-sheet--feed-pro .sheet-handle{background: rgba(0, 0, 0, 0.14) !important;}

.create-sheet--feed-pro .create-kicker,
.create-sheet--feed-pro .location-selected-title{color: #111 !important;}

.create-sheet--feed-pro .create-title{color: #050505 !important;
  font-weight: 900 !important;}

.create-sheet--feed-pro .create-subtitle{color: rgba(0, 0, 0, 0.58) !important;}

.create-sheet--feed-pro .close-sheet,
.create-sheet--feed-pro .create-close{background: #f3f3f4 !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  color: #111 !important;
  box-shadow: none !important;}

.create-sheet--feed-pro .close-sheet:hover,
.create-sheet--feed-pro .create-close:hover{background: #e9e9eb !important;}

.create-type-grid{gap: 8px !important;
  padding: 4px !important;
  background: #f4f4f5 !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  border-radius: 24px !important;}

.create-type-btn{border: 1px solid transparent !important;
  background: transparent !important;
  box-shadow: none !important;
  border-radius: 20px !important;
  padding: 13px !important;}

.create-type-btn.active{border-color: rgba(0, 0, 0, 0.08) !important;
  background: #fff !important;
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.1) !important;}

.create-type-icon{background: #111 !important;
  color: #fff !important;
  border-radius: 999px !important;}

.create-type-btn.active .create-type-icon{background: #000 !important;
  color: #fff !important;}

.create-type-btn strong{color: #09090b !important;
  font-weight: 900 !important;}

.create-type-btn small{color: rgba(0, 0, 0, 0.52) !important;}

.create-sheet--feed-pro .create-section-card{background: #fff !important;
  border: 1px solid rgba(0, 0, 0, 0.07) !important;
  border-radius: 26px !important;
  box-shadow: 0 14px 36px rgba(0, 0, 0, 0.06) !important;}

.create-sheet--feed-pro .create-section-card[hidden]{display: none !important;}

.create-sheet--feed-pro .create-section-title{color: #09090b !important;
  font-weight: 900 !important;}

.create-sheet--feed-pro .create-primary-btn{background: #f8f8f9 !important;
  border: 1px dashed rgba(0, 0, 0, 0.22) !important;
  box-shadow: none !important;}

.create-sheet--feed-pro .create-primary-btn:hover{background: #fff !important;
  border-color: rgba(0, 0, 0, 0.42) !important;}

.create-sheet--feed-pro .create-primary-icon{background: #000 !important;
  color: #fff !important;
  box-shadow: 0 12px 26px rgba(0, 0, 0, 0.2) !important;}

.create-sheet--feed-pro .create-primary-text{color: #09090b !important;}

.create-sheet--feed-pro .create-primary-hint{color: rgba(0, 0, 0, 0.54) !important;}

.create-sheet--feed-pro .create-textarea:focus{border-color: rgba(0, 0, 0, 0.45) !important;
  box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08) !important;}

.create-sheet--feed-pro .media-preview-item.drag-over{outline: 3px solid rgba(0, 0, 0, 0.22) !important;}

.create-sheet--feed-pro .location-input-icon{color: #111 !important;}

.create-location-btn{border-color: rgba(0, 0, 0, 0.14) !important;
  background: #f3f3f4 !important;
  color: #111 !important;}

.create-location-btn.active,
.create-location-btn:hover{background: #000 !important;
  color: #fff !important;
  border-color: #000 !important;}

.create-sheet--feed-pro .location-selected-card{background: #f8f8f9 !important;
  border-color: rgba(0, 0, 0, 0.08) !important;}

.create-sheet--feed-pro .publish-btn{background: #000 !important;
  color: #fff !important;
  box-shadow: 0 16px 34px rgba(0, 0, 0, 0.22) !important;}

.create-sheet--feed-pro .publish-btn:not(:disabled):hover{transform: translateY(-1px);
  background: #151515 !important;}

.create-sheet--feed-pro .publish-btn:disabled{background: #e8e8ea !important;
  color: rgba(0, 0, 0, 0.38) !important;
  box-shadow: none !important;}

.create-sheet--feed-pro.is-story-mode .create-section-card--media{margin-top: 12px !important;}

.create-sheet--feed-pro.is-story-mode .create-primary-hint::after{content: " La historia caduca en 24 horas.";}

@media (max-width: 640px){
.create-sheet.create-sheet--feed-pro{width: calc(100vw - 16px) !important;
    border-radius: 28px 28px 24px 24px !important;
    max-height: min(90vh, 820px) !important;}

.create-type-btn{grid-template-columns: 38px 1fr !important;
    padding: 11px !important;}

.create-type-icon{width: 38px !important;
    height: 38px !important;}
}

:root{--banana-red: #ff004f;
  --banana-orange: #ff5a12;
  --banana-gold: #ffb000;
  --banana-pink: #ffccd9;
  --banana-peach: #ffb18d;
  --banana-ink: #09090b;}

html,
body{background: #fff !important;}

.feed .header,
.feed header.header,
.feed .header-top{background: #fff !important;}

.feed .banana-logo-lockup,
.feed .logo.banana-logo-lockup{gap: 10px !important;
  background: transparent !important;}

.feed .banana-logo-mark,
.feed .planes-logo-mark.banana-logo-mark{width: 34px !important;
  height: 34px !important;
  border-radius: 12px !important;
  display: block !important;
  object-fit: cover !important;
  background: transparent !important;
  box-shadow: 0 8px 20px rgba(255, 83, 18, 0.18) !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  flex: 0 0 auto !important;}

.feed .logo.banana-logo-lockup::before,
.feed .logo.banana-logo-lockup::after{display: none !important;
  content: none !important;}

.feed .banana-logo-lockup .logo-text,
.feed .logo.banana-logo-lockup .logo-text{display: inline-block !important;
  font-size: 22px !important;
  line-height: 1 !important;
  font-weight: 900 !important;
  letter-spacing: -0.055em !important;
  text-transform: none !important;
  white-space: nowrap !important;
  background: linear-gradient(
    135deg,
    var(--banana-red) 0%,
    var(--banana-orange) 50%,
    var(--banana-gold) 100%
  ) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;}

.create-sheet.create-sheet--feed-pro{scrollbar-width: none !important;
  -ms-overflow-style: none !important;}

.create-sheet.create-sheet--feed-pro::-webkit-scrollbar{width: 0 !important;
  height: 0 !important;
  display: none !important;}

.create-sheet--feed-pro .create-kicker{color: var(--banana-orange) !important;}

.create-type-grid{background: linear-gradient(
    135deg,
    rgba(255, 0, 79, 0.08),
    rgba(255, 90, 18, 0.08) 48%,
    rgba(255, 176, 0, 0.11)
  ) !important;
  border-color: rgba(255, 90, 18, 0.14) !important;}

.create-type-btn{background: rgba(255, 255, 255, 0.58) !important;
  border-color: rgba(255, 255, 255, 0.68) !important;}

.create-type-btn.active{border-color: rgba(255, 90, 18, 0.3) !important;
  background: rgba(255, 250, 247, 0.98) !important;
  box-shadow:
    0 16px 34px rgba(255, 90, 18, 0.14),
    0 8px 22px rgba(255, 0, 79, 0.08) !important;}

.create-type-icon,
.create-type-btn.active .create-type-icon{background: #ff5a12 !important;
  color: #fff !important;
  box-shadow: 0 12px 24px rgba(255, 90, 18, 0.22) !important;}

.create-type-btn[data-create-mode="story"].active .create-type-icon{background: #ff5a12 !important;}

.create-sheet--feed-pro .create-primary-btn{background: rgba(255, 250, 247, 0.98) !important;
  border-color: rgba(255, 90, 18, 0.26) !important;}

.create-sheet--feed-pro .create-primary-icon{background: #ff5a12 !important;
  box-shadow: 0 12px 26px rgba(255, 90, 18, 0.24) !important;}

.create-sheet--feed-pro .publish-btn{background: #ff5a12 !important;
  box-shadow: 0 16px 34px rgba(255, 90, 18, 0.25) !important;}

.create-sheet--feed-pro .publish-btn:not(:disabled):hover{background: #e94700 !important;}

.create-sheet--feed-pro .create-textarea:focus,
.create-sheet--feed-pro #createLocationInput:focus{border-color: rgba(255, 90, 18, 0.45) !important;
  box-shadow: 0 0 0 4px rgba(255, 90, 18, 0.1) !important;}

.create-sheet--feed-pro .location-input-icon,
.create-sheet--feed-pro .location-selected-title{color: var(--banana-orange) !important;}

.create-location-btn{border-color: rgba(255, 90, 18, 0.18) !important;
  background: rgba(255, 90, 18, 0.08) !important;
  color: #d9401d !important;}

.create-location-btn.active,
.create-location-btn:hover{background: #ff5a12 !important;
  border-color: transparent !important;
  color: #fff !important;}

.feed .header,
.feed header.header{padding-left: 0 !important;
  padding-right: 0 !important;}

.feed .header-top,
.feed header.header .header-top{width: calc(100% - 24px) !important;
  max-width: 480px !important;
  margin-left: auto !important;
  margin-right: auto !important;}

.feed .header,
.feed header.header{width: 100% !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  box-sizing: border-box !important;}

.feed .header-top,
.feed header.header .header-top{width: min(480px, calc(100vw - 24px)) !important;
  max-width: 480px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;}

@media (min-width: 900px){
.feed .header-top,
.feed header.header .header-top{width: min(720px, calc(100vw - 64px)) !important;
    max-width: 720px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding-left: 0 !important;
    padding-right: 0 !important;}
}

.create-sheet--feed-pro .create-option-row{display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 14px !important;
  width: 100% !important;}

.create-sheet--feed-pro .create-option-row > div:first-child{min-width: 0 !important;}

.create-sheet--feed-pro .create-option-row small{display: block !important;
  margin-top: 3px !important;
  color: rgba(15, 17, 21, 0.54) !important;
  font-size: 12px !important;
  font-weight: 650 !important;
  line-height: 1.32 !important;}

.create-sheet--feed-pro .create-collapsible{margin-top: 14px !important;
  animation: createReveal 0.22s cubic-bezier(0.22, 1, 0.36, 1) both;}

.create-sheet--feed-pro .create-collapsible[hidden]{display: none !important;}

@keyframes createReveal{from {
    opacity: 0;
    transform: translateY(-6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }}

.create-sheet--feed-pro .create-switch{position: relative !important;
  flex: 0 0 auto !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 58px !important;
  height: 34px !important;
  cursor: pointer !important;
  user-select: none !important;
  -webkit-tap-highlight-color: transparent !important;}

.create-sheet--feed-pro .create-switch input{position: absolute !important;
  inset: 0 !important;
  opacity: 0 !important;
  cursor: pointer !important;
  margin: 0 !important;}

.create-sheet--feed-pro .create-switch-ui{position: relative !important;
  width: 58px !important;
  height: 34px !important;
  border-radius: 999px !important;
  background: #e8e8e8 !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  box-shadow:
    inset 0 2px 7px rgba(255, 255, 255, 0.75),
    inset 0 -2px 8px rgba(0, 0, 0, 0.05) !important;
  transition:
    background 0.25s ease,
    border-color 0.25s ease,
    box-shadow 0.25s ease !important;
  overflow: visible !important;}

.create-sheet--feed-pro .create-switch-knob{position: absolute !important;
  top: 3px !important;
  left: 3px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  background: linear-gradient(180deg, #ffffff 0%, #f3f3f3 100%) !important;
  border: 1px solid rgba(0, 0, 0, 0.09) !important;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.22),
    0 1px 2px rgba(0, 0, 0, 0.1) !important;
  transition:
    transform 0.28s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.25s ease !important;
  z-index: 3 !important;}

.create-sheet--feed-pro .create-switch-wave{position: absolute !important;
  top: 50% !important;
  left: 17px !important;
  width: 28px !important;
  height: 28px !important;
  border-radius: 50% !important;
  border: 1px solid rgba(255, 90, 18, 0.3) !important;
  transform: translate(-50%, -50%) scale(0.86) !important;
  opacity: 0 !important;
  pointer-events: none !important;
  z-index: 1 !important;}

.create-sheet--feed-pro .create-switch input:checked + .create-switch-ui{background: #ff5a12 !important;
  border-color: rgba(255, 90, 18, 0.34) !important;
  box-shadow:
    inset 0 1px 4px rgba(255, 255, 255, 0.28),
    inset 0 -2px 8px rgba(0, 0, 0, 0.1),
    0 8px 20px rgba(255, 90, 18, 0.2) !important;}

.create-sheet--feed-pro
  .create-switch
  input:checked
  + .create-switch-ui
  .create-switch-knob{transform: translateX(24px) !important;
  box-shadow:
    0 5px 14px rgba(0, 0, 0, 0.24),
    0 2px 3px rgba(0, 0, 0, 0.12) !important;}

.create-sheet--feed-pro
  .create-switch
  input:checked
  + .create-switch-ui
  .create-switch-wave{left: 41px !important;
  opacity: 1 !important;}

.create-sheet--feed-pro
  .create-switch
  input:checked
  + .create-switch-ui
  .create-switch-wave--one{animation: createSwitchPulse 1.8s ease-out infinite !important;}

.create-sheet--feed-pro
  .create-switch
  input:checked
  + .create-switch-ui
  .create-switch-wave--two{animation: createSwitchPulse 1.8s ease-out 0.9s infinite !important;}

.create-sheet--feed-pro .create-switch input:focus-visible + .create-switch-ui{outline: 2px solid rgba(255, 90, 18, 0.22) !important;
  outline-offset: 3px !important;}

@keyframes createSwitchPulse{0% {
    transform: translate(-50%, -50%) scale(0.86);
    opacity: 0.45;
  }
  70% {
    transform: translate(-50%, -50%) scale(1.62);
    opacity: 0;
  }
  100% {
    transform: translate(-50%, -50%) scale(1.62);
    opacity: 0;
  }}

.create-sheet--feed-pro .create-description-card.is-enabled,
.create-sheet--feed-pro .create-section-card--location.is-enabled{border-color: rgba(255, 90, 18, 0.18) !important;
  background: linear-gradient(
    135deg,
    #fff,
    rgba(255, 248, 243, 0.96)
  ) !important;}

.create-sheet--feed-pro .create-section-card--location .location-input-wrap{margin-top: 0 !important;}

.create-sheet--feed-pro #createPostText:focus,
.create-sheet--feed-pro #createPostText:focus-visible{border-color: rgba(255, 90, 18, 0.62) !important;
  outline: 2px solid rgba(255, 90, 18, 0.34) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 4px rgba(255, 90, 18, 0.1) !important;}

.create-sheet--feed-pro .create-section-card--promo{border: 1px solid rgba(0, 0, 0, 0.08) !important;
  background: linear-gradient(135deg, #fff, #fff8f3) !important;
  opacity: 1 !important;}

.create-sheet--feed-pro .create-section-card--promo .create-option-row{align-items: flex-start !important;}

.create-sheet--feed-pro .create-section-card--promo small{display: block !important;
  max-width: 360px !important;
  line-height: 1.35 !important;
  color: rgba(0, 0, 0, 0.58) !important;}

.create-sheet--feed-pro .create-promo-note{margin-top: 12px !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 4px !important;
  padding: 12px 14px !important;
  border-radius: 18px !important;
  border: 1px solid rgba(255, 90, 18, 0.14) !important;
  background: rgba(255, 90, 18, 0.07) !important;
  color: #151515 !important;}

.create-sheet--feed-pro .create-promo-note strong{font-size: 13px !important;
  font-weight: 900 !important;
  color: #d9401d !important;}

.create-sheet--feed-pro .create-promo-note span{font-size: 12.5px !important;
  line-height: 1.35 !important;
  color: rgba(0, 0, 0, 0.62) !important;}

.create-sheet--feed-pro .create-switch--disabled,
.create-sheet--feed-pro .create-switch--disabled *{cursor: not-allowed !important;}

.create-sheet--feed-pro .create-switch--disabled .create-switch-ui{background: #ececef !important;
  border-color: rgba(0, 0, 0, 0.1) !important;
  box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.06) !important;
  opacity: 0.78 !important;}

.create-sheet--feed-pro .create-switch--disabled .create-switch-knob{background: #fff !important;
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.14) !important;}

.create-sheet--feed-pro
  .create-switch--disabled
  input:disabled
  + .create-switch-ui{pointer-events: none !important;}

.create-sheet--feed-pro.is-story-mode #createPromoCard{display: none !important;}

.feed-posts .post-media-item{position: relative;
  overflow: hidden;}

.feed-posts .post-media-item.is-video-loading,
.feed-posts .post-media-item.is-video-error{background:
    radial-gradient(circle at 50% 38%, rgba(255, 255, 255, 0.12), transparent 42%),
    linear-gradient(145deg, #24262b 0%, #111318 58%, #1b1d22 100%) !important;}

.feed-posts .post-media-item video[data-bf-video-ready="0"]{background-color: transparent !important;}

.post-video-loader{position: absolute;
  inset: 0;
  z-index: 2;
  display: grid;
  place-items: center;
  pointer-events: none;
  opacity: 1;
  visibility: visible;
  background: linear-gradient(180deg, rgba(12, 13, 16, 0.08), rgba(12, 13, 16, 0.22));
  transition: opacity 180ms ease, visibility 180ms ease;}

.post-video-loader > span{width: 34px;
  height: 34px;
  border-radius: 999px;
  border: 3px solid rgba(255, 255, 255, 0.28);
  border-top-color: rgba(255, 255, 255, 0.96);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.22);
  animation: bf-feed-video-spin 760ms linear infinite;}

.post-media-item.is-video-ready .post-video-loader{opacity: 0;
  visibility: hidden;}

.post-media-item.is-video-error .post-video-loader > span{animation-duration: 1.2s;
  border-color: rgba(255, 255, 255, 0.2);
  border-top-color: #ff5a37;}

@keyframes bf-feed-video-spin{to { transform: rotate(360deg); }}

@media (prefers-reduced-motion: reduce){
.post-video-loader > span{animation-duration: 1.4s;}
}