/* Scoped, progressively enhanced presentation; keep native focus and form semantics. */
.ux-discovery,.ux-continue,.ux-collections,.ux-reading,.ux-result-details,.ux-feedback { padding: 1rem; margin-block: 1rem; box-sizing:border-box; min-width:0; max-width:100%; overflow-wrap:anywhere; }
.ux-discovery input[type="search"] { display:block; width:100%; min-height:48px; box-sizing:border-box; font:inherit; padding:.75rem; border:1px solid var(--line,#cbd5e1); border-radius:.6rem; color:var(--text,#172033); background:var(--surface,#fff); }
.ux-tasks,.ux-next,.ux-continue [data-ux-recent] { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.ux-tasks { margin-block:.75rem; }
.ux-discovery button,.ux-result-details button,.ux-feedback button,.ux-reading button,.ux-dialog button,.ux-continue a,.ux-next a { min-height:44px; max-width:100%; padding:.5rem .75rem; font:inherit; color:inherit; border:1px solid var(--line,#cbd5e1); border-radius:.5rem; background:transparent; overflow-wrap:anywhere; cursor:pointer; }
.ux-discovery select,.ux-reading select,.ux-result-details input { min-height:44px; max-width:100%; font:inherit; margin-inline:.5rem; }
[data-ux-filters] { display:flex; flex-wrap:wrap; gap:.5rem 1rem; min-width:0; }
[data-ux-filters] label { min-width:0; }
.ux-collection-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(240px,100%),1fr)); gap:1rem; }
.ux-collection-grid article,.ux-search-result { padding:.75rem; border:1px solid var(--line,#cbd5e1); border-radius:.6rem; min-width:0; }
.ux-collection-grid li { margin-block:.65rem; }
.ux-collection-grid a,.ux-search-result a { display:inline-flex; align-items:center; min-height:44px; overflow-wrap:anywhere; }
[data-ux-results] { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(280px,100%),1fr)); gap:.65rem; }
[data-ux-results][hidden],.ux-continue[hidden] { display:none; }
.ux-search-result p { margin-block:.5rem; overflow-wrap:anywhere; }
.ux-search-result small { color:var(--muted,#64748b); }
.ux-file-router { display:block; margin-top:1rem; }
.ux-file-router input { display:block; max-width:100%; min-height:44px; margin-top:.5rem; }
.ux-processing { padding:.6rem .8rem; margin-block:.5rem 1rem; border:1px solid var(--line,#cbd5e1); border-radius:.5rem; }
.ux-processing summary,.ux-reading summary,.ux-result-details summary { min-height:44px; cursor:pointer; align-content:center; font-weight:600; }
.ux-result-details { border:1px solid var(--line); border-radius:14px; background:var(--panel-bg,var(--surface)); box-shadow:0 4px 16px rgb(15 23 42 / .04); }
.ux-preview-summary { padding:.15rem .25rem; color:var(--text); font-size:1rem; font-weight:750; }
.ux-preview-toolbar { display:grid; grid-template-columns:auto minmax(0,1fr) minmax(180px,.9fr); gap:.75rem; align-items:center; margin-top:.75rem; padding:.7rem; border:1px solid var(--line); border-radius:12px; background:var(--surface); }
.ux-preview-refresh { border-color:color-mix(in srgb,var(--accent) 36%,var(--line)) !important; background:var(--accent-soft) !important; color:var(--accent-strong,var(--accent)) !important; font-weight:700; }
.ux-preview-refresh:hover { border-color:var(--accent) !important; }
.ux-preview-metrics { display:flex; align-items:center; min-width:0; min-height:36px; margin:0; padding:0 .75rem; border-left:1px solid var(--line); color:var(--muted); font-size:.82rem; font-variant-numeric:tabular-nums; white-space:nowrap; }
.ux-preview-search { display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:.5rem; min-width:0; margin:0; color:var(--muted); font-size:.78rem; font-weight:700; }
.ux-preview-search-input { width:100%; min-width:0; min-height:38px !important; box-sizing:border-box; margin:0 !important; padding:.45rem .65rem; border:1px solid var(--line); border-radius:9px; background:var(--input-bg,var(--surface)); color:var(--text); font:inherit; }
.ux-preview-search-input:focus-visible { outline:2px solid var(--accent); outline-offset:2px; }
.ux-inspector { overflow:auto; max-height:420px; max-width:100%; margin-top:.75rem; }
.ux-inspector table { border-collapse:collapse; min-width:100%; text-align:start; }
.ux-inspector th,.ux-inspector td { padding:.5rem; border:1px solid var(--line,#cbd5e1); max-width:30rem; overflow-wrap:anywhere; vertical-align:top; }
.ux-inspector caption { text-align:start; padding:.5rem; }
.ux-next { margin:.85rem 0 1rem; padding:.8rem .75rem .95rem; border-top:1px solid var(--line,#cbd5e1); }
.ux-next h3,.ux-next p { flex-basis:100%; }
.ux-next h3 { margin:0; font-size:.95rem; }
.ux-next p { margin:.1rem 0 .25rem; color:var(--muted,#64748b); font-size:.82rem; line-height:1.5; }
.ux-next a { min-height:40px; background:var(--surface,#fff); font-size:.82rem; font-weight:650; text-decoration:none; transition:border-color .16s ease,background-color .16s ease,color .16s ease,transform .16s ease; }
.ux-next a:hover { border-color:var(--accent,#7c3aed); background:var(--accent-soft,#ede9fe); color:var(--accent,#7c3aed); transform:translateY(-1px); }
.ux-next a:focus-visible { outline:2px solid var(--accent,#7c3aed); outline-offset:2px; }
.ux-preview-summary { border-radius:8px; transition:color .16s ease,background-color .16s ease; }
.ux-preview-summary:hover { color:var(--accent,#7c3aed); background:var(--accent-soft,#ede9fe); }
.ux-reading label { display:flex; gap:.5rem; align-items:center; min-height:44px; margin-block:.25rem; }
.ux-reading input[type="checkbox"] { width:20px; height:20px; }
.ux-dialog { max-width:min(620px,calc(100vw - 2rem)); box-sizing:border-box; padding:1rem; color:var(--text,#172033); background:var(--surface,#fff); border:1px solid var(--line,#cbd5e1); border-radius:.75rem; }
.ux-dialog textarea { display:block; width:100%; box-sizing:border-box; margin-block:.75rem; font:inherit; min-height:180px; }
.ux-dialog button { margin:.25rem; }
.ux-dialog p { margin:.5rem 0; color:var(--muted,#64748b); line-height:1.55; }
.ux-dialog label { display:block; margin-top:.8rem; font-weight:700; }
.ux-dialog textarea { border:1px solid var(--line,#cbd5e1); border-radius:10px; background:var(--input-bg,var(--surface,#fff)); color:var(--text,#172033); padding:.75rem; resize:vertical; }
.ux-dialog textarea:focus-visible { border-color:var(--accent,#7c3aed); box-shadow:0 0 0 3px var(--accent-soft,#ede9fe); outline:none; }
.ux-feedback-actions { display:flex; flex-wrap:wrap; gap:.5rem; align-items:center; }
.ux-feedback-actions button { margin:0; }
.ux-feedback-submit { background:var(--accent,#7c3aed); color:#fff; border-color:var(--accent,#7c3aed); }
.ux-feedback-submit:disabled { opacity:.65; cursor:wait; }
.ux-feedback-status { min-height:1.4em; }
.ux-dialog::backdrop { background:rgb(0 0 0 / .55); }
html { font-size:calc(100% * var(--ux-text-scale,1)); }
html.ux-underline-links a { text-decoration:underline !important; text-underline-offset:.2em; }
html.ux-high-contrast { --text:#000; --muted:#222; --line:#222; --surface-strong:#fff; --card:#fff; --card-strong:#f3f3f3; --surface:#fff; --bg:#fff; }
html.ux-high-contrast[data-theme="dark"] { --text:#fff; --muted:#eee; --line:#eee; --surface-strong:#080808; --card:#080808; --card-strong:#111; --surface:#080808; --bg:#000; }
@media (prefers-reduced-motion:reduce) { .ux-discovery *, .ux-result-details * { scroll-behavior:auto; transition:none; } }
@media (max-width:767px) { .ux-discovery,.ux-continue,.ux-collections,.ux-reading,.ux-result-details { padding:.75rem; } .ux-dialog { width:calc(100vw - 1rem); } }
@media (max-width:767px) { .ux-preview-toolbar { grid-template-columns:minmax(0,1fr); gap:.5rem; } .ux-preview-metrics { min-height:30px; padding:0; border-left:0; } .ux-preview-search { grid-template-columns:minmax(0,1fr); gap:.3rem; } .ux-preview-search-input { min-height:44px !important; } }
@media (max-width:767px) { .ux-next { margin-bottom:1rem; padding-bottom:1rem; } .ux-next a { min-height:44px; } }
@media (forced-colors:active) { .ux-processing,.ux-search-result,.ux-inspector th,.ux-inspector td { border-color:CanvasText; } }

html.ux-high-contrast body,html.ux-high-contrast .site-header { background:var(--bg); color:var(--text); }

/* Use one search surface, below the catalog heading rather than alongside it. */
.catalog-toolbar:has(.ux-discovery) { display:block; }
.catalog-toolbar:has(.ux-discovery) .catalog-toolbar-search { width:100%; max-width:none; margin-top:1.5rem; }
.catalog-toolbar .ux-discovery,.utility-hero .ux-discovery { padding:0; margin:0; border:0; box-shadow:none; background:transparent; }
.ux-discovery h2 { font-size:1.15rem; margin:0 0 1rem; }
.ux-query-label { display:block; color:var(--muted); font-size:.85rem; font-weight:600; }
.ux-discovery input[type="search"] { margin-top:.5rem; padding:.85rem 1rem; min-height:52px; border-radius:12px; background:var(--input-bg,var(--surface)); color:var(--text); font-size:1rem; }
.ux-discovery input::placeholder { color:var(--muted); opacity:1; font-weight:400; }
.ux-tasks { gap:.5rem; margin-block:1rem; }
.ux-tasks button { border-radius:10px; background:var(--panel-bg,var(--surface)); font-size:.875rem; font-weight:600; }
.ux-discovery button:hover,.ux-reading button:hover { border-color:var(--accent); background:var(--accent-soft); }
[data-ux-filters] { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
[data-ux-filters] label { display:grid; gap:.5rem; color:var(--muted); font-size:.85rem; font-weight:600; }
.ux-discovery select,.ux-reading select { width:100%; min-width:0; margin:0; padding:.65rem .75rem; border:1px solid var(--line); border-radius:10px; color:var(--text); background:var(--input-bg,var(--surface)); font-size:.95rem; }
.ux-file-router { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:1rem; align-items:center; padding:1rem; border:1px dashed var(--line); border-radius:12px; background:var(--panel-bg,var(--surface)); }
.ux-file-title { font-weight:650; font-size:.9rem; }
.ux-file-router small { grid-column:1; color:var(--muted); font-size:.8rem; margin-top:.35rem; }
.ux-file-router input { grid-column:2; grid-row:1 / 3; width:100%; margin:0; color:var(--muted); font-size:.875rem; }
.ux-file-router input::file-selector-button { min-height:44px; padding:.5rem .85rem; margin-inline-end:.65rem; border:1px solid var(--line); border-radius:9px; background:var(--surface); color:var(--text); font:inherit; cursor:pointer; }
.ux-file-router input:hover::file-selector-button { border-color:var(--accent); }
[data-ux-search-status]:empty { display:none; }
[data-ux-search-status] { display:flex; align-items:center; gap:.5rem; min-height:2.5rem; margin:1.25rem 0 .75rem; padding:.55rem .75rem; border:1px solid color-mix(in srgb,var(--accent) 25%,var(--line)); border-radius:10px; background:color-mix(in srgb,var(--accent-soft) 62%,var(--surface)); color:var(--text); font-size:.875rem; font-weight:650; }
[data-ux-search-status]::before { content:'⌕'; display:grid; place-items:center; flex:0 0 auto; width:1.45rem; height:1.45rem; border-radius:7px; background:var(--accent-soft); color:var(--accent); font-weight:800; }
[data-ux-search-status].is-empty { border-color:var(--line); background:var(--panel-bg,var(--surface)); color:var(--muted); font-weight:500; }
[data-ux-search-status].is-empty::before { content:'i'; background:var(--card-strong,var(--accent-soft)); color:var(--muted); }
.ux-discovery-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; margin-bottom:.35rem; }
.ux-discovery-kicker { display:block; margin-bottom:.3rem; color:var(--accent); font-size:.72rem; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
.ux-discovery-heading h2 { margin:0; }
.ux-discovery-hint { max-width:28rem; color:var(--muted); font-size:.82rem; text-align:end; }
.ux-filter-field select { transition:border-color .16s ease,box-shadow .16s ease; }
.ux-filter-field select:hover { border-color:color-mix(in srgb,var(--accent) 46%,var(--line)); }
.ux-filter-field select:focus-visible { border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); outline:none; }
[data-ux-results] { align-items:stretch; }
.ux-search-result { display:flex; flex-direction:column; gap:.7rem; padding:1rem; border-radius:14px; background:linear-gradient(145deg,var(--surface),var(--panel-bg,var(--surface))); box-shadow:0 8px 24px rgb(15 23 42 / .045); transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease; }
.ux-search-result:hover { border-color:color-mix(in srgb,var(--accent) 45%,var(--line)); box-shadow:0 12px 28px color-mix(in srgb,var(--accent) 12%,transparent); transform:translateY(-2px); }
.ux-search-result-header { display:flex; flex-wrap:wrap; align-items:center; gap:.4rem; min-height:1.35rem; }
.ux-search-result-category,.ux-search-result-badge { display:inline-flex; align-items:center; min-height:1.5rem; padding:.2rem .5rem; border-radius:999px; font-size:.7rem; font-weight:750; line-height:1.1; }
.ux-search-result-category { background:var(--card-strong,var(--accent-soft)); color:var(--muted); }
.ux-search-result-badge { border:1px solid color-mix(in srgb,var(--success) 35%,var(--line)); background:color-mix(in srgb,var(--success) 10%,var(--surface)); color:var(--success); }
.ux-search-result-badge-permission { border-color:color-mix(in srgb,var(--warning) 38%,var(--line)); background:color-mix(in srgb,var(--warning) 10%,var(--surface)); color:var(--warning); }
.ux-search-result-badge-limited { border-color:color-mix(in srgb,var(--danger) 35%,var(--line)); background:color-mix(in srgb,var(--danger) 9%,var(--surface)); color:var(--danger); }
.ux-search-result-badge-unknown { border-color:var(--line); background:var(--card); color:var(--muted); }
.ux-search-result-title { margin:0; font-size:1.05rem; line-height:1.35; letter-spacing:-.02em; }
.ux-search-result-link { display:flex; align-items:center; justify-content:space-between; gap:.75rem; min-height:2.6rem; color:var(--text); text-decoration:none; }
.ux-search-result-link > span:first-child { min-width:0; overflow-wrap:anywhere; }
.ux-search-result-arrow { display:grid; place-items:center; flex:0 0 auto; width:1.8rem; height:1.8rem; border-radius:9px; background:var(--accent-soft); color:var(--accent); font-size:1.1rem; font-weight:800; transition:transform .16s ease,background .16s ease; }
.ux-search-result-link:hover .ux-search-result-arrow { background:var(--accent); color:var(--surface-strong,#fff); transform:translateX(2px); }
.ux-search-result-link:focus-visible { outline:2px solid var(--accent); outline-offset:4px; border-radius:8px; }
.ux-search-result-summary { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; min-height:3.9em; margin:0; overflow:hidden; color:var(--muted); font-size:.86rem; line-height:1.5; }
.ux-search-result-footer { display:flex; align-items:center; justify-content:space-between; gap:.5rem; margin-top:auto; padding-top:.65rem; border-top:1px solid var(--line); }
.ux-search-result-cta { color:var(--accent); font-size:.78rem; font-weight:750; }
.ux-search-result + .ux-search-result { margin:0; }
.ux-reading { padding:1rem; margin:0 0 1rem; border:1px solid var(--line); border-radius:12px; background:var(--panel-bg,var(--surface)); }
.ux-reading h3 { margin:0; font-size:1rem; }
.ux-reading-description { margin:.4rem 0 1rem; font-size:.85rem; color:var(--muted); }
.ux-reading-controls { display:grid; grid-template-columns:minmax(0,1.2fr) repeat(2,minmax(0,1fr)); gap:.75rem; margin-bottom:.75rem; }
.ux-reading-controls label { min-width:0; margin:0; padding:.6rem .7rem; border:1px solid var(--line); border-radius:10px; background:var(--surface); font-size:.875rem; }
.ux-reading-controls label:first-child { flex-wrap:wrap; }
.ux-reading input[type="checkbox"] { flex-shrink:0; accent-color:var(--accent); }
.ux-reading button { font-size:.8rem; color:var(--muted); background:var(--surface); }
.ux-reading [role="status"] { font-size:.8rem; color:var(--muted); margin:.5rem 0 0; }
.ux-reading [role="status"]:empty,[data-reading-settings-slot]:empty { display:none; }
.ux-discovery :is(input,select,button):focus-visible,.ux-reading :is(input,select,button):focus-visible { outline:2px solid var(--accent); outline-offset:3px; }

/* Home discovery cards: make every destination visibly actionable. */
.ux-continue,.ux-collections { border:1px solid var(--line); border-radius:16px; background:var(--panel-bg,var(--surface)); box-shadow:0 12px 32px rgb(15 23 42 / .06); }
.ux-continue h2,.ux-collections h2 { margin:0 0 1rem; font-size:1.2rem; letter-spacing:-.02em; }
.ux-continue [data-ux-recent] { display:grid; grid-template-columns:repeat(auto-fit,minmax(min(210px,100%),1fr)); gap:.75rem; }
.ux-continue .ux-popular-link { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.65rem; align-items:center; min-height:56px; padding:.7rem .85rem; border:1px solid var(--line); border-radius:12px; background:var(--surface); color:var(--text); font-weight:650; text-decoration:none; box-shadow:0 2px 0 rgb(15 23 42 / .05); transition:border-color .16s ease,transform .16s ease,box-shadow .16s ease,background .16s ease; }
.ux-popular-icon { display:grid; place-items:center; inline-size:32px; block-size:32px; border-radius:10px; color:var(--accent); background:var(--accent-soft); font-weight:800; }
.ux-popular-label { min-width:0; line-height:1.3; }
.ux-popular-arrow,.ux-collection-arrow { color:var(--muted); font-size:1.1rem; transition:transform .16s ease,color .16s ease; }
.ux-popular-link:hover { border-color:var(--accent); background:var(--accent-soft); transform:translateY(-2px); box-shadow:0 8px 20px rgb(15 23 42 / .1); }
.ux-popular-link:hover .ux-popular-arrow { color:var(--accent); transform:translateX(3px); }
.ux-popular-link:focus-visible,.ux-collection-action:focus-visible { outline:3px solid var(--accent); outline-offset:3px; }
.ux-collection-grid { grid-template-columns:repeat(auto-fit,minmax(min(260px,100%),1fr)); align-items:start; }
.ux-collection-grid article { position:relative; padding:1rem; border-radius:14px; background:var(--surface); box-shadow:0 2px 0 rgb(15 23 42 / .04); overflow:hidden; }
.ux-collection-grid article::before { content:""; position:absolute; inset:0 auto 0 0; inline-size:4px; background:var(--accent); }
.ux-collection-grid h3 { margin:0 0 .8rem; padding-inline-start:.25rem; font-size:1rem; letter-spacing:-.01em; }
.ux-collection-grid ol { display:grid; gap:.5rem; margin:0; padding:0; list-style:none; }
.ux-collection-grid li { margin:0; min-width:0; }
.ux-collection-grid .ux-collection-action { display:grid; grid-template-columns:auto minmax(0,1fr) auto; gap:.65rem; align-items:center; width:100%; min-height:48px; padding:.55rem .65rem; box-sizing:border-box; border:1px solid transparent; border-radius:10px; background:var(--panel-bg,var(--surface)); color:var(--text); font-size:.9rem; font-weight:600; line-height:1.3; text-decoration:none; transition:border-color .16s ease,transform .16s ease,background .16s ease; }
.ux-collection-number { display:grid; place-items:center; inline-size:28px; block-size:28px; border:1px solid var(--line); border-radius:9px; color:var(--accent); background:var(--surface); font-size:.78rem; font-variant-numeric:tabular-nums; }
.ux-collection-label { min-width:0; }
.ux-collection-action:hover { border-color:var(--accent); background:var(--accent-soft); transform:translateX(2px); }
.ux-collection-action:hover .ux-collection-arrow { color:var(--accent); transform:translateX(3px); }
.ux-collection-pipeline { border-style:dashed; }

/* Privacy-preserving coordinate map: all geometry is rendered locally. */
.ux-coordinate-map { margin-top:1rem; padding:1rem; border:1px solid var(--line); border-radius:14px; background:var(--panel-bg,var(--surface)); }
.ux-coordinate-map[hidden] { display:none; }
.ux-coordinate-map h3 { margin:0; font-size:1rem; }
.ux-coordinate-summary { margin:.45rem 0 .8rem; color:var(--muted); font-size:.875rem; font-variant-numeric:tabular-nums; }
.ux-coordinate-canvas { overflow:hidden; border:1px solid var(--line); border-radius:14px; background:var(--surface); }
.ux-coordinate-canvas svg { display:block; width:100%; height:auto; min-height:210px; max-height:420px; }
.ux-map-ocean { fill:var(--accent-soft,#eef2ff); }
.ux-map-grid { stroke:var(--line,#cbd5e1); stroke-width:1; opacity:.65; }
.ux-map-land { fill:var(--surface,#fff); stroke:var(--muted,#64748b); stroke-width:1.25; stroke-linejoin:round; opacity:.96; }
.ux-map-pulse { fill:var(--accent,#4f46e5); opacity:.2; }
.ux-map-dot,.ux-map-pin { fill:var(--accent,#4f46e5); stroke:var(--surface,#fff); stroke-width:2; }
.ux-coordinate-privacy { margin:.75rem 0 0; color:var(--muted); font-size:.8rem; }
@media (max-width:600px) {
  [data-ux-filters],.ux-file-router,.ux-reading-controls { grid-template-columns:minmax(0,1fr); }
  .ux-discovery-heading { align-items:flex-start; flex-direction:column; gap:.35rem; }
  .ux-discovery-hint { max-width:none; text-align:start; }
  .ux-file-router input { grid-column:1; grid-row:auto; margin-top:.75rem; }
  .ux-reading-controls label:first-child { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); }
  .ux-continue [data-ux-recent] { grid-template-columns:minmax(0,1fr); }
  .ux-coordinate-canvas svg { min-height:170px; }
}
@media (min-width:768px) and (max-width:1023px) {
  .topbar-actions { flex-wrap:wrap; min-width:0; }
}
@media (prefers-reduced-motion:reduce) { .ux-popular-link,.ux-collection-action,.ux-popular-arrow,.ux-collection-arrow { transition:none; transform:none !important; } }
@media (forced-colors:active) { .ux-popular-link,.ux-collection-action,.ux-coordinate-map,.ux-coordinate-canvas { border-color:CanvasText; } .ux-map-land,.ux-map-grid { stroke:CanvasText; } .ux-map-dot,.ux-map-pin { fill:Highlight; } }
