/* AAGearUP programos puslapių (pradžia, nustatymai) bendras stiklo stilius */
:root {
  --text: #FFFFFF; --muted: #B8C0CC;
  --glass: linear-gradient(140deg, rgba(255,255,255,.11), rgba(255,255,255,.04));
  --edge: rgba(255, 255, 255, .16);
  --amber: #F2C46A;
  /* Temos spalvos (R,G,B, kad būtų galima keisti permatomumą):
     --p pagrindinis švytėjimas, --s antrinis, --t trečias, --accent šviesus akcentas tekstui */
  --p: 254,22,5; --s: 26,124,255; --t: 122,70,255; --accent: #8CC8FF;
  --orbit1: 140,200,255; --orbit2: 255,120,110;
  --btn: linear-gradient(120deg, #FF2A14, #E00000 50%, #8A3BFF);
}
/* Kitos temos: tas pats dizainas, tik kitos spalvos (pasirenkama nustatymuose) */
:root[data-theme="blue"] { --p: 26,124,255; --s: 34,211,238; --t: 99,102,241; --accent: #9AD8FF;
  --orbit1: 120,210,255; --orbit2: 130,150,255; --btn: linear-gradient(120deg, #2F8BFF, #0050DC 50%, #6366F1); }
:root[data-theme="green"] { --p: 16,185,129; --s: 20,184,166; --t: 14,165,233; --accent: #8EF0CF;
  --orbit1: 140,240,210; --orbit2: 120,210,240; --btn: linear-gradient(120deg, #19C98E, #047857 50%, #0E8FBF); }
:root[data-theme="violet"] { --p: 168,85,247; --s: 236,72,153; --t: 99,102,241; --accent: #D7B8FF;
  --orbit1: 210,180,255; --orbit2: 255,140,200; --btn: linear-gradient(120deg, #B460FF, #6D28D9 50%, #DB2777); }
:root[data-theme="orange"] { --p: 249,115,22; --s: 245,158,11; --t: 239,68,68; --accent: #FFD08A;
  --orbit1: 255,200,140; --orbit2: 255,150,110; --btn: linear-gradient(120deg, #FF8A2A, #C2410C 50%, #DC2626); }
:root[data-theme="graphite"] { --p: 156,163,175; --s: 100,116,139; --t: 148,163,184; --accent: #D1D5DB;
  --orbit1: 200,210,220; --orbit2: 180,190,200; --btn: linear-gradient(120deg, #6B7280, #374151 50%, #475569); }
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
html, body { margin: 0; min-height: 100%; color: var(--text);
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; }
/* Fonas: logotipo raudonas ir mėlynas švytėjimas, plonos „orbitos“ */
body {
  background:
    radial-gradient(circle at 10% 15%, rgba(var(--p),.42) 0, rgba(var(--p),0) 40%),
    radial-gradient(circle at 90% 95%, rgba(var(--s),.55) 0, rgba(var(--s),0) 48%),
    radial-gradient(circle at 60% 30%, rgba(var(--t),.22) 0, rgba(var(--t),0) 40%),
    #090B12;
  background-attachment: fixed;
  padding: 12px 16px 24px 86px;
  overflow-x: hidden;
}
.orbit { position: fixed; border-radius: 50%; pointer-events: none; }
.o1 { left: -15%; top: 40%; width: 95%; height: 75%; border: 2px solid rgba(var(--orbit1),.16); transform: rotate(-12deg); }
.o2 { left: 32%; top: -45%; width: 88%; height: 85%; border: 1px solid rgba(var(--orbit2),.14); transform: rotate(14deg); }
/* Be backdrop-filter: fonas yra tik gradientas, o blur sluoksnis automobilio ekrane suliedavo tekstą */
.glass { background: var(--glass); border: 1px solid var(--edge); }

/* Kairėje stiklinė juosta */
.rail { position: fixed; left: 12px; top: 12px; bottom: 12px; width: 60px; border-radius: 30px; padding: 12px 0;
  display: flex; flex-direction: column; align-items: center; gap: 10px; z-index: 2; }
.rail img { width: 40px; height: 40px; border-radius: 12px; box-shadow: 0 4px 18px rgba(var(--p),.45); }
.rail hr { width: 28px; border: 0; border-top: 1px solid var(--edge); margin: 4px 0; }
.rail button { width: 44px; height: 44px; border-radius: 22px; border: 1px solid transparent; background: transparent;
  color: var(--text); display: flex; align-items: center; justify-content: center; }
.rail .bottom { margin-top: auto; }
.rail .scale { font-size: 12px; font-weight: 800; color: var(--accent); }
.rail .az { font-size: 15px; font-weight: 800; }
.rail button:disabled { opacity: .3; }
.rail button.on { background: linear-gradient(135deg, rgba(var(--s),.85), rgba(var(--t),.75));
  border-color: rgba(var(--orbit1),.6); box-shadow: 0 0 18px rgba(var(--s),.55); }

.toast { position: fixed; left: 50%; bottom: 20px; transform: translateX(-50%); background: rgba(30,32,40,.95); color: var(--text);
  border: 1px solid var(--edge); padding: 10px 16px; border-radius: 14px; font-size: 14px; opacity: 0; transition: opacity .2s;
  pointer-events: none; z-index: 5; }
.toast.show { opacity: 1; }