/* My data (/my-data/, /es/mis-datos/) — on top of base.css and sf.css tokens.
   Phone first: one column, tiles that wrap, nothing wider than 360 px. */
.md{ max-width:860px; margin-left:auto; margin-right:auto; }
.md p{ max-width:76ch; }
.md-note{ border:1px solid var(--rule); border-left:4px solid var(--accent); border-radius:10px; background:var(--surface); padding:12px 16px; }
.md-note p{ margin:0; color:var(--ink-2); line-height:1.55; }
.md-note strong{ color:var(--ink); }
.md-warn{ border:1px solid color-mix(in srgb, var(--warn) 55%, var(--rule)); border-radius:10px; padding:10px 14px; background:color-mix(in srgb, var(--warn) 9%, var(--surface)); }
.md-warn p{ margin:0; color:var(--ink); }
.md-warn p + p{ margin-top:6px; }
.md-card > p{ margin:0; color:var(--ink-2); line-height:1.55; }
.md-card .hint{ margin:0; }
.md-tiles{ list-style:none; margin:0; padding:0; display:grid; gap:8px; grid-template-columns:repeat(auto-fill, minmax(min(100%, 150px), 1fr)); }
.md-tile{ display:grid; gap:2px; align-content:start; padding:10px 12px; border:1px solid var(--rule); border-radius:10px; background:var(--surface-2); min-width:0; }
.md-tile b{ font-size:1.5rem; line-height:1.1; font-variant-numeric:tabular-nums; color:var(--ink); }
.md-tile span{ font-size:.9rem; color:var(--ink-2); }
.md-tile small{ font-size:.8rem; color:var(--ink-3); overflow-wrap:anywhere; }
.md-tile.zero b{ color:var(--ink-3); }
.md-tile.md-wait{ grid-column:1 / -1; color:var(--ink-2); }
.md-detail summary{ cursor:pointer; color:var(--ink-2); font-size:.92rem; min-height:32px; display:flex; align-items:center; }
.md-detail summary:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:4px; }
.md-list{ margin:6px 0 0; padding-left:1.2em; color:var(--ink-2); font-size:.9rem; }
.md-list li{ margin:2px 0; overflow-wrap:anywhere; }
.md-space{ margin:0; font-size:.9rem; color:var(--ink-2); }
.md-persist{ display:grid; gap:6px; padding-top:10px; border-top:1px solid var(--rule); }
.md-persist p{ margin:0; font-size:.9rem; }
.md-persist .btn{ justify-self:start; }
.md-acts{ display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.md-msg{ margin:0; font-size:.9rem; color:var(--ink-2); min-height:1.2em; overflow-wrap:anywhere; }
.md-msg:empty{ display:none; }
#md-restore-card.over{ outline:2px dashed var(--accent); outline-offset:3px; }
.md-preview{ display:grid; gap:10px; }
.md-preview:empty{ display:none; }
.md-preview h3{ margin:4px 0 0; font-size:1rem; }
.md-preview h4{ margin:0; font-size:.98rem; }
.md-preview p{ margin:0; }
.md-preview ul{ margin:0; padding-left:1.2em; color:var(--ink-2); }
.md-preview li{ margin:2px 0; overflow-wrap:anywhere; }
.md-preview.bad > p{ color:var(--fail); font-weight:560; }
.md-preview.ok{ border-left:4px solid var(--pass); padding-left:12px; }
.md-meta{ color:var(--ink-3); font-size:.88rem; }
.md-callout{ padding:8px 12px; border-radius:8px; background:color-mix(in srgb, var(--accent) 10%, var(--surface)); color:var(--ink); }
.md-plans{ display:grid; gap:10px; grid-template-columns:repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.md-plan{ display:grid; gap:8px; align-content:start; padding:12px 14px; border:1px solid var(--rule); border-radius:10px; background:var(--surface-2); min-width:0; }
.md-plan .btn{ justify-self:start; margin-top:4px; }
.md-block{ display:grid; gap:2px; }
.md-block-t{ font-size:.88rem; font-weight:560; color:var(--ink-2); }
.md-pro-status{ font-weight:560; color:var(--ink) !important; }
.md-pro-form{ display:grid; gap:8px; }
.md-pro-form .field{ margin-bottom:0; }
.md-pro-form input[aria-invalid="true"]{ border-color:var(--fail); }
.md-danger{ border-color:color-mix(in srgb, var(--fail) 35%, var(--rule)); }
.md-dialog ul{ margin:0 0 10px; padding-left:1.2em; color:var(--ink-2); }
.md-dialog .md-acts{ margin:4px 0 6px; }
.md-dialog .field{ margin:10px 0 4px; }
.md-check{ display:flex; gap:8px; align-items:flex-start; margin:8px 0; font-size:.92rem; }
.md-check input{ margin-top:3px; width:18px; height:18px; flex:0 0 18px; }
@media print{ .md-acts, .md-pro-form, .md-persist .btn{ display:none !important; } }