
html, body {
    margin: 0;
    min-height: 100%;
    background: #050907;
}
body.mch-flasher-page {
    background: #050907 !important;
    color: #F4F7F5;
    font-family: Arial, Helvetica, sans-serif;
}
.mch-header {
    border-bottom: 1px solid rgba(80,217,38,.2);
    background: #070d09;
}
.mch-header-inner {
    width: min(1280px,92%);
    margin: 0 auto;
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
}
.mch-brand {
    color: #F4F7F5 !important;
    text-decoration: none !important;
    font-size: 24px;
    font-weight: 800;
}
.mch-brand span { color:#50D926; }
.mch-back {
    color:#50D926 !important;
    text-decoration:none !important;
    font-size:14px;
    font-weight:700;
}
.mch-main { width:100%; }
.mch-intro {
    width:min(1000px,92%);
    margin:0 auto;
    padding:64px 0 38px;
    text-align:center;
}
.mch-kicker {
    color:#50D926;
    font-weight:800;
    font-size:14px;
    margin-bottom:10px;
}
.mch-intro h1 {
    margin:0 0 18px;
    color:#F4F7F5;
    font-size:clamp(38px,5vw,64px);
    line-height:1.06;
}
.mch-intro p {
    max-width:820px;
    margin:0 auto;
    color:#A8B0AC;
    font-size:18px;
    line-height:1.65;
}
.mch-browser-note {
    width:min(1000px,92%);
    margin:0 auto 24px;
    padding:16px 18px;
    border:1px solid #d9a926;
    border-radius:10px;
    background:#211b08;
    color:#f6e8ad;
}
.mch-browser-note strong,
.mch-browser-note span { display:block; }
.mch-browser-note span { margin-top:5px; }
.mch-flasher-shell {
    width:min(1280px,96%);
    margin:0 auto;
    min-height:620px;
    padding:0 0 36px;
}
#meshcore-flasher-host {
    min-height:620px;
}
.mch-loading {
    min-height:420px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:12px;
    color:#A8B0AC;
}
.mch-spinner {
    width:26px;
    height:26px;
    border:3px solid rgba(255,255,255,.2);
    border-top-color:#50D926;
    border-radius:50%;
    animation:mch-spin .8s linear infinite;
}
@keyframes mch-spin { to { transform:rotate(360deg); } }

.mch-license {
    width:min(1000px,92%);
    margin:0 auto;
    padding:28px 0 48px;
    border-top:1px solid rgba(80,217,38,.18);
    color:#89948f;
    font-size:13px;
    line-height:1.6;
    text-align:center;
}
.mch-license a { color:#50D926 !important; }

/* MeshCore-Flasher farblich an MeshCore Hessen angleichen */
#meshcore-flasher-host article,
#meshcore-flasher-host .surface-container,
#meshcore-flasher-host .surface-container-low,
#meshcore-flasher-host .surface-container-high {
    --primary:#50D926;
}
#meshcore-flasher-host img.device {
    max-width:100%;
    max-height:250px;
    object-fit:contain;
}
#meshcore-flasher-host .flash-container {
    max-width:1280px;
    margin-inline:auto;
}

@media (max-width:767px) {
    .mch-header-inner { min-height:64px; }
    .mch-brand { font-size:20px; }
    .mch-back { font-size:12px; }
    .mch-intro { padding:44px 0 28px; }
    .mch-intro p { font-size:16px; }
    .mch-flasher-shell { width:100%; padding-inline:8px; }
    .mch-license { padding-bottom:36px; }
}
