/* Buchee — targeted iPhone corrections, 4 Nov 2026.
   Scope is limited to shared DM video, story header, profile options and post detail.
   No upload, message, wallet or follow behavior is modified. */

/* Shared video/reel: the app already creates one overlay. The CSS :before is
   its only play glyph, not a second overlay or a native video button. */
#main-content .pati-dm-layout .pati-dm-shared-video-wrap{
 position:relative!important;
 display:grid!important;place-items:center!important;
 isolation:isolate!important;
 overflow:hidden!important;
}
#main-content .pati-dm-layout .pati-dm-shared-video-wrap>.pati-dm-shared-video{
 display:block!important;pointer-events:none!important;
 -webkit-touch-callout:none!important;
}
#main-content .pati-dm-layout .pati-dm-shared-video-wrap>.pati-dm-shared-video::-webkit-media-controls-start-playback-button,
#main-content .pati-dm-layout .pati-dm-shared-video-wrap>.pati-dm-shared-video::-webkit-media-controls-panel{
 display:none!important;-webkit-appearance:none!important;
}
#main-content .pati-dm-layout .pati-dm-shared-video-wrap>.pati-dm-shared-play{
 position:absolute!important;inset:auto!important;
 top:50%!important;left:50%!important;
 transform:translate(-50%,-50%)!important;
 display:grid!important;place-items:center!important;
 box-sizing:border-box!important;
 width:54px!important;height:54px!important;
 z-index:2!important;pointer-events:none!important;
 border-radius:50%!important;background:rgba(0,0,0,.67)!important;
 border:1px solid #ffffffad!important;color:#fff!important;
 font-size:0!important;line-height:1!important;
}
#main-content .pati-dm-layout .pati-dm-shared-video-wrap>.pati-dm-shared-play::before{
 content:"▶"!important;display:block!important;
 margin-left:3px!important;font:700 21px/1 system-ui,sans-serif!important;
}
#main-content .pati-dm-layout .pati-dm-shared-video-wrap:focus-visible{
 outline:3px solid #7c50b5!important;outline-offset:2px!important;
}

/* An actual story sound button is moved into the header before Close, so
   its vertical alignment is determined by layout rather than screen height. */
#story-overlay .story-player-head{
 display:flex!important;align-items:center!important;
 min-width:0!important;
 gap:7px!important;
}
#story-overlay .story-player-head>.pati-story-sound{
 position:relative!important;inset:auto!important;
 top:auto!important;right:auto!important;left:auto!important;bottom:auto!important;
 z-index:10016!important;transform:none!important;
 order:2!important;flex:0 0 auto!important;
 box-sizing:border-box!important;
 display:inline-flex!important;align-items:center!important;justify-content:center!important;
 min-width:84px!important;min-height:44px!important;height:44px!important;
 margin:0!important;padding:7px 10px!important;
 border:1px solid #ffffff55!important;border-radius:12px!important;
 background:rgba(0,0,0,.48)!important;color:#fff!important;
 font:750 12px/1 system-ui,-apple-system,sans-serif!important;
 white-space:nowrap!important;cursor:pointer!important;
 pointer-events:auto!important;touch-action:manipulation!important;
}
#story-overlay .story-player-head>.story-close{
 order:3!important;flex:0 0 44px!important;
 min-width:44px!important;width:44px!important;
 min-height:44px!important;height:44px!important;
 margin:0!important;
 z-index:10017!important;pointer-events:auto!important;
}
#story-overlay .story-player-head .pati-story-owner-name{
 flex:1 1 auto!important;min-width:0!important;max-width:100%!important;
}
#story-overlay .story-player-head>.pati-story-sound:focus-visible,
#story-overlay .story-player-head>.story-close:focus-visible{
 outline:2px solid #fff!important;outline-offset:2px!important;
}

/* Visitor-profile options: move down one row, below the account heading and
   beside the profile identity instead of floating in the top white margin. */
html[data-pati-view="profile"] #main-content .pati-ig-profile>.pati-profile-more-wrap{
 top:calc(56px + 14px)!important;
 right:clamp(12px,3.7vw,22px)!important;
 z-index:75!important;
}
html[data-pati-view="profile"] #main-content .pati-ig-profile>.pati-profile-more-wrap>summary{
 display:grid!important;place-items:center!important;
 width:44px!important;height:44px!important;min-width:44px!important;
 min-height:44px!important;padding:0!important;
 touch-action:manipulation!important;
}
html[data-pati-view="profile"] #main-content .pati-ig-profile>.pati-profile-more-wrap>summary:focus-visible{
 outline:2px solid #7444ad!important;outline-offset:2px!important;
}

/* Post-detail: one functioning Back action, above its title and helper copy.
   Suppress the global mobile-header Back only when a detail stack is active
   (the JS sets its hidden attribute); the detail toolbar owns navigation. */
@media(max-width:740px){
 html[data-pati-view="home"] #app-root:not(.hidden)>.mobile-header>#pati-global-back[hidden]{
  display:none!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen{
  box-sizing:border-box!important;
  padding:0 0 20px!important;
  gap:0!important;
  max-width:100%!important;min-width:0!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-toolbar{
  box-sizing:border-box!important;position:relative!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  grid-template-rows:44px auto!important;
  grid-template-areas:"back back" "heading count"!important;
  align-items:center!important;column-gap:8px!important;row-gap:2px!important;
  width:100%!important;max-width:100%!important;
  min-height:99px!important;
  padding:7px 12px 10px!important;
  margin:0!important;
  background:#fff!important;color:#21232b!important;
  border:0!important;border-bottom:1px solid #eceef1!important;
  border-radius:0!important;box-shadow:none!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-toolbar>button[data-action="post-back"]{
  display:inline-flex!important;position:relative!important;
  grid-area:back!important;justify-self:start!important;align-self:center!important;
  align-items:center!important;justify-content:center!important;gap:0!important;
  box-sizing:border-box!important;min-height:44px!important;height:44px!important;
  width:44px!important;min-width:44px!important;max-width:44px!important;
  margin:0!important;padding:0!important;
  background:transparent!important;color:#22252d!important;
  border:0!important;border-radius:9px!important;box-shadow:none!important;
  /* Hide the old "Geri" text while retaining its real action and SVG arrow. */
  font-size:0!important;line-height:0!important;
  z-index:3!important;cursor:pointer!important;touch-action:manipulation!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-toolbar>button[data-action="post-back"] .icon{
  width:25px!important;height:25px!important;min-width:25px!important;
  color:#22252d!important;stroke:currentColor!important;fill:none!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-toolbar>div{
  grid-area:heading!important;display:flex!important;flex-direction:column!important;
  align-items:flex-start!important;gap:4px!important;min-width:0!important;
  width:100%!important;margin:0!important;padding:0!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-toolbar strong{
  display:block!important;font-size:15px!important;line-height:1.2!important;
  font-weight:780!important;color:#22252d!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-toolbar small{
  display:block!important;font-size:11px!important;line-height:1.3!important;
  color:#737986!important;white-space:normal!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-toolbar>span{
  grid-area:count!important;display:none!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-list{
  min-width:0!important;width:100%!important;
 }
 html[data-pati-view="home"] #main-content .pati-detail-screen>.pati-detail-toolbar>button[data-action="post-back"]:focus-visible{
  outline:2px solid #7444ad!important;outline-offset:1px!important;
 }
}
@media(max-width:360px){
 #story-overlay .story-player-head{gap:5px!important;}
 #story-overlay .story-player-head>.pati-story-sound{
  min-width:76px!important;padding:6px 7px!important;font-size:11px!important;
 }
}

/* 2026-11-04: unified backbar for both single-post and stacked post details. */
html[data-pati-view="home"] #main-content .buchee-post-backbar{
 display:flex!important;position:relative!important;
 align-items:center!important;justify-content:flex-start!important;
 box-sizing:border-box!important;
 width:100%!important;min-width:0!important;min-height:56px!important;
 margin:0!important;padding:6px 12px!important;
 background:#fff!important;
 border:0!important;border-bottom:1px solid #eceef1!important;
 border-radius:0!important;box-shadow:none!important;
}
html[data-pati-view="home"] #main-content .buchee-post-backbar>button[data-action="post-back"]{
 appearance:none!important;
 display:inline-flex!important;position:relative!important;
 flex:0 0 auto!important;align-items:center!important;justify-content:flex-start!important;
 box-sizing:border-box!important;width:auto!important;
 min-width:82px!important;min-height:44px!important;height:44px!important;
 margin:0!important;padding:7px 8px!important;gap:8px!important;
 border:0!important;border-radius:8px!important;
 background:transparent!important;background-image:none!important;
 box-shadow:none!important;color:#141519!important;-webkit-text-fill-color:#141519!important;
 font:700 16px/1.2 system-ui,-apple-system,sans-serif!important;
 text-align:left!important;white-space:nowrap!important;
 cursor:pointer!important;touch-action:manipulation!important;
}
html[data-pati-view="home"] #main-content .buchee-post-backbar>button[data-action="post-back"]>.icon{
 display:block!important;flex:0 0 24px!important;
 width:24px!important;height:24px!important;
 min-width:24px!important;min-height:24px!important;
 color:#141519!important;stroke:currentColor!important;fill:none!important;
 opacity:1!important;visibility:visible!important;
}
html[data-pati-view="home"] #main-content .buchee-post-backbar>button[data-action="post-back"]>span{
 display:inline!important;
 position:static!important;inset:auto!important;
 margin:0!important;padding:0!important;max-width:none!important;
 font:700 16px/1.2 system-ui,-apple-system,sans-serif!important;
 color:#141519!important;-webkit-text-fill-color:#141519!important;
 opacity:1!important;visibility:visible!important;
}
html[data-pati-view="home"] #main-content .buchee-post-backbar>button[data-action="post-back"]:focus-visible{
 outline:2px solid #7547a3!important;outline-offset:2px!important;
}

/* Buchee: use the self-contained Back arrow, never an unloaded icon sprite. */
html[data-pati-view="home"] #main-content .buchee-post-backbar>button[data-action="post-back"]{
 display:inline-flex!important;align-items:center!important;justify-content:flex-start!important;
 min-width:94px!important;min-height:44px!important;width:auto!important;
 padding:8px 10px!important;gap:8px!important;
 color:#141519!important;-webkit-text-fill-color:#141519!important;
 font:700 16px/1.2 system-ui,-apple-system,sans-serif!important;
}
html[data-pati-view="home"] #main-content .buchee-post-backbar>button[data-action="post-back"]>.buchee-post-back-arrow{
 display:block!important;visibility:visible!important;opacity:1!important;
 box-sizing:border-box!important;flex:0 0 24px!important;
 width:24px!important;height:24px!important;min-width:24px!important;max-width:24px!important;
 margin:0!important;padding:0!important;
 color:#141519!important;stroke:#141519!important;stroke-width:2.4!important;
 fill:none!important;filter:none!important;
}
html[data-pati-view="home"] #main-content .buchee-post-backbar>button[data-action="post-back"]>.buchee-post-back-arrow path{
 display:block!important;stroke:#141519!important;fill:none!important;
}
