:root { --bg: #0b1020; --fg: #e7ecf3; --muted: #98a2b3; --card: #11162a; --border: #1c2340; --accent: #6f9cff; --accent2: #7ef0d4; --danger: #ff6b6b; --shadow: 0 10px 30px rgba(0,0,0,.35); }
*{box-sizing:border-box}
html,body{background:var(--bg); color:var(--fg); font-family:'IRANSansX','Vazirmatn',system-ui,-apple-system,'Segoe UI',Roboto; line-height:1.6}
.container{max-width:1100px; margin-inline:auto; padding:24px}
.card{background:linear-gradient(180deg, rgba(255,255,255,.02), rgba(255,255,255,.01)); border:1px solid var(--border); border-radius:20px; box-shadow:var(--shadow); padding:20px; backdrop-filter: blur(8px)}
.grid{display:grid; gap:16px}
.grid-3{grid-template-columns: repeat(auto-fit, minmax(260px, 1fr))}
h1,h2,h3{letter-spacing:.2px}
.btn{display:inline-flex; align-items:center; justify-content:center; padding:12px 16px; border-radius:14px; border:1px solid var(--border); text-decoration:none; cursor:pointer; transition:transform .15s ease, background .2s}
.btn:hover{transform: translateY(-1px)}
.btn-primary{background:linear-gradient(135deg, var(--accent), var(--accent2)); color:#071226; font-weight:700; border:none}
.input{width:100%; padding:12px 14px; background:#0e1430; border:1px solid var(--border); border-radius:12px; color:var(--fg); outline:none}
.label{font-size:.9rem; color:var(--muted); margin-bottom:6px; display:block}
.badge{display:inline-block; padding:4px 10px; border-radius:999px; background:rgba(255,255,255,.06); border:1px solid var(--border); color:var(--muted); font-size:.8rem}
.table{width:100%; border-collapse: separate; border-spacing:0 8px}
.table th{color:var(--muted); font-weight:600; text-align:left; padding:10px}
.table td{background:var(--card); border:1px solid var(--border); padding:12px; border-left:none;border-right:none}
.table tr td:first-child{border-radius:14px 0 0 14px; border-left:1px solid var(--border)}
.table tr td:last-child{border-radius:0 14px 14px 0; border-right:1px solid var(--border)}
.header{display:flex; align-items:center; justify-content:space-between; margin-bottom:24px}
.brand{display:flex; gap:10px; align-items:center}
.brand .dot{width:10px; height:10px; border-radius:50%; background: var(--accent2)}
.small{font-size:.85rem; color:var(--muted)}