@import url('https://fonts.googleapis.com/css2?family=Vazirmatn:wght@400;500;600;700;800&display=swap');
:root{color-scheme:light;--bg:#f7f9fc;--panel:#fff;--line:#e5eaf2;--text:#15223e;--muted:#66758d;--blue:#1967f2}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--text);font:14px Vazirmatn,Tahoma,Arial,sans-serif;line-height:1.8}
.shell{max-width:800px;margin:auto;padding:14px 16px 100px}
header{display:flex;justify-content:space-between;align-items:center;padding:12px 0 20px;gap:12px}
.brand{display:flex;align-items:center;gap:12px}.brand-icon{width:48px;height:48px;object-fit:cover;border-radius:13px}.brand-name{font:800 22px Arial,sans-serif;direction:ltr}.brand-name small{display:block;font:600 9px Arial;color:var(--muted);letter-spacing:1.2px}.tag{font-size:11px;background:#eaf1ff;color:#1764db;padding:7px 12px;border-radius:30px}
.hero{background:#fff;border:1px solid var(--line);border-radius:20px;padding:22px;margin-bottom:18px}.hero-top{display:flex;align-items:center;gap:12px}.hero-logo{width:58px;height:58px;object-fit:cover;border-radius:14px}.hero h1{font-size:22px;margin:12px 0 4px}.hero p,.muted,.small{color:var(--muted)}.small{font-size:12px}
.panel{background:#fff;border:1px solid var(--line);border-radius:19px;padding:20px;margin-bottom:14px}
h2{font-size:19px;margin:22px 0 16px}h3{font-size:16px}.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px}.stats strong{display:block;font-size:27px;color:var(--blue);margin:7px 0}.welcome{display:flex;align-items:center;gap:12px;margin:14px 0 20px}.welcome button{margin-right:auto}
button,.link{font:inherit;border:0;border-radius:12px;background:var(--blue);color:white;padding:11px 16px;cursor:pointer;text-decoration:none;display:inline-block;text-align:center}button:hover,.link:hover{background:#1056d7}button:disabled{opacity:.48;cursor:not-allowed}
.line{display:flex;justify-content:space-between;gap:12px;margin:11px 0;border-bottom:1px solid #f1f3f7;padding-bottom:8px}.line span:first-child{color:var(--muted)}.line span:last-child{overflow-wrap:anywhere;text-align:left}.service h3{margin:0 0 13px}.service .link{margin-top:12px}.progress{height:8px;background:#e8edf5;border-radius:20px;overflow:hidden;margin:16px 0}.bar{height:100%;background:#216af2}.transaction{display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px}.transaction strong{color:var(--blue)}
.tabs{position:fixed;bottom:0;left:0;right:0;max-width:800px;margin:auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;background:#fff;border-top:1px solid var(--line);box-shadow:0 -5px 24px #1a31500b;z-index:10;padding:7px 6px max(7px,env(safe-area-inset-bottom))}
.tab{background:transparent;color:#5b6880;border:0;padding:7px 2px;min-width:0;font-size:12px;display:flex;flex-direction:column;align-items:center;gap:1px}.tab:hover{background:#f1f5fc}.tab.selected{background:transparent;color:var(--blue);font-weight:800}.nav-icon{font:700 23px Tahoma,sans-serif;height:29px;line-height:29px}
#shop-catalog{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:13px}#shop-catalog .panel{margin:0}#shop-catalog button{width:100%;margin-top:10px}
#login{max-width:500px;margin:auto}#code-form{display:grid;gap:12px;margin-top:16px}#login-code{width:100%;border:1px solid #d7deea;border-radius:12px;background:#fff;color:var(--text);padding:14px;font-size:18px;text-align:center;letter-spacing:1px}
#logout{background:#fff;color:#ad324c;border:1px solid #efcbd2;padding:7px 14px}
.info{line-height:2}footer{text-align:center;color:#96a0b1;font-size:11px;padding:22px}[hidden]{display:none!important}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #93b8ff;outline-offset:2px}
@media(max-width:430px){.shell{padding:10px 13px 100px}.panel{padding:16px}.hero{padding:17px}.hero h1{font-size:19px}.stats{gap:9px}.stats strong{font-size:22px}.brand-name{font-size:19px}.tag{font-size:10px}.hero-logo{width:48px;height:48px}}

/* Logo-only enhancement: all white UI colors and navigation stay unchanged. */
.login-brand{display:flex;flex-direction:column;align-items:center;gap:8px;margin:0 auto 22px;text-align:center}.login-brand img{width:104px;height:104px;object-fit:cover;border-radius:24px;box-shadow:0 8px 24px #173c6c1a}.login-brand strong{font-size:25px;font-family:Arial,sans-serif;color:#15223e;letter-spacing:.5px}