:root {
  color-scheme: light dark;
  --bg: var(--tg-theme-bg-color, #101820);
  --panel: var(--tg-theme-secondary-bg-color, #1b2733);
  --text: var(--tg-theme-text-color, #f4f6f8);
  --muted: var(--tg-theme-hint-color, #9aa8b5);
  --accent: var(--tg-theme-button-color, #3390ec);
  --accent-text: var(--tg-theme-button-text-color, #ffffff);
  --line: color-mix(in srgb, var(--text) 12%, transparent);
  --danger: #e05c62;
}
* { box-sizing: border-box; }
body {
  margin: 0; background: var(--bg); color: var(--text);
  font: 15px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}
button, input, select { font: inherit; }
.shell { width: min(100%, 620px); margin: 0 auto; padding: 18px 16px 42px; }
.top { display:flex; align-items:center; gap:12px; padding: 8px 2px 22px; }
.logo { width:46px; height:46px; display:grid; place-items:center; border-radius:15px; background:var(--panel); font-size:25px; }
.brand { font-weight:800; letter-spacing:1.3px; }
.subtitle,.muted,.hint { color:var(--muted); font-size:13px; }
.panel { background:var(--panel); border:1px solid var(--line); border-radius:18px; padding:18px; }
.welcome { display:flex; justify-content:space-between; align-items:center; margin:4px 2px 16px; }
h1 { margin:2px 0 0; font-size:25px; }
h2 { margin:0; font-size:19px; }
h3 { margin:8px 0; }
.clock-icon { font-size:28px; }
.stats { display:flex; align-items:center; justify-content:space-between; margin-bottom:20px; }
.stat-number { font-size:27px; font-weight:800; }
.stat-right { text-align:right; }
.timezone { font-size:13px; margin-top:4px; }
.tabs { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:5px; background:var(--panel); border-radius:14px; margin-bottom:22px; }
.tab { border:0; background:transparent; color:var(--muted); padding:11px 8px; border-radius:10px; font-weight:650; }
.tab.active { background:var(--accent); color:var(--accent-text); }
.section-heading { display:flex; align-items:center; justify-content:space-between; margin:0 2px 13px; }
.icon-button { width:38px; height:38px; border:1px solid var(--line); border-radius:11px; color:var(--text); background:var(--panel); font-size:23px; }
.event { background:var(--panel); border:1px solid var(--line); border-radius:17px; padding:16px; margin-bottom:11px; }
.event-top { display:flex; gap:10px; justify-content:space-between; align-items:flex-start; }
.event-title { font-size:17px; font-weight:750; overflow-wrap:anywhere; }
.chip { flex-shrink:0; font-size:11px; border-radius:20px; padding:4px 8px; background:var(--bg); color:var(--muted); }
.event-meta { color:var(--muted); font-size:13px; margin-top:9px; }
.countdown { font-size:19px; font-weight:750; margin-top:14px; letter-spacing:.2px; }
.countdown.done { color:var(--muted); font-size:16px; }
.event-actions { display:flex; justify-content:flex-end; margin-top:12px; }
.delete { color:var(--danger); background:transparent; border:1px solid var(--line); border-radius:9px; padding:7px 11px; }
.form { display:grid; gap:15px; }
label { display:grid; gap:7px; font-size:13px; color:var(--muted); font-weight:600; }
input,select { width:100%; min-height:46px; padding:10px 12px; border-radius:11px; border:1px solid var(--line); background:var(--bg); color:var(--text); outline:none; }
input:focus,select:focus { border-color:var(--accent); }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:46px; padding:11px 17px; border-radius:12px; border:0; background:var(--accent); color:var(--accent-text); text-decoration:none; font-weight:700; text-align:center; }
.button:disabled { opacity:.55; }
.primary { width:100%; margin-top:4px; }
.hint { margin:0; text-align:center; }
.empty { text-align:center; margin-top:12px; }
.empty p { color:var(--muted); }
.big-icon { font-size:34px; }
.toast { position:fixed; left:16px; right:16px; bottom:22px; margin:auto; max-width:580px; padding:13px 16px; border-radius:12px; background:var(--text); color:var(--bg); box-shadow:0 8px 30px #0003; }
[hidden] { display:none !important; }