/* 17 — Holographic · Iridescentne gradienty, animowane */
:root {
  --bg: #0c0c14;
  --bg-elevated: rgba(255,255,255,0.06);
  --surface: rgba(255,255,255,0.08);
  --surface-hover: rgba(255,255,255,0.14);
  --text: #ffffff;
  --text-muted: rgba(255,255,255,0.6);
  --border: rgba(255,255,255,0.18);
  --border-strong: rgba(255,255,255,0.32);
  --accent: #a16eff;
  --accent-text: #0c0c14;
  --font-sans: 'Space Grotesk', sans-serif;
  --font-display: 'Space Grotesk', sans-serif;
}
body {
  background:
    conic-gradient(from 0deg at 50% 50%,
      #ff6ec7 0%, #a16eff 25%, #6ed6ff 50%, #6effa1 75%, #ff6ec7 100%);
  background-size: 300% 300%;
  background-attachment: fixed;
  animation: holo-shift 18s ease infinite;
  color: var(--text);
}
@keyframes holo-shift {
  0%, 100% { background-position: 0% 50%; }
  50% { background-position: 100% 50%; }
}
body::before {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 0;
  background: rgba(12,12,20,0.75); backdrop-filter: blur(80px);
}
.topbar, .main { position: relative; z-index: 1; }
.topbar { background: rgba(20,15,30,0.55); backdrop-filter: blur(30px); border-bottom: 1px solid var(--border); }
.brand {
  background: linear-gradient(90deg, #ff6ec7, #a16eff, #6ed6ff, #ff6ec7);
  background-size: 300% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: holo-shift 6s linear infinite;
  font-weight: 700;
}
.day-card {
  background: rgba(255,255,255,0.07);
  backdrop-filter: blur(30px) saturate(180%);
  border: 1px solid var(--border);
  border-radius: 18px;
  position: relative;
}
.day-card::before {
  content: ''; position: absolute; inset: 0; border-radius: 18px; padding: 1px;
  background: linear-gradient(135deg, rgba(255,110,199,0.5), rgba(110,214,255,0.5));
  -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor; mask-composite: exclude;
  pointer-events: none;
}
.day-card--today { box-shadow: 0 0 60px rgba(161,110,255,0.4); }
.editor, .preview { background: rgba(0,0,0,0.3); color: var(--text); border-color: var(--border); }
.btn { background: rgba(255,255,255,0.08); color: var(--text); border-color: var(--border); backdrop-filter: blur(10px); }
.btn--primary { background: linear-gradient(135deg, #ff6ec7, #a16eff); color: white; border: none; }
.terminal { background: rgba(8,6,18,0.6); backdrop-filter: blur(30px) saturate(140%); border: 1px solid var(--border); }
.terminal__head { background: rgba(8,6,18,0.55); border-bottom-color: var(--border); }
.terminal__output { background: rgba(8,6,18,0.55); }
.terminal__input-wrap { background: rgba(8,6,18,0.6); }

/* Inline terminal (/terminal page) — w środku własny iridescent gradient
   za zamarzniętą szybą, ciemniejszy żeby tekst się dobrze czytał */
.terminal.terminal--inline {
  background: rgba(8,6,18,0.35);
  backdrop-filter: blur(30px) saturate(150%);
  box-shadow: 0 8px 60px rgba(161,110,255,0.25);
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,0.16);
}
.terminal.terminal--inline::before {
  content: '';
  position: absolute;
  inset: -50%;
  background: conic-gradient(from 200deg at 50% 50%,
    #6effa1 0%, #ff6ec7 25%, #a16eff 50%, #6ed6ff 75%, #6effa1 100%);
  filter: blur(80px) saturate(160%);
  opacity: 0.45;
  z-index: 0;
  animation: terminal-holo-spin 28s linear infinite;
  pointer-events: none;
}
.terminal.terminal--inline > .terminal__head,
.terminal.terminal--inline > .terminal__output,
.terminal.terminal--inline > .terminal__input-wrap {
  position: relative;
  z-index: 1;
  background: rgba(8,6,18,0.55);
  backdrop-filter: blur(4px);
}
.terminal.terminal--inline > .terminal__suggestions {
  z-index: 5;
}
@keyframes terminal-holo-spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}
.terminal-page__title {
  background: linear-gradient(90deg, #ff6ec7, #a16eff, #6ed6ff);
  background-size: 200% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  animation: holo-shift 8s linear infinite;
}
.terminal-toggle { background: linear-gradient(135deg, #ff6ec7, #a16eff, #6ed6ff); color: white; }
.notebook-tile__link { background: rgba(255,255,255,0.06); backdrop-filter: blur(20px); border: 1px solid var(--border); }
.theme-card { background: rgba(255,255,255,0.06); backdrop-filter: blur(20px); border-color: var(--border); }
.field input { background: rgba(0,0,0,0.3); color: var(--text); border-color: var(--border); }
.auth-card { background: rgba(255,255,255,0.07); backdrop-filter: blur(30px); border-color: var(--border); }