@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@600&family=Inter:wght@400;600&display=swap');
:root{
  --bg:#ffffff; --text:#111; --muted:#666; --accent:#111;
  --chip:#f3f3f3; --line:#e8e8e8;
}
.mc-wrap *{box-sizing:border-box}
.mc-wrap{margin:0;padding:1rem;background:var(--bg);color:var(--text);font:16px/1.4 Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial}
.mc-h1{font-family:"Playfair Display",serif;font-size:44px;margin:0 0 .5rem}
.mc-muted{color:var(--muted)}
.mc-grid{display:grid;grid-template-columns:360px 1fr;gap:28px}
@media (max-width:1024px){.mc-grid{grid-template-columns:1fr}}
.mc-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:16px}
.mc-row{display:grid;grid-template-columns:1fr 80px;gap:8px;align-items:center}
.mc-suffix{display:flex;gap:6px}
.mc-suffix span{display:inline-grid;place-items:center;width:36px;height:36px;border:1px solid var(--line);border-radius:8px;font-size:12px;color:#444}
.mc-range-row{display:flex;gap:12px;align-items:center}
.mc-pill{display:inline-block;padding:6px 10px;border-radius:999px;background:var(--chip);font-size:12px}
.mc-toggle{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}
.mc-toggle button{flex:1;padding:10px 12px;border:0;background:#fff;color:#111;font-weight:600;cursor:pointer}
.mc-toggle button.active{background:#111;color:#fff}
.mc-section-title{font-family:"Playfair Display",serif;font-size:42px;margin:10px 0 12px}
.mc-smalltitle{font-size:34px}
.mc-payment{font-size:40px;font-weight:700}
.mc-cols{display:grid;grid-template-columns:1fr 380px;gap:20px}
@media (max-width:1200px){.mc-cols{grid-template-columns:1fr}}
.mc-legend{display:grid;gap:8px;margin-top:8px}
.mc-dot{width:12px;height:12px;border-radius:2px;background:#000;display:inline-block}
.mc-table{width:100%;border-collapse:collapse;margin-top:10px;font-size:14px}
.mc-table td{padding:8px 10px;border-bottom:1px solid var(--line)}
.mc-right{text-align:right}
.mc-hint{font-size:12px;color:var(--muted)}
.mc-bar-legend{font-size:13px;margin-top:6px}
.mc-stack{display:grid;gap:6px}
.mc-small{font-size:12px}
.mc-group{margin-top:10px;padding-top:12px;border-top:1px dashed var(--line)}
.mc-inline{display:flex;gap:8px;flex-wrap:wrap}
.mc-inline>*{flex:1 1 150px}
.mc-flex{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.mc-wrap input[type="number"], .mc-wrap input[type="date"]{
  width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:10px;font-size:14px;background:#fff
}
.mc-wrap label{display:block;font-size:12px;color:var(--muted);margin:12px 0 6px}
.mc-wrap input[type="range"]{width:100%}