/* ============================================================================
room-discovery-lens.css — the interior of the Explore Room.
furnishing-vessel-interiors S3 (DT authoring). Presentation only.
Spec: docs/room-specs/07-explore.md — committed before this file.
Pattern: the S2-accepted pair (room-librarians-desk / room-lineage-dial).
── THE SEAM ───────────────────────────────────────────────────────────────
buildWindow() stamps `.ffrw-shell.ffrw-vessel.ffrw-explore`; the view-room
factory reparents `#view-explore` into `.ffrw-body` with `.ffrw-hosted`.
Everything below rides
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted
so the flat App-Panel view and mobile are untouched by construction, and
the single-step revert is this file plus its one .
── WHAT THIS FILE MAY NOT DO ──────────────────────────────────────────────
No handler, no label, no route, no truthful string, no bang-important, no
new scroll owner (.explore-grid is the one, flat and in-room alike). The
person-thumb circle is a truthful type distinction and is KEPT. Family
headshots are content, never texture (D1 §10.4) — no filter, no crop, no
tint touches an .
WITHHELD (spec §6): the Fergi aperture, and every census behavioral
finding (BR-06/12/48–56) — they are code defects, not dress; zero markup
and zero handlers change here.
============================================================================ */
/* ── The well ─────────────────────────────────────────────────────────────
Host-root treatment (D1 §1.2): the view's own near-black navy
(rgba(10,10,24,.95), explore.css:203) yields so the vessel's admitted
ground is THE ground. The grid keeps scroll custody it already owns. */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted {
--dv-gutter: 20px;
--dv-ink: var(--ffvr-ink, #F0FAFF);
--dv-ink-muted: var(--ffvr-ink-muted, #B6C0C7);
--dv-rule: color-mix(in srgb, var(--ffvr-rule, #15A9DF) 32%, transparent);
--dv-rule-strong: color-mix(in srgb, var(--ffvr-rule, #15A9DF) 58%, transparent);
--dv-plane: var(--ffvr-surface-raised, #1F2833);
--dv-plane-hover: color-mix(in srgb, var(--ffvr-surface-raised, #1F2833) 90%, var(--ffvr-ink, #F0FAFF) 10%);
--dv-accent: var(--ffvr-accent, #9A67E8);
background: transparent;
color: var(--dv-ink);
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-grid {
scroll-padding-block-start: 16px;
scroll-padding-block-end: 24px;
}
/* ── The operational rail (D1 §2.3) ───────────────────────────────────────
No chrome custody reaches this room (.explore-header matches no
HEADER_SELECTORS entry), so — the FN-accepted case — the rail takes the
Room's own rail ground and one bottom divider. Controls keep their DOM
order: search, then the filter ring. */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-header {
background: color-mix(in srgb, var(--dv-plane) 8%, var(--ffvr-surface, #0D1622));
border-bottom: 1px solid var(--dv-rule);
padding: 12px var(--dv-gutter) 0;
margin-bottom: 12px;
}
/* Search: a control ground on the Room's own material. */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-search {
background: color-mix(in srgb, var(--dv-plane) 72%, var(--ffvr-surface-sunken, #000) 28%);
border: 1px solid var(--dv-rule-strong);
color: var(--dv-ink);
border-radius: 8px;
min-height: 36px;
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-search::placeholder {
color: var(--dv-ink-muted);
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-search:focus {
background: color-mix(in srgb, var(--dv-plane) 84%, var(--ffvr-surface-sunken, #000) 16%);
border-color: var(--dv-accent);
}
/* ── The filter ring: tabs as the Room's pill pair (D1 §3.7, §4.4) ────────
The indigo active chip (rgba(100,120,255,…)) and the navy hover fill
belong to no part of this vessel; active is the accent-tinted state on
the Room ground. Handlers and DOM order untouched. */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-tab {
background: transparent;
border: 1px solid var(--dv-rule);
color: var(--dv-ink-muted);
min-height: 32px;
transition: background 150ms, color 150ms, border-color 150ms;
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-tab:hover {
background: color-mix(in srgb, var(--dv-plane) 60%, transparent);
color: var(--dv-ink);
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-tab-active {
background: color-mix(in srgb, var(--dv-accent) 16%, transparent);
border-color: var(--dv-accent);
color: var(--dv-ink);
}
/* ── The specimens: cards as glass plates (D1 §5.4, §6.1) ─────────────────
Plane ground, rule border, inset highlight; the −3px lift exceeds D1
§3.7's cap and is brought to −1px. The person-circle's accent ring
already reads the Room token by construction and is untouched. */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card {
background: var(--dv-plane);
border: 1px solid var(--dv-rule);
border-radius: 12px;
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045);
transition: transform 150ms, box-shadow 150ms, border-color 150ms, background 150ms;
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card:hover {
transform: translateY(-1px);
background: var(--dv-plane-hover);
border-color: var(--dv-rule-strong);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, .045), 0 6px 18px rgba(0, 0, 0, .24);
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card-title {
color: var(--dv-ink);
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card-subtitle {
color: var(--dv-ink-muted);
}
/* The glyph fallback: the exact foreign pair the accepted pattern dissolves
— #667eea→#764ba2 at quarter-alpha — becomes the Room's own recessed
ground. The glyph stays content-informative; only the wash changes. */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card-thumb-glyph {
background: color-mix(in srgb, var(--dv-plane) 72%, var(--ffvr-surface-sunken, #000) 28%);
color: var(--dv-ink-muted);
}
/* ── Type chips: five foreign inks dissolve to the Room's pill grammar ────
#8090ff · #ffa040 · #ff6496 · #50c878 · #b478ff carried the taxonomy by
hue; the chip's TEXT carries it by name, so nothing truthful is lost.
(Spec §6.3 records the one-block reversal if S4 rules the hues load-
bearing.) */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-type-chip {
background: color-mix(in srgb, var(--ffvr-rule, #15A9DF) 14%, transparent);
color: var(--dv-ink-muted);
}
/* ── Load More: a quiet Room control, not an indigo chip ──────────────────*/
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-load-btn {
background: transparent;
border: 1px solid var(--dv-rule);
color: var(--dv-ink-muted);
transition: background 150ms, color 150ms, border-color 150ms;
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-load-btn:hover {
background: color-mix(in srgb, var(--dv-accent) 14%, transparent);
border-color: var(--dv-accent);
color: var(--dv-ink);
}
/* ── The other surfaces of the same Room ──────────────────────────────────
Loading, empty and error keep their behaviour and copy (empty and error
share .explore-empty); only the ink joins the Room. */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-empty {
color: var(--dv-ink-muted);
}
/* ── Focus is the universal treatment on every control (D1 §3.6) ──────────
Cards are
s today (census BR-12, a code defect this file may not
fix); their rule is authored so it engages the moment they become
focusable. */
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-search:focus-visible,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-tab:focus-visible,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-load-btn:focus-visible,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card:focus-visible {
outline: 3px solid #FFFFFF;
outline-offset: 2px;
box-shadow: 0 0 0 1px #000000;
}
/* ── Reduced motion (the floor plus the list — pilot pattern) ─────────────*/
@media (prefers-reduced-motion: reduce) {
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted * {
transition: none;
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-tab,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-load-btn,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-search {
transition: none;
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card:hover {
transform: none;
}
}
/* ── Forced colours ───────────────────────────────────────────────────────
Restore system borders so plates and controls keep their shapes; the
active tab gets the system's selected pairing; essential text never sits
under an opacity (the pilots' masthead trap). */
@media (forced-colors: active) {
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-card,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-tab,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-load-btn,
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-search {
border: 1px solid ButtonBorder;
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-tab-active {
border: 2px solid Highlight;
}
.ffrw-explore .ffrw-body > #view-explore.ffrw-hosted .explore-type-chip {
opacity: 1;
}
}
/* ═══════════════════════════════════════════════════════════════════════════
EXPLORE v14 — the ported Discovery Lens. (porting-perimeter-souls S3)
Everything below this line is reached ONLY through `html.ffv-modal-fleet-v14`.
With the flag off not one selector here matches, and the room renders exactly
as the lines above render it. The SHELL half needs the flag class because
`.ffvc-rim-glow`, `.ffvc-body` and `.ffvc-lip` are drawn by room-windows.css
in BOTH states.
── THE GRAPH KEEPS ITS FIELD, WHICH IS THE POINT OF THIS ROOM ──────────
Nothing here touches `.ffrw-header`'s or `.ffrw-body`'s insets, and the
existing zoom and pan are untouched — a chassis port cannot reach them. The
port's only geometry is vertical, through the theme's own DERIVED keep-outs
(148 / 95, from 88 / 66), of which ONE unit is the decoration: headerKeepOut
is LIP-DRIVEN outright, so the clamped starfield costs the workspace nothing
at all, and the foot is azimuth-driven at 95 where the lip alone asks 94. The
lab's orbit arc, which would have cost 259 units of foot — 37% of the vessel
— is dropped rather than admitted. 148/700 is 21.1% against the Navigator's
praised 20.4%; the old 88 was 12.6%.
Widths are the lab's times the geometric mean sqrt(0.625 * 0.7) = 0.6614.
═══════════════════════════════════════════════════════════════════════════ */
html.ffv-modal-fleet-v14 .ffrw-explore {
--v14-amber: #f2b84b; /* the lab's --room-a */
--v14-azure: #55b8ff; /* the lab's --room-b */
--v14-violet: #9d5fe0; /* the lab's --room-c */
--v14-metal: #40e2d2; /* the lab's --room-metal */
}
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-rim-glow { stroke-width: 6.61; opacity: .24; } /* lab 10 x 0.6614 */
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-body { stroke-width: 2.65; } /* lab 4 x 0.6614 */
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-lip { stroke: rgba(220, 246, 255, .45); stroke-width: .99; opacity: 1; } /* lab 1.5 x 0.6614 */
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-observatory path,
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-bearings path {
fill: none;
stroke-linecap: round;
stroke-linejoin: round;
}
/* the head: the dome, and the horizon it answers to — one weight, the lab's,
because they are the same instrument seen at two ends of the barrel */
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-dome,
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-horizon {
stroke: color-mix(in srgb, var(--v14-azure) 66%, transparent);
stroke-width: 1.32; /* lab 2 x 0.6614 */
}
/* the six fixed stars, clamped toward the dome (see the theme) */
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-star {
fill: #f8fbff;
stroke: var(--v14-azure);
stroke-width: 1.32; /* lab 2 x 0.6614 */
}
/* the lens crest — the one hero in this batch already seated inside its crown */
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-hero-ring { fill: rgba(4, 15, 26, .96); stroke-width: 1.46; } /* lab 2.2 x 0.6614 */
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-hero-line {
fill: none;
stroke: color-mix(in srgb, var(--v14-amber) 78%, #ffffff 8%);
stroke-width: 1.32; /* lab 2 x 0.6614 */
}
/* the foot: the azimuth ticks that graduate the horizon */
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-azimuth {
stroke: var(--v14-metal);
stroke-width: 1.65; /* lab 2.5 x 0.6614 */
}
/* ── motion: the stars breathe, and nothing moves ──────────────────────────
The lab pulses alternate stars — an OPACITY animation, carried here under
HELPER_CONTRACT §6b (carry animations that change PAINT, refuse animations
that move GEOMETRY, because a transform moves rendered ink while leaving the
geometry getPointAtLength reports untouched and so passes both capture gates
blind). The lab's own restraint for this room is the manifest's: "three fixed
stars and one lens arc; no particle field in launcher" — so there is no
drift, no sweep and no turning crest, and the chassis already stands the
breath down under reduced motion. */
@media (prefers-reduced-motion: no-preference) {
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-star:nth-of-type(2n) {
animation: ffvc-v14-star-pulse 4.8s ease-in-out infinite;
}
}
@keyframes ffvc-v14-star-pulse { 50% { opacity: .2; } }
/* ── forced colours ────────────────────────────────────────────────────────
The UA discards the fills and strokes above. The chassis may disappear; what
may not happen is the dome, the horizon and the stars surviving as unstyled
black-on-black shapes across the room's head and foot. */
@media (forced-colors: active) {
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-star,
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-hero-ring {
fill: Canvas;
stroke: CanvasText;
}
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-dome,
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-horizon,
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-azimuth,
html.ffv-modal-fleet-v14 .ffrw-explore .ffvc-v14-hero-line {
stroke: CanvasText;
}
}