/* SYSTEM ERROR · adaptive viewport + stable chrome hotfix · 2026-09-17 */
html,body{width:100%;height:100%;max-width:100%;overflow:hidden!important}
body{overscroll-behavior:none;-webkit-text-size-adjust:100%}
#appShell.shell{box-sizing:border-box!important;width:100%!important;height:100dvh!important;min-height:100dvh!important;max-height:100dvh!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;padding:0!important}
#appShell>.topbar{position:relative!important;inset:auto!important;flex:0 0 auto!important;width:100%!important;z-index:60!important;transform:none!important;transition:background-color .16s ease,border-color .16s ease!important}
#mainContent.content{box-sizing:border-box!important;flex:1 1 auto!important;min-height:0!important;width:min(100%,780px)!important;margin:0 auto!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior-y:contain!important;-webkit-overflow-scrolling:touch!important;scrollbar-gutter:stable both-edges}
#appShell>.appMaintenance{display:none!important}
#appShell>.nav{position:relative!important;inset:auto!important;left:auto!important;right:auto!important;bottom:auto!important;transform:none!important;flex:0 0 auto!important;width:100%!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;z-index:60!important}
#appShell>.nav button{min-width:0!important;overflow:hidden!important;text-overflow:ellipsis!important}
.homeDashboard,.homeFeed,.broadcastHistory,.content>.list{width:100%!important;max-width:100%!important;box-sizing:border-box!important}
.homeHero,.broadcastCard,.homePublication,.rowCard{max-width:100%!important;box-sizing:border-box!important;overflow:hidden}
.homeDashboard img,.homeFeed img,.broadcastCard img,.homePublication img,.attachmentCard img{display:block;max-width:100%!important;height:auto;object-fit:contain}
.homeDashboard video,.homeFeed video,.attachmentCard video{max-width:100%!important;height:auto}

.chatScreen{box-sizing:border-box!important;width:100%!important;height:100dvh!important;min-height:100dvh!important;max-height:100dvh!important;display:flex!important;flex-direction:column!important;overflow:hidden!important;overscroll-behavior:none!important}
.chatScreen.hidden{display:none!important}
.chatScreen>.chatHead,.chatScreen>.secureNote,.chatScreen>.pinnedBar,.chatScreen>.chatActivity,.chatScreen>.composer{flex:0 0 auto!important;transform:none!important}
.chatScreen>.chatHead{position:relative!important;inset:auto!important;z-index:30!important}
.chatScreen>.messages{flex:1 1 auto!important;min-height:0!important;max-height:none!important;overflow-x:hidden!important;overflow-y:auto!important;overscroll-behavior-y:contain!important;-webkit-overflow-scrolling:touch!important;scroll-behavior:auto!important}
.chatScreen>.composer{position:relative!important;inset:auto!important;z-index:30!important}
#directMessages,#messages,#systemMessages{overflow-anchor:auto}
#directMessages .bubble,#messages .bubble,#systemMessages .bubble{overflow-anchor:auto}
.lock.screen,#authScreen{box-sizing:border-box!important;width:100%!important;min-height:100dvh!important;max-height:100dvh!important;overflow-x:hidden!important;overflow-y:auto!important;-webkit-overflow-scrolling:touch!important}
.lockbox,.authBody,.authHero{max-width:100%!important;box-sizing:border-box!important}
@media(max-width:700px){#mainContent.content{padding-left:max(12px,var(--safe-l))!important;padding-right:max(12px,var(--safe-r))!important}.topbar{flex-wrap:nowrap!important}.topTitle{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}.chatScreen>.messages{padding-bottom:10px!important}}
@media(orientation:landscape) and (max-height:520px){.lock.screen,#authScreen{align-items:flex-start!important}.lockbox{margin:auto!important}.authHero{height:96px!important}.key{width:54px!important;height:54px!important}}

/* iPhone/mobile bottom viewport hard fix · 2026-09-17 */
@media(max-width:899px){
  html,body{width:100%!important;height:100%!important;min-height:100%!important;overflow:hidden!important}
  #appShell.shell{position:fixed!important;inset:0!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;padding:0!important;margin:0!important;display:block!important;overflow:hidden!important}
  #appShell>.topbar{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:auto!important;width:100%!important;height:var(--app-fixed-topbar-height)!important;min-height:var(--app-fixed-topbar-height)!important;margin:0!important}
  #mainContent.content{position:fixed!important;top:var(--app-fixed-topbar-height)!important;right:0!important;bottom:var(--ui-nav-height)!important;left:0!important;width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;margin:0!important;overflow-x:hidden!important;overflow-y:auto!important}
  #appShell>.nav{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;width:100%!important;height:var(--ui-nav-height)!important;min-height:var(--ui-nav-height)!important;margin:0!important;padding:6px max(10px,var(--safe-r)) var(--safe-b) max(10px,var(--safe-l))!important;box-sizing:border-box!important;transform:none!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;z-index:90!important}
  #appShell>.nav button{min-height:52px!important}
}

/* Current Capacitor build: native safe-area is already inset; restore compact top chrome. */
@media(max-width:899px){
  #appShell.shell{position:fixed!important;inset:0!important;display:flex!important;flex-direction:column!important;width:100%!important;height:100%!important;min-height:0!important;max-height:none!important;padding:0!important;overflow:hidden!important}
  #appShell>.topbar{position:relative!important;inset:auto!important;flex:0 0 auto!important;width:100%!important;height:58px!important;min-height:58px!important;padding:8px max(14px,var(--safe-r)) 8px max(14px,var(--safe-l))!important;margin:0!important}
  #mainContent.content{position:relative!important;inset:auto!important;flex:1 1 auto!important;min-height:0!important;width:100%!important;max-width:none!important;margin:0!important;padding-bottom:calc(84px + var(--safe-b))!important;overflow-x:hidden!important;overflow-y:auto!important}
  #appShell>.nav{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;width:100%!important;margin:0!important;transform:none!important;z-index:90!important}
}

/* ROOT SE native iOS edge-to-edge build */
@media(max-width:899px){
  html.edgeToEdge,html.edgeToEdge body{width:100%!important;height:100%!important;min-height:100%!important;background:var(--bg-main)!important;overflow:hidden!important}
  html.edgeToEdge #appShell.shell{position:fixed!important;inset:0!important;display:block!important;width:100%!important;height:auto!important;min-height:0!important;max-height:none!important;padding:0!important;margin:0!important;overflow:hidden!important;background:var(--bg-main)!important}
  html.edgeToEdge #appShell>.topbar{position:fixed!important;top:0!important;left:0!important;right:0!important;bottom:auto!important;box-sizing:border-box!important;width:100%!important;height:calc(58px + var(--safe-t))!important;min-height:calc(58px + var(--safe-t))!important;padding:var(--safe-t) max(14px,var(--safe-r)) 0 max(14px,var(--safe-l))!important;margin:0!important;background:rgba(2,10,14,.98)!important}
  html.edgeToEdge #mainContent.content{position:fixed!important;top:calc(58px + var(--safe-t))!important;right:0!important;bottom:calc(68px + var(--safe-b))!important;left:0!important;width:100%!important;max-width:none!important;height:auto!important;min-height:0!important;margin:0!important;padding-bottom:18px!important;overflow-x:hidden!important;overflow-y:auto!important}
  html.edgeToEdge #appShell>.nav{position:fixed!important;left:0!important;right:0!important;bottom:0!important;top:auto!important;box-sizing:border-box!important;width:100%!important;height:calc(68px + var(--safe-b))!important;min-height:calc(68px + var(--safe-b))!important;margin:0!important;padding:6px max(10px,var(--safe-r)) var(--safe-b) max(10px,var(--safe-l))!important;transform:none!important;z-index:90!important;background:rgba(3,12,17,.985)!important}
  html.edgeToEdge #appShell>.nav button{min-height:52px!important}
}

/* Device-first image generator */
.igPage{display:grid;gap:16px;padding-bottom:24px}.igHero,.igCard,.igResult{box-sizing:border-box;width:100%;border:1px solid rgba(70,205,255,.14);background:rgba(4,15,21,.72);border-radius:18px;padding:16px}.igHero h1{margin:6px 0 8px}.igHero p{margin:0;color:var(--text-soft,#9bb0ba)}
.igCard{display:grid;gap:13px}.igCard label{display:grid;gap:7px;font-size:13px;color:var(--text-soft,#a7b8c1)}.igCard textarea,.igCard select{box-sizing:border-box;width:100%;border:1px solid rgba(93,214,255,.18);border-radius:13px;background:rgba(0,7,11,.9);color:var(--text,#eefaff);padding:12px;outline:none}.igCard textarea:focus,.igCard select:focus{border-color:rgba(75,220,255,.6);box-shadow:0 0 0 3px rgba(40,195,255,.08)}
.igGrid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.igLocalFlag{display:flex;flex-direction:column;gap:3px;padding:12px;border-radius:14px;background:rgba(25,188,235,.07);border:1px solid rgba(60,210,255,.15)}.igLocalFlag b{color:#dffaff}.igLocalFlag span,.igDevice{font-size:12px;color:#8ba4af}.igDevice{padding:0 2px;overflow-wrap:anywhere}
.igStatus{padding:11px 12px;border-radius:13px;font-size:13px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035)}.igStatus.ok{border-color:rgba(69,235,155,.22);color:#aaf4ce}.igStatus.warn{border-color:rgba(255,196,85,.24);color:#ffd994}.igStatus.error{border-color:rgba(255,91,112,.28);color:#ffabb7}.igStatus.info{color:#b8dce9}
.igActions{display:flex;gap:10px;flex-wrap:wrap}.igActions button{min-height:44px}.igResult:empty{display:none}.igResult img{display:block;width:100%;height:auto;max-height:72vh;object-fit:contain;border-radius:14px}
@media(max-width:560px){.igGrid{grid-template-columns:1fr}.igHero,.igCard,.igResult{border-radius:15px;padding:13px}.igActions{display:grid;grid-template-columns:1fr 1fr}.igActions button{width:100%}}

/* Music EQ · 10-band local Web Audio equalizer */
.musicControl.eq{font-size:10px;font-weight:850;letter-spacing:.04em}
.musicControl.eq.on{color:var(--cyan)!important;background:rgba(34,212,255,.14)!important;border:1px solid rgba(34,212,255,.28)!important}
.musicEqSheet{padding-bottom:max(8px,var(--safe-b))}
.musicEqHead{display:flex;align-items:center;justify-content:space-between;gap:16px}
.musicEqHead h2{margin:2px 0 0}.musicEqEyebrow{margin:0;color:var(--cyan);font-size:9px;font-weight:800;letter-spacing:.12em}
.musicEqPresets{display:flex;gap:7px;overflow-x:auto;padding:6px 0 12px;scrollbar-width:none}.musicEqPresets::-webkit-scrollbar{display:none}
.musicEqPresets button{flex:none;padding:8px 11px;border:1px solid var(--stroke);border-radius:999px;background:rgba(255,255,255,.035);color:var(--text2);font-size:11px}
.musicEqPresets button.on{border-color:rgba(34,212,255,.38);background:rgba(34,212,255,.12);color:var(--cyan)}
.musicEqPreamp{margin:4px 0 13px}.musicEqPreamp label{display:flex;justify-content:space-between;color:var(--muted2);font-size:11px}.musicEqPreamp b{color:var(--text2)}
.musicEqPreamp input{width:100%;accent-color:var(--cyan)}
.musicEqBands{display:grid;grid-template-columns:repeat(10,minmax(48px,1fr));gap:5px;overflow-x:auto;padding:8px 1px 12px}
.musicEqBand{min-width:48px;height:174px;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:4px;padding:7px 3px;border:1px solid rgba(255,255,255,.055);border-radius:12px;background:rgba(255,255,255,.025)}
.musicEqBand input{-webkit-appearance:slider-vertical;appearance:slider-vertical;width:26px;height:108px;accent-color:var(--cyan)}
.musicEqBand b{font-size:10px}.musicEqBand small{margin-top:-4px;color:var(--muted2);font-size:7px}.musicEqGainValue{color:#7e9ba8;font-size:8px;white-space:nowrap}
@media(max-width:620px){.musicEqBands{grid-template-columns:repeat(10,50px)}.musicEqBand{height:164px}.musicEqBand input{height:98px}}

/* iPhone music player visibility fix · 2026-09-17 */
@media(max-width:899px){
  .musicPlayerDock{z-index:110!important;left:8px!important;right:8px!important;width:auto!important;max-width:none!important;transform:none!important;bottom:calc(76px + var(--safe-b))!important}
  .musicPlayerDock:not(.hidden):not(.playerCollapsed){display:block!important;visibility:visible!important;opacity:1!important}
  .musicFloat{z-index:111!important;right:max(14px,var(--safe-r))!important;bottom:calc(82px + var(--safe-b))!important}
  html.edgeToEdge .musicPlayerDock{bottom:calc(76px + var(--safe-b))!important}
  html.edgeToEdge .musicFloat{bottom:calc(82px + var(--safe-b))!important}
  .musicPlayerTop{min-width:0!important}.musicPlayerMeta{min-width:0!important}
}

/* Full vertical stretch · app + drawer · 2026-09-17 */
html,body,#appShell.shell,.chatScreen,.drawerLayer{height:100dvh!important;min-height:100dvh!important;max-height:100dvh!important}
#appShell.shell{position:fixed!important;inset:0!important;width:100%!important;box-sizing:border-box!important;overflow:hidden!important}
.drawerLayer{position:fixed!important;inset:0!important;width:100vw!important;box-sizing:border-box!important}
.sideDrawer{top:0!important;bottom:auto!important;left:0!important;height:100dvh!important;min-height:100dvh!important;max-height:100dvh!important;box-sizing:border-box!important;display:flex!important;flex-direction:column!important;overflow:hidden!important}
.drawerBrand,.drawerHead,.drawerFooter{flex:0 0 auto!important}
.drawerNav{flex:1 1 auto!important;min-height:0!important;display:flex!important;flex-direction:column!important;overflow-y:auto!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important}
.drawerNav button{flex:1 0 46px!important;min-height:46px!important;max-height:62px!important}
.drawerFooter{margin-top:0!important;padding-bottom:max(2px,var(--safe-b))!important}
#mainContent.content{min-height:0!important;max-height:none!important}

/* Native iPhone: viewport is already safe-area inset; do not apply it twice */
html.edgeToEdge{--safe-t:0px!important;--safe-r:0px!important;--safe-b:0px!important;--safe-l:0px!important}
@media(max-width:899px){
  html.edgeToEdge #appShell>.topbar{height:58px!important;min-height:58px!important;padding:8px 14px!important}
  html.edgeToEdge #mainContent.content{top:58px!important;bottom:68px!important;padding-bottom:18px!important}
  html.edgeToEdge #appShell>.nav{height:68px!important;min-height:68px!important;padding:6px 10px 0!important}
  html.edgeToEdge .sideDrawer{padding:14px!important}
  html.edgeToEdge .chatScreen>.chatHead{padding-top:0!important}
  html.edgeToEdge .musicPlayerDock{bottom:76px!important}
  html.edgeToEdge .musicFloat{bottom:82px!important}
}