/* ViArt Card uses the same workspace and navigation as other staff sections. */
#open-viart-card {font:inherit;font-size:14px;}
.viart-card-page {max-width:1200px;margin:0 auto;padding:24px;}
.card-page-heading {display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;}
.card-page-heading h1 {font-size:30px;margin:6px 0 10px;letter-spacing:-.6px;}
.card-eyebrow {color:#756697;font-size:11px;font-weight:700;letter-spacing:1.5px;}
.viart-card-page p {color:#696477;line-height:1.65;margin:8px 0 14px;}
.viart-card-page h2 {font-size:18px;margin:0 0 12px;}
.viart-card-page h3 {font-size:16px;margin:20px 0 12px;}
.card-surface {background:var(--surface,#fff);border:1px solid #e7e2ee;border-radius:18px;padding:24px;margin-bottom:20px;}
.card-connection {display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;}
.card-guide-grid {display:grid;grid-template-columns:1fr 1fr;gap:20px;}
.viart-card-page [data-card-controls] {display:flex;flex-direction:column;gap:10px;max-width:260px;}
.viart-card-page small {color:#696477;font-size:12px;line-height:1.5;}
.viart-card-page [data-card-status] {display:inline-flex;align-items:center;gap:9px;padding:8px 13px;border-radius:30px;font-weight:650;font-size:14px;margin:0;}
.viart-card-page [data-card-status]::before {content:'';width:8px;height:8px;border-radius:50%;background:currentColor;flex-shrink:0;}
.viart-card-page [data-state=online] {background:#e5f5ec;color:#187746;}
.viart-card-page [data-state=offline] {background:#fdeceb;color:#ac352d;}
.viart-card-page [data-state=waiting] {background:#fff3cf;color:#8a6100;}
.viart-card-page [data-card-error] {background:#fdeceb;color:#ac352d;border-radius:12px;padding:14px;}
.viart-card-page [data-card-notice] {background:#e5f5ec;color:#187746;border-radius:12px;padding:14px;}
.viart-card-page [data-card-error]:empty,.viart-card-page [data-card-notice]:empty {display:none;}
.viart-card-page summary {cursor:pointer;font-weight:650;font-size:16px;padding:4px 0;}
.viart-card-page details[open]>summary {margin-bottom:16px;}
.viart-card-page [data-card-review] {background:#faf8fd;padding:16px;border-radius:12px;margin:16px 0;}
.viart-card-page [data-card-selection],.card-fields {display:grid;grid-template-columns:1fr 1fr;gap:14px 20px;}
.viart-card-page label {display:grid;gap:7px;font-size:14px;font-weight:550;}
.viart-card-page input,.viart-card-page select {width:100%;min-width:0;box-sizing:border-box;font:inherit;background:#fff;border:1px solid #dcd6e8;border-radius:9px;min-height:42px;padding:10px;color:#302943;}
.card-wide {grid-column:1/-1;}
.card-fields {margin-bottom:16px;}
.card-actions {display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.card-event {border:1px solid #e7e2ee;border-radius:12px;padding:16px;margin-top:12px;}
.card-event[data-outcome=review] {border-left:4px solid #d7a63c;}
.card-event[data-outcome=recorded],.card-event[data-outcome=already_present] {border-left:4px solid #3c9c70;}
.card-event button {margin:4px 8px 0 0;}
.viart-card-page [data-card-bindings]>p {display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px 0;border-bottom:1px solid #eee9f3;}
.viart-card-page button {font:inherit;font-size:14px;cursor:pointer;}
.viart-card-page [data-card-selection]>button {align-self:end;justify-self:start;}
.viart-card-page [data-card-settings-result] {color:#187746;}
@media(max-width:700px) {.viart-card-page{padding:16px 8px;}.card-guide-grid,.card-connection,.viart-card-page [data-card-selection],.card-fields{grid-template-columns:1fr;}.card-surface{padding:18px;}.card-page-heading{align-items:flex-start;}.card-page-heading h1{font-size:25px;}.viart-card-page [data-card-controls]{max-width:none;}.card-wide{grid-column:auto;}.viart-card-page [data-card-bindings]>p{flex-wrap:wrap;}}

.student-personal-card:not(:empty) {padding:18px 20px;margin-bottom:18px;border:1px solid #ddd7f1;border-radius:16px;background:#faf8ff;}
.student-card-heading {display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.student-card-heading small,.student-card-heading strong {display:block;}
.student-card-heading small {color:#756697;margin-bottom:6px;}
.student-personal-card [role="alert"]:empty {display:none;}
.student-personal-card [role="alert"] {color:#a13c31;margin-bottom:0;}
.student-personal-card form label {display:block;margin:12px 0;}
