@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{color-scheme:dark;--bg:#111211;--card:#1c1d1c;--line:#30312f;--muted:#92958e;--accent:#d6f58b}*{box-sizing:border-box}body{margin:0;background:#191b18;background-image:radial-gradient(#3b3e35 .7px,transparent .7px);background-size:14px 14px;color:#f4f4f0;font:13px Manrope,Arial,sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:3px}button{color:inherit}a{color:inherit;text-decoration:none}.ambient-label{position:fixed;left:38px;top:40px;writing-mode:vertical-rl;font:10px 'DM Sans',sans-serif;letter-spacing:3px;color:#777c70}.app{width:min(100%,440px);margin:28px auto;background:var(--bg);min-height:860px;border:1px solid #43463e;border-radius:26px;overflow:hidden;position:relative;box-shadow:0 30px 100px #0006}header{height:77px;display:flex;align-items:center;gap:17px;padding:0 22px;border-bottom:1px solid #262824}.icon-button{background:none;border:0;font-size:26px;color:#8f938b;padding:0}.brand{display:flex;align-items:center;gap:9px;font-size:17px;font-weight:800;letter-spacing:.8px}.brand-icon{width:30px;height:33px;border:1px solid #d6f58b;border-radius:9px 9px 13px 13px;display:grid;place-items:center;color:var(--accent);position:relative;font-size:21px}.brand-icon span{font-size:10px;position:absolute;right:2px;top:0}.brand-sub{display:block;font:7px 'DM Sans';letter-spacing:1.7px;color:#93978b;margin-top:3px}.header-secure{margin-left:auto;color:#8c9284;font-size:20px}.avatar{border:1px solid #686e5d;background:#32392b;color:#e2edcf;border-radius:50%;width:30px;height:30px;font-size:11px}main{padding:25px 22px 108px;min-height:780px}.eyebrow{font:10px 'DM Sans';letter-spacing:1.8px;color:#a4ab98;text-transform:uppercase;display:flex;align-items:center;gap:8px}.dot{height:6px;width:6px;background:var(--accent);border-radius:50%;display:inline-block;box-shadow:0 0 12px #d6f54b44}h1{font-size:28px;line-height:1.22;letter-spacing:-1.1px;margin:10px 0 8px;font-weight:800}p{margin:0;color:var(--muted);line-height:1.65;font-size:12px}.page-heading{margin-bottom:24px}.pill{background:#2c3026;color:var(--accent);font:9px 'DM Sans';padding:5px 7px;border-radius:5px;letter-spacing:.5px}.card{padding:18px;background:var(--card);border:1px solid #272925;border-radius:14px;margin-bottom:12px}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.label{font-size:10px;color:var(--muted)}.section-title{font-size:13px;font-weight:800;margin:23px 0 12px}.status-title{font-size:14px;font-weight:800;display:flex;gap:8px;align-items:center}.subscription{background:linear-gradient(115deg,#272c21,#1b1e18);border-color:#39412e}.subscription .row{margin-bottom:22px}.progress{height:4px;background:#414837;border-radius:3px;margin:9px 0 18px}.progress span{display:block;width:76%;height:100%;background:var(--accent);border-radius:3px}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px}.metric{border-top:1px solid #3b4134;padding-top:13px}.metric strong{display:block;font:600 22px 'DM Sans';margin:6px 0 3px}.metric small{font-size:9px;color:#a7af9b}.key-card{margin-top:18px}.key-box{background:#121310;border:1px solid #2c2e28;border-radius:8px;padding:12px;margin:15px 0 12px}.key-box code{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font:10px monospace;color:#ccd9b7;margin-top:8px}.primary,.secondary{border:0;border-radius:8px;padding:13px 15px;font-size:12px;font-weight:800;display:flex;justify-content:center;align-items:center;gap:8px}.primary{background:#e5f5c8;color:#1a2112}.secondary{background:#2b2e27;color:#f0f2e9}.button-row{display:flex;gap:8px}.button-row>*{flex:1}.compat{font-size:10px;color:#959c8b;line-height:1.7;margin-top:12px}.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.quick{background:var(--card);text-align:left;border:1px solid #292c25;border-radius:12px;padding:15px;transition:.2s}.quick:hover{background:#272c22;border-color:#586247}.tile-icon{display:grid;place-items:center;width:29px;height:29px;border-radius:9px;background:#30352a;color:var(--accent);font-size:17px;margin-bottom:14px}.quick strong{display:block;font-size:13px;margin-bottom:4px}.quick small{color:#949b8b;font-size:10px}.session{width:100%;text-align:left;display:flex;align-items:center;gap:12px;margin-top:12px}.session .tile-icon{margin:0}.session .arrow{margin-left:auto;color:var(--accent)}.footer-note{display:flex;justify-content:center;gap:7px;font-size:9px;color:#737b68;margin:22px 0 0}nav{height:76px;position:absolute;bottom:0;left:0;right:0;background:#151613f5;border-top:1px solid #2b2d26;display:flex;align-items:center;padding:5px 12px 9px;backdrop-filter:blur(20px)}nav button{flex:1;border:0;background:none;color:#777d70;font-size:9px;display:grid;justify-items:center;gap:7px}nav svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.6}nav button.active{color:var(--accent)}.plan{width:100%;text-align:left;display:block;position:relative;padding:19px 16px;margin:10px 0;border:1px solid #30322c;background:#1b1d19;border-radius:12px}.plan.selected{border-color:#bad67c;background:#272d20}.radio{width:16px;height:16px;border:1px solid #606755;border-radius:50%;display:inline-block;margin-right:11px;vertical-align:middle}.selected .radio{border:5px solid var(--accent)}.price{font:700 20px 'DM Sans';text-align:right}.price small{font:10px Manrope;color:#a3ac96;display:block;margin-top:4px}.plan-name{font-weight:800;font-size:15px}.plan-desc{font-size:10px;color:#a3ac96;margin:10px 0 0 29px}.popular{position:absolute;top:-8px;right:13px;font:8px 'DM Sans';letter-spacing:1px;color:#19210d;background:var(--accent);padding:3px 7px;border-radius:4px}.features{display:grid;gap:18px;margin-top:24px}.feature{display:flex;gap:13px}.feature .tile-icon{flex-shrink:0;margin:0}.feature strong{font-size:12px}.feature p{font-size:10px;margin-top:3px}.wide{width:100%;margin-top:22px}.tabs{display:flex;padding:5px;background:#1e211a;border-radius:9px;gap:3px;margin-bottom:21px}.tabs button{flex:1;padding:9px 0;background:none;border:0;border-radius:6px;color:#909987;font-size:11px}.tabs button.active{background:#e8f1d9;color:#1a2112;font-weight:800}.step-title{display:flex;gap:10px;align-items:center;margin-bottom:17px}.step-number{width:23px;height:23px;border:1px solid #566246;color:var(--accent);border-radius:50%;display:grid;place-items:center;font:11px 'DM Sans'}.step-title strong{font-size:13px}.client{display:flex;align-items:center;gap:10px;background:#242720;border-radius:9px;padding:11px;margin-top:8px}.client .tile-icon{margin:0}.client div:nth-child(2){flex:1}.client strong{font-size:12px}.client p{font-size:9px}.client button{border:1px solid #434b38;background:none;border-radius:5px;padding:6px;font-size:9px}.user{display:flex;gap:14px;align-items:center}.user-avatar{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#4c5938,#242b1e);font:20px 'DM Sans';border:1px solid #6b7c51}.user strong{font-size:16px}.user .pill{margin-left:auto}.divider{height:1px;background:#30342b;margin:17px 0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:7px;margin:18px 0}.stat{background:#25291f;border-radius:7px;text-align:center;padding:12px 2px}.stat strong{display:block;font:600 20px 'DM Sans';margin:7px 0}.stat small{font-size:8px;color:#9ca58e}.toast{position:fixed;bottom:35px;left:50%;transform:translate(-50%,20px);background:#e5f5c8;color:#1a2112;padding:13px 22px;border-radius:10px;font-size:12px;opacity:0;pointer-events:none;transition:.2s;z-index:10}.toast.show{opacity:1;transform:translate(-50%,0)}.overlay{position:fixed;inset:0;background:#0009;backdrop-filter:blur(5px);display:none;align-items:center;justify-content:center;padding:24px;z-index:20}.overlay.open{display:flex}.modal{width:360px;background:#1c1f18;border:1px solid #434b37;border-radius:20px;padding:25px}.modal h2{font-size:21px;margin:15px 0 10px}.modal .close{float:right;background:none;border:0;font-size:23px;color:#a6ad9b}.pay-option{width:100%;margin-top:10px}.qr{width:180px;height:180px;margin:20px auto;background:white;padding:12px}.qr svg{width:100%;height:100%}.fade-in{animation:enter .25s ease}@keyframes enter{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@media(max-width:500px){body{background:var(--bg)}.app{border:0;border-radius:0;margin:0;min-height:100dvh;width:100%}main{min-height:calc(100dvh - 77px)}nav{position:fixed;width:100%;left:0;bottom:0;padding-bottom:max(9px,env(safe-area-inset-bottom));height:78px}.ambient-label{display:none}}@media(min-width:501px){.app{margin-bottom:28px}nav{position:sticky;bottom:0;margin-top:-76px}} 
.eyebrow{font-family:'DM Sans',Arial,sans-serif}nav{z-index:5}
.modal input,.modal select{width:100%;padding:12px;margin-top:10px;border:1px solid #48523a;border-radius:8px;background:#11150e;color:#e5ebdc;font:12px Arial}.modal{max-height:90dvh;overflow:auto}.primary:disabled,button:disabled{opacity:.5;cursor:wait}
.ui-icon{width:18px;height:18px;display:inline-block;vertical-align:middle;flex-shrink:0}.tile-icon .ui-icon{width:19px;height:19px}.brand-icon{width:34px;height:34px;border:0;border-radius:10px}.header-secure{display:flex}.brand{letter-spacing:.4px}.card strong .ui-icon{margin-right:4px}.footer-note .ui-icon{width:12px;height:12px}
