/* Production additions to the approved, shared visual system. No framework dependency. */
.signout { background:none; border:1px solid var(--line); border-radius:5px; padding:8px 12px; min-height:40px; font-size:11px; color:var(--muted); }
.flash { display:flex; gap:10px; align-items:flex-start; border:1px solid #cddbba; border-radius:5px; padding:14px 18px; margin-bottom:23px; font-size:12px; background:#eff7e5; color:#3b6128; }
.flash svg { width:18px; height:18px; }
.flash.error { border-color:#e7c9bc; background:#fff5ef; color:#8f3525; }
.flash ul { margin:5px 0 0; padding-left:18px; }
.field-error { font-size:11px; color:#a1382c; }
input[type=checkbox],input[type=radio] { accent-color:var(--green); }
input[type=file]::file-selector-button { background:white; border:1px solid var(--line); border-radius:5px; padding:10px; margin-right:12px; color:var(--green); cursor:pointer; }
.data-table { width:100%; border-collapse:collapse; text-align:left; font-size:12px; }
.data-table th { background:#f6f9f1; color:#69795f; font-size:10px; letter-spacing:.8px; text-transform:uppercase; padding:14px 18px; border-bottom:1px solid var(--line); font-weight:600; }
.data-table td { padding:16px 18px; border-bottom:1px solid #eaf0e3; vertical-align:middle; }
.data-table tr:last-child td { border-bottom:0; }
.data-table tbody tr:hover { background:#fcfdf9; }
.data-table td small { color:var(--muted); display:block; font-size:11px; margin-top:4px; }
.data-table .actions { display:flex; align-items:center; gap:9px; }
.data-table .actions a { color:var(--green); font-weight:600; display:inline-flex; align-items:center; min-height:40px; }
.table-wrap { overflow-x:auto; max-width:100%; }
.table-wrap table { min-width:600px; }
.pagination { display:flex; justify-content:center; align-items:center; gap:18px; padding:20px; font-size:11px; }
.pagination [aria-disabled] { opacity:.45; }
.admin-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:17px; margin-bottom:25px; }
.admin-stat { padding:22px; }
.admin-stat span { font-size:12px; color:var(--muted); }
.admin-stat strong { display:block; font-size:30px; font-weight:600; letter-spacing:-1px; margin-top:7px; }
.admin-stat svg { color:#648d42; }
.admin-form { max-width:1050px; }
.fieldset { border:1px solid var(--line); border-radius:5px; padding:20px; margin:0 0 22px; min-width:0; }
.fieldset legend { font-weight:600; font-size:14px; padding:0 8px; }
.checkbox-group { display:flex; flex-wrap:wrap; gap:12px 22px; margin-top:9px; }
.checkbox-group label,.check-label { display:flex; align-items:center; gap:9px; min-height:44px; font-size:12px; }
.checkbox-group input,.check-label input { width:17px; height:17px; }
textarea { font:inherit; min-height:110px; resize:vertical; width:100%; padding:12px; border:1px solid #d9e3d4; border-radius:5px; color:var(--ink); background:white; }
.form-grid .span-2,.form-grid .full-width { grid-column:1/-1; }
.repeat-item,.requirement-row,.requirement-card { border:1px solid #dfe7d5; background:#f9fbf5; border-radius:5px; padding:18px; margin:15px 0; }
.repeat-head { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:15px; }
.repeat-head h3 { font-size:13px; }
.subject-row { display:grid; grid-template-columns:1fr 130px auto; gap:12px; margin-top:12px; align-items:end; }
.subject-row .btn { min-height:44px; }
.form-section { padding:24px; border-bottom:1px solid var(--line); }
.form-section h2 { margin-bottom:7px; }
.form-section>p { font-size:12px; color:var(--muted); margin-bottom:18px; }
.details-grid { display:grid; grid-template-columns:1.6fr 1fr; gap:23px; align-items:start; }
.detail-list { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.detail-list dt { font-size:11px; color:var(--muted); margin-bottom:5px; }
.detail-list dd { margin:0; font-size:13px; overflow-wrap:anywhere; }
.status-pill.accepted,.status-pill.published,.status-pill.open { color:#315b26; background:#eef7e2; border-color:#d6e7bd; }
.status-pill.rejected,.status-pill.closed { color:#953f2c; background:#fff0e8; border-color:#ecd1c4; }
.status-pill.under_review,.status-pill.submitted { background:#edf4f8; color:#3b6379; border-color:#d6e3ed; }
.status-pill.changes_requested,.status-pill.draft { background:#fff7e8; color:#7f591c; border-color:#ebddbf; }
.action-row { display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.help-body h3 { margin:18px 0 8px; }
.mini-list { display:flex; flex-direction:column; gap:10px; margin:16px 0; padding:0; list-style:none; font-size:12px; }
.mini-list li { display:flex; gap:10px; }
.course-requirements { padding:14px 0; border-top:1px solid var(--line); font-size:11px; color:var(--muted); }
.course-requirements ul { margin:7px 0; padding-left:17px; }
.course-actions { display:flex; gap:10px; margin-top:14px; }
.course-actions .btn { flex:1; }
.course-card .course-meta { flex-wrap:wrap; }
.course-card .course-requirements+.course-meta { margin-top:0; }
.auth-shell { display:grid; grid-template-columns:minmax(390px,.9fr) minmax(480px,1.1fr); min-height:100dvh; }
.auth-story { display:flex; flex-direction:column; background:radial-gradient(ellipse at 0 0,#3c622c66,transparent 60%),#153f2f; padding:38px 48px 25px; color:white; }
.auth-brand { width:285px; max-width:100%; background:white; border-radius:5px; padding:9px 14px; }
.auth-brand img { width:100%; height:auto; display:block; }
.auth-story-copy { margin:auto 0; padding:50px 0; }
.auth-story h1 { font-size:51px; font-weight:550; letter-spacing:-2px; line-height:1.1; margin:22px 0; }
.auth-story h1 span { color:var(--lime); }
.auth-story-copy>p { color:#dce8d5; font-size:14px; line-height:1.9; }
.auth-photo { position:relative; height:190px; margin-top:36px; border-radius:5px; overflow:hidden; border:1px solid #527351; }
.auth-photo img { width:100%; height:100%; object-fit:cover; }
.auth-photo:after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,#143e2edc,transparent 80%); }
.auth-photo div { position:absolute; bottom:17px; left:20px; z-index:1; font-size:11px; color:#e2eddb; }
.auth-story-foot { font-size:11px; letter-spacing:.6px; color:#b8d0a8; }
.auth-main { max-width:none; padding:0 48px; margin:0; display:flex; flex-direction:column; min-height:100dvh; background:radial-gradient(ellipse at 100% 20%,#e4edd54d,transparent 60%),#f9fbf7; }
.auth-topline { display:flex; justify-content:space-between; gap:15px; font-size:11px; color:#5c7552; padding:30px 0; }
.auth-form { width:100%; max-width:410px; margin:auto; padding:30px 0; }
.auth-form h1,.auth-form h2 { font-size:29px; font-weight:600; letter-spacing:-.8px; line-height:1.2; margin-bottom:12px; }
.auth-form p { color:var(--muted); font-size:12px; margin:12px 0 24px; line-height:1.8; }
.auth-form .field { margin-bottom:18px; }
.auth-form .btn { width:100%; min-height:46px; }
.auth-form .btn.text { width:auto; }
.auth-form a:not(.btn) { color:var(--green); text-decoration:underline; text-underline-offset:3px; }
.auth-form .checkbox-label { margin:0 0 20px; }
.auth-footer { color:#7e8a77; font-size:10px; text-align:center; padding:24px 0; line-height:1.8; }
.visually-hidden { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.review-section { padding:20px 0; border-bottom:1px solid var(--line); }
.review-section h3 { margin-bottom:12px; }
.form-help { font-size:11px; color:var(--muted); margin:6px 0; }
.progress-caption { display:flex; justify-content:space-between; font-size:11px; margin:15px 0 8px; }
.danger { color:#9c3c2c!important; }
.empty-state { text-align:center; padding:40px 22px; }
.empty-state p { color:var(--muted); font-size:12px; margin:12px 0 20px; }
@media(max-width:1100px) {
 .auth-shell { grid-template-columns:minmax(320px,.8fr) minmax(420px,1.2fr); }
 .auth-story { padding:30px; }
 .auth-story h1 { font-size:44px; }
 .details-grid { grid-template-columns:1fr; }
 .admin-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(max-width:720px) {
 .topbar { padding:0 13px; gap:9px; }
 .top-actions { gap:8px; }
 .breadcrumb { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
 .signout { font-size:10px; padding:6px 8px; }
 .top-actions .btn { font-size:10px; padding:8px 10px; min-height:40px; }
 .auth-shell { display:block; }
 .auth-story { min-height:0; padding:22px; }
 .auth-brand { width:230px; margin:0 auto; }
 .auth-story-copy,.auth-story-foot { display:none; }
 .auth-main { min-height:calc(100dvh - 115px); padding:0 22px; }
 .auth-topline { padding:22px 0 5px; font-size:10px; }
 .auth-form { padding:35px 0; }
 .auth-form h1,.auth-form h2 { font-size:27px; }
 .admin-grid { gap:12px; }
 .admin-stat { padding:17px; }
 .subject-row { grid-template-columns:minmax(0,1fr) 90px; }
 .subject-row .btn { grid-column:1/-1; justify-self:start; }
 .detail-list { grid-template-columns:1fr; }
 .form-section { padding:20px 17px; }
 .checkbox-group { flex-direction:column; gap:5px; }
 .repeat-item,.requirement-row,.requirement-card { padding:15px; }
 .form-grid .span-2,.form-grid .full-width { grid-column:auto; }
 .field textarea { font-size:16px; }
}

/* Sign-in / registration modal (shared look with the approved mockup dialog) */
.auth-dialog { padding:0; max-width:470px; width:calc(100% - 32px); max-height:calc(100dvh - 24px); overflow:auto; border:1px solid var(--line); border-radius:5px; color:var(--ink); background:#fff; box-shadow:0 30px 80px #0e2a2938; }
.auth-dialog::backdrop { background:#102b235c; backdrop-filter:blur(3px); }
.auth-dialog .modal-body .field label { display:block; font-size:12px; font-weight:600; margin-bottom:7px; }
.auth-dialog .modal-body .field label span { font-weight:400; color:var(--muted); }
.auth-dialog .modal-body .field small { display:block; margin-top:6px; font-size:11px; color:var(--muted); }
.auth-dialog .modal-body .flash { margin-bottom:16px; }
.auth-dialog .modal-body .inline-note { display:flex; align-items:center; gap:8px; margin-bottom:8px; background:none; border:0; padding:0; }
.auth-dialog .modal-body .btn { min-height:46px; }
.auth-dialog .note { margin-top:16px; font-size:11px; padding:12px 14px; background:#f6f9f1; border:1px solid var(--line); border-radius:5px; color:var(--muted); line-height:1.7; }
.auth-dialog .note a { color:var(--green); text-decoration:underline; text-underline-offset:3px; }
.auth-dialog .modal-tabs [role=tab] { cursor:pointer; }
@media (prefers-reduced-motion:no-preference) { .auth-dialog[open] { animation:auth-pop .18s ease-out; } @keyframes auth-pop { from { opacity:0; transform:translateY(8px); } } }
@media (max-width:640px) { .auth-dialog .modal-body input { font-size:16px; } }
.auth-dialog [role=tabpanel]>p { font-size:12px; color:var(--muted); margin:0 0 18px; line-height:1.7; }