/* Oracryn shared identity v4
   Typography-first surface, shared dark/light identity and compact icon language. */

:root{
  --o4-bg:#0d0812;
  --o4-bg-deep:#09060d;
  --o4-surface:#120b18;
  --o4-surface-2:#17101d;
  --o4-ink:#f7f2f8;
  --o4-muted:#a99eac;
  --o4-dim:#756b79;
  --o4-line:rgba(244,232,249,.10);
  --o4-line-strong:rgba(244,232,249,.18);
  --o4-accent:#b66bb0;
  --o4-accent-2:#dca5d2;
  --o4-cyan:#83c8dc;
  --o4-shadow:rgba(0,0,0,.34);
  --o4-header:rgba(9,6,13,.90);
  color-scheme:dark;
}

html[data-theme="light"]{
  --o4-bg:#e9eaee;
  --o4-bg-deep:#dde0e6;
  --o4-surface:#f3f4f7;
  --o4-surface-2:#e1e4ea;
  --o4-ink:#171820;
  --o4-muted:#5f626e;
  --o4-dim:#7c818e;
  --o4-line:rgba(35,39,56,.13);
  --o4-line-strong:rgba(35,39,56,.22);
  --o4-accent:#765087;
  --o4-accent-2:#9b72a8;
  --o4-cyan:#3f7f92;
  --o4-shadow:rgba(46,49,66,.12);
  --o4-header:rgba(232,234,239,.93);
  color-scheme:light;
}

html[data-theme="light"],
html[data-theme="light"] body{
  background:var(--o4-bg)!important;
  color:var(--o4-ink);
}

html[data-theme="light"] .liquid-shader,
html[data-theme="light"] .shade,
html[data-theme="light"] .oracryn-liquid-shader{
  opacity:0!important;
  visibility:hidden!important;
}

/* theme button */
.oracryn-theme-toggle{
  width:36px;
  height:36px;
  flex:0 0 36px;
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid var(--o4-line-strong);
  border-radius:0;
  background:rgba(255,255,255,.018);
  color:var(--o4-ink);
  cursor:pointer;
  font:800 15px/1 "Manrope",sans-serif;
  transition:transform .18s ease,background .18s ease,border-color .18s ease;
}
.oracryn-theme-toggle:hover{
  transform:translateY(-1px);
  border-color:color-mix(in srgb,var(--o4-accent) 55%,transparent);
  background:color-mix(in srgb,var(--o4-accent) 8%,transparent);
}
html[data-theme="light"] .oracryn-theme-toggle{
  background:rgba(255,255,255,.42);
}

/* home global palette */
.ov3-home{
  --v3-bg:var(--o4-bg);
  --v3-bg-deep:var(--o4-bg-deep);
  --v3-panel:color-mix(in srgb,var(--o4-surface) 74%,transparent);
  --v3-text:var(--o4-ink);
  --v3-muted:var(--o4-muted);
  --v3-dim:var(--o4-dim);
  --v3-line:var(--o4-line);
  --v3-line-2:var(--o4-line-strong);
  --v3-violet:var(--o4-accent);
  --v3-violet-2:var(--o4-accent-2);
  --v3-plum:#7e456f;
  --v3-cyan:var(--o4-cyan);
  --v3-cyan-2:var(--o4-cyan);
  color:var(--o4-ink);
  background:
    radial-gradient(circle at 82% 8%,color-mix(in srgb,var(--o4-accent) 13%,transparent),transparent 29rem),
    radial-gradient(circle at 6% 38%,color-mix(in srgb,var(--o4-cyan) 7%,transparent),transparent 30rem),
    linear-gradient(180deg,color-mix(in srgb,var(--o4-bg) 92%,transparent),var(--o4-bg-deep));
}
html[data-theme="light"] .ov3-home{
  background:
    radial-gradient(circle at 82% 8%,rgba(118,80,135,.10),transparent 28rem),
    radial-gradient(circle at 7% 34%,rgba(63,127,146,.07),transparent 28rem),
    linear-gradient(180deg,#eef0f4,#e7e9ee 58%,#dde0e6);
}
html[data-theme="light"] .ov3-atmosphere{
  background:
    radial-gradient(circle at 83% 8%,rgba(157,63,120,.10),transparent 30rem),
    radial-gradient(circle at 5% 34%,rgba(106,70,118,.06),transparent 29rem),
    radial-gradient(circle at 74% 69%,rgba(63,128,150,.05),transparent 27rem);
}
html[data-theme="light"] .ov3-atmosphere::before{opacity:.075}
html[data-theme="light"] .ov3-atmosphere::after{opacity:.08}

/* home header */
.site>header{
  background:var(--o4-header)!important;
  border-bottom-color:var(--o4-line)!important;
}
.site>header>.header-account{
  gap:7px;
}
.site>header .brand,
.site>header .profile-trigger,
.site>header .login-discord,
.site>header .header-arcana{
  color:var(--o4-ink);
}
.site>header .brand span{
  background:linear-gradient(135deg,var(--o4-accent-2),#73509f);
}
html[data-theme="light"] .site>header .login-discord,
html[data-theme="light"] .site>header .header-arcana,
html[data-theme="light"] .site>header .profile-trigger{
  border-color:var(--o4-line);
  background:rgba(255,255,255,.36);
}
html[data-theme="light"] .balance-mini strong{color:var(--o4-ink)}
html[data-theme="light"] .balance-mini span{color:var(--o4-muted)}

.ov3-home-nav{
  border-color:var(--o4-line)!important;
  background:color-mix(in srgb,var(--o4-surface) 34%,transparent)!important;
}
.ov3-home-nav a{color:var(--o4-muted)!important}
.ov3-home-nav a:hover{color:var(--o4-ink)!important}
.ov3-home-nav .ov3-nav-page{
  color:color-mix(in srgb,var(--o4-accent) 66%,var(--o4-ink))!important;
}

/* typography as the visual identity */
.ov3-title,
.ov3-flow-intro h2,
.ov3-catalog-copy h2,
.ov3-build-copy h2,
.ov3-encounter-copy h2,
.ov3-final h2,
body.oracryn-public-v2 .public-page-intro h1,
body.oracryn-public-v2 .arcana-hero h1{
  text-wrap:balance;
  text-shadow:
    1px 0 0 color-mix(in srgb,var(--o4-accent) 32%,transparent),
    -1px 1px 0 color-mix(in srgb,var(--o4-cyan) 17%,transparent);
}
.ov3-title{
  max-width:760px;
  font-size:clamp(72px,7vw,108px);
  line-height:.80;
  letter-spacing:-.028em;
}
.ov3-title .ov4-accent-line{
  color:transparent;
  background:linear-gradient(90deg,var(--o4-accent-2) 0%,var(--o4-accent) 48%,color-mix(in srgb,var(--o4-cyan) 70%,var(--o4-accent)) 100%);
  -webkit-background-clip:text;
  background-clip:text;
  filter:drop-shadow(3px 3px 0 color-mix(in srgb,var(--o4-accent) 12%,transparent));
}
.ov3-title .ov4-outline-line{
  color:var(--o4-ink);
  -webkit-text-stroke:1px color-mix(in srgb,var(--o4-ink) 92%,transparent);
  text-shadow:
    3px 2px 0 color-mix(in srgb,var(--o4-accent) 14%,transparent),
    -2px -1px 0 color-mix(in srgb,var(--o4-cyan) 10%,transparent);
}

.ov3-eyebrow{
  color:color-mix(in srgb,var(--o4-accent) 66%,var(--o4-muted));
}
.ov3-eyebrow .ov4-glyph{
  width:22px;
  display:inline-grid;
  place-items:center;
  color:var(--o4-accent);
  font-size:12px;
  letter-spacing:0;
}
.ov3-eyebrow::before{display:none}

.ov3-gradient{
  background:linear-gradient(90deg,var(--o4-accent-2),var(--o4-accent) 54%,var(--o4-cyan));
  -webkit-background-clip:text;
  background-clip:text;
}

/* hero no longer depends on card art */
.ov3-hero{
  min-height:700px;
  grid-template-columns:minmax(0,1.15fr) minmax(360px,.65fr);
  gap:74px;
  padding:74px 0 45px;
}
.ov3-lede{color:var(--o4-muted);max-width:620px}
.ov3-start{border-top-color:var(--o4-line)}
.ov3-start span,.ov3-start small{color:var(--o4-dim)}
.ov3-start code{color:var(--o4-accent-2)}

.ov4-system-panel{
  position:relative;
  min-height:460px;
  align-self:center;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  padding:29px 0 0 32px;
  border-left:1px solid color-mix(in srgb,var(--o4-accent) 35%,var(--o4-line));
}
.ov4-system-panel::before{
  content:"";
  position:absolute;
  left:-5px;
  top:0;
  width:9px;
  height:9px;
  transform:rotate(45deg);
  background:var(--o4-accent);
  box-shadow:0 0 22px color-mix(in srgb,var(--o4-accent) 32%,transparent);
}
.ov4-system-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:18px;
  padding-bottom:18px;
  border-bottom:1px solid var(--o4-line);
}
.ov4-system-kicker{
  display:flex;
  align-items:center;
  gap:9px;
  color:var(--o4-muted);
  font-size:8px;
  font-weight:800;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.ov4-system-kicker i{
  width:7px;
  height:7px;
  border-radius:50%;
  background:var(--o4-accent);
  box-shadow:0 0 14px color-mix(in srgb,var(--o4-accent) 45%,transparent);
}
.ov4-system-id{
  color:var(--o4-dim);
  font:700 8px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.12em;
}
.ov4-sigil{
  position:relative;
  min-height:190px;
  display:grid;
  place-items:center;
}
.ov4-sigil::before,
.ov4-sigil::after{
  content:"";
  position:absolute;
  border:1px solid color-mix(in srgb,var(--o4-accent) 30%,var(--o4-line));
  transform:rotate(45deg);
}
.ov4-sigil::before{width:145px;height:145px}
.ov4-sigil::after{width:92px;height:92px;border-color:color-mix(in srgb,var(--o4-cyan) 26%,var(--o4-line))}
.ov4-sigil span{
  position:relative;
  z-index:1;
  font-family:"Teko",sans-serif;
  font-size:74px;
  line-height:1;
  letter-spacing:.05em;
  color:var(--o4-ink);
  text-shadow:4px 3px 0 color-mix(in srgb,var(--o4-accent) 22%,transparent);
}
.ov4-system-list{
  border-top:1px solid var(--o4-line);
}
.ov4-system-row{
  display:grid;
  grid-template-columns:34px minmax(0,1fr) auto;
  align-items:center;
  gap:11px;
  min-height:55px;
  border-bottom:1px solid var(--o4-line);
  color:var(--o4-muted);
  font-size:9px;
}
.ov4-system-row>span:first-child{
  color:var(--o4-accent);
  font-size:13px;
}
.ov4-system-row strong{
  color:var(--o4-ink);
  font-size:9px;
  font-weight:800;
  letter-spacing:.04em;
}
.ov4-system-row small{
  color:var(--o4-dim);
  font:700 7px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.08em;
}
.ov4-live-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  margin-top:18px;
  border-top:1px solid var(--o4-line);
  border-bottom:1px solid var(--o4-line);
}
.ov4-live-facts div{
  min-height:72px;
  padding:14px 15px;
  border-right:1px solid var(--o4-line);
}
.ov4-live-facts div:last-child{border-right:0}
.ov4-live-facts strong{
  display:block;
  color:var(--o4-ink);
  font-family:"Teko",sans-serif;
  font-size:29px;
  line-height:1;
}
.ov4-live-facts span{
  display:block;
  margin-top:5px;
  color:var(--o4-dim);
  font-size:7px;
  font-weight:800;
  letter-spacing:.12em;
  text-transform:uppercase;
}

/* icon-led small references instead of decorative imagery */
.ov3-step-num{
  width:38px;
  height:38px;
  border-radius:0;
  transform:rotate(45deg);
  background:var(--o4-surface);
  border-color:color-mix(in srgb,var(--o4-accent) 28%,var(--o4-line));
}
.ov3-step-num>span{
  transform:rotate(-45deg);
  color:var(--o4-accent-2);
  font-size:12px;
}
.ov3-flow-list::before{left:18px}
.ov3-step h3,.ov3-build-item h3,.ov3-encounter-side strong{color:var(--o4-ink)}
.ov3-step p,.ov3-build-item p,.ov3-flow-intro p,.ov3-build-copy p,.ov3-encounter-copy p,.ov3-encounter-side p{color:var(--o4-muted)}

.ov3-build-item>span{
  display:flex;
  align-items:center;
  gap:7px;
  color:color-mix(in srgb,var(--o4-accent) 75%,var(--o4-muted));
}
.ov3-build-item>span i{
  color:var(--o4-accent);
  font-size:11px;
  font-style:normal;
}
.ov3-role-line span{
  border-color:color-mix(in srgb,var(--o4-cyan) 24%,var(--o4-line));
  background:color-mix(in srgb,var(--o4-cyan) 4%,transparent);
  color:color-mix(in srgb,var(--o4-cyan) 75%,var(--o4-muted));
}

/* catalog = deliberate image area */
.ov3-catalog{
  background:
    linear-gradient(180deg,color-mix(in srgb,var(--o4-surface) 28%,transparent),transparent 55%),
    transparent;
  border-color:var(--o4-line);
}
.ov3-reel-card{
  border-top-color:var(--o4-line-strong);
}
.ov3-reel-card img{
  filter:saturate(.9) contrast(.98);
  transition:filter .2s ease,transform .25s ease;
}
.ov3-reel-card:hover img{
  filter:saturate(1.04) contrast(1.02);
  transform:translateY(-2px);
}
html[data-theme="light"] .ov3-reel-card img{
  box-shadow:0 10px 30px rgba(63,38,56,.08);
}
.ov3-reel-meta strong{color:var(--o4-ink)}
.ov3-reel-meta span,.ov3-reel-meta em{color:var(--o4-dim)}

/* buttons */
.ov3-btn{
  border-color:var(--o4-line-strong);
  background:color-mix(in srgb,var(--o4-surface) 36%,transparent);
  color:var(--o4-ink);
}
.ov3-btn.primary{
  border-color:color-mix(in srgb,var(--o4-accent) 46%,transparent);
  background:linear-gradient(112deg,color-mix(in srgb,var(--o4-accent) 62%,var(--o4-surface)),color-mix(in srgb,var(--o4-accent) 35%,var(--o4-surface)));
  color:#fff;
}
html[data-theme="light"] .ov3-btn.primary{
  color:#fff;
}

/* strips / footer */
.ov3-command-strip{border-color:var(--o4-line);background:color-mix(in srgb,var(--o4-surface) 16%,transparent)}
.ov3-command-set span{border-color:var(--o4-line);color:var(--o4-dim)}
.ov3-command-set code{color:var(--o4-accent)}
.site>footer{color:var(--o4-dim)}
.site>footer a{color:var(--o4-muted)}

/* public pages share same theme */
body.oracryn-public-v2{
  --ops-bg:var(--o4-bg);
  --ops-bg-deep:var(--o4-bg-deep);
  --ops-text:var(--o4-ink);
  --ops-muted:var(--o4-muted);
  --ops-dim:var(--o4-dim);
  --ops-line:var(--o4-line);
  --ops-line-strong:var(--o4-line-strong);
  --ops-violet:var(--o4-accent);
  --ops-violet-2:var(--o4-accent-2);
  --ops-cyan:var(--o4-cyan);
  --ops-cyan-2:var(--o4-cyan);
  color:var(--o4-ink)!important;
  background:
    radial-gradient(circle at 84% 8%,color-mix(in srgb,var(--o4-accent) 12%,transparent),transparent 31rem),
    radial-gradient(circle at 5% 36%,color-mix(in srgb,var(--o4-cyan) 6%,transparent),transparent 28rem),
    linear-gradient(180deg,var(--o4-bg),var(--o4-bg-deep))!important;
}
html[data-theme="light"] body.oracryn-public-v2{
  background:
    radial-gradient(circle at 84% 8%,rgba(118,80,135,.09),transparent 31rem),
    radial-gradient(circle at 5% 36%,rgba(63,127,146,.06),transparent 28rem),
    linear-gradient(180deg,#eef0f4,#dde0e6)!important;
}
body.oracryn-public-v2 .site-header{
  background:var(--o4-header)!important;
  border-bottom-color:var(--o4-line)!important;
}
body.oracryn-public-v2 .site-header .nav{
  grid-template-columns:auto minmax(0,1fr) auto!important;
}
body.oracryn-public-v2 .brand{color:var(--o4-ink)!important}
body.oracryn-public-v2 .nav-links{
  border-color:var(--o4-line)!important;
  background:color-mix(in srgb,var(--o4-surface) 34%,transparent)!important;
}
body.oracryn-public-v2 .nav-links a{color:var(--o4-muted)!important}
body.oracryn-public-v2 .nav-links a:hover,
body.oracryn-public-v2 .nav-links a[aria-current="page"]{color:var(--o4-ink)!important}
body.oracryn-public-v2 .nav-links a[aria-current="page"]{
  background:color-mix(in srgb,var(--o4-accent) 9%,transparent)!important;
  box-shadow:inset 0 -1px 0 color-mix(in srgb,var(--o4-accent) 64%,transparent)!important;
}

body.oracryn-public-v2 .public-page-intro::before,
body.oracryn-public-v2 .arcana-hero::before{
  background:linear-gradient(90deg,var(--o4-accent),transparent)!important;
}
body.oracryn-public-v2 .public-page-intro h1,
body.oracryn-public-v2 .arcana-hero h1{
  color:var(--o4-ink)!important;
  position:relative;
}
body.oracryn-public-v2 .public-page-intro h1::after,
body.oracryn-public-v2 .arcana-hero h1::after{
  content:"";
  display:block;
  width:min(170px,40%);
  height:5px;
  margin-top:16px;
  background:
    linear-gradient(90deg,var(--o4-accent) 0 42%,transparent 42% 50%,var(--o4-cyan) 50% 70%,transparent 70%);
  opacity:.52;
}
body.oracryn-public-v2 .public-page-intro-copy p,
body.oracryn-public-v2 .arcana-hero-copy>p,
body.oracryn-public-v2 .legal p,
body.oracryn-public-v2 .support-panel p,
body.oracryn-public-v2 .support-panel li{color:var(--o4-muted)!important}
body.oracryn-public-v2 .legal .notice{color:color-mix(in srgb,var(--o4-ink) 82%,var(--o4-muted))!important}
body.oracryn-public-v2 .legal h2,
body.oracryn-public-v2 .support-panel h2,
body.oracryn-public-v2 .store-heading h2,
body.oracryn-public-v2 .manual-payment h2{color:var(--o4-ink)!important}
body.oracryn-public-v2 .support-panel,
body.oracryn-public-v2 .store-panel,
body.oracryn-public-v2 .manual-payment,
body.oracryn-public-v2 .package-card,
body.oracryn-public-v2 .payment-card,
body.oracryn-public-v2 .payment-group{
  border-color:var(--o4-line)!important;
}
html[data-theme="light"] body.oracryn-public-v2 .package-card,
html[data-theme="light"] body.oracryn-public-v2 .payment-card{
  background:rgba(255,255,255,.28)!important;
}
body.oracryn-public-v2 .button{
  border-color:var(--o4-line-strong)!important;
  color:var(--o4-ink)!important;
  background:color-mix(in srgb,var(--o4-surface) 34%,transparent)!important;
}
body.oracryn-public-v2 .button.primary{
  color:#fff!important;
  border-color:color-mix(in srgb,var(--o4-accent) 48%,transparent)!important;
  background:linear-gradient(112deg,color-mix(in srgb,var(--o4-accent) 70%,#553453),color-mix(in srgb,var(--o4-accent) 50%,#38283d))!important;
}
body.oracryn-public-v2 .site-footer{
  border-top-color:var(--o4-line)!important;
  background:color-mix(in srgb,var(--o4-bg-deep) 65%,transparent)!important;
}
html[data-theme="light"] body.oracryn-public-v2 .site-footer{
  background:rgba(233,226,221,.64)!important;
}
body.oracryn-public-v2 .footer-row{color:var(--o4-dim)!important}
body.oracryn-public-v2 .footer-links a{color:var(--o4-muted)!important}

/* mobile */
@media(max-width:900px){
  .ov3-title{font-size:clamp(62px,9vw,86px)}
  .ov3-hero{grid-template-columns:minmax(0,1fr) minmax(310px,.55fr);gap:42px}
  .ov4-system-panel{min-height:420px}
}
@media(max-width:820px){
  .ov3-hero{grid-template-columns:1fr;gap:34px}
  .ov4-system-panel{min-height:0;padding:26px 0 0;border-left:0;border-top:1px solid color-mix(in srgb,var(--o4-accent) 34%,var(--o4-line))}
  .ov4-system-panel::before{left:0;top:-5px}
  .ov4-sigil{min-height:160px}
  .site>header>.header-account{gap:5px}
}
@media(max-width:760px){
  body.oracryn-public-v2 .site-header .nav{
    grid-template-columns:auto auto!important;
    grid-template-areas:
      "brand theme"
      "nav nav";
  }
  body.oracryn-public-v2 .site-header .brand{grid-area:brand}
  body.oracryn-public-v2 .site-header .nav-links{grid-area:nav}
  body.oracryn-public-v2 .site-header .oracryn-theme-toggle{grid-area:theme;justify-self:end}
}
@media(max-width:560px){
  .ov3-title{font-size:clamp(50px,16vw,69px)}
  .ov4-system-row{grid-template-columns:30px minmax(0,1fr)}
  .ov4-system-row small{display:none}
  .ov4-live-facts div{padding:12px 10px}
  .oracryn-theme-toggle{width:34px;height:34px;flex-basis:34px}
}
@media(prefers-reduced-motion:reduce){
  .oracryn-theme-toggle{transition:none}
}


/* Simplified home hero: only meaningful live data, no decorative counter/sigil. */
.ov4-hero-stats{
  align-self:center;
  display:grid;
  grid-template-columns:1fr 1fr;
  border-top:1px solid var(--o4-line);
  border-bottom:1px solid var(--o4-line);
}
.ov4-hero-stats-label{
  grid-column:1/-1;
  padding:12px 0 10px;
  color:var(--o4-dim);
  font-size:8px;
  font-weight:800;
  letter-spacing:.16em;
}
.ov4-hero-stat{
  min-height:132px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding:18px 24px 18px 0;
  border-top:1px solid var(--o4-line);
  border-right:1px solid var(--o4-line);
}
.ov4-hero-stat:nth-of-type(3){
  padding-left:24px;
  border-right:0;
}
.ov4-hero-stat strong{
  color:var(--o4-ink);
  font-family:"Teko",sans-serif;
  font-size:58px;
  line-height:.86;
  font-weight:600;
}
.ov4-hero-stat span{
  margin-top:8px;
  color:var(--o4-muted);
  font-size:8px;
  font-weight:800;
  letter-spacing:.11em;
  text-transform:uppercase;
}
.ov4-hero-stats p{
  grid-column:1/-1;
  margin:0;
  padding:12px 0;
  border-top:1px solid var(--o4-line);
  color:var(--o4-dim);
  font-size:8px;
}
@media(max-width:820px){
  .ov4-hero-stats{max-width:620px}
}
@media(max-width:560px){
  .ov4-hero-stat{min-height:105px}
  .ov4-hero-stat strong{font-size:46px}
}


/* v4.3 mobile section menu                                            */
/* Desktop keeps the full navigation; mobile uses one compact trigger. */
/* ------------------------------------------------------------------ */
.mobile-section-menu-trigger{
  display:none;
  min-height:36px;
  align-items:center;
  justify-content:center;
  gap:7px;
  padding:0 11px;
  border:1px solid var(--o4-line-strong);
  border-radius:0;
  background:color-mix(in srgb,var(--o4-surface) 30%,transparent);
  color:var(--o4-ink);
  cursor:pointer;
  font:800 8px/1 "Manrope",sans-serif;
  letter-spacing:.08em;
  text-transform:uppercase;
}
.mobile-section-menu-trigger .mobile-menu-icon{
  font-size:12px;
  line-height:1;
}
.mobile-section-menu-trigger[aria-expanded="true"]{
  border-color:color-mix(in srgb,var(--o4-accent) 55%,var(--o4-line));
  background:color-mix(in srgb,var(--o4-accent) 9%,var(--o4-surface));
}

/* The standalone Arcana CTA in the home header is redundant on desktop. */
.site>header .header-arcana{display:none!important}

@media(max-width:820px){
  .mobile-section-menu-trigger{display:inline-flex}

  /* Home */
  .site>header{
    height:72px!important;
    min-height:72px!important;
    grid-template-columns:auto minmax(0,1fr)!important;
    grid-template-areas:"brand account"!important;
    align-content:center!important;
    row-gap:0!important;
    padding-top:0!important;
    padding-bottom:0!important;
  }
  .site>header>.main-nav{
    position:absolute!important;
    top:calc(100% + 8px);
    right:12px;
    left:auto;
    z-index:95;
    width:min(290px,calc(100vw - 24px))!important;
    margin:0!important;
    display:none!important;
    justify-self:auto!important;
  }
  .site>header>.main-nav.is-open{display:block!important}
  .site>header .ov3-home-nav{
    width:100%;
    display:flex!important;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    overflow:visible;
    padding:5px;
    border:1px solid var(--o4-line-strong)!important;
    background:var(--o4-header)!important;
    box-shadow:0 22px 55px rgba(0,0,0,.24);
    -webkit-backdrop-filter:blur(18px);
    backdrop-filter:blur(18px);
  }
  .site>header .ov3-home-nav a{
    width:100%;
    min-height:42px;
    flex:0 0 auto;
    justify-content:flex-start;
    padding:0 12px;
    border-bottom:1px solid var(--o4-line);
    font-size:8px;
  }
  .site>header .ov3-home-nav a:last-child{border-bottom:0}
  .ov3-home{padding-top:72px!important}

  /* Arcana / 404 style public header */
  body.oracryn-public-v2 .site-header{
    min-height:72px!important;
  }
  body.oracryn-public-v2 .site-header .nav{
    position:relative;
    min-height:72px!important;
    display:flex!important;
    align-items:center;
    gap:7px!important;
    padding:0!important;
  }
  body.oracryn-public-v2 .site-header .brand{
    margin-right:auto;
    justify-self:auto!important;
  }
  body.oracryn-public-v2 .site-header .nav-links{
    position:absolute;
    top:calc(100% + 8px);
    right:0;
    z-index:95;
    width:min(290px,calc(100vw - 28px))!important;
    display:none!important;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    overflow:visible;
    padding:5px;
    border:1px solid var(--o4-line-strong)!important;
    background:var(--o4-header)!important;
    box-shadow:0 22px 55px rgba(0,0,0,.24);
    -webkit-backdrop-filter:blur(18px);
    backdrop-filter:blur(18px);
  }
  body.oracryn-public-v2 .site-header .nav-links.is-open{display:flex!important}
  body.oracryn-public-v2 .site-header .nav-links a{
    width:100%;
    min-height:42px;
    flex:0 0 auto;
    justify-content:flex-start;
    padding:0 12px;
    border-bottom:1px solid var(--o4-line);
    font-size:8px;
  }
  body.oracryn-public-v2 .site-header .nav-links a:last-child{border-bottom:0}
}

@media(max-width:430px){
  .mobile-section-menu-trigger{
    width:34px;
    min-height:34px;
    padding:0;
  }
  .mobile-section-menu-trigger .mobile-menu-label{
    position:absolute;
    width:1px;
    height:1px;
    overflow:hidden;
    clip:rect(0 0 0 0);
    white-space:nowrap;
  }
}


/* ------------------------------------------------------------------ */
/* ------------------------------------------------------------------ */
/* Final navigation + title grammar                                    */
/* ------------------------------------------------------------------ */
:root{
  --o4-nav-active:color-mix(in srgb,var(--o4-accent) 24%,var(--o4-surface));
  --o4-nav-active-border:color-mix(in srgb,var(--o4-accent) 46%,var(--o4-line));
}
html[data-theme="light"]{
  --o4-nav-active:color-mix(in srgb,var(--o4-accent) 16%,var(--o4-surface-2));
  --o4-nav-active-border:color-mix(in srgb,var(--o4-accent) 34%,var(--o4-line));
}

.ov3-title[data-mark],
body.oracryn-public-v2 .oracryn-print-title{
  position:relative;
  isolation:isolate;
  padding-bottom:24px;
}

.ov3-title[data-mark]::after,
body.oracryn-public-v2 .oracryn-print-title::after{
  content:attr(data-mark);
  position:absolute;
  left:2px;
  bottom:0;
  color:var(--o4-dim);
  font:800 10px/1 ui-monospace,SFMono-Regular,Menlo,monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.ov3-title [data-print]{
  position:relative;
  isolation:isolate;
  text-shadow:
    3px 3px 0 color-mix(in srgb,var(--o4-accent) 13%,transparent),
    -1px -1px 0 color-mix(in srgb,var(--o4-cyan) 7%,transparent);
}

body.oracryn-public-v2 .oracryn-print-title{
  text-shadow:
    3px 3px 0 color-mix(in srgb,var(--o4-accent) 14%,transparent),
    -1px -1px 0 color-mix(in srgb,var(--o4-cyan) 8%,transparent);
}


/* v5 shared readability floor                                         */
/* ------------------------------------------------------------------ */
.ov4-hero-stats-label{font-size:10px!important}
.ov4-hero-stat span{font-size:10px!important}
.ov4-hero-stats p{font-size:11px!important}
.mobile-section-menu-trigger{font-size:10px!important}


/* ------------------------------------------------------------------ */
/* v5.1 Arcana light-mode contrast                                     */
/* ------------------------------------------------------------------ */
html[data-theme="light"] body.oracryn-public-v2 .arcana-hero,
html[data-theme="light"] body.oracryn-public-v2 .store-panel,
html[data-theme="light"] body.oracryn-public-v2 .manual-payment{
  color:var(--o4-ink)!important;
  background:transparent!important;
}

html[data-theme="light"] body.oracryn-public-v2 .arcana-hero-copy .eyebrow,
html[data-theme="light"] body.oracryn-public-v2 .store-step,
html[data-theme="light"] body.oracryn-public-v2 .package-amount small,
html[data-theme="light"] body.oracryn-public-v2 .payment-group-head small,
html[data-theme="light"] body.oracryn-public-v2 .payment-copy small,
html[data-theme="light"] body.oracryn-public-v2 .manual-payment-head p,
html[data-theme="light"] body.oracryn-public-v2 .manual-note{
  color:var(--o4-muted)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .arcana-hero-tags span,
html[data-theme="light"] body.oracryn-public-v2 .payment-group-kicker,
html[data-theme="light"] body.oracryn-public-v2 .manual-badge{
  color:#4f5360!important;
  border-color:var(--o4-line-strong)!important;
  background:rgba(255,255,255,.34)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .account-check{
  border-color:var(--o4-line-strong)!important;
  background:rgba(255,255,255,.22)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .account-check-copy>span{
  color:var(--o4-dim)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .account-check strong{
  color:var(--o4-ink)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .package-grid,
html[data-theme="light"] body.oracryn-public-v2 .payment-grid{
  border-color:var(--o4-line)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .package-card,
html[data-theme="light"] body.oracryn-public-v2 .payment-card{
  color:var(--o4-ink)!important;
  border-color:var(--o4-line)!important;
  background:rgba(255,255,255,.36)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .package-card:hover,
html[data-theme="light"] body.oracryn-public-v2 .payment-card:hover{
  background:rgba(255,255,255,.62)!important;
  border-color:color-mix(in srgb,var(--o4-accent) 32%,var(--o4-line))!important;
}

html[data-theme="light"] body.oracryn-public-v2 .package-card.featured{
  background:
    linear-gradient(135deg,rgba(118,80,135,.10),rgba(63,127,146,.06)),
    rgba(255,255,255,.42)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .package-card.selected,
html[data-theme="light"] body.oracryn-public-v2 .payment-card.selected{
  background:
    linear-gradient(135deg,rgba(118,80,135,.16),rgba(63,127,146,.10)),
    rgba(255,255,255,.50)!important;
  border-color:color-mix(in srgb,var(--o4-accent) 55%,var(--o4-line))!important;
  box-shadow:0 10px 28px rgba(46,49,66,.10)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .package-amount,
html[data-theme="light"] body.oracryn-public-v2 .package-card strong,
html[data-theme="light"] body.oracryn-public-v2 .package-card.selected strong,
html[data-theme="light"] body.oracryn-public-v2 .payment-copy strong,
html[data-theme="light"] body.oracryn-public-v2 .payment-group-head strong{
  color:var(--o4-ink)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .package-badge{
  color:#573d61!important;
  border-color:rgba(118,80,135,.26)!important;
  background:rgba(118,80,135,.10)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .package-gem,
html[data-theme="light"] body.oracryn-public-v2 .payment-icon,
html[data-theme="light"] body.oracryn-public-v2 .arcana-eyebrow-gem,
html[data-theme="light"] body.oracryn-public-v2 .store-step span{
  color:var(--o4-accent)!important;
  border-color:rgba(118,80,135,.22)!important;
  background:rgba(118,80,135,.09)!important;
  text-shadow:none!important;
}

html[data-theme="light"] body.oracryn-public-v2 .payment-group{
  border-color:var(--o4-line)!important;
  background:transparent!important;
}

html[data-theme="light"] body.oracryn-public-v2 .preferred-payment-group{
  border-color:color-mix(in srgb,var(--o4-accent) 30%,var(--o4-line))!important;
  background:transparent!important;
}

html[data-theme="light"] body.oracryn-public-v2 .payment-overview>div,
html[data-theme="light"] body.oracryn-public-v2 .payment-detail-row,
html[data-theme="light"] body.oracryn-public-v2 .payment-address-block,
html[data-theme="light"] body.oracryn-public-v2 .paypal-action-block,
html[data-theme="light"] body.oracryn-public-v2 .proof-box{
  color:var(--o4-ink)!important;
  border-color:var(--o4-line)!important;
  background:rgba(255,255,255,.38)!important;
  box-shadow:none!important;
}

html[data-theme="light"] body.oracryn-public-v2 .payment-overview span,
html[data-theme="light"] body.oracryn-public-v2 .payment-detail-row span,
html[data-theme="light"] body.oracryn-public-v2 .payment-address-block>span,
html[data-theme="light"] body.oracryn-public-v2 .paypal-action-block>span{
  color:var(--o4-dim)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .payment-overview strong,
html[data-theme="light"] body.oracryn-public-v2 .payment-detail-row strong,
html[data-theme="light"] body.oracryn-public-v2 .paypal-action-block strong,
html[data-theme="light"] body.oracryn-public-v2 .proof-box strong{
  color:var(--o4-ink)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .address-line code{
  color:#1c1e27!important;
  border-color:var(--o4-line)!important;
  background:#e3e6eb!important;
}

html[data-theme="light"] body.oracryn-public-v2 .copy-button{
  color:#3f4250!important;
  border-color:var(--o4-line-strong)!important;
  background:rgba(255,255,255,.52)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .network-warning,
html[data-theme="light"] body.oracryn-public-v2 .paypal-warning{
  color:#5e5660!important;
  border-color:rgba(122,83,96,.16)!important;
  background:rgba(122,83,96,.06)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .network-warning strong{
  color:#593f47!important;
}

html[data-theme="light"] body.oracryn-public-v2 .proof-box p,
html[data-theme="light"] body.oracryn-public-v2 .payment-report-success p{
  color:var(--o4-muted)!important;
}

html[data-theme="light"] body.oracryn-public-v2 .ticket-button{
  color:#fff!important;
  border-color:#765087!important;
  background:linear-gradient(100deg,#765087,#536f86)!important;
}



/* ------------------------------------------------------------------ */
/* Canonical public mobile menu: mirror the hub dropdown exactly.      */
/* ------------------------------------------------------------------ */
@media(max-width:820px){
  body.oracryn-public-v2 .site-header .nav-links{
    width:min(290px,calc(100vw - 28px))!important;
    padding:5px!important;
    gap:0!important;
    border:1px solid var(--o4-line-strong)!important;
    background:var(--o4-header)!important;
    box-shadow:0 22px 55px rgba(0,0,0,.24)!important;
    -webkit-backdrop-filter:blur(18px)!important;
    backdrop-filter:blur(18px)!important;
  }

  body.oracryn-public-v2 .site-header .nav-links a{
    width:100%!important;
    min-height:42px!important;
    display:inline-flex!important;
    align-items:center!important;
    justify-content:flex-start!important;
    flex:0 0 auto!important;
    padding:0 12px!important;
    border:1px solid transparent!important;
    border-bottom-color:var(--o4-line)!important;
    color:var(--o4-muted)!important;
    font-family:"Manrope",Inter,ui-sans-serif,system-ui,sans-serif!important;
    font-size:11px!important;
    font-weight:800!important;
    line-height:1!important;
    letter-spacing:.095em!important;
    text-transform:uppercase!important;
    box-shadow:none!important;
    clip-path:none!important;
  }

  body.oracryn-public-v2 .site-header .nav-links a:last-child{
    border-bottom-color:transparent!important;
  }

  body.oracryn-public-v2 .site-header .nav-links a:hover{
    color:var(--o4-ink)!important;
    border-color:color-mix(in srgb,var(--o4-accent) 18%,var(--o4-line))!important;
    background:color-mix(in srgb,var(--o4-accent) 6%,transparent)!important;
  }

  body.oracryn-public-v2 .site-header .nav-links a[aria-current="page"]{
    color:var(--o4-ink)!important;
    border-color:var(--o4-nav-active-border)!important;
    background:var(--o4-nav-active)!important;
    box-shadow:none!important;
  }
}
