:root{
  --dc-primary: #D9D1C3;
  --dc-ink: #F5F5F0;
  --dc-muted: #CFCAC0;
  --dc-paper: #121416;
  --dc-surface: #1A1C1F;
  --dc-line: rgba(235, 229, 214, 0.40);
  --dc-line-dim: rgba(235, 229, 214, 0.18);
  --dc-shadow: rgba(0,0,0,0.25);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;color:var(--dc-ink);
background:repeating-linear-gradient(135deg, rgba(255,255,255,0.015) 0 3px, rgba(255,255,255,0) 3px 9px), radial-gradient(1100px 800px at 10% -10%, #192024, var(--dc-paper)); 
font-family: Georgia, Cambria, "Times New Roman", Times, serif; line-height:1.9; letter-spacing:.1px }
img{max-width:100%;height:auto;display:block}
a{color:var(--dc-primary);text-decoration:none;border-bottom:1px dotted transparent;transition:border-color .2s ease,color .2s ease}
a:hover{color:#fff;border-color:var(--dc-primary)}
.dc-header{position:sticky;top:0;z-index:40;background:#15181A;border-bottom:1px dotted var(--dc-line-dim)}
.dc-brand{display:flex;align-items:center;gap:10px;padding:10px 16px;max-width:1120px;margin:0 auto}
.dc-brand img{width:220px;height:auto;filter:none}
.dc-nav-wrap{background:linear-gradient(180deg, #171A1D, #141619);border-bottom:1px dotted var(--dc-line-dim)}
.dc-nav{display:flex;gap:12px;align-items:center;justify-content:flex-end;max-width:1120px;margin:0 auto;padding:10px 16px;flex-wrap:wrap}
.dc-nav a{padding:6px 8px;border-radius:2px;color:var(--dc-muted);position:relative}
.dc-nav a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:2px;background:var(--dc-primary);transform:scaleX(0);transform-origin:center;transition:transform .22s ease}
.dc-nav a:hover::after{transform:scaleX(1)}
.dc-nav a.dc-active{color:#fff}
.dc-nav a.dc-active::after{transform:scaleX(1)}
.dc-container{max-width:1120px;margin:0 auto;padding:24px 16px;display:grid;grid-template-columns: 280px 1fr;gap:24px}
.dc-sidebar{border:1px dotted var(--dc-line-dim);background:var(--dc-surface);padding:14px;border-radius:2px}
.dc-content{min-width:0}
h1{font-size:2.2rem;margin:12px 0 6px 0;letter-spacing:.2px}
.dek{font-size:1.06rem;color:var(--dc-muted);margin:0 0 12px 0}
.dc-banner{border:1px solid var(--dc-line);border-radius:2px;overflow:hidden;box-shadow:none;margin:8px 0 14px 0}
.dc-banner figcaption{font-size:.95rem;color:var(--dc-muted);padding:8px 12px;background:rgba(255,255,255,0.03)}
.dc-card{background:var(--dc-surface);border:1px dotted var(--dc-line);border-radius:2px;padding:18px;margin:16px 0;box-shadow:none}
.dc-card h2{font-size:1.24rem;margin:6px 0}
.dc-card h3{font-size:1.02rem;margin:2px 0;color:var(--dc-muted)}
.dc-rule{height:1px;background:linear-gradient(90deg, var(--dc-line) 33%, transparent 0) repeat-x;background-size:6px 1px;margin:24px 0}
.dc-footer{border-top:1px dotted var(--dc-line-dim);color:var(--dc-muted);text-align:center;padding:22px;margin-top:18px}
article p, section p, main p, p { text-align: justify !important; text-justify: inter-word !important; -webkit-hyphens: auto !important; -ms-hyphens: auto !important; hyphens: auto !important; }
@media (max-width: 980px){ .dc-container{grid-template-columns: 1fr; gap:16px} }

/* ===== Media protection add-ons ===== */
img, picture, svg, canvas, video{
  -webkit-user-drag:none !important;
  user-drag:none !important;
  -webkit-touch-callout:none !important;
  -webkit-user-select:none !important;
  -moz-user-select:none !important;
  -ms-user-select:none !important;
  user-select:none !important;
  -webkit-tap-highlight-color:transparent;
}
figure, .dc-banner{ -webkit-touch-callout:none }

/* --- Final Footer Refinement (DustChord / MuseBeat Harmonization) --- */

/* Override global justification for footer */
.dc-footer,
.dc-footer * {
  text-align: center !important;
}

/* Footer layout: centered balance, warm metallic tone */
.dc-footer {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-top: 26px;
  padding-bottom: 26px;
  background: var(--dc-surface);
  border-top: 1px dotted var(--dc-line-dim);
  color: var(--dc-muted);
  box-shadow: 0 -4px 20px rgba(0,0,0,0.25) inset;
}

/* Metrolagu Network (DustChord / MuseBeat palette) */
.metrolagu-network {
  background: none;
  color: var(--dc-ink);
  padding: 22px 0;
}

.network-container {
  max-width: 1120px;
  margin: 0 auto;
  padding: 0 16px;
}

.metrolagu-network h3 {
  font-size: 1.15em;
  margin-bottom: 10px;
  color: #f7c00b; /* Color */
  font-weight: 600;
  text-align: center;
  text-shadow: 0 0 4px rgba(183,201,143,0.25);
}

.metrolagu-network p {
  color: var(--dc-muted);
  margin-bottom: 10px;
  line-height: 1.7;
  text-align: center;
}

/* Network links */
.network-links {
  text-align: center;
}

.network-links a {
  color: var(--dc-ink);
  text-decoration: none;
  border-bottom: 1px dotted rgba(235,229,214,0.25);
  transition: color 0.3s ease, border-color 0.3s ease, opacity 0.3s ease;
}

.network-links a:hover {
  color: #B7C98F;
  border-bottom-color: #B7C98F;
  opacity: 0.85;
}

/* Copyright pill refinement */
.dc-footer .copyright,
.site-footer .copyright {
  display: inline-block;
  margin: 18px auto 6px auto;
  font-weight: 600;
  font-size: 0.95rem;
  letter-spacing: 0.4px;
  color: var(--dc-ink);
  background: rgba(26,28,31,0.85);
  padding: 8px 22px;
  border: 1.5px dotted rgba(235,229,214,0.35);
  border-radius: 999px;
  box-shadow: 0 2px 12px rgba(0,0,0,0.25);
  transition: all 0.3s ease;
}

/* Hover tone: subtle parchment glow */
.dc-footer .copyright:hover {
  background: rgba(245,245,240,0.08);
  color: var(--dc-primary);
  border-color: rgba(235,229,214,0.6);
  box-shadow: 0 3px 16px rgba(245,245,240,0.15);
  transform: translateY(-1px);
}

/* Embedded link inherits tone */
.dc-footer .copyright a {
  color: inherit !important;
  text-decoration: none !important;
  transition: opacity 0.3s ease;
}