/* ShoreBuild V112 — panel cleanup, popup theming, top-only mobile navigation */
:root{--mc:"Minecraft Ten","Press Start 2P",ui-monospace,monospace}

/* ---------- universal panel polish ---------- */
body:has(.admin-layout), body:has(.staff-shell){overflow-x:hidden}
body:has(.admin-layout) button, body:has(.staff-shell) button,
body:has(.admin-layout) input, body:has(.staff-shell) input,
body:has(.admin-layout) textarea, body:has(.staff-shell) textarea,
body:has(.admin-layout) select, body:has(.staff-shell) select{font-family:inherit}

/* ADMIN = strict black / white / gray. No cyan/blue carryover. */
body:has(.admin-layout){--v112-bg:#f4f4f4;--v112-card:#fff;--v112-ink:#090909;--v112-muted:#717171;--v112-border:#d2d2d2;--v112-dark:#080808;--v112-hover:#262626}
body:has(.admin-layout) .admin-popup,
body:has(.admin-layout) .admin-user-popup,
body:has(.admin-layout) .feature-disabler-popup,
body:has(.admin-layout) .interactive-preview-modal,
body:has(.admin-layout) .tutorial-preview-modal{background:rgba(0,0,0,.58)!important;backdrop-filter:blur(6px)!important}
body:has(.admin-layout) .admin-popup-content,
body:has(.admin-layout) .admin-user-popup-card,
body:has(.admin-layout) .feature-disabler-dialog,
body:has(.admin-layout) .interactive-preview-dialog,
body:has(.admin-layout) .tutorial-preview-dialog,
body:has(.admin-layout) .tutorial-preview-dialogue,
body:has(.admin-layout) .order-chat-popup,
body:has(.admin-layout) .shulker-enchant-picker-content{
  background:#fff!important;color:#0a0a0a!important;border:1px solid #cfcfcf!important;box-shadow:0 28px 80px rgba(0,0,0,.24)!important
}
body:has(.admin-layout) .admin-popup-content *,
body:has(.admin-layout) .admin-user-popup-card *,
body:has(.admin-layout) .feature-disabler-dialog *,
body:has(.admin-layout) .interactive-preview-dialog *{border-color:#d0d0d0}
body:has(.admin-layout) .admin-popup-content h1,
body:has(.admin-layout) .admin-popup-content h2,
body:has(.admin-layout) .admin-popup-content h3,
body:has(.admin-layout) .admin-user-popup-card h1,
body:has(.admin-layout) .admin-user-popup-card h2,
body:has(.admin-layout) .admin-user-popup-card h3{color:#080808!important;font-family:var(--mc)!important}
body:has(.admin-layout) .admin-popup-content p,
body:has(.admin-layout) .admin-user-popup-card p,
body:has(.admin-layout) .popup-description{color:#676767!important}
body:has(.admin-layout) .admin-popup-content button:not(.admin-popup-close):not(.admin-user-popup-close),
body:has(.admin-layout) .feature-disabler-dialog button,
body:has(.admin-layout) .interactive-preview-dialog button,
body:has(.admin-layout) .tutorial-preview-dialog button{
  background:#0b0b0b!important;color:#fff!important;border:1px solid #0b0b0b!important
}
body:has(.admin-layout) .admin-popup-content button:hover:not(:disabled),
body:has(.admin-layout) .feature-disabler-dialog button:hover:not(:disabled),
body:has(.admin-layout) .interactive-preview-dialog button:hover:not(:disabled){background:#292929!important;border-color:#292929!important}
body:has(.admin-layout) .admin-popup-close,
body:has(.admin-layout) .admin-user-popup-close,
body:has(.admin-layout) .build-info-close,
body:has(.admin-layout) .feature-disabler-close,
body:has(.admin-layout) .interactive-preview-close{
  background:#f0f0f0!important;color:#111!important;border:1px solid #c7c7c7!important
}
body:has(.admin-layout) .admin-popup-content input,
body:has(.admin-layout) .admin-popup-content textarea,
body:has(.admin-layout) .admin-popup-content select,
body:has(.admin-layout) .admin-user-popup-card input,
body:has(.admin-layout) .admin-user-popup-card select{background:#fff!important;color:#111!important;border-color:#bdbdbd!important;box-shadow:none!important}
body:has(.admin-layout) .admin-popup-content input:focus,
body:has(.admin-layout) .admin-popup-content textarea:focus,
body:has(.admin-layout) .admin-popup-content select:focus{border-color:#111!important;box-shadow:0 0 0 3px rgba(0,0,0,.10)!important}

/* remove legacy cyan from small admin affordances */
body:has(.admin-layout) [style*="#55cff9"],body:has(.admin-layout) [style*="#178dbd"]{color:inherit!important}
body:has(.admin-layout) .status-badge,
body:has(.admin-layout) .admin-status:not(.role-owner),
body:has(.admin-layout) .order-status-badge{filter:saturate(0)!important}

/* panel identity badge in sidebars */
.panel-id-badge{display:flex;align-items:center;gap:10px;margin:0 0 12px;padding:10px 11px;border-radius:11px;font-weight:800}
.panel-id-badge b{display:grid;place-items:center;min-width:38px;height:34px;border-radius:8px;font:400 17px/1 var(--mc);letter-spacing:.04em}
.panel-id-badge span{font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.admin-sidebar .panel-id-badge{background:#111;border:1px solid #2d2d2d;color:#ddd}.admin-sidebar .panel-id-badge b{background:#fff;color:#050505}.admin-sidebar .panel-id-badge span{color:#aaa}
.staff-tabs .panel-id-badge{background:color-mix(in srgb,var(--paccent) 8%,var(--psurface));border:1px solid var(--pborder);color:var(--ptext)}.staff-tabs .panel-id-badge b{background:var(--paccent);color:#fff}.staff-tabs .panel-id-badge span{color:var(--pmuted)}

/* ---------- role popups must inherit role, never default cyan ---------- */
body:has(.staff-shell){--popup-bg:var(--psurface);--popup-ink:var(--ptext);--popup-muted:var(--pmuted);--popup-border:var(--pborder);--popup-accent:var(--paccent);--popup-hover:var(--paccent2)}
body:has(.staff-shell) .admin-popup,
body:has(.staff-shell) .admin-user-popup,
body:has(.staff-shell) .feature-disabler-popup,
body:has(.staff-shell) .interactive-preview-modal,
body:has(.staff-shell) .customer-order-popup,
body:has(.staff-shell) .customer-reminder-modal,
body:has(.staff-shell) .order-participant-profile-modal{background:rgba(20,15,25,.48)!important;backdrop-filter:blur(6px)!important}
body:has(.staff-shell) .admin-popup-content,
body:has(.staff-shell) .admin-user-popup-card,
body:has(.staff-shell) .feature-disabler-dialog,
body:has(.staff-shell) .interactive-preview-dialog,
body:has(.staff-shell) .customer-order-dialog,
body:has(.staff-shell) .customer-reminder-dialog{
  background:var(--popup-bg)!important;color:var(--popup-ink)!important;border:1px solid var(--popup-border)!important;box-shadow:0 28px 80px var(--pshadow)!important
}
body:has(.staff-shell) .admin-popup-content button:not(.admin-popup-close),
body:has(.staff-shell) .customer-order-dialog button,
body:has(.staff-shell) .customer-reminder-dialog button{background:var(--popup-accent)!important;color:#fff!important;border-color:var(--popup-accent)!important}
body:has(.staff-shell) .admin-popup-content button:hover:not(:disabled),
body:has(.staff-shell) .customer-order-dialog button:hover:not(:disabled){background:var(--popup-hover)!important;border-color:var(--popup-hover)!important}
body:has(.staff-shell) .admin-popup-content input,
body:has(.staff-shell) .admin-popup-content textarea,
body:has(.staff-shell) .admin-popup-content select{background:var(--psurface)!important;color:var(--ptext)!important;border:1px solid var(--pborder)!important;box-shadow:none!important}

/* ---------- top-only mobile nav: no bottom navigation ---------- */
@media(max-width:900px){
  .mobile-panel-menu,.staff-mobile-menu{position:fixed!important;top:calc(10px + env(safe-area-inset-top))!important;left:10px!important;right:auto!important;bottom:auto!important;z-index:1202!important;width:44px!important;height:44px!important;min-width:44px!important;min-height:44px!important;border-radius:10px!important;background:#090909!important;border:1px solid #272727!important;color:#fff!important;box-shadow:0 8px 20px rgba(0,0,0,.18)!important}
  .mobile-panel-menu span{background:#fff!important}
  .staff-mobile-menu-row{display:block!important;height:0!important;margin:0!important}
  .staff-mobile-menu{display:grid!important;place-items:center!important;font-size:0!important;padding:0!important}
  .staff-mobile-menu span{font-size:24px!important;line-height:1!important;color:#fff!important}
  .staff-tabs{position:fixed!important;z-index:1201!important;top:0!important;bottom:0!important;left:0!important;right:auto!important;width:min(290px,84vw)!important;display:flex!important;flex-direction:column!important;gap:7px!important;padding:calc(72px + env(safe-area-inset-top)) 14px calc(18px + env(safe-area-inset-bottom))!important;border:0!important;border-right:1px solid var(--pborder)!important;border-radius:0!important;background:var(--psurface)!important;box-shadow:20px 0 50px rgba(0,0,0,.18)!important;overflow-y:auto!important;transform:translateX(-105%)!important;transition:transform .22s cubic-bezier(.2,.8,.2,1)!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
  body.staff-mobile-menu-open .staff-tabs{transform:translateX(0)!important}
  .staff-tabs button{display:flex!important;flex:none!important;justify-items:normal!important;align-content:normal!important;width:100%!important;min-width:0!important;min-height:48px!important;padding:0 12px!important;gap:10px!important;border-radius:11px!important;font-size:12px!important;text-align:left!important}
  .staff-tabs button .staff-nav-icon{width:28px!important;height:28px!important;flex-basis:28px!important}
  .staff-tabs button.active{transform:none!important}
  .admin-sidebar{top:0!important;bottom:0!important}
  .admin-main,.staff-main{padding-top:calc(74px + env(safe-area-inset-top))!important}
}

/* input zoom prevention inside every panel/chat on iPhone */
@media(max-width:768px){
  body:has(.admin-layout) input,body:has(.admin-layout) textarea,body:has(.admin-layout) select,
  body:has(.staff-shell) input,body:has(.staff-shell) textarea,body:has(.staff-shell) select,
  .order-chat-input,.customer-message-compose textarea{font-size:16px!important}
}

/* ---------- Admin Shulker Editor: grid / compact list ---------- */
.shulker-admin-toolbar{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:12px!important;flex-wrap:wrap!important}
.shulker-admin-view-switch{display:flex;gap:6px;padding:4px;border:1px solid #d0d0d0;border-radius:11px;background:#ededed}
.shulker-admin-view-switch button{min-height:36px!important;padding:7px 11px!important;border-radius:8px!important;background:transparent!important;color:#555!important;border:0!important;box-shadow:none!important;font-family:var(--mc)!important;font-size:11px!important}
.shulker-admin-view-switch button.active{background:#0a0a0a!important;color:#fff!important}.shulker-admin-view-switch button:hover:not(.active){background:#ddd!important;color:#111!important;transform:none!important}
.shulker-admin-item-card{overflow:hidden!important}.shulker-admin-image-frame{background:#0a0a0a!important;border-bottom:1px solid #ddd!important;display:grid!important;place-items:center!important}.shulker-admin-item-image{object-fit:contain!important;image-rendering:pixelated!important}
.shulker-admin-quantity{display:grid;gap:5px;padding:0 12px 10px;color:#666!important;font-size:10px!important;font-weight:900!important;letter-spacing:.08em!important;text-transform:uppercase!important}.shulker-admin-quantity input{height:38px!important;min-height:38px!important;width:100%!important;text-align:center!important;font-size:16px!important;font-weight:900!important}
.shulker-admin-grid.compact-list{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
.shulker-admin-grid.compact-list .shulker-admin-item-card{display:grid!important;grid-template-columns:72px minmax(0,1fr) 112px auto!important;align-items:center!important;min-height:78px!important;border-radius:12px!important;padding:7px 9px!important;gap:12px!important}
.shulker-admin-grid.compact-list .shulker-admin-image-frame{width:64px!important;height:64px!important;border:0!important;border-radius:9px!important;overflow:hidden!important}.shulker-admin-grid.compact-list .shulker-admin-item-image{width:52px!important;height:52px!important}.shulker-admin-grid.compact-list .admin-build-info{padding:0!important}.shulker-admin-grid.compact-list .admin-build-info h3{margin:2px 0 4px!important;font-size:16px!important}.shulker-admin-grid.compact-list .admin-build-info p{margin:0!important}.shulker-admin-grid.compact-list .shulker-admin-quantity{padding:0!important}.shulker-admin-grid.compact-list .build-actions{padding:0!important;display:flex!important;gap:6px!important;justify-content:flex-end!important}.shulker-admin-grid.compact-list .build-actions button{min-height:38px!important;padding:7px 10px!important}
@media(max-width:650px){.shulker-admin-view-switch{width:100%;justify-content:stretch}.shulker-admin-view-switch button{flex:1}.shulker-admin-grid.compact-list .shulker-admin-item-card{grid-template-columns:58px minmax(0,1fr) 84px!important;gap:8px!important}.shulker-admin-grid.compact-list .shulker-admin-image-frame{width:52px!important;height:52px!important}.shulker-admin-grid.compact-list .shulker-admin-item-image{width:44px!important;height:44px!important}.shulker-admin-grid.compact-list .build-actions{grid-column:2/4!important;justify-content:flex-start!important}.shulker-admin-grid.compact-list .shulker-admin-quantity input{height:36px!important;min-height:36px!important}}

/* Staff order popups inherit the role palette; removes public cyan defaults. */
body.staff-order-view .customer-order-popup,body.staff-order-view .customer-reminder-modal,body.staff-order-view .order-participant-profile-modal{background:rgba(0,0,0,.5)!important;backdrop-filter:blur(6px)!important}
body.staff-order-view .customer-order-dialog,body.staff-order-view .customer-reminder-dialog,body.staff-order-view .order-participant-profile-card{background:var(--chat-surface)!important;color:var(--chat-text)!important;border-color:var(--chat-border)!important;box-shadow:0 28px 80px rgba(0,0,0,.22)!important}
body.staff-order-view .customer-order-close,body.staff-order-view .order-participant-profile-close{background:var(--chat-soft)!important;color:var(--chat-text)!important;border-color:var(--chat-border)!important}
body.staff-order-view .customer-reminder-dialog input,body.staff-order-view .customer-reminder-dialog textarea,body.staff-order-view .order-participant-profile-card{color:var(--chat-text)!important}
body.staff-order-view .customer-reminder-dialog input,body.staff-order-view .customer-reminder-dialog textarea{background:var(--chat-soft)!important;border:1px solid var(--chat-border)!important;font-size:16px!important}
body.staff-order-view .customer-reminder-dialog button,body.staff-order-view .customer-staff-tools button{background:var(--chat-accent)!important;color:#fff!important;border-color:var(--chat-accent2)!important}
body.staff-order-view.role-owner .customer-order-dialog,body.staff-order-view.role-owner .customer-reminder-dialog,body.staff-order-view.role-owner .order-participant-profile-card{--chat-surface:#fff;--chat-text:#111;--chat-border:#ccc;--chat-soft:#f2f2f2;--chat-accent:#0b0b0b;--chat-accent2:#0b0b0b}


/* V112.1 — all modal/popup surfaces are deliberately monochrome.
   Role colors stay in the panel itself; dialogs never fall back to legacy cyan. */
body:has(.admin-layout) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.shulker-enchant-picker-content),
body:has(.staff-shell) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.customer-order-dialog,.customer-reminder-dialog,.order-participant-profile-card,.shulker-enchant-picker-content){
  --popup-accent:#0a0a0a!important;--popup-hover:#2b2b2b!important;
  background:#fff!important;color:#0a0a0a!important;border-color:#cfcfcf!important
}
body:has(.admin-layout) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.shulker-enchant-picker-content) :is(h1,h2,h3,h4,strong,label,span),
body:has(.staff-shell) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.customer-order-dialog,.customer-reminder-dialog,.order-participant-profile-card,.shulker-enchant-picker-content) :is(h1,h2,h3,h4,strong,label,span){color:#111!important}
body:has(.admin-layout) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.shulker-enchant-picker-content) :is(p,small,.popup-description),
body:has(.staff-shell) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.customer-order-dialog,.customer-reminder-dialog,.order-participant-profile-card,.shulker-enchant-picker-content) :is(p,small,.popup-description){color:#686868!important}
body:has(.admin-layout) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.shulker-enchant-picker-content) :is(input,textarea,select),
body:has(.staff-shell) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.customer-order-dialog,.customer-reminder-dialog,.order-participant-profile-card,.shulker-enchant-picker-content) :is(input,textarea,select){background:#fff!important;color:#111!important;border-color:#bdbdbd!important;box-shadow:none!important}
body:has(.admin-layout) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.shulker-enchant-picker-content) button:not(.admin-popup-close):not(.admin-user-popup-close),
body:has(.staff-shell) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.customer-order-dialog,.customer-reminder-dialog,.order-participant-profile-card,.shulker-enchant-picker-content) button:not(.admin-popup-close):not(.admin-user-popup-close):not(.customer-order-close):not(.order-participant-profile-close){background:#0a0a0a!important;color:#fff!important;border-color:#0a0a0a!important;box-shadow:none!important}
body:has(.admin-layout) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.shulker-enchant-picker-content) button:hover:not(:disabled),
body:has(.staff-shell) :is(.admin-popup-content,.admin-user-popup-card,.feature-disabler-dialog,.interactive-preview-dialog,.tutorial-preview-dialog,.order-chat-popup,.customer-order-dialog,.customer-reminder-dialog,.order-participant-profile-card,.shulker-enchant-picker-content) button:hover:not(:disabled){background:#292929!important;color:#fff!important;border-color:#292929!important}
body:has(.admin-layout) :is(.admin-popup-close,.admin-user-popup-close,.feature-disabler-close,.interactive-preview-close,.customer-order-close,.order-participant-profile-close),
body:has(.staff-shell) :is(.admin-popup-close,.admin-user-popup-close,.feature-disabler-close,.interactive-preview-close,.customer-order-close,.order-participant-profile-close){background:#efefef!important;color:#111!important;border-color:#c8c8c8!important}
body:has(.admin-layout) :is(.build-image-drop-zone,.game-creator-cover-preview),
body:has(.staff-shell) :is(.build-image-drop-zone,.game-creator-cover-preview){background:#f5f5f5!important;color:#333!important;border-color:#999!important}

/* Staff order/chat dialogs are neutral too, even when the surrounding Builder panel is blue. */
body.staff-order-view :is(.customer-order-dialog,.customer-reminder-dialog,.order-participant-profile-card){background:#fff!important;color:#111!important;border-color:#ccc!important;--chat-surface:#fff!important;--chat-text:#111!important;--chat-border:#ccc!important;--chat-soft:#f2f2f2!important;--chat-accent:#0a0a0a!important;--chat-accent2:#0a0a0a!important}
body.staff-order-view :is(.customer-reminder-dialog,.customer-order-dialog,.order-participant-profile-card) button:not(.customer-order-close):not(.order-participant-profile-close){background:#0a0a0a!important;color:#fff!important;border-color:#0a0a0a!important}

/* Keep the hamburger only at the top-left on mobile. */
@media(max-width:900px){
  .mobile-panel-menu,.staff-mobile-menu{top:calc(10px + env(safe-area-inset-top))!important;bottom:auto!important}
  .staff-mobile-menu-row{position:static!important;inset:auto!important;height:0!important;min-height:0!important;padding:0!important;margin:0!important;background:transparent!important;border:0!important;box-shadow:none!important}
}