.explorer { margin-top: 38px; }
.controls { padding: 18px; background: #dfe9e6dc; border: 1px solid #839a96; border-radius: 18px; box-shadow: 0 12px 34px #153d4614; }
.search { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; min-height: 58px; padding: 0 16px; background: var(--paper); border: 1px solid #78918e; border-radius: 999px; }
.search input { min-width: 0; padding: 15px 0; background: transparent; border: 0; outline: 0; font-size: 1rem; }
.search kbd { padding: 4px 7px; color: var(--paper); background: var(--ink); font: 700 .7rem/1 var(--font-geist-mono); }
.filters { display: flex; flex-wrap: wrap; align-items: end; gap: 14px; margin-top: 14px; }
.filters label { display: grid; gap: 5px; color: var(--muted); font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.filters select { min-height: 42px; padding: 8px 32px 8px 10px; color: var(--ink); background: var(--paper); border: 1px solid #78918e; border-radius: 999px; font-weight: 700; text-transform: none; letter-spacing: 0; }
.resultHeading { display: flex; align-items: center; justify-content: space-between; margin: 34px 0 16px; }
.resultHeading strong { font: 900 1.8rem/1 var(--font-geist-mono); }
.resultHeading button { color: var(--blue); background: transparent; border: 0; font-weight: 800; text-decoration: underline; cursor: pointer; }
.grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px; }
.card { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; min-height: 180px; overflow: hidden; padding: 22px 22px 22px 112px; background: #faf7eeeb; border: 1px solid #91a39f; border-radius: 14px; box-shadow: 0 8px 24px #153d4610; transition: transform .15s ease, box-shadow .15s ease, background .15s ease; }
.card:hover, .card:focus-within { background: #f0f7f4; transform: translateY(-2px); box-shadow: 0 13px 30px #153d461c; }
.cardVisual { position: absolute; top: 50%; left: 17px; display: grid; width: 82px; height: 112px; overflow: hidden; place-items: center; color: var(--blue); opacity: .13; border-radius: 6px; transform: translateY(-50%); pointer-events: none; }
.cardVisual svg { width: 76px; height: 76px; stroke-width: 1.15; }
.cardVisual.hasCover { opacity: 1; background: #fff; border: 1px solid #738e8a66; box-shadow: 0 8px 20px #153d4624; }
.cardVisual img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top center; filter: saturate(.82) contrast(.96); }
.meta { margin-bottom: 9px; color: var(--muted); font: 700 .66rem/1.4 var(--font-geist-mono); text-transform: uppercase; }
.meta span { margin-right: 6px; padding: 3px 5px; color: var(--paper); background: var(--blue); }
.card h2 { font: 500 1.16rem/1.3 var(--font-physics); letter-spacing: -.02em; }
.card h2 a::after { position: absolute; inset: 0; content: ""; }
.author { margin-top: 7px; color: var(--red); font-size: .8rem; font-weight: 750; line-height: 1.45; white-space: pre-line; }
.description { display: -webkit-box; margin-top: 9px; overflow: hidden; color: var(--muted); font-size: .8rem; line-height: 1.5; white-space: pre-line; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.arrow { align-self: start; }
.more { display: flex; margin: 28px auto 0; }
.empty { padding: 60px 20px; text-align: center; border: 2px dashed var(--ink); }
.empty p { margin-bottom: 18px; font-size: 1.2rem; font-weight: 800; }
@media (max-width: 820px) { .grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .card { grid-template-columns: minmax(0, 1fr); min-height: 190px; padding: 19px 16px 19px 91px; } .cardVisual { left: 8px; width: 75px; height: 104px; opacity: .12; } .cardVisual.hasCover { opacity: 1; } .cardVisual svg { width: 68px; height: 68px; } .arrow { display: none; } .filters > svg { display: none; } .filters label { flex: 1 1 140px; } .filters select { width: 100%; } }

/* Planetary archive surfaces */
.controls { position:relative; overflow:hidden; background:linear-gradient(135deg,#e1eee9e8,#f8f4e9e0); border-color:#6d918c73; box-shadow:0 16px 42px #315b5e18; }
.controls::after { position:absolute; width:280px; height:120px; right:-80px; bottom:-82px; content:""; pointer-events:none; border:1px solid #4e858630; border-radius:50%; transform:rotate(-12deg); }
.search { position:relative; z-index:1; background:#fffdf4df; border-color:#6b908b80; box-shadow:0 6px 18px #315b5e0d; }.search kbd { color:#f8f4e9; background:#176b77; border-radius:999px; }
.filters { position:relative; z-index:1; }.filters select { background:#fffdf4e6; border-color:#789a9570; }
.card { background:linear-gradient(145deg,#fffdf4e8,#edf4efdb); border-color:#7c9b9666; border-radius:20px; box-shadow:0 11px 30px #315b5e12; }.card::before { position:absolute; width:170px; height:58px; right:-45px; bottom:-35px; content:""; pointer-events:none; border:1px solid #4d85852b; border-radius:50%; transform:rotate(-18deg); }
.card:hover,.card:focus-within { background:#f4faf6; box-shadow:0 16px 38px #315b5e20; }.cardVisual { color:#176b77; }.cardVisual:not(.hasCover) { opacity:.1; }.meta span { background:#176b77; border-radius:999px; }.author { color:#a24f3e; }.arrow { color:#176b77; }
