:root{--max:1100px;--brand:#ef5350} *{box-sizing:border-box} html,body{margin:0;padding:0;font:16px/1.5 system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial;color:#111;background:#fafafa} .wrap{max-width:var(--max);margin:auto;padding:16px} a{text-decoration:none;color:inherit} .muted{opacity:.75} .site-header{position:sticky;top:0;z-index:10;background:#fff;border-bottom:1px solid #eee} .site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding:14px 16px} .logo{display:flex;align-items:center;gap:10px;font-weight:800} .logo-ico{font-size:20px} .panel{background:#fff;border:1px solid #eee;border-radius:14px;padding:14px} .panel+.panel{margin-top:16px} h1{font-size:clamp(22px,4vw,32px);margin:6px 0 8px} .sub{margin:0} .controls{display:grid;gap:16px} .drop{background:#ef5350;border-radius:16px;border:2px dashed rgba(255,255,255,.9);display:grid;place-items:center;min-height:220px;text-align:center;color:#fff;padding:14px} .drop.drag{background:#f36a66} .drop .cta{display:inline-block;background:#fff;color:#c62828;padding:10px 14px;border-radius:12px;font-weight:800;margin-top:6px;cursor:pointer} .drop input[type=file]{display:none} .cloud{width:90px;height:90px;opacity:.95;margin-bottom:6px} .toolbar{display:flex;flex-wrap:wrap;gap:12px;align-items:center} .toolbar label{display:flex;flex-direction:column;gap:6px;font-size:14px} .toolbar select,.toolbar input[type=number],.toolbar input[type=text]{padding:10px 12px;border:1px solid #ddd;border-radius:10px;min-width:130px} .btn-row{display:flex;gap:10px;align-items:center} .btn{display:inline-flex;align-items:center;gap:8px;padding:10px 14px;border-radius:12px;border:0;cursor:pointer;font-weight:800} .btn.primary{background:#ef5350;color:#fff} .btn.light{background:#f3f3f3} .progress{height:10px;background:#eee;border-radius:999px;overflow:hidden;margin-top:6px} .progress>b{display:block;height:100%;width:0;background:linear-gradient(90deg,#ef5350,#c62828);transition:width .25s} .grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px} .card{background:#fff;border:1px solid #eee;border-radius:12px;padding:10px;display:flex;flex-direction:column;gap:8px} .thumb{background:#f5f5f5;border-radius:10px;display:grid;place-items:center;aspect-ratio:3/4;overflow:hidden} .thumb img{max-width:100%;height:auto;display:block} .row{display:flex;gap:8px;flex-wrap:wrap} .icon-btn{padding:8px 10px;border-radius:10px;border:1px solid #eee;background:#fff;cursor:pointer} .foot{padding:20px;text-align:center;font-size:13px;color:#000} #backTop{position:fixed;right:16px;bottom:16px;width:44px;height:44px;border-radius:999px;border:0;background:#000;color:#000;font-weight:800;cursor:pointer;box-shadow:0 6px 20px rgba(0,0,0,.18);display:none} @media (max-width:900px){.toolbar{gap:10px}}
/* ===== FORCE RED HEADER + FOOTER (all pages) ===== */
:root{ --brand:#ef5350; }  /* brand color */

.site-header,
header.site-header{
  background:var(--brand) !important;
  border-bottom:0 !important;
}
.site-header .wrap,
.site-header a,
.site-header .logo,
.site-header .logo-ico{
  color:#fff !important;
}
.hamburger span{ background:#fff !important; }  /* mobile bars white */
.site-header .icon-btn{
  background:rgba(255,255,255,.12) !important;
  color:#fff !important;
  border-color:rgba(255,255,255,.25) !important;
}

/* Footer — support both .foot and .footer just in case */
.foot, footer.foot,
.footer, footer.footer{
  background:var(--brand) !important;
  color:#fff !important;
  border-top:0 !important;
}
.foot a, .footer a{ color:#fff !important; text-decoration:underline; }
