:root {
  --bg: #080819; --surface: rgba(18, 19, 45, .78); --surface-solid: #11132d;
  --line: rgba(150, 147, 205, .17); --line-bright: rgba(119, 230, 216, .52);
  --text: #f3f0ff; --muted: #aaa7c1; --accent: #77e6d8; --accent-deep: #183d42;
  --lavender: #a990ed; --danger: #f1a5bd; --radius: 18px; --max: 1280px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; color: var(--text); background: var(--bg); font-family: "Space Grotesk", sans-serif; overflow-x: hidden; }
button, input { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; }
.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; }
#starfield, .ambient-grid, .scanlines { position: fixed; inset: 0; pointer-events: none; }
#starfield { z-index: -3; }
.ambient-grid { z-index: -2; opacity: .13; background-image: linear-gradient(rgba(119,230,216,.12) 1px, transparent 1px),linear-gradient(90deg,rgba(119,230,216,.12) 1px,transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(to bottom,transparent 5%,black 60%,transparent 100%); transform: perspective(520px) rotateX(66deg) scale(1.7) translateY(35%); transform-origin: bottom; }
.scanlines { z-index: 30; opacity: .028; background: repeating-linear-gradient(to bottom,transparent 0,transparent 3px,#fff 4px); }
body::before, body::after { content:""; position: fixed; z-index:-2; border-radius:50%; filter: blur(110px); opacity:.16; }
body::before { width:440px;height:440px;background:var(--accent);left:-240px;top:25%; }
body::after { width:540px;height:540px;background:var(--lavender);right:-300px;top:5%; }
.site-header, main, footer { width: min(calc(100% - 40px), var(--max)); margin-inline:auto; }
.site-header { min-height: 84px; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid var(--line); }
.brand { color:var(--text); text-decoration:none; font:500 12px "DM Mono", monospace; letter-spacing:.14em; }
.brand-mark { color:var(--accent); text-shadow:0 0 14px var(--accent); margin-right:8px; }
.system-status, .eyebrow { font:500 10px "DM Mono", monospace; letter-spacing:.15em; color:var(--muted); }
.status-dot { display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);box-shadow:0 0 9px var(--accent);margin-right:8px; }
.intro { min-height: 430px; padding: 90px 4vw 64px; display:grid; grid-template-columns:minmax(0, 1fr) 260px; align-items:center; gap:50px; }
.eyebrow { margin:0 0 15px; color:var(--accent); }
h1 { font-size:clamp(3rem,7vw,6.6rem); line-height:.9; letter-spacing:-.065em; margin:0; max-width:850px; }
h1 span { color:var(--accent); text-shadow:0 0 30px rgba(119,230,216,.16); }
.intro-copy { max-width:590px;color:var(--muted);font-size:clamp(1rem,1.5vw,1.18rem);line-height:1.65;margin:32px 0 0; }
.orbit-note { position:relative; width:210px;height:210px;display:grid;place-items:center;justify-self:end; }
.orbit { position:absolute;inset:10px;border:1px dashed rgba(119,230,216,.4);border-radius:50%;animation:spin 30s linear infinite; }
.orbit::before { content:"✦";position:absolute;top:20px;left:18px;color:var(--accent); }
.mini-planet { width:76px;height:76px;border:1px solid var(--line-bright);border-radius:50%;display:grid;place-items:center;color:var(--accent);background:var(--surface);box-shadow:inset 0 0 28px rgba(119,230,216,.08),0 0 24px rgba(119,230,216,.1); }
.orbit-note p { position:absolute;right:-6px;bottom:22px;text-align:right;font:10px/1.4 "DM Mono";color:var(--muted); }
@keyframes spin { to { transform:rotate(360deg); } }
.module { position:relative;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);backdrop-filter:blur(18px);box-shadow:inset 0 1px rgba(255,255,255,.03),0 24px 80px rgba(0,0,0,.16);clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px)); }
.filter-panel { padding:24px 26px 0;position:sticky;top:14px;z-index:10; }
.filter-panel::before { content:"";position:absolute;left:20px;top:-1px;width:65px;height:1px;background:var(--accent);box-shadow:0 0 10px var(--accent); }
.filter-head { display:flex;justify-content:space-between;gap:20px;align-items:start; }
.filter-head h2 { margin:0;font-size:1.25rem;letter-spacing:-.025em; }
.search-wrap { height:48px;margin-top:22px;display:flex;align-items:center;gap:10px;padding:0 14px;border:1px solid var(--line);border-radius:12px;background:#0b0c20;transition:.25s ease; }
.search-wrap:focus-within { border-color:var(--accent);box-shadow:0 0 0 3px rgba(119,230,216,.08),0 0 24px rgba(119,230,216,.08); }
.search-icon { color:var(--accent);font:20px "DM Mono"; }
.search-wrap input { min-width:0;flex:1;height:100%;border:0;outline:0;background:transparent;color:var(--text);font-size:.95rem; }
.search-wrap input::placeholder { color:#74728c; }
.search-wrap input::-webkit-search-cancel-button { display:none; }
.clear-search { flex:0 0 34px;width:34px;height:34px;border:0;border-radius:8px;background:rgba(119,230,216,.07);color:var(--muted);font-size:1.25rem;line-height:1;cursor:pointer;transition:.2s ease; }
.clear-search:hover { background:rgba(119,230,216,.14);color:var(--accent); }
.clear-search[hidden] { display:none; }
.reset-button,.primary-button { border:1px solid var(--line-bright);background:rgba(119,230,216,.06);border-radius:10px;min-height:42px;padding:0 15px;cursor:pointer;font:500 11px "DM Mono";transition:.25s ease; }
.reset-button:hover,.primary-button:hover { transform:translateY(-2px);box-shadow:0 0 22px rgba(119,230,216,.13);background:rgba(119,230,216,.1); }
kbd { font:9px "DM Mono";padding:2px 5px;border:1px solid var(--line);border-radius:4px;background:#0b0c20;color:var(--muted); }
.filter-groups { display:flex;flex-wrap:wrap;gap:20px 30px;margin-top:24px; }
.filter-group { display:flex;align-items:center;flex-wrap:wrap;gap:8px; }
.group-label { font:10px "DM Mono";letter-spacing:.12em;color:var(--muted);margin-right:3px; }
.filter-chip { min-height:38px;display:inline-flex;align-items:center;gap:8px;padding:0 12px;border:1px solid var(--line);border-radius:999px;background:#0c0d22;cursor:pointer;color:#cbc7dc;font-size:.84rem;transition:.25s ease; }
.filter-chip:hover { border-color:var(--line-bright);transform:translateY(-1px); }
.filter-chip[aria-pressed="true"] { color:#071514;background:var(--accent);border-color:var(--accent);box-shadow:0 0 18px rgba(119,230,216,.18); }
.filter-chip.rating-suggestive[aria-pressed="true"] { background:#e8b7d2;border-color:#e8b7d2; }
.filter-chip.rating-nsfw[aria-pressed="true"] { background:#d5a6f0;border-color:#d5a6f0; }
.chip-count { font:10px "DM Mono";opacity:.7; }
.results-line { min-height:50px;margin-top:22px;border-top:1px solid var(--line);display:flex;align-items:center;gap:7px;font:11px "DM Mono";color:var(--muted); }
.results-line strong { color:var(--accent); }
.results-pulse { width:5px;height:5px;border-radius:50%;background:var(--accent);box-shadow:0 0 8px var(--accent); }
.shuffle-note { margin-left:auto; }
.gallery-section { padding:42px 0 90px; }
.gallery { columns:4 260px;column-gap:18px; }
.art-card { width:100%;display:block;margin:0 0 18px;padding:0;border:0;background:transparent;text-align:left;cursor:pointer;break-inside:avoid;opacity:0;animation:reveal .38s ease forwards; }
@keyframes reveal { from{opacity:0;transform:translateY(10px)} to{opacity:1;transform:none} }
.art-frame { position:relative;overflow:hidden;border-radius:15px;background:#101129;border:1px solid var(--line);transition:.3s ease; }
.art-frame::after { content:"";position:absolute;inset:0;box-shadow:inset 0 0 0 1px rgba(255,255,255,.03);border-radius:inherit;pointer-events:none; }
.art-card:hover .art-frame,.art-card:focus-visible .art-frame { transform:translateY(-4px);border-color:var(--line-bright);box-shadow:0 16px 45px rgba(0,0,0,.32),0 0 24px rgba(119,230,216,.1); }
.art-frame img { display:block;width:100%;height:auto;min-height:170px;object-fit:cover;background:#11132c; }
.card-overlay { position:absolute;left:0;right:0;bottom:0;padding:50px 15px 14px;background:linear-gradient(transparent,rgba(6,6,20,.88));opacity:0;transform:translateY(5px);transition:.25s ease; }
.art-card:hover .card-overlay,.art-card:focus-visible .card-overlay { opacity:1;transform:none; }
.card-title { display:block;font-size:.92rem;font-weight:600; }
.card-meta { display:block;margin-top:4px;font:9px "DM Mono";letter-spacing:.09em;color:var(--accent);text-transform:uppercase; }
.empty-state { text-align:center;padding:70px 24px; }
.empty-icon { color:var(--accent);font-size:2rem; }.empty-state p{color:var(--muted)}
footer { min-height:90px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;font:9px "DM Mono";letter-spacing:.13em;color:var(--muted); }
.lightbox { width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:24px;border:0;background:rgba(4,4,15,.91);backdrop-filter:blur(18px);color:var(--text); }
.lightbox::backdrop { background:rgba(4,4,15,.88); }
.lightbox-shell { width:min(1180px,100%);height:100%;margin:auto;display:grid;grid-template-columns:52px minmax(0,1fr) 310px 52px;align-items:center;gap:20px;position:relative; }
.lightbox-art-wrap { min-width:0;max-height:90vh;display:grid;place-items:center; }
.lightbox-art-wrap img { max-width:100%;max-height:88vh;object-fit:contain;border-radius:14px;border:1px solid var(--line);box-shadow:0 30px 100px rgba(0,0,0,.45); }
.lightbox-info h2 { font-size:clamp(1.8rem,3vw,2.8rem);line-height:1;margin:0 0 12px;letter-spacing:-.04em; }
.artist-line { color:var(--muted);margin:0 0 22px; }
.detail-tags { display:flex;flex-wrap:wrap;gap:7px; }
.detail-tag { border:1px solid var(--line);background:rgba(119,230,216,.05);border-radius:999px;padding:7px 10px;color:var(--accent);font:10px "DM Mono";cursor:pointer; }
.detail-tag:hover { border-color:var(--accent); }
.lightbox-hint { margin-top:30px;color:var(--muted);font:9px "DM Mono"; }
.icon-button,.nav-button { border:1px solid var(--line);background:var(--surface);cursor:pointer;border-radius:50%;width:46px;height:46px;font-size:1.15rem;transition:.2s; }
.icon-button:hover,.nav-button:hover { border-color:var(--accent);color:var(--accent); }
.close-button { position:absolute;right:0;top:0;z-index:2; }
@media (max-width:850px) {
  .intro{grid-template-columns:1fr;padding-block:65px}.orbit-note{display:none}.filter-panel{position:relative;top:auto}.lightbox{padding:16px}.lightbox-shell{grid-template-columns:44px 1fr 44px;grid-template-rows:1fr auto}.lightbox-info{grid-column:1/-1;padding:4px 50px 0}.lightbox-art-wrap{grid-column:2}.prev-button{grid-column:1;grid-row:1}.next-button{grid-column:3;grid-row:1}.close-button{width:40px;height:40px}.lightbox-hint{display:none}
}
@media (max-width:600px) {
  .site-header,main,footer{width:min(calc(100% - 24px),var(--max))}.site-header{min-height:66px}.system-status{font-size:0}.system-status::after{content:"ONLINE";font-size:9px}.intro{padding:52px 4px 44px;min-height:0}.intro-copy{margin-top:22px}.filter-panel{padding:20px 16px 0}.filter-head{align-items:center}.filter-head .eyebrow{display:none}.filter-head h2{font-size:1rem}.reset-button kbd{display:none}.search-wrap{margin-top:17px}.filter-groups{gap:17px;margin-top:20px}.filter-group{width:100%}.group-label{width:100%}.filter-chip{min-height:42px;flex:1;justify-content:center}.shuffle-note{display:none}.gallery-section{padding-top:24px}.gallery{columns:2 140px;column-gap:10px}.art-card{margin-bottom:10px}.card-overlay{opacity:1;transform:none;padding:35px 10px 10px}.card-title{font-size:.78rem}.card-meta{font-size:8px}.lightbox-shell{gap:5px}.lightbox-info{padding-inline:8px}.lightbox-art-wrap img{max-height:58vh}.nav-button{width:38px;height:38px}footer{min-height:75px;gap:15px}footer span:last-child{display:none}
}
@media (prefers-reduced-motion: reduce) { *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}.ambient-grid{transform:none} }
