/*
 * Schemattic UI utilities
 * fix430: canonical card-law utilities. Use these instead of rebuilding red borders/backgrounds per module.
 */
:root{
  --sc-red-border: rgba(255,0,0,.42);
  --sc-red-border-soft: rgba(255,0,0,.24);
  --sc-red-glow: rgba(255,0,0,.18);
  --sc-red-glow-strong: rgba(255,0,0,.30);
  --sc-card-gray: #101010;
  --sc-card-gray-soft: #151515;
  --sc-card-black: #050505;
  --sc-card-bg: radial-gradient(circle at top left,#1b1b1b 0,#0b0b0b 56%,#050505 100%);
  --sc-card-bg-flat: #101010;
  --sc-card-text: #f5f5f5;
  --sc-card-muted: rgba(245,245,245,.78);
  --sc-card-radius: 18px;
  --sc-card-shadow: 0 0 0 1px rgba(255,0,0,.18),0 18px 45px rgba(0,0,0,.86),0 0 28px rgba(255,0,0,.10);
}

.sc_border{
  border:1px solid var(--sc-red-border)!important;
  box-shadow:var(--sc-card-shadow)!important;
  border-radius:var(--sc-card-radius);
  position:relative;
  overflow:hidden;
  box-sizing:border-box;
}
.sc_border::before{
  content:"";
  position:absolute;
  top:0;
  left:8%;
  right:8%;
  height:2px;
  background:radial-gradient(circle,#ff2727,rgba(255,39,39,.38) 24%,transparent 72%);
  opacity:.96;
  pointer-events:none;
  z-index:0;
}
.sc_border > *{position:relative;z-index:1}

.sc_card_bg,
.sc_gray_bg,
.sc_bg_gray{
  background:var(--sc-card-bg)!important;
  color:var(--sc-card-text)!important;
}

.sc_card,
.sc_panel{
  width:100%;
  max-width:100%;
  min-width:0;
  box-sizing:border-box;
  border-radius:var(--sc-card-radius);
  background:var(--sc-card-bg)!important;
  color:var(--sc-card-text)!important;
  border:1px solid var(--sc-red-border)!important;
  box-shadow:var(--sc-card-shadow)!important;
  position:relative;
  overflow:hidden;
}
.sc_card::before,
.sc_panel::before{
  content:"";
  position:absolute;
  top:0;
  left:8%;
  right:8%;
  height:2px;
  background:radial-gradient(circle,#ff2727,rgba(255,39,39,.38) 24%,transparent 72%);
  opacity:.96;
  pointer-events:none;
  z-index:0;
}
.sc_card > *,
.sc_panel > *{position:relative;z-index:1}

.sc_border_button,
.sc_button_law{
  border:1px solid rgba(255,0,0,.34)!important;
  background:linear-gradient(180deg,rgba(45,0,0,.92),rgba(12,0,0,.92))!important;
  color:#f5f5f5!important;
  border-radius:999px!important;
  box-shadow:0 0 0 1px rgba(255,0,0,.12),0 10px 25px rgba(0,0,0,.55)!important;
}
.sc_border_button:hover,
.sc_button_law:hover{
  border-color:rgba(255,0,0,.52)!important;
  box-shadow:0 0 18px rgba(255,0,0,.24),0 12px 28px rgba(0,0,0,.65)!important;
}

/* Compatibility bridge: old card-law classes now inherit the canonical utility variables. */
.sc4-profile-card-law,
.sc4-card-law,
.schemattic-card-law{
  background:var(--sc-card-bg)!important;
  color:var(--sc-card-text)!important;
  border:1px solid var(--sc-red-border)!important;
  border-radius:var(--sc-card-radius)!important;
  box-shadow:var(--sc-card-shadow)!important;
  position:relative!important;
  overflow:hidden!important;
  box-sizing:border-box!important;
}
.sc4-profile-card-law::before,
.sc4-card-law::before,
.schemattic-card-law::before{
  content:"";
  position:absolute;
  top:0;
  left:8%;
  right:8%;
  height:2px;
  background:radial-gradient(circle,#ff2727,rgba(255,39,39,.38) 24%,transparent 72%);
  opacity:.96;
  pointer-events:none;
  z-index:0;
}
.sc4-profile-card-law > *,
.sc4-card-law > *,
.schemattic-card-law > *{position:relative;z-index:1}