:root {
--bg:#0c0c0e;--surface:#141416;--surface-hover:#1c1c1f;--surface-elevated:#1f1f23;
--border:#2a2a2e;--border-light:#35353a;--text:#ededed;--text-secondary:#9ca3af;
--text-muted:#6b7280;--accent:#dc2626;--accent-dim:#991b1b;--accent-glow:rgba(220,38,38,0.2);
--positive:#16a34a;--negative:#dc2626;--warning:#ca8a04;
--font-main:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
--font-mono:'JetBrains Mono',monospace;
--sidebar-width:220px;--top-nav-height:48px;--breaking-height:120px;
}
*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--font-main);font-size:14px;line-height:1.6;display:flex;min-height:100vh;-webkit-font-smoothing:antialiased}
.sidebar{width:var(--sidebar-width);background:var(--surface);border-right:1px solid var(--border);display:flex;flex-direction:column;position:fixed;left:0;top:0;bottom:0;z-index:100;overflow-y:auto}
.sidebar-brand{padding:20px;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:10px}
.brand-icon{color:var(--accent);font-size:18px;animation:pulse 2s ease-in-out infinite}
.brand-text{font-size:15px;font-weight:800;letter-spacing:1px;color:var(--text)}
.sidebar-nav{flex:1;padding:16px 0}
.nav-section{margin-bottom:24px}
.nav-label{display:block;padding:0 20px;font-size:10px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted);margin-bottom:8px}
.sidebar-nav ul{list-style:none}
.sidebar-nav li a{display:flex;align-items:center;gap:10px;padding:8px 20px;color:var(--text-secondary);text-decoration:none;font-size:13px;transition:all .2s;border-left:3px solid transparent}
.sidebar-nav li a:hover,.sidebar-nav li a.active{background:var(--surface-hover);color:var(--text);border-left-color:var(--accent)}
.sidebar-footer{padding:16px 20px;border-top:1px solid var(--border);display:flex;align-items:center;gap:8px;font-family:var(--font-mono);font-size:11px}
.status-dot{width:8px;height:8px;background:var(--positive);border-radius:50%;box-shadow:0 0 8px rgba(22,163,74,0.4);animation:pulse 2s infinite}
.main-content{margin-left:var(--sidebar-width);flex:1;display:flex;flex-direction:column;min-height:100vh}
.top-nav{height:var(--top-nav-height);background:var(--surface-elevated);border-bottom:1px solid var(--border);display:flex;align-items:center;padding:0 24px;position:sticky;top:0;z-index:50}
.top-nav-scroll{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none}
.top-nav-scroll::-webkit-scrollbar{display:none}
.nav-tab{padding:8px 20px;border-radius:4px;font-size:13px;font-weight:500;color:var(--text-secondary);cursor:pointer;white-space:nowrap;transition:all .2s;border:1px solid transparent}
.nav-tab:hover{background:var(--surface-hover);color:var(--text)}
.nav-tab.active{background:var(--accent);color:#fff;border-color:var(--accent-dim)}
.breaking-banner{background:linear-gradient(135deg,var(--accent-dim) 0%,var(--surface-elevated) 100%);border-bottom:1px solid var(--border);padding:16px 24px;min-height:var(--breaking-height)}
.breaking-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}
.breaking-label{font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:2px;color:var(--accent);background:var(--accent-glow);padding:4px 12px;border-radius:4px}
.breaking-time{font-family:var(--font-mono);font-size:12px;color:var(--text-muted)}
.breaking-scroller{display:flex;gap:16px;overflow-x:auto;padding-bottom:8px;scrollbar-width:thin;scrollbar-color:var(--border) transparent}
.breaking-scroller::-webkit-scrollbar{height:4px}
.breaking-scroller::-webkit-scrollbar-thumb{background:var(--border);border-radius:2px}
.breaking-card{flex:0 0 320px;background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:16px;cursor:pointer;transition:all .2s}
.breaking-card:hover{border-color:var(--accent-dim);transform:translateY(-2px)}
.breaking-card .card-category{font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;margin-bottom:8px}
.breaking-card .card-headline{font-size:14px;font-weight:600;line-height:1.4;margin-bottom:8px;color:var(--text)}
.breaking-card .card-time{font-family:var(--font-mono);font-size:11px;color:var(--text-muted)}
.ticker-section{background:var(--surface);border-bottom:1px solid var(--border);padding:12px 24px;overflow:hidden}
.ticker-row{display:flex;gap:16px}
.ticker-column{flex:1;min-width:0;display:flex;align-items:center;gap:10px;background:var(--bg);border-radius:4px;padding:8px 12px;overflow:hidden}
.ticker-cat-label{font-family:var(--font-mono);font-size:10px;font-weight:600;letter-spacing:1px;white-space:nowrap;flex-shrink:0}
.ticker-scroll{flex:1;overflow:hidden;white-space:nowrap;position:relative}
.ticker-scroll-inner{display:inline-block;animation:ticker-scroll 30s linear infinite;font-size:12px;color:var(--text-secondary)}
@keyframes ticker-scroll{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}
.content-grid{display:grid;grid-template-columns:1fr 280px;gap:24px;padding:24px;flex:1}
.article-main{background:var(--surface);border:1px solid var(--border);border-radius:8px;overflow:hidden}
.article-header{padding:28px;border-bottom:1px solid var(--border)}
.article-category{display:inline-block;font-family:var(--font-mono);font-size:11px;font-weight:600;letter-spacing:1px;color:var(--accent);margin-bottom:12px}
.article-header h1{font-size:28px;font-weight:800;line-height:1.2;margin-bottom:16px;color:var(--text)}
.article-lead{font-size:16px;color:var(--text-secondary);line-height:1.7;margin-bottom:16px;max-width:800px}
.article-meta{display:flex;gap:16px;font-family:var(--font-mono);font-size:12px;color:var(--text-muted)}
.article-body{padding:24px;display:flex;flex-direction:column;gap:20px}
.panel{background:var(--surface-elevated);border:1px solid var(--border);border-radius:6px;overflow:hidden}
.panel.wide{grid-column:1/-1}
.panel-header{display:flex;align-items:center;gap:10px;padding:14px 20px;background:var(--surface-hover);border-bottom:1px solid var(--border)}
.panel-icon{color:var(--accent);font-size:10px}
.panel-header h3{font-size:12px;font-weight:600;letter-spacing:1.5px;color:var(--text-muted)}
.panel-body{padding:20px}
.event-item{padding:14px 0;border-bottom:1px solid var(--border)}
.event-item:last-child{border-bottom:none;padding-bottom:0}
.event-item:first-child{padding-top:0}
.event-tag{display:inline-block;font-family:var(--font-mono);font-size:10px;font-weight:600;letter-spacing:1px;padding:2px 8px;border-radius:3px;margin-bottom:6px;text-transform:uppercase}
.event-tag.attack{background:var(--accent-dim);color:#fca5a5}
.event-tag.diplo{background:#1e3a5f;color:#93c5fd}
.event-tag.econ{background:#3a3a1a;color:#fde047}
.event-title{font-weight:600;font-size:14px;margin-bottom:4px;color:var(--text)}
.event-desc{color:var(--text-secondary);font-size:13px;line-height:1.6}
.data-table{width:100%;border-collapse:collapse;font-size:13px}
.data-table th{text-align:left;padding:10px 12px;font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--border)}
.data-table td{padding:12px;border-bottom:1px solid var(--border);color:var(--text-secondary);vertical-align:top}
.data-table tr:last-child td{border-bottom:none}
.data-table td:first-child{font-weight:600;color:var(--text)}
.statement{padding:14px 0;border-bottom:1px solid var(--border)}
.statement:last-child{border-bottom:none;padding-bottom:0}
.statement:first-child{padding-top:0}
.statement-header{display:flex;align-items:center;gap:10px;margin-bottom:8px}
.flag{width:22px;height:16px;border-radius:2px;display:inline-flex;align-items:center;justify-content:center;font-size:9px;font-family:var(--font-mono);font-weight:700;color:#fff}
.statement-author{font-weight:600;font-size:13px;color:var(--text)}
.statement-source{font-family:var(--font-mono);font-size:11px;color:var(--text-muted);margin-left:auto}
.statement-quote{padding-left:16px;border-left:2px solid var(--accent-dim);color:var(--text-secondary);font-style:italic;line-height:1.7;font-size:13px}
.bullet-list{list-style:none}
.bullet-list li{padding:8px 0;padding-left:20px;position:relative;border-bottom:1px solid var(--border);color:var(--text-secondary);font-size:13px;line-height:1.6}
.bullet-list li:last-child{border-bottom:none}
.bullet-list li::before{content:'';position:absolute;left:0;top:15px;width:6px;height:6px;background:var(--accent);border-radius:50%}
.context .panel-body p{color:var(--text-secondary);line-height:1.8;font-size:13px}
.sidebar-right{display:flex;flex-direction:column;gap:16px}
.widget{background:var(--surface);border:1px solid var(--border);border-radius:6px;padding:16px}
.widget h4{font-size:11px;font-weight:600;letter-spacing:1.5px;text-transform:uppercase;color:var(--text-muted);margin-bottom:12px;padding-bottom:8px;border-bottom:1px solid var(--border)}
.commodity-list{display:flex;flex-direction:column;gap:10px}
.commodity-item{display:flex;justify-content:space-between;align-items:center;font-size:13px}
.commodity-name{color:var(--text-secondary)}
.commodity-value{font-family:var(--font-mono);font-weight:600;font-size:13px}
.commodity-value.up{color:var(--positive)}
.commodity-value.down{color:var(--negative)}
.site-footer{border-top:1px solid var(--border);padding:24px;font-size:12px;color:var(--text-muted);margin-top:auto}
.disclaimer{margin-top:8px;font-size:11px}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.5}}
@media(max-width:1024px){.content-grid{grid-template-columns:1fr}.sidebar-right{flex-direction:row;flex-wrap:wrap}.widget{flex:1;min-width:200px}}
@media(max-width:768px){.sidebar{transform:translateX(-100%);transition:transform .3s}.sidebar.open{transform:translateX(0)}.main-content{margin-left:0}.breaking-card{flex:0 0 280px}.article-header h1{font-size:22px}.ticker-column{min-width:250px}}

/* Layout mit rechter Sidebar */
.content-wrapper { display: flex; flex: 1; min-height: 100vh; }
.content-grid { display: grid; grid-template-columns: 1fr 280px; gap: 24px; padding: 24px; }

.sidebar-right { display: flex; flex-direction: column; gap: 16px; }
.widget { background: var(--surface); border: 1px solid var(--border); border-radius: 6px; padding: 16px; }
.widget h4 { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; color: var(--text-muted); margin: 0 0 12px 0; padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.commodity-list { display: flex; flex-direction: column; gap: 8px; }
.commodity-item { display: flex; justify-content: space-between; align-items: center; font-size: 13px; padding: 4px 0; }
.commodity-name { color: var(--text-secondary); }
.commodity-value { font-family: var(--font-mono); font-weight: 600; color: var(--text-primary); }
.commodity-value.up { color: var(--accent); }
.commodity-value.down { color: var(--negative); }

@media (max-width: 1100px) {
    .content-grid { grid-template-columns: 1fr; }
    .sidebar-right { display: none; }
}

/* Repariertes Layout */
.content-grid { 
    display: grid; 
    grid-template-columns: 1fr 240px; 
    gap: 16px; 
    padding: 16px; 
}

.sidebar-right { 
    display: flex; 
    flex-direction: column; 
    gap: 12px; 
    min-width: 0;
}

.widget { 
    background: var(--surface); 
    border: 1px solid var(--border); 
    border-radius: 6px; 
    padding: 12px; 
    font-size: 12px;
}

.widget h4 { 
    font-size: 10px; 
    font-weight: 700; 
    text-transform: uppercase; 
    letter-spacing: 0.08em; 
    color: var(--text-muted); 
    margin: 0 0 8px 0; 
    padding-bottom: 6px; 
    border-bottom: 1px solid var(--border); 
}

.commodity-list { display: flex; flex-direction: column; gap: 6px; }

.commodity-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    padding: 2px 0;
    gap: 8px;
}

.commodity-name { 
    color: var(--text-secondary); 
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.commodity-value { 
    font-family: var(--font-mono); 
    font-weight: 600; 
    color: var(--text-primary); 
    flex-shrink: 0;
}

/* Tablet: Sidebar kleiner */
@media (max-width: 1200px) {
    .content-grid { grid-template-columns: 1fr 200px; gap: 12px; padding: 12px; }
}

/* Notebook/Mobile: Sidebar ausblenden */
@media (max-width: 900px) {
    .content-grid { grid-template-columns: 1fr; }
    .sidebar-right { display: none; }
}

/* Artikel bessere Lesbarkeit */
.article-main { min-width: 0; }
.article-header h1 { font-size: 24px; line-height: 1.3; }
.panel-body { padding: 12px; }
.data-table { font-size: 12px; }
.data-table th, .data-table td { padding: 8px 10px; }

/* Breaking News Banner lesbar machen */
.breaking-banner {
    background: linear-gradient(90deg, #7f1d1d 0%, #991b1b 100%) !important;
}

.breaking-item {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.5);
    font-weight: 500;
}

.breaking-sep {
    color: rgba(255,255,255,0.5) !important;
}

.breaking-label {
    background: rgba(255,255,255,0.15);
    color: #fff;
    border: 1px solid rgba(255,255,255,0.3);
}

.breaking-time {
    color: rgba(255,255,255,0.8) !important;
}
.breaking-banner { background: linear-gradient(90deg, #7f1d1d 0%, #991b1b 100%) !important; }
.breaking-item { color: #ffffff !important; text-shadow: 0 1px 2px rgba(0,0,0,0.5); font-weight: 500; }
.breaking-sep { color: rgba(255,255,255,0.5) !important; }
.breaking-label { background: rgba(255,255,255,0.15); color: #fff; border: 1px solid rgba(255,255,255,0.3); }
.breaking-time { color: rgba(255,255,255,0.8) !important; }
