@charset "utf-8";

:root { --navy: #002147; --paper: #ffffff; --gold: #ffc600; --muted: #52657a; }

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body { margin: 0px; background: var(--paper); color: var(--navy); font: 16px / 1.6 Arial, sans-serif; }

a { color: inherit; text-decoration: none; }

button, input, select, textarea { font: inherit; }

button, a, input, select, textarea { outline-offset: 5px; }

header { border-bottom: 1px solid rgb(213, 228, 239); padding: 20px 6%; display: flex; align-items: center; justify-content: space-between; gap: 25px; }

.brand { display: flex; align-items: center; gap: 13px; font-size: 12px; letter-spacing: 1px; }

.seal { border: 1px solid var(--navy); border-radius: 50%; width: 48px; height: 48px; display: grid; place-items: center; font-family: Georgia; font-size: 17px; }

.brand strong { display: block; font-size: 14px; }

nav { display: flex; gap: 26px; font-size: 14px; }

.btn { display: inline-block; border: 1px solid var(--navy); padding: 12px 23px; background: var(--navy); color: white; cursor: pointer; border-radius: 3px; }

.light { background: transparent; color: var(--navy); }

main { max-width: 1300px; margin: auto; padding: 0px 6%; }

.hero { padding: 72px 0px 62px; display: grid; grid-template-columns: 1.15fr 1fr; gap: 70px; align-items: center; }

.eyebrow { text-transform: uppercase; font-size: 11px; letter-spacing: 2.2px; font-weight: bold; color: rgb(60, 86, 115); }

h1, h2, h3 { font-family: Georgia, serif; font-weight: normal; line-height: 1.13; }

h1 { font-size: clamp(45px, 5.4vw, 76px); margin: 20px 0px; }

h1 em { color: rgb(1, 116, 186); }

p { color: var(--muted); }

.hero p { max-width: 480px; }

.actions { display: flex; gap: 12px; margin-top: 29px; }

.art { position: relative; min-height: 390px; background: rgb(233, 245, 252); border-radius: 180px 180px 8px 8px; display: grid; place-items: center; overflow: hidden; }

.rings { position: absolute; width: 280px; height: 280px; border: 1px solid rgb(131, 187, 223); border-radius: 50%; box-shadow: rgb(233, 245, 252) 0px 0px 0px 35px, rgb(162, 213, 244) 0px 0px 0px 36px, rgb(233, 245, 252) 0px 0px 0px 70px, rgb(201, 231, 249) 0px 0px 0px 71px; }

.art .quote { z-index: 1; background: var(--navy); color: rgb(255, 255, 255); width: 78%; padding: 29px; transform: rotate(-4deg); box-shadow: rgb(162, 213, 244) 12px 15px 0px; }

.quote small { color: rgb(255, 198, 0); letter-spacing: 2px; }

.quote blockquote { font: 30px / 1.3 Georgia; margin: 18px 0px; }

.quote span { font-size: 12px; color: rgb(219, 238, 250); }

.star { position: absolute; right: 20px; top: 25px; font-size: 65px; color: rgb(1, 116, 186); }

.introline { border-top: 1px solid rgb(213, 228, 239); border-bottom: 1px solid rgb(213, 228, 239); display: flex; justify-content: space-between; padding: 18px 0px; font-size: 13px; gap: 15px; }

.introline span:last-child { color: rgb(122, 137, 129); }

section { padding: 65px 0px; }

.sectionhead { display: flex; justify-content: space-between; align-items: end; gap: 20px; }

h2 { font-size: 42px; margin: 10px 0px 15px; }

.sectionhead p { margin: 0px 0px 16px; }

.filters { display: flex; gap: 12px; margin: 25px 0px; flex-wrap: wrap; }

input, select, textarea { border: 1px solid rgb(196, 215, 231); background: white; padding: 12px; border-radius: 3px; color: var(--navy); }

.filters input { flex: 1 1 0%; min-width: 200px; }

.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; }

.card { border: 1px solid rgb(213, 228, 239); background: rgb(255, 255, 255); padding: 26px; border-radius: 4px; transition: transform 0.2s; }

.card:hover { transform: translateY(-4px); }

.avatar { width: 64px; height: 64px; border-radius: 50%; display: grid; place-items: center; background: rgb(231, 237, 227); color: rgb(70, 103, 83); font: 24px Georgia; }

.card:nth-child(2n) .avatar { background: rgb(240, 230, 212); color: rgb(153, 117, 59); }

.tag { font-size: 11px; letter-spacing: 1px; color: rgb(124, 134, 122); text-transform: uppercase; }

.card h3 { font-size: 25px; margin: 18px 0px 4px; }

.card .role { font-size: 13px; min-height: 42px; }

.card blockquote { margin: 20px 0px; font: 18px / 1.5 Georgia; border-top: 1px solid rgb(228, 231, 223); padding-top: 18px; }

.textbtn { border: 0px; background: none; padding: 0px; color: var(--navy); cursor: pointer; font-size: 13px; font-weight: bold; }

.demo { font-size: 12px; color: rgb(125, 106, 73); border-left: 3px solid rgb(255, 198, 0); padding-left: 12px; }

.news { display: grid; grid-template-columns: repeat(3, 1fr); gap: 25px; margin-top: 28px; }

.news article { border-top: 2px solid var(--navy); padding: 22px 0px; }

.news h3 { font-size: 25px; }

.news p { font-size: 14px; }

.join { background: var(--navy); color: white; padding: 45px; border-radius: 5px; display: grid; grid-template-columns: 1fr 1.15fr; gap: 45px; }

.join p { color: rgb(219, 238, 250); }

.join h2 { font-size: 43px; }

.join .eyebrow { color: rgb(255, 198, 0); }

form { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; }

label { font-size: 12px; display: block; }

label input, label select, label textarea { display: block; width: 100%; margin-top: 5px; }

.full { grid-column: 1 / -1; }

.check { display: flex; gap: 10px; align-items: start; }

.check input { width: auto; margin-top: 4px; }

.join .btn { background: rgb(255, 198, 0); color: rgb(0, 33, 71); border: 0px; }

.notice { font-size: 12px !important; }

footer { padding: 32px 6%; border-top: 1px solid rgb(213, 228, 239); display: flex; justify-content: space-between; font-size: 12px; color: rgb(108, 124, 116); }

dialog { max-width: 540px; width: 90%; padding: 35px; border: 0px; border-radius: 5px; background: var(--paper); color: var(--navy); }

dialog::backdrop { background: rgba(0, 33, 71, 0.79); }

.close { float: right; background: none; border: 0px; font-size: 28px; cursor: pointer; color: var(--navy); }

#empty { display: none; padding: 25px; text-align: center; }

#status { margin: 0px; color: rgb(255, 223, 112); }

@media (max-width: 800px) {
  header { flex-wrap: wrap; }
  nav { gap: 17px; font-size: 12px; }
  .hero { grid-template-columns: 1fr; gap: 35px; padding-top: 40px; }
  .art { min-height: 300px; }
  .grid, .news { grid-template-columns: 1fr 1fr; }
  .join { grid-template-columns: 1fr; padding: 27px; }
  .sectionhead { display: block; }
  .introline { flex-direction: column; gap: 4px; }
}

@media (max-width: 520px) {
  .grid, .news { grid-template-columns: 1fr; }
  h2 { font-size: 34px; }
  form { grid-template-columns: 1fr; }
  form > * { grid-column: 1; }
  .actions { flex-wrap: wrap; }
  .introline { font-size: 12px; }
  footer { display: block; }
}

header { background: rgb(255, 255, 255); border-top: 5px solid rgb(0, 33, 71); border-bottom: 3px solid rgb(162, 213, 244); }

.faculty-logo { display: block; width: 82px; height: 82px; object-fit: contain; flex-shrink: 0; }

.brand { letter-spacing: 0.4px; font-size: 12px; }

.brand strong { font-size: 14px; }

nav { align-items: center; }

.btn:hover { background: rgb(1, 116, 186); border-color: rgb(1, 116, 186); color: white; }

.btn.light:hover { background: rgb(233, 245, 252); color: rgb(0, 33, 71); }

.join { border-top: 5px solid rgb(255, 198, 0); }

.join .btn { background: rgb(255, 198, 0); color: rgb(0, 33, 71); }

.introline { background: rgb(233, 245, 252); padding: 18px 16px; }

footer { background: rgb(0, 33, 71); color: rgb(228, 241, 251); }

.quote small { color: rgb(255, 198, 0); }

.hero h1 em { color: rgb(1, 116, 186); }

@media (max-width: 600px) {
  .faculty-logo { width: 64px; height: 64px; }
  .brand { font-size: 10px; }
  .brand strong { font-size: 12px; }
  header nav { flex-wrap: wrap; width: 100%; justify-content: space-between; gap: 12px; }
  header nav .btn { padding: 9px 12px; }
}

/* Uygulama bütünleştirmesi: orijinal görünüm üstüne erişilebilirlik ve dinamik durumlar. */
[hidden] { display: none !important; }
.skip { position:absolute; left:12px; top:-100px; background:white; padding:10px; z-index:100; }
.skip:focus { top:12px; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
:focus-visible { outline:3px solid #0174ba; outline-offset:4px; }
img { max-width:100%; }
body { overflow-wrap:break-word; }
h1, h2, h3 { color: var(--navy); }
.join h2 { color:white; }
.hero h1 { letter-spacing:-1.2px; }
.hero .actions .btn { white-space:normal; }
.art .quote { position:relative; }
.art .quote blockquote { color:white; }
#duvar, #katil, #haberler, #haber-gonder { scroll-margin-top:16px; }
#haber-gonder { margin-top:40px; }
#news-list .empty, #cards .empty { grid-column:1 / -1; }
.empty { border:1px dashed #c4d7e7; background:#f4fafd; padding:28px; text-align:center; color:#52657a; margin:0; }
.grid .card { display:flex; flex-direction:column; }
.grid .card .avatar { font-size:22px; flex:0 0 auto; }
.grid .card .role { min-height:0; }
.grid .card blockquote { white-space:pre-wrap; overflow-wrap:anywhere; }
.grid .card .textbtn { margin-top:auto; text-align:left; padding-top:8px; }
.load-actions { text-align:center; margin-top:24px; }
.load-actions p { font-size:13px; }
.load-actions .btn { display:inline-block; }
.news article p { white-space:pre-wrap; overflow-wrap:anywhere; }
.news article small { color:#71808c; }
.join label { color:white; }
.join label small { color:#d9eefa; font-size:11px; }
.join .check input { width:auto; height:auto; flex:0 0 auto; accent-color:#ffc600; }
.join .btn { font-weight:700; text-align:center; }
.join .btn:hover:not(:disabled) { background:#ffda55; color:#002147; border-color:#ffda55; }
.join .btn.light { background:transparent; color:white; border:1px solid #93bedc; }
.join .btn.light:hover { background:#194a77; color:white; }
.join form label, #login-form label { font-size:12px; font-weight:400; }
.join form label input, .join form label select, .join form label textarea { border:1px solid #c4d7e7; background:white; color:#002147; }
.join form textarea { min-height:130px; resize:vertical; }
.join form label input:disabled, .join form label textarea:disabled { opacity:.7; }
.join form .form-status { margin:0; color:#ffdf70; min-height:1px; line-height:1.5; font-size:13px; }
.join form .form-status.success { color:#c2f3cf; }
button:disabled { opacity:.58; cursor:not-allowed; }
.honeypot { position:absolute; width:1px; height:1px; left:-9999px; overflow:hidden; }
.privacy-contact { font-size:12px!important; color:#d9eefa!important; }
.contact { opacity:.97; }
footer { gap:24px; align-items:center; }
footer a { color:#fff; text-decoration:underline; }
.footer-notice { max-width:400px; }
.admin-overlay { position:fixed; z-index:100; inset:0; overflow:auto; background:rgba(0,33,71,.82); padding:32px; }
.admin-shell { max-width:920px; min-height:280px; margin:0 auto; padding:38px; border-radius:5px; background:#fff; color:#002147; box-shadow:0 20px 80px rgba(0,0,0,.2); }
.admin-header, .admin-toolbar { display:flex; justify-content:space-between; align-items:center; gap:20px; }
.admin-header { border-bottom:1px solid #d5e4ef; margin-bottom:28px; }
.admin-header h2 { font-size:36px; }
.admin-header a { font-size:14px; text-decoration:underline; }
#admin-login { max-width:480px; margin:30px auto; }
#admin-login form { display:grid; grid-template-columns:1fr; gap:16px; }
#admin-login form>* { grid-column:1; }
#admin-login form label { color:#002147; }
#admin-login form input { width:100%; }
#login-message { color:#a43c33; }
.admin-toolbar { margin-bottom:24px; }
.admin-toolbar label select { margin-left:10px; }
.admin-entry { border:1px solid #d5e4ef; border-radius:4px; padding:24px; margin:12px 0; background:#f9fcff; }
.admin-entry h3 { font-size:24px; margin:0 0 10px; }
.admin-entry .item-meta { font-size:12px; color:#52657a; margin:5px 0; }
.admin-entry p { white-space:pre-wrap; overflow-wrap:anywhere; }
.admin-actions { display:flex; flex-wrap:wrap; gap:10px; }
.admin-actions button { border:1px solid #c4d7e7; padding:9px 12px; color:#002147; background:#fff; font-size:12px; border-radius:3px; }
.admin-actions .approve { background:#e3f6e8; border-color:#89cca2; color:#155e32; }
.admin-actions .reject, .admin-actions .delete { background:#fff1f0; border-color:#eeada8; color:#8c2626; }
body.admin-open { overflow:hidden; }
@media (max-width:800px) {
 .admin-toolbar { flex-wrap:wrap; }
 .admin-shell { padding:24px; }
 .faculty-logo { width:70px; height:70px; }
 .join form { gap:12px; }
}
@media (max-width:520px) {
 header { padding:16px 5%; }
 .brand { font-size:10px; line-height:1.4; gap:9px; }
 .brand strong { font-size:12px; }
 .faculty-logo { width:58px; height:58px; }
 header nav { width:100%; justify-content:space-between; gap:10px; flex-wrap:wrap; }
 header nav a { font-size:12px; }
 header nav .btn { padding:8px 10px; font-size:11px; }
 .hero { gap:30px; }
 .hero h1 { font-size:clamp(45px,10vw,68px); }
 .art { min-height:290px; }
 .art .quote { width:82%; padding:24px; }
 .art .quote blockquote { font-size:26px; }
 .join { gap:25px; padding:25px 20px; }
 .join h2 { font-size:34px; }
 .join form { grid-template-columns:1fr; }
 .join form>* { grid-column:1; }
 .admin-overlay { padding:8px; }
 .admin-shell { padding:18px; }
 .admin-header h2 { font-size:28px; }
 footer { display:flex; flex-direction:column; align-items:flex-start; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } .card { transition:none; } }

#detail-dialog { max-width:640px; width:calc(100% - 36px); border:0; padding:36px; color:#002147; background:#fff; box-shadow:0 18px 70px rgba(0,33,71,.22); }
#detail-dialog::backdrop { background:rgba(0,33,71,.8); }
#detail-dialog h2 { padding-top:22px; }
#detail-dialog #detail-body { white-space:pre-wrap; line-height:1.85; color:#30465c; font-size:16px; }
#detail-dialog .close { float:right; font-size:28px; border:0; background:none; cursor:pointer; }

/* Açıkça ayrılmış, yetkisiz demo yönetim arayüzü */
.demo-notice { background:#fff7d7; border-left:4px solid #d5a000; padding:13px 18px; margin:0 0 24px; color:#453514; font-size:13px; }
.demo-notice strong { font-weight:700; }
.demo-notice p { color:#655429; margin:6px 0 0; line-height:1.6; }
.demo-link { border:1px solid #d5e4ef; background:#f4f9fc; padding:14px; color:#52657a; font-size:13px; }
.demo-link a { font-weight:700; color:#005d96; text-decoration:underline; }

/* Gerçek yönetici parola değiştirme görünümü */
#password-change { max-width:660px; margin:22px auto; padding:24px; background:#f4f9fc; border:1px solid #c4d7e7; border-radius:5px; }
#password-change h3 { font-size:27px; margin:4px 0 12px; }
#password-change p { color:#52657a; font-size:14px; }
#password-change-form { display:grid; grid-template-columns:1fr; gap:14px; margin-top:20px; }
#password-change-form>* { grid-column:1; }
#password-change-form label { font-size:13px; font-weight:600; color:#002147; }
#password-change-form label input { display:block; margin-top:6px; width:100%; }
#password-change-form label small { font-size:12px; font-weight:400; color:#52657a; }
#password-change-message { min-height:1.4em; color:#ae3131 !important; }
#password-change-message.success { color:#1b753a !important; }
#password-change .admin-actions { display:flex; gap:10px; flex-wrap:wrap; }
#password-change .admin-actions button { font-size:13px; padding:10px 14px; }
#password-change .admin-actions .btn { background:#002147; border-color:#002147; color:#fff; }
#password-change .admin-actions .btn.light { background:#fff; border-color:#c4d7e7; color:#002147; }


/* Theme switcher: no external CSS or tracking. */
.theme-toggle { background:transparent; color:#002147; border:1px solid #c4d7e7; border-radius:3px; padding:9px 12px; cursor:pointer; font-size:12px; white-space:nowrap; }
.theme-toggle:hover { border-color:#0174ba; }
.staff-section { padding:28px 0 0; margin-top:32px; border-top:1px solid #d5e4ef; }
.staff-section h3 { font-size:28px; margin:5px 0 10px; }
.staff-section>p { max-width:660px; font-size:14px; }
#staff-create-form { display:grid; grid-template-columns:1fr 1fr; gap:14px; border:1px solid #d5e4ef; padding:20px; border-radius:4px; background:#f4f9fc; }
#staff-create-form label { font-size:13px; }
#staff-create-form label input, #staff-create-form label select { width:100%; margin-top:6px; }
#staff-create-form label small { display:block; color:#52657a; font-size:11px; }
#staff-create-form .btn { width:max-content; }
.staff-credential { border:2px solid #d6b146; background:#fff8e1; padding:20px; margin:20px 0; border-radius:4px; overflow-wrap:anywhere; }
.staff-credential p { font-size:13px; }
.staff-credential code { font-size:13px; overflow-wrap:anywhere; }
.staff-credential .btn { margin-right:8px; margin-top:8px; }
.staff-list { margin-top:16px; }
.staff-entry { display:flex; gap:20px; align-items:center; justify-content:space-between; border:1px solid #d5e4ef; padding:14px 18px; margin-bottom:8px; border-radius:4px; }
.staff-entry p { margin:4px 0 0; }
.staff-protected { font-size:12px; color:#647b91; }
.staff-remove { background:#fff0ed; color:#9d2931; border:1px solid #e5b4b4; padding:9px 14px; cursor:pointer; border-radius:3px; }
.admin-userline { font-size:12px; color:#52657a; margin:0 0 14px; }
@media (max-width:720px){ #staff-create-form { grid-template-columns:1fr; } #staff-create-form>* { grid-column:1; } .staff-entry { flex-wrap:wrap; } }
html[data-theme="dark"] { color-scheme:dark; --navy:#e7f0ff; --paper:#0f1727; --gold:#ffd04c; --muted:#a7b8cf; }
html[data-theme="dark"] body { background:#0f1727; color:#e7f0ff; }
html[data-theme="dark"] header { background:#151f33; border-top-color:#456a9c; border-bottom-color:#345b8b; }
html[data-theme="dark"] .brand, html[data-theme="dark"] nav a { color:#eef5ff; }
html[data-theme="dark"] .theme-toggle { background:#1f2e45; color:#f8d37c; border-color:#4b668a; }
html[data-theme="dark"] .btn:not(.join .btn) { background:#28629c; color:#f3f8ff; border-color:#5689b9; }
html[data-theme="dark"] .btn.light:not(.join .btn) { background:transparent; color:#d6eaff; border-color:#617b9b; }
html[data-theme="dark"] .eyebrow { color:#98bedf; }
html[data-theme="dark"] h1, html[data-theme="dark"] h2, html[data-theme="dark"] h3 { color:#f0f5ff; }
html[data-theme="dark"] h1 em { color:#8dc9ff; }
html[data-theme="dark"] p, html[data-theme="dark"] .sectionhead p { color:#afc1d8; }
html[data-theme="dark"] .art { background:#1b3651; }
html[data-theme="dark"] .art .rings { border-color:#507a9e; box-shadow:#1b3651 0 0 0 35px,#335c7b 0 0 0 36px,#1b3651 0 0 0 70px,#547c97 0 0 0 71px; }
html[data-theme="dark"] .art .quote { background:#152640; box-shadow:#355979 12px 15px 0; }
html[data-theme="dark"] .art .quote small, html[data-theme="dark"] .join .eyebrow { color:#ffd04c; }
html[data-theme="dark"] .art .quote blockquote { color:#fff; }
html[data-theme="dark"] .art .quote span { color:#cfe5fb; }
html[data-theme="dark"] .introline { background:#1b2a42; border-color:#3e5770; }
html[data-theme="dark"] .introline span:last-child { color:#b7c7da; }
html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea { background:#1b2940; border-color:#52677f; color:#eaf3ff; }
html[data-theme="dark"] input::placeholder, html[data-theme="dark"] textarea::placeholder { color:#94a8c1; }
html[data-theme="dark"] .card { background:#182337; border-color:#354962; }
html[data-theme="dark"] .card .avatar { background:#2a4664; color:#d1e9ff; }
html[data-theme="dark"] .card blockquote { border-color:#41536a; color:#f1f6ff; }
html[data-theme="dark"] .tag, html[data-theme="dark"] .item-meta { color:#adc1d5; }
html[data-theme="dark"] .textbtn { color:#9fd0ff; }
html[data-theme="dark"] .empty { background:#192940; border-color:#536e8f; color:#b9cbe0; }
html[data-theme="dark"] .news article { border-color:#6397cb; }
html[data-theme="dark"] .join { background:#182c46; border-top-color:#ffd04c; }
html[data-theme="dark"] .join h2, html[data-theme="dark"] .join label { color:#f4f8ff; }
html[data-theme="dark"] .join p, html[data-theme="dark"] .join label small { color:#c1d5ec; }
html[data-theme="dark"] .join form label input, html[data-theme="dark"] .join form label select, html[data-theme="dark"] .join form label textarea { background:#f9fbff; color:#102640; border-color:#8ca9c9; }
html[data-theme="dark"] .join form .btn { background:#ffd04c; color:#102640; }
html[data-theme="dark"] .join form .btn.light { background:transparent; color:#eff7ff; border-color:#9cb7d6; }
html[data-theme="dark"] footer { background:#121d30; border-color:#37516a; }
html[data-theme="dark"] footer, html[data-theme="dark"] footer a { color:#e3eeff; }
html[data-theme="dark"] #detail-dialog, html[data-theme="dark"] .admin-shell { background:#18263c; color:#edf5ff; }
html[data-theme="dark"] #detail-dialog #detail-body { color:#c8d8ec; }
html[data-theme="dark"] .admin-header { border-color:#3c526d; }
html[data-theme="dark"] #admin-login form label, html[data-theme="dark"] #password-change-form label { color:#e9f1ff; }
html[data-theme="dark"] #admin-login input { background:#1c3049; color:#fff; }
html[data-theme="dark"] #password-change, html[data-theme="dark"] #staff-create-form { background:#1d304a; border-color:#405c7e; }
html[data-theme="dark"] #password-change p, html[data-theme="dark"] .staff-section>p, html[data-theme="dark"] .admin-userline { color:#c4d4e8; }
html[data-theme="dark"] #password-change input, html[data-theme="dark"] #staff-create-form input, html[data-theme="dark"] #staff-create-form select { background:#142439; color:#f1f7ff; }
html[data-theme="dark"] #password-change .admin-actions .btn, html[data-theme="dark"] #staff-create-form .btn { background:#29649f; color:#fff; }
html[data-theme="dark"] #password-change .admin-actions .btn.light { background:transparent; color:#cfe5ff; }
html[data-theme="dark"] .admin-entry, html[data-theme="dark"] .staff-entry { background:#1b2d44; border-color:#3e5b77; }
html[data-theme="dark"] .admin-actions button { background:#243a54; color:#e1eeff; border-color:#526d88; }
html[data-theme="dark"] .admin-actions .approve { background:#174937; color:#d1ffdf; }
html[data-theme="dark"] .admin-actions .reject, html[data-theme="dark"] .admin-actions .delete, html[data-theme="dark"] .staff-remove { background:#503038; color:#ffc7d0; border-color:#a25a68; }
html[data-theme="dark"] .staff-section { border-color:#3e5b77; }
html[data-theme="dark"] .staff-protected { color:#b1c1d7; }
html[data-theme="dark"] .staff-credential { background:#352c18; border-color:#a88a38; color:#ffecb9; }
html[data-theme="dark"] .staff-credential p { color:#efdfb3; }
html[data-theme="dark"] .demo-link { background:#192c42; border-color:#375c81; }
html[data-theme="dark"] .demo-link a { color:#a3d0ff; }
html[data-theme="dark"] .demo-notice { background:#342c18; color:#ffe4aa; }
html[data-theme="dark"] .demo-notice p { color:#efdbb6; }
html[data-theme="dark"] dialog::backdrop { background:rgba(0,0,0,.8); }