/* The simple view for the person being cared for: the dashboard's own look, calmer, larger, one column. */
body.sn { font-size: 1.125rem; }
.sn .app, .sn main { max-width: 960px; }
.sn main { margin: 0 auto; padding: 24px 20px 120px; }
.sn .pg-h { margin-bottom: 20px; }
.sn h1 { font-size: clamp(1.9rem, 4vw, 2.4rem); }
.sn .pn-h h2 { font-size: 1.25rem; }
.sn .pn-h { min-height: 60px; }
.sn .btn { min-height: 56px; padding: 0 22px; font-size: 1.05rem; }
.sn .btn-sm { min-height: 48px; font-size: 1rem; }
.sn .tool { min-width: 48px; height: 48px; font-size: 1.05rem; }
.sn .chip { font-size: .9rem; padding: 5px 12px; }
.sn .g-11, .sn .g-13, .sn .g-21, .sn .g-31 { grid-template-columns: 1fr; }
.sn .hd-app { font-weight: 700; }
.sn .cr-menu-btn { display: inline-flex; align-items: center; gap: 8px; width: auto; padding: 0 16px; font-size: 1.05rem; }
.sn .cr-menu-btn .sr { position: static; width: auto; height: auto; clip: auto; overflow: visible; }
.sn .cr-menu a { min-height: 60px; font-size: 1.2rem; }

.st { display: flex; gap: 18px; align-items: center; padding: 22px; margin-bottom: 18px; border: 1px solid var(--line); border-left: 8px solid var(--l0); border-radius: var(--r); background: var(--l0s); }
.st-1 { border-left-color: var(--l1); background: var(--l1s); }
.st-2 { border-left-color: var(--l2); background: var(--l2s); }
.st-3 { border-left-color: var(--l3); background: var(--l3s); }
.st-ic { display: grid; place-items: center; width: 64px; height: 64px; flex: none; border-radius: 50%; background: var(--l0); color: var(--on-l); }
.st-1 .st-ic { background: var(--l1); } .st-2 .st-ic { background: var(--l2); } .st-3 .st-ic { background: var(--l3); }
.st-ic .ic { width: 34px; height: 34px; stroke-width: 2.2; }
.st-m h2 { font-size: 1.6rem; line-height: 1.25; }
.st-p { margin-top: 4px; }

.sn-qs { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin-bottom: 18px; counter-reset: q; }
.sn-q { padding: 18px; border: 1px solid var(--line); border-radius: var(--r); background: var(--surface); box-shadow: var(--shadow); display: grid; gap: 8px; align-content: start; }
.sn-q-ok { border-top: 6px solid var(--l0); } .sn-q-warn { border-top: 6px solid var(--l1); } .sn-q-help { border-top: 6px solid #c62828; }
.sn-q-n { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--pri-soft); color: var(--pri); font-weight: 800; }
.sn-q h3 { font-size: 1.2rem; }
.sn-q-a { font-size: 1.05rem; }
@media (max-width: 640px) { .st { flex-direction: column; align-items: flex-start; } .sn main { padding: 18px 14px 120px; } }