.project-scope.mece-app { --gap:12px; }
.project-scope.mece-app .container{ position:relative; z-index:5; padding-top:28px; }
.project-scope.mece-app .page-title{ margin:0 0 6px; font-size:28px; font-weight:800; color:#e2e8f0; letter-spacing:-0.02em; }
.project-scope.mece-app .page-description{ margin:0 0 16px; color:#9aa8bd; font-size:14px; }
.mece-app__top{ margin:18px 0; }
.mece-app__label{ display:block; font-weight:700; margin-bottom:6px; color:#e2e8f0; }
.mece-app__controls{ display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.mece-app__input{ flex:1; min-width:260px; padding:10px 12px; border:1px solid #334155; border-radius:8px; background:#0b1220; color:#e2e8f0; }
.mece-app__btn{ padding:8px 12px; border:1px solid #334155; border-radius:8px; background:#111827; color:#e2e8f0; cursor:pointer; }
.mece-app__btn.warn{ background:#7f1d1d; border-color:#7f1d1d; }
.mece-app__quota{ color:#9aa8bd; font-size:12px; }

.breadcrumbs{ margin:8px 0 14px; color:#9aa8bd; }
.breadcrumbs__item{ color:#e2e8f0; }
.breadcrumbs__sep{ margin:0 6px; }

.mece-app__body{ display:block; }
.mindmap{ border:1px dashed #334155; border-radius:8px; min-height:520px; height:560px; padding:8px; color:#e2e8f0; position:relative; background:#0b1220; margin-bottom:16px; }
.workspace{ width:100%; margin-bottom: 50px; }
.mindmap__canvas{ width:100%; height:100%; }
.mindmap__empty{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
.mindmap__empty-card{ padding:14px 18px; border:1px solid #334155; border-radius:12px; background:#0b1220; color:#9aa8bd; font-weight:600; box-shadow:0 10px 30px rgba(0,0,0,0.35); }
.workspace{ display:flex; flex-direction:column; gap: var(--gap); }

.suggestions{ display:grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--gap); }
.section-header{ grid-column: 1 / -1; font-weight:800; color:#e2e8f0; margin:6px 0; padding:4px 2px; border-bottom:1px solid #334155; display:flex; align-items:center; justify-content:space-between; gap:8px; }
.section-header__actions{ display:flex; align-items:center; gap:8px; }
.suggestion-card{ border:1px solid #334155; border-radius:10px; background:#0b1220; padding:10px; cursor:pointer; }
.suggestion-card.is-visited{ border-color:#f59e0b; }
.suggestion-card__header{ display:flex; align-items:center; gap:8px; }
.suggestion-card__title{ font-weight:700; color:#e2e8f0; }
.badge{ border:1px solid #3b82f6; color:#93c5fd; border-radius:999px; padding:2px 8px; font-size:12px; }
.badge--rec{ border-color:#22c55e; color:#86efac; }
.suggestion-card__desc{ color:#9aa8bd; font-size:13px; margin-top:6px; }

.accordion{ border-top:1px solid #334155; }
.accordion > .section-header{ margin-top:8px; }
.criteria-inline{ display:flex; align-items:center; gap:8px; padding:8px 10px; border-top:1px dashed #334155; }
.criteria-inline__label{ color:#9aa8bd; font-size:12px; }
.criteria-chip{ padding:4px 8px; border:1px solid #334155; border-radius:999px; background:#111827; color:#e2e8f0; cursor:pointer; }
.criteria-chip--rec{ border-color:#22c55e; color:#86efac; }
.criteria-chip.is-visited{ border-color:#f59e0b; color:#fbbf24; }
.accordion__item{ border-bottom:1px solid #334155; }
.accordion__header{ display:flex; align-items:center; gap:10px; padding:10px; cursor:pointer; }
.btn--retry.visited{ border-color:#f59e0b; color:#fbbf24; }
.accordion__label{ color:#e2e8f0; font-weight:700; }
.accordion__hint{ color:#9aa8bd; font-size:12px; }
.accordion__panel{ padding:10px 10px 14px; }
.panel-block{ background:#0b1220; border:1px solid #334155; border-radius:8px; padding:8px 10px; margin-bottom:8px; }
.panel-block__title{ font-weight:700; color:#e2e8f0; margin-bottom:4px; font-size:13px; }
.panel-block__body{ color:#9aa8bd; font-size:13px; }
.loading{ color:#9aa8bd; font-size:13px; padding:10px; }
.loading--center{ padding:20px 10px; }
.mece-tip{ position:fixed; z-index:9999; max-width:340px; background:#0b1220; border:1px solid #334155; color:#e2e8f0; padding:10px 12px; border-radius:10px; box-shadow:0 6px 20px rgba(0,0,0,0.35); pointer-events:none; font-size:13px; }

.mece-app__footer{ margin-top:14px; display:flex; gap:10px; flex-wrap:wrap; }
.mece-app__import input{ display:none; }

@media (max-width: 840px){
  .mece-app__body{ grid-template-columns: 1fr; }
}


