/* Shared smoked glass: a light black tint, readable content, and travelling reflections. */
:root { --smoked-glass: rgba(0,0,0,.12); }
:root body :is(.retro-window,.window,.control-panel,.research-dock) {
  background-color: transparent;
}
:root body :is(#ascii-canvas,.clock-face,#botBody,.file-icon,.window-menu,.logo-status,.clock-options,.retro-title,.system-box,.retro-title button,.brand,.menu-toggle,.home-footer>span,#motionToggle,.desktop-bar,.titlebar,.status,.status-message,.title-controls button,.status button,.open-link,.taskbar,.task,.world-button,.research-brand,.research-dock,.blog-top,.journal-bar,.post-card,.file-stamp,.historical,.entry-nav,article pre,article blockquote,.menu-panel,.menu-close) {
  background-color: var(--smoked-glass);
  background-image: linear-gradient(110deg,transparent 38%,rgba(255,255,255,.04) 44%,rgba(255,255,255,.25) 50%,rgba(255,255,255,.04) 56%,transparent 62%);
  background-size: 300% 100%;
  background-repeat: no-repeat;
  -webkit-backdrop-filter: blur(.65px) saturate(110%);
  backdrop-filter: blur(.65px) saturate(110%);
  animation: smoked-glass-shimmer 9s ease-in-out infinite;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.4), inset 0 -1px 0 rgba(0,0,0,.12);
}
:root body :is(#menuPanel,.retro-title,.desktop-bar,.titlebar,.status,.blog-top,.menu-panel,.research-brand,.world-button,.research-dock) {
  background-color: rgba(0,0,0,.7);
  color: #fff;
}
:root body :is(#chatLog,#chatInput,#chatForm button,#timezone,.journal-bar input) {
  background: rgba(0,0,0,.08);
  color: #111;
  -webkit-backdrop-filter: blur(.65px);
  backdrop-filter: blur(.65px);
}
:root body .clock-options :is(label,.clock-note) { background: transparent; }
:root body .clock-options { box-shadow: inset 0 1px 0 rgba(255,255,255,.4); }
:root body .clock-options option { background: #eee; color: #111; }
:root body .analog-clock circle:first-child { fill: rgba(0,0,0,.06); }
:root body :is(.brand,.menu-toggle)::before { opacity: .12; }
:root body :is(.brand,.menu-toggle)::after { opacity: .2; }
:root body .brand img { background: transparent; mix-blend-mode: multiply; }
:root body .file-icon::after { background: rgba(0,0,0,.12); }
:root body :is(.post-card p,.post-meta,.historical,article blockquote) { color: #333; }
:root body .clock-face { animation-delay: -2s; }
:root body #botBody { animation-delay: -4s; }
:root body .post-card:nth-child(even) { animation-delay: -3s; }
@keyframes smoked-glass-shimmer {
  0%,15% { background-position: 150% 0; }
  75%,100% { background-position: -50% 0; }
}
:root body.motion-paused * { animation-play-state: paused !important; }
@media(prefers-reduced-motion:reduce) {
  :root body :is(#ascii-canvas,.clock-face,#botBody,.file-icon,.window-menu,.logo-status,.clock-options,.retro-title,.system-box,.retro-title button,.brand,.menu-toggle,.home-footer>span,#motionToggle,.desktop-bar,.titlebar,.status,.status-message,.title-controls button,.status button,.open-link,.taskbar,.task,.world-button,.research-brand,.research-dock,.blog-top,.journal-bar,.post-card,.file-stamp,.historical,.entry-nav,article pre,article blockquote,.menu-panel,.menu-close) { animation-duration: 18s; }
}
/* Keep controls readable when glass sits over dark artwork or title bars. */
:root body :is(#botToggle,.system-box,.title-controls button,.status button,.open-link,.taskbar,.task,#motionToggle) {
  background-color: rgba(0,0,0,.68);
  color: #fff;
  text-shadow: none;
}
:root body .task.is-focused { background-color: rgba(0,0,0,.85); }