
html[data-theme=dark]{color-scheme:dark}html[data-theme=light]{color-scheme:light}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:8px;flex-shrink:0;min-height:40px;padding:8px 12px;border:1px solid #394049;border-radius:8px;background:#1c2025;color:#e7e9ed;font:500 12px/1.4 "Segoe UI",sans-serif;cursor:pointer;white-space:nowrap}
.theme-toggle svg{width:17px;height:17px}.theme-toggle:hover{border-color:#747d88}.theme-toggle:focus-visible{outline:3px solid #ff861780;outline-offset:3px}
html[data-theme=light] .theme-toggle{background:#fff;color:#343a42;border-color:#d7dce2}
.login-card>.theme-toggle{justify-self:end}.top .theme-toggle{align-self:center}
html[data-surface=checkout][data-theme=dark]{--paper:#101214;--soft:#191c20;--ink:#f0f2f4;--muted:#a1a8b2;--line:#30353c}
html[data-surface=checkout][data-theme=dark] body{background:#101214;color:var(--ink)}
html[data-surface=checkout][data-theme=dark] .benefits li,html[data-surface=checkout][data-theme=dark] .method-icon,html[data-surface=checkout][data-theme=dark] .benefits .icon,html[data-surface=checkout][data-theme=dark] .support a{color:#b9c0c9}
html[data-surface=checkout][data-theme=dark] .method{background:#171a1e;border-color:#343a43}
html[data-surface=checkout][data-theme=dark] .method:hover{background:#20242a;border-color:#737d8a}
html[data-surface=checkout][data-theme=dark] .method.selected{background:#23272d;border-color:#bdc5ce;box-shadow:0 0 0 .5px #bdc5ce}
html[data-surface=checkout][data-theme=dark] .radio-dot{border-color:#6a7480}
html[data-surface=checkout][data-theme=dark] .selected .radio-dot{background:#eceff3;border-color:#eceff3}
html[data-surface=checkout][data-theme=dark] .selected .radio-dot:after{background:#1c2026}
html[data-surface=checkout][data-theme=dark] .primary{background:#eef0f3;color:#16191d}
html[data-surface=checkout][data-theme=dark] .primary:hover{background:#dce0e6}
html[data-surface=checkout][data-theme=dark] .secondary{background:#191d22;color:#e3e7ed;border-color:#3b434e}
html[data-surface=checkout][data-theme=dark] .secondary:hover{background:#252b33}
html[data-surface=checkout][data-theme=dark] .avatar{background:#292e36;border-color:#3b424c;color:#c1c7d0}
html[data-surface=checkout][data-theme=dark] .consent,html[data-surface=checkout][data-theme=dark] .consent strong,html[data-surface=checkout][data-theme=dark] .text-button,html[data-surface=checkout][data-theme=dark] .step>span:first-child{color:#b5beca}
html[data-surface=checkout][data-theme=dark] .consent input{accent-color:#e6eaf0}
html[data-surface=checkout][data-theme=dark] .notice{background:#20252c;color:#c1c8d1}
html[data-surface=checkout][data-theme=dark] .notice.error{background:#361f23;border-color:#653238;color:#ffb5ba}
html[data-surface=checkout][data-theme=dark] .notice.success{background:#182f26;border-color:#315f48;color:#a1e2bd}
html[data-surface=checkout][data-theme=dark] .google-linked{color:#96d8b0}
html[data-surface=checkout][data-theme=dark] .license-key{background:#111b16;border-color:#355844;color:#e1f0e7}
html[data-surface=checkout][data-theme=dark] .pix-code,html[data-surface=checkout][data-theme=dark] .payer-fields input{background:#161a1f;border-color:#39424d;color:#c5ced9}
html[data-surface=checkout][data-theme=dark] .security,html[data-surface=checkout][data-theme=dark] .security strong,html[data-surface=checkout][data-theme=dark] .page-footer{color:#969faa}
html[data-surface=checkout][data-theme=dark] .back:hover{color:#fff}
html[data-surface=checkout][data-theme=dark] .spinner{border-color:#20242b44;border-top-color:#20242b}
html[data-surface=panel][data-theme=light]{--bg:#f5f6f8;--panel:#fff;--panel2:#edf0f4;--edge:#17202b1a;--edge2:#17202b33;--text:#20262d;--muted:#5b6571;--quiet:#66717e;--orange:#b34c00;--ink:#fff;--green:#14784d;--red:#b82b38;--yellow:#8b6500;--blue:#4658bb}
html[data-surface=panel][data-theme=light] body{background:var(--bg)}
html[data-surface=panel][data-theme=light] .side{background:#fff}
html[data-surface=panel][data-theme=light] .wordmark{background:#101215;border-radius:6px;padding:6px}
html[data-surface=panel][data-theme=light] .login-card{box-shadow:0 24px 70px #16212c12}
html[data-surface=panel][data-theme=light] .alert{background:#fff0f1!important;color:#9c2633!important;border-color:#edb8bf}
html[data-surface=panel][data-theme=light] .btn:hover{border-color:#828e9d}
html[data-surface=panel][data-theme=light] .btn.primary:hover{background:#9b4000}
.provider-icon{width:20px;height:20px;flex-shrink:0}.login-panel .link-button,.login-panel .google-login{display:flex;align-items:center;justify-content:center;gap:12px;min-height:48px}
html[data-surface=checkout] .provider-discord,html[data-surface=checkout][data-theme=dark] .provider-discord{background:#5865f2;color:#fff;border-color:#5865f2}
html[data-surface=checkout] .provider-discord:hover,html[data-surface=checkout][data-theme=dark] .provider-discord:hover{background:#4752c4;border-color:#4752c4}
html[data-surface=checkout] .google-login,html[data-surface=checkout][data-theme=dark] .google-login{background:#fff;color:#25282d;border:1px solid #d5d9df}
html[data-surface=checkout] .google-login:hover,html[data-surface=checkout][data-theme=dark] .google-login:hover{background:#f0f2f5}
#mc-card{display:none!important}
.side #nav button{display:flex;align-items:center;gap:12px}.panel-nav-icon{width:18px;height:18px;flex-shrink:0;opacity:.85}.side #nav button.on .panel-nav-icon{opacity:1}
.avatar{position:relative;overflow:hidden}.avatar img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%}

@media(min-width:1100px){html[data-surface=checkout][data-theme=dark] body{background:linear-gradient(to right,#14171b 0,#14171b 50%,#101214 50%,#101214 100%)}}
html[data-surface=checkout][data-layout=login] body{background:#fafafa;min-height:100vh}
html[data-surface=checkout][data-layout=login][data-theme=dark] body{background:#101214}
html[data-layout=login] .topbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}
html[data-layout=login] .topbar>.brand-logo{justify-self:center}
html[data-layout=login] .topbar>.theme-toggle{justify-self:end}
html[data-layout=login] .login-panel{width:100%;max-width:430px;margin:clamp(24px,6vh,65px) auto 0;padding:30px 26px 48px}
html[data-layout=login] .login-panel>.dtech-motion{margin:0 auto 24px}
html[data-layout=login] .login-panel .overline,html[data-layout=login] .login-panel h1,html[data-layout=login] .login-panel .intro{text-align:center}
html[data-layout=login] .login-panel h1{max-width:none}
@media(max-width:480px){html[data-layout=login] .topbar{padding:22px 20px;gap:12px}html[data-layout=login] .back{font-size:11px}html[data-layout=login] .brand-logo{width:27px;height:27px}html[data-layout=login] .login-panel{margin-top:12px;padding:22px 24px 36px}}
@media(max-width:760px){.topbar .theme-toggle{padding:8px;min-width:40px}.topbar .theme-toggle span{display:none}.top .theme-toggle{margin-left:auto}.top{flex-wrap:wrap}}
