/* Developer Panel - Matte Black / Emerald / Glassmorphism / Cyber Grid */
.dev-panel{position:fixed;inset:0;z-index:200;background:var(--dev-bg);color:#E6FFF6;display:none;overflow:hidden}
.dev-panel.open{display:block;animation:devOpen 0.7s cubic-bezier(0.16,1,0.3,1)}
@keyframes devOpen{from{opacity:0;transform:scale(1.02) translateY(12px);filter:blur(12px)}to{opacity:1;transform:scale(1) translateY(0);filter:blur(0)}}
.dev-grid-bg{position:absolute;inset:0;opacity:0.28;pointer-events:none;background-image:linear-gradient(rgba(0,229,153,0.08) 1px,transparent 1px),linear-gradient(90deg,rgba(0,229,153,0.06) 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(80% 80% at 50% 0%,black 60%,transparent 100%)}
.dev-glow{position:absolute;width:600px;height:600px;background:radial-gradient(circle,rgba(0,229,153,0.18) 0%,transparent 70%);top:-200px;right:-100px;pointer-events:none;filter:blur(40px)}

.dev-header{position:relative;height:72px;display:flex;align-items:center;justify-content:space-between;padding:0 32px;border-bottom:1px solid var(--dev-border);background:rgba(17,20,18,0.8);backdrop-filter:blur(24px)}
.dev-logo{font-family:var(--font-mono);font-size:14px;letter-spacing:0.12em;text-transform:uppercase;display:flex;align-items:center;gap:12px}
.dev-logo-dot{width:8px;height:8px;background:var(--dev-emerald);border-radius:50%;box-shadow:0 0 12px var(--dev-emerald)}
.dev-close{width:36px;height:36px;border-radius:10px;display:grid;place-items:center;border:1px solid var(--dev-border);background:var(--dev-surface);cursor:pointer;transition:0.2s}
.dev-close:hover{border-color:var(--dev-emerald);color:var(--dev-emerald)}

.dev-auth{position:absolute;inset:0;display:grid;place-items:center;background:rgba(8,10,9,0.92);backdrop-filter:blur(24px);z-index:5}
.dev-auth-card{width:min(420px,calc(100% - 32px));background:linear-gradient(180deg,#151917,#111412);border:1px solid var(--dev-border);border-radius:20px;padding:32px;box-shadow:0 24px 80px rgba(0,0,0,0.6),0 0 0 1px rgba(0,229,153,0.08) inset}
.dev-auth-title{font-family:var(--font-mono);font-size:13px;letter-spacing:0.14em;text-transform:uppercase;color:var(--dev-emerald);margin-bottom:12px}
.dev-auth-h{font-size:22px;font-weight:600;letter-spacing:-0.02em;margin-bottom:8px}
.dev-auth-p{font-size:13px;color:#8BA89F;line-height:1.5;margin-bottom:24px}

.dev-body{position:relative;display:grid;grid-template-columns:260px 1fr;height:calc(100vh - 72px);overflow:hidden}
@media(max-width:900px){.dev-body{grid-template-columns:1fr}.dev-sidebar{display:none}}
.dev-sidebar{background:rgba(17,20,18,0.6);border-right:1px solid var(--dev-border);padding:20px;display:flex;flex-direction:column;gap:24px;overflow:auto}
.dev-nav{display:grid;gap:4px}
.dev-nav-link{height:40px;padding:0 14px;border-radius:12px;display:flex;align-items:center;gap:10px;font-size:13px;color:#8BA89F;border:1px solid transparent;transition:0.2s;cursor:pointer;font-family:var(--font-mono)}
.dev-nav-link.active{background:rgba(0,229,153,0.1);border-color:rgba(0,229,153,0.18);color:var(--dev-emerald);box-shadow:0 0 20px rgba(0,229,153,0.08) inset}
.dev-nav-link:hover{color:#D8FFF2;background:rgba(255,255,255,0.04)}

.dev-content{padding:28px;overflow:auto;background:linear-gradient(180deg,rgba(0,229,153,0.02),transparent 30%)}
.dev-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:28px}
@media(max-width:1200px){.dev-stat-grid{grid-template-columns:repeat(2,1fr)}}
.dev-stat{background:linear-gradient(180deg,#151917,#121412);border:1px solid var(--dev-border);border-radius:16px;padding:20px;position:relative;overflow:hidden}
.dev-stat::before{content:'';position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--dev-emerald),transparent);opacity:0.6}
.dev-stat-label{font-family:var(--font-mono);font-size:10px;letter-spacing:0.12em;text-transform:uppercase;color:#5E7D75;margin-bottom:8px}
.dev-stat-value{font-size:32px;font-weight:600;letter-spacing:-0.03em;line-height:1}
.dev-stat-sub{font-size:12px;color:#5E7D75;margin-top:6px}

.dev-table-wrap{background:linear-gradient(180deg,#151917,#111412);border:1px solid var(--dev-border);border-radius:16px;overflow:hidden}
.dev-table-head{padding:16px 20px;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--dev-border);gap:12px;flex-wrap:wrap}
.dev-search{height:36px;padding:0 14px;background:#0C0E0D;border:1px solid var(--dev-border);border-radius:10px;font-family:var(--font-mono);font-size:12px;color:#CFF5E8;min-width:240px}
.dev-table{width:100%;border-collapse:collapse}
.dev-table th{font-family:var(--font-mono);font-size:10px;letter-spacing:0.1em;text-transform:uppercase;color:#5E7D75;text-align:left;padding:12px 20px;border-bottom:1px solid var(--dev-border);font-weight:600}
.dev-table td{padding:14px 20px;font-size:13px;border-bottom:1px solid rgba(30,36,33,0.6);color:#B9D3CB}
.dev-table tr:hover td{background:rgba(0,229,153,0.04)}
.dev-tag{display:inline-flex;padding:3px 8px;border-radius:999px;font-size:10px;font-family:var(--font-mono);letter-spacing:0.06em;text-transform:uppercase;border:1px solid}
.dev-tag-pro{background:rgba(0,229,153,0.12);color:var(--dev-emerald);border-color:rgba(0,229,153,0.22)}
.dev-tag-verified{background:rgba(120,180,255,0.12);color:#7EB8FF;border-color:rgba(120,180,255,0.2)}
.dev-tag-free{background:rgba(255,255,255,0.06);color:#8BA89F;border-color:var(--dev-border)}
.dev-action{display:inline-flex;gap:6px}
.dev-btn{height:28px;padding:0 10px;border-radius:8px;font-family:var(--font-mono);font-size:11px;letter-spacing:0.04em;border:1px solid var(--dev-border);background:#0C0E0D;color:#8BA89F;cursor:pointer;transition:0.2s}
.dev-btn:hover{border-color:var(--dev-emerald);color:var(--dev-emerald)}
.dev-btn-danger:hover{border-color:#FF5A5F;color:#FF5A5F}
.dev-btn-emerald{background:var(--dev-emerald);color:#00150E;border-color:var(--dev-emerald);font-weight:600}
.dev-btn-emerald:hover{background:var(--dev-emerald-dim)}