:root {
  --bg: #07131b;
  --bg-soft: #0d202a;
  --panel: rgba(13, 31, 40, .88);
  --panel-solid: #102832;
  --text: #effbf8;
  --muted: #9eb7b5;
  --line: rgba(181, 232, 222, .16);
  --accent: #62dfc5;
  --accent-strong: #2fc6aa;
  --accent-ink: #03251f;
  --warm: #ffd166;
  --shadow: 0 18px 55px rgba(0, 0, 0, .24);
  --radius: 18px;
  color-scheme: dark;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

html[data-theme="sakura"] { --bg:#251523; --bg-soft:#3a1c32; --panel:rgba(48,25,43,.9); --panel-solid:#351c30; --text:#fff4f8; --muted:#d6afbf; --line:rgba(255,190,216,.2); --accent:#ff8fba; --accent-strong:#f2649b; --accent-ink:#3d0920; --warm:#ffd0a8; }
html[data-theme="dragon"] { --bg:#1c0c08; --bg-soft:#36140d; --panel:rgba(43,18,12,.9); --panel-solid:#34150f; --text:#fff4e7; --muted:#d2ad94; --line:rgba(255,183,120,.2); --accent:#ff934d; --accent-strong:#ef692a; --accent-ink:#321006; --warm:#ffd166; }
html[data-theme="aura"] { --bg:#0c1021; --bg-soft:#171d3d; --panel:rgba(18,24,50,.91); --panel-solid:#151c3b; --text:#fff8dd; --muted:#c6c09a; --line:rgba(255,222,100,.2); --accent:#ffd34e; --accent-strong:#f0b529; --accent-ink:#2d2302; --warm:#ff9948; }
html[data-theme="stars"] { --bg:#080d2b; --bg-soft:#141c50; --panel:rgba(15,23,65,.9); --panel-solid:#111a48; --text:#f3f4ff; --muted:#adb6e0; --line:rgba(177,189,255,.2); --accent:#aabaff; --accent-strong:#849aff; --accent-ink:#111a47; --warm:#d4a8ff; }
html[data-theme="synth"] { --bg:#15062f; --bg-soft:#310b4c; --panel:rgba(32,9,58,.9); --panel-solid:#270b43; --text:#fff0fc; --muted:#d7a8dc; --line:rgba(255,97,222,.22); --accent:#ff5fdc; --accent-strong:#dc39bc; --accent-ink:#3b0732; --warm:#8f7aff; }
html[data-theme="matrix"] { --bg:#020b06; --bg-soft:#061a0d; --panel:rgba(4,22,11,.91); --panel-solid:#061b0e; --text:#ddffe8; --muted:#86c89b; --line:rgba(72,255,136,.2); --accent:#45f78b; --accent-strong:#20cf66; --accent-ink:#03220e; --warm:#9bffbc; }
html[data-theme="ocean"] { --bg:#05233a; --bg-soft:#0b405c; --panel:rgba(7,48,73,.9); --panel-solid:#0a3b58; --text:#ecfbff; --muted:#a6d5e3; --line:rgba(111,220,255,.2); --accent:#58d6ff; --accent-strong:#27add8; --accent-ink:#062c3b; --warm:#76edca; }
html[data-theme="aurora"] { --bg:#060c20; --bg-soft:#0c2540; --panel:rgba(8,25,46,.9); --panel-solid:#0a2038; --text:#ecfff7; --muted:#9fd2bd; --line:rgba(101,255,182,.18); --accent:#65f0b1; --accent-strong:#37c98b; --accent-ink:#06271b; --warm:#b493ff; }
html[data-theme="snow"] { --bg:#14243e; --bg-soft:#253f67; --panel:rgba(28,48,78,.9); --panel-solid:#213958; --text:#f6faff; --muted:#bdd0e8; --line:rgba(202,229,255,.2); --accent:#9edbff; --accent-strong:#6dbbe9; --accent-ink:#11324a; --warm:#e3efff; }
html[data-theme="classic"] { --bg:#eef1f5; --bg-soft:#fff; --panel:rgba(255,255,255,.96); --panel-solid:#fff; --text:#16202a; --muted:#5f6e7b; --line:rgba(25,52,70,.15); --accent:#2466d1; --accent-strong:#1e55ad; --accent-ink:#fff; --warm:#a15c00; --shadow:0 14px 38px rgba(30,50,70,.12); color-scheme:light; }
html[data-theme="custom"] { --bg:#0a0d12; --bg-soft:#171c24; --panel:rgba(8,13,19,.78); --panel-solid:#111821; --text:#f6f8fb; --muted:#b3becb; --line:rgba(255,255,255,.17); --accent:#7fe5d1; --accent-strong:#55c9b3; --accent-ink:#06241f; --warm:#ffcf70; }

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--bg); scroll-behavior: smooth; }
body { min-height: 100vh; margin: 0; color: var(--text); background:
  radial-gradient(circle at 12% 5%, color-mix(in srgb, var(--accent) 14%, transparent) 0, transparent 31rem),
  radial-gradient(circle at 90% 32%, color-mix(in srgb, var(--warm) 9%, transparent) 0, transparent 26rem),
  linear-gradient(155deg, var(--bg-soft), var(--bg) 45%); background-attachment: fixed; }
button, input, select { font: inherit; }
button, select { cursor: pointer; }
a { color: var(--accent); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }

.ambient { position: fixed; inset: 0; pointer-events: none; overflow: hidden; opacity: .6; }
.ambient span { position:absolute; width:24rem; height:24rem; border:1px solid color-mix(in srgb, var(--accent) 12%, transparent); border-radius:42% 58% 62% 38%; animation: drift 22s linear infinite; }
.ambient span:nth-child(1) { left:-12rem; top:18%; }
.ambient span:nth-child(2) { right:-13rem; top:8%; animation-duration:29s; animation-direction:reverse; }
.ambient span:nth-child(3) { left:45%; bottom:-20rem; animation-duration:35s; }
@keyframes drift { to { transform: rotate(360deg); } }

#custom-background { display:none; position:fixed; inset:0; z-index:-1; background:#05070a center/cover no-repeat; }
#custom-background::after { content:""; position:absolute; inset:0; background:rgba(0,0,0,.52); }
#custom-background img, #custom-background video { width:100%; height:100%; object-fit:cover; }
html[data-theme="custom"] #custom-background { display:block; }

.site-header { position:sticky; top:0; z-index:10; border-bottom:1px solid var(--line); background:color-mix(in srgb, var(--bg) 82%, transparent); backdrop-filter:blur(18px); }
.header-inner { max-width:1180px; min-height:74px; margin:auto; padding:10px 24px; display:flex; align-items:center; justify-content:space-between; gap:20px; }
.brand { display:flex; align-items:center; gap:12px; color:var(--text); text-decoration:none; }
.brand-mark { display:grid; place-items:center; width:42px; height:42px; border:1px solid color-mix(in srgb, var(--accent) 45%, transparent); border-radius:13px; color:var(--accent); background:color-mix(in srgb, var(--accent) 12%, transparent); font-weight:800; letter-spacing:-.08em; }
.brand strong, .brand small { display:block; }
.brand strong { font-size:1rem; letter-spacing:.01em; }
.brand small { margin-top:2px; color:var(--muted); font-size:.75rem; }
.header-actions { display:flex; align-items:end; gap:10px; }

main { position:relative; max-width:1180px; margin:auto; padding:48px 24px 72px; }
.search-panel { padding:32px; border:1px solid var(--line); border-radius:26px; background:linear-gradient(140deg, color-mix(in srgb, var(--panel-solid) 94%, transparent), var(--panel)); box-shadow:var(--shadow); }
.search-panel h1 { max-width:720px; margin:0 0 22px; font-family:Georgia, "Times New Roman", serif; font-size:clamp(2rem, 4.5vw, 4rem); font-weight:500; line-height:1.02; letter-spacing:-.04em; }
.search-box { display:flex; align-items:center; min-height:60px; border:1px solid color-mix(in srgb, var(--accent) 42%, var(--line)); border-radius:16px; background:color-mix(in srgb, var(--bg) 58%, transparent); box-shadow:0 0 0 5px color-mix(in srgb, var(--accent) 5%, transparent); }
.search-box:focus-within { border-color:var(--accent); box-shadow:0 0 0 4px color-mix(in srgb, var(--accent) 15%, transparent); }
.search-box svg { width:24px; margin-left:18px; fill:none; stroke:var(--accent); stroke-width:1.8; }
.search-box input { flex:1; min-width:0; padding:17px 14px; border:0; outline:0; color:var(--text); background:transparent; font-size:1.05rem; }
.search-box input::placeholder { color:color-mix(in srgb, var(--muted) 80%, transparent); }
kbd { margin-right:14px; padding:3px 8px; border:1px solid var(--line); border-bottom-width:2px; border-radius:6px; color:var(--muted); background:var(--panel-solid); font:700 .75rem/1.4 ui-monospace, monospace; }
.filter-row { display:flex; flex-wrap:wrap; gap:8px; margin-top:20px; }
.filter-chip { padding:8px 13px; border:1px solid var(--line); border-radius:999px; color:var(--muted); background:transparent; font-size:.88rem; }
.filter-chip:hover { border-color:color-mix(in srgb, var(--accent) 50%, var(--line)); color:var(--text); }
.filter-chip[aria-pressed="true"] { border-color:var(--accent); color:var(--accent-ink); background:var(--accent); font-weight:700; }
.select-grid { display:grid; grid-template-columns:minmax(150px,1fr) minmax(150px,1fr) auto; align-items:end; gap:12px; margin-top:18px; }
.select-field { display:grid; gap:6px; color:var(--muted); font-size:.78rem; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.select-field select { width:100%; min-height:44px; padding:0 36px 0 12px; border:1px solid var(--line); border-radius:11px; color:var(--text); background:var(--panel-solid); text-transform:none; letter-spacing:normal; }
.select-field.compact { display:flex; align-items:center; gap:8px; white-space:nowrap; }
.select-field.compact select { min-height:38px; width:auto; }
.quiet-button, .load-more { min-height:44px; padding:0 15px; border:1px solid var(--line); border-radius:11px; color:var(--text); background:color-mix(in srgb, var(--panel-solid) 90%, transparent); }
.quiet-button:hover, .load-more:hover { border-color:var(--accent); }

.results-section { margin-top:42px; }
.results-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:16px; }
.results-heading h2 { margin:2px 0 0; font:500 1.8rem/1.1 Georgia, serif; }
.eyebrow { margin:0; color:var(--accent); font-size:.75rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
#result-status { margin:0; color:var(--muted); font-size:.9rem; text-align:right; }
.results-list { display:grid; gap:12px; }
.entry-card { border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); box-shadow:0 8px 26px rgba(0,0,0,.1); overflow:hidden; }
.entry-card[open] { border-color:color-mix(in srgb, var(--accent) 45%, var(--line)); }
.entry-card summary { display:grid; grid-template-columns:1fr auto; gap:14px; padding:19px 20px; cursor:pointer; list-style:none; }
.entry-card summary::-webkit-details-marker { display:none; }
.entry-card summary:focus-visible, button:focus-visible, select:focus-visible, input:focus-visible, a:focus-visible { outline:3px solid color-mix(in srgb, var(--accent) 75%, white); outline-offset:3px; }
.entry-title { display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-width:0; }
.entry-title h3 { flex-basis:100%; margin:0; font-size:1.08rem; line-height:1.35; }
.entry-summary { grid-column:1 / -1; margin:0; color:var(--muted); line-height:1.55; }
.entry-caret { align-self:start; width:28px; height:28px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--accent); transition:transform .18s ease; }
.entry-card[open] .entry-caret { transform:rotate(45deg); }
.tag { padding:3px 8px; border:1px solid var(--line); border-radius:999px; color:var(--muted); font-size:.72rem; }
.tag.primary { border-color:transparent; color:var(--accent-ink); background:var(--accent); font-weight:700; }
.tag.mod-link { color:var(--accent); text-decoration:none; }
.tag.mod-link:hover { border-color:var(--accent); text-decoration:underline; text-underline-offset:2px; }
.entry-detail { padding:0 20px 22px; border-top:1px solid var(--line); }
.detail-section { margin-top:20px; }
.detail-section h4 { margin:0 0 8px; color:var(--accent); font-size:.76rem; letter-spacing:.1em; text-transform:uppercase; }
.detail-section p { margin:0; white-space:pre-line; line-height:1.65; }
.detail-list { margin:0; padding-left:19px; color:var(--muted); }
.detail-list li + li { margin-top:5px; }
.mode-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:10px; }
.mode { padding:13px; border:1px solid var(--line); border-radius:12px; background:color-mix(in srgb, var(--bg) 28%, transparent); }
.mode strong { display:block; margin-bottom:5px; }
.mode p { color:var(--muted); font-size:.9rem; }
.relations { display:flex; flex-wrap:wrap; align-items:center; gap:7px; }
.relations strong { margin-right:3px; font-size:.86rem; }
.relation-button { padding:5px 9px; border:1px solid color-mix(in srgb, var(--accent) 30%, var(--line)); border-radius:999px; color:var(--accent); background:transparent; }
.creator-credit { display:grid; gap:7px; padding:14px; border:1px solid color-mix(in srgb, var(--accent) 25%, var(--line)); border-radius:12px; background:color-mix(in srgb, var(--accent) 5%, transparent); }
.creator-credit p { color:var(--muted); }
.creator-name { font-size:1rem; }
.creator-links { display:flex; flex-wrap:wrap; gap:8px; }
.creator-link { padding:6px 10px; border:1px solid color-mix(in srgb, var(--accent) 35%, var(--line)); border-radius:9px; text-decoration:none; font-size:.83rem; font-weight:700; }
.creator-link:hover { border-color:var(--accent); text-decoration:underline; }
.state-card { padding:34px; border:1px dashed var(--line); border-radius:var(--radius); text-align:center; color:var(--muted); }
.state-card h2 { margin:0 0 8px; color:var(--text); font:500 1.45rem Georgia, serif; }
.state-card p { margin:0; }
.load-more { display:block; margin:18px auto 0; min-width:190px; }

footer { max-width:1180px; margin:auto; padding:26px 24px 50px; border-top:1px solid var(--line); color:var(--muted); font-size:.82rem; }
footer p { margin:5px 0; }

@media (max-width:720px) {
  .header-inner { align-items:flex-start; padding:10px 16px; }
  .brand small, .select-field.compact > span { display:none; }
  .header-actions { flex-wrap:wrap; justify-content:flex-end; }
  main { padding:24px 14px 54px; }
  .search-panel { padding:22px 17px; border-radius:20px; }
  .search-panel h1 { font-size:2.35rem; }
  .select-grid { grid-template-columns:1fr 1fr; }
  .select-grid .quiet-button { grid-column:1 / -1; }
  .results-heading { align-items:start; }
  .entry-card summary { padding:16px; }
  .entry-detail { padding:0 16px 18px; }
}

@media (prefers-reduced-motion:reduce) {
  *, *::before, *::after { scroll-behavior:auto !important; animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
}