@import url('https://fonts.googleapis.com/css2?family=IM+Fell+English+SC&family=IM+Fell+English:ital@0;1&family=Special+Elite&family=Courier+Prime:ital,wght@0,400;1,400&display=swap');

/* https://medium.com/@erikritter/css-snippets-add-a-texture-overlay-to-an-entire-webpage-b0bfdfd02c45 */

/* Palette */
:root {
  --paper:     url("data:image/jpeg;base64,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");
  --ink:       #1a0f05;
  --ink-muted: #2b231b;
  --parchment: #e8d4a8;
  --ink-faint: rgba(26, 15, 5, 0.08);
  --ink-mid:   rgba(26, 15, 5, 0.38);
  --ink-light: rgba(26, 15, 5, 0.18);
  --parch-dim: rgba(232, 212, 168, 0.55);
}

/* Reset */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; overscroll-behavior-y: none; }

.paperOverlay {
  position: absolute; inset: 0;
  background-image: var(--paper); background-repeat: repeat;
  mix-blend-mode: multiply; opacity: 0.6; pointer-events: none;
  animation: paperin 0.5s ease-in-out both;
}
@keyframes paperin { from { transform: translateY(6px); } to { transform: translateY(0); } }
@keyframes pagein  { from { opacity: 1; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@keyframes blink   { 0%,49% { opacity: 0.75; } 50%,100% { opacity: 0; } }

/* Body */
body {
  min-height: 100vh; position: relative;
  color: var(--ink); font-family: 'Special Elite', serif;
  font-size: 1rem; line-height: 1.8; letter-spacing: 0.015em;
  background-color: var(--parchment);
  background-image:
    radial-gradient(ellipse 70% 55% at 18% 25%, rgba(26, 15, 5, 0.07) 0%, transparent 70%),
    radial-gradient(ellipse 55% 70% at 82% 72%, rgba(26, 15, 5, 0.055) 0%, transparent 70%),
    radial-gradient(ellipse 40% 35% at 55% 88%, rgba(26, 15, 5, 0.04) 0%, transparent 65%);
}
body::after {
  content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 9001;
  background: radial-gradient(ellipse 130% 130% at 50% 40%, transparent 42%, rgba(26, 15, 5, 0.2) 100%);
}

/* Typography */
h1, h2, h3 {
  font-family: 'IM Fell English SC', serif; font-weight: normal;
  line-height: 1.2; letter-spacing: 0.01em;
  text-shadow: 0.4px 0.6px 0 rgba(26, 15, 5, 0.12);
}
h1 { font-size: 2.6rem; margin-bottom: 0.55rem; }
h2 { font-size: 1.6rem; margin-bottom: 0.5rem; }
h3 { font-size: 1.15rem; margin-bottom: 0.35rem; }
p { margin-bottom: 0.9rem; }
p:last-child { margin-bottom: 0; }
em { font-family: 'IM Fell English', serif; font-style: italic; }

/* Body links */
a {
  color: inherit; text-decoration: underline;
  text-decoration-color: var(--ink-mid); text-underline-offset: 3px;
  transition: text-decoration-color 0.2s;
}
a:hover { text-decoration-color: var(--ink); }

/* Navbar */
nav {
  position: sticky; top: 0; z-index: 1000;
  display: flex; align-items: center; justify-content: space-between;
  gap: 2rem; padding: 0.9rem 2.5rem; background-color: var(--ink);
}
.brand {
  font-family: 'IM Fell English SC', serif; font-size: 1.6rem;
  color: var(--parchment); text-decoration: none;
  letter-spacing: 0.04em; flex-shrink: 0; line-height: 1;
}
.cursor {
  display: inline-block; font-size: 1.4rem; margin-left: 2px;
  color: var(--parchment); opacity: 0.75; animation: blink 1s step-end infinite;
}
.nav-links { display: flex; align-items: center; gap: 0; flex-wrap: wrap; }

/* Nav links */
.nav-links a {
  color: var(--parchment); font-family: 'Special Elite', serif;
  font-size: 0.78rem; letter-spacing: 0.06em; text-decoration: none;
  opacity: 0.78; padding: 0.1rem 0.75rem; position: relative; transition: opacity 0.2s;
}
.nav-links a::after { content: '_'; margin-left: 2px; opacity: 0; transition: opacity 0.12s; }
.nav-links a:hover { opacity: 0.9; text-decoration: none; transform: translateY(1px); }
.nav-links a:hover::after { opacity: 0.75; animation: blink 1s step-end infinite; }

/* Separators */
.sep {
  color: var(--parchment); opacity: 0.18; font-size: 0.65rem;
  user-select: none; line-height: 1; padding: 0 0.05rem; font-weight: 300;
}

/* User greeting */
.nav-user {
  color: var(--parchment); font-family: 'IM Fell English', serif;
  font-style: italic; font-size: 1.2rem; opacity: 0.52; padding: 0 0.75rem;
}

/* Main content */
main {
  max-width: 820px; margin: 0 auto; padding: 3.5rem 2rem 5rem;
  position: relative; z-index: 1; animation: pagein 0.5s ease-in-out both;
}

/* Footer */
footer {
  position: relative; z-index: 1; text-align: center; padding: 1.5rem 2rem;
  border-top: 1px solid var(--ink-faint); font-family: 'IM Fell English', serif;
  font-style: italic; font-size: 0.78rem; opacity: 0.42;
}

/* Horizontal rule */
hr {
  border: none; position: relative; height: 1px; margin: 2.0rem auto; max-width: 480px;
  opacity: 0.22;
  background: linear-gradient(to right, transparent, var(--ink) 20%, var(--ink) 80%, transparent);
}
hr::after {
  content: '\2767'; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
  background: var(--parchment); padding: 0 0.5rem; font-size: 0.55rem;
  color: var(--ink); opacity: 0.55; line-height: 1;
}

/* Hero */
.hero { text-align: center; padding: 1rem 0 2rem; }
.hero h1 { font-size: 3.2rem; margin-bottom: 0.6rem; }
.hero .tagline {
  font-family: 'IM Fell English', serif; font-style: italic; font-size: 1.05rem;
  opacity: 0.68; max-width: 520px; margin: 0 auto; line-height: 1.65;
}
.theorem, .how-it-works { margin-bottom: 2.2rem; }

/* Leaderboard preview */
.leaderboard-preview { margin-bottom: 2rem; }
.top-list { list-style: none; margin: 0.8rem 0 1.2rem; border-top: 1px solid var(--ink-faint); }
.top-list li {
  display: flex; align-items: baseline; gap: 0.8rem; padding: 0.3rem 0;
  border-bottom: 1px solid var(--ink-faint); font-size: 0.9rem;
}
.top-list .rank {
  font-family: 'Courier Prime', monospace; font-size: 0.78rem;
  opacity: 0.38; width: 1.4rem; flex-shrink: 0;
}
.top-list .score {
  margin-left: auto; font-family: 'Courier Prime', monospace;
  font-size: 0.82rem; opacity: 0.55;
}

/* Buttons & button-like links — ink outline, fills on hover */
button, .cta-btn, .scope-option {
  font-family: 'Special Elite', serif; font-size: 0.85rem; letter-spacing: 0.05em;
  color: var(--ink-muted); background: transparent;
  border: 1.5px solid var(--ink-muted); padding: 0.45rem 1.1rem;
  cursor: pointer; transition: background 0.18s, color 0.18s;
}
.cta-btn, .scope-option { text-decoration: none; }
.cta-btn { display: inline-block; margin-top: 1.4rem; letter-spacing: 0.07em; padding: 0.5rem 1.3rem; }
button:hover, .cta-btn:hover, .scope-option:hover, .scope-option.active,
#logout-confirm, #deleteall-confirm, #reset-confirm { background: var(--ink-muted); color: var(--parchment); }
.cta-btn:hover, .scope-option:hover { text-decoration: none; }
button:active { transform: translateY(1px); }

/* Tables */
table { width: 100%; border-collapse: collapse; font-size: 0.88rem; margin-top: 0.8rem; }
thead tr { border-bottom: 1.5px solid var(--ink); }
th {
  font-family: 'IM Fell English SC', serif; font-weight: normal; text-align: left;
  padding: 0.4rem 0.75rem; font-size: 0.82rem; letter-spacing: 0.04em; opacity: 0.65;
}
td {
  padding: 0.38rem 0.75rem; border-bottom: 1px solid var(--ink-faint);
  font-family: 'Courier Prime', monospace; font-size: 0.84rem;
}
tr:last-child td { border-bottom: none; }
td:first-child { font-family: 'Special Elite', serif; }

/* Forms */
form { margin-bottom: 1.8rem; }
label, .logout { font-family: 'Special Elite', serif; font-size: 0.85rem; }
select, input[type="text"] {
  font-family: 'Special Elite', serif; font-size: 0.82rem; background: transparent;
  border: 1px solid var(--ink-muted); color: var(--ink-muted);
  padding: 0.3rem 0.6rem; margin-left: 0.3rem;
  -webkit-appearance: none; appearance: none;
}

/* stats */
.stats-section { margin: 1.2rem 0; padding: 0.6rem 0; border-top: 1px solid var(--ink-faint); }
.stats-section b {
  display: block; font-family: 'IM Fell English SC', serif; font-weight: normal;
  font-size: 1.3rem; margin-bottom: 0.55rem; letter-spacing: 0.06em; opacity: 0.5;
}
.stats-section div { font-family: 'Courier Prime', monospace; font-size: 0.85rem; line-height: 2.0; }

/* Sign-out modal */
.modal-overlay {
  position: fixed; inset: 0; z-index: 9500; padding: 2rem;
  display: flex; align-items: center; justify-content: center;
  background: rgba(26, 15, 5, 0.55); animation: pagein 0.25s ease both;
}
.modal-overlay[hidden] { display: none; }
.modal-box {
  position: relative; width: 100%; max-width: 360px; padding: 2rem 2.2rem; text-align: center;
  background-color: var(--parchment); border: 1.5px solid var(--ink-muted);
  box-shadow: 0 12px 40px rgba(26, 15, 5, 0.45);
}
.modal-box h2 { margin-bottom: 0.7rem; }
.modal-box p { font-size: 0.9rem; opacity: 0.72; margin-bottom: 1.6rem; }
.modal-actions { display: flex; gap: 0.8rem; justify-content: center; }
.modal-actions button { min-width: 6.5rem; }
#logout-confirm:hover, #deleteall-confirm:hover { background: transparent; color: var(--ink); }

/* Cage controls */
#tabs { display: flex; gap: 0.5rem; flex-wrap: wrap; margin-bottom: 0.8rem; align-items: center; }
#tabs span {
  display: inline-flex; align-items: center; gap: 0.45rem; padding: 0.25rem 0.6rem;
  border: 1px solid var(--ink-muted); font-family: 'Special Elite', serif;
  font-size: 0.78rem; cursor: pointer; opacity: 1; transition: opacity 0.15s, background 0.15s;
}
#tabs span.active { opacity: 1; border-color: var(--ink); background: rgba(26, 15, 5, 0.06); }
#tabs span:hover { opacity: 0.6; }
#tabs span > span {
  border: none; padding: 0; opacity: 0.45; font-size: 0.9rem; cursor: pointer; transition: opacity 0.15s;
}
#tabs span > span:hover { opacity: 1; }
#tabs .cage-empty {
  flex: 1; text-align: center; font-size: 1rem; font-family: 'IM Fell English', serif;
  font-style: italic; opacity: 0.7; border: none; padding: 0; cursor: default;
}
#addTab, #pauseAll, #saveBtn, #resetBtn, #deleteAll { margin-right: 0.35rem; margin-bottom: 0.6rem; }

/* Speed slider */
input[type="range"] {
  -webkit-appearance: none; appearance: none; width: 70px; height: 2px;
  background: var(--ink); opacity: 0.35; outline: none; cursor: pointer; border: none; border-radius: 0;
}
input[type="range"]::-webkit-slider-thumb {
  -webkit-appearance: none; appearance: none; width: 10px; height: 10px;
  background: var(--ink); border: none; border-radius: 0; cursor: pointer;
}
input[type="range"]::-moz-range-thumb {
  width: 10px; height: 10px; background: var(--ink); border: none; border-radius: 0; cursor: pointer;
}
input[type="range"]:hover { opacity: 0.7; }

/* Bar chart */
.bar-track {
  display: inline-block; width: 200px; max-width: 50vw; height: 10px;
  background: var(--ink-faint); vertical-align: middle;
}
.bar { display: block; height: 100%; background: var(--ink); opacity: 0.55; }
.bar-pct { font-family: 'Courier Prime', monospace; font-size: 0.78rem; opacity: 0.55; margin-left: 0.5rem; }

/* Words page */
.words-count {
  font-family: 'IM Fell English', serif; font-style: italic; font-size: 0.9rem;
  opacity: 0.62; margin-bottom: 1rem;
}

/* Inner page h1 */
main > h1 { margin-bottom: 1.6rem; padding-bottom: 0.5rem; border-bottom: 1px solid var(--ink-faint); }

/* Scope toggle */
.scope-toggle { display: inline-flex; gap: 0.5rem; margin-bottom: 1.8rem; }

/* underline */
.detected { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 2px; }

/* CLAUDE */
#container {
  font-family: "Courier Prime", monospace; color: var(--ink);
  background-color: #d8be8a; background-image: var(--paper); background-repeat: repeat; background-blend-mode: multiply;
  margin-top: 1.4rem; height: 300px; overflow-y: auto; scrollbar-width: none;
}
#container::-webkit-scrollbar { display: none; }
#container, .ach-card {
  background-color: rgb(235, 217, 178);
  background-image: var(--paper);
  background-repeat: repeat;
  background-size: 105% auto;
  box-shadow: inset 0 0 30px rgba(0, 0, 0, 0.3);
  background-attachment: local; background-blend-mode: multiply;
  border: 2.5px solid #1a1a1a; border-radius: 255px 8px 225px 12px / 12px 225px 10px 255px;
  padding: 1rem 1.25rem;
}

.modal-box,
.settings-box,
.ach-toast {
  background-color: rgb(235, 217, 178);
  background-image: var(--paper);
  background-repeat: repeat;
  background-size: 105% auto;
  background-blend-mode: multiply;
  box-shadow:
    inset 0 0 30px rgba(0,0,0,.3),
    0 12px 40px rgba(26,15,5,.45);
}

.settings-box { max-width: 380px; text-align: left; }
.settings-box h2 { text-align: center; }
.setting-row {
  display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 0.45rem 0; border-bottom: 1px solid var(--ink-faint);
}
.setting-row label { font-family: 'Special Elite', serif; font-size: 0.85rem; }

/* flat ink on/off switch */
.toggle {
  -webkit-appearance: none; appearance: none; width: 40px; height: 20px; flex-shrink: 0;
  background: transparent; border: 1.5px solid var(--ink-muted);
  position: relative; cursor: pointer; transition: background 0.15s;
}
.toggle::after {
  content: ""; position: absolute; top: 1.5px; left: 2px; width: 14px; height: 14px;
  background: var(--ink-muted); transition: left 0.15s, background 0.15s;
}
.toggle:checked { background: var(--ink-muted); }
.toggle:checked::after { left: 21px; background: var(--parchment); }

/* Burger button — hidden on desktop */
.burger {
  display: none; background: none; border: none; padding: 0.2rem 0.4rem;
  color: var(--parchment); font-size: 1.4rem; cursor: pointer; line-height: 1;
  opacity: 0.85; transition: opacity 0.15s;
}
.burger:hover { opacity: 1; }

/* Mobile nav CLAUDE */
@media (max-width: 640px) {
  .burger { display: block; }
  nav { flex-wrap: wrap; padding: 0.75rem 1.2rem; gap: 0; }
  .brand { flex: 1; }
  .nav-links {
    display: none; width: 100%; flex-direction: column; align-items: flex-start;
    gap: 0; padding: 0.6rem 0 0.8rem; border-top: 1px solid rgba(232,212,168,0.15);
    margin-top: 0.5rem;
  }
  .nav-links.open { display: flex; }
  .sep { display: none; }
  .nav-links a { padding: 0.45rem 0.25rem; font-size: 0.9rem; opacity: 0.85; }
  .nav-user { padding: 0.45rem 0.25rem; font-size: 1rem; }
  main { padding: 2rem 1.2rem 4rem; }
  .settings-box { max-width: 100%; }
}

/* Reduce motion */
.reduce-motion *, .reduce-motion *::before, .reduce-motion *::after {
  animation: none !important; transition: none !important; scroll-behavior: auto !important;
}

/* CLAUDE hand-cut radii */
:root {
  --hand-a: 14px 6px 12px 8px / 8px 12px 7px 13px;
  --hand-b: 8px 13px 7px 12px / 12px 7px 13px 8px;
  --hand-c: 11px 9px 14px 7px / 9px 13px 8px 12px;
}
button, .cta-btn, .scope-option, select, input[type="text"],
#tabs span, .toggle, .modal-box { border-radius: var(--hand-a); }
button:nth-of-type(even), #tabs span:nth-of-type(even) { border-radius: var(--hand-b); }
button:nth-of-type(3n),   #tabs span:nth-of-type(3n)   { border-radius: var(--hand-c); }
.toggle        { border-radius: 6px 3px 5px 4px / 4px 6px 3px 5px; }
.toggle::after { border-radius: 4px 2px 3px 2px / 2px 4px 2px 3px; }
.modal-box     { border-radius: 22px 10px 18px 13px / 13px 18px 10px 22px; }

/* achievements CLAUDE */
.ach-grid {
  display: grid; gap: 18px; margin-top: 18px;
  grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
}
.ach-card { font-family: "Courier Prime", monospace; color: var(--ink); position: relative; }
.ach-card.unlocked { background-color: #d8be8a; }
.ach-card.locked {
  background-color: #c7bca1; border-color: var(--ink-mid); color: var(--ink-mid); opacity: 0.72;
}
.ach-card:nth-child(3n+1) { border-radius: 255px 8px 225px 12px / 12px 225px 10px 255px; }
.ach-card:nth-child(3n+2) { border-radius: 12px 220px 10px 240px / 230px 10px 250px 12px; }
.ach-card:nth-child(3n)   { border-radius: 230px 14px 240px 10px / 14px 235px 12px 245px; }
.ach-name { font-weight: 700; font-size: 1.05rem; }
.ach-desc { font-size: .85rem; opacity: .85; margin-top: 4px; line-height: 1.5; }
.ach-tier { font-size: .7rem; text-transform: uppercase; letter-spacing: .12em; margin-top: 10px; opacity: .85; }
.tier-bronze .ach-tier { color: #9c6b34; }
.tier-silver .ach-tier { color: #7c7c7c; }
.tier-gold   .ach-tier { color: #b08a2c; }
#ach-counter { font-family: "Courier Prime", monospace; opacity: .6; letter-spacing: .04em; }
.ach-warning { font-family: "Courier Prime", monospace; color: #8a3b1f; }
#toast-stack {
  position: fixed; right: 20px; bottom: 20px; z-index: 9999;
  display: flex; flex-direction: column; gap: 12px; pointer-events: none;
}
.ach-toast {
  min-width: 240px; max-width: 320px; padding: 12px 16px;
  font-family: "Courier Prime", monospace; color: var(--ink); background-color: #d8be8a;
  border: 2.5px solid var(--ink); border-left-width: 9px;
  border-radius: 255px 8px 225px 12px / 12px 225px 10px 255px;
  box-shadow: 4px 4px 0 rgba(26, 15, 5, 0.35);
  transform: translateX(130%); transition: transform .35s ease;
}
.ach-toast.show { transform: translateX(0); }
.ach-toast-head { font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; opacity: .6; }
.ach-toast-name { font-weight: 700; font-size: 1.05rem; margin: 3px 0; }
.ach-toast-desc { font-size: .85rem; opacity: .8; }
.ach-toast.tier-bronze { border-left-color: #9c6b34; }
.ach-toast.tier-silver { border-left-color: #7c7c7c; }
.ach-toast.tier-gold   { border-left-color: #b08a2c; }
.reduce-motion .ach-toast { transition: none; }
