/* v1.4.5 – uploader/button fix; spinner only after click; author updated */
.mii-assistant-wrapper{ --ink:#e9ecff; --muted:#b6bed6; --accent:#7aa2ff; --card:#151a28; --card-border:#252b3a;
  --panel:#2a2f3d; --panel-light:#2f3444; color:var(--ink); font:inherit; max-width:1100px; margin:0 auto; }
.mii-assistant-wrapper [class^="ma-"], .mii-assistant-wrapper [class*=" ma-"]{ box-sizing:border-box; }
.ma-intro{ max-width:900px; margin:0 auto 12px; text-align:center; font-size:.9em; color:var(--muted) }
.ma-intro h2{ font-size:1.1em; margin:.2em 0 .4em; color:var(--accent) }
.ma-header{ padding:4px 0 10px } .ma-header h1{ margin:0 0 2px; font-size:1.6rem } .ma-sub{ color:var(--muted); margin:0 }
.ma-grid{ display:grid; gap:16px; grid-template-columns:1fr }
.ma-card{ background: radial-gradient(1200px 600px at 10% 0%, #1a2030 0%, var(--card) 35%, #101522 100%); border:1px solid var(--card-border); border-radius:16px; padding:16px }
.ma-title{ display:flex; align-items:center; gap:12px; }
.ma-title h2{ flex:1 }
.ma-badge{ display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:#1b2233; border:1px solid #2e3b58; color:var(--muted); font-size:12px }
.ma-flagOk{ padding:6px 10px; border-radius:999px; background:#102a1a; border:1px solid #1e6b45; color:#83f0b7; font-weight:700; font-size:12px }
.ma-ok{ color:#36d399 }
.ma-row{ display:flex; gap:12px; align-items:center; flex-wrap:wrap } .ma-space-between{ justify-content:space-between }
.ma-btn{ appearance:none; border:1px solid #3a4566; background:#232a3c; color:inherit; padding:10px 14px; border-radius:10px; cursor:pointer; font-weight:600 }
.ma-primary{ background:linear-gradient(180deg, hsl(228 100% 63%), hsl(228 75% 54%)); border-color:hsl(228 75% 48%); color:white }
.ma-btn[disabled]{ opacity:.6; cursor:not-allowed }
.ma-ghost{ background:transparent }
/* uploader */
.ma-uploader{ border:1px dashed #5a6689; padding:18px; border-radius:14px; text-align:center; position:relative; background:var(--panel-light); }
.ma-up-inner{ display:flex; align-items:center; justify-content:center; gap:14px; flex-wrap:wrap }
.ma-up-icon{ font-size:28px }
.ma-up-text{ line-height:1.1 }
.ma-file-sub{ margin-top:10px; color:#cdd4ea; font-size:.85em }
/* split/preview/overlay */
.ma-split{ display:grid; gap:12px; grid-template-columns:1fr 1fr }
.ma-preview-wrap{ position:relative; background:var(--panel-light); border-radius:12px; padding:6px }
.ma-overlay-wrap{ position:relative; background:var(--panel-light); border-radius:12px; padding:6px }
.ma-preview, .mii-assistant-wrapper canvas{ width:100%; height:auto; max-height:420px; object-fit:contain; background:var(--panel-light); border-radius:8px }
/* ensure hidden works in all themes */
.ma-loader[hidden]{ display:none !important; }
.ma-loader{ position:absolute; inset:6px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; background:rgba(10,12,18,.55); border-radius:8px; backdrop-filter: blur(2px); }
.ma-spinner{ width:42px; height:42px; border-radius:999px; border:4px solid rgba(255,255,255,.25); border-top-color:var(--accent); animation:ma-spin 1s linear infinite }
@keyframes ma-spin{ to{ transform: rotate(360deg) } }
.ma-loader-text{ font-size:.9em; color:#e7ecff; text-align:center }
.ma-mini{ font-size:12px; color:#c5cce2 }
.ma-suggestions .ma-group{ margin:10px 0 16px } .ma-suggestions .ma-group h3{ margin:0 0 6px; font-size:1rem }
.ma-options{ display:flex; flex-wrap:wrap; gap:6px }
.ma-option{ border:1px solid var(--accent); background:transparent; color:var(--accent); padding:6px 10px; border-radius:999px; cursor:pointer; font-size:.85em }
.ma-option.is-selected, .ma-option:hover{ background:var(--accent); color:white }
/* svg preview */
svg#ma-mii{ width:100%; height:auto; background:#0b0f24; border-radius:12px }
pre#ma-jsonOut{ width:100%; min-height:140px; background:#0b0f24; color:#dfe6ff; border:1px solid #1f2754; border-radius:12px; padding:12px; font-family:ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size:12px; overflow:auto }
/* steps */
.ma-step{ display:none } .ma-step.is-active{ display:block }
.ma-step-footer{ display:flex; align-items:center; gap:12px; justify-content:flex-end; margin-top:12px; font-size:.85em; color:var(--muted) }
.ma-progressbar{ position:relative; flex:1; height:6px; background:#3a4258; border-radius:4px; overflow:hidden; max-width:220px }
.ma-progress-fill{ background:var(--accent); height:100%; width:0%; transition:width .35s ease }
.ma-step-label{ min-width:88px; text-align:right }
/* sources */
.ma-sources{ margin-top:18px; font-size:.85em; color:var(--muted) } .ma-sources h3{ margin:.2em 0 .4em; color:inherit; font-size:1em } .ma-sources ul{ margin-left:18px }
/* light skin variant (greys) */
.mii-assistant-wrapper[data-skin="light"]{ --ink:#0f1222; --muted:#445; --card:#ffffff; --card-border:#dfe3f4; --panel:#f2f4f8; --panel-light:#eceff6; }
.mii-assistant-wrapper[data-skin="light"] .ma-card{ background:#ffffff; }
.mii-assistant-wrapper[data-skin="light"] .ma-badge{ background:#f4f6fb; border-color:#e0e6f3; color:#556 }
.mii-assistant-wrapper[data-skin="light"] .ma-btn{ background:#f4f6fb; border-color:#dfe6f7; color:#223 }
@media (max-width:900px){ .ma-grid-2{ grid-template-columns:1fr } .ma-split{ grid-template-columns:1fr } }
