html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* ---- Global busy overlay ---- */
#mia-busy {
  position: fixed;
  inset: 0;
  background: rgba(255, 255, 255, 0.6);
  backdrop-filter: blur(2px);
  -webkit-backdrop-filter: blur(2px);
  z-index: 2000;
  display: none;
  align-items: center;
  justify-content: center;
  opacity: 0;
  transition: opacity 0.18s ease-in;
  pointer-events: none;
}
#mia-busy.is-visible {
  display: flex;
  opacity: 1;
  pointer-events: auto;
}
#mia-busy .mia-busy-card {
  background: #fff;
  padding: 18px 26px;
  border-radius: 8px;
  box-shadow: 0 6px 24px rgba(0, 0, 0, .12);
  display: flex;
  align-items: center;
  gap: 14px;
  font-size: 0.95rem;
  color: #444;
}
#mia-busy .mia-spinner {
  width: 28px;
  height: 28px;
  border: 3px solid #d8dde2;
  border-top-color: #2980b9;
  border-radius: 50%;
  animation: mia-spin 0.7s linear infinite;
}
@keyframes mia-spin {
  to { transform: rotate(360deg); }
}
@media (prefers-reduced-motion: reduce) {
  #mia-busy .mia-spinner { animation: none; }
  #mia-busy { transition: none; }
}
/* ----- Mia Brain: note rendering ----- */
.note-body .card-body > :last-child { margin-bottom: 0; }
.note-body code { background: #f4f1ec; padding: 0.1rem 0.35rem; border-radius: 4px; }
.note-body pre code { display: block; padding: 0.75rem; overflow-x: auto; }
a.wiki-link { text-decoration: none; border-bottom: 1px dashed #dd7904; }
a.wiki-link:hover { border-bottom-style: solid; }
a.wiki-missing { color: #b02a37; border-bottom-color: #b02a37; }
.note-body img, .note-body video { max-width: 100%; height: auto; border-radius: 6px; }

/* ----- Mia Brain: note type badges (soft tint + brand accent colors) ----- */
.type-badge { display:inline-block; padding:.2rem .6rem; border-radius:999px; font-size:.78rem; font-weight:600; letter-spacing:.01em; }
.type-general   { background:#eeeeee; color:#555555; }
.type-procedure { background:#e0f0fa; color:#0f6ca8; }
.type-tool      { background:#e4f2e8; color:#3e7d4c; }
.type-machine   { background:#ebe7f7; color:#55449e; }
.type-reference { background:#fdf3d7; color:#8a6d0f; }
.type-person    { background:#fdeeda; color:#b05f04; }
.type-place     { background:#ddf2ef; color:#1f7a70; }
.type-trip      { background:#fae3e2; color:#a12f2c; }
.tag-chip { display:inline-block; padding:.2rem .6rem; border-radius:999px; font-size:.78rem; background:#faf8f5; border:1px solid #ececec; color:#6b6b6b; text-decoration:none; }
.tag-chip:hover { border-color:#dd7904; color:#c46412; }

/* ----- Mia Brain: note reading surface ----- */
.note-title { font-weight:700; letter-spacing:-0.02em; color:#333; }
.note-surface { background:#ffffff; border:1px solid #ececec; border-radius:12px; padding:1.75rem 2rem;
                box-shadow:0 1px 3px rgba(0,0,0,.05); font-size:1.02rem; line-height:1.65; color:#333; }
.note-surface > :last-child { margin-bottom:0; }
.note-surface h1 { font-size:1.45rem; font-weight:700; margin-top:1.6rem; }
.note-surface h2 { font-size:1.22rem; font-weight:700; margin-top:1.6rem; padding-bottom:.35rem; border-bottom:1px solid #ececec; }
.note-surface h3 { font-size:1.05rem; font-weight:700; margin-top:1.3rem; }
.note-surface h1:first-child, .note-surface h2:first-child, .note-surface h3:first-child { margin-top:0; }
.note-surface a { color:#c46412; }
.note-surface pre { background:#2d2a26; color:#f5f0e8; padding:1rem 1.25rem; border-radius:8px; overflow-x:auto; }
.note-surface pre code { background:transparent; padding:0; color:inherit; }
.note-surface blockquote { border-left:3px solid #dd7904; margin-left:0; padding:.25rem 0 .25rem 1rem; color:#6b6b6b; }
.note-surface table { border-collapse:collapse; margin:1rem 0; }
.note-surface th, .note-surface td { border:1px solid #ececec; padding:.4rem .75rem; }
.note-surface th { background:#faf8f5; }
.note-surface ul, .note-surface ol { padding-left:1.4rem; }
.note-surface li { margin-bottom:.25rem; }

/* Connections (links to / referenced by) */
.link-chip { display:inline-block; padding:.3rem .7rem; border-radius:999px; background:#faf8f5;
             border:1px solid #ececec; text-decoration:none; color:#4a4a4a; font-size:.85rem; margin:0 .35rem .35rem 0; }
.link-chip:hover { border-color:#dd7904; color:#c46412; background:#fff; }
.connections-label { font-size:.78rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#9a9a9a; }

/* ----- Mia Brain: editor ----- */
.editor-title { font-size:1.35rem; font-weight:700; letter-spacing:-0.01em; }
.editor-tabs .nav-link { padding:.35rem .9rem; font-size:.9rem; }
.editor-tabs .nav-link.active { font-weight:600; }
#previewPane { min-height:20rem; }
.editor-tips { background:#faf8f5; border:1px solid #ececec; border-radius:12px; font-size:.9rem; }
.editor-tips h3 { font-size:.8rem; font-weight:700; text-transform:uppercase; letter-spacing:.06em; color:#9a9a9a; margin-bottom:.5rem; }
.editor-tips ul { padding-left:1.1rem; margin-bottom:.75rem; }
.editor-tips li { margin-bottom:.4rem; }
.editor-tips code { background:#f1ece4; padding:.05rem .3rem; border-radius:4px; }

/* ----- Mia Brain: Google-style idle home ----- */
.home-idle { margin-top: 11vh; }
.home-mark { height: 56px; }
.home-word { font-size: 2rem; letter-spacing: -0.02em; color: #333; line-height: 1.1; margin-top: .35rem; }
.home-word b { font-weight: 800; }
.home-search { max-width: 40rem; margin: 0 auto; }
.home-search .form-control { border-radius: 999px 0 0 999px; padding-left: 1.4rem; }
.home-search .btn { border-radius: 0 999px 999px 0; padding-right: 1.4rem; }
