*{box-sizing:border-box;font-family:-apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;}
:root{--bg:#0b0b0c;--card:#111214;--muted:#9aa0a6;--accent:#8ab4f8;}
body.dark{background:var(--bg);color:#fff;margin:0;padding:0;}
.topbar{height:60px;display:flex;align-items:center;gap:12px;padding:8px 16px;background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent);backdrop-filter: blur(6px);position:sticky;top:0;}
.topbar h1{margin:0;font-size:18px;font-weight:600;}
.back{background:none;border:none;color:var(--muted);font-size:15px;padding:6px;cursor:pointer;}
.container{padding:16px;max-width:420px;margin:0 auto;}

.card{background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.01));border-radius:14px;padding:12px;margin-bottom:12px;box-shadow:0 6px 18px rgba(0,0,0,0.6);}

.profile{display:flex;align-items:center;gap:12px;padding:18px;}
.avatar{width:68px;height:68px;border-radius:50%;background:#2b2b2d;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:26px;color:#fff;}
.meta .name{font-size:18px;font-weight:700;}
.meta .email{font-size:13px;color:var(--muted);margin-top:4px;}

.grid .row,.list .row,.device .row{display:flex;align-items:center;padding:12px;border-radius:10px;cursor:pointer;}
.grid .row + .row{margin-top:8px;}
.row .icon{width:36px;display:flex;align-items:center;justify-content:center;font-size:18px;margin-right:12px;}
.row .label{flex:1;font-size:16px;}
.row .value{color:var(--muted);margin-right:8px;}
.row .chev{color:var(--muted);font-size:18px;margin-left:8px;}

.modal{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,0.6);}
.modal.hidden{display:none;}
.modal-content{background:#0d0d0e;padding:18px;border-radius:12px;min-width:260px;max-width:90%;}
#close{background:none;border:1px solid var(--muted);color:var(--muted);padding:8px 12px;border-radius:8px;cursor:pointer;margin-bottom:8px;}