/* DEVNOOD macOS Unified UI v8
 * Structural bug-fix layer. Loaded after v6/v7.
 * Goals: one traffic-light cluster per window, zero title overlap,
 * stable mobile dashboard/cards, and a working docs drawer on /docs/api.
 */
:root{
  --mac8-bg:#0b0b0d;
  --mac8-window:#1c1c1e;
  --mac8-toolbar:#242426;
  --mac8-card:#262629;
  --mac8-control:#111113;
  --mac8-border:rgba(255,255,255,.10);
  --mac8-border-strong:rgba(255,255,255,.15);
  --mac8-text:#f5f5f7;
  --mac8-sub:#a1a1a6;
  --mac8-muted:#6e6e73;
  --mac8-red:#ff5f57;
  --mac8-yellow:#febc2e;
  --mac8-green:#28c840;
  --mac8-blue:#0a84ff;
  --mac8-ease:cubic-bezier(.22,.78,.2,1);
}

html,body{max-width:100%;overflow-x:hidden}
body.macos-ui{background:var(--mac8-bg)!important}
body.macos-ui *,body.macos-ui *::before,body.macos-ui *::after{box-sizing:border-box}
body.macos-ui img,body.macos-ui svg,body.macos-ui canvas,body.macos-ui video{max-width:100%}
body.macos-ui input,body.macos-ui select,body.macos-ui textarea,body.macos-ui button{min-width:0;max-width:100%}

/* ---------- Window titlebar: real DOM controls only ---------- */
body.macos-ui .macos-titlebar::before,
body.macos-ui [data-modal-content]::before,
body.macos-ui #sidebar::before,
body.macos-ui .docs-sidebar-titlebar::before{content:none!important;display:none!important}

body.macos-ui .macos-titlebar{
  position:sticky!important;top:0!important;z-index:50!important;
  display:grid!important;
  grid-template-columns:58px minmax(0,1fr) 44px!important;
  align-items:center!important;
  column-gap:10px!important;
  width:100%!important;min-width:0!important;min-height:72px!important;height:auto!important;
  margin:0!important;padding:10px 12px!important;
  overflow:visible!important;
  background:var(--mac8-toolbar)!important;background-image:none!important;
  border:0!important;border-bottom:1px solid var(--mac8-border)!important;border-radius:0!important;
  box-shadow:0 1px 0 rgba(0,0,0,.24)!important;
}
body.macos-ui .macos-window-controls{
  grid-column:1!important;
  display:flex!important;align-items:center!important;justify-content:flex-start!important;gap:8px!important;
  width:58px!important;min-width:58px!important;height:22px!important;
  margin:0!important;padding:0 0 0 4px!important;
  position:static!important;transform:none!important;pointer-events:none!important;z-index:3!important;
}
body.macos-ui .macos-window-controls span{
  display:block!important;flex:0 0 12px!important;width:12px!important;height:12px!important;
  border-radius:999px!important;box-shadow:inset 0 0 0 1px rgba(0,0,0,.12)!important
}
body.macos-ui .macos-window-controls .macos-red{background:var(--mac8-red)!important}
body.macos-ui .macos-window-controls .macos-yellow{background:var(--mac8-yellow)!important}
body.macos-ui .macos-window-controls .macos-green{background:var(--mac8-green)!important}

body.macos-ui .macos-title-slot{
  grid-column:2!important;display:flex!important;align-items:center!important;flex-wrap:wrap!important;
  gap:10px!important;min-width:0!important;width:100%!important;max-width:100%!important;
  margin:0!important;padding:0!important;position:static!important;transform:none!important;
}
body.macos-ui .macos-title-slot > *{min-width:0!important;max-width:100%!important}
body.macos-ui .macos-title-slot > .flex,
body.macos-ui .macos-title-slot > .app-settings-title,
body.macos-ui .macos-title-slot > .online-title-row{
  width:100%!important;min-width:0!important;max-width:100%!important;margin:0!important;padding:0!important;
}
body.macos-ui .macos-title-slot h1,
body.macos-ui .macos-title-slot h2,
body.macos-ui .macos-title-slot h3,
body.macos-ui .macos-title-slot h4{
  margin:0!important;min-width:0!important;max-width:100%!important;
  color:var(--mac8-text)!important;font-size:1rem!important;line-height:1.25!important;font-weight:700!important;
  white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important;
}
body.macos-ui .macos-title-slot p,
body.macos-ui .macos-title-slot small{
  display:block!important;margin:3px 0 0!important;min-width:0!important;max-width:100%!important;
  color:var(--mac8-sub)!important;font-size:.75rem!important;line-height:1.3!important;
  white-space:normal!important;overflow-wrap:break-word!important;word-break:normal!important;
}
body.macos-ui .macos-titlebar .macos-close{
  grid-column:3!important;position:static!important;transform:none!important;
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important;
  margin:0!important;padding:0!important;justify-self:end!important;
  color:#8e8e93!important;background:#2c2c2e!important;border:1px solid rgba(255,255,255,.07)!important;border-radius:11px!important;
  z-index:4!important;
}
body.macos-ui .macos-titlebar .macos-close:hover{color:#fff!important;background:#3a3a3c!important}

/* Action buttons inside title slot must wrap below title instead of colliding. */
body.macos-ui .macos-title-slot .macos-title-actions,
body.macos-ui .macos-title-slot .online-actions{
  display:flex!important;align-items:center!important;flex-wrap:wrap!important;gap:8px!important;
  width:100%!important;min-width:0!important;margin:4px 0 0!important;padding:0!important;
}

/* modal shell */
body.macos-ui [data-modal]{
  align-items:center!important;justify-content:center!important;
  padding:max(6px,env(safe-area-inset-top)) max(6px,env(safe-area-inset-right)) max(6px,env(safe-area-inset-bottom)) max(6px,env(safe-area-inset-left))!important;
  overflow:hidden!important;background:rgba(0,0,0,.68)!important
}
body.macos-ui [data-modal-content]{
  width:min(calc(100vw - 16px),1120px)!important;max-width:1120px!important;min-width:0!important;
  max-height:calc(100dvh - 16px)!important;overflow-x:hidden!important;
  border:1px solid var(--mac8-border-strong)!important;border-radius:16px!important;background:var(--mac8-window)!important;
  box-shadow:0 30px 90px rgba(0,0,0,.56)!important;
  transition:transform 170ms var(--mac8-ease),opacity 140ms ease!important
}
body.macos-ui [data-modal-content] > *,
body.macos-ui [data-modal-content] .grid > *,
body.macos-ui [data-modal-content] .flex > *{min-width:0!important;max-width:100%}
body.macos-ui [data-modal-content] .macos-modal-body,
body.macos-ui [data-modal-content].macos-scroll-fallback,
body.macos-ui [data-modal-content] > .overflow-y-auto,
body.macos-ui [data-modal-content] > .modal-body,
body.macos-ui [data-modal-content] > .app-settings-body,
body.macos-ui [data-modal-content] > .auction-body{
  overflow-y:auto!important;overflow-x:hidden!important;overscroll-behavior:contain!important;-webkit-overflow-scrolling:touch!important
}

/* ---------- Dashboard ---------- */
body.macos-ui .dashboard-header{
  display:grid!important;grid-template-columns:minmax(0,1fr)!important;gap:12px!important;
  min-width:0!important;height:auto!important;min-height:0!important;padding:14px 16px!important;overflow:hidden!important
}
body.macos-ui .dashboard-header .header-title{min-width:0!important;width:100%!important;margin:0!important;padding:0!important;position:static!important}
body.macos-ui .dashboard-header .header-title h2{margin:0!important;font-size:1.18rem!important;line-height:1.25!important;white-space:normal!important}
body.macos-ui .dashboard-header .header-title p{margin:4px 0 0!important;font-size:.78rem!important;line-height:1.35!important;white-space:normal!important}
body.macos-ui .stats-container{
  display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;gap:8px!important;
  width:100%!important;max-width:100%!important;min-width:0!important;margin:0!important;padding:0!important;overflow:visible!important
}
body.macos-ui .stats-container .stat-card{
  width:auto!important;min-width:0!important;min-height:70px!important;padding:10px 9px!important;
  display:flex!important;flex-direction:column!important;justify-content:center!important;overflow:hidden!important
}
body.macos-ui .stats-container .stat-card > div:first-child{font-size:1.22rem!important;line-height:1.05!important;white-space:nowrap!important}
body.macos-ui .stats-container .stat-card > div:last-child{font-size:9px!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}

body.macos-ui #keysContainer,body.macos-ui #filesContainer,body.macos-ui #logsContainer{min-width:0!important;max-width:100%!important;overflow-x:hidden!important}
body.macos-ui .key-card-mobile{min-width:0!important;max-width:100%!important;overflow:hidden!important}
body.macos-ui .key-card-mobile *{min-width:0!important}
body.macos-ui .key-card-mobile .key-device-track{height:9px!important;min-height:9px!important;width:100%!important;background:rgba(255,255,255,.09)!important;border-radius:999px!important;overflow:hidden!important}
body.macos-ui .key-card-mobile .key-device-fill{height:100%!important;border-radius:inherit!important;min-width:0!important}

/* Files toolbar */
body.macos-ui .files-toolbar{display:grid!important;grid-template-columns:minmax(0,1fr) auto!important;gap:10px!important;align-items:center!important;min-width:0!important}
body.macos-ui .files-toolbar-search{min-width:0!important;width:100%!important}
body.macos-ui .files-toolbar-actions{display:flex!important;gap:8px!important;align-items:center!important;justify-content:flex-end!important;min-width:0!important}
body.macos-ui #filesContainer .font-bold,body.macos-ui #filesContainer .font-mono{overflow-wrap:anywhere!important;word-break:break-word!important}

/* settings/app/promo forms */
body.macos-ui #settingsModal .settings-tabs,
body.macos-ui #appSettingsModal .app-settings-tabs{
  display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:6px!important;width:100%!important;min-width:0!important
}
body.macos-ui #settingsModal .settings-tab-btn,
body.macos-ui #appSettingsModal .app-settings-tab-btn{
  min-width:0!important;white-space:normal!important;line-height:1.2!important;overflow-wrap:break-word!important
}
body.macos-ui #settingsModal input,body.macos-ui #settingsModal select,body.macos-ui #settingsModal textarea,
body.macos-ui #appSettingsModal input,body.macos-ui #appSettingsModal select,body.macos-ui #appSettingsModal textarea,
body.macos-ui #promoModal input,body.macos-ui #promoModal select,body.macos-ui #promoModal textarea,
body.macos-ui #downloadModal input,body.macos-ui #downloadModal select,body.macos-ui #downloadModal textarea{
  width:100%!important;max-width:100%!important;min-width:0!important
}

/* Cache: avoid Memory/Disconnected word wrapping */
body.macos-ui #cacheModal [data-modal-content] #redis-stats > div,
body.macos-ui #cacheModal [data-modal-content] #opcache-stats > div{
  display:grid!important;grid-template-columns:minmax(112px,1fr) minmax(88px,auto)!important;gap:10px!important;align-items:start!important
}
body.macos-ui #cacheModal [data-modal-content] #redis-stats span,
body.macos-ui #cacheModal [data-modal-content] #opcache-stats span{word-break:normal!important;overflow-wrap:normal!important}

/* ---------- API Docs ---------- */
body.macos-ui.macos-page-docs{margin:0!important;padding:0!important;overflow:hidden!important;background:var(--mac8-bg)!important}
body.macos-ui.macos-page-docs > .docs-shell,
body.macos-ui.macos-page-docs > .flex.docs-shell{
  display:flex!important;width:min(calc(100vw - 24px),1500px)!important;max-width:min(calc(100vw - 24px),1500px)!important;
  height:calc(100dvh - 24px)!important;margin:12px auto!important;overflow:hidden!important;
  border:1px solid var(--mac8-border-strong)!important;border-radius:16px!important;background:var(--mac8-window)!important
}
body.macos-ui.macos-page-docs #docsSidebar{
  position:relative!important;inset:auto!important;z-index:20!important;
  flex:0 0 270px!important;width:270px!important;min-width:270px!important;max-width:270px!important;height:100%!important;
  margin:0!important;padding:0!important;overflow:hidden!important;transform:none!important;pointer-events:auto!important;opacity:1!important;
  background:#202023!important;border:0!important;border-right:1px solid var(--mac8-border)!important;border-radius:0!important;box-shadow:none!important
}
body.macos-ui.macos-page-docs .docs-sidebar-titlebar{
  display:grid!important;grid-template-columns:58px minmax(0,1fr) 40px!important;align-items:center!important;gap:8px!important;
  min-height:70px!important;padding:9px 10px!important;position:relative!important;background:var(--mac8-toolbar)!important;border-bottom:1px solid var(--mac8-border)!important
}
body.macos-ui.macos-page-docs .docs-sidebar-lights{
  grid-column:1!important;position:static!important;transform:none!important;display:flex!important;align-items:center!important;gap:7px!important;padding-left:3px!important
}
body.macos-ui.macos-page-docs .docs-sidebar-lights span{display:block!important;flex:0 0 12px!important;width:12px!important;height:12px!important;border-radius:999px!important}
body.macos-ui.macos-page-docs .docs-sidebar-lights span:nth-child(1){background:var(--mac8-red)!important}
body.macos-ui.macos-page-docs .docs-sidebar-lights span:nth-child(2){background:var(--mac8-yellow)!important}
body.macos-ui.macos-page-docs .docs-sidebar-lights span:nth-child(3){background:var(--mac8-green)!important}
body.macos-ui.macos-page-docs .docs-sidebar-title{grid-column:2!important;display:flex!important;align-items:center!important;gap:9px!important;min-width:0!important;color:var(--mac8-text)!important;text-decoration:none!important}
body.macos-ui.macos-page-docs .docs-sidebar-title strong,body.macos-ui.macos-page-docs .docs-sidebar-title small{display:block!important;min-width:0!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
body.macos-ui.macos-page-docs .docs-sidebar-close{grid-column:3!important;position:static!important;transform:none!important;justify-self:end!important}
body.macos-ui.macos-page-docs .docs-sidebar-body{height:calc(100% - 70px)!important;overflow-y:auto!important;overflow-x:hidden!important;padding:12px 14px 24px!important}
body.macos-ui.macos-page-docs .docs-main{flex:1 1 auto!important;width:0!important;min-width:0!important;max-width:none!important;height:100%!important;overflow-y:auto!important;overflow-x:hidden!important;padding:26px clamp(20px,3vw,42px) 40px!important;position:relative!important;z-index:1!important;background:#18181a!important}
body.macos-ui.macos-page-docs .docs-main section,body.macos-ui.macos-page-docs .docs-main .glass,body.macos-ui.macos-page-docs .docs-main pre,body.macos-ui.macos-page-docs .docs-main table{min-width:0!important;max-width:100%!important}
body.macos-ui.macos-page-docs .docs-main h1,body.macos-ui.macos-page-docs .docs-main h2,body.macos-ui.macos-page-docs .docs-main h3,body.macos-ui.macos-page-docs .docs-main p,body.macos-ui.macos-page-docs .docs-main td,body.macos-ui.macos-page-docs .docs-main th{word-break:normal!important;overflow-wrap:break-word!important}
body.macos-ui.macos-page-docs .docs-main pre{width:100%!important;overflow-x:auto!important;white-space:pre!important;-webkit-overflow-scrolling:touch!important}
body.macos-ui.macos-page-docs .docs-main pre code{white-space:inherit!important;word-break:normal!important;overflow-wrap:normal!important}
body.macos-ui.macos-page-docs .docs-menu-button,body.macos-ui.macos-page-docs .docs-backdrop{display:none!important}

@media(max-width:1023px){
  body.macos-ui.macos-page-docs > .docs-shell,body.macos-ui.macos-page-docs > .flex.docs-shell{
    display:block!important;width:calc(100vw - 10px)!important;max-width:calc(100vw - 10px)!important;height:calc(100dvh - 10px)!important;margin:5px!important
  }
  body.macos-ui.macos-page-docs #docsSidebar{
    position:fixed!important;top:6px!important;bottom:6px!important;left:6px!important;z-index:220!important;
    width:min(86vw,340px)!important;min-width:0!important;max-width:min(86vw,340px)!important;height:calc(100dvh - 12px)!important;
    transform:translate3d(calc(-100% - 22px),0,0)!important;pointer-events:none!important;
    border:1px solid var(--mac8-border-strong)!important;border-radius:15px!important;box-shadow:26px 0 72px rgba(0,0,0,.58)!important;
    transition:transform 190ms var(--mac8-ease)!important
  }
  body.macos-ui.macos-page-docs.docs-sidebar-open #docsSidebar{transform:translate3d(0,0,0)!important;pointer-events:auto!important}
  body.macos-ui.macos-page-docs .docs-sidebar-close{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:38px!important;height:38px!important;color:#8e8e93!important;background:#2c2c2e!important;border:1px solid rgba(255,255,255,.07)!important;border-radius:10px!important}
  body.macos-ui.macos-page-docs .docs-main{width:100%!important;min-width:0!important;height:100%!important;padding:70px 14px 28px!important}
  body.macos-ui.macos-page-docs .docs-menu-button{
    position:fixed!important;top:16px!important;left:16px!important;z-index:260!important;
    display:inline-flex!important;align-items:center!important;justify-content:center!important;
    width:42px!important;height:42px!important;min-width:42px!important;min-height:42px!important;
    color:#f5f5f7!important;background:#303033!important;border:1px solid var(--mac8-border)!important;border-radius:11px!important;
    opacity:1!important;pointer-events:auto!important;touch-action:manipulation!important
  }
  body.macos-ui.macos-page-docs.docs-sidebar-open .docs-menu-button{opacity:0!important;pointer-events:none!important}
  body.macos-ui.macos-page-docs .docs-backdrop{
    position:fixed!important;inset:0!important;z-index:200!important;display:block!important;
    opacity:0!important;visibility:hidden!important;pointer-events:none!important;background:rgba(0,0,0,.56)!important;
    transition:opacity 150ms ease,visibility 0s linear 150ms!important
  }
  body.macos-ui.macos-page-docs.docs-sidebar-open .docs-backdrop{
    opacity:1!important;visibility:visible!important;pointer-events:auto!important;transition-delay:0s!important
  }
  body.macos-ui.macos-page-docs .docs-main table{display:block!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch!important}
}

@media(max-width:767px){
  body.macos-ui .macos-titlebar{grid-template-columns:58px minmax(0,1fr) 42px!important;min-height:76px!important;padding:10px 10px!important;column-gap:8px!important}
  body.macos-ui .macos-window-controls{width:58px!important;min-width:58px!important;gap:7px!important;padding-left:2px!important}
  body.macos-ui .macos-window-controls span{width:11px!important;height:11px!important;flex-basis:11px!important}
  body.macos-ui .macos-title-slot h1,body.macos-ui .macos-title-slot h2,body.macos-ui .macos-title-slot h3,body.macos-ui .macos-title-slot h4{font-size:.98rem!important}
  body.macos-ui .macos-title-slot p,body.macos-ui .macos-title-slot small{font-size:.72rem!important}
  body.macos-ui .stats-container{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  body.macos-ui .stats-container .stat-card:nth-child(4),body.macos-ui .stats-container .stat-card:nth-child(5){grid-column:span 1!important}
  body.macos-ui .files-toolbar{grid-template-columns:minmax(0,1fr)!important}
  body.macos-ui .files-toolbar-actions{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;width:100%!important}
  body.macos-ui #settingsModal .settings-tabs,body.macos-ui #appSettingsModal .app-settings-tabs{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.macos-ui #cacheModal [data-modal-content] .grid.md\\:grid-cols-2{grid-template-columns:minmax(0,1fr)!important}
  body.macos-ui #cacheModal [data-modal-content] #redis-stats > div,body.macos-ui #cacheModal [data-modal-content] #opcache-stats > div{grid-template-columns:minmax(100px,1fr) auto!important}
  body.macos-ui #promoModal .grid.md\\:grid-cols-5{grid-template-columns:minmax(0,1fr)!important}
  body.macos-ui #downloadModal [data-modal-content] .grid.grid-cols-2{grid-template-columns:minmax(0,1fr)!important}
}

@media(max-width:390px){
  body.macos-ui .stats-container{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.macos-ui .stats-container .stat-card:last-child{grid-column:1/-1!important}
}

@media(max-width:900px),(pointer:coarse) and (max-width:1200px){
  body.macos-ui [data-modal],body.macos-ui [data-modal-content],body.macos-ui #sidebar,body.macos-ui .glass,body.macos-ui .glass-card{backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
}
@media(prefers-reduced-motion:reduce){
  body.macos-ui [data-modal],body.macos-ui [data-modal-content],body.macos-ui #docsSidebar,body.macos-ui .docs-backdrop{transition:none!important;animation:none!important}
}

/* Extra guards against legacy docs painters before JS finishes marking the page. */
.docs-shell #docsSidebar::before,.docs-shell .docs-sidebar-titlebar::before{content:none!important;display:none!important}

@media(min-width:1024px){
  body.macos-ui .dashboard-header{grid-template-columns:minmax(220px,1fr) minmax(520px,auto)!important;align-items:center!important}
  body.macos-ui .stats-container{width:min(620px,58vw)!important;justify-self:end!important}
}