arc-zen-firefox.css

/* ─── floating navbar, hidden by default ─── */
#nav-bar {
  opacity: 0;
  pointer-events: none;
  position: fixed !important;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 600px;
  background: rgba(255,255,255,.95);
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.25);
  z-index: 9999;
  transition: opacity .2s ease-in-out;
}

/* show *only* while something inside has focus */
#nav-bar:focus-within {
  opacity: 1 !important;
  pointer-events: auto !important;
}

#urlbar {
  opacity: 0 !important;
}

#nav-bar:focus-within #urlbar {
  opacity: 1 !important;
  box-shadow: 0 8px 24px rgba(0,0,0,.75);
}

/* (everything else unchanged)  ────────────────────────────── */
#urlbar             { margin:4px; padding:4px !important;
                      border-radius:10px!important; background:#fff!important;
                      overflow: hidden !important;
                      width: 50% !important; left: 50% !important;
                      margin-left: -25% !important; top: 30% !important;
                    }
#nav-bar > .toolbar-items > :not(#urlbar-container) { display:none!important; }
.titlebar-buttonbox-container { display:none!important; }
#browser            { margin:6px; border-radius:8px!important; overflow:hidden;
                      background:#fff; box-shadow:0 0 4px rgba(0,0,0,.45); }
#main-window        { background:transparent!important; margin:0!important;
                      padding:0!important; border:none!important;}
#navigator-toolbox  { padding-top:0!important; }

/* ── Light-mode “sunny lime” gradient ───────────────────────────────────── */
#main-window {
  background: linear-gradient(
               135deg,        /* direction */
               #ffd76d 0%,    /* soft pastel-yellow */
               #c7ff6b 50%,   /* citron-lime midpoint */
               #49d16d 100%   /* fresh green finish */
             ) fixed !important;

  /* maintain window chrome reset */
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

/* ── Dark-mode override (unchanged) ─────────────────────────────────────── */
@media (prefers-color-scheme: dark) {
  #main-window {
    background: radial-gradient(
                 circle at 30% 30%,
                 #10151e 0%,
                 #091527 40%,
                 #00101f 100%
               ) fixed !important;
  }
}

/* ── 1. Everything outside content becomes a drag handle ──────────────── */
#main-window, #TabsToolbar {
  -moz-window-dragging: drag; /* let user drag the window from blank areas */
}

#nav-bar, #browser {
  -moz-window-dragging: no-drag !important;
}