:root {
    --gold: #D4AF37;
    --black: #0a0a0a;
    --dark-grey: #1a1a1a;
    --accent: #FFD700;
}
* { box-sizing: border-box; }
body { 
    margin: 0; background: var(--black); color: #fff; 
    font-family: 'Segoe UI', sans-serif; display: flex; height: 100vh; 
}

/* Sidebar Navigation */
.sidebar {
    width: 60px; background: var(--dark-grey); border-right: 1px solid var(--gold);
    display: flex; flex-direction: column; align-items: center; padding: 20px 0;
    transition: width 0.3s; overflow: hidden;
}
.sidebar:hover { width: 200px; }
.sidebar-item { margin: 15px 0; color: var(--gold); cursor: pointer; white-space: nowrap; }

/* Main Browser Stage */
.main-stage { flex: 1; display: flex; flex-direction: column; }
.nav-bar { 
    background: var(--dark-grey); padding: 10px; display: flex; gap: 10px; 
    border-bottom: 1px solid var(--gold); align-items: center;
}
.url-bar { 
    flex: 1; background: #000; border: 1px solid var(--gold); color: var(--gold); 
    padding: 10px; border-radius: 5px; outline: none;
}
.viewport { flex: 1; border: none; background: #fff; width: 100%; }

/* Shield & Ads Blocker Status */
.shield-active { color: #00ff41; font-size: 12px; font-weight: bold; }