/*! * material-tokens.css — Material Design 2 (MUI) design tokens + Bootstrap/Metronic remap * Part of the acg-faka admin Material UI restyle (additive override layer). * * Load order: this file FIRST, then material.css. Theme is chosen via * set by the * inline FOUC guard (Header/Login ) and material.js. * * NOTE: never edit the vendor bundles (_admin.css / _.css / style.bundle.css / *.min.css). * All Material styling lives in material-*.css + material.js, added to BOTH css()/js() * arrays so it loads in dev (DEBUG=true) and prod (DEBUG=false) alike. */:root{--md-radius:8px;--md-radius-lg:12px;--md-radius-pill:9999px;--md-e0:none;--md-e1:0 2px 1px -1px rgba(0,0,0,.2),0 1px 1px 0 rgba(0,0,0,.14),0 1px 3px 0 rgba(0,0,0,.12);--md-e2:0 3px 1px -2px rgba(0,0,0,.2),0 2px 2px 0 rgba(0,0,0,.14),0 1px 5px 0 rgba(0,0,0,.12);--md-e3:0 3px 3px -2px rgba(0,0,0,.2),0 3px 4px 0 rgba(0,0,0,.14),0 1px 8px 0 rgba(0,0,0,.12);--md-e4:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12);--md-e6:0 3px 5px -1px rgba(0,0,0,.2),0 6px 10px 0 rgba(0,0,0,.14),0 1px 18px 0 rgba(0,0,0,.12);--md-e8:0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12);--md-e12:0 7px 8px -4px rgba(0,0,0,.2),0 12px 17px 2px rgba(0,0,0,.14),0 5px 22px 4px rgba(0,0,0,.12);--md-e16:0 8px 10px -5px rgba(0,0,0,.2),0 16px 24px 2px rgba(0,0,0,.14),0 6px 30px 5px rgba(0,0,0,.12);--md-e24:0 11px 15px -7px rgba(0,0,0,.2),0 24px 38px 3px rgba(0,0,0,.14),0 9px 46px 8px rgba(0,0,0,.12);--md-ease:cubic-bezier(.4, 0, .2, 1);--md-ease-out:cubic-bezier(0, 0, .2, 1);--md-dur:.2s;--md-dur-fast:.12s;--md-font:"HarmonyOS Sans SC","Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}:root[data-theme=light]{--md-primary:#1976D2;--md-primary-hover:#1565C0;--md-primary-container:#E3F2FD;--md-on-primary:#FFFFFF;--md-secondary:#9C27B0;--md-secondary-hover:#7B1FA2;--md-on-secondary:#FFFFFF;--md-success:#2E7D32;--md-warning:#ED6C02;--md-error:#D32F2F;--md-info:#0288D1;--md-bg:#F4F5F7;--md-surface:#FFFFFF;--md-surface-2:#FFFFFF;--md-on-surface:rgba(0,0,0,.87);--md-on-surface-med:rgba(0,0,0,.60);--md-on-surface-dis:rgba(0,0,0,.38);--md-divider:rgba(0,0,0,.12);--md-nav-fg:#4b5563;--md-nav-section:#6b7280;--md-nav-active-fg:#111827;--md-outline:rgba(0,0,0,.23);--md-hover-overlay:rgba(0,0,0,.04);--md-selected-overlay:rgba(25,118,210,.08);--md-focus-ring:rgba(25,118,210,.40);--md-scrim:rgba(0,0,0,.5);--md-primary-rgb:25,118,210;--md-secondary-rgb:156,39,176;--md-success-rgb:46,125,50;--md-warning-rgb:237,108,2;--md-error-rgb:211,47,47;--md-info-rgb:2,136,209;--md-e1:0 1px 2px rgba(16,24,40,.04),0 2px 8px -2px rgba(16,24,40,.06);--md-e2:0 1px 2px rgba(16,24,40,.04),0 4px 12px -2px rgba(16,24,40,.08);--md-e3:0 2px 4px -1px rgba(16,24,40,.05),0 6px 16px -3px rgba(16,24,40,.09);--md-e4:0 2px 5px -1px rgba(16,24,40,.05),0 10px 22px -4px rgba(16,24,40,.10);--md-e6:0 3px 6px -2px rgba(16,24,40,.06),0 14px 28px -6px rgba(16,24,40,.12);--md-e8:0 4px 8px -2px rgba(16,24,40,.07),0 18px 36px -8px rgba(16,24,40,.14);--md-e12:0 6px 12px -3px rgba(16,24,40,.08),0 26px 48px -10px rgba(16,24,40,.16);--md-e16:0 8px 16px -4px rgba(16,24,40,.09),0 34px 60px -12px rgba(16,24,40,.18);--md-e24:0 12px 22px -6px rgba(16,24,40,.10),0 48px 80px -16px rgba(16,24,40,.22);color-scheme:light}:root[data-theme=dark]{--md-primary:#90CAF9;--md-primary-hover:#64B5F6;--md-primary-container:#0D47A1;--md-on-primary:rgba(0,0,0,.87);--md-secondary:#CE93D8;--md-secondary-hover:#BA68C8;--md-on-secondary:rgba(0,0,0,.87);--md-success:#66BB6A;--md-warning:#FFA726;--md-error:#F44336;--md-info:#29B6F6;--md-bg:#0e1013;--md-surface:#1a1e24;--md-surface-2:#232830;--md-on-surface:rgba(255,255,255,.92);--md-on-surface-med:rgba(255,255,255,.60);--md-on-surface-dis:rgba(255,255,255,.38);--md-divider:rgba(255,255,255,.10);--md-outline:rgba(255,255,255,.22);--md-nav-fg:rgba(255,255,255,.72);--md-nav-section:rgba(255,255,255,.48);--md-nav-active-fg:#ffffff;--md-hover-overlay:rgba(255,255,255,.08);--md-selected-overlay:rgba(144,202,249,.16);--md-focus-ring:rgba(144,202,249,.50);--md-scrim:rgba(0,0,0,.7);--md-primary-rgb:144,202,249;--md-secondary-rgb:206,147,216;--md-success-rgb:102,187,106;--md-warning-rgb:255,167,38;--md-error-rgb:244,67,54;--md-info-rgb:41,182,246;--md-e1:0 1px 3px rgba(0,0,0,.3);--md-e2:0 2px 6px -1px rgba(0,0,0,.38);--md-e3:0 3px 8px -2px rgba(0,0,0,.42);--md-e4:0 4px 11px -3px rgba(0,0,0,.48);--md-e6:0 6px 15px -3px rgba(0,0,0,.52);--md-e8:0 8px 20px -4px rgba(0,0,0,.56);--md-e12:0 12px 26px -6px rgba(0,0,0,.6);--md-e16:0 16px 34px -8px rgba(0,0,0,.66);--md-e24:0 22px 46px -10px rgba(0,0,0,.72);color-scheme:dark}:root[data-theme]{--bs-primary:var(--md-primary);--bs-primary-active:var(--md-primary-hover);--bs-success:var(--md-success);--bs-info:var(--md-secondary);--bs-warning:var(--md-warning);--bs-danger:var(--md-error);--bs-primary-rgb:var(--md-primary-rgb);--bs-success-rgb:var(--md-success-rgb);--bs-info-rgb:var(--md-secondary-rgb);--bs-warning-rgb:var(--md-warning-rgb);--bs-danger-rgb:var(--md-error-rgb);--bs-body-bg:var(--md-bg);--bs-body-color:var(--md-on-surface);--bs-border-color:var(--md-divider);--bs-link-color:var(--md-primary);--bs-link-hover-color:var(--md-primary-hover);--bs-link-color-rgb:var(--md-primary-rgb)}:root[data-theme=dark]{--bs-white:#1E1E1E;--bs-white-rgb:30,30,30;--bs-body-bg:#121212;--bs-light:#2A2A2A;--bs-light-rgb:42,42,42;--bs-dark:#EDEDED;--bs-dark-rgb:237,237,237;--bs-gray-100:#2A2A2A;--bs-gray-200:#333333;--bs-gray-300:#3D3D3D;--bs-gray-400:#4D4D4D;--bs-gray-500:#6E6E6E;--bs-gray-600:#9E9E9E;--bs-gray-700:#BDBDBD;--bs-gray-800:#E0E0E0;--bs-gray-900:#F5F5F5}/*! * material-auth.css — Refined Material skin for the admin login (app/View/Admin/Authentication/Login.html). * Overrides the bespoke neon-glass `ay-*` styles (auth.css). Loaded after md-tokens.css + auth.css. * Theme comes from the FOUC guard (html[data-theme=light|dark]); every color is an --md-* token. * Markup/JS contract: #ay-form, #ay-captcha-img refresh, #ay-code (2FA), #ay-remember, #ay-eye, * #ay-theme (theme toggle), #ay-caps (CapsLock hint), .ay-ico leading icons, Turnstile slot/inline holder. */body.ay-bg{background-color:var(--md-bg);color:var(--md-on-surface);font-family:var(--md-font);min-height:100vh;min-height:100dvh;overflow-y:auto;overscroll-behavior-y:contain}.ay-dim{display:block;position:fixed;inset:0;pointer-events:none;background:rgba(244,245,247,.72);background:color-mix(in srgb,var(--md-bg) 74%,transparent);-webkit-backdrop-filter:blur(26px) saturate(118%);backdrop-filter:blur(26px) saturate(118%)}[data-theme=dark] .ay-dim{background:rgba(14,16,19,.82);background:color-mix(in srgb,var(--md-bg) 84%,transparent);-webkit-backdrop-filter:blur(26px) saturate(92%);backdrop-filter:blur(26px) saturate(92%)}.ay-petals{display:block}.ay-petals i{background:linear-gradient(135deg,#ffd9ea,#ffb3d5);opacity:.3;filter:none}.ay-petals i:nth-child(4n){opacity:.2}[data-theme=dark] .ay-petals i{background:linear-gradient(135deg,#3a4260,#4d5a82);opacity:.22}.ay-card{width:min(440px,92vw);margin-top:0;background:var(--md-surface)!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;border:1px solid var(--md-divider);border-radius:24px;box-shadow:0 1px 2px rgba(15,23,42,.05),0 24px 64px -24px rgba(15,23,42,.28);transform:none!important;transition:box-shadow .25s ease}[data-theme=dark] .ay-card{box-shadow:inset 0 1px 0 rgba(255,255,255,.04),0 28px 80px -28px rgba(0,0,0,.75)}.ay-card:hover{box-shadow:0 2px 4px rgba(15,23,42,.05),0 32px 80px -28px rgba(15,23,42,.34)}[data-theme=dark] .ay-card:hover{box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 32px 96px -28px rgba(0,0,0,.8)}.ay-card::before{content:"";position:absolute;top:0;left:24px;right:24px;bottom:auto;inset:0 24px auto 24px;height:2px;padding:0;border-radius:2px;-webkit-mask:none;mask:none;background:linear-gradient(90deg,transparent,rgba(25,118,210,.8),transparent);background:linear-gradient(90deg,transparent,color-mix(in srgb,var(--md-primary) 85%,transparent),transparent);opacity:.9}.ay-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;mix-blend-mode:normal;opacity:0;transition:opacity .3s ease;background:radial-gradient(300px 220px at var(--mx,50%) var(--my,50%),rgba(144,202,249,.07),transparent 65%)}[data-theme=dark] .ay-card:hover::after{opacity:1}.ay-theme{position:absolute;top:14px;right:14px;z-index:2;width:36px;height:36px;border:none;border-radius:50%;background:0 0;color:var(--md-on-surface-med);display:grid;place-items:center;cursor:pointer;transition:background-color .15s ease,color .15s ease,transform .15s ease}.ay-theme:hover{background:var(--md-hover-overlay);color:var(--md-on-surface)}.ay-theme:active{transform:scale(.92)}.ay-theme:focus-visible{outline:2px solid var(--md-primary);outline-offset:2px}.ay-theme .ico-sun{display:none}[data-theme=dark] .ay-theme .ico-sun{display:block}[data-theme=dark] .ay-theme .ico-moon{display:none}.ay-head{padding:32px 30px 6px;row-gap:6px}.ay-logo{width:60px;height:60px;box-shadow:0 0 0 1px var(--md-divider),0 10px 28px -10px rgba(25,118,210,.45);box-shadow:0 0 0 1px var(--md-divider),0 10px 28px -10px color-mix(in srgb,var(--md-primary) 45%,transparent)}.ay-title{color:var(--md-on-surface);font-size:20px;font-weight:650;letter-spacing:-.01em}.ay-sub{color:var(--md-on-surface-med);font-size:13px}.ay-body{padding:10px 30px 26px}.ay-field{margin:16px 0 20px}.ay-input{height:52px;padding:12px 44px 12px 14px;background:var(--md-hover-overlay);border:1px solid var(--md-outline);border-radius:14px;color:var(--md-on-surface);font-size:14.5px;transition:border-color .16s ease,box-shadow .16s ease,background-color .16s ease}.ay-field.has-ico .ay-input{padding-left:46px}.ay-input:hover{border-color:var(--md-on-surface-med)}.ay-input:focus{background:var(--md-surface);border-color:var(--md-primary);box-shadow:0 0 0 3px rgba(var(--md-primary-rgb,25,118,210),.16);transform:none}.ay-input:-webkit-autofill{-webkit-text-fill-color:var(--md-on-surface);-webkit-box-shadow:0 0 0 1000px var(--md-surface) inset;transition:background-color 99999s ease-in-out 0s}.ay-input[name=captcha],.ay-input[name=code]{font-variant-numeric:tabular-nums;letter-spacing:.08em}.ay-label{left:14px;top:50%;z-index:1;max-width:calc(100% - 20px);padding:0 4px;overflow:hidden;background:0 0;border:none;border-radius:0;color:var(--md-on-surface-med);font-size:13.5px;line-height:20px;text-overflow:ellipsis;white-space:nowrap;transform:translateY(-50%);transform-origin:left center;transition:top var(--md-dur-fast) var(--md-ease),left var(--md-dur-fast) var(--md-ease),font-size var(--md-dur-fast) var(--md-ease),color var(--md-dur-fast) var(--md-ease),background-color var(--md-dur-fast) var(--md-ease)}.ay-field.has-ico .ay-label{left:46px}.ay-input:is(:focus,:not(:placeholder-shown),:-webkit-autofill)+.ay-label{top:0;left:12px;font-size:12px;line-height:20px;color:var(--md-on-surface-med);background:var(--md-surface);border:none;border-radius:4px;padding:0 5px;transform:translateY(-50%)}.ay-input:focus+.ay-label{color:var(--md-primary)}.ay-ico{position:absolute;left:14px;top:50%;transform:translateY(-50%);display:grid;place-items:center;color:var(--md-on-surface-med);opacity:.75;pointer-events:none;transition:color .16s ease,opacity .16s ease}.ay-input:focus~.ay-ico{color:var(--md-primary);opacity:1}.ay-eye{width:38px;height:38px;right:7px;border:none;border-radius:50%;background:0 0;color:var(--md-on-surface-med);transition:background-color .15s ease,color .15s ease}.ay-eye:hover{background:var(--md-hover-overlay);color:var(--md-on-surface)}.ay-eye:focus-visible{outline:2px solid var(--md-primary);outline-offset:2px}.ay-eye svg{stroke:currentColor}.ay-eye .ay-eye-shut{display:none}.ay-input[type=text]~.ay-eye .ay-eye-shut{display:block}.ay-input[type=text]~.ay-eye .ay-eye-open{display:none}.ay-2fa.is-hidden{display:none}.ay-2fa.ay-reveal{animation:ay-up .45s cubic-bezier(.16,1,.3,1) both;animation-delay:0s!important}.ay-caps{display:block;margin:6px 2px 0;font-size:12px;line-height:1.5;color:var(--md-warning)}.ay-caps::before{content:"⇪ "}.ay-caps[hidden]{display:none}.ay-input[name=captcha]{padding-right:118px}.ay-captcha{height:38px;right:7px;border:1px solid var(--md-divider);border-radius:10px;user-select:none;transition:filter .15s ease,transform .15s ease}.ay-captcha:hover{filter:brightness(1.06);opacity:1}.ay-captcha:active{transform:translateY(-50%) scale(.96)}.ay-row{margin:0 0 16px}.ay-check{color:var(--md-on-surface-med);font-size:13px;position:relative;touch-action:manipulation;user-select:none;-webkit-user-select:none}.ay-check:hover{color:var(--md-on-surface)}.ay-check input{width:18px;height:18px;border:2px solid var(--md-on-surface-med);border-radius:5px;background:0 0;background-color:transparent!important;pointer-events:auto;transition:border-color .15s ease,background-color .15s ease}.ay-check input:hover{border-color:var(--md-on-surface);background:var(--md-hover-overlay)}.ay-check input:checked{background:var(--md-primary);background-color:var(--md-primary)!important;border-color:var(--md-primary)}.ay-check input:checked::after{color:var(--md-on-primary);line-height:1;pointer-events:none}.ay-check input:focus-visible{outline:2px solid var(--md-primary);outline-offset:2px}.ay-link{color:var(--md-primary);border-bottom:none;opacity:1;font-size:13px}.ay-link:hover{text-decoration:underline;text-underline-offset:3px}#turnstile-guard-inline,.turnstile-guard-slot{margin:4px 0 16px!important}.ay-btn{height:50px;border-radius:14px;color:var(--md-on-primary);font-size:15px;font-weight:600;letter-spacing:.02em;background:var(--md-primary);background:linear-gradient(135deg,var(--md-primary),color-mix(in srgb,var(--md-primary) 45%,#26c6da));box-shadow:0 12px 28px -12px rgba(var(--md-primary-rgb,25,118,210),.55);transition:transform .12s ease,box-shadow .2s ease,filter .2s ease}.ay-btn:hover{transform:translateY(-1px);filter:brightness(1.04);box-shadow:0 16px 34px -12px rgba(var(--md-primary-rgb,25,118,210),.65)}.ay-btn:active{transform:translateY(0) scale(.995)}.ay-btn:focus-visible{outline:2px solid var(--md-primary);outline-offset:3px}.ay-btn::after{display:block!important;background:linear-gradient(90deg,rgba(255,255,255,0) 0,rgba(255,255,255,.22) 50%,rgba(255,255,255,0) 100%)}.ay-btn[disabled]{pointer-events:none;filter:saturate(.85) brightness(.98);transform:none}.ay-btn[disabled]::before{content:"";display:inline-block;width:15px;height:15px;margin-right:9px;vertical-align:-2px;border:2px solid rgba(255,255,255,.45);border-top-color:#fff;border-radius:50%;animation:ay-spin .8s linear infinite}@keyframes ay-spin{to{transform:rotate(360deg)}}.ay-foot{margin:18px 0 0;padding-top:14px;border-top:1px solid var(--md-divider);color:var(--md-on-surface-med);font-size:12px;opacity:1}@media (prefers-reduced-motion:no-preference){.ay-card{animation:ay-in .5s cubic-bezier(.16,1,.3,1) both}.ay-btn,.ay-field,.ay-foot,.ay-head,.ay-row,.turnstile-guard-slot{animation:ay-up .55s cubic-bezier(.16,1,.3,1) both}.ay-head{animation-delay:.05s}.ay-field{animation-delay:.11s}.ay-row,.turnstile-guard-slot{animation-delay:.17s}.ay-btn{animation-delay:.22s}.ay-foot{animation-delay:.28s}}@keyframes ay-in{from{opacity:0;transform:translateY(14px) scale(.985)}to{opacity:1;transform:none}}@keyframes ay-up{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@media (max-width:991.98px){.ay-wrap{min-height:100vh;min-height:100dvh;place-items:start center;padding:max(16px,env(safe-area-inset-top)) max(14px,env(safe-area-inset-right)) max(20px,env(safe-area-inset-bottom)) max(14px,env(safe-area-inset-left));overflow:visible}.ay-card{width:min(100%,460px);margin:auto 0;border-radius:24px}.ay-head{padding:24px 18px 4px}.ay-body{padding:8px 18px 20px}.ay-field{margin:14px 0 18px}.ay-btn,.ay-input{min-height:48px;font-size:16px}.ay-eye{width:44px;height:44px;right:3px}.ay-theme{width:44px;height:44px;top:8px;right:8px}.ay-captcha{min-width:92px;height:40px;right:4px}.ay-check,.ay-link{min-height:44px;display:inline-flex;align-items:center}.ay-check input{width:22px;height:22px;flex:0 0 22px}}@media (max-width:430px),(max-height:720px){.ay-wrap{padding-top:max(10px,env(safe-area-inset-top))}.ay-card{margin:0;border-radius:20px}.ay-logo{width:50px;height:50px}.ay-head{padding-top:16px;row-gap:4px}.ay-body{padding-top:6px}.ay-field{margin:12px 0 16px}.ay-row{align-items:flex-start;margin-bottom:12px}}@media (prefers-reduced-motion:reduce){.ay-btn,.ay-card,.ay-input,.ay-label,.ay-theme{transition:none!important;animation:none!important}.ay-field,.ay-foot,.ay-head,.ay-row,.turnstile-guard-slot{animation:none!important}.ay-btn::after{display:none!important}.ay-petals{display:none}}