/* ===== macOS glass skin — shared across tools (temporary) ===== */
:root{ --mac-r:16px; }
body{
  background:
    radial-gradient(1200px 720px at 10% -10%, rgba(120,150,255,.40), transparent 60%),
    radial-gradient(1000px 720px at 100% -4%, rgba(255,120,190,.32), transparent 60%),
    radial-gradient(1100px 820px at 50% 118%, rgba(90,220,200,.30), transparent 62%),
    linear-gradient(160deg,#eef1f8,#e6eaf4) !important;
  background-attachment:fixed !important;
}
:root[data-theme="dark"] body, :root:not([data-theme="light"]) body{
  background:
    radial-gradient(1200px 720px at 10% -10%, rgba(80,110,225,.34), transparent 60%),
    radial-gradient(1000px 720px at 100% -4%, rgba(205,70,150,.28), transparent 60%),
    radial-gradient(1100px 820px at 50% 118%, rgba(40,185,165,.24), transparent 62%),
    linear-gradient(160deg,#0b0e15,#070a10) !important;
}
body::before{ display:none !important; }

/* frosted glass surfaces */
.panel, .kpi, .card{
  background:rgba(255,255,255,.60) !important;
  -webkit-backdrop-filter:blur(22px) saturate(180%); backdrop-filter:blur(22px) saturate(180%);
  border:1px solid rgba(255,255,255,.55) !important;
  border-radius:var(--mac-r) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 12px 34px rgba(20,30,60,.14) !important;
}
:root[data-theme="dark"] .panel, :root[data-theme="dark"] .kpi, :root[data-theme="dark"] .card,
:root:not([data-theme="light"]) .panel, :root:not([data-theme="light"]) .kpi, :root:not([data-theme="light"]) .card{
  background:rgba(28,32,42,.55) !important;
  border:1px solid rgba(255,255,255,.10) !important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.06), 0 14px 40px rgba(0,0,0,.45) !important;
}
.panel:hover{ box-shadow:inset 0 1px 0 rgba(255,255,255,.6), 0 18px 44px rgba(20,30,60,.18) !important; }

/* translucent sticky top bar (no traffic-light dots) */
.top{
  position:sticky; top:10px; z-index:50;
  background:rgba(255,255,255,.55); -webkit-backdrop-filter:blur(20px) saturate(180%); backdrop-filter:blur(20px) saturate(180%);
  border:1px solid rgba(255,255,255,.55); border-radius:14px; box-shadow:0 10px 30px rgba(20,30,60,.12);
  padding:12px 16px !important;
}
:root[data-theme="dark"] .top, :root:not([data-theme="light"]) .top{ background:rgba(24,27,36,.58); border-color:rgba(255,255,255,.10); }

/* segmented-control tabs */
.tabs{ background:rgba(120,130,150,.16); border-radius:12px; padding:4px !important; gap:2px; -webkit-backdrop-filter:blur(10px); backdrop-filter:blur(10px); border:0 !important }
.tab{ border-radius:9px !important; border:0 !important; }
.tab.active,.tab.on,.tab.sel,.tab[aria-selected="true"]{ background:rgba(255,255,255,.92) !important; box-shadow:0 2px 8px rgba(20,30,60,.16) !important; }
:root[data-theme="dark"] .tab.active, :root[data-theme="dark"] .tab.on, :root:not([data-theme="light"]) .tab.active{ background:rgba(64,70,86,.92) !important; }

/* rounded macOS controls */
input, select, button, .btn, .pill, .tag{ border-radius:10px !important; }
.rev-in{ border-radius:8px !important; }