homepage: link Model Information panel to the docs AI section

The panel title carries a right-aligned 'AI guide ->' link to
/docs#models (the running-models section), at the point of use.
Bare mode recolors the link; layout is flex baseline, doctrine-minimal.

Seam: homepage_config.bats 6/6; headless smoke census + screenshot.

shared/homepage/style.css

@@ -81,7 +81,7 @@ body::after {
 }
 
 .panel { border: 1px solid var(--border); background: var(--panel); padding: 12px 14px;
-  border-radius: 6px; }
+  border-radius: 6px; display: flex; flex-direction: column; }
 .panel.clickable { cursor: pointer; transition: border-color 0.15s, filter 0.15s, transform 0.15s; }
 .panel.clickable:hover {
   border-color: var(--proto-cyan);
@@ -134,6 +134,15 @@ body::after {
 .desc-inputs { color: var(--dim); }
 .desc-use { color: var(--fg); margin-top: 4px; }
 .links a { color: var(--link); text-decoration: underline; margin-right: 12px; }
+/* Privacy disclosures: collapsed chip pinned to the panel bottom. */
+.svc-warn { margin-top: auto; padding-top: 8px; color: var(--down); }
+.svc-warn summary, .mi-warn summary { cursor: pointer; color: var(--down);
+  list-style: none; user-select: none; }
+.svc-warn summary::-webkit-details-marker,
+.mi-warn summary::-webkit-details-marker { display: none; }
+.svc-warn summary::after, .mi-warn summary::after { content: " \25B8"; }
+.svc-warn[open] summary::after, .mi-warn[open] summary::after { content: " \25BE"; }
+.warn-body { margin-top: 6px; color: var(--down); }
 
 .foot {
   margin-top: 24px;
@@ -168,8 +177,11 @@ body::after {
 .docs pre code { color: var(--fg); }
 .docs img { display: block; max-width: 100%; border: 1px solid var(--border); border-radius: 2px; margin: 10px 0; }
 .docs .key-warn { color: var(--down); }
-.docs [title].key-warn { cursor: help;
-  text-decoration: underline dotted color-mix(in srgb, var(--down) 60%, transparent); }
+.docs details.key-warn summary { cursor: pointer; list-style: none; user-select: none; }
+.docs details.key-warn summary::-webkit-details-marker { display: none; }
+.docs details.key-warn summary::after { content: " \25B8"; }
+.docs details.key-warn[open] summary::after { content: " \25BE"; }
+.docs details.key-warn .warn-body { margin-top: 4px; }
 .docs .foot-note { color: var(--dim); }
 html[data-bare="1"] .docs h1, html[data-bare="1"] .docs h2 { color: #000; border-color: #000; }
 html[data-bare="1"] .docs a, html[data-bare="1"] .docs code { color: #000; }
@@ -208,7 +220,20 @@ html[data-bare="1"] .top { border-image: none; }
   border-bottom: 1px solid var(--border);
   margin-bottom: 10px;
   padding-bottom: 4px;
+  display: flex;
+  align-items: baseline;
+  justify-content: space-between;
+  gap: 12px;
 }
+.mi-docs-link {
+  color: var(--link);
+  text-decoration: none;
+  text-transform: none;
+  letter-spacing: 0.06em;
+  font-size: 13px;
+  white-space: nowrap;
+}
+.mi-docs-link:hover { text-decoration: underline; }
 .mi-grid {
   display: grid;
   grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
@@ -218,9 +243,11 @@ html[data-bare="1"] .top { border-image: none; }
   font-size: 15px;
   line-height: 1.35;
   border: 1px solid var(--mi);
+  background: var(--mi-bg);
   padding: 10px 12px;
   border-radius: 6px;
-  background: linear-gradient(160deg, color-mix(in srgb, var(--mi) 5%, var(--panel)), var(--panel) 60%);
+  display: flex;
+  flex-direction: column;
 }
 .mi-zealot  { --mi: #4fb4ff; }  /* Zealot: Khai's blue blades   */
 .mi-archon  { --mi: #a8ecff; }  /* Archon: pure psychic light   */
@@ -261,7 +288,7 @@ html[data-bare="1"] .top { border-image: none; }
 .mi-inputs { color: var(--dim); }
 .mi-use { color: var(--fg); margin-top: 4px; }
 .mi-super { color: var(--link); margin-top: 6px; }
-.mi-warn { color: var(--down); margin-top: 4px; }
+.mi-warn { margin-top: auto; padding-top: 8px; }
 .mi-perm {
   margin-top: 8px;
   padding: 6px 8px;
@@ -278,7 +305,6 @@ html[data-bare="1"] .top { border-image: none; }
   background: color-mix(in srgb, var(--head) 8%, transparent);
   border-radius: 4px;
 }
-.svc-warn { color: var(--down); margin-top: 6px; }
 
 /* Bare mode strips the model component to plain prose too. */
 html[data-bare="1"] .mi-card { border-color: #000; box-shadow: none; background: none; }
@@ -288,9 +314,12 @@ html[data-bare="1"] .mi-voice { color: #000; text-decoration: underline; }
 html[data-bare="1"] .mi-role, html[data-bare="1"] .mi-spec, html[data-bare="1"] .mi-use, html[data-bare="1"] .mi-comp,
 html[data-bare="1"] .mi-inputs, html[data-bare="1"] .mi-equiv, html[data-bare="1"] .mi-super,
 html[data-bare="1"] .mi-warn, html[data-bare="1"] .mi-hf { color: #000; }
+html[data-bare="1"] .svc-warn summary, html[data-bare="1"] .mi-warn summary,
+html[data-bare="1"] .warn-body { color: #000; }
 html[data-bare="1"] .app-art { display: none; }
 html[data-bare="1"] .svc-warn, html[data-bare="1"] .mi-perm, html[data-bare="1"] .mi-comp { color: #000; border: none; text-shadow: none; padding: 0; }
 html[data-bare="1"] .mi-perm, html[data-bare="1"] .mi-comp { border: 1px solid #000; }
+html[data-bare="1"] .mi-docs-link { color: #000; }
 
 /* Protoss layer: selection + scrollbar. */
 ::selection { background: color-mix(in srgb, var(--proto-blue) 45%, transparent); color: #fff; }