/* TSAGA_KALTSOU ΟΙΚΟΝΟΜΙΚΑ — macOS style */
:root {
  --fs: 1;
  --font: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI Variable Text", "Segoe UI", system-ui, sans-serif;
  --radius: 12px;
  --green: #28a745; --red: #ff3b30; --orange: #ff9500; --yellow: #ffcc00;
  --v: #0a84ff; --x: #e0467c; /* χρώματα Βαγγέλη / Χριστίνας */
}
[data-theme="white"] {
  --bg: #f5f5f7; --surface: #ffffff; --surface2: #f2f2f5; --sidebar: rgba(232,232,237,.92);
  --text: #1d1d1f; --text2: #6e6e73; --text3: #aeaeb2; --border: rgba(0,0,0,.09);
  --accent: #007aff; --on-accent: #fff; --accent-soft: rgba(0,122,255,.12);
  --shadow: 0 1px 2px rgba(0,0,0,.05), 0 8px 24px rgba(0,0,0,.06);
  --win-shadow: 0 30px 80px rgba(0,0,0,.28), 0 0 0 .5px rgba(0,0,0,.2);
  color-scheme: light;
}
[data-theme="rose"] {
  --bg: #fdf1f6; --surface: #ffffff; --surface2: #fce7f0; --sidebar: rgba(250,221,234,.92);
  --text: #3a1627; --text2: #8a5a70; --text3: #c9a3b4; --border: rgba(120,20,70,.11);
  --accent: #e0467c; --on-accent: #fff; --accent-soft: rgba(224,70,124,.13);
  --shadow: 0 1px 2px rgba(120,20,70,.06), 0 8px 24px rgba(224,70,124,.08);
  --win-shadow: 0 30px 80px rgba(90,10,50,.28), 0 0 0 .5px rgba(90,10,50,.2);
  color-scheme: light;
}
[data-theme="black"] {
  --bg: #0c0c0e; --surface: #1a1a1d; --surface2: #232327; --sidebar: rgba(20,20,23,.94);
  --text: #f5f5f7; --text2: #a1a1a6; --text3: #636366; --border: rgba(255,255,255,.09);
  --accent: #f5f5f7; --on-accent: #111; --accent-soft: rgba(255,255,255,.1);
  --shadow: 0 0 0 .5px rgba(255,255,255,.06);
  --win-shadow: 0 30px 80px rgba(0,0,0,.7), 0 0 0 .5px rgba(255,255,255,.14);
  --green: #32d74b; --red: #ff453a; --orange: #ff9f0a;
  color-scheme: dark;
}
[data-theme="blue"] {
  --bg: #0b1730; --surface: #13254a; --surface2: #1a2f5a; --sidebar: rgba(9,19,40,.94);
  --text: #eaf2ff; --text2: #9fb4d8; --text3: #5f769d; --border: rgba(160,200,255,.12);
  --accent: #4da3ff; --on-accent: #06142c; --accent-soft: rgba(77,163,255,.16);
  --shadow: 0 0 0 .5px rgba(160,200,255,.08);
  --win-shadow: 0 30px 80px rgba(0,0,0,.6), 0 0 0 .5px rgba(160,200,255,.2);
  --green: #32d74b; --red: #ff5a52; --orange: #ffa53a;
  color-scheme: dark;
}
[data-theme="lavender"] {
  --bg: #f5f2fd; --surface: #ffffff; --surface2: #ede7fb; --sidebar: rgba(233,225,251,.92);
  --text: #2a1f47; --text2: #6f6590; --text3: #b3aacb; --border: rgba(60,30,140,.1);
  --accent: #7c5cff; --on-accent: #fff; --accent-soft: rgba(124,92,255,.13);
  --shadow: 0 1px 2px rgba(60,30,140,.05), 0 8px 24px rgba(124,92,255,.08);
  --win-shadow: 0 30px 80px rgba(40,20,90,.28), 0 0 0 .5px rgba(40,20,90,.2);
  color-scheme: light;
}
[data-theme="mint"] {
  --bg: #eff8f4; --surface: #ffffff; --surface2: #e2f2ea; --sidebar: rgba(220,240,230,.92);
  --text: #14332a; --text2: #587a6d; --text3: #a3bfb4; --border: rgba(10,80,50,.1);
  --accent: #1f9d6e; --on-accent: #fff; --accent-soft: rgba(31,157,110,.13);
  --shadow: 0 1px 2px rgba(10,80,50,.05), 0 8px 24px rgba(31,157,110,.08);
  --win-shadow: 0 30px 80px rgba(5,50,30,.26), 0 0 0 .5px rgba(5,50,30,.2);
  color-scheme: light;
}
[data-theme="peach"] {
  --bg: #fff4ee; --surface: #ffffff; --surface2: #ffe9dd; --sidebar: rgba(255,228,212,.92);
  --text: #3d2216; --text2: #8c6453; --text3: #cfae9f; --border: rgba(140,60,20,.1);
  --accent: #f26b3a; --on-accent: #fff; --accent-soft: rgba(242,107,58,.13);
  --shadow: 0 1px 2px rgba(140,60,20,.05), 0 8px 24px rgba(242,107,58,.08);
  --win-shadow: 0 30px 80px rgba(90,35,10,.26), 0 0 0 .5px rgba(90,35,10,.2);
  color-scheme: light;
}
[data-theme="teal"] {
  --bg: #eef7f7; --surface: #ffffff; --surface2: #dff0f0; --sidebar: rgba(214,236,236,.92);
  --text: #103236; --text2: #557a7e; --text3: #9fbfc1; --border: rgba(0,90,95,.11);
  --accent: #0f8a8f; --on-accent: #fff; --accent-soft: rgba(15,138,143,.13);
  --shadow: 0 1px 2px rgba(0,90,95,.05), 0 8px 24px rgba(15,138,143,.08);
  --win-shadow: 0 30px 80px rgba(0,50,55,.26), 0 0 0 .5px rgba(0,50,55,.2);
  color-scheme: light;
}
[data-theme="wine"] {
  --bg: #1a0d12; --surface: #29141c; --surface2: #341b25; --sidebar: rgba(22,10,15,.94);
  --text: #fbeef2; --text2: #c9a2b0; --text3: #7d5566; --border: rgba(255,190,210,.1);
  --accent: #ff5c8a; --on-accent: #1a0d12; --accent-soft: rgba(255,92,138,.16);
  --shadow: 0 0 0 .5px rgba(255,190,210,.07);
  --win-shadow: 0 30px 80px rgba(0,0,0,.65), 0 0 0 .5px rgba(255,190,210,.16);
  --green: #3ddc84; --red: #ff6b6b; --orange: #ffa94d;
  color-scheme: dark;
}
[data-theme="forest"] {
  --bg: #0c1712; --surface: #14241c; --surface2: #1b2f25; --sidebar: rgba(9,18,14,.94);
  --text: #eaf6ef; --text2: #9dbdab; --text3: #5b7a69; --border: rgba(180,240,200,.1);
  --accent: #4ade80; --on-accent: #06140c; --accent-soft: rgba(74,222,128,.15);
  --shadow: 0 0 0 .5px rgba(180,240,200,.07);
  --win-shadow: 0 30px 80px rgba(0,0,0,.65), 0 0 0 .5px rgba(180,240,200,.16);
  --green: #4ade80; --red: #ff6b6b; --orange: #ffb454;
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { font-size: calc(14px * var(--fs)); }
body { margin: 0; font-family: var(--font); background: var(--bg); color: var(--text);
  -webkit-font-smoothing: antialiased; line-height: 1.4; overflow: hidden; height: 100vh; }
button, input, select, textarea { font: inherit; color: inherit; }
.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--text2); } .faint { color: var(--text3); }
.pos { color: var(--green); } .neg { color: var(--red); }

/* ── Shell ── */
.app { display: grid; grid-template-columns: 236px 1fr; height: 100vh; }
.sidebar { background: var(--sidebar); backdrop-filter: blur(30px) saturate(1.6); -webkit-backdrop-filter: blur(30px) saturate(1.6);
  border-right: 1px solid var(--border); display: flex; flex-direction: column; padding: 14px 10px; overflow-y: auto; }
.vt-native .sidebar { padding-top: 40px; background: transparent; }
.brand { display: flex; align-items: center; gap: 10px; padding: 4px 8px 14px; }
.brand svg { width: 38px; height: 38px; flex: none; filter: drop-shadow(0 3px 8px rgba(0,0,0,.18)); }
.brand b { display: block; font-size: .78rem; letter-spacing: .02em; line-height: 1.15; }
.brand small { display: block; font-size: .72rem; color: var(--text2); font-weight: 600; letter-spacing: .12em; }
.nav-group { font-size: .7rem; font-weight: 600; color: var(--text3); text-transform: uppercase; letter-spacing: .06em; padding: 12px 10px 4px; }
.nav a { display: flex; align-items: center; gap: 9px; padding: 6px 10px; border-radius: 7px; color: var(--text);
  text-decoration: none; font-size: .93rem; cursor: pointer; user-select: none; }
.nav a:hover { background: var(--accent-soft); }
.nav a.on { background: var(--accent); color: var(--on-accent); }
.nav a .ic { width: 20px; text-align: center; font-size: 1rem; }
.nav a .badge { margin-left: auto; font-size: .7rem; background: var(--red); color: #fff; border-radius: 10px; padding: 0 6px; font-weight: 600; }
.nav a.on .badge { background: var(--on-accent); color: var(--accent); }
.side-foot { margin-top: auto; padding: 10px 8px 0; font-size: .75rem; color: var(--text2); }
.presence { display: flex; flex-direction: column; gap: 5px; margin-bottom: 10px; }
.presence span { display: flex; align-items: center; gap: 6px; }
.dot { width: 8px; height: 8px; border-radius: 50%; background: var(--text3); display: inline-block; }
.dot.on { background: var(--green); box-shadow: 0 0 0 3px rgba(40,167,69,.2); }

.main { display: flex; flex-direction: column; min-width: 0; height: 100vh; }
.toolbar { display: flex; align-items: center; gap: 10px; padding: 12px 22px; border-bottom: 1px solid var(--border);
  background: var(--bg); position: relative; z-index: 2; min-height: 56px; flex-wrap: wrap; }
.vt-native .toolbar { padding-top: 14px; }
.toolbar h1 { font-size: 1.25rem; margin: 0; font-weight: 700; letter-spacing: -.01em; }
.toolbar .sp { flex: 1; }
.content { flex: 1; overflow-y: auto; padding: 20px 22px 60px; }

/* ── Controls ── */
.btn { border: 1px solid var(--border); background: var(--surface); padding: 5px 12px; border-radius: 7px; cursor: pointer;
  font-size: .9rem; display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; box-shadow: 0 .5px 1px rgba(0,0,0,.05); }
.btn:hover { filter: brightness(.97); }
.btn.primary { background: var(--accent); color: var(--on-accent); border-color: transparent; font-weight: 600; }
.btn.danger { color: var(--red); }
.btn.danger.solid { background: var(--red); color: #fff; border-color: transparent; }
.btn.sm { padding: 3px 9px; font-size: .82rem; }
.btn.icon { padding: 5px 8px; }
.seg { display: inline-flex; background: var(--surface2); border-radius: 8px; padding: 2px; border: 1px solid var(--border); }
.seg button { border: 0; background: transparent; padding: 4px 12px; border-radius: 6px; cursor: pointer; font-size: .86rem; }
.seg button.on { background: var(--surface); box-shadow: 0 1px 3px rgba(0,0,0,.15); font-weight: 600; }
[data-theme="black"] .seg button.on, [data-theme="blue"] .seg button.on, [data-theme="wine"] .seg button.on, [data-theme="forest"] .seg button.on { background: var(--accent-soft); }
.field { display: flex; flex-direction: column; gap: 4px; margin-bottom: 12px; }
.field label { font-size: .78rem; color: var(--text2); font-weight: 600; }
.input, select.input, textarea.input { border: 1px solid var(--border); background: var(--surface); border-radius: 7px; padding: 7px 10px; width: 100%; outline: none; }
.input:focus { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }
textarea.input { resize: vertical; min-height: 70px; }
.row { display: flex; gap: 12px; } .row > * { flex: 1; min-width: 0; }
.check { display: flex; align-items: center; gap: 8px; cursor: pointer; user-select: none; }
.monthnav { display: inline-flex; align-items: center; gap: 4px; }
.monthnav b { min-width: 150px; text-align: center; font-size: 1rem; }

/* ── Cards / grid ── */
.grid { display: grid; gap: 14px; }
.g4 { grid-template-columns: repeat(4, minmax(0,1fr)); }
.g3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.g2 { grid-template-columns: repeat(2, minmax(0,1fr)); }
.card { background: var(--surface); border-radius: var(--radius); box-shadow: var(--shadow); border: 1px solid var(--border); padding: 16px; min-width: 0; }
.card h3 { margin: 0 0 10px; font-size: .95rem; display: flex; align-items: center; gap: 8px; }
.card h3 .sp { flex: 1; }
.stat .lbl { font-size: .78rem; color: var(--text2); font-weight: 600; }
.stat .val { font-size: 1.65rem; font-weight: 700; letter-spacing: -.02em; margin-top: 2px; }
.stat .sub { font-size: .78rem; color: var(--text2); margin-top: 2px; }
.section-title { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text2); font-weight: 700; margin: 22px 0 8px; display: flex; align-items: center; gap: 8px; }
.empty { text-align: center; color: var(--text3); padding: 22px; font-size: .9rem; }

/* ── Lists ── */
.list { background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); overflow: hidden; box-shadow: var(--shadow); }
.li { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-top: 1px solid var(--border); cursor: pointer; }
.li:first-child { border-top: 0; }
.li:hover { background: var(--accent-soft); }
.li .t { flex: 1; min-width: 0; }
.li .t b { font-weight: 600; display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.li .t small { color: var(--text2); font-size: .78rem; }
.li .amt { text-align: right; font-weight: 600; white-space: nowrap; }
.li .amt small { display: block; font-weight: 500; font-size: .75rem; }
.li.done .t b { color: var(--text2); }
.group-h { display: flex; align-items: center; gap: 8px; padding: 8px 14px; background: var(--surface2); font-size: .8rem; font-weight: 700; color: var(--text2); }
.group-h .sp { flex: 1; }

.tick { width: 24px; height: 24px; border-radius: 50%; border: 2px solid var(--text3); flex: none; display: grid; place-items: center;
  cursor: pointer; background: transparent; padding: 0; transition: .15s; }
.tick:hover { border-color: var(--green); }
.tick.on { background: var(--green); border-color: var(--green); color: #fff; }
.tick.part { border-color: var(--orange); background: conic-gradient(var(--orange) var(--p), transparent 0); }
.tick svg { width: 13px; height: 13px; }

.bar { height: 5px; background: var(--surface2); border-radius: 3px; overflow: hidden; margin-top: 5px; }
.bar i { display: block; height: 100%; background: var(--green); border-radius: 3px; }
.bar.warn i { background: var(--orange); }

.who { display: inline-flex; align-items: center; gap: 4px; font-size: .74rem; color: var(--text2); }
.whos { display: inline-flex; gap: 8px; align-items: center; flex-wrap: wrap; justify-content: flex-end; }
.who .wn { white-space: nowrap; }
.av { width: 18px; height: 18px; border-radius: 50%; display: inline-grid; place-items: center; color: #fff; font-size: .62rem; font-weight: 700; flex: none; }
.chip { display: inline-flex; align-items: center; gap: 4px; font-size: .72rem; padding: 1px 7px; border-radius: 10px; background: var(--surface2); color: var(--text2); font-weight: 600; }
.chip.red { background: rgba(255,59,48,.14); color: var(--red); }
.chip.green { background: rgba(40,167,69,.14); color: var(--green); }
.chip.orange { background: rgba(255,149,0,.16); color: var(--orange); }
.chip.accent { background: var(--accent-soft); color: var(--accent); }
[data-theme="black"] .chip.accent { color: var(--text); }

/* SOS */
.sos { border: 2px solid var(--red) !important; box-shadow: 0 0 0 4px rgba(255,59,48,.12); }
.li.sos { border-radius: 10px; margin: 6px; }
.sos-tag { background: var(--red); color: #fff; font-size: .66rem; font-weight: 800; padding: 1px 6px; border-radius: 5px; letter-spacing: .06em; }

/* ── Tables ── */
.tablewrap { overflow-x: auto; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow); }
table.t { border-collapse: collapse; width: 100%; font-size: .86rem; }
table.t th, table.t td { padding: 7px 10px; text-align: right; white-space: nowrap; border-bottom: 1px solid var(--border); }
table.t th:first-child, table.t td:first-child { text-align: left; position: sticky; left: 0; background: var(--surface); }
table.t thead th { font-size: .74rem; color: var(--text2); text-transform: uppercase; letter-spacing: .04em; background: var(--surface2); }
table.t thead th:first-child { background: var(--surface2); }
table.t tr.sum td { font-weight: 700; background: var(--surface2); }
table.t tr.sum td:first-child { background: var(--surface2); }
table.t tr.cat td { font-weight: 700; color: var(--accent); background: var(--accent-soft); }
[data-theme="black"] table.t tr.cat td { color: var(--text); }
table.t td.cur { background: var(--accent-soft); }

/* ── Calendar ── */
.cal { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); gap: 6px; }
.cal .dow { font-size: .72rem; color: var(--text2); font-weight: 700; text-align: center; padding-bottom: 2px; }
.cal .day { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; min-height: 96px; padding: 6px; cursor: pointer; overflow: hidden; }
.cal .day:hover { border-color: var(--accent); }
.cal .day.out { opacity: .38; }
.cal .day.today .n { background: var(--red); color: #fff; border-radius: 50%; width: 22px; height: 22px; display: inline-grid; place-items: center; }
.cal .day.sel { box-shadow: 0 0 0 2px var(--accent); }
.cal .day.hassos { border: 2px solid var(--red); }
.cal .n { font-size: .8rem; font-weight: 700; }
.cal .ev { font-size: .7rem; padding: 1px 5px; border-radius: 4px; margin-top: 3px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: var(--accent-soft); }
.cal .ev.pay { background: rgba(255,149,0,.16); }
.cal .ev.paid { background: rgba(40,167,69,.14); text-decoration: line-through; opacity: .7; }
.cal .ev.sos { background: var(--red); color: #fff; font-weight: 700; border: 0 !important; box-shadow: none !important; }
.cal .ev.done { text-decoration: line-through; opacity: .55; }
.cal .ev.visit { background: rgba(88,86,214,.16); }

/* ── Windows (μέσα στην εφαρμογή) ── */
.win-layer { position: fixed; inset: 0; background: rgba(0,0,0,.22); z-index: 50; display: grid; place-items: center; padding: 20px; animation: fade .15s; }
.win { background: var(--surface); border-radius: 12px; box-shadow: var(--win-shadow); width: min(560px, 100%); max-height: calc(100vh - 40px);
  display: flex; flex-direction: column; animation: pop .18s cubic-bezier(.2,.9,.3,1.2); }
.win.wide { width: min(860px, 100%); }
.win-bar { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--border); background: var(--surface2); border-radius: 12px 12px 0 0; }
.win-bar .title { flex: 1; text-align: center; font-weight: 600; font-size: .9rem; margin-right: 52px; }
.lights { display: flex; gap: 8px; }
.lights i { width: 13px; height: 13px; border-radius: 50%; display: block; background: #d0d0d4; }
.lights .close { background: #ff5f57; cursor: pointer; display: grid; place-items: center; color: rgba(80,0,0,.7); font-style: normal; font-size: 10px; font-weight: 900; line-height: 1; }
.lights .close:hover::after { content: "×"; }
.win-close-hint { font-size: .72rem; color: var(--text3); }
.win-body { padding: 18px; overflow-y: auto; }
.win-foot { padding: 10px 18px; border-top: 1px solid var(--border); display: flex; gap: 8px; align-items: center; font-size: .78rem; color: var(--text2); }
.win-foot .sp { flex: 1; }
.win.shake { animation: shake .35s; }
.remote-banner { background: rgba(255,149,0,.15); color: var(--orange); font-weight: 600; font-size: .8rem; padding: 7px 12px; border-radius: 7px; margin-bottom: 12px; }
@keyframes fade { from { opacity: 0; } }
@keyframes pop { from { transform: scale(.94); opacity: 0; } }
@keyframes shake { 20%,60% { transform: translateX(-7px); } 40%,80% { transform: translateX(7px); } }

.toast-wrap { position: fixed; bottom: 18px; right: 18px; z-index: 90; display: flex; flex-direction: column; gap: 8px; align-items: flex-end; }
.toast { background: var(--text); color: var(--bg); padding: 9px 14px; border-radius: 10px; font-size: .86rem; box-shadow: 0 8px 30px rgba(0,0,0,.25); animation: pop .2s; max-width: 340px; }

.chart { width: 100%; height: auto; display: block; }
.legend { display: flex; gap: 14px; font-size: .78rem; color: var(--text2); flex-wrap: wrap; }
.legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }

.docs { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px,1fr)); gap: 10px; }
.doc { border: 1px solid var(--border); border-radius: 10px; padding: 10px; background: var(--surface2); cursor: pointer; font-size: .8rem; }
.doc .pdf { font-size: 1.8rem; }
.doc b { display: block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.drop { border: 2px dashed var(--border); border-radius: 10px; padding: 16px; text-align: center; color: var(--text2); cursor: pointer; font-size: .85rem; }
.drop.over { border-color: var(--accent); background: var(--accent-soft); }

.login { position: fixed; inset: 0; display: grid; place-items: center; background: var(--bg); z-index: 100; padding: 20px; }
.login .box { width: min(380px,100%); text-align: center; }
.login svg { width: 92px; height: 92px; filter: drop-shadow(0 10px 24px rgba(0,0,0,.22)); }
.login h2 { margin: 14px 0 2px; font-size: 1.3rem; }
.who-pick { display: flex; gap: 12px; justify-content: center; margin-top: 18px; }
.who-pick button { border: 1px solid var(--border); background: var(--surface); border-radius: 14px; padding: 16px 22px; cursor: pointer; display: flex; flex-direction: column; align-items: center; gap: 8px; font-weight: 600; box-shadow: var(--shadow); }
.who-pick button .av { width: 48px; height: 48px; font-size: 1.2rem; }
.who-pick button:hover { border-color: var(--accent); }

.changelog h4 { margin: 14px 0 4px; } .changelog ul { margin: 0; padding-left: 18px; } .changelog li { margin: 2px 0; }

/* ── Φόντα (6 παραλλαγές, πάνω σε κάθε χρώμα) ── */
body { background-attachment: fixed; }
.toolbar { background: color-mix(in srgb, var(--bg) 72%, transparent); backdrop-filter: blur(18px) saturate(1.4); -webkit-backdrop-filter: blur(18px) saturate(1.4); }
html[data-bg="gradient"] body, .bgt-gradient {
  background-image: linear-gradient(165deg, color-mix(in srgb, var(--accent) 16%, transparent) 0%, transparent 48%),
                    linear-gradient(0deg, color-mix(in srgb, var(--accent) 7%, transparent) 0%, transparent 40%); }
html[data-bg="aurora"] body, .bgt-aurora {
  background-image: radial-gradient(circle at 12% 8%, rgba(255,106,162,.30), transparent 38%),
                    radial-gradient(circle at 88% 18%, rgba(180,76,255,.24), transparent 42%),
                    radial-gradient(circle at 65% 95%, rgba(47,123,255,.24), transparent 45%); }
html[data-bg="dots"] body, .bgt-dots {
  background-image: radial-gradient(color-mix(in srgb, var(--text) 16%, transparent) 1.2px, transparent 1.4px); background-size: 18px 18px; }
html[data-bg="grid"] body, .bgt-grid {
  background-image: linear-gradient(color-mix(in srgb, var(--accent) 10%, transparent) 1px, transparent 1px),
                    linear-gradient(90deg, color-mix(in srgb, var(--accent) 10%, transparent) 1px, transparent 1px); background-size: 28px 28px; }
html[data-bg="waves"] body::after, .bgt-waves::after {
  content: ""; position: fixed; left: 0; right: 0; bottom: 0; height: 42vh; z-index: -1; pointer-events: none; background: var(--accent); opacity: .13;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 400' preserveAspectRatio='none'%3E%3Cpath d='M0 140 C240 60 420 230 720 150 S1200 40 1440 130 V400 H0Z' fill='%23000'/%3E%3Cpath d='M0 250 C300 170 520 330 800 260 S1240 170 1440 240 V400 H0Z' fill='%23000' fill-opacity='.7'/%3E%3C/svg%3E") bottom / 100% 100% no-repeat;
          mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 400' preserveAspectRatio='none'%3E%3Cpath d='M0 140 C240 60 420 230 720 150 S1200 40 1440 130 V400 H0Z' fill='%23000'/%3E%3Cpath d='M0 250 C300 170 520 330 800 260 S1240 170 1440 240 V400 H0Z' fill='%23000' fill-opacity='.7'/%3E%3C/svg%3E") bottom / 100% 100% no-repeat; }
.bgt-waves { position: relative; overflow: hidden; }
.bgt-waves::after { position: absolute; height: 60%; z-index: 0; }
html[data-bg="glass"] body, .bgt-glass {
  background-image: radial-gradient(circle at 18% 22%, color-mix(in srgb, var(--accent) 38%, transparent), transparent 40%),
                    radial-gradient(circle at 82% 30%, rgba(255,106,162,.28), transparent 42%),
                    radial-gradient(circle at 50% 100%, rgba(47,123,255,.26), transparent 50%); }
html[data-bg="glass"] .card, html[data-bg="glass"] .list, html[data-bg="glass"] .tablewrap, html[data-bg="glass"] .cal .day {
  background: color-mix(in srgb, var(--surface) 62%, transparent); backdrop-filter: blur(22px) saturate(1.5); -webkit-backdrop-filter: blur(22px) saturate(1.5); }
html[data-bg="glass"] .group-h, html[data-bg="glass"] table.t td:first-child, html[data-bg="glass"] table.t thead th { background: transparent; }
html:not([data-bg="plain"]) .sidebar { background: color-mix(in srgb, var(--sidebar) 80%, transparent); }
.bgtile { width: 92px; border-radius: 12px; padding: 8px; background: var(--surface); cursor: pointer; border: 2px solid var(--border); }
.bgtile.on { border-color: var(--accent); }
.bgtile .pv { height: 52px; border-radius: 8px; background-color: var(--bg); border: 1px solid var(--border); background-attachment: scroll; }
.bgtile div:last-child { margin-top: 6px; font-weight: 600; font-size: .8rem; }

/* ══════════ Tasks — στυλ Notion ══════════ */
.nt { max-width: 1400px; }
.nt-head { display: flex; align-items: center; gap: 14px; margin: 4px 0 14px; }
.nt-icon { font-size: 2.4rem; line-height: 1; }
.nt-head h2 { margin: 0; font-size: 1.9rem; font-weight: 700; letter-spacing: -.02em; }
.nt-bar { display: flex; align-items: center; gap: 8px; border-bottom: 1px solid var(--border); padding-bottom: 6px; margin-bottom: 10px; flex-wrap: wrap; }
.nt-bar .sp { flex: 1; }
.nt-tabs { display: flex; gap: 2px; }
.nt-tabs button { border: 0; background: transparent; padding: 6px 10px; border-radius: 6px; cursor: pointer; color: var(--text2); font-size: .9rem; position: relative; }
.nt-tabs button:hover { background: var(--accent-soft); }
.nt-tabs button.on { color: var(--text); font-weight: 600; }
.nt-tabs button.on::after { content: ""; position: absolute; left: 8px; right: 8px; bottom: -7px; height: 2px; background: var(--text); border-radius: 2px; }
.nt-filter { border: 0; background: transparent; color: var(--text2); padding: 5px 9px; border-radius: 6px; cursor: pointer; font-size: .84rem; }
.nt-filter:hover { background: var(--accent-soft); }
.nt-filter.on { color: var(--accent); background: var(--accent-soft); font-weight: 600; }
[data-theme="black"] .nt-filter.on { color: var(--text); }
.nt-search { width: 180px; padding: 5px 9px; font-size: .86rem; }

.nt-tablewrap { overflow-x: auto; }
.nt-table { min-width: 1190px; font-size: .9rem; }
.nt-tr { display: grid; grid-template-columns: 38px minmax(240px, 2.4fr) 140px 150px 170px 120px minmax(140px, 1.2fr) 76px 130px; border-bottom: 1px solid var(--border); align-items: center; min-height: 40px; }
.nt-tr:not(.nt-th):hover { background: var(--accent-soft); }
.nt-th { color: var(--text2); font-size: .8rem; font-weight: 500; min-height: 34px; }
.nt-th .nt-td { border-right: 1px solid var(--border); }
.nt-td { padding: 4px 8px; min-width: 0; display: flex; align-items: center; gap: 4px; height: 100%; }
.nt-td.c-chk { justify-content: center; }
.nt-td.c-chk .tick { width: 20px; height: 20px; border-radius: 5px; }
.nt-td.c-title { position: relative; }
.nt-in { border: 0; background: transparent; width: 100%; padding: 5px 6px; border-radius: 5px; outline: none; font-size: .9rem; color: var(--text); }
.nt-in:hover { background: var(--surface2); }
.nt-in:focus { background: var(--surface); box-shadow: 0 0 0 2px var(--accent); }
.nt-title { font-weight: 600; }
.nt-open { opacity: 0; position: absolute; right: 8px; border: 1px solid var(--border); background: var(--surface); border-radius: 5px; font-size: .72rem; padding: 2px 7px; cursor: pointer; color: var(--text2); }
.nt-tr:hover .nt-open { opacity: 1; }
.nt-tr.is-done .nt-title { text-decoration: line-through; color: var(--text3); }
.nt-tr.sos { box-shadow: inset 3px 0 0 var(--red); background: rgba(255,59,48,.06); }
.nt-tr.sos .nt-td.c-title { outline: 2px solid var(--red); outline-offset: -3px; border-radius: 6px; }
.nt-pill { border: 0; border-radius: 12px; padding: 3px 10px; font-size: .8rem; font-weight: 600; cursor: pointer; appearance: none; -webkit-appearance: none; }
.st-todo { background: rgba(142,142,147,.2); color: var(--text); }
.st-doing { background: rgba(10,132,255,.18); color: #0a6fd6; }
.st-done { background: rgba(40,167,69,.18); color: #1e8a3a; }
[data-theme="black"] .st-doing, [data-theme="blue"] .st-doing, [data-theme="wine"] .st-doing, [data-theme="forest"] .st-doing { color: #6cb6ff; }
[data-theme="black"] .st-done, [data-theme="blue"] .st-done, [data-theme="wine"] .st-done, [data-theme="forest"] .st-done { color: #5fe07c; }
.nt-tag { display: inline-block; font-size: .74rem; padding: 1px 7px; border-radius: 4px; background: color-mix(in srgb, var(--tc) 18%, transparent); color: var(--tc); font-weight: 600; white-space: nowrap; margin: 1px 2px 1px 0; }
.c-tags { cursor: text; flex-wrap: wrap; overflow: hidden; }
.nt-sos { display: flex; align-items: center; gap: 4px; cursor: pointer; font-size: .72rem; font-weight: 800; color: var(--text3); }
.nt-sos:has(input:checked) { color: var(--red); }
.nt-new .nt-in { color: var(--text2); }

.nt-board { display: grid; grid-template-columns: repeat(3, minmax(260px, 1fr)); gap: 14px; align-items: start; overflow-x: auto; }
.nt-col { background: var(--surface2); border-radius: 10px; padding: 8px; min-height: 120px; border: 2px solid transparent; }
.nt-col.over { border-color: var(--accent); }
.nt-colh { display: flex; justify-content: space-between; align-items: center; padding: 4px 4px 8px; }
.nt-card { background: var(--surface); border: 1px solid var(--border); border-radius: 8px; padding: 9px 10px; margin-bottom: 8px; cursor: grab; box-shadow: 0 1px 2px rgba(0,0,0,.06); display: flex; flex-direction: column; gap: 6px; font-size: .88rem; }
.nt-card:hover { border-color: var(--accent); }
.nt-card.sos { border: 2px solid var(--red); }
.nt-card.is-done b { text-decoration: line-through; color: var(--text3); }
.nt-card.dragging, .nt-chip.dragging { opacity: .4; }
.nt-meta { display: flex; gap: 4px; flex-wrap: wrap; align-items: center; }
.nt-addcard { margin-top: 2px; }

.nt-calbar { display: flex; align-items: center; gap: 14px; margin-bottom: 10px; flex-wrap: wrap; }
.nt-calgrid { display: grid; grid-template-columns: minmax(0, 1fr) 230px; gap: 14px; align-items: start; }
.nt-cal { display: grid; grid-template-columns: repeat(7, minmax(0,1fr)); border-left: 1px solid var(--border); border-top: 1px solid var(--border); }
.nt-cal .dow { font-size: .74rem; color: var(--text2); padding: 6px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); }
.nt-day { min-height: 118px; padding: 4px; border-right: 1px solid var(--border); border-bottom: 1px solid var(--border); background: color-mix(in srgb, var(--surface) 70%, transparent); display: flex; flex-direction: column; gap: 3px; }
.nt-day.out { opacity: .45; }
.nt-day.over, .nt-undated.over { background: var(--accent-soft); box-shadow: inset 0 0 0 2px var(--accent); }
.nt-day.hassos { box-shadow: inset 0 0 0 2px var(--red); }
.nt-dayh { display: flex; justify-content: space-between; align-items: center; }
.nt-day .n { font-size: .78rem; font-weight: 600; color: var(--text2); padding: 2px 4px; }
.nt-day.today .n { background: var(--red); color: #fff; border-radius: 10px; padding: 1px 7px; }
.nt-plus { opacity: 0; border: 0; background: transparent; cursor: pointer; color: var(--text2); font-size: 1rem; line-height: 1; border-radius: 4px; padding: 0 5px; }
.nt-day:hover .nt-plus { opacity: 1; }
.nt-plus:hover { background: var(--surface2); }
.nt-chip { font-size: .76rem; padding: 3px 6px; border-radius: 5px; cursor: grab; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background: var(--surface); border: 1px solid var(--border); box-shadow: 0 1px 1px rgba(0,0,0,.05); }
.nt-chip i { font-style: normal; color: var(--text2); }
.nt-chip.st-done { text-decoration: line-through; opacity: .55; color: var(--text); }
.nt-chip.st-doing { border-left: 3px solid #0a84ff; color: var(--text); }
.nt-chip.st-todo { color: var(--text); }
.nt-chip.sos { border: 2px solid var(--red); background: rgba(255,59,48,.1); font-weight: 700; }
.nt-undated { background: var(--surface); border: 1px solid var(--border); border-radius: 10px; padding: 10px; display: flex; flex-direction: column; gap: 5px; min-height: 120px; }

.nt-rep { border: 0; background: transparent; color: var(--text3); font-size: .8rem; cursor: pointer; padding: 4px 6px; border-radius: 5px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 100%; text-align: left; }
.nt-rep:hover { background: var(--surface2); color: var(--text); }
.nt-rep.on { color: var(--accent); font-weight: 600; }
[data-theme="black"] .nt-rep.on { color: var(--text); }
.nt-tr:not(:hover) .nt-rep:not(.on) { opacity: 0; }
.nt-chip.ghost { opacity: .5; border-style: dashed; cursor: pointer; background: transparent; }
.rp { border: 1px solid var(--border); border-radius: 10px; padding: 10px; background: var(--surface2); }
.rp-presets { display: flex; flex-wrap: wrap; gap: 6px; }
.rp-presets button, .rp-days button { border: 1px solid var(--border); background: var(--surface); border-radius: 16px; padding: 4px 11px; cursor: pointer; font-size: .84rem; }
.rp-presets button.on, .rp-days button.on { background: var(--accent); color: var(--on-accent); border-color: transparent; font-weight: 600; }
.rp-custom { margin-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.rp-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .88rem; }
.rp-row > span:first-child { min-width: 86px; color: var(--text2); font-weight: 600; font-size: .8rem; }
.rp-days button { padding: 4px 9px; }
.rp-sum { font-size: .82rem; }

/* ══════════ Αρχική που στήνεται — κουτιά ══════════ */
.dash { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-auto-rows: 78px; gap: 14px; grid-auto-flow: row dense; }
.wd { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow); display: flex; flex-direction: column; min-width: 0; min-height: 0; overflow: hidden; position: relative; }
html[data-bg="glass"] .wd { background: color-mix(in srgb, var(--surface) 62%, transparent); backdrop-filter: blur(22px) saturate(1.5); -webkit-backdrop-filter: blur(22px) saturate(1.5); }
.wd.tinted { border-top: 3px solid var(--wc); }
.wd.tinted .wd-t { color: var(--wc); }
.wd-h { display: flex; align-items: center; gap: 6px; padding: 9px 12px 4px; font-size: .78rem; text-transform: uppercase; letter-spacing: .05em; color: var(--text2); flex: none; }
.wd-h .sp { flex: 1; }
.wd-t { font-weight: 700; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wd-b { flex: 1; overflow: auto; padding: 4px 12px 12px; min-height: 0; }
.list.flat { box-shadow: none; border: 0; background: transparent; }
.list.flat .li { padding: 8px 4px; }
.wd-greet { display: flex; align-items: baseline; gap: 14px; height: 100%; padding-top: 10px; flex-wrap: wrap; }
.wd-greet b { font-size: 1.5rem; letter-spacing: -.02em; }
.wd-greet span { text-transform: capitalize; }
.wd-stat .val { font-size: 1.75rem; font-weight: 700; letter-spacing: -.02em; }
.wd-stat .sub { font-size: .78rem; margin-top: 2px; }
.wd-chart { width: 100%; height: 100%; display: block; }
.wd-bar { display: grid; grid-template-columns: minmax(0, 1.2fr) 1fr auto; gap: 8px; align-items: center; font-size: .82rem; margin: 6px 0; }
.wd-bar .l { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.wd-bar .bar { margin: 0; height: 8px; }
.wd-quick { display: flex; flex-wrap: wrap; gap: 8px; padding-top: 4px; }
.wd-note { width: 100%; height: 100%; border: 0; background: color-mix(in srgb, #ffcc00 12%, transparent); border-radius: 8px; padding: 10px; resize: none; outline: none; font-size: .92rem; line-height: 1.5; }
.minical { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; text-align: center; }
.minical .dw { font-style: normal; font-size: .68rem; color: var(--text3); font-weight: 700; }
.minical .mc { border: 0; background: transparent; border-radius: 7px; padding: 4px 0 2px; cursor: pointer; font-size: .8rem; display: flex; flex-direction: column; align-items: center; min-height: 34px; }
.minical .mc:hover { background: var(--accent-soft); }
.minical .mc.today { background: var(--red); color: #fff; font-weight: 700; }
.minical .mc span { display: flex; gap: 2px; height: 6px; margin-top: 2px; }
.minical .mc b { width: 5px; height: 5px; border-radius: 50%; }
.minical b.r { background: var(--red); } .minical b.a { background: var(--accent); } .minical b.o { background: var(--orange); }
.minical .mc.today b { background: #fff; }

.dash.editing .wd { outline: 2px dashed color-mix(in srgb, var(--accent) 50%, transparent); outline-offset: -2px; }
.dash.editing .wd-b { pointer-events: none; opacity: .75; }
.wd.edit .wd-h { cursor: grab; background: var(--surface2); padding-bottom: 8px; text-transform: none; letter-spacing: 0; font-size: .86rem; }
.grip { font-size: 1rem; color: var(--text3); }
.wd-ctl { display: flex; gap: 4px; }
.wd-ctl button { border: 1px solid var(--border); background: var(--surface); border-radius: 6px; width: 24px; height: 24px; cursor: pointer; font-size: .7rem; padding: 0; color: var(--text2); }
.wd-ctl button:hover { border-color: var(--accent); }
.wd-ctl .coldot { border-radius: 50%; }
.rz { position: absolute; right: 0; bottom: 0; width: 26px; height: 26px; cursor: nwse-resize; touch-action: none; z-index: 3;
  background: linear-gradient(135deg, transparent 50%, var(--accent) 50%); border-radius: 0 0 14px 0; }
.wd-size { position: absolute; right: 30px; bottom: 5px; font-size: .7rem; color: var(--text2); background: var(--surface); border-radius: 5px; padding: 0 5px; z-index: 3; }
.wd.dragging { opacity: .4; }
.wd.resizing { box-shadow: 0 0 0 2px var(--accent), var(--shadow); }
.wd.drop-before { box-shadow: inset 4px 0 0 var(--accent); }
.wd.drop-after { box-shadow: inset -4px 0 0 var(--accent); }
.wd-add { grid-column: span 3; grid-row: span 2; border: 2px dashed var(--border); border-radius: 14px; background: transparent; cursor: pointer; color: var(--text2); font-size: .95rem; font-weight: 600; }
.wd-add:hover { border-color: var(--accent); color: var(--accent); }
.cat-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.cat-item { display: flex; justify-content: space-between; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--surface2); border-radius: 10px; padding: 12px; cursor: pointer; text-align: left; font-weight: 600; font-size: .88rem; }
.cat-item:hover { border-color: var(--accent); background: var(--accent-soft); }

/* ══════════ Κέντρο ελέγχου (αρχική με εικονίδια) ══════════ */
.toolbar[hidden] { display: none; }
html.launcher .app { grid-template-columns: 1fr; }
html.launcher .sidebar, html.launcher .tabbar { display: none; }
html.launcher .main { height: 100vh; }
.home-back { font-weight: 600; }
.launch { max-width: 1040px; margin: 0 auto; padding: 18px 0 40px; text-align: center; }
.launch-head { display: flex; flex-direction: column; align-items: center; gap: 4px; }
.launch-logo svg { width: 96px; height: 96px; filter: drop-shadow(0 12px 26px rgba(0,0,0,.25)); }
html[data-motion="fun"] .launch-logo svg { animation: floaty 4s ease-in-out infinite; }
.launch-name { font-weight: 800; letter-spacing: .04em; font-size: 1.35rem; margin-top: 8px; }
.launch-name span { color: var(--text2); font-weight: 600; letter-spacing: .22em; font-size: .9rem; margin-left: 4px; }
.launch-ver { font-size: .76rem; color: var(--text3); }
.launch-clock { color: var(--text2); font-size: .86rem; font-weight: 600; text-transform: capitalize; font-variant-numeric: tabular-nums; }
.launch-hi { font-size: 1.6rem; font-weight: 700; letter-spacing: -.02em; margin-top: 18px; }
.launch-tag { color: var(--text2); font-size: .9rem; margin: 2px 0 14px; }
.launch-chips { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-bottom: 14px; }
.lchip { border: 1px solid var(--border); background: var(--surface); border-radius: 99px; padding: 7px 14px; cursor: pointer; font-size: .86rem; box-shadow: var(--shadow); }
.lchip b { font-size: 1rem; margin-right: 3px; }
.lchip:hover { border-color: var(--accent); }
.lchip.sos { border-color: var(--red); color: var(--red); }
.launch-arr { margin-bottom: 16px; }
.larr { border: 1px solid var(--border); background: var(--surface2); color: var(--text2); border-radius: 99px; padding: 7px 16px; cursor: pointer; font-size: .84rem; }
.larr:hover { border-color: var(--accent); color: var(--accent); }
.larr.on { background: var(--accent); color: var(--on-accent); border-color: transparent; font-weight: 700; }
.launch-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 16px; text-align: left; }
.lt { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 6px; background: var(--surface); border: 1px solid var(--border);
  border-radius: 18px; padding: 22px 20px; cursor: pointer; box-shadow: var(--shadow); font: inherit; color: var(--text);
  transition: transform .18s cubic-bezier(.34,1.56,.64,1), border-color .15s, box-shadow .15s; }
html[data-bg="glass"] .lt { background: color-mix(in srgb, var(--surface) 62%, transparent); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); }
.lt:hover { border-color: var(--accent); transform: translateY(-4px); box-shadow: 0 0 0 1px var(--accent), 0 12px 30px color-mix(in srgb, var(--accent) 22%, transparent); }
.lt:active { transform: translateY(-1px) scale(.98); }
.lt-ic { font-size: 2.1rem; line-height: 1; transition: transform .22s cubic-bezier(.34,1.56,.64,1); }
.lt:hover .lt-ic { transform: scale(1.18) rotate(-6deg); }
.lt-t { font-size: 1.12rem; font-weight: 700; }
.lt-s { font-size: .8rem; color: var(--text2); line-height: 1.35; }
.lt-count { position: absolute; top: 10px; right: 10px; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 11px; background: var(--orange); color: #fff; font-size: .76rem; font-weight: 800; display: grid; place-items: center; box-shadow: 0 1px 5px rgba(0,0,0,.3); }
.lt-count.sos { background: var(--red); }
.lt-count.blue { background: #0a84ff; }
.lt-count.gray { background: var(--text3); }
.lt-mv { position: absolute; bottom: 8px; right: 8px; display: flex; gap: 4px; }
.lt-mv i { font-style: normal; border: 1px solid var(--border); background: var(--surface2); border-radius: 6px; width: 24px; height: 22px; display: grid; place-items: center; font-size: .66rem; }
.launch-grid.arranging .lt { cursor: grab; }
html[data-motion="fun"] .launch-grid.arranging .lt { animation: wiggle .38s ease-in-out infinite; }
.launch-grid.arranging .lt:nth-child(2n) { animation-delay: -.19s; }
.lt.ghost { opacity: .35; animation: none !important; }
.lt.over { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent); }
.hm-pick { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.hm { border: 2px solid var(--border); background: var(--surface); border-radius: 12px; padding: 8px; cursor: pointer; text-align: left; display: flex; flex-direction: column; gap: 3px; font: inherit; color: var(--text); }
.hm.on { border-color: var(--accent); }
.hm small { color: var(--text2); font-size: .72rem; line-height: 1.3; }
.hm-pv { height: 62px; border-radius: 8px; background: var(--bg); border: 1px solid var(--border); padding: 5px; display: grid; gap: 3px; margin-bottom: 4px; }
.hm-pv i { background: var(--accent-soft); border-radius: 3px; border: 1px solid var(--border); }
.hm-pv.dash { grid-template-columns: repeat(4, 1fr); grid-auto-rows: 10px; }
.hm-pv.launch { grid-template-columns: repeat(3, 1fr); grid-template-rows: 14px 1fr 1fr; padding: 5px 14px; }
.hm-pv.launch span { grid-column: 1 / -1; justify-self: center; width: 14px; border-radius: 4px; background: linear-gradient(135deg, #ff6aa2, #b44cff, #2f7bff); }

/* ══════════ Λογαριασμοί ══════════ */
.acc-card { cursor: pointer; transition: transform .15s, border-color .15s; }
.acc-card:hover { border-color: var(--accent); }
.acc-card.on { border: 2px solid var(--accent); }
.pay-accrow { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 4px 0 10px; font-size: .84rem; color: var(--text2); font-weight: 600; }
.pay-accs button { padding: 6px 14px; font-size: .9rem; }
.acc-sel { width: auto; max-width: 200px; padding: 3px 6px; font-size: .78rem; }
.wd-accs { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 8px; }
.wd-acc { border: 1px solid var(--border); background: var(--surface2); border-radius: 10px; padding: 8px 10px; cursor: pointer; display: flex; flex-direction: column; align-items: flex-start; gap: 2px; font: inherit; color: var(--text); }
.wd-acc:hover { border-color: var(--accent); }
.wd-acc span { font-size: .8rem; color: var(--text2); }
.wd-acc b { font-size: 1.3rem; letter-spacing: -.02em; }

/* ══════════ Ο χώρος μου ══════════ */
.space-seg button { padding: 8px 18px; font-size: .95rem; }
.info-card { padding: 6px 16px; }
.info-row { display: flex; gap: 12px; padding: 9px 0; border-top: 1px solid var(--border); font-size: .9rem; }
.info-row:first-child { border-top: 0; }
.info-row span { color: var(--text2); flex: 0 0 42%; }
.info-edit { display: grid; grid-template-columns: 1fr 1.4fr auto; gap: 6px; margin-bottom: 6px; }

/* ══════════ Παιχνίδι οικογένειας ══════════ */
.fam-scene.mini { height: 100%; min-height: 260px; border-radius: 12px; box-shadow: none; }
.wd-family3d .wd-b { padding: 0 8px 8px; display: flex; flex-direction: column; }
.wd-family3d .fam-scene.mini { flex: 1; }
.launch-scene { height: 340px; margin: 6px 0 12px; }
.launch-one { display: flex; gap: 8px; justify-content: center; margin-bottom: 14px; flex-wrap: wrap; }
.fam-hint { text-align: center; font-size: .82rem; color: var(--text2); margin-top: 8px; }
.care-top { display: flex; gap: 14px; align-items: center; }
.care-ring { width: 84px; height: 84px; flex: none; }
.care-mood { margin-top: 4px; font-weight: 600; }
.care-badges { display: flex; gap: 4px; flex-wrap: wrap; margin-top: 6px; }
.care-bars { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; margin: 12px 0 4px; }
.cb { display: grid; grid-template-columns: 20px 1fr 26px; align-items: center; gap: 6px; font-size: .8rem; }
.cb .bar { margin: 0; height: 7px; } .cb small { color: var(--text2); text-align: right; }
.care-sub { font-size: .76rem; font-weight: 700; color: var(--text2); text-transform: uppercase; letter-spacing: .05em; margin: 12px 0 6px; }
.care-grp { font-size: .74rem; color: var(--text2); font-weight: 600; margin: 8px 0 4px; }
.care-acts { display: flex; flex-wrap: wrap; gap: 6px; }
.care-moods { display: flex; gap: 6px; }
.care-moods button { border: 2px solid var(--border); background: var(--surface); border-radius: 50%; width: 40px; height: 40px; font-size: 1.3rem; cursor: pointer; transition: transform .15s; }
.care-moods button:hover { transform: scale(1.15); } .care-moods button.on { border-color: var(--accent); background: var(--accent-soft); }
.care-one { display: flex; gap: 8px; margin-top: 12px; }
.care-big { flex: 1; justify-content: center; padding: 10px 14px; font-size: .95rem; }
.care-big small { font-weight: 500; opacity: .85; }
.care-q { padding: 8px 12px; }
.care-more { margin-top: 10px; } .care-more summary { cursor: pointer; font-size: .84rem; color: var(--accent); font-weight: 600; }
[data-theme="black"] .care-more summary { color: var(--text); }
.rpg-h { display: flex; align-items: center; gap: 10px; margin-bottom: 8px; } .rpg-h .sp { flex: 1; } .rpg-h .av { width: 30px; height: 30px; font-size: .9rem; }
.rpg-title { font-size: .84rem; color: var(--accent); font-weight: 700; }
[data-theme="black"] .rpg-title { color: var(--text2); }
.rpg-total { font-weight: 800; background: var(--accent-soft); padding: 3px 10px; border-radius: 12px; }
.rpg-row { display: grid; grid-template-columns: 26px 1fr 60px; gap: 8px; align-items: center; margin: 7px 0; }
.rpg-e { font-size: 1.2rem; } .rpg-l { font-size: .82rem; } .rpg-l b { color: var(--text2); font-weight: 700; margin-left: 4px; }
.rpg-row .bar { margin-top: 3px; height: 8px; } .rpg-row small { color: var(--text3); font-size: .72rem; text-align: right; }
.pick-menu { position: fixed; z-index: 120; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--win-shadow); padding: 6px; min-width: 230px; max-height: 70vh; overflow: auto; animation: pop .18s cubic-bezier(.34,1.56,.64,1); }
.pick-menu .pm-h { display: flex; align-items: center; gap: 6px; font-weight: 700; padding: 6px 8px 8px; border-bottom: 1px solid var(--border); margin-bottom: 4px; }
.pick-menu .pm-g { font-size: .7rem; color: var(--text2); font-weight: 700; text-transform: uppercase; letter-spacing: .04em; padding: 8px 10px 2px; }
.pick-menu button { display: block; width: 100%; text-align: left; border: 0; background: transparent; padding: 7px 10px; border-radius: 8px; cursor: pointer; font: inherit; font-size: .9rem; color: var(--text); }
.pick-menu button:hover { background: var(--accent-soft); }

/* ══════════ Βοήθεια ══════════ */
.help { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 14px; }
.help-c h3 { font-size: 1.05rem; } .help-c h3 .sp { flex: 1; } .help-e { font-size: 1.4rem; }
.help-c p { margin: 0 0 6px; color: var(--text2); } .help-c ul { margin: 0; padding-left: 18px; } .help-c li { margin: 5px 0; line-height: 1.45; font-size: .9rem; }

/* ══════════ Εφέ ══════════ */
@keyframes sosPulse { 0%,100% { box-shadow: 0 0 0 0 rgba(255,59,48,.35), 0 0 6px rgba(255,59,48,.25); } 50% { box-shadow: 0 0 0 5px rgba(255,59,48,.14), 0 0 26px rgba(255,59,48,.55); } }
@keyframes sosOutline { 0%,100% { outline-color: rgba(255,59,48,.55); } 50% { outline-color: rgba(255,59,48,1); } }
@keyframes sosTag { 0%,100% { transform: scale(1) rotate(0); background: var(--red); } 25% { transform: scale(1.15) rotate(-6deg); } 50% { background: #ff9500; transform: scale(1.08) rotate(5deg); } 75% { transform: scale(1.12) rotate(-3deg); } }
@keyframes badgeBeat { 0%,100% { transform: scale(1); } 50% { transform: scale(1.22); } }
@keyframes floaty { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@keyframes wiggle { 0%,100% { transform: rotate(-1.4deg); } 50% { transform: rotate(1.4deg); } }
@keyframes wave { 0%,60%,100% { transform: rotate(0); } 10%,30% { transform: rotate(16deg); } 20%,40% { transform: rotate(-10deg); } }
@keyframes riseIn { from { opacity: 0; transform: translateY(10px) scale(.985); } }
@keyframes popIn { 0% { transform: scale(.6); } 60% { transform: scale(1.25); } 100% { transform: scale(1); } }
html[data-motion="fun"] .sos:not(.nt-tr), html[data-motion="fun"] .nt-card.sos, html[data-motion="fun"] .nt-chip.sos,
html[data-motion="fun"] .cal .day.hassos, html[data-motion="fun"] .nt-day.hassos, html[data-motion="fun"] .lt.sos, html[data-motion="fun"] .lchip.sos { animation: sosPulse 1.6s ease-in-out infinite; }
html[data-motion="fun"] .nt-tr.sos .nt-td.c-title { animation: sosOutline 1.1s ease-in-out infinite; }
html[data-motion="fun"] .sos-tag { display: inline-block; animation: sosTag 1.4s ease-in-out infinite; }
html[data-motion="fun"] .cal .ev.sos { animation: sosTag 1.4s ease-in-out infinite; transform-origin: left center; }
html[data-motion="fun"] .nav a .badge, html[data-motion="fun"] .lt-count.sos { animation: badgeBeat 1.2s ease-in-out infinite; }
html[data-motion="fun"] .wave { display: inline-block; transform-origin: 70% 70%; animation: wave 2.6s ease-in-out 1; }
html[data-motion="fun"] .content.fx-enter > * { animation: riseIn .35s cubic-bezier(.2,.9,.3,1.1) both; }
html[data-motion="fun"] .content.fx-enter .wd, html[data-motion="fun"] .content.fx-enter .lt, html[data-motion="fun"] .content.fx-enter .card { animation: riseIn .4s cubic-bezier(.2,.9,.3,1.1) both; }
html[data-motion="fun"] .content.fx-enter .wd:nth-child(2), html[data-motion="fun"] .content.fx-enter .lt:nth-child(2) { animation-delay: .04s; }
html[data-motion="fun"] .content.fx-enter .wd:nth-child(3), html[data-motion="fun"] .content.fx-enter .lt:nth-child(3) { animation-delay: .08s; }
html[data-motion="fun"] .content.fx-enter .wd:nth-child(4), html[data-motion="fun"] .content.fx-enter .lt:nth-child(4) { animation-delay: .12s; }
html[data-motion="fun"] .content.fx-enter .wd:nth-child(5), html[data-motion="fun"] .content.fx-enter .lt:nth-child(5) { animation-delay: .16s; }
html[data-motion="fun"] .content.fx-enter .wd:nth-child(n+6), html[data-motion="fun"] .content.fx-enter .lt:nth-child(n+6) { animation-delay: .2s; }
html[data-motion="fun"] .btn:active, html[data-motion="fun"] .tick:active { transform: scale(.93); }
html[data-motion="fun"] .tick { transition: transform .18s cubic-bezier(.34,1.56,.64,1), background .15s, border-color .15s; }
html[data-motion="fun"] .tick:hover { transform: scale(1.12); }
html[data-motion="fun"] .nav a:hover .ic { display: inline-block; animation: wiggle .3s ease-in-out 2; }
html[data-motion="fun"] .empty::first-line { }
.fx-pop { animation: popIn .35s cubic-bezier(.34,1.56,.64,1); }
.fx-layer { position: fixed; inset: 0; pointer-events: none; z-index: 200; overflow: hidden; }
.fx-layer i { position: absolute; width: 8px; height: 11px; border-radius: 2px; animation: confetti 1.1s cubic-bezier(.15,.7,.3,1) forwards; }
@keyframes confetti { 0% { transform: translate(-50%, -50%) rotate(0); opacity: 1; } 70% { opacity: 1; } 100% { transform: translate(calc(-50% + var(--dx)), calc(-50% + var(--dy) + 140px)) rotate(var(--r)); opacity: 0; } }
.fx-float { position: fixed; z-index: 201; pointer-events: none; font-weight: 800; font-size: 1.25rem; transform: translate(-50%, -50%); text-shadow: 0 2px 10px rgba(0,0,0,.2); animation: floatUp 1.15s cubic-bezier(.2,.8,.3,1) forwards; font-variant-numeric: tabular-nums; }
@keyframes floatUp { 0% { opacity: 0; transform: translate(-50%, -30%) scale(.6); } 20% { opacity: 1; transform: translate(-50%, -80%) scale(1.15); } 100% { opacity: 0; transform: translate(-50%, -260%) scale(1); } }
.fx-banner { position: fixed; left: 50%; top: 38%; transform: translate(-50%, -50%); z-index: 202; background: var(--surface); border-radius: 22px; padding: 22px 34px; box-shadow: var(--win-shadow);
  display: flex; flex-direction: column; align-items: center; gap: 4px; text-align: center; animation: bannerIn .55s cubic-bezier(.34,1.56,.64,1); pointer-events: none; }
.fx-banner b { font-size: 1.35rem; } .fx-banner span { color: var(--text2); }
.fx-banner .fx-emoji { font-size: 3rem; animation: wave 1.2s ease-in-out 2; }
.fx-banner.out { opacity: 0; transform: translate(-50%, -60%) scale(.9); transition: .5s; }
@keyframes bannerIn { from { opacity: 0; transform: translate(-50%, -30%) scale(.5); } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation: none !important; transition: none !important; } }

/* ══════════ Τράπεζα / Μετρητά ══════════ */
.pay-accrow { display: flex; flex-direction: column; align-items: stretch; gap: 8px; margin: 6px 0 12px; padding: 10px; border-radius: 12px; border: 1px dashed var(--border); }
.pay-accrow > span { font-size: .84rem; color: var(--text2); font-weight: 600; }
.pay-accrow em { color: var(--red); font-style: normal; font-weight: 500; }
.pay-accrow.need { border: 2px solid var(--red); background: rgba(255,59,48,.06); }
.pay-accrow.shake { animation: shake .35s; }
.pm { display: flex; flex-wrap: wrap; gap: 10px; }
.pm-grp { display: flex; gap: 6px; flex-wrap: wrap; }
.pm-btn { border: 2px solid var(--border); background: var(--surface); border-radius: 12px; padding: 8px 12px; cursor: pointer; display: grid; grid-template-columns: auto 1fr; column-gap: 8px; align-items: center; text-align: left; font: inherit; color: var(--text); min-width: 150px; }
.pm-btn span { grid-row: span 2; font-size: 1.5rem; }
.pm-btn b { font-size: .95rem; }
.pm-btn small { color: var(--text2); font-size: .74rem; }
.pm-btn:hover { border-color: var(--accent); }
.pm-btn.on { border-color: var(--accent); background: var(--accent-soft); box-shadow: 0 0 0 3px var(--accent-soft); }
.pm-btn.cash.on { border-color: var(--green); background: rgba(40,167,69,.12); box-shadow: 0 0 0 3px rgba(40,167,69,.15); }

/* ══════════ Διόρθωση μήνα ══════════ */
.rp-sum2 { display: flex; gap: 16px; flex-wrap: wrap; padding: 10px 12px; background: var(--surface2); border-radius: 10px; margin-bottom: 14px; font-size: .88rem; }
.fix { border: 1px solid var(--border); border-radius: 12px; margin-bottom: 10px; overflow: hidden; }
.fix-h { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: var(--surface2); }
.fix-h .sp { flex: 1; } .fix-ic { font-size: 1.2rem; }
.fix-items { padding: 4px 12px 8px; }
.fix-it { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 7px 0; border-top: 1px solid var(--border); font-size: .86rem; }
.fix-it:first-child { border-top: 0; }
.fix-it > span:first-child { flex: 1; min-width: 180px; }
.fix-pm { display: flex; gap: 4px; flex-wrap: wrap; }
.fix-ok { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 30px; text-align: center; }

/* ══════════ Messenger ══════════ */
.chat { display: flex; flex-direction: column; height: calc(100vh - 150px); max-width: 900px; margin: 0 auto; background: var(--surface); border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--shadow); overflow: hidden; }
.cm-list { flex: 1; overflow-y: auto; padding: 14px 16px; display: flex; flex-direction: column; gap: 2px; }
.cm-day { text-align: center; margin: 12px 0 6px; } .cm-day span { font-size: .72rem; color: var(--text2); background: var(--surface2); padding: 3px 10px; border-radius: 10px; text-transform: capitalize; }
.cm { display: flex; gap: 8px; align-items: flex-end; max-width: 78%; margin-top: 8px; }
.cm.grouped { margin-top: 2px; }
.cm.me { align-self: flex-end; flex-direction: row-reverse; }
.cm-av { width: 22px; flex: none; }
.cm-col { display: flex; flex-direction: column; min-width: 0; }
.cm.me .cm-col { align-items: flex-end; }
.cm-name { font-size: .72rem; color: var(--pc); font-weight: 700; margin: 0 10px 2px; }
.cm-bub { padding: 8px 12px; border-radius: 18px; background: var(--surface2); max-width: 100%; word-wrap: break-word; overflow-wrap: anywhere; display: flex; flex-direction: column; gap: 6px; }
.cm.me .cm-bub { background: var(--pc); color: #fff; }
.cm.me .cm-bub a { color: #fff; }
.cm.them .cm-bub { border-bottom-left-radius: 6px; } .cm.me .cm-bub { border-bottom-right-radius: 6px; }
.cm-bub.big { background: transparent !important; font-size: 2.4rem; padding: 0 4px; line-height: 1.15; }
.cm-bub.media { background: transparent !important; padding: 0; }
.cm-img, .cm-vid { max-width: min(320px, 100%); max-height: 320px; border-radius: 14px; display: block; background: var(--surface2); cursor: zoom-in; min-width: 80px; min-height: 60px; object-fit: cover; }
.cm-vid { cursor: default; }
.cm-aud { max-width: 260px; }
.cm-file { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-radius: 12px; background: rgba(255,255,255,.2); text-decoration: none; color: inherit; border: 1px solid var(--border); }
.cm-file span { font-size: 1.4rem; } .cm-file small { opacity: .7; }
.cm-meta { font-size: .68rem; color: var(--text3); margin: 2px 8px 0; display: flex; gap: 4px; align-items: center; }
.cm-meta .seen { color: var(--accent); font-weight: 600; }
.cm-del { border: 0; background: transparent; color: var(--text3); cursor: pointer; opacity: 0; font-size: .7rem; }
.cm:hover .cm-del { opacity: 1; }
.cm-pending { display: flex; gap: 6px; flex-wrap: wrap; padding: 8px 12px 0; }
.cm-chip { background: var(--surface2); border: 1px solid var(--border); border-radius: 10px; padding: 3px 8px; font-size: .78rem; display: inline-flex; gap: 6px; align-items: center; }
.cm-chip button { border: 0; background: transparent; cursor: pointer; color: var(--text2); }
.cm-comp { display: flex; align-items: flex-end; gap: 6px; padding: 10px 12px; border-top: 1px solid var(--border); position: relative; }
.cm-btn { border: 0; background: var(--surface2); border-radius: 50%; width: 38px; height: 38px; cursor: pointer; font-size: 1.15rem; display: grid; place-items: center; flex: none; }
.cm-btn:hover { background: var(--accent-soft); }
.cm-in { flex: 1; border: 1px solid var(--border); background: var(--surface2); border-radius: 20px; padding: 9px 14px; resize: none; outline: none; max-height: 160px; font: inherit; color: var(--text); line-height: 1.35; }
.cm-in:focus { border-color: var(--accent); }
.cm-send { border: 0; background: var(--accent); color: var(--on-accent); border-radius: 50%; width: 40px; height: 40px; cursor: pointer; font-size: 1.05rem; flex: none; }
.cm-send:disabled { opacity: .5; }
.cm-emojis { position: absolute; bottom: 58px; left: 10px; width: min(360px, calc(100% - 20px)); max-height: 240px; overflow: auto; background: var(--surface); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--win-shadow); padding: 8px; display: grid; grid-template-columns: repeat(auto-fill, 38px); gap: 2px; z-index: 5; }
.cm-emojis[hidden] { display: none; }
.cm-emojis button { border: 0; background: transparent; font-size: 1.4rem; cursor: pointer; border-radius: 8px; height: 38px; }
.cm-emojis button:hover { background: var(--surface2); transform: scale(1.2); }

/* ══════════ Σημειωματάριο ══════════ */
.notes { columns: 3 260px; column-gap: 14px; }
.note { break-inside: avoid; margin-bottom: 14px; background: var(--paper); color: #2b2b2b; border-radius: 4px 4px 14px 4px; padding: 12px 14px; box-shadow: 0 2px 6px rgba(0,0,0,.12), 0 12px 24px rgba(0,0,0,.08); border-top: 5px solid var(--pc); transform: rotate(-.4deg); transition: transform .2s cubic-bezier(.34,1.56,.64,1); }
.note:nth-child(2n) { transform: rotate(.5deg); }
.note:hover { transform: rotate(0) translateY(-3px); }
.note-h { display: flex; align-items: center; gap: 6px; font-size: .84rem; }
.note-h .sp { flex: 1; }
.note-h button { border: 0; background: transparent; cursor: pointer; opacity: .45; font-size: .9rem; }
.note-h button:hover { opacity: 1; }
.note-emo { font-size: 1.3rem; }
.note-t { font-weight: 800; font-size: 1.05rem; margin: 8px 0 2px; }
.note-b { font-size: .95rem; line-height: 1.5; margin-top: 6px; word-wrap: break-word; }
.nt-check { display: flex; gap: 8px; align-items: flex-start; cursor: pointer; }
.nt-check input { margin-top: 4px; }
.nt-check input:checked + span { text-decoration: line-through; opacity: .5; }
.note-f { font-size: .7rem; opacity: .55; margin-top: 8px; text-align: right; }
.emo-pick { display: flex; flex-wrap: wrap; gap: 3px; }
.emo-pick button { border: 1px solid transparent; background: var(--surface2); border-radius: 8px; width: 36px; height: 34px; font-size: 1.15rem; cursor: pointer; }
.emo-pick button.on { border-color: var(--accent); background: var(--accent-soft); }
.paper-pick { display: flex; gap: 8px; }
.paper-pick button { width: 34px; height: 34px; border-radius: 50%; border: 2px solid var(--border); cursor: pointer; }
.paper-pick button.on { border-color: var(--accent); box-shadow: 0 0 0 3px var(--accent-soft); }

/* ══════════ Οικογένεια / πρόγραμμα ══════════ */
.fam-scene { height: min(62vh, 560px); border-radius: 18px; overflow: hidden; background: linear-gradient(#bfe3ff, #eaf6ff); border: 1px solid var(--border); box-shadow: var(--shadow); position: relative; }
.fam-scene canvas { display: block; width: 100% !important; height: 100% !important; }
.fam-card { border-left: 4px solid var(--pc); }
.fam-h { display: flex; align-items: center; gap: 8px; } .fam-h .sp { flex: 1; } .fam-h .av { width: 26px; height: 26px; font-size: .8rem; }
.fam-now { font-size: 1.25rem; font-weight: 700; margin: 10px 0 4px; }
.fam-btns { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 10px; }
table.t.sched td { text-align: center; } table.t.sched td.on { font-weight: 600; } table.t.sched td.off { color: var(--text3); }
.sch-row { display: grid; grid-template-columns: 150px 1fr auto 1fr; gap: 8px; align-items: center; margin-bottom: 8px; }

/* ══════════ Ειδοποιήσεις ══════════ */
.notif-state { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: .88rem; font-weight: 600; }
.notif-state .btn { margin-left: auto; }
.alarm-t { font-size: 1.3rem; font-variant-numeric: tabular-nums; min-width: 70px; }
.alarm-ring { text-align: center; padding: 10px; }
.alarm-bell { font-size: 4rem; animation: wiggle .25s ease-in-out infinite; display: inline-block; }
.alarm-time { font-size: 2.6rem; font-weight: 800; letter-spacing: -.02em; }

/* ══════════ Τι νέο ══════════ */
.live-ind { font-size: .74rem; margin-bottom: 6px; line-height: 1.35; }
.live-ind.center { text-align: center; margin-top: 2px; }
.ver-link { border: 0; background: transparent; color: var(--text3); font: inherit; font-size: .74rem; cursor: pointer; padding: 0; text-align: left; }
.ver-link:hover { color: var(--accent); text-decoration: underline; }
.launch-ver { border: 0; background: transparent; color: var(--text3); cursor: pointer; font: inherit; font-size: .76rem; }
.launch-ver:hover { color: var(--accent); text-decoration: underline; }
.wn-chip { background: linear-gradient(135deg, #ff6aa2, #b44cff, #2f7bff) !important; color: #fff !important; border: 0 !important; font-weight: 700; }
html[data-motion="fun"] .wn-chip { animation: badgeBeat 1.6s ease-in-out infinite; }

/* ══════════ Οδηγός ══════════ */
.tour { position: fixed; inset: 0; z-index: 150; }
.tour-dim { position: absolute; inset: 0; background: rgba(0,0,0,.45); }
.tour-spot { position: absolute; border-radius: 12px; box-shadow: 0 0 0 9999px rgba(0,0,0,.45), 0 0 0 3px var(--accent); transition: all .3s; pointer-events: none; }
.tour-card { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); width: min(380px, calc(100% - 32px)); background: var(--surface); border-radius: 18px; padding: 20px; box-shadow: var(--win-shadow); animation: pop .25s cubic-bezier(.34,1.56,.64,1); }
.tour-card.side { transform: none; }
.tour-emoji { font-size: 2.6rem; }
.tour-card h3 { margin: 6px 0; font-size: 1.2rem; }
.tour-card p { margin: 0 0 10px; color: var(--text2); line-height: 1.5; font-size: .92rem; }
.tour-dots { display: flex; gap: 5px; justify-content: center; margin: 10px 0; }
.tour-dots i { width: 7px; height: 7px; border-radius: 50%; background: var(--border); } .tour-dots i.on { background: var(--accent); width: 18px; border-radius: 4px; }
.tour-btns { display: flex; gap: 8px; align-items: center; } .tour-btns .sp { flex: 1; }

/* ── Κινητό ── */
.tabbar { display: none; }
@media (max-width: 820px) {
  .app { grid-template-columns: 1fr; }
  .sidebar { display: none; }
  .main { height: calc(100vh - 62px); }
  .toolbar { padding: 10px 14px; }
  .toolbar h1 { font-size: 1.1rem; }
  .content { padding: 14px 14px 40px; }
  .g4 { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .g3, .g2 { grid-template-columns: 1fr; }
  .dash { grid-template-columns: repeat(2, minmax(0,1fr)); grid-auto-rows: 70px; gap: 10px; }
  .wd, .wd-add { grid-column: 1 / -1 !important; }
  .wd-stat .val { font-size: 1.4rem; }
  .nt-board { grid-template-columns: repeat(3, 82vw); }
  .nt-calgrid { grid-template-columns: 1fr; }
  .nt-day { min-height: 70px; }
  .nt-chip { font-size: .66rem; padding: 1px 3px; }
  .nt-head h2 { font-size: 1.4rem; }
  .nt-search { width: 100%; }
  .grid > * { min-width: 0; }
  .chat { height: calc(100vh - 200px); border-radius: 12px; }
  .care-bars { grid-template-columns: 1fr; }
  .launch-scene { height: 260px; }
  .cm { max-width: 90%; }
  .notes { columns: 1; }
  .pm-btn { min-width: 0; flex: 1; }
  .sch-row { grid-template-columns: 1fr 1fr auto 1fr; }
  .tour-card.side { left: 16px !important; right: 16px; top: auto !important; bottom: 80px; width: auto; }
  .launch-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .lt { padding: 16px 14px; }
  .launch-hi { font-size: 1.3rem; }
  .hm-pick { grid-template-columns: 1fr; }
  .li .whos { flex-direction: column; align-items: flex-end; gap: 2px; }
  .li { padding: 10px 10px; gap: 10px; }
  #calgrid { grid-template-columns: 1fr !important; }
  .row { flex-direction: column; gap: 0; }
  .cal { gap: 3px; } .cal .day { min-height: 58px; padding: 3px; border-radius: 7px; }
  .cal .ev { font-size: 0; height: 5px; padding: 0; margin-top: 2px; }
  .stat .val { font-size: 1.3rem; }
  .tabbar { display: flex; position: fixed; bottom: 0; left: 0; right: 0; height: 62px; background: var(--sidebar);
    backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); border-top: 1px solid var(--border); z-index: 40; overflow-x: auto; }
  .tabbar a { flex: 1 0 64px; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: .64rem; color: var(--text2); text-decoration: none; gap: 2px; }
  .tabbar a .ic { font-size: 1.2rem; }
  .tabbar a.on { color: var(--accent); }
  [data-theme="black"] .tabbar a.on { color: var(--text); font-weight: 700; }
  .win-layer { padding: 0; place-items: end center; }
  .win { max-height: 94vh; border-radius: 14px 14px 0 0; }
  .toast-wrap { bottom: 72px; right: 10px; left: 10px; align-items: stretch; }
}