/* Picorae v18.177 — APPROVED cream/gold mock made real.
 * One cohesive host Event, Share, Uploads, Settings and guest action language.
 * PRESENTATION ONLY: no QR re-generation, media URLs, payments, state,
 * permission checks, upload flow, moderation or replacement DOM.
 * Deliberately preserve v18.175 Samsung bottom-nav JS + inline selection
 * and v18.176 progressive photo loading and Retry state. */

#manageView{
 --p177-ivory:#fbf7ef;
 --p177-paper:#fffdfa;
 --p177-cream:#f5ead9;
 --p177-ink:#35291c;
 --p177-muted:#716457;
 --p177-line:#e6d9c5;
 --p177-gold:#a77a3d;
 --p177-gold-dark:#805820;
 --p177-shadow:0 9px 26px rgba(57,39,18,.055);
 color:var(--p177-ink);
}
#manageView .host-shell{min-width:0}
#manageView :is(#hostEventTab,#hostGalleryTab,#hostSettingsTab,#p169ShareHub){
 min-width:0;
}
#manageView :is(#hostEventTab,#hostGalleryTab,#hostSettingsTab) > .host-card,
#manageView :is(#hostEventTab,#hostGalleryTab,#hostSettingsTab) .host-feature-card{
 background:var(--p177-paper)!important;
 border:1px solid var(--p177-line)!important;
 border-radius:20px!important;
 box-shadow:var(--p177-shadow)!important;
}
#manageView :is(.host-gallery-hero,.host-settings-hero){
 background:linear-gradient(120deg,#fffefb 0%,#fbf4e9 67%,#f6e8d1 100%)!important;
 border:1px solid #e6d6bf!important;
 border-radius:22px!important;
 padding:clamp(18px,3.6vw,30px)!important;
 box-shadow:var(--p177-shadow)!important;
 color:var(--p177-ink)!important;
}
#manageView :is(.host-gallery-hero,.host-settings-hero)::after{
 border-color:rgba(172,128,61,.17)!important;
 box-shadow:0 0 0 39px rgba(172,128,61,.033),0 0 0 78px rgba(172,128,61,.014)!important;
}
#manageView :is(.host-gallery-hero,.host-settings-hero) .eyebrow{
 color:#9c743a!important;
 font:750 10px/1.3 system-ui,sans-serif!important;
 letter-spacing:.17em!important;
}
#manageView :is(.host-gallery-hero,.host-settings-hero) h2{
 font:500 clamp(32px,4.2vw,48px)/1.08 Georgia,'Times New Roman',serif!important;
 letter-spacing:-.05em!important;
 color:#32261b!important;
 margin:6px 0 10px!important;
}
#manageView :is(.host-gallery-hero,.host-settings-hero) p{
 color:#706254!important;
 font:400 13px/1.6 system-ui,sans-serif!important;
 max-width:610px;
}
#manageView :is(.host-gallery-hero,.host-settings-hero) > .btn{
 color:#714f27!important;background:#fffdf9!important;
 border:1px solid #dac6a8!important;border-radius:12px!important;
 box-shadow:none!important;min-height:43px!important;
}
#manageView :is(.host-gallery-hero,.host-settings-hero) > .btn:hover{
 border-color:#b68b51!important;background:#fbf1e2!important;
}
#manageView :is(.host-gallery-stats,.host-settings-tools){
 min-width:0;gap:9px!important;
}
#manageView .host-gallery-stats button{
 min-width:0!important;min-height:77px!important;
 display:flex!important;flex-direction:column!important;
 align-items:center!important;justify-content:center!important;
 padding:11px 7px!important;
 gap:7px!important;border:1px solid #e5d8c5!important;
 border-radius:15px!important;background:#fffdf9!important;
 box-shadow:0 3px 12px rgba(57,39,18,.035)!important;
}
#manageView .host-gallery-stats button b{
 font:500 clamp(22px,2.5vw,30px)/1 Georgia,serif!important;
 color:var(--p177-ink)!important;
}
#manageView .host-gallery-stats button span{
 font:700 10px/1.25 system-ui,sans-serif!important;
 color:var(--p177-muted)!important;
 letter-spacing:0!important;text-transform:none!important;
 overflow-wrap:anywhere;
}
#manageView .host-gallery-stats button.active{
 background:#f5e7ce!important;border:1px solid #be995f!important;
 box-shadow:inset 0 0 0 1px #d9bf95!important;
}
#manageView .host-gallery-stat-note{
 color:#857665!important;font:400 11px/1.5 system-ui,sans-serif!important;
 padding:0 4px!important;
}
#manageView #hostUploadsSection{
 background:var(--p177-paper)!important;
 border:1px solid var(--p177-line)!important;border-radius:21px!important;
 box-shadow:var(--p177-shadow)!important;
 padding:clamp(16px,2.7vw,24px)!important;
}
#manageView #hostUploadsSection :is(.host-gallery-head h3,.host-card-head h3){
 font:500 clamp(23px,2.8vw,30px)/1.14 Georgia,serif!important;
 letter-spacing:-.032em!important;color:var(--p177-ink)!important;
}
#manageView #hostUploadsSection .host-card-head p{
 color:var(--p177-muted)!important;
 font:400 12px/1.55 system-ui,sans-serif!important;
}
#manageView #hostUploadsSection .host-gallery-top-actions .btn{
 min-height:44px!important;
 border-radius:11px!important;
 padding:10px 13px!important;
 font:700 12px/1.25 system-ui,sans-serif!important;
}
#manageView #hostUploadsSection .host-gallery-top-actions .btn.primary{
 background:linear-gradient(125deg,#9a6c30,#b98e4c)!important;
 border:1px solid #9c7136!important;color:#fff!important;
}
#manageView #adminGallery{
 min-width:0;gap:12px!important;
}
#manageView #adminGallery .photo{
 min-width:0!important;
 border-radius:15px!important;
 overflow:hidden!important;
 border:1px solid #e6d9c7!important;
 box-shadow:0 5px 13px rgba(61,41,19,.045)!important;
}
#manageView #adminEmpty:not(.hidden){
 margin-block:10px!important;
 background:#faf4e9!important;
 border:1px dashed #d9c39f!important;border-radius:15px!important;
 color:#6b583e!important;
 padding:14px!important;font:500 12px/1.55 system-ui,sans-serif!important;
}
#manageView #adminEmpty button{
 margin-left:8px!important;
 min-height:40px!important;border-radius:10px!important;
 background:#fffdf8!important;border-color:#cbb083!important;
 color:#6c4b27!important;
}
#manageView #downloadStatus{
 color:#705e44!important;
 font:500 12px/1.5 system-ui,sans-serif!important;
}
/* Event overview: premium masthead, genuine counters and real action tiles. */
#manageView #hostEventTab .p129-host-overview{
 background:linear-gradient(180deg,#fffefa,#fbf3e8)!important;
 border:1px solid #e4d4bc!important;border-radius:23px!important;
 box-shadow:0 12px 28px rgba(56,36,17,.065)!important;
}
#manageView #hostEventTab .p129-overview-kicker{
 color:#9c7336!important;
 background:#fffdf8!important;
 letter-spacing:.18em!important;font-weight:750!important;
}
#manageView #hostEventTab .p129-host-overview > .host-stat-grid > button.host-stat{
 background:#fffdf9!important;
 border:1px solid #e7dbca!important;
 border-radius:13px!important;
}
#manageView #hostEventTab .p129-host-overview > .host-stat-grid > button.host-stat.active{
 background:#f7ead4!important;border:2px solid #b48b4b!important;
}
#manageView #hostEventTab .p129-host-overview > #p112OverviewActions{
 gap:10px!important;
}
#manageView #hostEventTab .p129-host-overview #p112OverviewActions .p112-action{
 min-width:0!important;
 min-height:118px!important;
 background:linear-gradient(145deg,#fffefa,#fbf5e9)!important;
 border:1px solid #e4d7c4!important;
 box-shadow:0 4px 13px rgba(69,44,20,.035)!important;
 border-radius:17px!important;
 padding:14px!important;
 text-align:left!important;
}
#manageView #hostEventTab .p129-host-overview #p112OverviewActions .p112-action b{
 font:500 clamp(18px,2.2vw,23px)/1.18 Georgia,serif!important;
 letter-spacing:-.035em!important;
 color:#372b1e!important;
}
#manageView #hostEventTab .p129-host-overview #p112OverviewActions .p112-action small{
 font:450 11px/1.5 system-ui,sans-serif!important;
 color:#786a5c!important;
}
/* Model's staged event-control action language while leaving true actions intact. */
#manageView #p170EventControl{
 background:linear-gradient(145deg,#fffdfa,#faf3e9)!important;
 border-color:#e4d6bf!important;
 border-radius:22px!important;
 box-shadow:var(--p177-shadow)!important;
}
#manageView #p170EventControl .p170-control-inbox,
#manageView #p170EventControl .p170-control-display{
 border-radius:16px!important;border-color:#e6dac6!important;
 box-shadow:none!important;
}
#manageView #p170EventControl .p170-primary{
 background:linear-gradient(120deg,#94682c,#b98b44)!important;
 color:#fff!important;border-color:#9e7338!important;
}
#manageView #hostEventTab :is(#p112GuestsPanel,#p112ToolsPanel){
 border:1px solid #e5d8c4!important;
 border-radius:16px!important;background:#fffdf9!important;
 box-shadow:none!important;
}
#manageView #hostEventTab :is(#p112GuestsPanel,#p112ToolsPanel) > summary{
 color:#5f482c!important;
 font:650 13px/1.4 system-ui,sans-serif!important;
 min-height:47px!important;
}
/* Settings: readable segment control rather than four decorative blocks. */
#manageView #hostSettingsTools{
 display:grid!important;
 grid-template-columns:repeat(4,minmax(0,1fr))!important;
 gap:8px!important;
}
#manageView #hostSettingsTools .host-settings-tool{
 border:1px solid #e2d5c3!important;
 border-radius:14px!important;
 padding:12px 7px!important;
 min-width:0!important;min-height:69px!important;
 background:#fffdf9!important;box-shadow:none!important;
 gap:5px!important;
}
#manageView #hostSettingsTools .host-settings-tool.active{
 background:#f5e7ce!important;border-color:#b99158!important;
 box-shadow:inset 0 0 0 1px #e0c89e!important;
}
#manageView #hostSettingsTools .host-settings-tool span{
 font-size:19px!important;height:auto!important;
}
#manageView #hostSettingsTools .host-settings-tool b{
 color:#665443!important;
 font:650 11px/1.25 system-ui,sans-serif!important;
 letter-spacing:0!important;white-space:normal!important;
}
#manageView .host-settings-context{
 padding:8px 4px 3px!important;
}
#manageView .host-settings-context h3{
 font:500 clamp(24px,3vw,31px)/1.12 Georgia,serif!important;
 letter-spacing:-.035em!important;color:#392b1c!important;
}
#manageView .host-settings-context p{
 color:#776c5b!important;
}
#manageView .premium-settings-menu .settings-accordion{
 background:#fffdfa!important;border:1px solid #e6d9c6!important;
 border-radius:16px!important;
 box-shadow:0 4px 15px rgba(59,42,19,.035)!important;
 overflow:clip;
}
#manageView .premium-settings-menu .settings-accordion > summary{
 padding:15px!important;
 min-height:57px!important;
}
#manageView .premium-settings-menu .settings-summary-copy b{
 font:550 16px/1.3 Georgia,serif!important;
 color:#392a1b!important;
}
#manageView .premium-settings-menu .settings-summary-copy small{
 color:#74685c!important;font:400 11px/1.4 system-ui,sans-serif!important;
}
#manageView .premium-settings-menu :is(input,select,textarea){
 border-radius:11px!important;
 background:#fffefa!important;
 border-color:#ded0ba!important;
 min-height:43px!important;
}
#manageView .premium-settings-menu :is(input,select,textarea):focus-visible{
 outline:2px solid #b99153!important;outline-offset:1px!important;
}
/* Your event's existing SHARE panel — design like the same suite. */
#manageView #p169ShareHub:not(.hidden){
 background:linear-gradient(145deg,#fffdfa,#faf2e5)!important;
 border:1px solid #e3d3b9!important;
 border-radius:22px!important;
 box-shadow:var(--p177-shadow)!important;
}
#manageView #p169ShareHub :is(.p169-share-qr,.p169-share-links){
 background:#fffdfa!important;
 border:1px solid #e8dcc8!important;
 border-radius:16px!important;
}
#manageView #p169ShareHub :is(.p169-share-head h2,.p169-share-grid h3){
 color:#392b1b!important;
 font-family:Georgia,serif!important;
 letter-spacing:-.03em!important;
}
#manageView #p169ShareHub .p169-primary{
 background:linear-gradient(120deg,#946729,#b98c49)!important;
 border-color:#a17638!important;color:#fff!important;
}
#manageView #p169ShareHub button{min-height:44px!important;border-radius:11px!important;}
#manageView #p169ShareHub #p169Qr{
 background:#fff!important;
 border:1px solid #e6d9c6!important;
 border-radius:14px!important;
}
/* Guest-facing upload choices continue Picorae visual language but NEVER
 * alter camera/file inputs, live media player, private upload flags or QR. */
#eventView #guestUploadZone{
 background:#fffdfa!important;border-color:#e5d7c2!important;
 box-shadow:0 8px 25px rgba(58,37,16,.048)!important;
}
#eventView #guestUploadZone :is(.btn,.guest-upload-cta){
 border-radius:12px!important;
 min-height:44px;
}
#eventView #guestChallengesCard{
 background:#fbf4e8!important;border-color:#e6d7bf!important;
 border-radius:17px!important;
}
#eventView #guestUploadZone :is(button,a,input,textarea):focus-visible{
 outline:2px solid #b48d52;outline-offset:2px;
}

/* Narrow phone: no fifth counter crammed into a 60px card. 3+2 layout
 * for gallery filters. The fixed nav remains UNTOUCHED by this CSS. */
@media(max-width:720px){
 #manageView :is(.host-gallery-hero,.host-settings-hero){
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;
  gap:14px!important;
 }
 #manageView .host-gallery-stats{
  display:grid!important;grid-template-columns:repeat(6,minmax(0,1fr))!important;
  gap:7px!important;overflow:visible!important;
 }
 #manageView .host-gallery-stats button{
  grid-column:span 2!important;
  min-width:0!important;
  min-height:66px!important;
  padding:9px 6px!important;
 }
 #manageView .host-gallery-stats button:nth-child(n+4){
  grid-column:span 3!important;
 }
 #manageView .host-gallery-stats button b{
  font-size:clamp(19px,5vw,26px)!important;
 }
 #manageView #hostUploadsSection .host-gallery-top-actions{
  display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px!important;
 }
 #manageView #hostUploadsSection .host-gallery-top-actions .btn{
  min-width:0!important;width:100%!important;
 }
 #manageView #hostUploadsSection .host-gallery-top-actions .btn:last-child:nth-child(odd){
  grid-column:1 / -1!important;
 }
 #manageView #p170EventControl .p170-control-grid{
  grid-template-columns:minmax(0,1fr)!important;
 }
 #manageView #hostEventTab .p129-host-overview #p112OverviewActions .p112-action{
  min-height:112px!important;
  padding:12px!important;
 }
 #manageView #hostEventTab .p129-host-overview #p112OverviewActions .p112-action b{
  font-size:clamp(17px,5vw,20px)!important;
 }
 #manageView #adminGallery{grid-template-columns:repeat(2,minmax(0,1fr))!important;}
 #manageView #p169ShareHub .p169-share-grid{grid-template-columns:minmax(0,1fr)!important;}
}
/* Approved reference laptop experience: true sidebar using the *same*
 * four existing owner buttons, not a second fake navigation layer.
 * The identical buttons remain fixed at the bottom on phone/tablet. */
@media(min-width:1100px){
 /* The genuine bottom nav is a DIRECT child of #manageView, not the
    inner .host-shell: grid the actual siblings, never clone nav controls. */
 #manageView:not(.hidden){
  display:grid!important;
  grid-template-columns:minmax(190px,230px) minmax(0,1fr)!important;
  column-gap:23px!important;
  grid-template-rows:auto!important;
  align-items:start!important;
  max-width:1280px!important;
  margin-inline:auto!important;
 }
 #manageView > .host-shell{
  grid-column:2!important;grid-row:1!important;
  min-width:0!important;width:100%!important;max-width:none!important;
  margin:0!important;
 }
 #manageView > .host-bottom-nav{
  grid-column:1!important;grid-row:1!important;
  align-self:start!important;
  position:sticky!important;top:78px!important;
  left:auto!important;bottom:auto!important;transform:none!important;
  width:100%!important;max-width:none!important;height:auto!important;
  display:flex!important;flex-direction:column!important;
  align-items:stretch!important;justify-content:flex-start!important;
  gap:6px!important;margin:0!important;padding:22px 13px!important;
  border:1px solid var(--p177-line)!important;
  border-radius:21px!important;
  background:#fffdf9!important;
  box-shadow:var(--p177-shadow)!important;
  backdrop-filter:none!important;
 }
 #manageView > .host-bottom-nav::before{
  content:"PICORAE  /  EVENT CONTROL";
  display:block!important;
  font:750 10px/1.4 system-ui,sans-serif!important;
  letter-spacing:.14em!important;
  color:#93672d!important;
  padding:0 12px 13px!important;
  margin:0 0 5px!important;
  border-bottom:1px solid #ebdfcf!important;
 }
 #manageView > .host-bottom-nav button.host-nav-btn{
  width:100%!important;max-width:none!important;flex:0 0 auto!important;
  min-height:50px!important;
  display:flex!important;flex-direction:row!important;
  align-items:center!important;justify-content:flex-start!important;
  gap:12px!important;
  text-align:left!important;
  padding:10px 13px!important;
  border-radius:12px!important;
  font:650 13px/1.3 system-ui,sans-serif!important;
 }
 #manageView > .host-bottom-nav button.host-nav-btn .nav-icon{
  width:23px!important;flex:none!important;
 }
 #manageView > .host-bottom-nav .host-plus-btn{
  width:100%!important;max-width:none!important;
  min-width:0!important;height:48px!important;
  min-height:48px!important;flex:0 0 auto!important;
  margin:13px 0 0!important;border-radius:12px!important;
  background:#f1e0c3!important;border:1px solid #ddc49a!important;
  color:#785421!important;font-size:22px!important;
  box-shadow:none!important;
  display:flex!important;align-items:center!important;justify-content:center!important;
  gap:8px!important;
 }
 #manageView > .host-bottom-nav .host-plus-btn::after{
  content:"Quick actions";
  font:700 12px/1.2 system-ui,sans-serif!important;
 }
 #manageView #hostEventTab .p129-host-overview > .host-stat-grid{
  gap:11px!important;
 }
 #manageView #hostEventTab .p129-host-overview #p112OverviewActions{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
 }
 #manageView #p170EventControl .p170-control-grid{
  grid-template-columns:1.12fr 1fr!important;
 }
}
/* Reduced motion honors OS preference while maintaining interaction. */
@media(prefers-reduced-motion:reduce){
 #manageView :is(button,.host-card,.host-settings-tool){
  transition:none!important;
 }
}