/* ScholarshipSpace member features - Oct 2026 */
:root { --ss-eng-navy:#1a2e4a; --ss-eng-accent:#3730a3; --ss-eng-line:#d9dee7; --ss-eng-muted:#6b7280; --ss-eng-bad:#b42318; --ss-eng-good:#067647; }
html.ss-eng-lock { overflow: hidden; }
.ss-eng-overlay { position: fixed; inset: 0; background: rgba(15,23,42,.55); display: flex; align-items: center; justify-content: center; z-index: 100000; padding: 16px; }
.ss-eng-modal { position: relative; background: #fff; border-radius: 14px; width: 100%; max-width: 420px; max-height: 92vh; overflow: auto; box-shadow: 0 20px 50px rgba(0,0,0,.25); }
.ss-eng-modal-body { padding: 28px 24px 24px; }
.ss-eng-close { position: absolute; top: 8px; right: 10px; width: 44px; height: 44px; border: 0; background: transparent; font-size: 28px; line-height: 1; cursor: pointer; color: var(--ss-eng-muted); border-radius: 50%; }
.ss-eng-close:hover { background: #f3f4f6; }
.ss-eng-auth h2, .ss-eng-card h2 { margin: 0 0 12px; font-size: 22px; color: var(--ss-eng-navy); }
.ss-eng-auth p { margin: 0 0 12px; }
.ss-eng-reason { color: var(--ss-eng-muted); }
.ss-eng-field { margin-bottom: 14px; }
.ss-eng-field label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 4px; color: #111827; }
.ss-eng-field input { width: 100%; box-sizing: border-box; padding: 11px 12px; border: 1px solid var(--ss-eng-line); border-radius: 8px; font-size: 16px; background: #fff; }
.ss-eng-field input:focus { outline: 2px solid var(--ss-eng-accent); outline-offset: 1px; border-color: var(--ss-eng-accent); }
.ss-eng-field small { display: block; color: var(--ss-eng-muted); margin-top: 4px; font-size: 12.5px; }
.ss-eng-code { letter-spacing: 8px; font-size: 24px !important; text-align: center; }
.ss-eng-check { display: flex; align-items: flex-start; gap: 8px; font-size: 14px; margin: 4px 0 14px; }
.ss-eng-check input { margin-top: 3px; }
.ss-eng-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ss-eng-btn { display: inline-flex; align-items: center; justify-content: center; width: 100%; box-sizing: border-box; min-height: 44px; padding: 10px 16px; border: 0; border-radius: 8px; background: var(--ss-eng-navy); color: #fff; font-size: 16px; font-weight: 600; cursor: pointer; }
.ss-eng-btn:hover { filter: brightness(1.12); }
.ss-eng-btn:disabled { opacity: .55; cursor: not-allowed; }
.ss-eng-btn--ghost { background: #fff; color: var(--ss-eng-navy); border: 1px solid var(--ss-eng-line); }
.ss-eng-btn--danger { background: var(--ss-eng-bad); }
.ss-eng-or { text-align: center; color: var(--ss-eng-muted); font-size: 13px; margin: 12px 0 !important; }
.ss-eng-link { background: none; border: 0; padding: 0; color: var(--ss-eng-accent); font: inherit; cursor: pointer; text-decoration: underline; }
/* The theme paints a square on button hover and focus; link buttons stay plain. */
.ss-eng-link:hover, .ss-eng-link:focus, .ss-eng-link:active { background: none; box-shadow: none; border: 0; color: var(--ss-eng-navy); text-decoration: underline; }
.ss-eng-link:focus-visible { outline: 2px solid var(--ss-eng-accent); outline-offset: 2px; border-radius: 4px; }
.ss-eng-link:disabled { color: var(--ss-eng-muted); cursor: default; }
.ss-eng-alt { text-align: center; margin-top: 14px !important; font-size: 14px; }
.ss-eng-status { min-height: 1.2em; font-size: 14px; margin: 0 0 8px; }
.ss-eng-status.is-error { color: var(--ss-eng-bad); }
.ss-eng-status.is-ok { color: var(--ss-eng-good); }
.ss-eng-turnstile { margin: 0 0 14px; min-height: 65px; }
.ss-eng-page { max-width: 560px; margin: 32px auto; padding: 0 16px; }
.ss-eng-auth-page .ss-eng-auth { background: #fff; border: 1px solid var(--ss-eng-line); border-radius: 14px; padding: 28px 24px; }
.ss-eng-title { font-size: 28px; color: var(--ss-eng-navy); margin: 0 0 16px; }
.ss-eng-card { background: #fff; border: 1px solid var(--ss-eng-line); border-radius: 14px; padding: 20px; margin-bottom: 16px; }
.ss-eng-meta { color: var(--ss-eng-muted); font-size: 14px; }
.ss-eng-danger { margin-top: 8px; }
.ss-eng-nav-link { font-weight: 600; }
.ss-eng-floating { position: fixed; top: 12px; right: 12px; z-index: 9999; background: var(--ss-eng-navy); color: #fff !important; padding: 8px 14px; border-radius: 999px; text-decoration: none; }
@media (prefers-reduced-motion: no-preference) { .ss-eng-modal { animation: ss-eng-pop .16s ease-out; } @keyframes ss-eng-pop { from { transform: translateY(8px); opacity: 0; } to { transform: none; opacity: 1; } } }
/* Session watch banner */
.ss-eng-banner { position: fixed; left: 12px; right: 12px; bottom: 12px; z-index: 10000; display: flex; flex-wrap: wrap; align-items: center; gap: 12px; max-width: 560px; margin: 0 auto; padding: 12px 16px; border-radius: 12px; background: var(--ss-eng-navy, #1a2e4a); color: #fff; box-shadow: 0 10px 30px rgba(0,0,0,.25); box-sizing: border-box; }
.ss-eng-banner .ss-eng-btn { width: auto; background: #fff; color: var(--ss-eng-navy, #1a2e4a); }
.ss-eng-banner .ss-eng-link { color: #fff; }
.ss-eng-banner.is-warn { background: #92400e; }
/* The hidden attribute must win over the display set by button styles. */
.ss-eng-btn[hidden], .ss-eng-link[hidden], .ss-qa-more[hidden], .ss-qa-ask[hidden] { display: none !important; }
/* ---------- My space: greeting, clock, announcement, sticky tabs ---------- */
.ss-eng-my-space { max-width: 880px; }
.ss-my-space-page .entry-header, .ss-my-space-page .page-header { display: none; }
.ss-eng-ic { display: inline-flex; flex: none; } .ss-eng-ic svg { width: 20px; height: 20px; }
.ss-eng-hero { display: flex; justify-content: space-between; align-items: center; gap: 14px; flex-wrap: wrap; background: linear-gradient(135deg, #1a2e4a, #24466f); color: #fff; border-radius: 16px; padding: 22px 24px; margin: 0 0 14px; }
.ss-eng-hero .ss-eng-title { color: #fff; margin: 0; }
.ss-eng-sub { margin: 2px 0 0; color: #b9c8dd; font-size: 14px; }
.ss-eng-clock { display: flex; align-items: center; gap: 10px; background: rgba(255,255,255,.1); border-radius: 12px; padding: 10px 14px; }
.ss-eng-clock b { display: block; font-size: 14px; } .ss-eng-clock span span, .ss-eng-clock div span { display: block; font-size: 12.5px; color: #c6d3e6; }
.ss-eng-tabbar { position: sticky; top: calc(var(--ss-nav-h, 0px) + var(--ss-adminbar-h, 0px)); z-index: 50; background: #fff; margin: 0 -16px 14px; padding: 10px 16px; border-bottom: 1px solid var(--ss-eng-line); }
.ss-eng-tabs { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.ss-eng-tabs::-webkit-scrollbar { display: none; }
.ss-eng-tab { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 8px 16px; border-radius: 999px; background: #fff; border: 1px solid var(--ss-eng-line); color: #334155; font: inherit; font-size: 14px; font-weight: 600; white-space: nowrap; cursor: pointer; }
.ss-eng-tab:hover { border-color: #0066cc; color: #0066cc; background: #fff; }
.ss-eng-tab.is-on, .ss-eng-tab.is-on:hover { background: #0066cc; border-color: #0066cc; color: #fff; }
.ss-eng-tab:focus-visible { outline: 2px solid var(--ss-eng-accent); outline-offset: 2px; }
.ss-eng-bd { font-style: normal; display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 9px; background: #0066cc; color: #fff; font-size: 11px; font-weight: 700; }
.ss-eng-tab.is-on .ss-eng-bd { background: #fff; color: #0066cc; }
.ss-eng-bd[hidden] { display: none; }
.ss-eng-ann { display: flex; align-items: flex-start; gap: 12px; background: #eaf3ff; border: 1px solid #bcd6f5; border-left: 4px solid #0066cc; border-radius: 12px; padding: 12px 14px; margin: 0 0 14px; color: #1a2e4a; }
.ss-eng-ann > .ss-eng-ic { color: #0066cc; margin-top: 1px; }
.ss-eng-ann-body { flex: 1; min-width: 0; } .ss-eng-ann-body b { display: block; font-size: 13px; margin-bottom: 2px; }
.ss-eng-ann-body span { display: block; font-size: 14px; line-height: 1.45; color: #2b3f5c; overflow-wrap: anywhere; }
.ss-eng-ann-link { display: inline-block; margin-top: 6px; font-weight: 700; color: #0066cc; }
.ss-eng-ann-x { margin-left: auto; flex: none; width: 36px; height: 36px; display: inline-flex; align-items: center; justify-content: center; background: none; border: 0; border-radius: 50%; color: #5a6f8c; cursor: pointer; }
.ss-eng-ann-x:hover { background: rgba(0,102,204,.12); color: #1a2e4a; }
.ss-eng-pane[hidden] { display: none; }
@media (max-width: 520px) { .ss-eng-hero { padding: 18px; } .ss-eng-tab { padding: 8px 13px; } .ss-eng-tab:not(.is-on) .ss-eng-tab-l { display: none; } }