/* SEIREN desktop service windows — home wallpaper remains the desktop. */
html[data-siren-home-mode="desktop"] #app-shell #seirenServiceWindows{
  position:absolute;inset:0;z-index:18;pointer-events:none;overflow:hidden;
}
html[data-siren-home-mode="mobile"] #app-shell #seirenServiceWindows{display:none!important}
#app-shell #seirenServiceWindows .siren-service-window{
  position:absolute;display:flex;flex-direction:column;pointer-events:auto;
  min-width:300px;min-height:240px;overflow:hidden;resize:none;box-sizing:border-box;
  border-radius:18px;border:1px solid rgba(232,234,238,.74);
  background:#fff;
  box-shadow:0 12px 42px rgba(7,15,30,.18),0 2px 9px rgba(7,15,30,.08),
    inset 0 1px 0 rgba(255,255,255,.9);
  backdrop-filter:blur(22px) saturate(125%);
  -webkit-backdrop-filter:blur(22px) saturate(125%);
  transition:border-color .18s ease,box-shadow .18s ease;
  outline:none;
}
/* Eight resize handles: corners on two axes, sides on one axis. */
#app-shell #seirenServiceWindows .siren-service-resize-handle{
  position:absolute;z-index:4;width:20px;height:20px;
  display:block;touch-action:none;user-select:none;
  -webkit-user-select:none;opacity:.55;
  background:transparent;
}
#app-shell #seirenServiceWindows .siren-service-resize-handle:is(:hover,:focus-visible){
  opacity:1;
  outline:0;
}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-nw{
  left:0;top:0;cursor:nwse-resize;
}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-ne{
  right:0;top:0;cursor:nesw-resize;
}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-sw{
  left:0;bottom:0;cursor:nesw-resize;
}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-se{
  right:0;bottom:0;cursor:nwse-resize;
}
/* Edge hit areas exclude the corners and sit above the iframe/titlebar. */
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-w,
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-e{
  top:20px;bottom:20px;height:auto;width:8px;cursor:ew-resize;
}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-w{left:0}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-e{right:0}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-n,
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-s{
  left:20px;right:20px;width:auto;height:8px;cursor:ns-resize;
}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-n{top:0}
#app-shell #seirenServiceWindows .siren-service-resize-handle.is-s{bottom:0}
#app-shell #seirenServiceWindows .siren-service-window.is-maximized .siren-service-resize-handle{
  display:none!important;
}
#app-shell #seirenServiceWindows .siren-service-window.is-resizing .siren-service-frame{
  pointer-events:none!important;
}

#app-shell #seirenServiceWindows .siren-service-window.is-active{
  border-color:rgba(245,246,248,.93);
  box-shadow:0 24px 76px rgba(7,15,30,.33),0 4px 18px rgba(7,15,30,.11),
    0 0 0 1px rgba(255,255,255,.20),inset 0 1px 0 rgba(255,255,255,.94);
}
#app-shell #seirenServiceWindows .siren-service-window[hidden]{display:none!important}
#app-shell #seirenServiceWindows .siren-service-window.is-maximized{
  left:16px!important;top:40px!important; /* 32px menu bar + 8px clearance */
  width:calc(100% - 32px)!important;height:calc(100% - 146px)!important; /* preserve 106px Dock clearance */
  max-width:none!important;max-height:none!important;resize:none!important;
}
#app-shell #seirenServiceWindows .siren-service-titlebar{
  display:grid;grid-template-columns:100px minmax(0,1fr) 100px;
  flex:0 0 43px;align-items:center;gap:8px;padding:0 13px;
  background:linear-gradient(180deg,#FAFAFB 0%,#FFFFFF 100%)!important;
  border-bottom:0!important;
  box-shadow:none!important;
  color:#30343a!important;cursor:grab;user-select:none;touch-action:none;
}
#app-shell #seirenServiceWindows .siren-service-titlebar:active{cursor:grabbing}
/* Centered window identity remains readable when the window narrows. */
#app-shell #seirenServiceWindows .siren-service-titlebar .siren-service-window-identity{
  overflow:hidden;white-space:nowrap;
}
#app-shell #seirenServiceWindows .siren-service-titlebar .siren-service-window-identity span{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}
#app-shell #seirenServiceWindows .siren-service-titlebar .siren-service-titlebar-spacer{min-width:0}
/* Native-sized macOS traffic lights: exact hues, muted inactive window,
   no exaggerated zoom; reveal small controls on hover. */
#app-shell #seirenServiceWindows .siren-service-window-controls{display:flex;align-items:center;gap:8px}
#app-shell #seirenServiceWindows button.siren-service-control{
  position:relative;width:12px;height:12px;min-width:12px;min-height:12px;
  padding:0;border:1px solid rgba(80,85,94,.14);border-radius:50%;
  box-sizing:border-box;background:#d7d8db;
  cursor:pointer;transition:background-color .13s ease,border-color .13s ease;
  -webkit-appearance:none;appearance:none;
}
#app-shell #seirenServiceWindows .siren-service-window.is-active .is-close{background:#ff5f57;border-color:#e24b46}
#app-shell #seirenServiceWindows .siren-service-window.is-active .is-minimize{background:#febc2e;border-color:#dca62c}
#app-shell #seirenServiceWindows .siren-service-window.is-active .is-maximize{background:#28c840;border-color:#20ab36}
#app-shell #seirenServiceWindows .siren-service-window-controls:hover button.siren-service-control::after{
  position:absolute;inset:0;display:grid;place-items:center;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:9px;line-height:10px;font-weight:800;color:rgba(28,37,42,.72);
}
#app-shell #seirenServiceWindows .siren-service-window-controls:hover .is-close::after{content:"×"}
#app-shell #seirenServiceWindows .siren-service-window-controls:hover .is-minimize::after{content:"−"}
#app-shell #seirenServiceWindows .siren-service-window-controls:hover .is-maximize::after{content:"+"}
#app-shell #seirenServiceWindows button.siren-service-control:focus-visible{
  outline:2px solid #1677dc;outline-offset:3px;
}
#app-shell #seirenServiceWindows .siren-service-window-identity{
  display:flex;align-items:center;justify-content:center;gap:8px;
  min-width:0;font:650 12px/1.2 -apple-system,BlinkMacSystemFont,"Noto Sans KR",sans-serif;
  letter-spacing:-.01em;
}
#app-shell #seirenServiceWindows .siren-service-window-identity img{
  width:19px;height:19px;flex:0 0 19px;object-fit:contain;
}
#app-shell #seirenServiceWindows iframe.siren-service-frame{
  display:block;flex:1 1 auto;width:100%;height:100%;min-height:0;
  border:0;background:#fff;
}
/* macOS Dock running marker belongs to the ICON frame (not the wider app
   anchor). The frame and the icon share exactly the same width and center. */
html[data-siren-home-mode="desktop"] #app-shell #home-top .service-grid a.service-card > .siren-dock-icon-frame{
  display:block!important;position:relative!important;align-self:center!important;
  flex:0 0 var(--dock-icon-size)!important;
  width:var(--dock-icon-size)!important;height:var(--dock-icon-size)!important;
  min-width:var(--dock-icon-size)!important;min-height:var(--dock-icon-size)!important;
  box-sizing:border-box!important;line-height:0!important;
  overflow:visible!important;
}
html[data-siren-home-mode="desktop"] #app-shell #home-top .service-grid a.service-card[data-siren-running="true"] > .siren-dock-icon-frame::after{
  content:""!important;display:block!important;position:absolute!important;
  width:4px!important;height:4px!important;
  left:50%!important;transform:translateX(-50%)!important;
  bottom:-8px!important;border-radius:50%!important;
  background:rgba(245,248,255,.92)!important;
  box-shadow:none!important;z-index:3!important;
  pointer-events:none!important;
}
html[data-siren-home-mode="desktop"] #app-shell #home-top .service-grid a.service-card[data-siren-minimized="true"] > .siren-dock-icon-frame::after{
  background:rgba(200,211,228,.78)!important;
}
/* Keep the pre-existing service-card pseudo element from drawing a second dot. */
html[data-siren-home-mode="desktop"] #app-shell #home-top .service-grid a.service-card[data-siren-running="true"]::after{
  content:none!important;display:none!important;
}
/* Mobile uses the existing direct-child icon layout without running indicators. */
html[data-siren-home-mode="mobile"] #app-shell #home-top .service-grid a.service-card > .siren-dock-icon-frame{
  display:contents!important;
}

@media(prefers-reduced-motion:reduce){
  #app-shell #seirenServiceWindows button.siren-service-control{transition:none}
}

/* Common macOS window chrome now applies to all eight services.
   Each embedded service retains its independently styled content. */
@media(prefers-reduced-motion:reduce){
  #app-shell #seirenServiceWindows .siren-service-window{transition:none}
}

/* SEIREN macOS desktop header — Golden Gate transparent menu bar.
   Removed View and Window menus have no styles. Keep Dock, widgets, service windows,
   and mobile header unchanged; hidden action buttons remain for real commands. */
#app-shell .seiren-home-header-actions{display:none!important}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header{
  --siren-gg-ink:rgba(250,250,252,.97);
  --siren-gg-highlight:rgba(246,247,251,.19);
  --siren-gg-menu-surface:linear-gradient(165deg,rgba(249,250,252,.83) 0%,rgba(225,229,236,.79) 52%,rgba(209,215,224,.77) 100%);
  --siren-gg-menu-border:rgba(255,255,255,.57);
  --siren-gg-menu-shadow:0 15px 36px rgba(10,17,31,.22),0 3px 9px rgba(10,17,31,.09),inset 0 1px 0 rgba(255,255,255,.60);
  position:absolute!important;top:0!important;left:0!important;right:0!important;
  display:flex!important;flex-direction:row!important;align-items:center!important;
  justify-content:space-between!important;gap:7px!important;
  width:100%!important;height:32px!important;min-height:32px!important;
  padding:0 13px!important;margin:0!important;box-sizing:border-box!important;
  z-index:24!important;
  background:transparent!important;border:0!important;box-shadow:none!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"][data-siren-logo-contrast="dark"] #app-shell .home-header{
  --siren-gg-ink:rgba(28,30,35,.95);
  --siren-gg-highlight:rgba(30,37,48,.095);
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .home-logo{
  display:inline-flex!important;align-items:center!important;justify-content:flex-start!important;
  flex:0 0 auto!important;width:clamp(88px,8vw,110px)!important;max-width:110px!important;
  height:28px!important;min-height:0!important;padding:0!important;margin:0!important;
  translate:0 0!important;transform:none!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .home-logo .siren-brand-logo{
  display:block!important;width:100%!important;height:auto!important;
  max-height:25px!important;object-fit:contain!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .home-logo .siren-brand-logo--navy{display:none!important;}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"][data-siren-logo-contrast="dark"] #app-shell .home-header .home-logo .siren-brand-logo--white{display:none!important;}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"][data-siren-logo-contrast="dark"] #app-shell .home-header .home-logo .siren-brand-logo--navy{display:block!important;}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #seirenHomeHeaderActions{display:none!important;}
/* Golden Gate status area: only functional Control Center and local clock. */
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacStatusArea{
  position:relative!important;display:flex!important;align-items:center!important;
  flex:0 0 auto!important;align-self:center!important;
  margin-left:auto!important;gap:0!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterTrigger{
  appearance:none!important;display:flex!important;align-items:center!important;justify-content:center!important;
  width:30px!important;height:27px!important;min-width:30px!important;min-height:27px!important;
  padding:0!important;border:0!important;border-radius:6px!important;
  color:var(--siren-gg-ink)!important;background:transparent!important;
  box-shadow:none!important;cursor:default!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterTrigger:is(:hover,[aria-expanded="true"]){
  color:var(--siren-gg-ink)!important;background:var(--siren-gg-highlight)!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterTrigger svg{display:block;width:17px;height:17px;pointer-events:none;}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterTrigger:focus-visible{
  outline:2px solid rgba(45,117,217,.80)!important;outline-offset:1px!important;
}
/* macOS 27 Golden Gate: menu-only refinement; reduced visual noise. */
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterMenu:not([hidden]){
  position:absolute!important;top:calc(100% + 3px)!important;left:auto!important;right:-4px!important;
  z-index:90!important;display:flex!important;flex-direction:column!important;gap:2px!important;
  min-width:210px!important;max-width:min(255px,calc(100vw - 16px))!important;
  padding:6px!important;box-sizing:border-box!important;
  border:1px solid var(--siren-gg-menu-border)!important;border-radius:12px!important;
  background:var(--siren-gg-menu-surface)!important;color:#24262b!important;
  box-shadow:var(--siren-gg-menu-shadow)!important;
  backdrop-filter:blur(32px) saturate(135%) brightness(1.03)!important;
  -webkit-backdrop-filter:blur(32px) saturate(135%) brightness(1.03)!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterMenu[hidden]{display:none!important;}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterMenu button{
  appearance:none!important;border:0!important;border-radius:6px!important;
  width:100%!important;padding:7px 12px!important;min-height:30px!important;
  text-align:left!important;white-space:nowrap!important;
  background:transparent!important;color:#24262b!important;
  font:500 12px/1.35 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif!important;
  cursor:default!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterMenu button:is(:hover,:focus-visible){
  background:rgba(17,111,225,.94)!important;color:#fff!important;outline:none!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterMenu button:disabled{opacity:.57!important;cursor:default!important;}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-control-label{
  padding:5px 10px 6px!important;color:#686d77!important;
  font:600 11px/1.3 -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .siren-macos-menu-clock{
  flex:0 0 auto!important;white-space:nowrap!important;color:var(--siren-gg-ink)!important;
  font:600 11px/28px -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif!important;
  font-variant-numeric:tabular-nums!important;
}
html[data-siren-home-mode="mobile"] #app-shell :is(#sirenMacStatusArea,.siren-macos-menu-clock){display:none!important;}
@media(max-width:700px){
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .siren-macos-clock-date{display:none!important;}
}
@media(prefers-reduced-transparency:reduce){
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterMenu:not([hidden]){
    background:#f4f5f7!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  }
}

/* macOS desktop menubar: active service, visible seconds, adaptive spacing.
   The approved 32px transparent bar, Dock and window chrome stay unchanged. */
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacActiveApp{
  display:block!important;min-width:0!important;max-width:min(19vw,185px)!important;
  flex:0 1 auto!important;margin-left:5px!important;margin-right:6px!important;
  overflow:hidden!important;text-overflow:ellipsis!important;white-space:nowrap!important;
  color:var(--siren-gg-ink)!important;
  font:650 13px/28px -apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",sans-serif!important;
  letter-spacing:-.015em!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-menu-clock{
  display:inline-flex!important;align-items:center!important;justify-content:flex-end!important;
  min-width:0!important;gap:8px!important;margin-left:6px!important;
  line-height:28px!important;font-size:11px!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-clock-date{
  white-space:nowrap!important;flex:0 0 auto!important;font-weight:500!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-clock-time{
  white-space:nowrap!important;flex:0 0 auto!important;
  font-weight:650!important;font-variant-numeric:tabular-nums!important;
  font-feature-settings:"tnum" 1!important;
}
html[data-siren-home-mode="mobile"] #app-shell #sirenMacActiveApp{display:none!important;}
/* Quick actions keep real click handlers; icons are deliberately subdued. */
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-control-menu button{
  display:flex!important;align-items:center!important;gap:9px!important;
  min-height:34px!important;padding:7px 10px!important;
  font-size:12px!important;line-height:19px!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-control-icon{
  display:block!important;flex:0 0 16px!important;width:16px!important;height:16px!important;
  opacity:.82!important;stroke-linecap:round!important;stroke-linejoin:round!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-control-label{
  margin:0 4px 3px!important;padding:7px 7px 9px!important;
  border-bottom:1px solid rgba(100,112,132,.15)!important;
  letter-spacing:-.01em!important;
}
html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-control-menu{
  border-radius:13px!important;padding:6px!important;
}
/* Keep the live HH:MM:SS legible even when space requires omitting the date. */
@media(max-width:900px){
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-clock-date{
    display:none!important;
  }
}
@media(max-width:560px){
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header{
    padding-inline:9px!important;gap:5px!important;
  }
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .home-logo{
    width:clamp(62px,16vw,82px)!important;max-width:82px!important;
  }
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacActiveApp{
    max-width:calc(100vw - 205px)!important;margin:0 1px!important;font-size:12px!important;
  }
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .siren-macos-menu-clock{
    margin-left:2px!important;gap:0!important;font-size:10.5px!important;
  }
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacControlCenterTrigger{
    width:27px!important;min-width:27px!important;
  }
}
@media(max-width:365px){
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header .home-logo{
    width:58px!important;max-width:58px!important;
  }
  html[data-siren-layout="fluid"][data-siren-home-mode="desktop"] #app-shell .home-header #sirenMacActiveApp{
    max-width:65px!important;font-size:11px!important;
  }
}
