.showcase-body { margin:0; }
.showcase-nav { display:flex; justify-content:space-between; align-items:center; padding:24px max(6vw,24px); border-bottom:1px solid var(--line); }
.showcase-nav a,.collection-footer a { color:var(--ink); text-decoration:none; }
.brand { font-size:23px; display:flex; gap:10px; align-items:center; color:var(--green)!important; }
.brand span { color:var(--ink); font-weight:750; }
.showcase-nav nav { display:flex; align-items:center; gap:24px; font-size:13px; }
.showcase-nav button { background:none; border:0; color:var(--muted); cursor:pointer; }
.showcase-main { max-width:1240px; margin:auto; padding:0 40px; }
.showcase-hero { padding:76px 0 54px; max-width:880px; }
.kicker { color:var(--green); font-size:11px; font-weight:700; letter-spacing:.13em; }
.showcase-hero h1 { font-size:clamp(36px,5vw,66px); font-weight:500; line-height:1.1; letter-spacing:-.045em; margin:24px 0; }
.showcase-hero h1 em { font-family:Georgia,serif; color:var(--green); font-weight:400; }
.intro { max-width:650px; font-size:17px; line-height:1.75; color:var(--muted); }
.collection-note { max-width:650px; color:var(--muted); font-size:12px; line-height:1.6; margin-top:20px; }
.collection-toolbar { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 0; border-top:1px solid var(--line); }
#filters { display:flex; flex-wrap:wrap; gap:6px; }
#filters button { border:1px solid transparent; background:transparent; color:var(--muted); padding:8px 12px; border-radius:24px; font:inherit; font-size:12px; cursor:pointer; }
#filters button[aria-pressed="true"] { background:var(--ink); color:var(--paper); }
#count { font-size:12px; color:var(--muted); white-space:nowrap; }
.idea-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.idea-card { display:flex; flex-direction:column; padding:20px; border:1px solid var(--line); border-radius:6px; background:var(--panel); }
.idea-card:first-child { border-top:3px solid var(--green); }
.card-meta { display:flex; align-items:center; justify-content:space-between; gap:10px; font-size:11px; color:var(--muted); }
.card-meta span:first-child { color:var(--green); text-transform:uppercase; letter-spacing:.08em; }
.card-meta { flex-wrap:wrap; }
.idea-system-id { font-family:ui-monospace,monospace; font-size:10px; overflow-wrap:anywhere; }
.idea-card h2 { font-size:23px; line-height:1.18; letter-spacing:-.025em; font-weight:560; margin:14px 0 10px; }
.idea-card p { font-size:14px; line-height:1.45; margin:0 0 10px; }
.idea-card .problem { color:var(--muted); }
.idea-card .label { display:block; font-size:10px; text-transform:uppercase; letter-spacing:.12em; font-weight:750; margin-bottom:4px; color:var(--green); }
.idea-card .why { border-left:2px solid var(--yellow); padding-left:14px; font-size:13px; color:var(--muted); }
.card-bottom { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:auto; padding-top:10px; border-top:1px solid var(--line); }
.card-bottom time { color:var(--muted); font-size:11px; }
.card-bottom button { color:var(--green); background:none; border:0; font-size:13px; font-weight:650; cursor:pointer; padding:6px 0; }
.collection-footer { padding:48px 0; display:flex; justify-content:space-between; gap:24px; color:var(--muted); font-size:14px; }
dialog { width:min(980px,calc(100% - 32px)); max-height:90vh; padding:0; color:var(--ink); background:var(--paper); border:1px solid var(--line); border-radius:12px; }
dialog::backdrop { background:rgba(10,20,16,.65); backdrop-filter:blur(4px); }
.reader-bar { position:sticky; top:0; background:var(--paper); border-bottom:1px solid var(--line); padding:16px 24px; display:flex; justify-content:space-between; align-items:center; gap:12px; z-index:1; font-size:12px; }
.reader-bar button { color:var(--ink); border:1px solid var(--line); background:var(--panel); border-radius:6px; padding:8px 12px; cursor:pointer; }
.reader-content { padding:30px 48px 60px; }
.reader-layout { display:grid; grid-template-columns:minmax(300px,40%) minmax(0,1fr); }
.reader-layout .reader-content { min-width:0; padding:30px 36px 60px; }
.reader-tree { padding:30px 22px; border-right:1px solid var(--line); }
.reader-tree h2 { font-size:15px; margin:0 0 8px; }
.tree-caption { font-size:11px; color:var(--muted); line-height:1.45; margin:0 0 18px; }
#proposal-tree { list-style:none; margin:0; padding:0 0 0 10px; }
#proposal-tree li { position:relative; padding:0 0 16px 20px; border-left:1px solid var(--line); }
#proposal-tree li:last-child { border-color:transparent; padding-bottom:0; }
#proposal-tree li::before { content:''; position:absolute; left:-5px; top:5px;
  width:9px; height:9px; border-radius:50%; background:var(--green); box-shadow:0 0 0 4px var(--paper); }
#proposal-tree summary { cursor:pointer; font-size:12px; line-height:1.5; }
#proposal-tree summary small { color:var(--muted); font-size:10px; margin-right:7px; }
#proposal-tree details p { font-size:12px; line-height:1.5; margin:7px 0 0; color:var(--muted); overflow-wrap:anywhere; }
#proposal-tree .tree-final summary { color:var(--green); font-weight:700; }
#reader-back { color:var(--green); text-decoration:none; font-size:13px; font-weight:650;
  border:0; background:none; box-shadow:none; padding:0; }
#reader-back:focus-visible { outline:none; text-decoration:underline; text-underline-offset:4px; }
#reader:focus { outline:none; }
.reader-brand { display:inline-flex; align-items:center; justify-content:flex-start; gap:2px; flex:0 1 auto; min-width:0; }
.reader-brand .mark { flex:0 0 42px; cursor:pointer; }
.reader-brand .product { flex:0 1 auto; }
.reader-bar #reader-back { margin-left:auto; flex-shrink:0; }
#reader-meta { color:var(--muted); font-size:11px; margin:0 0 12px; }
.reading-view .showcase-nav,.reading-view .showcase-main { display:none; }
.reading-view #reader { position:fixed; inset:0; margin:0; width:100%; max-width:none;
  height:100dvh; max-height:none; border:0; border-radius:0; }
.reading-view .reader-bar { padding:16px clamp(20px,4vw,56px); min-height:68px; }
.reading-view .reader-layout { max-width:1600px; margin:0 auto; grid-template-columns:minmax(340px,40%) minmax(0,1fr); }
.reading-view .reader-tree { position:sticky; top:68px; align-self:start; max-height:calc(100dvh - 68px); overflow-y:auto; padding:28px 24px; }
.reading-view .reader-content { width:100%; max-width:920px; padding:28px clamp(24px,4vw,56px) 64px; }
.native-tree-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.native-tree-heading h2 { margin:0; }
.native-tree-heading button { border:0; background:none; padding:6px 0; color:var(--green);
  font:inherit; font-size:12px; cursor:pointer; }
.native-tree-panel .tree-caption { margin:10px 0 14px; }
.native-tree-canvas .tree { width:100%; height:auto; min-width:0; }
.native-legend { display:flex; gap:16px; margin-top:12px; color:var(--muted); font-size:10px; }
.native-legend span { display:flex; align-items:center; gap:5px; }
.native-legend i { width:6px; height:6px; border-radius:50%; background:var(--settled); }
.native-legend .dropped { background:var(--spent); }
.native-legend .pending { background:var(--waiting); }
#native-breadcrumbs { display:flex; flex-wrap:wrap; gap:5px 12px; margin-bottom:20px; }
#native-breadcrumbs button { border:0; background:none; padding:2px 0; color:var(--muted);
  font:inherit; font-size:11px; cursor:pointer; }
#native-breadcrumbs button:hover,#native-breadcrumbs button[aria-pressed="true"] { color:var(--green); }
@media(max-width:800px) {
  .reader-layout,.reading-view .reader-layout { grid-template-columns:minmax(0,1fr); }
  .reader-tree,.reading-view .reader-tree { position:static; max-height:none; border-right:0;
    border-bottom:1px solid var(--line); padding:24px; }
  .reading-view .reader-bar { flex-wrap:wrap; gap:10px; }
  .reader-brand .eyebrow { display:none; }
}
.reader-content h2 { font-size:26px; line-height:1.25; margin:12px 0 18px; }
#proposal { line-height:1.55; overflow-wrap:anywhere; font-size:15px; }
#proposal p,#proposal ul,#proposal ol,#proposal blockquote { margin:0 0 .7em; }
#proposal li { margin:0 0 .25em; }
#proposal li > p { margin-bottom:.35em; }
#proposal h1 { font-size:24px; } #proposal h2 { font-size:21px; }
#proposal h1,#proposal h2,#proposal h3,#proposal h4 { line-height:1.3; margin:1em 0 .45em; }
#proposal table { display:block; overflow:auto; border-collapse:collapse; font-size:12px; }
#proposal td,#proposal th { border:1px solid var(--line); padding:8px; }
#proposal a { color:var(--green); } #proposal pre,.katex-display { overflow:auto; }
#proposal.plain { white-space:pre-wrap; }
#proposal-figures { margin:0 0 30px; }
.proposal-figure { margin:0 0 24px; }
.proposal-figure-image { display:block; overflow:hidden; border:1px solid var(--line); border-radius:8px; background:#fff; }
.proposal-figure img { display:block; width:100%; height:auto; }
.proposal-figure figcaption { padding:10px 2px 0; color:var(--muted); font-size:12px; line-height:1.55; }
.figure-role { display:block; margin-bottom:4px; color:var(--green); font-size:10px; font-weight:700; letter-spacing:.08em; text-transform:uppercase; }
.figure-open { display:block; width:fit-content; margin-top:5px; color:var(--green); font-size:11px; text-decoration:none; }
body:has(dialog[open]) { overflow:hidden; }
button:focus-visible,a:focus-visible { outline:2px solid var(--green); outline-offset:4px; }
#reader-title { font-family:Georgia,"Times New Roman",serif; font-size:clamp(24px,2.1vw,30px);
  font-weight:400; line-height:1.18; letter-spacing:-.025em; margin:10px 0 28px; color:var(--ink); }
#proposal { font-family:Georgia,"Times New Roman",serif; font-size:12px; line-height:1.6;
  color:color-mix(in srgb,var(--ink) 88%,var(--paper)); }
#proposal h1,#proposal h2,#proposal h3,#proposal h4 { font-family:Inter,ui-sans-serif,system-ui,sans-serif; }
#proposal h1,#proposal h2 { color:var(--green); font-size:18px; font-weight:650; letter-spacing:-.015em;
  margin:26px 0 12px; padding-top:18px; border-top:1px solid var(--line); }
#proposal > h2:first-child { margin-top:0; padding-top:0; border-top:0; }
#proposal h3 { color:var(--ink); font-size:16px; font-weight:650; margin:22px 0 9px; }
#proposal h4 { color:var(--muted); font-size:14px; font-weight:650; margin:18px 0 8px; }
#proposal strong { color:var(--ink); }
#proposal blockquote { margin:16px 0; padding:8px 16px; border-left:2px solid var(--yellow); color:var(--muted); }
#proposal table { font-family:Inter,ui-sans-serif,system-ui,sans-serif; font-size:12px; line-height:1.5; margin:16px 0; }
#proposal th { background:var(--panel); color:var(--green); font-weight:650; text-align:left; }
#content-kicker { font-family:Inter,ui-sans-serif,system-ui,sans-serif; font-size:10px; letter-spacing:.14em; color:var(--muted); }
@media(max-width:650px) { .showcase-main { padding:0 20px; } .showcase-nav { padding:20px; } .showcase-nav nav { gap:12px; font-size:11px; } .showcase-nav button { font-size:11px; } .showcase-hero { padding:45px 0 30px; } .idea-grid { grid-template-columns:1fr; } .idea-card { padding:18px; } .collection-toolbar { align-items:flex-start; } .collection-footer { flex-direction:column; } .reader-content { padding:24px; } .reader-bar { flex-wrap:wrap; } }