/* Vardag 0.2 — native-feeling, dark-first interface. No external fonts required. */
:root {
  color-scheme: dark;
  --bg:#090a0d;
  --surface:#17191e;
  --surface2:#24262d;
  --ink:#f6f6fa;
  --muted:#a2a5b0;
  --line:rgba(255,255,255,.09);
  --violet:#a394ff;
  --violet-soft:rgba(163,148,255,.14);
  --green:#45c78d;
  --red:#ff7986;
  --shadow:0 20px 60px rgba(0,0,0,.25);
  --spring:cubic-bezier(.2,.8,.2,1);
}
*, *::before, *::after { -webkit-tap-highlight-color:transparent; }
html { background:var(--bg); font-family:-apple-system,BlinkMacSystemFont,"SF Pro Text","SF Pro Display","Helvetica Neue",Arial,sans-serif; color:var(--ink); scroll-behavior:smooth; }
body { background:radial-gradient(ellipse 70vw 45vw at 85% -12%,rgba(70,59,133,.22),transparent 85%), var(--bg); color:var(--ink); }
button, input, textarea, select { font-family:inherit; }
button { transition:transform .26s var(--spring),background-color .2s ease,border-color .2s ease,box-shadow .22s ease,opacity .2s ease; }
button:active:not(:disabled) { transform:scale(.965); }
button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, a:focus-visible { outline:2px solid var(--violet); outline-offset:3px; }
::selection { background:rgba(163,148,255,.35); }
.sidebar { background:rgba(21,22,27,.85); border-right:1px solid var(--line); backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px); }
.brand { font-family:inherit; font-weight:750; letter-spacing:-1.35px; color:#fff; }
.brand-mark { background:linear-gradient(150deg,#b4a9ff,#7a63ef); border-radius:12px; box-shadow:0 6px 23px rgba(125,103,255,.28); }
.brand-dot,.eyebrow { color:#b4a7ff; }
.sidebar-label,.sidebar-foot { color:#7c7e8b; }
.nav-link { color:#a0a1ac; border:1px solid transparent; font-weight:600; }
.nav-link.active { background:rgba(167,151,255,.13); color:#e0d8ff; border-color:rgba(167,151,255,.11); }
.nav-link:hover:not(.active) { background:rgba(255,255,255,.055); color:#fff; }
.side-card { background:linear-gradient(145deg,rgba(166,150,255,.12),rgba(166,150,255,.045)); border:1px solid rgba(166,150,255,.12); }
.side-card-icon { background:rgba(163,148,255,.16); color:#c5bdff; }
.side-card p { color:#a3a0b5; }
.topbar { background:rgba(13,14,18,.64); border-bottom:1px solid var(--line); backdrop-filter:blur(28px);-webkit-backdrop-filter:blur(28px); position:sticky; top:0; z-index:10; }
.breadcrumb { color:#858691; }
.breadcrumb strong { color:#e1e2e8; }
.breadcrumb span { color:#555864; }
.status-pill { background:rgba(255,255,255,.055); border-color:rgba(255,255,255,.10); color:#b9b9c2; }
.avatar { background:linear-gradient(150deg,#a99aff,#705cdf); color:#fff; border-radius:13px; }
.content { padding-top:42px; }
.view.active { animation:page-enter .42s var(--spring) both; }
@keyframes page-enter { from { opacity:0; transform:translateY(10px) scale(.992); filter:blur(3px); } to { opacity:1; transform:translateY(0) scale(1); filter:blur(0); } }
.page-header h1 { font-family:inherit; font-weight:730; letter-spacing:-1.6px; color:#fafafd; }
.page-header p,.panel-sub { color:var(--muted); }
.eyebrow { font-size:10px; letter-spacing:1.7px; }
.btn { background:#25272f; border:1px solid rgba(255,255,255,.095); color:#f3f3f7; font-weight:650; border-radius:13px; box-shadow:none; }
.btn:hover { border-color:rgba(255,255,255,.23); background:#2d3039; }
.btn.primary { background:linear-gradient(145deg,#9684fb,#7863ec); color:#fff; border:1px solid rgba(205,198,255,.2); box-shadow:0 9px 28px rgba(101,82,235,.23); }
.btn.primary:hover { background:linear-gradient(145deg,#a89aff,#846df4); box-shadow:0 10px 34px rgba(101,82,235,.34); }
.btn.soft { background:rgba(163,148,255,.14); color:#c9c0ff; border-color:rgba(163,148,255,.1); }
.btn.danger { background:rgba(255,90,102,.10); border-color:rgba(255,90,102,.16); color:#ff8f9c; }
.panel,.metric,.folder-panel { background:linear-gradient(145deg,rgba(28,29,35,.98),rgba(21,22,27,.98)); border:1px solid rgba(255,255,255,.075); box-shadow:0 12px 36px rgba(0,0,0,.12); }
.panel { border-radius:24px; padding:26px; }
.panel h2 { color:#f5f5f8; letter-spacing:-.45px; font-weight:680; }
.pill { background:rgba(255,255,255,.065); color:#b4b4c2; border-radius:10px; }
.metric { border-radius:21px; }
.metric-label,.metric-mini { color:#a6a5b4; }
.metric-num { font-family:inherit; font-weight:710; color:#fafafa; }
.section-title { color:#858694; }
.check-row { border-color:rgba(255,255,255,.065); transition:background-color .2s; border-radius:9px; }
.check-row:hover { background:rgba(255,255,255,.018); }
.check { border-color:#636574; background:#262832; border-radius:7px; }
.check:checked { background:#9a8bfa; border-color:#9a8bfa; }
.task-meta { color:#8f909e; }
.done .task-title { color:#717481; }
.icon-chip { background:rgba(163,148,255,.1); color:#baacff; border-color:rgba(163,148,255,.16); }
.text-button { color:#a4a4b2; }
.text-button:hover { color:#cdc3ff; }
.quick-form { background:#272932; border:1px solid rgba(255,255,255,.06); border-radius:16px; }
.quick-form input { color:#fff; }
.quick-form button { background:#9380f3; color:#fff; border-radius:11px; }
.quick-form input::placeholder,input::placeholder,textarea::placeholder { color:#7b7d8d; }
.shortcut { background:rgba(255,255,255,.04); border-color:rgba(255,255,255,.075); color:#f7f7fa; border-radius:17px; }
.shortcut:hover { border-color:rgba(168,152,255,.42); background:rgba(163,148,255,.07); }
.shortcut-icon { background:rgba(163,148,255,.17); color:#c7beff; }
.shortcut span { color:#9494a3; }
.empty { color:#888b99; }
.empty-emoji { background:rgba(163,148,255,.1); color:#c7baff; }
.empty strong { color:#c6c6ce; }
.day-btn { background:rgba(255,255,255,.035); border-color:rgba(255,255,255,.08); color:#9fa1b1; border-radius:15px; }
.day-btn strong { color:#f1f1f6; }
.day-btn.active { background:#8e7af0; border-color:#a394ff; color:#fff; box-shadow:0 6px 25px rgba(119,99,234,.20); }
.day-btn.active strong { color:#fff; }
.event-card { background:#262831; border:1px solid rgba(255,255,255,.04); border-radius:15px; }
.event-bar { background:linear-gradient(#a99dff,#7863ee); }
.event-card p { color:#9798a8; }
.sync-info { background:rgba(149,131,255,.09); color:#bcb4df; border-color:rgba(149,131,255,.13); border-radius:17px; }
.alert { background:rgba(255,186,92,.08); color:#edc18a; border-color:rgba(255,186,92,.18); border-radius:14px; }
.folder-panel { border-radius:20px; }
.folder-button { color:#a9a9b7; border-radius:11px; }
.folder-button.active { background:rgba(163,148,255,.14); color:#d1c9ff; }
.folder-button span { color:#9798a5; }
.note-card { background:linear-gradient(145deg,#22242b,#1a1c22); border-color:rgba(255,255,255,.075); color:#f7f7fa; border-radius:19px; transition:transform .28s var(--spring),border-color .2s ease,box-shadow .2s ease,background .2s; }
.note-card:hover { transform:translateY(-2px); border-color:rgba(177,161,255,.26); box-shadow:0 10px 25px rgba(0,0,0,.18); }
.note-card:active { transform:scale(.99); }
.note-card h3 { color:#f7f7fa; }
.note-card p,.note-foot { color:#a1a1ae; }
.search { background:#252730; border-color:rgba(255,255,255,.085); color:#fff; border-radius:15px; }
.field label { color:#c7c7d1; }
.field input,.field select,.field textarea { background:#272933; border-color:rgba(255,255,255,.12); color:#fff; border-radius:13px; }
.field input:focus,.field textarea:focus,.field select:focus { border-color:#a394ff; box-shadow:0 0 0 3px rgba(163,148,255,.11); }
.field-help,.hint { color:#a4a4b0; }
.hint a { color:#c4b9ff; }
.link-row { border-color:var(--line); }
.link-row input { color:#d9d9e4; background:#272933; border-color:var(--line); }
.modal-backdrop { background:rgba(0,0,0,.67); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); animation:overlay-in .22s ease both; }
@keyframes overlay-in { from {opacity:0} to {opacity:1} }
.modal { background:#1b1c23; color:#f8f8fb; border:1px solid rgba(255,255,255,.13); border-radius:25px; box-shadow:0 30px 100px rgba(0,0,0,.55); animation:sheet-in .43s var(--spring) both; }
@keyframes sheet-in { from {opacity:.3;transform:translateY(18px) scale(.975)} to {opacity:1;transform:translateY(0) scale(1)} }
.modal h2 { color:#fff; }
.modal .sub { color:#a6a6b3; }
.modal-actions { border-color:var(--line); }
.seg { background:#101116; border:1px solid rgba(255,255,255,.075); border-radius:13px; }
.seg button { color:#a8a8b4; border-radius:10px; }
.seg button.selected { color:#fafaff; background:#3a364d; box-shadow:0 3px 12px rgba(0,0,0,.24); }
.minute-grid { background:transparent; gap:7px; }
.minute-grid button { background:#292b34; border:1px solid rgba(255,255,255,.08); color:#d5d5de; border-radius:13px; }
.minute-grid button.selected { background:#8b79ef; border-color:#a99cff; color:#fff; box-shadow:0 4px 20px rgba(131,109,255,.22); }
.preview-time { background:rgba(163,148,255,.10); color:#ded9ff; border-color:rgba(163,148,255,.12); border-radius:17px; }
.subtle { color:#9e9fad; }
#toast { background:rgba(46,47,56,.97); color:#f4f4f8; border:1px solid rgba(255,255,255,.13); backdrop-filter:blur(20px); -webkit-backdrop-filter:blur(20px); border-radius:15px; box-shadow:0 12px 40px rgba(0,0,0,.4); }
.mobile-nav { background:rgba(20,21,28,.87); border-top:1px solid rgba(255,255,255,.095); backdrop-filter:blur(30px); -webkit-backdrop-filter:blur(30px); }
.mobile-nav-item { color:#8f919f; }
.mobile-nav-item.active { color:#c1b3ff; }
.mobile-nav-item:hover { background:rgba(255,255,255,.04); }
@media (max-width:770px) {
  .content { padding-top:31px; padding-bottom:112px; }
  .topbar { background:rgba(15,16,21,.85); }
  .panel { border-radius:23px; padding:19px; }
  .metric { border-radius:18px; }
  .mobile-nav { padding-bottom:max(env(safe-area-inset-bottom),6px); }
  .mobile-nav-item { min-height:58px; }
  .modal-backdrop { align-items:flex-end; }
  .modal { width:100%; max-width:none; border-radius:27px 27px 0 0; padding-bottom:max(25px,env(safe-area-inset-bottom)); animation:mobile-sheet-in .48s var(--spring) both; }
  @keyframes mobile-sheet-in { from {opacity:.75;transform:translateY(105%)} to {opacity:1;transform:translateY(0)} }
}
@media (max-width:460px) {
  .page-header h1 { font-size:31px; letter-spacing:-1.3px; }
  .datebar { scroll-snap-type:x proximity; }
  .day-btn { scroll-snap-align:center; }
  .metrics { gap:8px; }
  .metric { padding:14px 12px; }
  .metric-label { font-size:10px; }
  .minute-grid { display:flex; overflow-x:auto; padding:7px 2px 10px; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; scrollbar-width:none; }
  .minute-grid::-webkit-scrollbar { display:none; }
  .minute-grid button { flex:0 0 54px; min-height:48px; scroll-snap-align:center; font-size:15px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation-duration:.01ms!important; transition-duration:.01ms!important; scroll-behavior:auto!important; }
}

.origin-field { display:flex;gap:8px;align-items:center;min-width:0;background:#101116;border:1px solid var(--line);border-radius:12px;padding:8px; }
.origin-field code { font-size:11px;word-break:break-all;min-width:0;flex:1;padding-left:6px;color:#d2c8ff; }
.origin-field .btn { flex:0 0 auto; }
/* Vardag 0.3: multi-calendar selection */
.calendar-filter { border:1px solid rgba(163,148,255,.19);background:rgba(163,148,255,.045);border-radius:17px;margin:15px 0 23px;overflow:hidden; }
.calendar-filter summary { list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 16px;font-size:13px;font-weight:650;color:#e6e2ff; }
.calendar-filter summary::-webkit-details-marker { display:none; }
.calendar-filter summary::before { content:'▸';color:#a394ff;margin-right:3px;transition:transform .22s ease; }
.calendar-filter[open] summary::before { transform:rotate(90deg); }
.calendar-filter summary>span:first-child { flex:1; }
.calendar-list { max-height:360px;overflow-y:auto;padding:0 10px 7px; }
.calendar-option { display:flex;align-items:center;gap:11px;padding:10px 9px;border-radius:10px;cursor:pointer;min-height:42px;transition:background .2s ease; }
.calendar-option:hover { background:rgba(255,255,255,.055); }
.calendar-option input { width:19px;height:19px;accent-color:#a394ff;flex:none; }
.calendar-option .calendar-name { flex:1;min-width:0;overflow-wrap:anywhere;color:#e1e1e9;font-size:13px; }
.calendar-name small { color:#9596a5;white-space:nowrap;font-weight:400; }
.calendar-dot { display:inline-block;vertical-align:middle;width:9px;height:9px;border-radius:50%;background:var(--cal-color,#a394ff);flex:none;margin-right:5px;box-shadow:0 0 0 2px rgba(255,255,255,.055); }
.calendar-filter .field-help { padding:0 17px 11px;margin-top:3px; }
.event-calendar-name { font-size:12px;color:#b5aaff!important;margin-top:4px; }

/* Calendar day view: optional multi-day/all-day span visibility. */
.multiday-toggle{display:flex;align-items:center;gap:10px;cursor:pointer;margin:12px 0 16px;color:var(--muted,#aaa9ba);font-size:13px;user-select:none;}
.multiday-toggle input{width:17px;height:17px;accent-color:#9480f5;cursor:pointer;}
.multiday-toggle small{margin-left:auto;border:1px solid rgba(160,153,194,.20);border-radius:100px;padding:3px 8px;color:#aba5c5;white-space:nowrap;}