/* Static Monterey-inspired wallpaper; soft glass belongs to the UI only. */
:root { color-scheme: dark; }
html { background: #7375b9; }
body { margin: 0; }
.ll-theme-root {
  background: #7375b9 url('/theme/monterey-3387821f5963.svg') center / cover fixed !important;
  color: #f1f0fa; padding-top: 22px; padding-bottom: 20px;
}
.ll-brandbar, .ll-main-shell, .ll-footer { max-width: 1120px !important; }
.ll-brandbar { margin-bottom: 15px; padding: 0 6px; }
.ll-brandbar h1 {
  background: none !important; -webkit-text-fill-color: #fff;
  color: #fff; font-size: 27px; letter-spacing: -.8px;
}
.ll-brandbar p, .ll-footer { color: #e4e1f2 !important; }
.ll-brandbar [class*="text-zinc-"] { color: #eeeafa; }
.ll-main-shell {
  background: rgba(233,235,255,.11); border: 1px solid rgba(239,241,255,.28);
  border-radius: 30px; padding: 14px;
  box-shadow: inset 0 1px rgba(255,255,255,.21), 0 20px 65px rgba(35,34,72,.15);
}
.ll-game-layout {
  display: grid !important; grid-template-columns: minmax(0,1fr);
  grid-template-areas: 'toolbar' 'stage' 'controls' 'results' 'history';
  gap: 14px !important; align-items: start;
}
.ll-game-layout > audio { display: none; }
.ll-game-layout:has(> .ll-settings) { grid-template-areas: 'toolbar' 'settings' 'stage' 'controls' 'results' 'history'; }
.ll-game-layout:has(> .ll-debug) { grid-template-areas: 'toolbar' 'debug' 'stage' 'controls' 'results' 'history'; }
.ll-game-layout:has(> .ll-settings):has(> .ll-debug) { grid-template-areas: 'toolbar' 'settings' 'debug' 'stage' 'controls' 'results' 'history'; }
.ll-toolbar, .ll-settings, .ll-debug, .ll-controls, .ll-results, .ll-history {
  background: rgba(37,43,65,.63) !important;
  border: 1px solid rgba(227,235,255,.28) !important; border-radius: 20px;
  backdrop-filter: blur(8px) !important; -webkit-backdrop-filter: blur(8px);
  box-shadow: inset 0 1px rgba(255,255,255,.075), 0 9px 24px rgba(41,38,69,.09) !important;
  min-width: 0;
}
.ll-toolbar { grid-area: toolbar; }
.ll-settings { grid-area: settings; background: rgba(43,51,74,.96) !important; }
.ll-debug { grid-area: debug; }
.ll-controls { grid-area: controls; padding: 16px; }
.ll-results { grid-area: results; padding: 20px !important; }
.ll-results > .grid > div { aspect-ratio: auto; min-height: 72px; }
.ll-results .grid [class*="md:w-18"] { width: clamp(26px,7vw,64px); height: clamp(26px,7vw,64px); }
.ll-results .grid [class*="md:w-11"] { width: clamp(18px,4vw,40px); height: clamp(18px,4vw,40px); }
.ll-results .grid [class*="md:text-2xl"] { font-size: clamp(10px,2.6vw,18px); }
.ll-results .grid [class*="sm:w-12"] { width: clamp(24px,6vw,44px); height: clamp(24px,6vw,44px); }
.ll-history { grid-area: history; }
.ll-stage-panel {
  grid-area: stage; height: 500px; min-height: 0 !important; max-height: none !important;
  aspect-ratio: auto !important; border-radius: 20px;
  background: radial-gradient(ellipse at center,rgba(158,175,212,.07),rgba(32,45,65,.13) 62%,rgba(24,36,54,.23)),rgba(27,37,56,.67) !important;
  border: 1px solid rgba(255,255,255,.3) !important;
  box-shadow: inset 0 1px rgba(255,255,255,.08) !important;
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
}
.ll-machine-canvas { height: 100%; min-height: 0 !important; }
.ll-toolbar [class*="bg-zinc-950"], .ll-toolbar [class*="bg-zinc-900"],
.ll-controls [class*="bg-zinc-900"], .ll-results [class*="bg-zinc-950"],
.ll-history [class*="bg-zinc-950"], .ll-history [class*="bg-zinc-900"],
.ll-settings [class*="bg-zinc-950"], .ll-settings [class*="bg-zinc-900"] {
  background: rgba(32,39,60,.35) !important;
  border-color: rgba(227,235,255,.17) !important;
}
.ll-presets { background: rgba(35,39,62,.6) !important; }
.ll-presets button { color: #dce1ee; }
.ll-presets button[class*="bg-gradient"], .ll-controls button[class*="bg-gradient-to-r"] {
  background: #efb541 !important; color: #211907 !important;
  border-color: rgba(255,221,137,.7) !important; box-shadow: 0 4px 12px rgba(234,174,43,.15) !important;
}
.ll-presets button:hover, .ll-toolbar button:hover { filter: brightness(1.1); }
.ll-theme-root button:focus-visible, .ll-theme-root input:focus-visible {
  outline: 2px solid #f5cc72; outline-offset: 3px;
}
.ll-toolbar [class*="text-zinc-"], .ll-controls [class*="text-zinc-"],
.ll-results [class*="text-zinc-"], .ll-history [class*="text-zinc-"],
.ll-settings [class*="text-zinc-"] { color: #d2d8e8 !important; }
.ll-controls [class*="text-zinc-100"], .ll-results [class*="text-zinc-100"],
.ll-history [class*="text-zinc-100"] { color: #f1f0fa !important; }
.ll-footer { border-color: rgba(236,235,255,.23) !important; padding: 12px 6px; }
@media (min-width: 1000px) {
  .ll-game-layout {
    grid-template-columns: minmax(0,1fr) 320px;
    grid-template-areas: 'toolbar toolbar' 'stage results' 'controls controls' 'history history';
  }
  .ll-game-layout:has(> .ll-settings) { grid-template-areas: 'toolbar toolbar' 'settings settings' 'stage results' 'controls controls' 'history history'; }
  .ll-game-layout:has(> .ll-debug) { grid-template-areas: 'toolbar toolbar' 'debug debug' 'stage results' 'controls controls' 'history history'; }
  .ll-game-layout:has(> .ll-settings):has(> .ll-debug) { grid-template-areas: 'toolbar toolbar' 'settings settings' 'debug debug' 'stage results' 'controls controls' 'history history'; }
  .ll-results { align-self: stretch; }
  .ll-results > .flex { flex-wrap: wrap; gap: 8px; }
  .ll-results > .grid > div { aspect-ratio: auto; min-height: 72px; }
  .ll-results .grid [class*="md:w-18"] { width: 38px; height: 38px; }
  .ll-results .grid [class*="md:w-11"] { width: 23px; height: 23px; }
  .ll-results .grid [class*="md:text-2xl"] { font-size: 13px; }
  .ll-results .grid [class*="sm:w-12"] { width: 30px; height: 30px; }
  .ll-results [class*="grid-cols-5"] { grid-template-columns: repeat(5,minmax(0,1fr)) !important; gap: 10px !important; }
  .ll-results [class*="grid-cols-6"] { grid-template-columns: repeat(6,minmax(0,1fr)) !important; gap: 6px !important; }
  .ll-results h2 { font-size: 15px; line-height: 1.5; }
}
@media (max-width: 640px) {
  .ll-theme-root { padding: 16px 10px; background-attachment: scroll !important; }
  .ll-main-shell { padding: 9px; border-radius: 23px; }
  .ll-brandbar h1 { font-size: 23px; }
  .ll-stage-panel { height: 440px; }
  .ll-controls { padding: 12px; }
  .ll-results { padding: 16px !important; }
}
@media (prefers-reduced-transparency: reduce) {
  .ll-main-shell { background: #7479b3; }
  .ll-toolbar, .ll-settings, .ll-debug, .ll-controls, .ll-results, .ll-history {
    background: #354058 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none;
  }
  .ll-stage-panel { background: #29384c !important; backdrop-filter: none; -webkit-backdrop-filter: none; }
}
@supports not (backdrop-filter: blur(1px)) {
  .ll-toolbar, .ll-settings, .ll-debug, .ll-controls, .ll-results, .ll-history { background: rgba(37,43,65,.9) !important; }
}
