/* Role mappings from legacy classes into the UI frame system. */
.panel,
.sidebar-card,
.slot-card,
.archive-hero,
.archive-round,
.mechbay-card,
.rsvp-modal,
.rsvp-modal-card,
.inset-panel,
.ops-card {
  position:relative;
  border-width:2px !important;
  border-style:solid !important;
  border-color:rgba(155,255,0,.20) !important;
  background:var(--ui-pane-bg) !important;
  clip-path:polygon(0 18px, 18px 0, calc(100% - 18px) 0, 100% 18px, 100% calc(100% - 18px), calc(100% - 18px) 100%, 18px 100%, 0 calc(100% - 18px));
  box-shadow:var(--ui-frame-shadow), inset 0 0 30px rgba(155,255,0,.035) !important;
}
.panel::before,
.sidebar-card::before,
.slot-card::before,
.archive-hero::before,
.archive-round::before,
.mechbay-card::before,
.rsvp-modal::before,
.rsvp-modal-card::before,
.inset-panel::before,
.ops-card::before {
  content:"";
  position:absolute;
  inset:5px;
  pointer-events:none;
  border:1px solid rgba(255,255,255,.045);
  clip-path:inherit;
}
.auth-panel,
.page-login .panel,
.page-login_page .panel {
  border-width:4px !important;
  border-color:rgba(155,255,0,.28) !important;
  background:var(--ui-auth-bg) !important;
  clip-path:polygon(0 26px, 26px 0, calc(100% - 26px) 0, 100% 26px, 100% calc(100% - 26px), calc(100% - 26px) 100%, 26px 100%, 0 calc(100% - 26px));
  box-shadow:0 24px 55px rgba(0,0,0,.48), inset 0 0 0 1px rgba(255,255,255,.04), inset 0 0 46px rgba(155,255,0,.045) !important;
}
.auth-panel::after,
.page-login .panel::after,
.page-login_page .panel::after {
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 10% 8%, rgba(155,255,0,.20), transparent 4%),
    radial-gradient(circle at 90% 8%, rgba(155,255,0,.16), transparent 4%),
    radial-gradient(circle at 10% 92%, rgba(155,255,0,.12), transparent 4%),
    radial-gradient(circle at 90% 92%, rgba(155,255,0,.18), transparent 4%),
    linear-gradient(90deg, rgba(155,255,0,.24), transparent 16%, transparent 84%, rgba(155,255,0,.18)) top left/100% 3px no-repeat,
    linear-gradient(90deg, rgba(155,255,0,.12), transparent 16%, transparent 84%, rgba(155,255,0,.24)) bottom left/100% 3px no-repeat;
}
