.real-login { max-width: 36rem; margin: 2rem auto; }
.real-login h1 { font-size: clamp(2rem, 4vw, 3rem); }
.bank-layout { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; align-items: start; }
.bank-form { display: grid; gap: .9rem; }
.bank-form input:not([type="radio"]), .bank-form textarea, .bank-form select {
  display: block; width: 100%; min-width: 0; margin: .35rem 0 0; padding: .7rem;
  border: 1px solid #54596b; border-radius: .4rem; background: var(--bg); color: var(--text); font: inherit;
}
.bank-form textarea { resize: vertical; }
.bank-form select { white-space: normal; }
.bank-option { display: grid; grid-template-columns: 3.5rem minmax(0, 1fr); align-items: center; gap: .5rem; margin-bottom: .5rem; }
.bank-option input:not([type="radio"]) { margin: 0; }
.question-row { padding-block: 1rem; border-top: 1px solid var(--line); overflow-wrap: anywhere; }
.question-row h3 { font-family: inherit; line-height: 1.5; white-space: pre-wrap; }
#question-list, #account-list { margin-block: 1rem; }
#editor-message, #account-message, #login-message { margin-top: 1rem; color: var(--gold-soft); }
button:disabled { cursor: wait; opacity: .6; }
@media (max-width: 850px) { .bank-layout { grid-template-columns: minmax(0, 1fr); } }
.student-welcome { width: min(90vw, 30rem); box-sizing: border-box; padding: 2rem; border: 1px solid #555a70; border-radius: 1rem; background: #171c2e; color: #fcebd0; text-align: center; }
.student-welcome::backdrop { background: rgb(3 7 20 / 80%); }
.student-welcome h2 { color: #ffedcf; }
.student-welcome button { margin-top: 1rem; }
#account-bar:not([hidden]) { display: flex; align-items: center; flex-wrap: wrap; gap: .85rem; }
#account-name { color: #e9c95a; transition: color .2s ease, text-shadow .2s ease; }
#account-name:hover { color: #ffe995; text-shadow: 0 0 6px #e8be4b, 0 0 16px #d8a92c99; }
@media (prefers-reduced-motion: reduce) { #account-name { transition: none; } }