/* Minimal extracted + adapted styles (vlogg1527/rophim template.css)
   Scoped by route-level layout import only (app/random/layout.jsx). */

:root{
  --rnd-bg: #191B24;
  --rnd-text: #aaa;
  --rnd-primary: #FFD875;
  --rnd-border: rgba(255,255,255,.12);
  --rnd-card: rgba(255,255,255,.03);
}

.random-scope{
  color: var(--rnd-text);
}
.random-scope a{ color:#fff; text-decoration:none; cursor:pointer; }
.random-scope a:hover{ color: var(--rnd-primary); }

.random-scope #wrapper{
  padding: 10rem 0 10rem;
  min-height: calc(100vh - 400px);
  background: var(--rnd-bg);
}
.random-scope .fluid-gap{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
}
.random-scope .cards-row.wide{ width: 100%; }
.random-scope .row-header{
  display:flex;
  align-items:center;
  gap: .75rem;
  margin-bottom: 1.25rem;
}
.random-scope .category-name{
  color:#fff;
  font-size: 1.35rem;
  font-weight: 700;
  margin:0;
}

.random-scope .v-notice{
  margin: 3rem 0;
  padding: 2rem 1.5rem;
  border: 1px dashed rgba(255,255,255,.2);
  border-radius: 16px;
  background: var(--rnd-card);
  display:flex;
  align-items:center;
  justify-content:center;
  gap: .75rem;
  flex-direction: column;
  text-align: center;
}
.random-scope .v-notice p{ margin:0; color: rgba(255,255,255,.75); }
.random-scope .inc-icon{ width: 44px; height: 44px; display:inline-flex; align-items:center; justify-content:center; }
.random-scope .inc-icon img, .random-scope .inc-icon svg{ width: 100%; height: 100%; display:block; }

.random-scope .v-loader-area{
  width: 100%;
  padding: 3rem 0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.random-scope .v-loader{
  width: 28px;
  height: 28px;
  border-radius: 999px;
  border: 3px solid rgba(255,255,255,.15);
  border-top-color: var(--rnd-primary);
  animation: rnd-spin .8s linear infinite;
}
@keyframes rnd-spin{ to { transform: rotate(360deg);} }

.random-scope .btn{
  font-size: 14px;
  font-weight: 600;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:.5rem;
  padding:.55rem 1rem;
  border-radius:.45rem;
  min-height:40px;
  border:1px solid transparent;
  user-select:none;
}
.random-scope .btn-outline{
  background: transparent;
  border-color: rgba(255,255,255,.45);
  color:#fff;
}
.random-scope .btn-primary{
  background: var(--rnd-primary);
  color: #191B24;
  border-color: var(--rnd-primary);
}
