/* Approved source materials only. The shell paints its own housing: no
   generated substitute and no full-window overlay that could block dragging. */
@media (min-width: 1200px) {
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] {
    --shell-top: 79px;
    --full-header-rim: none;
    --full-brand-background: none;
  }
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] .app-shell {
    padding-bottom: 44px; border: 0 solid transparent !important;
    border-image: var(--full-shell-image) var(--full-shell-slice) / 79px 150px 52px 311px / 0 stretch !important;
    background: #0c0a09 !important; box-shadow: none !important;
  }
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] .workspace {
    background: transparent !important;
  }
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] .titlebar,
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] .titlebar .brand-lockup {
    background-color: transparent !important; box-shadow: none !important;
    backdrop-filter: none !important; -webkit-backdrop-filter: none !important;
  }
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] .titlebar::before,
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] .titlebar .brand-lockup::after {
    content: none !important; display: none !important;
  }
}
@media (min-width: 1200px) and (max-width: 1430px) {
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] .app-shell {
    border-image-width: 79px 150px 52px 260px !important;
  }
}
@media (min-width:1200px) {
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-metrics {
    grid-template-columns:238fr 247fr 240fr 240fr;
  }
  body[data-skin-atlas="halloween"] .titlebar .window-button {
    width:43px; height:43px; color:#e8b077 !important;
  }
  body[data-skin-atlas="halloween"] .global-search > [data-icon] { color:#ed963e; }
  body[data-skin-atlas="halloween"] .global-search kbd {
    border-color:#38332b !important; background:#0b0c0d !important; color:#b8bdc5 !important;
  }
  body[data-skin-atlas="halloween"] .app-sidebar.rail { padding-top:7px; }
  body[data-skin-atlas="halloween"] .app-sidebar .rail-item {
    padding-left:17px; padding-right:10px; grid-template-columns:33px minmax(0,1fr); column-gap:16px;
  }
  body[data-skin-atlas="halloween"] .app-sidebar .rail-item [data-icon] { width:33px; height:37px; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-panel h2 { font-size:15px; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-news-row strong { font-size:13px; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-friend-row > .avatar {
    background:linear-gradient(145deg,#4c4539,#262a28); border-color:#d79a4e; color:#fff;
  }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-live-cover > b,
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-live-cover:has(img[data-skin-atlas-demo]) > b {
    min-width:52px; height:22px; left:5px; top:6px; font-size:10px;
  }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-live-cover > span,
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-live-cover:has(img[data-skin-atlas-demo]) > span {
    min-width:54px; height:22px; right:6px; top:6px; font-size:11px;
  }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-live-panel h2::before {
    content:""; display:block; flex:none; width:22px; height:23px;
    background:var(--home-liveIcon) center/contain no-repeat;
  }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-live-panel h2 svg { display:none; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-servers-panel h2::before {
    content:""; display:block; flex:none; width:22px; height:23px;
    background:var(--home-serverIcon) center/contain no-repeat;
  }
}
/* Free-standing help/bell/gear glyphs, as in the approved header. Their real
   hit areas and notification badge are unchanged; no extra square plates. */
body[data-skin-atlas="halloween"] .titlebar :is(#topInfoButton,#notificationCenterButton,#topSettingsButton)::after {
  content:none !important; display:none !important;
}
body[data-skin-atlas="halloween"] .titlebar :is(#topInfoButton,#notificationCenterButton,#topSettingsButton) {
  color:#f3a65e !important; box-shadow:none !important;
}
body[data-skin-atlas="halloween"] #topInfoButton { font:24px Georgia,serif; }
body[data-skin-atlas="halloween"] #notificationCenterButton svg {
  width:26px; height:28px; filter:drop-shadow(0 1px 1px #000) drop-shadow(0 0 3px #ff791c55);
}
body[data-skin-atlas="halloween"] #topSettingsButton svg { opacity:0 !important; }
body[data-skin-atlas="halloween"] .profile-quick-controls > button { color:#db9a55 !important; }
/* A raster carving owns its silhouette. An inherited rounded clipping mask
   must not cut off its chamfers; fractional grid tracks must not blur it. */
body[data-skin-atlas="halloween"] :is(.approved-panel,.approved-home-hero,.approved-metrics > div,.app-sidebar,.profile-chip,.global-search) {
  border-radius:0 !important;
}
body[data-skin-atlas="halloween"].theme-style-active #nowView [data-skin-atlas-component]::after,
body[data-skin-atlas="halloween"].theme-style-active .app-sidebar [data-skin-atlas-component]::after,
body[data-skin-atlas="halloween"].theme-style-active .global-search[data-skin-atlas-component]::after {
  inset:auto !important; left:var(--atlas-frame-x,0px) !important; top:var(--atlas-frame-y,0px) !important;
  width:var(--atlas-frame-w,100%) !important; height:var(--atlas-frame-h,100%) !important;
}
body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-news-row { border-bottom-color:#35312c !important; }
body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-news-row > span:first-child {
  border-radius:10px !important; box-shadow:inset 0 1px #ffffff14,inset 0 -2px #0003;
}
/* The short desktop layout keeps the same materials, but does not spend a
   whole 52px on the decorative sill or push controls through a carved edge. */
@media (min-width:1200px) and (max-height:849px) {
  body[data-skin-atlas="halloween"][data-skin-frame-system="approved-source"] .app-shell {
    padding-bottom:22px; border-image-width:79px 150px 0 260px !important;
    background-image:var(--home-footerLeft),var(--home-footerRight),var(--home-footerMiddle) !important;
    background-position:left bottom,right bottom,center bottom !important;
    background-size:75px 26px,75px 26px,calc(100% - 150px) 14px !important;
    background-repeat:no-repeat !important;
  }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-home-copy { padding-top:12px; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .now-actions { margin-top:8px; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-metrics > div {
    padding:9px 13px; grid-template-columns:40px minmax(0,1fr); column-gap:10px;
  }
  body.home-view-active[data-skin-atlas="halloween"] #nowView [data-home-material="metric"] {
    width:40px !important; height:41px !important;
  }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-metrics strong { font-size:24px; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-metrics > div > span:last-child { font-size:11px; }
  body[data-skin-atlas="halloween"] .app-sidebar .rail-item { min-height:32px; height:32px; }
  body[data-skin-atlas="halloween"] .rail-primary > .rail-item:first-child { min-height:36px; height:36px; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-panel h2 { font-size:14px; }
  body.home-view-active[data-skin-atlas="halloween"] #nowView .approved-news-row strong { font-size:12px; }
}
body[data-skin-atlas="halloween"] #nowView [data-skin-atlas-full-material] {
  background-image: none !important; background-color: #100f0f !important;
}
body[data-skin-atlas="halloween"] #nowView [data-skin-atlas-full-material] > header {
  background: transparent !important;
}
