/* Animal King Design System v9 — theme-native, mobile-first */
:root{
 --ak-radius-xs:6px;--ak-radius-sm:9px;--ak-radius-md:13px;--ak-radius-lg:18px;
 --ak-ease:cubic-bezier(.2,.8,.2,1);--ak-fast:160ms;--ak-normal:260ms;
 --ak-surface-glass:color-mix(in srgb,var(--ak-surface,#fff) 88%,transparent);
 --ak-surface-soft:color-mix(in srgb,var(--ak-surface,#fff) 82%,var(--ak-primary,#17633f) 18%);
 --ak-surface-muted:color-mix(in srgb,var(--ak-surface,#fff) 92%,var(--ak-accent,#d6a526) 8%);
 --ak-focus:color-mix(in srgb,var(--ak-primary,#17633f) 28%,transparent);
 --ak-shadow-sm:0 6px 18px rgba(15,23,42,.10);--ak-shadow-md:0 16px 42px rgba(15,23,42,.16);
}
html[data-ak-theme] *{box-sizing:border-box}
html[data-ak-theme] :is(button,.btn,input,select,textarea,.card,.alert,.badge,.modal-content){font-family:var(--ak-theme-font)!important}
html[data-ak-theme] :is(.card,.info-box,.notice,.closed-box,.payment-panel,.ak-checkout-box,.ak-card-fields-panel,.prize-card,.result-card,.search-card){
 border:1px solid var(--ak-border)!important;border-radius:var(--ak-radius-md)!important;background:linear-gradient(145deg,var(--ak-surface-glass),var(--ak-surface-strong))!important;color:var(--ak-text)!important;box-shadow:var(--ak-shadow-sm)!important
}
html[data-ak-theme] :is(.btn,button,input[type=submit],input[type=button],.ak-action-btn,.ak-mobile-pay-button){
 border-radius:var(--ak-radius-sm)!important;transition:filter var(--ak-fast) var(--ak-ease),box-shadow var(--ak-fast) var(--ak-ease),transform var(--ak-fast) var(--ak-ease)!important
}
html[data-ak-theme] :is(.btn,button,input[type=submit],input[type=button],.ak-action-btn):hover{filter:brightness(1.07);transform:translateY(-1px)}
html[data-ak-theme] :is(.btn,button,input[type=submit],input[type=button],.ak-action-btn):active{transform:translateY(0);filter:brightness(.98)}
html[data-ak-theme] :is(input[type=text],input[type=email],input[type=password],input[type=tel],input[type=number],select,textarea,.form-control){
 border:1px solid color-mix(in srgb,var(--ak-primary) 35%,#cbd5e1)!important;border-radius:var(--ak-radius-sm)!important;background:color-mix(in srgb,var(--ak-surface-strong) 96%,var(--ak-accent) 4%)!important;color:var(--ak-text)!important;box-shadow:inset 0 1px 2px rgba(15,23,42,.04)!important
}
html[data-ak-theme] :is(input,select,textarea,.form-control):focus{outline:0!important;border-color:var(--ak-primary)!important;box-shadow:0 0 0 4px var(--ak-focus)!important}
html[data-ak-theme] :is(.badge,.eyebrow,.chip,.ak-status-pill){border-radius:999px!important;background:var(--ak-soft)!important;color:var(--ak-chip-text)!important;border:1px solid var(--ak-border)!important}
html[data-ak-theme] :is(.alert,.ak-payment-warning,.ak-wallet-note,.ak-card-fields-note,.helper-box){border-radius:var(--ak-radius-sm)!important}

/* Theme-native payment card */
html[data-ak-theme] .payment-panel.ak-checkout-card{
 background:linear-gradient(145deg,var(--ak-surface-glass),color-mix(in srgb,var(--ak-surface-strong) 88%,var(--ak-primary) 12%))!important;
 border:1px solid var(--ak-border)!important;color:var(--ak-text)!important;box-shadow:var(--ak-shadow-md)!important;border-radius:var(--ak-radius-lg)!important
}
html[data-ak-theme] .payment-panel.ak-checkout-card::before{background:linear-gradient(135deg,color-mix(in srgb,var(--ak-primary) 9%,transparent),transparent 52%,color-mix(in srgb,var(--ak-accent) 13%,transparent))!important}
html[data-ak-theme] .payment-panel.ak-checkout-card :is(.ak-checkout-box,.ak-card-fields-panel,.ak-wallet-option,.ak-security-description,.ak-wallet-note,.ak-card-fields-note){
 background:var(--ak-surface-muted)!important;border:1px solid var(--ak-border)!important;color:var(--ak-text)!important;box-shadow:var(--ak-shadow-sm)!important;border-radius:var(--ak-radius-md)!important
}
html[data-ak-theme] .payment-panel.ak-checkout-card :is(h2,h3,h4,label,strong,.ak-wallet-label,.ak-payment-amount){color:var(--ak-text)!important}
html[data-ak-theme] .payment-panel.ak-checkout-card :is(p,small,.ak-checkout-heading p){color:var(--ak-muted)!important}
html[data-ak-theme] .payment-panel.ak-checkout-card .ak-security-description{background:color-mix(in srgb,var(--ak-primary) 8%,var(--ak-surface-strong))!important;color:var(--ak-muted)!important}
html[data-ak-theme] .payment-panel.ak-checkout-card :is(.ak-card-pay-button,.ak-card-inline-button){background:linear-gradient(135deg,var(--ak-primary),var(--ak-primary-dark))!important;color:var(--ak-button-text)!important;border:1px solid color-mix(in srgb,var(--ak-accent) 55%,var(--ak-primary))!important;box-shadow:0 10px 24px color-mix(in srgb,var(--ak-primary) 25%,transparent)!important}
html[data-ak-theme] .payment-panel.ak-checkout-card .ak-payment-icon{background:linear-gradient(135deg,var(--ak-accent),color-mix(in srgb,var(--ak-accent) 65%,#fff))!important;color:var(--ak-primary-dark)!important;border-color:color-mix(in srgb,var(--ak-accent) 75%,var(--ak-primary))!important}

/* Unified modals — identical visual language of selected theme */
html[data-ak-theme] .ak-action-modal-overlay{padding:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom))!important;background:rgba(8,15,24,.55)!important;backdrop-filter:blur(9px) saturate(.9)!important}
html[data-ak-theme] .ak-action-modal-box{max-height:calc(100dvh - max(24px,env(safe-area-inset-top) + env(safe-area-inset-bottom)))!important;border:1px solid var(--ak-border)!important;border-radius:var(--ak-radius-lg)!important;background:var(--ak-surface-strong)!important;box-shadow:0 28px 90px rgba(15,23,42,.32)!important;animation:akModalIn .24s var(--ak-ease) both}
html[data-ak-theme] .ak-action-modal-head{flex:0 0 auto!important;min-height:58px!important;height:auto!important;padding:10px 12px 10px 18px!important;background:linear-gradient(135deg,var(--ak-primary-dark),var(--ak-primary),var(--ak-secondary))!important;border-bottom:1px solid color-mix(in srgb,var(--ak-accent) 55%,transparent)!important;color:var(--ak-header-text)!important;position:sticky!important;top:0!important;z-index:20!important}
html[data-ak-theme] .ak-action-modal-title{color:var(--ak-header-text)!important}
html[data-ak-theme] .ak-action-modal-close{flex:0 0 40px!important;width:40px!important;height:40px!important;border-radius:var(--ak-radius-sm)!important;background:rgba(255,255,255,.16)!important;border:1px solid rgba(255,255,255,.30)!important;color:#fff!important}
html[data-ak-theme] .ak-action-modal-close:hover{background:rgba(255,255,255,.28)!important}
html[data-ak-theme] :is(.ak-action-modal-body,.ak-action-modal-frame,.ak-action-modal-content,.ak-password-modal-panel){background:linear-gradient(var(--ak-bg-overlay),var(--ak-bg-overlay)),var(--ak-bg-image)!important;background-size:cover!important;background-position:center!important;color:var(--ak-text)!important}
html[data-ak-theme] .ak-action-modal-body{overflow:auto!important;min-height:0!important}
html[data-ak-theme] .ak-action-modal-content :is(.page-shell,.content,.content-area,section,.hero,.search-card,.prize-card,.result-card,.ak-password-card){color:var(--ak-text)!important}
html[data-ak-theme] .ak-action-modal-content :is(h1,h2,h3,h4,p,label,span,strong){color:inherit}
html[data-ak-theme] .ak-action-modal-content :is(.hero,.page-header){background:linear-gradient(135deg,var(--ak-primary-dark),var(--ak-primary),var(--ak-secondary))!important;color:var(--ak-header-text)!important;border:1px solid color-mix(in srgb,var(--ak-accent) 50%,transparent)!important}
html[data-ak-theme] .ak-action-modal-content :is(.prize-card,.search-card,.result-card,form){background:var(--ak-surface-glass)!important;color:var(--ak-text)!important;border-color:var(--ak-border)!important}
html[data-ak-theme] .ak-action-modal-content :is(.btn-primary,button[type=submit],input[type=submit]){background:linear-gradient(135deg,var(--ak-primary),var(--ak-primary-dark))!important;color:#fff!important;border-color:var(--ak-accent)!important}

/* Premium board states */
html[data-ak-theme] #ak-number-grid.grid-panel{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}
html[data-ak-theme] #ak-number-grid table.table1{border:9px solid var(--ak-accent)!important;border-radius:var(--ak-radius-md)!important;background:linear-gradient(145deg,color-mix(in srgb,var(--ak-primary-dark) 92%,#fff 8%),color-mix(in srgb,var(--ak-primary) 72%,#10202a 28%))!important;box-shadow:0 18px 38px rgba(15,23,42,.24),inset 0 0 0 2px rgba(255,255,255,.18)!important}
html[data-ak-theme] #ak-number-grid table.table1 td{border-radius:var(--ak-radius-sm)!important;background:color-mix(in srgb,var(--ak-surface-strong) 24%,var(--ak-primary-dark) 76%)!important;border:1px solid rgba(255,255,255,.18)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.12)!important}
html[data-ak-theme] #ak-number-grid :is(.button,.button2){border-radius:var(--ak-radius-xs)!important;box-shadow:0 4px 0 rgba(0,0,0,.26),0 7px 14px rgba(0,0,0,.16),inset 0 1px 0 rgba(255,255,255,.28)!important;transition:transform var(--ak-fast) var(--ak-ease),filter var(--ak-fast) var(--ak-ease),box-shadow var(--ak-fast) var(--ak-ease)!important}
html[data-ak-theme] #ak-number-grid .button{background:linear-gradient(180deg,color-mix(in srgb,#08b879 88%,var(--ak-primary) 12%),color-mix(in srgb,#049b68 82%,var(--ak-primary-dark) 18%))!important}
html[data-ak-theme] #ak-number-grid .button2{background:linear-gradient(180deg,#ff504f,#d92d36)!important}
html[data-ak-theme] #ak-number-grid :is(.button,.button2):hover{transform:translateY(-2px)!important;filter:brightness(1.08)!important;box-shadow:0 6px 0 rgba(0,0,0,.24),0 12px 20px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.35)!important}
html[data-ak-theme] #ak-number-grid :is(.button,.button2):active{transform:translateY(2px)!important;box-shadow:0 2px 0 rgba(0,0,0,.25),0 5px 10px rgba(0,0,0,.15)!important}

/* Feedback and motion */
html[data-ak-theme] :is(.alert,.toast,.ak-payment-message){animation:akFadeUp .25s var(--ak-ease) both}
@keyframes akModalIn{from{opacity:0;transform:translateY(12px) scale(.985)}to{opacity:1;transform:none}}
@keyframes akFadeUp{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){html[data-ak-theme] *,html[data-ak-theme] *::before,html[data-ak-theme] *::after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media(max-width:700px){
 html[data-ak-theme] .ak-action-modal-overlay{align-items:stretch!important;padding:max(6px,env(safe-area-inset-top)) 6px max(6px,env(safe-area-inset-bottom))!important}
 html[data-ak-theme] .ak-action-modal-box{width:100%!important;height:100%!important;max-height:100%!important;border-radius:var(--ak-radius-md)!important}
 html[data-ak-theme] .ak-action-modal-head{min-height:56px!important}
 html[data-ak-theme] .content-area{padding:10px!important;gap:12px!important}
 html[data-ak-theme] .payment-panel.ak-checkout-card{border-radius:var(--ak-radius-md)!important;padding:12px!important}
}

/* v10 — modal header title contrast fix
   The modal header always uses a saturated theme gradient, therefore its
   heading and close control must remain high-contrast regardless of legacy
   Bootstrap/page heading rules or the value of --ak-header-text. */
.ak-action-modal-head,
html[data-ak-theme] .ak-action-modal-head {
  color:#fff !important;
}
.ak-action-modal-head .ak-action-modal-title,
.ak-action-modal-head #akActionModalTitle,
html[data-ak-theme] .ak-action-modal-head .ak-action-modal-title,
html[data-ak-theme] .ak-action-modal-head #akActionModalTitle {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
  opacity:1 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.28) !important;
}
.ak-action-modal-head .ak-action-modal-close,
html[data-ak-theme] .ak-action-modal-head .ak-action-modal-close {
  color:#fff !important;
  -webkit-text-fill-color:#fff !important;
}

/* v11 — definitive modal contrast, iconography and responsive polish */
html body .ak-action-modal-box .ak-action-modal-head,
html[data-ak-theme] body .ak-action-modal-box .ak-action-modal-head{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
html body .ak-action-modal-box .ak-action-modal-head > .ak-action-modal-title,
html body .ak-action-modal-box .ak-action-modal-head > #akActionModalTitle,
html[data-ak-theme] body .ak-action-modal-box .ak-action-modal-head > .ak-action-modal-title,
html[data-ak-theme] body .ak-action-modal-box .ak-action-modal-head > #akActionModalTitle{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
  opacity:1!important;
  font-weight:900!important;
  text-shadow:0 1px 3px rgba(0,0,0,.38)!important;
}
html[data-ak-theme] .ak-ui-icon,
html[data-ak-theme] .ak-action-icon{
  display:inline-grid!important;place-items:center!important;width:1.65em!important;height:1.65em!important;
  border-radius:7px!important;background:color-mix(in srgb,var(--ak-accent) 24%,rgba(255,255,255,.12))!important;
  color:currentColor!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.22)!important;
}
html[data-ak-theme] :is(.ak-action-btn,.btn,button)[data-ak-icon-ready="1"]{gap:.58rem!important;align-items:center!important}
html[data-ak-theme] :is(.ak-action-btn,.btn,button):focus-visible{outline:0!important;box-shadow:0 0 0 4px color-mix(in srgb,var(--ak-accent) 38%,transparent),var(--ak-shadow-sm)!important}
html[data-ak-theme] .ak-action-modal-content{scrollbar-color:var(--ak-primary) color-mix(in srgb,var(--ak-surface) 90%,transparent);scrollbar-width:thin}
html[data-ak-theme] .ak-action-modal-content::-webkit-scrollbar{width:10px}
html[data-ak-theme] .ak-action-modal-content::-webkit-scrollbar-thumb{background:linear-gradient(var(--ak-primary),var(--ak-primary-dark));border:2px solid var(--ak-surface);border-radius:8px}
@media(max-width:700px){
 html[data-ak-theme] .ak-action-modal-head{padding-top:max(10px,env(safe-area-inset-top))!important}
 html[data-ak-theme] .ak-action-modal-content :is(.btn,button,input[type=submit]){min-height:46px}
 html[data-ak-theme] .ak-action-modal-content .modal-footer,
 html[data-ak-theme] .ak-action-modal-content .actions{position:sticky;bottom:0;z-index:8;background:color-mix(in srgb,var(--ak-surface-strong) 94%,transparent);backdrop-filter:blur(10px);padding-bottom:max(10px,env(safe-area-inset-bottom))}
}
