/* ── MIYU shared styles ── */
/* Single source of truth for tokens and common components. */
/* Page-specific styles live in each template's <style> block. */

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

/* ── Tokens ── */
:root {
  --red:   #9B2226;
  --gold:  #C9963A;
  --ink:   #1A1A2E;
  --soft:  #F7F3EE;
  --white: #FFFFFF;
  --muted: #6B6B80;
}

/* ── Base ── */
body {
  font-family: system-ui, sans-serif;
  background: var(--soft);
  color: var(--ink);
  min-height: 100vh;
}

/* ── Header ── */
header {
  background: var(--white);
  padding: 18px 32px;
  display: flex;
  align-items: center;
  gap: 12px;
}
.logo {
  font-family: 'Fredoka One', cursive;
  font-size: 1.8rem;
  color: #9B2226;
  letter-spacing: 2px;
  text-decoration: none;
  line-height: 1;
}
.logo-sub {
  font-size: 0.8rem;
  color: var(--red);
  letter-spacing: 0.05em;
}

/* ── Header search ── */
.header-search {
  margin-left: auto;
  display: flex;
  align-items: center;
  border: 1.5px solid #E0D6CC;
  border-radius: 8px;
  overflow: hidden;
}
.header-search input {
  border: none;
  outline: none;
  padding: 7px 12px;
  font-size: 0.85rem;
  background: var(--soft);
  color: var(--ink);
  width: 160px;
}
.header-search input::placeholder { color: #bbb; }
.header-search button {
  border: none;
  background: none;
  padding: 7px 10px;
  color: var(--red);
  font-size: 1rem;
  cursor: pointer;
  line-height: 1;
}
.header-search button:hover { background: #F0E8E0; }

/* ── Footer ── */
footer {
  background: var(--ink);
  color: rgba(255,255,255,0.5);
  text-align: center;
  padding: 32px 24px;
  font-size: 0.85rem;
}
footer a { color: rgba(255,255,255,0.7); text-decoration: none; }
footer a:hover { color: var(--white); }
