/*
 * Utility & Recovery Experience v1 — 2026-09-19
 * Modern-only polish for account recovery, payment result, legal utility,
 * service status and offline recovery surfaces.
 * No payment, account, privacy-request or gameplay logic is changed here.
 */

:root[data-ui-mode="modern"]{
  --ur-bg:#0b0714;
  --ur-panel:rgba(24,14,40,.94);
  --ur-panel-soft:rgba(255,255,255,.035);
  --ur-line:rgba(255,255,255,.10);
  --ur-line-strong:rgba(246,200,95,.26);
  --ur-text:#fff;
  --ur-muted:#c8bdd2;
  --ur-gold:#f6c85f;
  --ur-violet:#9b66f6;
  --ur-mint:#68dfcf;
  --ur-danger:#ff8297;
  --ur-shadow:0 28px 80px rgba(0,0,0,.30);
}

:root[data-ui-mode="modern"] body:is(
  .utility-payment-result,
  .utility-legal,
  .fbrkh-status-page,
  .utility-offline
){
  color:var(--ur-text);
  background:
    radial-gradient(circle at 86% -6%,rgba(155,102,246,.16),transparent 28rem),
    radial-gradient(circle at 8% 100%,rgba(246,200,95,.07),transparent 22rem),
    linear-gradient(180deg,#0c0715 0%,#0f091b 56%,#090610 100%)!important;
}

:root[data-ui-mode="modern"] body.utility-legal,
:root[data-ui-mode="modern"] body.fbrkh-status-page,
:root[data-ui-mode="modern"] body.utility-payment-result{
  min-height:100svh;
}

/* Shared approved brand treatment */
:root[data-ui-mode="modern"] :is(
  .utility-payment-result .brand,
  .fbrkh-status-page .status-brand,
  .utility-offline .utility-offline-brand,
  .account-reset-page .reset-brand
){
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:18px;
  transition:transform .18s ease,background .18s ease;
}
:root[data-ui-mode="modern"] :is(
  .utility-payment-result .brand,
  .fbrkh-status-page .status-brand,
  .utility-offline .utility-offline-brand,
  .account-reset-page .reset-brand
):hover{
  transform:translateY(-1px);
}

/* Account reset */
:root[data-ui-mode="modern"] body.account-reset-page .reset-shell{
  width:min(100%,760px);
  margin-inline:auto;
  padding:clamp(22px,5vw,46px) 18px;
}
:root[data-ui-mode="modern"] body.account-reset-page .reset-card{
  position:relative;
  overflow:hidden;
  padding:clamp(24px,5vw,42px)!important;
  border:1px solid var(--ur-line)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 86% 4%,rgba(155,102,246,.16),transparent 20rem),
    linear-gradient(150deg,rgba(35,19,57,.97),rgba(15,9,27,.98))!important;
  box-shadow:var(--ur-shadow)!important;
}
:root[data-ui-mode="modern"] body.account-reset-page .reset-kicker{
  color:var(--ur-gold)!important;
  font-weight:900;
}
:root[data-ui-mode="modern"] body.account-reset-page .reset-card h1{
  margin:.28em 0 .2em;
  font-size:clamp(32px,6vw,50px)!important;
  line-height:1.08;
  letter-spacing:-.035em;
}
:root[data-ui-mode="modern"] body.account-reset-page .reset-card>p{
  color:var(--ur-muted)!important;
  line-height:1.85;
}
:root[data-ui-mode="modern"] body.account-reset-page #resetForm{
  display:grid;
  gap:14px;
  margin-block:24px 14px;
}
:root[data-ui-mode="modern"] body.account-reset-page #resetForm label{
  display:grid;
  gap:8px;
  color:#f1eaf6;
  font-weight:800;
}
:root[data-ui-mode="modern"] body.account-reset-page #resetForm input{
  min-height:52px;
  border:1px solid var(--ur-line)!important;
  border-radius:15px!important;
  background:rgba(255,255,255,.045)!important;
  color:#fff!important;
}
:root[data-ui-mode="modern"] body.account-reset-page #resetForm input:focus{
  border-color:rgba(155,102,246,.65)!important;
  box-shadow:0 0 0 4px rgba(155,102,246,.13)!important;
}
:root[data-ui-mode="modern"] body.account-reset-page .reset-status:not(:empty){
  padding:12px 14px;
  border:1px solid var(--ur-line);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}

/* Payment result */
:root[data-ui-mode="modern"] body.utility-payment-result .topbar{
  width:min(1120px,calc(100% - 32px));
  margin:0 auto;
  padding-top:max(14px,env(safe-area-inset-top));
  background:transparent!important;
  border:0!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result .topbar .brand img{
  width:min(180px,46vw);
  height:auto;
}
:root[data-ui-mode="modern"] body.utility-payment-result .checkout-shell{
  width:min(100%,840px)!important;
  margin-inline:auto!important;
  padding:clamp(14px,4vw,36px) 18px max(34px,env(safe-area-inset-bottom))!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-card{
  position:relative;
  overflow:hidden;
  padding:clamp(24px,5vw,44px)!important;
  border:1px solid var(--ur-line)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 80% 0,rgba(155,102,246,.16),transparent 22rem),
    linear-gradient(150deg,rgba(34,18,57,.97),rgba(14,8,26,.98))!important;
  box-shadow:var(--ur-shadow)!important;
  text-align:center;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-card[data-result-state="success"]{
  border-color:rgba(104,223,207,.30)!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-card[data-result-state="failed"]{
  border-color:rgba(255,130,151,.30)!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-icon{
  display:grid;
  place-items:center;
  width:72px;
  height:72px;
  margin:0 auto 12px;
  border:1px solid var(--ur-line);
  border-radius:22px;
  background:rgba(255,255,255,.045);
  font-size:30px;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-card .eyebrow{
  color:var(--ur-gold)!important;
  font-weight:900;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-card h1{
  font-size:clamp(31px,5vw,50px)!important;
  letter-spacing:-.035em;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-card>p{
  color:var(--ur-muted)!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result .payment-receipt{
  margin:22px auto 0;
  overflow:hidden;
  border:1px solid var(--ur-line)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.025)!important;
  text-align:start;
}
:root[data-ui-mode="modern"] body.utility-payment-result .payment-receipt-row{
  min-height:54px;
  padding:12px 16px!important;
  border-color:rgba(255,255,255,.07)!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-gift-card{
  margin-top:18px;
  border:1px solid var(--ur-line-strong)!important;
  border-radius:22px!important;
  background:
    radial-gradient(circle at 80% 0,rgba(246,200,95,.12),transparent 16rem),
    rgba(255,255,255,.03)!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-gift-code{
  border-radius:14px!important;
  background:rgba(6,4,14,.42)!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result :is(.result-success-actions,.result-gift-actions){
  gap:9px!important;
}
:root[data-ui-mode="modern"] body.utility-payment-result .result-link{
  min-height:46px;
  border-radius:14px!important;
}

/* Legal utility pages */
:root[data-ui-mode="modern"] body.utility-legal [data-fbrkh-site-header]{
  position:relative;
  z-index:20;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-shell{
  width:min(1040px,calc(100% - 32px))!important;
  margin:clamp(18px,4vw,42px) auto max(42px,env(safe-area-inset-bottom))!important;
  display:grid;
  gap:14px;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-hero{
  position:relative;
  overflow:hidden;
  padding:clamp(26px,5vw,46px)!important;
  border:1px solid var(--ur-line)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 86% 2%,rgba(155,102,246,.15),transparent 22rem),
    radial-gradient(circle at 8% 100%,rgba(246,200,95,.07),transparent 18rem),
    linear-gradient(150deg,rgba(34,18,57,.97),rgba(14,8,26,.98))!important;
  box-shadow:var(--ur-shadow)!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-hero>span{
  color:var(--ur-gold)!important;
  font-weight:900!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-hero h1{
  margin:.28em 0 .18em!important;
  font-size:clamp(34px,5.5vw,56px)!important;
  line-height:1.08!important;
  letter-spacing:-.04em!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-hero p{
  max-width:760px;
  color:var(--ur-muted)!important;
  line-height:1.9!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-section{
  padding:clamp(20px,3.5vw,30px)!important;
  border:1px solid var(--ur-line)!important;
  border-radius:22px!important;
  background:linear-gradient(150deg,rgba(255,255,255,.045),rgba(255,255,255,.018))!important;
  box-shadow:none!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-section h2{
  margin-top:0!important;
  color:#fff!important;
  font-size:clamp(21px,3vw,28px)!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-section :is(p,li){
  color:var(--ur-muted)!important;
  line-height:1.95!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-section a:not(.legal-button){
  color:#dfc8ff!important;
  text-decoration-thickness:1px;
  text-underline-offset:4px;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-button{
  min-height:48px!important;
  border-radius:14px!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-form{
  display:grid;
  gap:14px!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-form label{
  display:grid;
  gap:8px;
  color:#f1eaf6;
  font-weight:800;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-form :is(select,textarea){
  width:100%;
  border:1px solid var(--ur-line)!important;
  border-radius:14px!important;
  background:rgba(255,255,255,.04)!important;
  color:#fff!important;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-form textarea{
  min-height:130px;
  resize:vertical;
}
:root[data-ui-mode="modern"] body.utility-legal .legal-status:not(:empty){
  padding:12px 14px;
  border:1px solid var(--ur-line);
  border-radius:14px;
  background:rgba(255,255,255,.035);
}

/* Status */
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-shell{
  width:min(860px,calc(100% - 32px))!important;
  min-height:100svh;
  margin-inline:auto;
  padding:max(22px,env(safe-area-inset-top)) 0 max(34px,env(safe-area-inset-bottom))!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-brand img{
  width:min(180px,48vw)!important;
  height:auto!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-hero{
  margin-top:24px;
  padding:clamp(26px,5vw,44px)!important;
  border:1px solid var(--ur-line)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 50% 0,rgba(155,102,246,.15),transparent 22rem),
    linear-gradient(150deg,rgba(34,18,57,.97),rgba(14,8,26,.98))!important;
  box-shadow:var(--ur-shadow)!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-hero h1{
  font-size:clamp(31px,5vw,50px)!important;
  letter-spacing:-.035em;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-hero p,
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-note{
  color:var(--ur-muted)!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-grid{
  gap:10px!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-card{
  min-height:108px;
  border:1px solid var(--ur-line)!important;
  border-radius:20px!important;
  background:rgba(255,255,255,.035)!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-card[data-health="ok"]{
  border-color:rgba(104,223,207,.26)!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-card[data-health="down"]{
  border-color:rgba(255,130,151,.30)!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-actions{
  gap:9px!important;
}
:root[data-ui-mode="modern"] body.fbrkh-status-page .status-actions a{
  min-height:48px!important;
  border-radius:14px!important;
}

/* Offline recovery */
:root[data-ui-mode="modern"] body.utility-offline{
  min-height:100svh;
  padding:max(24px,env(safe-area-inset-top)) max(18px,env(safe-area-inset-right)) max(24px,env(safe-area-inset-bottom)) max(18px,env(safe-area-inset-left))!important;
}
:root[data-ui-mode="modern"] body.utility-offline .card{
  position:relative;
  overflow:hidden;
  width:min(100%,600px)!important;
  padding:clamp(26px,6vw,44px)!important;
  border:1px solid var(--ur-line)!important;
  border-radius:30px!important;
  background:
    radial-gradient(circle at 80% 0,rgba(155,102,246,.16),transparent 20rem),
    radial-gradient(circle at 10% 100%,rgba(246,200,95,.08),transparent 16rem),
    linear-gradient(150deg,rgba(34,18,57,.97),rgba(14,8,26,.98))!important;
  box-shadow:var(--ur-shadow)!important;
}
:root[data-ui-mode="modern"] body.utility-offline .card h1{
  font-size:clamp(32px,7vw,52px)!important;
  letter-spacing:-.035em;
}
:root[data-ui-mode="modern"] body.utility-offline .card p{
  color:var(--ur-muted)!important;
  line-height:1.9!important;
}
:root[data-ui-mode="modern"] body.utility-offline .card button{
  min-height:50px!important;
  border-radius:15px!important;
  background:linear-gradient(135deg,var(--ur-gold),#ffd978)!important;
  color:#251700!important;
  box-shadow:0 14px 34px rgba(246,200,95,.14)!important;
}

@media(max-width:640px){
  :root[data-ui-mode="modern"] body.utility-payment-result .checkout-shell,
  :root[data-ui-mode="modern"] body.account-reset-page .reset-shell{
    padding-inline:12px!important;
  }
  :root[data-ui-mode="modern"] body.utility-payment-result .result-card,
  :root[data-ui-mode="modern"] body.account-reset-page .reset-card,
  :root[data-ui-mode="modern"] body.utility-legal .legal-hero,
  :root[data-ui-mode="modern"] body.fbrkh-status-page .status-hero,
  :root[data-ui-mode="modern"] body.utility-offline .card{
    border-radius:22px!important;
    padding:20px!important;
  }
  :root[data-ui-mode="modern"] body.utility-legal .legal-shell,
  :root[data-ui-mode="modern"] body.fbrkh-status-page .status-shell{
    width:min(100% - 20px,1040px)!important;
  }
  :root[data-ui-mode="modern"] body.utility-legal .legal-section{
    padding:18px!important;
    border-radius:18px!important;
  }
  :root[data-ui-mode="modern"] body.utility-payment-result :is(.result-success-actions,.result-gift-actions),
  :root[data-ui-mode="modern"] body.fbrkh-status-page .status-actions{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
}
