/* Desktop-only overrides. Mobile selectors and the mobile dialog are untouched. */
#cdb-desktop,#cdb-header-tabs,.cdb-intro-copy{display:none}
@media(min-width:769px){
 body:has(#cdb-desktop),body:has(#cdb-desktop) #main-content{background:#fff!important}
 body:has(#cdb-desktop) #cmapp-strip{display:none!important}
 body:has(#cdb-desktop) header{border-bottom:1px solid #eee!important;background:#fff;top:0!important;height:82px!important}
 body:has(#cdb-desktop) .main-content-container{margin-top:82px!important;background:#fff!important}
 #cd-root:has(#cdb-desktop){background:#fff!important}
 body:has(#cdb-desktop) header>div{min-height:82px;padding-inline:32px}
 body:has(#cdb-desktop) header>div>nav{display:none!important}
 #cdb-header-tabs{display:flex;position:absolute;left:50%;transform:translateX(-50%);top:0;height:82px;gap:32px}
 #cdb-header-tabs a{height:82px}
 #cdb-desktop .cdb-service-tabs{display:none}
 #cd-root #ds-search:has(#cdb-desktop){padding-top:24px}
 #cd-root:has(#cdb-desktop) .cdb-intro-copy{display:block}
 #cd-root:has(#cdb-desktop) .intro-copy{display:none}
 #cd-root:has(#cdb-desktop) .intro{display:flex;justify-content:space-between;gap:28px}
 #cd-root:has(#cdb-desktop) .cd-shortcuts a[href$='/voices']{display:none}
 #cd-root:has(#cdb-desktop) .cd-shortcut{background:white;box-shadow:none;border:0;padding:8px 6px}
 #cd-root:has(#cdb-desktop) .filters{display:flex;justify-content:flex-start}
 #cd-root:has(#cdb-desktop) .filters .mode{margin-inline:0 auto}
 .cdb-choice>svg{width:21px;height:21px;flex:none}.cdb-choice>span:not(.cdb-check){flex:1}
 body:has(#cdb-desktop){background:#fff}
 #cd-root:has(#cdb-desktop){max-width:none;padding:0}
 #cd-root:has(#cdb-desktop) .cd-main{max-width:1600px;margin:auto;padding:0 48px 56px}
 #cd-root #ds-search:has(#cdb-desktop){padding:0 0 22px;overflow:visible;z-index:60}
 #cd-root #ds-search:has(#cdb-desktop)>.ds-open{display:none}
 #cdb-desktop{display:block;position:relative;color:#222;font:inherit}
 #cdb-desktop button,#cdb-desktop input{font-family:inherit;box-sizing:border-box}
 .cdb-service-tabs{display:flex;align-items:center;justify-content:center;gap:40px;height:76px;overflow:hidden}
 .cdb-service-tabs a{display:flex;align-items:center;gap:10px;min-height:56px;text-decoration:none;color:#707070;border-bottom:3px solid transparent;font-size:16px;font-weight:600}
 .cdb-service-tabs a[aria-current]{color:#222;border-bottom-color:#7c3aed}
 .cdb-service-tabs svg{height:24px;width:24px}
 .cdb-search-row{display:flex;align-items:center;justify-content:center;gap:16px;padding-top:8px}
 .cdb-searchbar{display:flex;align-items:center;max-width:940px;flex:1;min-width:0;border:1px solid #ddd;border-radius:50px;background:#fff;box-shadow:0 3px 12px #00000012;padding:7px;min-height:78px}
 #cdb-desktop .cdb-segment{border:0;position:relative;background:#fff;flex:1;min-width:0;display:flex;flex-direction:column;gap:5px;text-align:start;padding:12px 25px;border-radius:40px;color:#222;cursor:pointer;transition:box-shadow 180ms}
 #cdb-desktop .cdb-segment:first-child{flex:1.4}
 .cdb-segment:not(:first-child):before{content:'';position:absolute;inset-inline-start:0;top:17px;height:28px;border-inline-start:1px solid #e2e2e2}
 .cdb-segment strong{font-size:12px;font-weight:650}.cdb-segment>span{font-size:14px;color:#777;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
 #cdb-desktop .cdb-segment[aria-expanded=true]{box-shadow:0 3px 14px #0002}.cdb-segment[aria-expanded=true]:before{display:none}
 #cdb-desktop .cdb-search{display:flex;align-items:center;justify-content:center;gap:10px;flex:none;border:0;border-radius:40px;background:#7c3aed;color:white;padding:17px 24px;font-size:15px;font-weight:650;cursor:pointer;min-height:60px}
 #cdb-desktop .cdb-search:hover{background:#6d28d9}.cdb-search svg{width:23px;height:23px}
 #cdb-desktop .cdb-filters{display:flex;align-items:center;gap:10px;border:1px solid #ccc;border-radius:20px;background:white;color:#222;padding:16px 22px;min-height:60px;font-size:14px;cursor:pointer}
 .cdb-filters svg{height:22px;width:22px}.cdb-filters[aria-expanded=true]{outline:2px solid #7c3aed;outline-offset:2px}.cdb-badge{background:#7c3aed;color:#fff;min-width:20px;height:20px;border-radius:50%;font-size:11px;display:grid;place-items:center}
 #cdb-popover{position:absolute;z-index:90;background:#fff;border:1px solid #e8e8e8;border-radius:24px;box-shadow:0 8px 36px #00000026;padding:24px;display:flex;flex-direction:column;text-align:start;overflow:hidden;box-sizing:border-box}
 .cdb-pop-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px;flex:none}
 #cd-root #cdb-title{font-size:17px;font-weight:700;line-height:1.35;margin:0;color:#222}
 #cdb-desktop .cdb-close{width:32px;height:32px;border:1px solid #ddd;border-radius:50%;background:white;color:#222;font-size:22px;line-height:1;flex:none;cursor:pointer}
 .cdb-form{display:flex;flex-direction:column;overflow:hidden;margin:0;min-height:0}
 .cdb-content{overflow:auto;min-height:0;padding:2px 2px 12px;overscroll-behavior:contain;scrollbar-width:thin}
 .cdb-field{margin:0 0 18px;min-width:0}.cdb-field label{display:block;font-size:12px;font-weight:600;margin:0 0 8px;color:#333}
 #cdb-desktop .cdb-field input{width:100%;height:48px;background:#fff;color:#222;border:1px solid #bfbfbf;border-radius:12px;padding:12px 14px;font-size:14px;box-shadow:none;min-width:0}
 #cdb-desktop :focus-visible{outline:2px solid #7c3aed;outline-offset:3px}#cdb-desktop .cdb-field input:focus{outline:2px solid #dbc5ff;outline-offset:1px;border-color:#7c3aed}
 .cdb-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
 #cdb-desktop .cdb-reveal{display:block;min-height:40px;margin:8px 0 0;padding:6px 0;border:0;background:white;color:#7c3aed;text-decoration:underline;font-size:13px;font-weight:600;cursor:pointer}
 #cdb-desktop .cdb-choice{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:52px;border:1px solid #ddd;border-radius:13px;padding:12px;background:#fff;color:#222;cursor:pointer;font-size:13px;text-align:start;transition:border-color 150ms,box-shadow 150ms}
 #cdb-desktop .cdb-choice:hover{border-color:#7c3aed}
 #cdb-desktop .cdb-choice[aria-pressed=true]{border-color:#7c3aed;box-shadow:inset 0 0 0 1px #7c3aed}
 .cdb-check{visibility:hidden;font-size:11px;display:grid;place-items:center;background:#7c3aed;color:white;width:17px;height:17px;border-radius:50%;flex:none}.cdb-choice[aria-pressed=true] .cdb-check{visibility:visible}
 #cd-root .cdb-hint{font-size:12px;color:#777;margin:16px 0 0}.cdb-price-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
 .cdb-pop-footer{border-top:1px solid #eee;padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:20px;flex:none}
 #cdb-desktop .cdb-clear{background:#fff;border:0;font-size:13px;text-decoration:underline;color:#222;min-height:40px;cursor:pointer}
 #cdb-desktop .cdb-done,#cdb-desktop .cdb-retry{border:1px solid #7c3aed;background:#fff;color:#7c3aed;border-radius:12px;min-height:40px;padding:8px 18px;font-size:13px;font-weight:600;cursor:pointer}
 #cdb-desktop .cdb-error{font-size:13px;color:#b42336;padding:10px 0;margin:0}
 .cdb-content section{padding:20px 0;border-top:1px solid #eee}.cdb-content section h3{font-size:16px;font-weight:650;margin:0 0 14px}.cdb-content section h4{font-size:13px;margin:16px 0 10px}
 #cdb-popover[data-panel=advanced] .cdb-options{grid-template-columns:repeat(3,minmax(0,1fr))}
 .cdb-compact .cdb-service-tabs{height:0;opacity:0}.cdb-compact .cdb-searchbar{min-height:64px}.cdb-compact .cdb-search{min-height:48px!important;padding-block:12px!important}
 #cd-root:has(#cdb-desktop) .intro{margin-top:30px;align-items:center}
 #cd-root:has(#cdb-desktop) .intro h1{font-size:32px;letter-spacing:-.8px;line-height:1.2;max-width:730px;font-weight:700}
 #cd-root:has(#cdb-desktop) .intro p{font-size:14px;color:#777;margin-top:10px}
 #cd-root:has(#cdb-desktop) .cd-preference-links{margin:14px 0!important}
 #cd-root:has(#cdb-desktop) .filters{border-bottom:1px solid #eee;padding:0;margin:22px 0 28px}
 #cd-root:has(#cdb-desktop) .mode{display:flex;gap:24px}
 #cd-root:has(#cdb-desktop) .mode button{background:white;color:#777;border:0;border-bottom:3px solid transparent;border-radius:0;padding:14px 4px;box-shadow:none;font-size:14px}
 #cd-root:has(#cdb-desktop) .mode button.active{color:#222;border-bottom-color:#7c3aed;font-weight:650}
 #cd-root:has(#cdb-desktop) .cd-row{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 80px)/6);gap:16px;overflow-x:auto;scroll-snap-type:x mandatory}
 #cd-root:has(#cdb-desktop) .cd-row .creator{width:auto;min-width:0;scroll-snap-align:start}
 #cd-root:has(#cdb-desktop) .cards{grid-template-columns:repeat(6,minmax(0,1fr));gap:30px 16px}
 #cd-root:has(#cdb-desktop) .cover{border-radius:16px;aspect-ratio:3/4}#cd-root:has(#cdb-desktop) .cover img{object-fit:cover;width:100%;height:100%}
 #cd-root:has(#cdb-desktop) .section-head h2{font-size:21px;font-weight:700}
 #cd-root:has(#cdb-desktop) .details{padding-top:10px}#cd-root:has(#cdb-desktop) .details .name{font-size:13px}#cd-root:has(#cdb-desktop) .rating{font-size:11px}
 #cd-root:has(#cdb-desktop) .cma-project-slot:not([hidden]){display:block!important;margin:10px 0 28px}
 #cd-root:has(#cdb-desktop) .cma-project-reminder{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px 24px;border:1px solid #e3e0e8;border-radius:16px;box-shadow:none}
 #cd-root:has(#cdb-desktop) .cma-project-top{align-items:center;gap:18px;flex-direction:row-reverse}
 #cd-root:has(#cdb-desktop) .cma-project-avatars{width:100px;height:50px}.cma-project-slot .cma-project-avatar:nth-child(n){top:0;inset-inline-start:0}.cma-project-slot .cma-project-avatar:nth-child(2){inset-inline-start:25px}.cma-project-slot .cma-project-avatar:nth-child(3){inset-inline-start:50px}
 #cd-root:has(#cdb-desktop) .cma-project-action{margin:0;white-space:nowrap}.cdb-service-tabs a:hover{color:#7c3aed}
 @media(max-width:1199px){#cd-root:has(#cdb-desktop) .cd-main{padding-inline:28px}#cd-root:has(#cdb-desktop) .cards{grid-template-columns:repeat(4,minmax(0,1fr))}#cd-root:has(#cdb-desktop) .cd-row{grid-auto-columns:calc((100% - 48px)/4)}#cdb-desktop .cdb-segment{padding-inline:14px}#cdb-desktop .cdb-search{padding-inline:18px}.cdb-search-row{gap:10px}}
 @media(max-width:1050px){#cdb-header-tabs{display:none}#cdb-desktop .cdb-service-tabs{display:flex}body:has(#cdb-desktop) header>div{padding-inline:8px}#cd-root:has(#cdb-desktop) .intro h1{font-size:28px}#cdb-desktop .cdb-search span{display:none}#cdb-desktop .cdb-filters{padding-inline:14px}}
 @media(prefers-reduced-motion:reduce){#cdb-desktop *,#cdb-desktop *:before{transition:none!important;animation:none!important}}
}

/* Layout switches once; JavaScript animates transforms with document space reserved. */
@media(min-width:769px){
 #cdb-desktop .cdb-search-row{transform-origin:top left}
 #cdb-header-tabs{transition:none}
 body.cdb-header-compact #cdb-header-tabs{opacity:0;pointer-events:none;visibility:hidden;transform:translate(-50%,-12px)}
 #cd-root #ds-search.cdb-entry-compact{box-sizing:border-box;height:var(--cdb-expanded-height);min-height:var(--cdb-expanded-height);padding-block:0;background:transparent;pointer-events:none}
 .cdb-entry-compact #cdb-desktop{pointer-events:none}
 #cdb-desktop.cdb-compact .cdb-search-row{position:fixed;inset:auto;top:12px;border:0;background:transparent;overflow:visible;margin-block:0;left:50%;width:550px;margin-left:-275px;padding:0;gap:8px;pointer-events:auto}
 #cdb-desktop.cdb-compact .cdb-searchbar{min-height:56px;height:56px;padding:5px;box-shadow:0 2px 10px #00000016}
 #cdb-desktop.cdb-compact .cdb-segment{padding:10px 14px;gap:0}
 #cdb-desktop.cdb-compact .cdb-segment strong{display:none}
 #cdb-desktop.cdb-compact .cdb-segment>span{font-size:12px;font-weight:600;color:#333}
 #cdb-desktop.cdb-compact .cdb-segment:before{top:7px;height:24px}
 #cdb-desktop.cdb-compact .cdb-search{min-height:42px!important;width:42px;height:42px;padding:10px!important;border-radius:50%}
 #cdb-desktop.cdb-compact .cdb-search>span,#cdb-desktop.cdb-compact .cdb-filters>span{display:none}
 #cdb-desktop.cdb-compact .cdb-filters{width:46px;min-height:46px;padding:11px;border-radius:50%;position:relative}
 #cdb-desktop.cdb-compact .cdb-badge{position:absolute;top:-4px;right:-3px}
 @media(max-width:1100px){
  #cdb-desktop.cdb-compact .cdb-search-row{top:90px;width:min(680px,calc(100vw - 48px));left:24px;margin:0}
  /* At tablet widths the compact search uses a second header row. Keep an
     opaque surface under that entire row, including either side of the pill. */
  body.cdb-header-compact:has(#cdb-desktop) header::after{content:"";position:absolute;top:80px;inset-inline:0;height:74px;background:#fff;pointer-events:none}
  #cd-root #ds-search.cdb-entry-compact{background:#fff}
 }
 @media(prefers-reduced-motion:reduce){#cdb-header-tabs{transition:none!important}}
}

/* One uninterrupted opaque header surface behind search AND quick filters.
   Keep this surface stationary/opaque during the pill's FLIP animation; a
   2px overlap removes compositor seams at the 82px header boundary. */
@media(min-width:769px){
 body.cdb-header-compact:has(#cdb-desktop .cdb-quick-row:not([hidden])) header::after{content:"";position:absolute;top:80px;inset-inline:0;height:52px;background:#fff;border-bottom:2px solid #ebebeb;box-sizing:border-box;pointer-events:none}
 #cdb-desktop.cdb-compact .cdb-quick-row[popover]{inset-block-end:auto;margin:0;width:auto;max-width:none;box-sizing:border-box;overflow:visible;color:inherit;border:0;background:transparent;pointer-events:none}
 #cdb-desktop.cdb-compact .cdb-quick-row[popover]>button,#cdb-desktop.cdb-compact .cdb-quick-row[popover] .cdb-quick-chip{pointer-events:auto}
 body.cdb-header-compact:has(#cdb-desktop .cdb-quick-row:not([hidden])) #seller-sidebar{top:132px!important;height:calc(100vh - 132px)!important}
 body.ugc-modal-open #cdb-desktop .cdb-quick-row{display:none!important}
 @media(max-width:1100px){
  body.cdb-header-compact:has(#cdb-desktop .cdb-quick-row:not([hidden])) header::after{height:122px}
  body.cdb-header-compact:has(#cdb-desktop .cdb-quick-row:not([hidden])) #seller-sidebar{top:202px!important;height:calc(100vh - 202px)!important}
 }
}

@media(min-width:769px){
 body.ugc-modal-open #ds-search:has(#cdb-desktop){visibility:hidden;pointer-events:none}
 body.ugc-modal-open #cdb-desktop .cdb-search-row{display:none!important}
}

/* Browse header surface matched to the approved Airbnb reference (2026-09-12). */
@media(min-width:769px){
 body:has(#cdb-desktop) header{background:linear-gradient(180deg,#fff 39.9%,#f8f8f8 100%)!important;border-bottom:1px solid #ebebeb!important;box-shadow:none!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
 body:has(#cdb-desktop) header>div{background:transparent!important}
 #cdb-desktop .cdb-searchbar,#cdb-desktop.cdb-compact .cdb-searchbar{border-color:#ddd;box-shadow:0 1px 2px rgba(0,0,0,.08),0 3px 12px rgba(0,0,0,.08)}
 #cdb-desktop .cdb-filters{border-color:#ddd}
 .cdb-segment:not(:first-child):before{border-inline-start-color:#ddd}
}

/* Compact shared service navigation on Browse and Voices. */
@media(min-width:769px){
 .cdb-service-tabs{gap:24px;height:60px}
 .cdb-service-tabs a{gap:7px;min-height:44px;font-size:14px;border-bottom-width:2px}
 .cdb-service-tabs svg{width:19px;height:19px;flex:none}
 #cdb-header-tabs{gap:24px}
 body.cdb-voices-header header{height:82px!important;background:#fff;top:0!important}
 body.cdb-voices-header header>div{min-height:82px;padding-inline:32px}
 body.cdb-voices-header header>div>nav:not(#cdb-header-tabs){display:none!important}
 body.cdb-voices-header .main-content-container{margin-top:82px!important}
 body.cdb-voices-header #cmapp-strip{display:none!important}
 body.cdb-voices-header #ds-search>.cdb-service-tabs{display:none}
}
@media(min-width:769px) and (max-width:1050px){
 body.cdb-voices-header #ds-search>.cdb-service-tabs{display:flex}
}
@media(max-width:768px){body.cdb-voices-header #ds-search>.cdb-service-tabs{display:none}}


/* Compact shared service navigation on Browse and Voices. */
@media(min-width:769px){
 .cdb-service-tabs{gap:24px;height:60px}
 .cdb-service-tabs a{gap:7px;min-height:44px;font-size:14px;border-bottom-width:2px}
 .cdb-service-tabs svg{width:19px;height:19px;flex:none}
 #cdb-header-tabs{gap:24px}
 body.cdb-voices-header header{height:82px!important;background:#fff;top:0!important}
 body.cdb-voices-header header>div{min-height:82px;padding-inline:32px}
 body.cdb-voices-header header>div>nav:not(#cdb-header-tabs){display:none!important}
 body.cdb-voices-header .main-content-container{margin-top:82px!important}
 body.cdb-voices-header #cmapp-strip{display:none!important}
 body.cdb-voices-header .cdb-voices-inline{display:none}
}
@media(min-width:769px) and (max-width:1050px){
 body.cdb-voices-header .main-content-container{margin-top:142px!important}body.cdb-voices-header .cdb-voices-inline{display:flex;position:absolute;top:82px;left:0;width:100%;background:#fff}
}
@media(max-width:768px){body.cdb-voices-header .cdb-voices-inline{display:none}}


/* Continue the gray header surface behind the expanded desktop search. */
@media(min-width:769px){
 #cd-root #ds-search:has(#cdb-desktop):not(.cdb-entry-compact){background:#f8f8f8;padding-top:8px;padding-bottom:24px;isolation:isolate}
 #cd-root #ds-search:has(#cdb-desktop)::before{content:"";position:absolute;top:0;bottom:0;left:calc(50% - 50vw);width:100vw;background:#f8f8f8;border-bottom:1px solid #ebebeb;z-index:-1;pointer-events:none}
 body.cdb-voices-header .svc-tabs-wrap{display:none}
}

/* One gray header/search surface; sidebar follows its animated boundary. */
@media(min-width:769px){
 body:has(#cdb-desktop) header{border-bottom:0!important}
 body:has(#cdb-desktop) #seller-sidebar{top:var(--cdb-sidebar-top,210px)!important;height:calc(100vh - var(--cdb-sidebar-top,210px))!important}
 body.cdb-header-compact:has(#cdb-desktop) #seller-sidebar{top:82px!important;height:calc(100vh - 82px)!important}
 @media(prefers-reduced-motion:reduce){body:has(#cdb-desktop) #seller-sidebar{transition:none!important}}
}

@media(min-width:769px){body:has(#seller-sidebar) #cd-root #ds-search:has(#cdb-desktop)::before{margin-left:-48px}body[dir="rtl"]:has(#seller-sidebar) #cd-root #ds-search:has(#cdb-desktop)::before{margin-left:48px}}

/* Keep the gray surface mounted while the search animates into the header. */
@media(min-width:769px){
 body:has(#cdb-desktop) header{background:#f8f8f8!important}
 #cd-root #ds-search:has(#cdb-desktop){background:#f8f8f8;isolation:isolate}
}

/* Collapse the gray backdrop with the search, without leaving a tall sticky band. */
@media(min-width:769px){
 #cd-root #ds-search:has(#cdb-desktop){background:transparent!important}
 #cd-root #ds-search:has(#cdb-desktop)::before{transform-origin:top}
 #cd-root #ds-search.cdb-entry-compact:has(#cdb-desktop)::before{transform:scaleY(0)}
 @media(prefers-reduced-motion:reduce){#cd-root #ds-search:has(#cdb-desktop)::before{transition:none}}
}

/* Match the exposed document canvas during macOS pull/elastic scrolling. */
@media(min-width:769px){
 html:has(#cdb-desktop),body:has(#cdb-desktop){background-color:#f8f8f8!important}
}

/* Pointer hover mirrors the rounded search segments without changing layout. */
@media(min-width:769px) and (hover:hover) and (pointer:fine){
 #cdb-desktop .cdb-segment{transition:background-color 150ms ease,box-shadow 180ms}
 #cdb-desktop .cdb-segment:not([aria-expanded=true]):hover{background:#ebebeb}
 #cdb-desktop .cdb-segment:hover:before,
 #cdb-desktop .cdb-segment:hover+.cdb-segment:before{opacity:0}
}