feat(platform): 模型可用性 - 目录附带近24小时成功率与7天趋势

公开目录只统计系统渠道的 create 成败，样本不足或日志不可用时不改变现有可用判断；模型选择器展示当前可用状态和历史成功率。

web/src/styles/shared/model-picker.css

@@ -770,6 +770,101 @@ html:not(.dark) .creation-home .creation-chat-composer .creation-model-picker.ca
     overflow-wrap: anywhere;
 }
 
+.model-picker-availability {
+    display: inline-flex;
+    min-width: 0;
+    align-items: center;
+    gap: 4px;
+    border: 1px solid color-mix(in srgb, currentColor 16%, transparent);
+    border-radius: 999px;
+    padding: 2px 6px;
+    color: color-mix(in srgb, currentColor 68%, transparent);
+    font-size: 10px;
+    font-weight: 650;
+    line-height: 1.3;
+    white-space: nowrap;
+    cursor: help;
+}
+
+.model-picker-availability:focus-visible {
+    outline: 2px solid color-mix(in srgb, currentColor 45%, transparent);
+    outline-offset: 2px;
+}
+
+.model-picker-availability-dot {
+    width: 6px;
+    height: 6px;
+    flex: 0 0 6px;
+    border-radius: 50%;
+    background: #48a86a;
+    box-shadow: 0 0 0 2px color-mix(in srgb, #48a86a 15%, transparent);
+}
+
+.model-picker-availability.is-insufficient .model-picker-availability-dot {
+    background: #d59b35;
+    box-shadow: 0 0 0 2px color-mix(in srgb, #d59b35 15%, transparent);
+}
+
+.model-picker-availability.is-no_data,
+.model-picker-availability.is-unavailable {
+    color: color-mix(in srgb, currentColor 50%, transparent);
+}
+
+.model-picker-availability.is-no_data .model-picker-availability-dot,
+.model-picker-availability.is-unavailable .model-picker-availability-dot {
+    background: #9aa0a8;
+    box-shadow: 0 0 0 2px color-mix(in srgb, #9aa0a8 15%, transparent);
+}
+
+.model-picker-availability-popover {
+    width: 210px;
+    color: var(--user-ink, #20242a);
+}
+
+.model-picker-availability-popover-head {
+    display: flex;
+    align-items: baseline;
+    justify-content: space-between;
+    gap: 12px;
+    font-size: 12px;
+}
+
+.model-picker-availability-popover-head span {
+    color: #2e8d58;
+    font-weight: 700;
+    font-variant-numeric: tabular-nums;
+}
+
+.model-picker-availability-popover-meta,
+.model-picker-availability-popover-foot {
+    color: color-mix(in srgb, currentColor 54%, transparent);
+    font-size: 10px;
+    line-height: 1.5;
+}
+
+.model-picker-availability-popover-meta { margin-top: 4px; }
+.model-picker-availability-popover-foot { margin-top: 6px; }
+
+.model-picker-availability-trend {
+    display: grid;
+    grid-template-columns: repeat(7, minmax(0, 1fr));
+    gap: 4px;
+    margin-top: 10px;
+}
+
+.model-picker-availability-segment {
+    height: 20px;
+    border-radius: 4px;
+    background: #4aa96c;
+}
+
+.model-picker-availability-segment.is-insufficient { background: #d59b35; }
+.model-picker-availability-segment.is-no_data { background: color-mix(in srgb, currentColor 14%, transparent); }
+
+.dark .model-picker-availability-popover { color: #f0f1f2; }
+.dark .model-picker-availability-popover-head span { color: #7bd598; }
+.dark .model-picker-availability-segment.is-no_data { background: rgba(255, 255, 255, .14); }
+
 @media (prefers-reduced-motion: reduce) {
     .canvas-model-picker-option,
 .canvas-model-picker-description { transition: none !important; }