@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#0c0e18;--panel:#151827;--muted:#9298ad;--text:#f4f4fb;--purple:#9575ff;--cyan:#70d9ff;--line:rgba(255,255,255,.085)}
*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 12% 0%,#29214a 0,transparent 42%),radial-gradient(ellipse at 100% 45%,#15243b 0,transparent 38%),var(--bg);color:var(--text);font-family:Manrope,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;overflow-x:hidden}
.ambient{position:fixed;z-index:-1;border-radius:50%;filter:blur(90px);opacity:.18;animation:float 12s ease-in-out infinite alternate}.ambient-a{width:240px;height:240px;background:#855eff;top:18%;left:-100px}.ambient-b{width:280px;height:280px;background:#37c6ff;right:-150px;bottom:4%;animation-delay:-4s}@keyframes float{to{transform:translate(50px,-35px) scale(1.12)}}
.shell{width:min(100% - 32px,720px);margin:0 auto;padding:calc(24px + env(safe-area-inset-top)) 0 calc(30px + env(safe-area-inset-bottom));animation:appear .55s ease both}@keyframes appear{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
.topbar,.brand,.section-head{display:flex;align-items:center}.topbar{justify-content:space-between;gap:12px;margin-bottom:30px}.brand{gap:13px}.brand-mark{width:46px;height:46px;display:grid;place-items:center;border:1px solid #ffffff20;border-radius:15px;background:linear-gradient(145deg,#a186ff,#5a55c6);box-shadow:0 8px 32px #795aff45;font-size:24px}.eyebrow{font-size:10px;letter-spacing:.16em;font-weight:800;color:#a9a1cf}.brand h1{font-size:18px;margin:3px 0 0;font-weight:700}.status-pill{display:flex;align-items:center;gap:8px;padding:9px 12px;border:1px solid var(--line);border-radius:999px;background:#ffffff08;color:#c5c8d5;font-size:11px;white-space:nowrap}.status-pill i{width:8px;height:8px;border-radius:50%;background:#73798b;box-shadow:0 0 10px currentColor}.status-pill.on i{background:#54dfa6;color:#54dfa6}.status-pill.off i{background:#ff7389;color:#ff7389}
.control-card,.grant-card,.access-error{position:relative;border:1px solid var(--line);background:linear-gradient(145deg,#1a1e30ed,#131624ed);border-radius:22px;box-shadow:0 18px 60px #0003;backdrop-filter:blur(14px)}.control-card{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:22px 24px;margin-bottom:24px}.control-card h2,.section-head h2,.access-error h2{margin:4px 0 5px;font-size:18px}.control-card p,.access-error p{margin:0;color:var(--muted);font-size:12px;line-height:1.55;max-width:420px}.toggle-button{display:flex;align-items:center;gap:11px;background:none;border:0;color:var(--text);font:inherit;cursor:pointer;white-space:nowrap}.toggle-track{width:48px;height:28px;padding:3px;border-radius:20px;background:#4b5063;transition:.25s}.toggle-track span{display:block;width:22px;height:22px;border-radius:50%;background:white;transition:.25s;box-shadow:0 2px 7px #0007}.toggle-button.enabled .toggle-track{background:linear-gradient(90deg,#7b65ff,#48ceca)}.toggle-button.enabled .toggle-track span{transform:translateX(20px)}.toggle-button b{font-size:12px;font-weight:700}
.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;padding:6px;border:1px solid var(--line);border-radius:16px;background:#0a0c15a8;margin-bottom:14px}.tab{border:0;border-radius:11px;background:transparent;color:#aeb2c3;padding:12px 8px;font:700 12px Manrope,sans-serif;cursor:pointer;transition:.22s}.tab span{margin-right:5px;font-size:16px}.tab:hover{color:white;background:#ffffff0b}.tab.active{color:white;background:linear-gradient(115deg,#765fe8,#525eb9);box-shadow:0 5px 18px #715eff3c}
.grant-card{overflow:hidden;padding:25px}.card-orbit{position:absolute;width:210px;height:210px;border:1px solid #a591ff12;border-radius:50%;right:-95px;top:-112px;box-shadow:0 0 0 22px #a591ff08,0 0 0 44px #a591ff05;pointer-events:none}.section-head{position:relative;gap:13px;margin-bottom:24px}.section-icon{width:44px;height:44px;display:grid;place-items:center;border-radius:14px;background:linear-gradient(145deg,#9679ff44,#43cfff23);border:1px solid #a790ff37;color:#c9bbff;font-size:22px}.section-head h2{font-size:21px}.field{display:block;margin:0 0 17px}.field>span{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:8px;font-size:12px;font-weight:700;color:#d9d9e7}.field small{font-size:10px;font-weight:500;color:#81869a}.field input{width:100%;height:48px;padding:0 14px;border:1px solid #ffffff15;border-radius:12px;background:#0e111d;color:#fff;outline:none;font:500 14px Manrope,sans-serif;transition:border-color .2s,box-shadow .2s}.field input:focus{border-color:#9982ff9e;box-shadow:0 0 0 3px #9276ff19}.field input::placeholder{color:#686e81}.primary-button{width:100%;height:50px;margin-top:4px;display:flex;justify-content:space-between;align-items:center;padding:0 17px;border:0;border-radius:13px;background:linear-gradient(105deg,#8c6dff,#5f76df 60%,#42b8ce);color:white;font:800 14px Manrope,sans-serif;cursor:pointer;box-shadow:0 9px 25px #7164eb3d;transition:transform .2s,filter .2s,box-shadow .2s}.primary-button:hover{transform:translateY(-2px);filter:brightness(1.1);box-shadow:0 12px 30px #7164eb58}.primary-button:active{transform:scale(.99)}.primary-button:disabled{opacity:.55;cursor:wait;transform:none}.primary-button b{font-size:21px}.result{margin-top:15px;padding:12px 14px;border-radius:12px;font-size:12px;line-height:1.5;animation:appear .25s ease}.result.success{background:#34d39915;border:1px solid #34d3993c;color:#8cf0c4}.result.error{background:#fb718515;border:1px solid #fb71853d;color:#ffadb9}.access-error{text-align:center;margin-top:12vh;padding:34px 25px}.error-icon{font-size:36px;color:#bfadff}footer{text-align:center;color:#70758a;font-size:10px;margin:20px 0 0}.hidden{display:none!important}
@media(max-width:520px){.shell{width:min(100% - 24px,720px);padding-top:calc(16px + env(safe-area-inset-top))}.topbar{align-items:flex-start;margin-bottom:20px}.brand-mark{width:42px;height:42px}.brand h1{font-size:15px}.status-pill{padding:8px 9px;font-size:10px}.control-card{padding:18px;align-items:flex-start}.control-card p{font-size:11px}.toggle-button{gap:7px}.toggle-button b{font-size:10px}.toggle-track{width:42px}.toggle-button.enabled .toggle-track span{transform:translateX(14px)}.grant-card{padding:21px 17px}.tab{font-size:11px}.field small{display:block;margin-top:4px}}
.toggle-button.frozen .toggle-track{background:linear-gradient(90deg,#ff596b,#a93053)}