:root {
  color-scheme: light;
  font-family: Inter, "Avenir Next", Avenir, ui-rounded, system-ui, sans-serif;
  --ink: #281820;
  --muted: #65515d;
  --line: rgba(111, 76, 103, .15);
  --paper: rgba(255, 255, 255, .82);
  --paper-solid: #fffdfd;
  --rose: #e74472;
  --rose-dark: #bd2856;
  --violet: #7657df;
  --mint: #168b80;
}
* { box-sizing: border-box; }
html { min-height: 100%; background: #fff7f2; }
body {
  min-height: 100vh;
  color: var(--ink) !important;
  background:
    radial-gradient(circle at 8% -8%, rgba(255, 151, 173, .34), transparent 34rem),
    radial-gradient(circle at 96% 6%, rgba(142, 116, 241, .25), transparent 31rem),
    radial-gradient(circle at 72% 100%, rgba(71, 199, 184, .17), transparent 28rem),
    linear-gradient(145deg, #fff8f3 0%, #fff4f7 52%, #f8f5ff 100%) !important;
  background-attachment: fixed !important;
}
body::before {
  content: "";
  position: fixed;
  inset: 0;
  pointer-events: none;
  opacity: .22;
  background-image: radial-gradient(rgba(91, 56, 81, .17) .65px, transparent .65px);
  background-size: 17px 17px;
}
main { position: relative; z-index: 1; }
nav {
  position: sticky;
  top: 12px;
  z-index: 10;
  padding: 11px 14px;
  border: 1px solid rgba(255,255,255,.74);
  border-radius: 18px;
  background: rgba(255,255,255,.72);
  box-shadow: 0 12px 35px rgba(86, 42, 70, .10);
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}
nav a, nav strong {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  padding: 7px 10px;
  border-radius: 11px;
  color: #6e4863 !important;
  text-decoration: none;
  font-weight: 700;
}
nav a:hover { background: #fff0f4; color: var(--rose-dark) !important; }
nav strong { color: white !important; background: linear-gradient(135deg, var(--rose), #ef6d62); }
h1 {
  margin-top: 8px;
  color: #402536;
  font-size: clamp(2rem, 5vw, 3.35rem);
  letter-spacing: -.055em;
  line-height: 1.04;
}
h2 { color: #4c3042; letter-spacing: -.025em; }
.muted, .hint { color: var(--muted) !important; font-weight: 500; }
.auth, .feature, .panel, .item, .audit, .user, .report, .toolbar, .editor, .card {
  color: var(--ink) !important;
  border: 1px solid rgba(255,255,255,.9) !important;
  background: linear-gradient(145deg, rgba(255,255,255,.91), rgba(255,250,252,.76)) !important;
  box-shadow: 0 16px 48px rgba(90, 46, 72, .10), 0 2px 7px rgba(90, 46, 72, .05);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.feature, .item, .user, .report { transition: transform .18s ease, box-shadow .18s ease; }
.feature:hover, .item:hover, .user:hover, .report:hover {
  transform: translateY(-2px);
  box-shadow: 0 21px 58px rgba(90, 46, 72, .14);
}
input, select, textarea {
  color: var(--ink) !important;
  border: 1px solid #ead8df !important;
  background: rgba(255,255,255,.88) !important;
  box-shadow: inset 0 1px 2px rgba(73, 38, 59, .04);
}
label, .field { color: #503b47 !important; }
input::placeholder, textarea::placeholder { color: #806c77 !important; opacity: 1; }
input:focus, select:focus, textarea:focus {
  outline: 3px solid rgba(231, 68, 114, .15);
  border-color: #e9688d !important;
}
button {
  color: #fff !important;
  border: 0 !important;
  background: linear-gradient(135deg, var(--rose), #f06a64) !important;
  box-shadow: 0 8px 20px rgba(210, 47, 94, .22);
  transition: transform .16s ease, filter .16s ease, box-shadow .16s ease;
}
button:hover:not(:disabled) { transform: translateY(-1px); filter: saturate(1.08); box-shadow: 0 11px 25px rgba(210,47,94,.27); }
button.secondary, button.save { background: linear-gradient(135deg, var(--violet), #9c62dc) !important; box-shadow: 0 8px 20px rgba(104, 76, 194, .20); }
button.quiet, .quiet { color: #67495e !important; background: #f4e9ee !important; box-shadow: none; }
button.danger, .danger { background: linear-gradient(135deg, #cf3651, #a81f42) !important; }
.switch { background: #d8c6cf !important; box-shadow: inset 0 1px 4px rgba(54,31,44,.18) !important; }
.switch.on { background: linear-gradient(135deg, var(--rose), #f06a64) !important; }
.badge, .count { color: #6b3e58 !important; background: #f8e5ed !important; }
.description { color: #4d3443 !important; background: rgba(255,245,249,.9) !important; border: 1px solid #f1dce4; }
.error { color: #b71948 !important; }
.success { color: #08766c !important; }
a { color: var(--rose-dark); }
.theme-toggle {
  min-width: 44px;
  white-space: nowrap;
  color: #5f4053 !important;
  background: rgba(255,255,255,.78) !important;
  border: 1px solid #ead8df !important;
  box-shadow: none !important;
}
body > .theme-toggle { position: fixed; z-index: 30; top: 18px; right: 18px; }

:root[data-theme="dark"] {
  color-scheme: dark;
  --ink: #fff3f7;
  --muted: #dac4cf;
  --line: rgba(255, 224, 238, .17);
  --paper: rgba(43, 31, 42, .88);
  --paper-solid: #2a1e29;
  --rose: #ff7194;
  --rose-dark: #ff9bb3;
  --violet: #a78bfa;
  --mint: #69d7c9;
}
:root[data-theme="dark"] html { background: #140d15; }
:root[data-theme="dark"] body {
  color: var(--ink) !important;
  background:
    radial-gradient(circle at 8% -8%, rgba(180, 50, 98, .30), transparent 34rem),
    radial-gradient(circle at 96% 6%, rgba(105, 78, 208, .28), transparent 31rem),
    radial-gradient(circle at 72% 100%, rgba(22, 139, 128, .16), transparent 28rem),
    linear-gradient(145deg, #160e16 0%, #21131d 52%, #171326 100%) !important;
}
:root[data-theme="dark"] body::before { opacity: .13; background-image: radial-gradient(rgba(255,235,243,.24) .65px, transparent .65px); }
:root[data-theme="dark"] nav {
  border-color: rgba(255,255,255,.11);
  background: rgba(35,24,34,.80);
  box-shadow: 0 14px 38px rgba(0,0,0,.28);
}
:root[data-theme="dark"] nav a { color: #e5cad7 !important; }
:root[data-theme="dark"] nav a:hover { color: #ffd4df !important; background: rgba(255,113,148,.14); }
:root[data-theme="dark"] h1, :root[data-theme="dark"] h2 { color: #fff4f8; }
:root[data-theme="dark"] .auth,
:root[data-theme="dark"] .feature,
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .item,
:root[data-theme="dark"] .audit,
:root[data-theme="dark"] .user,
:root[data-theme="dark"] .report,
:root[data-theme="dark"] .toolbar,
:root[data-theme="dark"] .editor,
:root[data-theme="dark"] .card {
  color: var(--ink) !important;
  border-color: rgba(255,255,255,.11) !important;
  background: linear-gradient(145deg, rgba(48,35,47,.94), rgba(38,27,38,.88)) !important;
  box-shadow: 0 18px 52px rgba(0,0,0,.25);
}
:root[data-theme="dark"] label, :root[data-theme="dark"] .field { color: #ecd8e1 !important; }
:root[data-theme="dark"] input,
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea {
  color: #fff4f8 !important;
  border-color: #674d5c !important;
  background: rgba(25,18,25,.86) !important;
}
:root[data-theme="dark"] input::placeholder,
:root[data-theme="dark"] textarea::placeholder { color: #c3aab6 !important; }
:root[data-theme="dark"] button.quiet,
:root[data-theme="dark"] .quiet,
:root[data-theme="dark"] .theme-toggle { color: #f2dce6 !important; background: #4a3542 !important; border-color: #674d5c !important; }
:root[data-theme="dark"] .switch { background: #624a58 !important; }
:root[data-theme="dark"] .badge,
:root[data-theme="dark"] .count { color: #ffd9e3 !important; background: #573044 !important; }
:root[data-theme="dark"] .description { color: #f9e8ef !important; background: rgba(24,17,24,.72) !important; border-color: #5f4654; }
:root[data-theme="dark"] .error { color: #ff9eb4 !important; }
:root[data-theme="dark"] .success { color: #83e4d7 !important; }
@media (max-width: 680px) {
  nav { position: static; border-radius: 15px; }
  h1 { font-size: 2.2rem; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition: none !important; }
}