/* LifeSG-inspired resident services, using the shared MYDS semantic tokens. */
.rn-resident { --rn-soft:var(--accent-soft); --rn-line:var(--border); width:100%; color:var(--fg); font-size:var(--text-base); }
.rn-resident h1,.rn-resident h2,.rn-resident h3,.rn-resident p { margin-top:0; }
.rn-resident h2 { font-size:var(--text-xl); line-height:1.4; letter-spacing:-.02em; font-weight:600; }
.rn-resident h3 { font-size:var(--text-lg); line-height:1.4; }
.rn-resident .panel { border:var(--hairline) solid var(--border); border-radius:var(--radius-lg); background:var(--surface); box-shadow:var(--paper-shadow); }
.rn-resident .small,.rn-resident .case-meta { font-size:var(--text-xs); }
.rn-resident .btn { font-size:var(--text-sm); }
.rn-welcome { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); margin-bottom:var(--space-4); }
.rn-resident .rn-location { display:inline-flex; align-items:center; flex-wrap:nowrap; gap:var(--space-2); min-height:var(--control); max-width:100%; color:var(--fg-muted); font-family:var(--font); font-size:var(--text-sm); border-radius:var(--radius-sm); text-decoration:none; }
.rn-resident .rn-location-name { white-space:nowrap; }
.rn-resident .rn-location:hover .rn-location-name { color:var(--accent); text-decoration:underline; text-underline-offset:var(--space-1); }
.rn-resident .rn-location:focus-visible { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.rn-resident .rn-pilot-label { display:inline-block; padding:0 var(--space-1); border-radius:var(--radius-sm); background:var(--surface-subtle); color:var(--fg-muted); font-size:var(--text-xs); line-height:1.5; white-space:nowrap; }
.rn-location svg { color:var(--accent); flex-shrink:0; }
.rn-location-divider { color:var(--border); margin-inline:var(--space-1); }
.rn-profile { display:flex; gap:var(--space-2); align-items:center; color:var(--fg-muted); font-size:var(--text-xs); white-space:nowrap; }
.rn-avatar { width:var(--space-8)!important; height:var(--space-8)!important; background:var(--accent-soft)!important; color:var(--accent)!important; font-size:var(--text-sm)!important; }
.rn-hero { display:grid; grid-template-columns:minmax(0,1fr) calc(var(--space-16) * 4.5); align-items:center; padding:var(--space-6) var(--space-8); gap:var(--space-8); background:var(--surface); border:var(--hairline) solid var(--border); border-radius:var(--radius-lg); box-shadow:var(--shadow-sm); }
.rn-hero .eyebrow { color:var(--accent); font-size:var(--text-xs); font-weight:600; letter-spacing:.06em; margin-bottom:var(--space-2); }
.rn-hero h1 { font-size:var(--text-3xl); line-height:1.3; letter-spacing:-.025em; color:var(--fg); max-width:none; margin-bottom:var(--space-3); }
.rn-hero p:not(.eyebrow) { color:var(--fg-muted); font-size:var(--text-base); line-height:var(--leading); max-width:60ch; margin-bottom:var(--space-4); }
.rn-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:var(--space-3); }
.rn-hero-foot { font-size:var(--text-xs); color:var(--fg-muted); }
.rn-hero-art { min-width:0; }
.rn-neighbourhood-photo { width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; display:block; border-radius:var(--radius-md); }
.rn-services { margin-top:var(--space-8); }
.rn-section-heading { margin-bottom:var(--space-4); }
.rn-section-heading h2 { margin-bottom:var(--space-1); }
.rn-section-heading p { color:var(--fg-muted); font-size:var(--text-sm); margin:0; }
.rn-quick-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-4); }
.rn-quick-card { display:flex; align-items:center; gap:var(--space-4); width:100%; min-height:calc(var(--space-12) * 2.5); padding:var(--space-5); border:var(--hairline) solid var(--border); border-radius:var(--radius-md); background:var(--surface); color:var(--fg); text-align:left; font:inherit; cursor:pointer; box-shadow:var(--shadow-sm); transition:transform var(--dur-fast) var(--ease-out); }
.rn-quick-card:hover { border-color:var(--accent); background:var(--accent-soft); transform:translateY(calc(-1 * var(--hairline))); }
.rn-quick-card:active { transform:translateY(var(--hairline)); }
.rn-quick-card:focus-visible { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.rn-quick-icon { width:var(--space-12); height:var(--space-12); color:var(--accent); background:var(--accent-soft); border-radius:var(--radius-md); display:grid; place-items:center; flex-shrink:0; }
.rn-quick-copy { display:grid; gap:var(--space-1); min-width:0; flex:1; }
.rn-quick-copy strong { font-size:var(--text-base); line-height:1.4; font-weight:600; }
.rn-quick-copy>span { font-size:var(--text-sm); color:var(--fg-muted); line-height:1.5; }
.rn-quick-card>svg { color:var(--fg-muted); flex-shrink:0; }
.rn-home-grid { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(0,1fr); gap:var(--space-6); margin-top:var(--space-8); align-items:start; }
.rn-my-panel { padding:var(--space-6)!important; }
.rn-my-panel .panel-header { margin-bottom:var(--space-3); }
.rn-my-panel .panel-header h2,.rn-updates h2 { font-size:var(--text-lg); margin:0; }
.rn-mini-stats { display:flex; gap:var(--space-5); padding-bottom:var(--space-4); border-bottom:var(--hairline) solid var(--border); color:var(--fg-muted); font-size:var(--text-sm); }
.rn-mini-stats>span { display:flex; gap:var(--space-2); align-items:center; }
.rn-mini-stats strong { font-size:var(--text-sm); color:var(--fg); font-weight:600; }
.rn-status-dot { display:block; width:var(--space-2); height:var(--space-2); background:var(--accent); border-radius:var(--radius-pill); }
.rn-dot-resolved { background:var(--success); }
.rn-case-card { width:100%; display:flex!important; flex-direction:row!important; align-items:center; gap:var(--space-3); text-align:left; background:var(--surface); padding:var(--space-5) 0!important; border:0!important; border-bottom:var(--hairline) solid var(--border)!important; border-radius:0!important; font:inherit; cursor:pointer; box-shadow:none!important; transition:none; }
.rn-case-card:last-child { border-bottom:0!important; }
.rn-case-card:hover { background:var(--surface-subtle); }
.rn-case-card:focus-visible { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); border-radius:var(--radius-sm)!important; }
.rn-case-icon { display:grid; place-items:center; width:var(--space-10); height:var(--space-10); flex:0 0 var(--space-10); color:var(--fg-muted); background:var(--surface-subtle); border-radius:var(--radius-md); }
.rn-case-copy { display:flex; flex-direction:column; gap:var(--space-1); flex:1; min-width:0; }
.rn-case-copy strong { display:block; color:var(--fg); font-size:var(--text-sm); line-height:1.5; font-weight:600; }
.rn-case-copy .small { font-size:var(--text-xs); }
.rn-case-card .case-meta { display:flex; flex-wrap:wrap; gap:var(--space-2); font-size:var(--text-xs); line-height:1.4; color:var(--fg-muted); }
.rn-case-end { display:flex; align-items:center; gap:var(--space-2); flex-shrink:0; }
.rn-case-end>svg { color:var(--fg-muted); }
.rn-case-end .badge { font-size:var(--text-xs); white-space:nowrap; }
.rn-side-stack { display:grid; gap:var(--space-4); }
.rn-updates { padding:var(--space-6)!important; }
.rn-updates .panel-header { margin-bottom:var(--space-3); }
.rn-update-list { display:grid; }
.rn-update { display:flex; align-items:flex-start; gap:var(--space-3); width:100%; min-height:var(--control); padding:var(--space-4) 0; border:0; border-bottom:var(--hairline) solid var(--border); background:transparent; color:var(--fg); font:inherit; text-align:left; cursor:pointer; }
.rn-update:last-child { border-bottom:0; padding-bottom:0; }
.rn-update:hover { color:var(--accent); }
.rn-update>span:nth-child(2) { display:grid; gap:var(--space-1); flex:1; min-width:0; }
.rn-update time { font-size:var(--text-xs); color:var(--fg-muted); }
.rn-update strong { font-size:var(--text-sm); line-height:1.5; font-weight:500; }
.rn-update-symbol { color:var(--accent); padding-top:var(--space-1); flex-shrink:0; }
.rn-update>svg { color:var(--fg-muted); margin-top:var(--space-6); flex-shrink:0; }
.rn-updates-empty { margin:0; font-size:var(--text-sm); }
.rn-kicker-icon { display:grid; place-items:center; width:var(--space-10); height:var(--space-10); color:var(--accent); background:var(--accent-soft); border-radius:var(--radius-md); margin-bottom:var(--space-3); flex-shrink:0; }
.rn-community-link { display:flex; text-align:left; align-items:center; gap:var(--space-3); font:inherit; cursor:pointer; padding:var(--space-5)!important; min-height:calc(var(--space-12) * 2); }
.rn-community-link:hover { border-color:var(--accent); }
.rn-community-link .rn-kicker-icon { margin:0; }
.rn-community-link>span:nth-child(2) { flex:1; display:grid; gap:var(--space-1); }
.rn-community-link strong { color:var(--fg); font-size:var(--text-sm); line-height:1.5; font-weight:600; }
.rn-community-link .small { font-size:var(--text-xs); line-height:var(--leading); }
.rn-community-link>svg { color:var(--fg-muted); flex-shrink:0; }
.rn-disclaimer { display:flex; gap:var(--space-2); align-items:flex-start; color:var(--fg-muted); margin-top:var(--space-5); padding:var(--space-3) 0; }
.rn-disclaimer svg { flex-shrink:0; margin-top:var(--hairline); }
.rn-disclaimer p { margin:0; font-size:var(--text-xs); line-height:var(--leading); max-width:100ch; }
.rn-page-header { display:flex; justify-content:space-between; align-items:center; gap:var(--space-6); }
.rn-page-header .lede { max-width:65ch; font-size:var(--text-base); }
.rn-page-header .btn { white-space:nowrap; }
.rn-form-layout { display:grid; grid-template-columns:minmax(0,1fr) calc(var(--space-16) * 4.5); gap:var(--space-8); align-items:start; }
.rn-request-form { padding:0!important; overflow:hidden; }
.rn-form-section { display:flex; padding:var(--space-8); gap:var(--space-4); border-bottom:var(--hairline) solid var(--border); }
.rn-section-number { font-size:var(--text-xs); font-weight:650; line-height:var(--space-8); color:var(--accent); width:var(--space-8); height:var(--space-8); text-align:center; flex-shrink:0; font-variant-numeric:tabular-nums; }
.rn-form-section-body { min-width:0; width:100%; }
.rn-form-section h2 { font-size:var(--text-lg); margin-bottom:var(--space-5); }
.rn-choice-field { padding:0; margin:0; border:0; min-width:0; }
.rn-type-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-3); margin-bottom:var(--space-5); }
.rn-type-card { --rn-choice-color:var(--accent); --rn-choice-soft:var(--accent-soft); position:relative; cursor:pointer; }
.rn-type-aduan { --rn-choice-color:var(--accent); --rn-choice-soft:var(--accent-soft); }
.rn-type-permohonan { --rn-choice-color:var(--accent); --rn-choice-soft:var(--accent-soft); }
.rn-type-card input { position:absolute; opacity:0; inset:0; margin:0; width:100%; height:100%; cursor:pointer; }
.rn-type-card>span { border:var(--hairline) solid var(--border); border-radius:var(--radius-md); display:flex; flex-direction:column; align-items:flex-start; gap:var(--space-3); padding:var(--space-4); min-height:calc(var(--space-12) * 2); color:var(--rn-choice-color); background:var(--surface); pointer-events:none; }
.rn-type-card strong { font-size:var(--text-sm); font-weight:600; color:var(--fg-muted); }
.rn-type-card input:checked+span { border-color:color-mix(in srgb,var(--rn-choice-color) 35%,var(--border)); background:var(--rn-choice-soft); color:var(--rn-choice-color); box-shadow:none; }
.rn-type-card input:checked+span strong { color:var(--rn-choice-color); }
.rn-type-card input:focus-visible+span { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.rn-type-card:hover>span { border-color:var(--rn-choice-color); }
.rn-category-field legend { font-size:var(--text-sm); font-weight:650; color:var(--fg); margin-bottom:var(--space-3); }
.rn-category-options { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-2); }
.rn-category-card { --rn-choice-color:var(--accent); --rn-choice-soft:var(--accent-soft); position:relative; cursor:pointer; }
.rn-category-welfare,.rn-category-community { --rn-choice-color:var(--accent); --rn-choice-soft:var(--accent-soft); }
.rn-category-lighting { --rn-choice-color:var(--accent); --rn-choice-soft:var(--accent-soft); }
.rn-category-education { --rn-choice-color:var(--accent); --rn-choice-soft:var(--accent-soft); }
.rn-category-card input { position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0; cursor:pointer; }
.rn-category-card>span { display:flex; align-items:flex-start; gap:var(--space-3); padding:var(--space-3); min-height:calc(var(--space-10) * 2); background:var(--surface-subtle); border:var(--hairline) solid var(--border); border-radius:var(--radius-md); color:var(--rn-choice-color); pointer-events:none; }
.rn-category-card>span svg { flex-shrink:0; margin-top:var(--hairline); }
.rn-category-card strong { font-size:var(--text-sm); font-weight:550; line-height:1.5; }
.rn-category-card input:checked+span { color:var(--rn-choice-color); background:var(--rn-choice-soft); border-color:color-mix(in srgb,var(--rn-choice-color) 35%,var(--border)); box-shadow:none; }
.rn-category-card input:focus-visible+span { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.rn-category-card:hover>span { border-color:var(--rn-choice-color); }
.rn-request-form .field { margin-bottom:var(--space-5); }
.rn-request-form .field:last-child { margin-bottom:0; }
.rn-request-form .field label,.rn-followup-form>label { font-size:var(--text-sm); font-weight:650; margin-bottom:var(--space-2); display:block; color:var(--fg); }
.rn-request-form input,.rn-request-form textarea,.rn-request-form select,.rn-followup-form textarea,.rn-rating-panel textarea { font:inherit; font-size:var(--text-base); line-height:var(--leading); color:var(--fg); background:var(--surface); border:var(--hairline) solid var(--border); border-radius:var(--radius-sm); min-height:var(--control); width:100%; padding:var(--space-3); }
.rn-request-form input::placeholder,.rn-request-form textarea::placeholder,.rn-followup-form textarea::placeholder,.rn-rating-panel textarea::placeholder { color:var(--fg-muted); }
.rn-request-form input:focus-visible,.rn-request-form select:focus-visible,.rn-request-form textarea:focus-visible,.rn-followup-form textarea:focus-visible,.rn-rating-panel textarea:focus-visible { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.rn-request-form textarea,.rn-followup-form textarea,.rn-rating-panel textarea { resize:vertical; }
.rn-request-form [aria-invalid=true],.rn-followup-form [aria-invalid=true] { border-color:var(--danger)!important; }
.rn-field-error { font-size:var(--text-sm); line-height:var(--leading); margin:var(--space-2) 0 0; color:var(--danger); }
.rn-request-form .form-grid { gap:var(--space-4); }
.rn-area-note { font-size:var(--text-xs); line-height:var(--leading); margin:var(--space-3) 0 0!important; }
.rn-request-form .small { font-size:var(--text-sm); }
.rn-optional { float:right; font-size:var(--text-xs); font-weight:500; color:var(--fg-muted); padding-top:var(--space-1); letter-spacing:0; }
.rn-upload { display:flex; gap:var(--space-4); background:var(--surface-subtle); border:var(--hairline) dashed var(--border); padding:var(--space-5); border-radius:var(--radius-md); align-items:flex-start; }
.rn-upload-symbol { padding-top:var(--space-1); color:var(--accent); flex-shrink:0; }
.rn-upload strong { font-size:var(--text-sm); color:var(--fg); display:block; margin-bottom:var(--space-2); }
.rn-upload .row { gap:var(--space-2); flex-wrap:wrap; margin-top:var(--space-3); }
.rn-upload .btn { font-size:var(--text-sm); min-height:var(--control); }
.rn-upload p { margin-bottom:0; }
.rn-photo-preview { display:flex; gap:var(--space-4); margin-top:var(--space-4); align-items:center; border:var(--hairline) solid var(--border); border-radius:var(--radius-md); padding:var(--space-3); }
.rn-photo-preview[hidden] { display:none; }
.rn-photo-preview img,.rn-photo-preview>.rn-evidence-illustration { width:calc(var(--space-16) * 2); height:calc(var(--space-10) * 2); object-fit:cover; border-radius:var(--radius-sm); flex-shrink:0; }
.rn-photo-preview strong { font-size:var(--text-sm); }
.rn-photo-preview p { margin:var(--space-1) 0 0; }
.rn-photo-preview .btn { padding:var(--space-2); font-size:var(--text-sm); min-height:var(--control); margin-left:calc(-1 * var(--space-2)); }
.rn-form-footer { padding:var(--space-6) var(--space-8); background:var(--surface-subtle); }
.rn-consent { display:flex; align-items:flex-start; gap:var(--space-3); cursor:pointer; min-height:var(--control); }
.rn-consent input { width:var(--space-6); min-width:var(--space-6); height:var(--space-6); min-height:var(--space-6); margin:var(--space-1) 0 0; accent-color:var(--accent); }
.rn-consent span { font-size:var(--text-sm); color:var(--fg-muted); line-height:var(--leading); }
.rn-form-footer .form-actions { border-top:var(--hairline) solid var(--border); padding-top:var(--space-5); margin-top:var(--space-5); display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); }
.rn-form-aside { position:sticky; top:var(--space-6); }
.rn-help-note { display:flex; gap:var(--space-3); padding:var(--space-5) 0; color:var(--fg-muted); align-items:flex-start; }
.rn-help-note>svg { flex-shrink:0; margin-top:var(--hairline); color:var(--accent); }
.rn-help-note p { font-size:var(--text-sm); line-height:var(--leading); margin:0; }
.rn-search-label { flex:1; display:flex; align-items:center; gap:var(--space-2); }
.rn-search-label input { width:100%; border:0; background:transparent; min-height:var(--control); font:inherit; font-size:var(--text-sm); }
.rn-filter-label select { font:inherit; border:var(--hairline) solid var(--border); border-radius:var(--radius-md); padding:var(--space-3); background:var(--surface); min-height:var(--control); font-size:var(--text-sm); }
.rn-back { margin:0 0 var(--space-5) calc(-1 * var(--space-3)); }
.rn-success { display:flex; align-items:center; gap:var(--space-4); margin-bottom:var(--space-6); }
.rn-success>svg { flex-shrink:0; }
.rn-success>div { flex:1; }
.rn-success strong { font-size:var(--text-sm); }
.rn-success p { font-size:var(--text-sm); margin:var(--space-1) 0 0; }
.rn-success .btn { white-space:nowrap; }
.rn-detail-header { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--space-6); margin-bottom:var(--space-8); }
.rn-detail-header h1 { font-size:var(--text-3xl); letter-spacing:-.03em; line-height:1.25; margin-bottom:var(--space-4); color:var(--fg); }
.rn-detail-header .eyebrow { font-size:var(--text-xs); color:var(--fg-muted); letter-spacing:.08em; margin-bottom:var(--space-3); }
.rn-detail-meta { display:flex; gap:var(--space-4); flex-wrap:wrap; }
.rn-detail-meta>span { display:flex; gap:var(--space-2); align-items:center; font-size:var(--text-xs); color:var(--fg-muted); }
.rn-detail-header>.badge { margin-top:var(--space-6); white-space:nowrap; }
.rn-detail-layout { display:grid; grid-template-columns:minmax(0,1fr) calc(var(--space-16) * 4.5); gap:var(--space-6); align-items:start; }
.rn-detail-layout .stack { display:grid; gap:var(--space-6); }
.rn-detail-layout .panel { padding:var(--space-6); }
.rn-detail-layout .panel-header h2 { font-size:var(--text-lg); margin:0; }
.rn-detail-layout .panel-header { margin-bottom:var(--space-6); }
.rn-timeline { padding:0; margin:0; list-style:none; }
.rn-timeline .timeline-item { display:flex; gap:var(--space-4); position:relative; padding-bottom:var(--space-6); }
.rn-timeline .timeline-item:last-child { padding-bottom:0; }
.rn-timeline .timeline-item:not(:last-child)::before { content:""; position:absolute; top:var(--space-6); bottom:calc(-1 * var(--space-1)); left:var(--space-3); width:var(--hairline); background:var(--border); }
.rn-timeline .timeline-dot { position:relative; z-index:1; background:var(--rn-soft); width:var(--space-6); height:var(--space-6); border:var(--space-1) solid var(--surface); border-radius:var(--radius-pill); flex-shrink:0; box-shadow:0 0 0 var(--hairline) var(--border); color:var(--accent); display:grid; place-items:center; margin-top:var(--space-1); }
.rn-timeline .timeline-content { display:flex; flex-direction:column; gap:var(--space-1); }
.rn-timeline time { font-size:var(--text-xs); }
.rn-timeline strong { font-size:var(--text-sm); color:var(--fg); }
.rn-timeline p { font-size:var(--text-sm); line-height:var(--leading); color:var(--fg-muted); margin:0; }
.rn-conversation { display:grid; gap:var(--space-4); }
.rn-conversation .message { padding:var(--space-4); border-radius:var(--radius-md); margin:0; }
.rn-message-resident { background:var(--surface-subtle); border:var(--hairline) solid var(--border); margin-left:var(--space-6)!important; }
.rn-conversation .message-office { background:var(--rn-soft); border:var(--hairline) solid var(--border); margin-right:var(--space-6); }
.rn-message-top { display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-3); margin-bottom:var(--space-2); }
.rn-message-top strong { font-size:var(--text-sm); color:var(--fg); }
.rn-message-top time { font-size:var(--text-xs); color:var(--fg-muted); }
.rn-conversation p { font-size:var(--text-sm); line-height:var(--leading); color:var(--fg-muted); margin:0; overflow-wrap:anywhere; }
.rn-awaiting { display:flex; align-items:flex-start; gap:var(--space-3); background:var(--surface-subtle); padding:var(--space-5); border-radius:var(--radius-md); color:var(--fg-muted); }
.rn-awaiting>svg { flex-shrink:0; color:var(--accent); }
.rn-awaiting p { font-size:var(--text-sm); line-height:var(--leading); }
.rn-followup-form { border-top:var(--hairline) solid var(--border); margin-top:var(--space-6); padding-top:var(--space-6); }
.rn-followup-form .form-actions { display:flex; justify-content:space-between; align-items:center; gap:var(--space-3); margin-top:var(--space-3); }
.rn-followup-form .small { font-size:var(--text-sm); }
.rn-summary .eyebrow { color:var(--fg-muted); font-size:var(--text-xs); letter-spacing:.1em; }
.rn-summary h2 { font-size:var(--text-xl); margin-bottom:var(--space-4); }
.rn-description { font-size:var(--text-sm); color:var(--fg-muted); line-height:var(--leading); overflow-wrap:anywhere; }
.rn-summary dl { display:grid; gap:var(--space-4); border-top:var(--hairline) solid var(--border); margin-top:var(--space-6); padding-top:var(--space-5); }
.rn-summary dl>div { display:grid; gap:var(--space-1); }
.rn-summary dt { font-size:var(--text-xs); color:var(--fg-muted); text-transform:uppercase; letter-spacing:.05em; }
.rn-summary dd { font-size:var(--text-sm); color:var(--fg); margin:0; }
.rn-case-photo img { max-width:100%; border-radius:var(--radius-sm); }
.rn-case-photo .small { font-size:var(--text-xs); margin-top:var(--space-2); }
.rn-evidence-illustration { width:100%; height:auto; display:block; border-radius:var(--radius-md); }
.rn-evidence-pair { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-4); margin-bottom:var(--space-5); }
.rn-evidence-pair figure { margin:0; }
.rn-evidence-pair figcaption { font-size:var(--text-xs); color:var(--fg-muted); margin-top:var(--space-2); text-align:center; }
.rn-resolution>.small { font-size:var(--text-xs); line-height:var(--leading); margin:var(--space-3) 0 0; }
.rn-resolution-outcome { padding:var(--space-4); border:var(--hairline) solid var(--border); background:var(--rn-soft); border-radius:var(--radius-md); margin-bottom:var(--space-5); color:var(--fg); }
.rn-resolution-outcome strong { display:block; font-size:var(--text-sm); margin-bottom:var(--space-2); }
.rn-resolution-outcome p { font-size:var(--text-sm); line-height:var(--leading); margin:0; }
.rn-rating-panel .rn-kicker-icon { margin-bottom:var(--space-3); color:var(--accent); }
.rn-rating-panel>h2 { margin-bottom:var(--space-3); }
.rn-rating-panel>p { font-size:var(--text-sm); line-height:var(--leading); max-width:65ch; }
.rn-rating-stars { display:flex; gap:var(--space-2); margin:var(--space-5) 0; }
.rn-star-option { position:relative; cursor:pointer; }
.rn-star-option input { position:absolute; opacity:0; inset:0; width:100%; height:100%; margin:0; cursor:pointer; }
.rn-star-option>span { display:flex; gap:var(--space-1); flex-direction:column; align-items:center; justify-content:center; width:calc(var(--space-12) + var(--space-2)); height:var(--space-16); border:var(--hairline) solid var(--border); border-radius:var(--radius-md); color:var(--fg-muted); background:var(--surface-subtle); }
.rn-star-option b { font-size:var(--text-xs); }
.rn-star-option:hover>span { color:var(--warning); border-color:var(--warning); }
.rn-star-option input:checked+span { color:var(--warning); background:var(--warning-bg); border-color:var(--warning); box-shadow:inset 0 0 0 var(--hairline) var(--warning); }
.rn-star-option input:checked+span svg { fill:var(--warning-bg); }
.rn-star-option input:focus-visible+span { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.rn-rating-panel .field label { font-size:var(--text-sm); margin-bottom:var(--space-2); display:block; color:var(--fg); }
.rn-rating-panel .field { margin-bottom:var(--space-4); }
.rn-rating-saved { display:inline-flex; gap:var(--space-2); align-items:center; font-size:var(--text-sm); color:var(--accent); margin-left:var(--space-3); }
.rn-community-banner { display:grid; grid-template-columns:1fr 1fr; gap:var(--space-6); background-color:var(--accent-soft);  border:var(--hairline) solid var(--border); padding:var(--space-8) var(--space-10) 0; border-radius:var(--radius-lg); overflow:hidden; margin-bottom:var(--space-8); }
.rn-community-banner .eyebrow { font-size:var(--text-xs); color:var(--accent); letter-spacing:.1em; }
.rn-community-banner h2 { font-size:var(--text-3xl); color:var(--fg); letter-spacing:-.03em; line-height:1.2; margin-bottom:var(--space-4); }
.rn-community-banner p:not(.eyebrow) { font-size:var(--text-sm); line-height:var(--leading); color:var(--fg-muted); max-width:40ch; }
.rn-community-banner .rn-neighbourhood-photo { align-self:end; border-radius:var(--radius-lg) var(--radius-lg) 0 0; }
.rn-community-section { margin-bottom:var(--space-8); }
.rn-community-section .section-title { display:flex; justify-content:space-between; align-items:center; gap:var(--space-3); margin-bottom:var(--space-5); }
.rn-community-section .section-title h2 { margin:0; }
.rn-community-section .tag { font-size:var(--text-xs); }
.rn-initiative-card { padding:0!important; overflow:hidden; }
.rn-initiative-art { height:calc(var(--space-16) * 2); display:flex; align-items:center; justify-content:center; position:relative; color:var(--accent); background:var(--accent-soft); }
.rn-initiative-art-1 { color:var(--accent); background:var(--accent-soft); }
.rn-initiative-art-2 { color:var(--accent); background:var(--accent-soft); }
.rn-initiative-art>span { position:absolute; bottom:var(--space-3); left:var(--space-5); background:var(--surface); color:var(--fg-muted); border-radius:var(--radius-sm); padding:var(--space-1) var(--space-2); font-size:var(--text-xs); text-transform:uppercase; letter-spacing:.03em; }
.rn-initiative-card>div:last-child { padding:var(--space-5); }
.rn-initiative-card .case-meta { display:flex; align-items:center; gap:var(--space-1); font-size:var(--text-xs); color:var(--fg-muted); margin-bottom:var(--space-3); }
.rn-initiative-card h3 { font-size:var(--text-lg); color:var(--fg); margin-bottom:var(--space-3); }
.rn-initiative-card p:not(.case-meta) { font-size:var(--text-sm); color:var(--fg-muted); line-height:var(--leading); }
.rn-initiative-card .small { font-size:var(--text-xs); }
.rn-agency-guide { padding:var(--space-8)!important; }
.rn-agency-guide .eyebrow { font-size:var(--text-xs); color:var(--fg-muted); }
.rn-agency-guide .panel-header>svg { color:var(--accent); }
.rn-agency-guide .panel-header h2 { margin-bottom:0; }
.rn-agency-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-5); }
.rn-agency-grid .info-card { padding:var(--space-5) 0; border:none; box-shadow:none; background:transparent; }
.rn-agency-grid svg { color:var(--accent); margin-bottom:var(--space-3); }
.rn-agency-grid h3 { font-size:var(--text-base); color:var(--fg); margin-bottom:var(--space-3); }
.rn-agency-grid p { font-size:var(--text-sm); color:var(--fg-muted); line-height:var(--leading); }
.rn-agency-footer { display:flex; align-items:center; justify-content:space-between; gap:var(--space-6); border-top:var(--hairline) solid var(--border); padding-top:var(--space-5); }
.rn-agency-footer p { max-width:65ch; font-size:var(--text-sm); line-height:var(--leading); margin:0; }
.rn-agency-footer .btn { flex-shrink:0; }

/* Comfortable forms and clear, personal request details. */
.rn-page-header { margin-bottom:var(--space-6); }
.rn-page-header h1 { font-size:var(--text-3xl); line-height:1.3; }
.rn-page-header .eyebrow { color:var(--fg-muted); letter-spacing:.06em; font-size:var(--text-xs); }
.rn-form-section { padding:var(--space-6); }
.rn-section-number { color:var(--fg-muted); }
.rn-type-card>span { min-height:calc(var(--space-12) * 2); border-radius:var(--radius-sm); }
.rn-category-card>span { min-height:calc(var(--space-8) * 2); border-radius:var(--radius-sm); background:var(--surface); }
.rn-request-form .field { gap:var(--space-1); }
.rn-request-form .field label { margin:0; }
.rn-form-footer { background:var(--surface); }
.rn-search-label input { border:var(--hairline) solid var(--border); background:var(--surface); border-radius:var(--radius-sm); }
.rn-summary dt { text-transform:none; letter-spacing:0; }
.rn-summary h2 { font-size:var(--text-lg); }
.rn-detail-header h1 { font-size:var(--text-3xl); max-width:32ch; }
.rn-conversation .message-office { background:var(--accent-soft); }
.rn-rating-panel .rn-kicker-icon { color:var(--warning); background:var(--warning-bg); }
.rn-community-banner { grid-template-columns:minmax(0,1fr) calc(var(--space-16) * 4.5); padding:var(--space-6) var(--space-8); align-items:center; background:var(--surface); }
.rn-community-banner h2 { font-size:var(--text-2xl); line-height:1.4; max-width:24ch; }
.rn-community-banner .rn-neighbourhood-photo { align-self:center; border-radius:var(--radius-md); }
.rn-initiative-art { height:calc(var(--space-12) * 2); background:var(--accent-soft); color:var(--accent); justify-content:flex-start; padding-inline:var(--space-5); }
.rn-initiative-art>svg { width:var(--space-8); height:var(--space-8); }
.rn-initiative-art>span { position:static; margin-left:auto; background:var(--surface); }
.rn-agency-guide { padding:var(--space-6)!important; }
/* Warm, personal surfaces; woven detail is reserved for the welcome banner. */
.rn-resident .rn-hero {
  background-color:var(--surface-subtle);
  background-image:repeating-linear-gradient(45deg,transparent 0 7px,color-mix(in srgb,var(--civic-yellow-ink) 3%,transparent) 7px 8px),repeating-linear-gradient(-45deg,transparent 0 7px,color-mix(in srgb,var(--civic-yellow-ink) 3%,transparent) 7px 8px);
  border-color:color-mix(in srgb,var(--civic-yellow-ink) 16%,var(--border));
  box-shadow:none;
}
.rn-resident .rn-hero .eyebrow { color:var(--civic-yellow-ink); }
.rn-resident .rn-hero h1 { color:var(--navy); }
.rn-resident .rn-hero p:not(.eyebrow) { margin-bottom:0; }
.rn-resident .rn-neighbourhood-photo { box-shadow:inset 0 0 0 var(--hairline) var(--border); }
.rn-resident .rn-quick-card { box-shadow:none; border-color:var(--border); }
.rn-resident .rn-quick-card:hover { border-color:color-mix(in srgb,var(--accent) 35%,var(--border)); background:var(--surface); box-shadow:var(--shadow-sm); }
.rn-resident .rn-quick-aduan .rn-quick-icon { color:var(--civic-red); background:var(--civic-red-soft); }
.rn-resident .rn-quick-cadangan .rn-quick-icon { color:var(--civic-yellow-ink); background:var(--civic-yellow-soft); }
.rn-resident .rn-quick-permohonan .rn-quick-icon { color:var(--accent); background:var(--accent-soft); }
.rn-resident .rn-quick-copy strong,.rn-resident .rn-case-copy strong { color:var(--navy); }
.rn-resident .rn-case-icon { background:transparent; color:var(--fg-muted); }
.rn-resident .rn-community-link { box-shadow:none; }
.rn-resident .rn-community-link .rn-kicker-icon { background:var(--civic-yellow-soft); color:var(--civic-yellow-ink); }
.rn-resident.rn-new-request .rn-page-header,.rn-resident.rn-new-request .rn-form-layout { max-width:calc(var(--space-16) * 14); margin-inline:auto; }
.rn-resident.rn-new-request .rn-form-layout { grid-template-columns:minmax(0,1fr); gap:0; }
.rn-resident.rn-new-request .rn-form-aside { position:static; display:block; }
.rn-resident.rn-new-request .rn-form-aside .rn-help-note { padding-block:var(--space-4); }
.rn-resident .rn-category-card strong { color:var(--fg-muted); }
.rn-resident .rn-category-card input:checked+span strong { color:var(--accent); }
.rn-resident .rn-form-section-heading { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:0 var(--space-3); margin-bottom:var(--space-3); }
.rn-resident .rn-form-section-heading h2 { margin:0; }
.rn-resident .rn-sample-link { display:inline-flex; align-items:center; justify-content:flex-start; min-height:var(--control); gap:var(--space-1); padding:var(--space-1) 0; border:0; border-radius:var(--radius-sm); background:transparent; color:var(--accent); font-size:var(--text-xs); font-weight:500; line-height:1.4; text-align:left; white-space:nowrap; }
.rn-resident .rn-sample-link:hover { color:var(--accent-hover); text-decoration:underline; text-underline-offset:var(--space-1); }
.rn-resident .rn-sample-link:active { transform:translateY(var(--hairline)); }
.rn-resident .rn-sample-link:focus-visible { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.rn-resident .rn-type-card>span,.rn-resident .rn-category-card>span { position:relative; padding-right:var(--space-8); }
.rn-resident .rn-choice-tick { position:absolute; right:var(--space-2); top:var(--space-2); display:grid; place-items:center; width:var(--space-4); height:var(--space-4); border-radius:var(--radius-pill); background:var(--accent); color:var(--accent-fg); opacity:0; }
.rn-resident input:checked+span>.rn-choice-tick { opacity:1; }
.rn-resident .rn-category-card input:checked+span strong { font-weight:600; }
.rn-resident .rn-community-banner { background:var(--surface-subtle); box-shadow:none; }
.rn-resident .rn-initiative-art { background:var(--surface-subtle); }
.rn-resident .rn-initiative-art-1 { background:var(--civic-yellow-soft); color:var(--civic-yellow-ink); }
.rn-resident .rn-initiative-art-2 { background:var(--civic-red-soft); color:var(--civic-red); }
@media (max-width:68.75em) {
  .rn-quick-card { gap:var(--space-3); padding:var(--space-4); }
  .rn-quick-card>svg { display:none; }
  .rn-quick-icon { width:var(--space-10); height:var(--space-10); }
  .rn-home-grid { grid-template-columns:minmax(0,1.5fr) minmax(0,1fr); gap:var(--space-4); }
  .rn-case-card { flex-wrap:wrap; }
  .rn-case-end { margin-left:calc(var(--space-10) + var(--space-3)); }
  .rn-case-end>svg { display:none; }
  .rn-form-layout { grid-template-columns:minmax(0,1fr) calc(var(--space-16) * 4); gap:var(--space-5); }
  .rn-detail-layout { grid-template-columns:minmax(0,1fr) calc(var(--space-16) * 4); }
  .rn-category-options { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media (max-width:50em) {
  .rn-hero { grid-template-columns:minmax(0,1fr) calc(var(--space-16) * 3); padding:var(--space-6); gap:var(--space-5); }
  .rn-hero h1 { font-size:var(--text-2xl); }
  .rn-quick-card { align-items:flex-start; }
  .rn-quick-icon { width:var(--space-8); height:var(--space-8); background:transparent; }
  .rn-home-grid { grid-template-columns:1fr; }
  .rn-side-stack { grid-template-columns:1fr; }
  .rn-case-card { flex-wrap:nowrap; }
  .rn-case-end { margin-left:0; }
  .rn-form-layout { grid-template-columns:1fr; }
  .rn-form-aside { position:static; display:grid; grid-template-columns:1fr 1fr; gap:var(--space-5); }
  .rn-detail-layout { grid-template-columns:1fr; }
  .rn-detail-layout>aside { grid-template-columns:1fr 1fr; }
  .rn-community-banner { grid-template-columns:minmax(0,1fr) calc(var(--space-16) * 3); padding:var(--space-6); }
  .rn-community-banner h2 { font-size:var(--text-xl); }
  .rn-initiative-grid { grid-template-columns:repeat(2,minmax(0,1fr))!important; }
  .rn-agency-footer { align-items:flex-start; }
}
@media (max-width:35em) {
  .rn-welcome { gap:var(--space-2); margin-bottom:var(--space-3); }
  .rn-resident .rn-location { font-size:var(--text-xs); gap:var(--space-1); }
  .rn-location-divider { margin-inline:0; }
  .rn-profile { font-size:var(--text-xs); }
  .rn-avatar { display:none!important; }
  .rn-hero { grid-template-columns:1fr; padding:var(--space-5); gap:var(--space-4); }
  .rn-hero-art { display:none; }
  .rn-hero h1 { font-size:var(--text-2xl); margin-bottom:var(--space-2); }
  .rn-hero p:not(.eyebrow) { font-size:var(--text-sm); }
  .rn-hero .eyebrow { font-size:var(--text-xs); margin-bottom:var(--space-2); }
  .rn-hero-actions { gap:var(--space-2); }
  .rn-hero-foot { display:block; width:100%; }
  .rn-services { margin-top:var(--space-6); }
  .rn-section-heading h2 { font-size:var(--text-lg); }
  .rn-section-heading p { font-size:var(--text-sm); }
  .rn-quick-actions { gap:var(--space-2); }
  .rn-quick-card { flex-direction:column; align-items:center; justify-content:flex-start; text-align:center; padding:var(--space-3) var(--space-2); gap:var(--space-2); min-height:calc(var(--space-12) * 2.5); }
  .rn-quick-icon { width:var(--space-10); height:var(--space-10); background:var(--accent-soft); }
  .rn-quick-copy strong { font-size:var(--text-sm); font-weight:600; }
  .rn-quick-copy>span { display:none; }
  .rn-home-grid { margin-top:var(--space-6); gap:var(--space-4); }
  .rn-my-panel,.rn-updates { padding:var(--space-4)!important; }
  .rn-my-panel .panel-header { gap:var(--space-2); flex-wrap:wrap; }
  .rn-my-panel .panel-header .btn { padding-inline:var(--space-2); }
  .rn-mini-stats { gap:var(--space-4); flex-wrap:wrap; }
  .rn-case-card { flex-wrap:wrap; gap:var(--space-3); align-items:flex-start; padding:var(--space-4) 0!important; }
  .rn-case-copy { flex-basis:calc(100% - var(--space-10) - var(--space-3)); }
  .rn-case-end { margin-left:calc(var(--space-10) + var(--space-3)); }
  .rn-community-link { padding:var(--space-4)!important; }
  .rn-page-header { align-items:flex-start; gap:var(--space-3); }
  .rn-page-header>button { width:auto; margin-top:0; }
  .rn-page-header h1 { font-size:var(--text-2xl); }
  .rn-page-header .lede { font-size:var(--text-sm); }
  .rn-form-section { padding:var(--space-5) var(--space-4); gap:var(--space-2); }
  .rn-section-number { width:var(--space-5); font-size:var(--text-xs); }
  .rn-form-section h2 { font-size:var(--text-base); line-height:1.5; margin-bottom:var(--space-4); }
  .rn-type-options { gap:var(--space-2); }
  .rn-type-card>span { padding:var(--space-3); gap:var(--space-3); min-height:calc(var(--space-12) * 2); overflow-wrap:anywhere; }
  .rn-type-card strong { font-size:var(--text-xs); }
  .rn-request-form .field label { font-size:var(--text-sm); }
  .rn-request-form input,.rn-request-form textarea,.rn-request-form select,.rn-followup-form textarea,.rn-rating-panel textarea,.rn-search-label input,.rn-filter-label select { font-size:var(--text-base); padding:var(--space-3); }
  .rn-request-form .form-grid { grid-template-columns:1fr; gap:0; }
  .rn-category-card>span { padding:var(--space-3); min-height:calc(var(--space-10) * 2); gap:var(--space-2); flex-direction:column; }
  .rn-category-card strong { font-size:var(--text-sm); }
  .rn-optional { float:none; display:block; padding-top:var(--space-1); font-size:var(--text-xs); }
  .rn-upload { padding:var(--space-4); gap:var(--space-3); flex-direction:column; }
  .rn-upload strong { font-size:var(--text-sm); }
  .rn-upload .small { font-size:var(--text-sm); }
  .rn-upload .row { gap:var(--space-2); }
  .rn-photo-preview { align-items:flex-start; flex-direction:column; gap:var(--space-3); }
  .rn-photo-preview img,.rn-photo-preview>.rn-evidence-illustration { width:100%; height:auto; max-height:calc(var(--space-16) * 2.5); object-fit:contain; }
  .rn-form-footer { padding:var(--space-5); }
  .rn-consent span { font-size:var(--text-sm); }
  .rn-form-footer .form-actions { align-items:stretch; flex-direction:column; gap:var(--space-3); }
  .rn-form-footer .btn { width:100%; justify-content:center; }
  .rn-form-aside { grid-template-columns:1fr; gap:0; }
  .rn-form-aside .rn-help-note { display:none; }
  .rn-success { align-items:flex-start; flex-wrap:wrap; padding:var(--space-4); gap:var(--space-3); }
  .rn-success>div { flex:1; min-width:65%; }
  .rn-success strong,.rn-success p { font-size:var(--text-sm); line-height:var(--leading); }
  .rn-success .btn { width:100%; }
  .rn-detail-header { display:block; margin-bottom:var(--space-6); }
  .rn-detail-header h1 { font-size:var(--text-2xl); }
  .rn-detail-header>.badge { margin-top:var(--space-4); }
  .rn-detail-meta { gap:var(--space-3); }
  .rn-detail-layout .panel { padding:var(--space-5) var(--space-4); }
  .rn-detail-layout>aside { grid-template-columns:1fr; }
  .rn-detail-layout>aside .rn-help-note { padding:0 var(--space-2) var(--space-3); }
  .rn-message-top { flex-direction:column; gap:var(--space-1); }
  .rn-message-resident { margin-left:var(--space-3)!important; }
  .rn-conversation .message-office { margin-right:var(--space-3); }
  .rn-followup-form .form-actions { flex-direction:column; align-items:flex-start; }
  .rn-followup-form .btn { align-self:flex-end; }
  .rn-evidence-pair { grid-template-columns:1fr; }
  .rn-rating-stars { gap:var(--space-2); }
  .rn-star-option>span { width:var(--control); height:var(--space-16); }
  .rn-rating-saved { margin-left:0; margin-top:var(--space-4); display:flex; }
  .rn-community-banner { grid-template-columns:1fr; padding:var(--space-5); gap:var(--space-4); }
  .rn-community-banner .rn-neighbourhood-photo { max-height:calc(var(--space-16) * 2.5); object-fit:cover; }
  .rn-community-banner h2 { font-size:var(--text-xl); max-width:none; }
  .rn-community-section .section-title { align-items:flex-start; flex-wrap:wrap; }
  .rn-community-section .section-title h2 { font-size:var(--text-lg); }
  .rn-community-section .tag { font-size:var(--text-xs); white-space:nowrap; }
  .rn-initiative-grid { grid-template-columns:1fr!important; }
  .rn-agency-guide { padding:var(--space-5)!important; }
  .rn-agency-guide h2 { font-size:var(--text-lg); }
  .rn-agency-guide .panel-header>svg { display:none; }
  .rn-agency-grid { grid-template-columns:1fr; gap:0; }
  .rn-agency-grid .info-card { border-bottom:var(--hairline) solid var(--border); padding:var(--space-5) 0; }
  .rn-agency-grid .info-card:last-child { border-bottom:0; }
  .rn-agency-grid h3 { margin-bottom:var(--space-2); }
  .rn-agency-grid p { margin-bottom:0; }
  .rn-agency-footer { flex-direction:column; gap:var(--space-3); }
  .rn-agency-footer .btn { width:100%; justify-content:center; }
}
@media screen and (max-width:640px) {
  .rn-resident .rn-form-section-heading { margin-bottom:var(--space-2); gap:0 var(--space-2); }
  .rn-resident .rn-form-section-heading h2 { font-size:var(--text-sm); margin:0; }
  .rn-resident .rn-type-card>span { padding-right:var(--space-4); padding-left:var(--space-2); }
  .rn-resident .rn-category-card>span { padding-right:var(--space-6); }
  .rn-resident .rn-choice-tick { width:var(--space-3); height:var(--space-3); top:var(--space-1); right:var(--space-1); }
  .rn-resident .rn-choice-tick svg { width:var(--space-2); height:var(--space-2); }
  .rn-resident .rn-quick-icon { border-radius:var(--radius-sm); }
  .rn-resident.rn-new-request .rn-form-aside:has(.rn-help-note) { display:none; }
}
@media (prefers-reduced-motion:reduce) {
  .rn-resident *, .rn-resident *::before, .rn-resident *::after { transition:none!important; animation:none!important; }
  .rn-quick-card:hover,.rn-quick-card:active { transform:none!important; }
}


/* One card language for every named representative and service leader. */
.rn-rep-entry { display:flex; align-items:center; gap:var(--space-3); width:100%; min-height:calc(var(--space-10) * 2); margin-top:var(--space-4); padding:var(--space-4) var(--space-5); border:var(--hairline) solid var(--border); border-radius:var(--radius-md); background:var(--surface); color:var(--fg); font:inherit; text-align:left; cursor:pointer; box-shadow:var(--paper-shadow); transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out); }
.rn-rep-entry:hover { background:var(--accent-soft); border-color:var(--accent); }
.rn-rep-entry:active { transform:translateY(var(--hairline)); }
.rn-rep-entry:focus-visible,.rn-representatives a:focus-visible,.rn-representatives summary:focus-visible { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.rn-rep-entry-symbol,.rn-rep-contact-symbol { display:grid; place-items:center; flex:0 0 var(--space-10); width:var(--space-10); height:var(--space-10); border-radius:var(--radius-sm); background:var(--accent-soft); color:var(--accent); }
.rn-rep-entry-copy { display:grid; gap:var(--space-1); flex:1; min-width:0; }
.rn-rep-entry-copy strong { font-size:var(--text-base); font-weight:600; }
.rn-rep-entry-copy>span { font-size:var(--text-sm); color:var(--fg-muted); line-height:1.4; }
.rn-rep-entry>svg { flex-shrink:0; color:var(--accent); }
.rn-representatives { max-width:100%; }
.rn-representatives .rn-page-header { margin-bottom:var(--space-3); }
.rn-representatives .rn-page-header h1 { margin-bottom:var(--space-2); }
.rn-representatives .rn-page-header .lede { margin-bottom:0; }
.rn-rep-governance { display:flex; gap:var(--space-2); align-items:flex-start; margin:0 0 var(--space-4)!important; color:var(--fg-muted); font-size:var(--text-xs); line-height:1.6; max-width:100ch; }
.rn-rep-governance svg { flex-shrink:0; margin-top:var(--hairline); }
.rn-official-toolbar { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,calc(var(--space-16) * 3)); gap:var(--space-2); }
.representative-search { display:flex; align-items:center; gap:var(--space-2); padding-inline:var(--space-3); min-width:0; min-height:var(--control); border:var(--hairline) solid var(--border); border-radius:var(--radius-sm); background:var(--surface); color:var(--fg-muted); }
.representative-search:focus-within { outline:var(--ring) solid var(--focus); outline-offset:var(--space-1); }
.representative-search>svg { flex-shrink:0; }
.representative-search input { border:0; padding:0; background:transparent; min-width:0; width:100%; min-height:var(--control); color:var(--fg); box-shadow:none; }
.representative-search input:focus { outline:0; box-shadow:none; }
.representative-scope { min-width:0; }
.representative-scope select { width:100%; min-width:0; min-height:var(--control); }
.rn-official-count { font-size:var(--text-xs); color:var(--fg-muted); margin:var(--space-2) 0 var(--space-3); }
.rn-official-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-3); align-items:stretch; }
.rn-representatives .rn-official-card { display:flex; flex-direction:column; min-width:0; padding:var(--space-4); background:var(--brand-bg); border:var(--hairline) solid var(--brand-line); color:var(--brand-ink); border-radius:var(--radius-md); box-shadow:none; }
.rn-official-card[hidden] { display:none!important; }
.rn-rep-profile-heading { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:var(--space-1) var(--space-3); margin-bottom:var(--space-3); }
.rn-rep-seat { font-size:var(--text-xs); font-weight:500; line-height:1.4; color:var(--brand-ink); }
.rn-rep-verified { display:inline-flex; align-items:center; gap:var(--space-1); font-size:var(--text-xs); line-height:1.4; color:var(--brand-muted); }
.rn-rep-verified svg { flex-shrink:0; }
.rn-rep-profile-person { display:flex; align-items:center; gap:var(--space-3); }
.rn-rep-portrait { display:block; flex:0 0 calc(var(--space-4) * 5); width:calc(var(--space-4) * 5); height:calc(var(--space-5) * 5); object-fit:cover; object-position:center top; border-radius:var(--radius-sm); background:var(--brand-surface); border:var(--hairline) solid var(--brand-line); }
.rn-rep-portrait-unavailable { display:flex; flex-direction:column; justify-content:center; align-items:center; padding:var(--space-2); text-align:center; color:var(--brand-muted); gap:var(--space-2); }
.rn-rep-portrait-unavailable>span { font-size:var(--text-xl); font-family:var(--font-display); color:var(--brand-ink); }
.rn-rep-portrait-unavailable small { font-size:var(--text-xs); line-height:1.25; }
.rn-rep-identity { min-width:0; }
.rn-official-card .eyebrow { font-size:var(--text-xs); color:var(--brand-muted); letter-spacing:0; margin:0 0 var(--space-1); }
.rn-representatives .rn-official-card h2 { color:var(--brand-ink); font-size:var(--text-xl); font-family:var(--font-display); font-weight:700; line-height:1.2; letter-spacing:0; margin:0 0 var(--space-1); overflow-wrap:anywhere; }
.rn-official-role { color:var(--brand-muted); font-size:var(--text-xs); line-height:1.4; margin:0 0 var(--space-2); }
.rn-rep-party { display:inline-flex; align-items:center; padding:var(--space-1) var(--space-2); border:var(--hairline) solid var(--brand-line); border-radius:var(--radius-pill); background:var(--brand-surface); color:var(--brand-ink); font-size:var(--text-xs); line-height:1.2; }
.rn-rep-role { font-size:var(--text-xs); line-height:1.5; color:var(--brand-muted); margin:var(--space-3) 0; }
.rn-official-details { margin-top:auto; border-top:var(--hairline) solid var(--brand-line); }
.rn-official-details summary,.rn-office-details summary { display:flex; align-items:center; justify-content:space-between; gap:var(--space-2); min-height:var(--control); padding-block:var(--space-2); cursor:pointer; list-style:none; font-size:var(--text-xs); font-weight:500; color:var(--brand-ink); }
.rn-official-details summary::-webkit-details-marker,.rn-office-details summary::-webkit-details-marker { display:none; }
.rn-official-details summary>svg,.rn-office-details summary>svg { flex-shrink:0; transition:transform var(--dur-fast) var(--ease-out); }
.rn-official-details[open]>summary>svg,.rn-office-details[open]>summary>svg { transform:rotate(180deg); }
.rn-official-details summary:hover { color:white; }
.rn-official-details summary:focus-visible,.rn-official-card a:focus-visible { outline-color:var(--brand-ink); }
.rn-official-details-body { padding-bottom:var(--space-1); }
.rn-rep-profile-actions { display:flex; flex-wrap:wrap; gap:var(--space-2); margin-top:var(--space-2); }
.rn-rep-profile-actions .btn { min-height:var(--control); font-size:var(--text-xs); padding-inline:var(--space-3); text-decoration:none; }
.rn-rep-profile-actions .btn-primary,.rn-rep-profile-actions .btn-primary::before { background:var(--brand-ink); border-color:var(--brand-ink); color:var(--brand-bg); box-shadow:none; }
.rn-rep-profile-actions .btn-primary:hover,.rn-rep-profile-actions .btn-primary:hover::before { background:white; border-color:white; }
.rn-rep-profile-actions .btn-ghost,.rn-rep-profile-actions .btn-ghost::before { background:transparent; border-color:var(--brand-line); color:var(--brand-ink); }
.rn-rep-profile-actions .btn-ghost:hover,.rn-rep-profile-actions .btn-ghost:hover::before { background:var(--brand-surface); }
.rn-official-details .rn-rep-contact-methods { border-color:var(--brand-line); }
.rn-official-details .rn-rep-contact-methods a { border-color:var(--brand-line); }
.rn-official-details .rn-rep-contact-methods a>span,.rn-official-details address { color:var(--brand-muted); }
.rn-official-details .rn-rep-contact-methods a>strong,.rn-official-details .rn-rep-contact-methods a>svg { color:var(--brand-ink); }
.rn-official-details address { font-style:normal; line-height:1.5; font-size:var(--text-xs); margin:var(--space-3) 0; }
.rn-official-empty { text-align:center; padding:var(--space-6) var(--space-4); border:var(--hairline) dashed var(--border); border-radius:var(--radius-md); }
.rn-official-empty h2 { font-size:var(--text-lg); margin-bottom:var(--space-2); }
.rn-official-empty p { color:var(--fg-muted); font-size:var(--text-sm); margin-bottom:var(--space-3); }
.rn-official-empty[hidden] { display:none; }
.rn-rep-section-label { display:flex; align-items:baseline; justify-content:space-between; gap:var(--space-2) var(--space-4); flex-wrap:wrap; margin:var(--space-5) 0 var(--space-3); }
.rn-rep-section-label h2 { font-size:var(--text-base); margin:0; }
.rn-rep-section-label p { font-size:var(--text-xs); color:var(--fg-muted); margin:0; }
.rn-rep-contacts { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:var(--space-3); align-items:start; }
.rn-representatives .rn-rep-contact { padding:var(--space-4); min-width:0; }
.rn-rep-contact-heading { display:flex; gap:var(--space-3); align-items:center; margin-bottom:var(--space-2); }
.rn-rep-contact-heading>div { min-width:0; }
.rn-rep-contact-heading .eyebrow { font-size:var(--text-xs); color:var(--fg-muted); margin:0 0 var(--space-1); letter-spacing:.025em; }
.rn-rep-contact-heading h2 { font-size:var(--text-base); margin:0; line-height:1.4; }
.rn-rep-contact-description { font-size:var(--text-sm); color:var(--fg-muted); line-height:1.5; margin:0; }
.rn-office-details { border-top:var(--hairline) solid var(--border); margin-top:var(--space-3); }
.rn-office-details summary { color:var(--accent); }
.rn-office-details summary:hover { color:var(--accent-hover); }
.rn-rep-contact address { font-size:var(--text-xs); color:var(--fg-muted); line-height:1.5; font-style:normal; margin:var(--space-3) 0 0; }
.rn-rep-contact-methods { border-block:var(--hairline) solid var(--border); }
.rn-rep-contact-methods a { display:flex; align-items:center; gap:var(--space-2); min-height:var(--control); padding:var(--space-2) 0; font-size:var(--text-xs); line-height:1.4; text-decoration:none; border-bottom:var(--hairline) solid var(--border); }
.rn-rep-contact-methods a:last-child { border-bottom:0; }
.rn-rep-contact-methods a>span { flex:0 0 calc(var(--space-4) * 3.5); color:var(--fg-muted); font-size:var(--text-xs); }
.rn-rep-contact-methods a>strong { min-width:0; color:var(--accent); font-weight:500; overflow-wrap:anywhere; flex:1; }
.rn-rep-contact-methods a>svg { color:var(--fg-muted); flex-shrink:0; }
.rn-rep-contact-methods a:hover>strong { text-decoration:underline; text-underline-offset:var(--space-1); }
.rn-rep-source { display:inline-flex; align-items:center; gap:var(--space-2); min-height:var(--control); max-width:100%; color:var(--fg-muted); font-size:var(--text-xs); line-height:1.4; text-decoration:none; margin-top:var(--space-1); }
.rn-rep-source:hover { color:var(--accent); text-decoration:underline; text-underline-offset:var(--space-1); }
.rn-rep-source svg { flex-shrink:0; }
.rn-rep-request { display:flex; align-items:center; justify-content:space-between; gap:var(--space-5); padding:var(--space-4); border:var(--hairline) solid var(--border); border-radius:var(--radius-md); background:var(--accent-soft); margin-top:var(--space-5); }
.rn-rep-request>div { min-width:0; }
.rn-rep-request .eyebrow { color:var(--accent); font-size:var(--text-xs); margin-bottom:var(--space-1); letter-spacing:.04em; }
.rn-rep-request h2 { font-size:var(--text-lg); margin-bottom:var(--space-2); }
.rn-rep-request p:not(.eyebrow) { color:var(--fg-muted); font-size:var(--text-xs); line-height:1.5; margin:0; max-width:68ch; }
.rn-rep-request .btn { min-height:var(--control); flex-shrink:0; }
.rn-rep-service-list { padding:0; list-style:none; border:var(--hairline) solid var(--border); border-radius:var(--radius-md); background:var(--surface); overflow:hidden; }
.rn-rep-service-item { display:grid; grid-template-columns:var(--space-10) minmax(0,1fr) auto; align-items:center; gap:var(--space-3); padding:var(--space-3) var(--space-4); border-bottom:var(--hairline) solid var(--border); }
.rn-rep-service-item:last-child { border-bottom:0; }
.rn-rep-service-item>div { min-width:0; }
.rn-rep-service-item h3 { font-size:var(--text-sm); line-height:1.4; margin:0; }
.rn-rep-service-item p { font-size:var(--text-xs); line-height:1.5; color:var(--fg-muted); margin:var(--space-1) 0 0; }
.rn-rep-service-actions { display:flex; align-items:center; flex-wrap:wrap; gap:var(--space-2); }
.rn-rep-service-actions a { min-height:var(--control); display:inline-flex; align-items:center; gap:var(--space-1); font-size:var(--text-xs); }
.rn-rep-service-actions .rn-rep-source { margin:0; }
.rn-rep-footnote { margin-top:var(--space-4); font-size:var(--text-xs); line-height:1.6; color:var(--fg-muted); }
.rn-rep-footnote p { margin:0 0 var(--space-1); }
@media screen and (min-width:1500px) {
  .rn-official-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media screen and (max-width:640px) {
  .rn-rep-entry { min-height:calc(var(--space-10) * 2); padding:var(--space-3); gap:var(--space-3); margin-top:var(--space-3); }
  .rn-rep-entry-copy strong { font-size:var(--text-sm); }
  .rn-rep-entry-copy>span { font-size:var(--text-xs); }
  .rn-representatives .rn-page-header { margin-bottom:var(--space-3); }
  .rn-rep-governance { margin-bottom:var(--space-3)!important; }
  .rn-official-toolbar { grid-template-columns:minmax(0,1fr) minmax(0,calc(var(--space-8) * 4)); }
  .rn-official-toolbar input { font-size:var(--text-base); }
  .rn-official-toolbar select { font-size:var(--text-xs); padding-inline:var(--space-2); }
  .representative-search { gap:var(--space-1); padding-inline:var(--space-2); }
  .representative-search>svg { width:var(--space-4); height:var(--space-4); }
  .rn-official-grid,.rn-rep-contacts { grid-template-columns:1fr; gap:var(--space-3); }
  .rn-representatives .rn-official-card { padding:var(--space-3); }
  .rn-rep-profile-heading { gap:var(--space-1) var(--space-2); margin-bottom:var(--space-3); }
  .rn-rep-profile-person { align-items:center; }
  .rn-representatives .rn-official-card h2 { font-size:var(--text-xl); }
  .rn-rep-section-label { display:block; margin-top:var(--space-5); }
  .rn-rep-section-label p { margin-top:var(--space-1); }
  .rn-representatives .rn-rep-contact { padding:var(--space-3); }
  .rn-rep-source { margin-top:0; }
  .rn-rep-request { flex-direction:column; align-items:stretch; gap:var(--space-3); padding:var(--space-3); margin-top:var(--space-4); }
  .rn-rep-request h2 { font-size:var(--text-base); }
  .rn-rep-request .btn { align-self:flex-start; }
  .rn-rep-service-item { grid-template-columns:var(--space-8) minmax(0,1fr); gap:var(--space-2) var(--space-3); padding:var(--space-3); }
  .rn-rep-service-item>.rn-rep-contact-symbol { width:var(--space-8); height:var(--space-8); }
  .rn-rep-service-actions { grid-column:2; }
  .rn-rep-footnote { margin-top:var(--space-3); }
}

.rn-official-checked { color:var(--brand-muted); font-size:var(--text-xs); margin:var(--space-3) 0 0; }
.rn-rep-directory-links { display:flex; flex-wrap:wrap; gap:var(--space-2) var(--space-4); margin-bottom:var(--space-2); }

.rn-rep-portrait-contain { object-fit:contain; object-position:center; }

.rn-resident.rn-representatives .representative-search input[type=search] { padding:0; border:0; background:transparent; box-shadow:none; }