*, *::before, *::after { box-sizing: border-box; }

html {
  min-height: 100%;
  background: var(--ink-950);
  scroll-behavior: smooth;
  -webkit-text-size-adjust: 100%;
}

body {
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at 82% -5%, rgba(255, 255, 255, 0.1), transparent 26rem),
    radial-gradient(circle at 88% 22%, rgba(157, 98, 255, 0.09), transparent 28rem),
    radial-gradient(circle at -10% 70%, rgba(82, 216, 223, 0.055), transparent 28rem),
    linear-gradient(180deg, var(--ink-900), var(--ink-950));
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size: 15px;
  font-weight: 400;
  line-height: 1.5;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}

button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { color: inherit; }
a { color: inherit; }

button:focus-visible,
a:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
  outline: 3px solid rgba(82, 216, 223, 0.7);
  outline-offset: 3px;
}

img, svg { display: block; max-width: 100%; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { color: var(--paper); font-weight: 600; }
strong { font-weight: 600; }

.sr-only {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
}

.glass-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.035)),
    var(--surface);
  box-shadow: inset 0 1px rgba(255,255,255,.045), var(--shadow-soft);
  backdrop-filter: blur(18px);
}

.button {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 10px 15px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  color: var(--text);
  background: rgba(255,255,255,.075);
  cursor: pointer;
  font-weight: 600;
  text-decoration: none;
  transition: transform .2s var(--ease), border-color .2s ease, background .2s ease;
}

.button:hover { transform: translateY(-1px); border-color: var(--line-strong); }
.button:active { transform: translateY(0) scale(.985); }
.button--gold { color: #111720; border-color: rgba(255,226,154,.45); background: linear-gradient(135deg, var(--gold-bright), #d6a944); }
.button--cyan { color: #071416; border-color: rgba(129,239,243,.5); background: linear-gradient(135deg, #96f0f2, #42c3ca); box-shadow: 0 12px 32px rgba(66,195,202,.16); }
.button--violet { border-color: rgba(157,98,255,.5); background: linear-gradient(135deg, rgba(112,53,220,.92), rgba(62,28,137,.96)); box-shadow: 0 12px 32px rgba(112,53,220,.22); }
.button--emerald { color: #07130d; border-color: rgba(98,217,154,.5); background: linear-gradient(135deg, #8be8b4, #42ba7e); }
.button--danger { color: #ffd8d9; border-color: rgba(255,127,130,.32); background: rgba(255,127,130,.1); }
.button--ghost { background: transparent; }
.button--small { min-height: 36px; padding: 7px 11px; font-size: .82rem; border-radius: 12px; }
.button[disabled] { opacity: .45; cursor: not-allowed; transform: none; }

:where(.button, .icon-button, .app-dialog__close, .tool-button, .ai-action, .ai-pill, .quick-card, .module-card, .folder-card, .bottom-nav__item, .section-heading button).is-pressing {
  animation: control-press .44s cubic-bezier(.2,.82,.24,1) both;
}

.button,
.icon-button,
.app-dialog__close,
.ai-action,
.ai-pill,
.quick-card,
.task-row,
.folder-card,
.note-row,
.tool-button,
.setting-row,
.bottom-nav__item:not(.bottom-nav__item--orb) {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.button::after,
.icon-button::after,
.app-dialog__close::after,
.ai-action::after,
.ai-pill::after,
.quick-card::after,
.task-row::after,
.folder-card::after,
.note-row::after,
.tool-button::after,
.setting-row::after,
.bottom-nav__item:not(.bottom-nav__item--orb)::after {
  content: "";
  position: absolute;
  z-index: 8;
  left: 50%;
  top: 50%;
  width: 14px;
  height: 14px;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  opacity: 0;
  transform: translate(-50%,-50%) scale(.25);
  pointer-events: none;
}

.button.is-pressing::after,
.icon-button.is-pressing::after,
.app-dialog__close.is-pressing::after,
.ai-action.is-pressing::after,
.ai-pill.is-pressing::after,
.quick-card.is-pressing::after,
.task-row.is-pressing::after,
.folder-card.is-pressing::after,
.note-row.is-pressing::after,
.tool-button.is-pressing::after,
.setting-row.is-pressing::after,
.bottom-nav__item.is-pressing::after {
  animation: control-bloom .56s ease-out both;
}

@keyframes control-press {
  0% { scale: 1; }
  34% { scale: .965; }
  68% { scale: 1.018; }
  100% { scale: 1; }
}

@keyframes control-bloom {
  0% { opacity: 0; transform: translate(-50%,-50%) scale(.25); }
  24% { opacity: .18; }
  100% { opacity: 0; transform: translate(-50%,-50%) scale(22); }
}

.field {
  width: 100%;
  min-height: 46px;
  padding: 12px 14px;
  color: var(--text);
  background: rgba(255,255,255,.055);
  border: 1px solid var(--line);
  border-radius: 14px;
  transition: border-color .2s ease, box-shadow .2s ease;
  font-size: 16px;
}

.field::placeholder { color: #737e8e; }
.field:focus { border-color: rgba(82,216,223,.48); box-shadow: 0 0 0 4px rgba(82,216,223,.08); outline: 0; }
textarea.field { resize: vertical; }

.chip {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 11px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--text-soft);
  background: rgba(255,255,255,.045);
  font-size: .78rem;
  font-weight: 600;
}

.chip--gold { color: var(--gold-bright); border-color: rgba(239,202,109,.34); background: rgba(239,202,109,.08); }
.chip--cyan { color: #a8f7fb; border-color: rgba(82,216,223,.34); background: rgba(82,216,223,.08); }
.chip--emerald { color: #aef2ca; border-color: rgba(98,217,154,.34); background: rgba(98,217,154,.08); }
.chip--violet { color: #e3d0ff; border-color: rgba(157,98,255,.38); background: rgba(157,98,255,.1); }

.app-dialog {
  width: min(92vw, 480px);
  max-height: calc(100dvh - 24px);
  padding: 0;
  border: 0;
  color: var(--text);
  background: transparent;
  overscroll-behavior: contain;
  scrollbar-width: thin;
}

.app-dialog::backdrop { background: rgba(0,0,0,.68); backdrop-filter: blur(8px); }
body:has(.app-dialog[open]) { overflow: hidden; }
.app-dialog__surface { position: relative; padding: 26px; border: 1px solid var(--line-strong); border-radius: 28px; background: linear-gradient(160deg, #151e2e, #080d15 70%); box-shadow: var(--shadow); }
.app-dialog__close { position: absolute; top: 12px; right: 12px; width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 999px; color: var(--text-soft); background: rgba(255,255,255,.05); cursor: pointer; font-size: 1.45rem; }

.toast-region { position: fixed; left: 50%; bottom: calc(var(--nav-height) + env(safe-area-inset-bottom) + 18px); z-index: 200; width: min(calc(100% - 28px), 440px); transform: translateX(-50%); pointer-events: none; }
.toast { padding: 13px 16px; border: 1px solid var(--line-strong); border-radius: 15px; color: var(--text); background: rgba(12,18,29,.96); box-shadow: var(--shadow-soft); backdrop-filter: blur(14px); animation: toast-in .25s var(--ease) both; }
.toast + .toast { margin-top: 8px; }

@keyframes toast-in { from { opacity: 0; transform: translateY(10px) scale(.98); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}