/* Shared page layout, base typography, links, and highlighted (mark) text. */
.page {
  position: relative;
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .page {
    flex-direction: row;
    min-height: 100vh;
  }
}

html, body {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

a, .btn-link {
  color: var(--omu-link);
}

mark, .mark {
  font-weight: bold;
  background: var(--omu-mark-bg);
  padding: 0;
}

/* Local presentation layer for Clint's private OpenMU installation. */
:root, [data-bs-theme=light] {
  --omu-bg: #f3f6f8; --omu-surface: #ffffff; --omu-surface-2: #ffffff;
  --omu-surface-muted: #edf2f5; --omu-surface-hover: #e7f1f0;
  --omu-text: #182c3c; --omu-text-muted: #536575; --omu-border: #dce5eb;
  --omu-link: #087b73; --omu-link-primary: #087b73; --omu-link-primary-border: #06695f;
  --bs-body-bg: #f3f6f8; --bs-body-color: #182c3c; --bs-border-color: #dce5eb;
  --mu-card-shadow: 0 4px 20px rgba(20, 40, 58, .04);
}
[data-bs-theme=dark] {
  --omu-bg: #101a24; --omu-surface: #192632; --omu-surface-2: #192632;
  --omu-surface-muted: #1e2e3c; --omu-surface-hover: #243b47;
  --omu-text: #e1ebf2; --omu-text-muted: #a4b5c3; --omu-border: #304351;
  --omu-link: #70ddd0; --bs-body-bg: #101a24; --bs-body-color: #e1ebf2;
  --bs-border-color: #304351; --mu-card-shadow: 0 4px 20px rgba(0,0,0,.12);
}
html, body { font-family: 'Segoe UI', system-ui, sans-serif; color: var(--omu-text); }
body { background: var(--omu-bg); line-height: 1.55; }
.page { min-height: 100vh; }
.page > main { flex: 1; min-width: 0; }
.page .sidebar { background: #101f2c; }
.page .sidebar > nav { background: #101f2c; box-shadow: none !important; border-radius: 0 !important; }
.sidebar .top-row { min-height: 86px; background: #101f2c; border-bottom: 1px solid #293b49; }
.sidebar .navbar-brand { font-size: 1.45rem; font-weight: 700; letter-spacing: -.04em; color: #fff; }
.sidebar .navbar-brand::before { content: ''; display: inline-block; width: 13px; height: 19px; margin-right: 12px; background: #61d6bf; transform: skew(-16deg); border-radius: 2px; }
.sidebar .nav { padding: 17px 0; gap: 3px; }
.sidebar .nav-item { padding-left: 14px !important; padding-right: 14px !important; }
.page .sidebar .nav-link { min-height: 43px; height: auto; padding: 9px 13px; line-height: 1.5; color: #bdcdd9; border-radius: 8px; font-size: .9rem; }
.page .sidebar .nav-link:hover { background: #203544; color: white; }
.page .sidebar .nav-link.active { background: #1c4949; color: #b5ffed; box-shadow: inset 3px 0 #62d8bf; font-weight: 600; }
.sidebar > nav .oi { font-size: .95rem; width: 1.85rem; opacity: .85; }
.sidebar .dropdown-menu { border-radius: 8px !important; margin: 5px 0 9px; padding: 6px; }
.sidebar .dropdown-item { white-space: normal; border-radius: 5px; padding: 7px 10px; }
.sidebar .culture-selector { padding-top: 17px; margin-top: 13px; }
.sidebar .culture-selector::before { background: #293b49; }
.main-header { min-height: 76px; position: sticky; top: 0; z-index: 99; background: var(--omu-surface) !important; }
.header-content { gap: 12px; }
.header-search { max-width: 720px; }
.header-actions { flex-shrink: 0; }
.configuration-search .form-control, .configuration-search .input-group-text { background: var(--omu-bg); border-color: var(--omu-border); min-height: 43px; }
.breadcrumb-bar { background: var(--omu-surface); font-size: .85rem; min-height: 56px; }
.breadcrumb-bar .breadcrumb { margin-bottom: 0; }
.page main > article.content { padding: 32px clamp(20px, 3vw, 48px) 48px !important; }
h1 { font-size: clamp(1.65rem, 2.5vw, 2.25rem); font-weight: 700; letter-spacing: -.035em; margin-bottom: 12px; }
h1[tabindex="-1"]:focus { outline: none; }
h2, h3, h4, h5 { font-weight: 650; letter-spacing: -.015em; }
article.content > p { color: var(--omu-text-muted); }
.card, .modal-content { background: var(--omu-surface); border: 1px solid var(--omu-border); border-radius: 12px; box-shadow: var(--mu-card-shadow); }
.card-header, .modal-header { background: transparent; border-bottom: 1px solid var(--omu-border); padding: 18px 22px; }
.card-body { padding: 22px; }
.btn { border-radius: 7px; font-weight: 600; padding: .48rem .85rem; font-size: .88rem; }
.btn-sm { padding: .3rem .65rem; font-size: .8rem; }
.btn-primary { --bs-btn-bg: #087b73; --bs-btn-border-color: #087b73; --bs-btn-hover-bg: #06665f; --bs-btn-hover-border-color: #06665f; --bs-btn-active-bg: #05564f; --bs-btn-active-border-color: #05564f; --bs-btn-disabled-bg: #427b77; --bs-btn-disabled-border-color: #427b77; }
.btn-secondary { --bs-btn-bg: #52677a; --bs-btn-border-color: #52677a; }
.btn-outline-primary { --bs-btn-color: var(--omu-link); --bs-btn-border-color: var(--omu-link); --bs-btn-hover-bg: #087b73; --bs-btn-hover-border-color: #087b73; }
[data-bs-theme=dark] .btn-outline-secondary { --bs-btn-color: #b7c9d5; --bs-btn-border-color: #5e7789; --bs-btn-hover-bg: #365365; --bs-btn-hover-border-color: #829eaf; }
.form-control, .form-select, .input-group-text { border-radius: 7px; border-color: var(--omu-border); }
.form-control, .form-select { padding: .6rem .8rem; color: var(--omu-text); background-color: var(--omu-surface); }
.form-control:focus, .form-select:focus { border-color: #109c8e; box-shadow: 0 0 0 3px rgba(16,156,142,.16); }
label, .form-label { font-weight: 600; font-size: .9rem; }
:is(a, button, input, select, textarea):focus-visible { outline: 3px solid #24aa9a; outline-offset: 3px; }
.table { --bs-table-bg: var(--omu-surface); --bs-table-color: var(--omu-text); --bs-table-border-color: var(--omu-border); --bs-table-striped-bg: var(--omu-bg); --bs-table-hover-bg: var(--omu-surface-hover); border: 1px solid var(--omu-border); box-shadow: var(--mu-card-shadow); font-size: .9rem; }
.table > :not(caption) > * > * { padding: 13px 16px; vertical-align: middle; }
.table > thead { font-size: .8rem; color: var(--omu-text-muted); }
.table > thead > tr > th { background: var(--omu-surface-muted); font-weight: 650; }
.table td .btn { margin-top: 2px; margin-bottom: 2px; }
.table-responsive { border-radius: 10px; }
.badge { font-weight: 600; padding: .4em .65em; }
.login-layout { background: radial-gradient(ellipse at 20% 10%, #204854 0, #112735 40%, #101a24 100%); }
.login-panel { max-width: 440px; }
.login-panel > h1 { color: #e6fff9; font-size: 2rem; letter-spacing: -.05em; }
.login-panel .card { border: 0; box-shadow: 0 24px 65px #0004; }
.login-panel .card-body { padding: 32px; }
.login-panel .btn-primary { min-height: 46px; }
/* Blazor sets an inline display when a real error occurs. Do not use !important. */
#blazor-error-ui { display: none; position: fixed; bottom: 0; left: 0; width: 100%; padding: 16px 24px; z-index: 1000; background: var(--omu-error-bg); }
.mu-home { margin: 0 clamp(20px, 3vw, 48px) 48px; }
.mu-hero { background: linear-gradient(120deg, #173447, #154c4c); border: 1px solid #2b6066; border-radius: 16px; padding: clamp(24px,4vw,44px); color: #fff; position: relative; overflow: hidden; }
.mu-eyebrow { color: #9ee6d5; text-transform: uppercase; letter-spacing: .16em; font-weight: 650; font-size: .72rem; margin: 0 0 14px; }
.mu-hero h2 { max-width: 600px; font-size: clamp(1.6rem,2.8vw,2.35rem); margin: 0 0 12px; line-height: 1.2; }
.mu-hero p:last-child { color: #c0d8df; max-width: 560px; margin: 0; }
.mu-section-title { margin: 32px 0 16px; font-size: 1.05rem; }
.mu-shortcuts { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 16px; }
.mu-shortcut { display: grid; grid-template-columns: 44px 1fr 20px; gap: 16px; align-items: start; padding: 24px; border: 1px solid var(--omu-border); border-radius: 12px; background: var(--omu-surface); color: var(--omu-text); text-decoration: none; box-shadow: var(--mu-card-shadow); transition: border-color .15s, transform .15s; }
.mu-shortcut:hover { border-color: #109c8e; color: var(--omu-text); transform: translateY(-2px); }
.mu-shortcut-icon { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 10px; background: var(--omu-surface-hover); color: var(--omu-link); }
.mu-shortcut strong { display: block; font-size: 1rem; margin-bottom: 5px; }
.mu-shortcut small { display: block; color: var(--omu-text-muted); font-size: .85rem; line-height: 1.55; }
.mu-arrow { color: var(--omu-text-muted); padding-top: 8px; }
.mu-help { margin: 24px 0 0; color: var(--omu-text-muted); font-size: .85rem; }
@media(min-width:768px) { .page .sidebar { width: 238px; flex: 0 0 238px; } .page .sidebar > nav { width: 238px; position: sticky; top: 0; max-height: 100vh; min-height: 100vh; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #3c5362 #101f2c; } }
@media(max-width:1050px) { .mu-shortcuts { grid-template-columns: 1fr; } .table > :not(caption) > * > * { padding: 10px; } }
@media(max-width:767.98px) { .page.page { flex-direction: column; } .page .sidebar { width: 100%; } .sidebar .top-row { min-height: 64px; padding-right: 20px; } .header-content { flex-direction: column; align-items: stretch !important; padding: 8px 0; } .header-actions { margin-left: 0 !important; justify-content: flex-end; } .main-header { position: static; } .page main > article.content { padding: 24px 16px !important; } .mu-shortcut { padding: 20px; gap: 12px; } .table { min-width: 620px; } .content > div:has(> table), .content > div:has(> .table) { overflow-x: auto; } }
@media(prefers-reduced-motion:reduce) { .mu-shortcut { transition: none; } .mu-shortcut:hover { transform: none; } }

/* ===== MU Parekoys theme (22 Oct): dark and gold, matching muparekoys.com. Overrides the layer above. ===== */
:root, [data-bs-theme=light], [data-bs-theme=dark] {
  --mp-gold: #e2b052; --mp-gold-hi: #ffe2a0; --mp-gold-dark: #9c6b1e;
  --omu-bg: #0e0b09; --omu-surface: #18120e; --omu-surface-2: #1e1712;
  --omu-surface-muted: #221a13; --omu-surface-hover: #2a2017;
  --omu-text: #f1e7d6; --omu-text-muted: #b5a389; --omu-border: #3a2d21;
  --omu-link: #e2b052; --omu-link-primary: #e2b052; --omu-link-primary-border: #9c6b1e;
  --omu-mark-bg: rgba(226,176,82,.3); --omu-error-bg: #5a1a16;
  --bs-body-bg: #0e0b09; --bs-body-color: #f1e7d6; --bs-emphasis-color: #fff6e6;
  --bs-secondary-color: #b5a389; --bs-secondary-bg: #1e1712; --bs-tertiary-bg: #18120e;
  --bs-border-color: #3a2d21; --bs-link-color: #e2b052; --bs-link-hover-color: #ffe2a0;
  --bs-link-color-rgb: 226,176,82; --bs-link-hover-color-rgb: 255,226,160;
  --bs-primary: #e2b052; --bs-primary-rgb: 226,176,82;
  --bs-heading-color: #f6ead4;
  --mu-card-shadow: 0 10px 30px rgba(0,0,0,.45);
  color-scheme: dark;
}
html, body { font-family: "Inter", "Segoe UI", system-ui, sans-serif; }
body { background: radial-gradient(ellipse 80% 50% at 50% -10%, #2a1d12, transparent 70%) fixed, var(--omu-bg); }
h1, h2, h3, .card-header h5, .modal-title { font-family: "Cinzel", Georgia, serif; letter-spacing: .03em; color: var(--bs-heading-color); }
h1 { font-weight: 700; letter-spacing: .04em; }

/* sidebar */
.page .sidebar, .page .sidebar > nav, .sidebar .top-row { background: linear-gradient(180deg, #17110c, #0b0806) !important; }
.page .sidebar { border-right: 1px solid #2c2219; }
.sidebar .top-row { border-bottom: 1px solid #2c2219; }
.sidebar .navbar-brand { font: 700 1.05rem "Cinzel", Georgia, serif; letter-spacing: .14em; text-transform: uppercase; color: var(--mp-gold) !important; display: inline-flex; align-items: center; }
.sidebar .navbar-brand::before { width: 34px; height: 34px; margin-right: 10px; transform: none; border-radius: 0;
  background: url("/mu-emblem.svg") center / contain no-repeat; }
.page .sidebar .nav-link { color: #cbbba2; }
.page .sidebar .nav-link:hover { background: #241a12; color: #fff3dc; }
.page .sidebar .nav-link.active { background: linear-gradient(90deg, rgba(226,176,82,.18), rgba(226,176,82,.04)); color: var(--mp-gold-hi); box-shadow: inset 3px 0 var(--mp-gold); }
.sidebar .culture-selector::before { background: #2c2219; }
@media(min-width:768px) { .page .sidebar > nav { scrollbar-color: #4a3826 #0b0806; } }

/* header, cards, forms */
.main-header, .breadcrumb-bar { background: rgba(20,15,11,.92) !important; border-color: var(--omu-border) !important; backdrop-filter: blur(6px); }
.card, .modal-content, .dropdown-menu { background: linear-gradient(180deg, var(--omu-surface-2), var(--omu-surface)); border-color: var(--omu-border); color: var(--omu-text); }
.dropdown-item { color: var(--omu-text); }
.dropdown-item:hover, .dropdown-item:focus { background: var(--omu-surface-hover); color: var(--mp-gold-hi); }
.btn-primary { --bs-btn-color: #1d1206; --bs-btn-bg: #d9a441; --bs-btn-border-color: #ffd98a; --bs-btn-hover-color: #1d1206; --bs-btn-hover-bg: #ecbd62; --bs-btn-hover-border-color: #ffe2a0;
  --bs-btn-active-color: #1d1206; --bs-btn-active-bg: #b8862f; --bs-btn-active-border-color: #b8862f; --bs-btn-disabled-color: #1d1206; --bs-btn-disabled-bg: #8a6a35; --bs-btn-disabled-border-color: #8a6a35;
  background-image: linear-gradient(180deg, rgba(255,255,255,.18), rgba(0,0,0,.12)); }
.btn-secondary { --bs-btn-color: #f1e7d6; --bs-btn-bg: #3a2d21; --bs-btn-border-color: #4c3b2b; --bs-btn-hover-bg: #4c3b2b; --bs-btn-hover-border-color: #5e4935; }
.btn-outline-primary { --bs-btn-color: var(--mp-gold); --bs-btn-border-color: var(--mp-gold-dark); --bs-btn-hover-color: #1d1206; --bs-btn-hover-bg: var(--mp-gold); --bs-btn-hover-border-color: var(--mp-gold); }
.btn-outline-secondary { --bs-btn-color: #cbbba2; --bs-btn-border-color: #5a4633; --bs-btn-hover-color: #fff3dc; --bs-btn-hover-bg: #3a2d21; --bs-btn-hover-border-color: #7a6046; }
.form-control, .form-select, .input-group-text { background-color: #0b0806; color: var(--omu-text); border-color: var(--omu-border); }
.form-control::placeholder { color: #7d6d58; }
.form-control:focus, .form-select:focus { background-color: #0b0806; color: var(--omu-text); border-color: var(--mp-gold); box-shadow: 0 0 0 3px rgba(226,176,82,.18); }
.form-check-input { background-color: #0b0806; border-color: #5a4633; }
.form-check-input:checked { background-color: var(--mp-gold); border-color: var(--mp-gold); }
:is(a, button, input, select, textarea):focus-visible { outline-color: var(--mp-gold); }
.table > thead > tr > th { color: var(--mp-gold); letter-spacing: .06em; text-transform: uppercase; font-size: .74rem; }
.text-muted { color: var(--omu-text-muted) !important; }

/* login */
.login-layout { background: url("/mu-hero.svg") center 75% / cover no-repeat, #0b0907; position: relative; isolation: isolate; }
.login-layout::before { content: ""; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 55% 60% at 50% 50%, rgba(11,9,7,.82), rgba(11,9,7,.35) 75%); }
.login-panel > h1 { display: grid; justify-items: center; gap: 12px; margin-bottom: 26px !important; font: 700 clamp(2rem, 5vw, 2.8rem)/1 "Cinzel Decorative", "Cinzel", Georgia, serif; letter-spacing: .02em;
  color: #e2b052; text-shadow: 0 4px 14px #000; }
@supports (-webkit-background-clip: text) {
  .login-panel > h1 { background: linear-gradient(180deg, #ffe2a0 10%, #e2b052 55%, #9c6b1e) top / 100% 100%; -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; filter: drop-shadow(0 4px 14px #000); }
}
.login-panel > h1::before { content: ""; width: 120px; height: 120px; background: url("/mu-emblem.svg") center / contain no-repeat; filter: drop-shadow(0 0 22px rgba(226,176,82,.45)); }
.login-panel > h1::after { content: "Game master panel"; font: 600 .72rem "Inter", system-ui, sans-serif; letter-spacing: .32em; text-transform: uppercase; color: var(--mp-gold); -webkit-text-fill-color: var(--mp-gold); }
.login-panel .card { border: 1px solid var(--mp-gold-dark); background: rgba(22,17,13,.92); backdrop-filter: blur(6px); box-shadow: 0 0 0 1px #000, 0 0 50px rgba(226,176,82,.1), 0 30px 70px rgba(0,0,0,.7); border-radius: 8px; }
.login-panel .card-title { color: var(--mp-gold); }
.login-panel .btn-primary { font: 700 .9rem "Cinzel", Georgia, serif; letter-spacing: .14em; text-transform: uppercase; }
.mp-player-link { display: block; margin-top: 18px; text-align: center; font-size: .85rem; color: #d8c8ae; text-shadow: 0 1px 6px #000; }

/* home */
.mu-hero { background: url("/mu-hero.svg") center 70% / cover no-repeat, #120d0a; border: 1px solid var(--mp-gold-dark); border-radius: 8px; min-height: 230px; isolation: isolate; }
.mu-hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(11,9,7,.9) 0%, rgba(11,9,7,.55) 55%, rgba(11,9,7,.1)); }
.mu-eyebrow { color: var(--mp-gold); }
.mu-hero h2 { font-family: "Cinzel", Georgia, serif; color: var(--mp-gold-hi); }
.mu-hero p:last-child { color: #e2d3bb; }
.mu-shortcut:hover { border-color: var(--mp-gold-dark); }
.mu-shortcut-icon { background: radial-gradient(circle, #2b1f14, #140f0b); border: 1px solid var(--mp-gold-dark); color: var(--mp-gold); border-radius: 50%; }