/* Oracle V7I: number badges, glass panel, better spread grid. */

/* Main panel: more transparent, less black slab */
body.oracle-clean-v7b .oracle-panel{
  background:
    linear-gradient(115deg, rgba(10,16,25,.62), rgba(4,9,15,.72)) !important;
  border-color:rgba(177,126,57,.42) !important;
  box-shadow:
    inset 0 0 0 1px rgba(255,232,190,.035),
    0 24px 60px rgba(0,0,0,.24) !important;
  backdrop-filter:blur(8px) saturate(1.06) !important;
}

/* Top disclaimer lighter */
body.oracle-clean-v7b .oracle-disclaimer-top{
  background:rgba(3,8,14,.54) !important;
  backdrop-filter:blur(7px) !important;
  border-color:rgba(183,130,62,.38) !important;
}

/* Textarea glass */
body.oracle-clean-v7b .oracle-textarea{
  background:rgba(2,7,13,.66) !important;
  backdrop-filter:blur(6px) !important;
  border-color:rgba(177,126,57,.38) !important;
}

/* Spread buttons: one row on desktop */
body.oracle-clean-v7b .oracle-controls{
  display:grid !important;
  grid-template-columns:repeat(4, minmax(0, 1fr)) !important;
  gap:16px !important;
  width:min(100%, 1060px) !important;
  margin-left:auto !important;
  margin-right:auto !important;
  align-items:center !important;
}

body.oracle-clean-v7b [data-spread-value].btn{
  width:100% !important;
  min-width:0 !important;
  padding:10px 14px !important;
  min-height:54px !important;
  display:inline-flex !important;
  justify-content:center !important;
  align-items:center !important;
  gap:10px !important;
  white-space:nowrap !important;
}

/* Number medallion */
body.oracle-clean-v7b .oracle-spread-num{
  width:32px;
  height:32px;
  min-width:32px;
  border-radius:999px;
  display:inline-grid;
  place-items:center;
  font-family:Georgia,"Times New Roman",serif;
  font-size:18px;
  line-height:1;
  font-weight:700;
  letter-spacing:0;
  color:#fff4d6;
  border:1px solid rgba(243,217,157,.56);
  background:
    radial-gradient(circle at 50% 28%, rgba(255,235,180,.22), transparent 48%),
    rgba(8,9,14,.54);
  box-shadow:
    inset 0 0 0 1px rgba(255,232,190,.05),
    0 0 18px rgba(212,170,99,.10);
}

body.oracle-clean-v7b [data-spread-value].btn.is-active .oracle-spread-num{
  background:
    radial-gradient(circle at 50% 26%, rgba(255,237,190,.32), transparent 50%),
    linear-gradient(135deg, rgba(212,170,99,.34), rgba(104,38,55,.22));
  border-color:rgba(243,217,157,.76);
  box-shadow:
    inset 0 0 0 1px rgba(255,232,190,.08),
    0 0 22px rgba(212,170,99,.18);
}

/* Text part */
body.oracle-clean-v7b .oracle-spread-text{
  display:inline-block;
  font-family:Georgia,"Times New Roman",serif;
  font-size:14px;
  font-weight:600;
  letter-spacing:.045em;
  text-transform:uppercase;
  line-height:1;
}

/* Draw/read buttons stay native, but a little less bulky */
body.oracle-clean-v7b .oracle-actions{
  margin-top:18px !important;
}

body.oracle-clean-v7b [data-oracle-draw].btn{
  min-width:360px !important;
}

body.oracle-clean-v7b [data-oracle-read].btn{
  min-width:250px !important;
}

/* Rune overlay must sit above number/text cleanly */
body.oracle-clean-v7b [data-spread-value].btn.is-rune-hover .oracle-spread-num,
body.oracle-clean-v7b [data-spread-value].btn.is-rune-hover .oracle-spread-text{
  opacity:0 !important;
}

/* Result/CTA glass too */
body.oracle-clean-v7b .oracle-result,
body.oracle-clean-v7b .oracle-cta{
  background:rgba(4,9,16,.54) !important;
  backdrop-filter:blur(7px) !important;
}

/* Tablet: 2x2 */
@media (max-width: 980px){
  body.oracle-clean-v7b .oracle-controls{
    grid-template-columns:repeat(2, minmax(0, 1fr)) !important;
    max-width:720px !important;
  }
}

/* Mobile: one per row */
@media (max-width: 560px){
  body.oracle-clean-v7b .oracle-controls{
    grid-template-columns:1fr !important;
  }

  body.oracle-clean-v7b [data-spread-value].btn{
    max-width:420px !important;
    margin-left:auto !important;
    margin-right:auto !important;
  }

  body.oracle-clean-v7b .oracle-spread-text{
    font-size:13px !important;
  }
}