:root {
      --bg: #090d13;
      --bg-2: #0d121a;
      --panel: #121923;
      --panel-2: #171f2b;
      --panel-3: #1d2633;
      --border: #273244;
      --border-soft: #1e2938;
      --text: #f5f7fb;
      --muted: #98a4b5;
      --subtle: #6f7a8b;
      --purple: #7c5cff;
      --purple-2: #a58cff;
      --purple-soft: rgba(124, 92, 255, .13);
      --red: #ef3340;
      --red-soft: rgba(239, 51, 64, .12);
      --green: #35c978;
      --green-soft: rgba(53, 201, 120, .12);
      --amber: #f5b83d;
      --amber-soft: rgba(245, 184, 61, .12);
      --blue: #4da3ff;
      --blue-soft: rgba(77, 163, 255, .12);
      --shadow: 0 22px 70px rgba(0,0,0,.28);
      --radius: 14px;
      --radius-sm: 9px;
    }

    * { box-sizing: border-box; }
    html, body { height: 100%; }
    body {
      margin: 0;
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background:
        radial-gradient(circle at 15% 0%, rgba(124,92,255,.08), transparent 28%),
        radial-gradient(circle at 95% 5%, rgba(77,163,255,.05), transparent 26%),
        var(--bg);
      color: var(--text);
      overflow: hidden;
    }

    button, input, select, textarea { font: inherit; }
    button { color: inherit; }
    a { color: inherit; text-decoration: none; }

    .app { display: grid; grid-template-columns: 226px 1fr; height: 100vh; }

    .sidebar {
      border-right: 1px solid var(--border-soft);
      background: linear-gradient(180deg, #0b1017 0%, #0c1118 100%);
      display: flex;
      flex-direction: column;
      min-width: 0;
    }

    .brand {
      height: 72px;
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 0 19px;
      border-bottom: 1px solid var(--border-soft);
    }

    .logo {
      width: 38px;
      height: 38px;
      border-radius: 11px;
      background: linear-gradient(145deg, #ff3b47, #b40010);
      display: grid;
      place-items: center;
      font-weight: 900;
      letter-spacing: -2px;
      transform: rotate(-5deg);
      box-shadow: 0 8px 24px rgba(239,51,64,.25);
    }
    .brand-copy strong { display: block; font-size: 14px; letter-spacing: .2px; }
    .brand-copy span { color: var(--muted); font-size: 11px; }

    .nav {
      padding: 14px 10px;
      overflow: auto;
      scrollbar-width: thin;
      flex: 1;
    }
    .nav-section { margin: 10px 8px 7px; color: var(--subtle); font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
    .nav-item {
      width: 100%;
      border: 0;
      background: transparent;
      display: flex;
      align-items: center;
      gap: 11px;
      padding: 10px 11px;
      border-radius: 9px;
      color: #c6cfdb;
      cursor: pointer;
      text-align: left;
      margin: 2px 0;
      transition: .18s ease;
      position: relative;
    }
    .nav-item:hover { background: rgba(255,255,255,.045); color: white; }
    .nav-item.active { background: var(--purple-soft); color: #d9d0ff; }
    .nav-item.active::before {
      content: "";
      position: absolute;
      left: -10px;
      width: 3px;
      height: 24px;
      border-radius: 0 6px 6px 0;
      background: var(--purple);
    }
    .nav-icon { width: 20px; text-align: center; opacity: .95; }
    .nav-badge { margin-left: auto; min-width: 20px; height: 20px; border-radius: 999px; display: grid; place-items: center; background: var(--purple); color: white; font-size: 10px; padding: 0 6px; }

    .account {
      margin: 10px;
      border: 1px solid var(--border-soft);
      border-radius: 12px;
      background: rgba(255,255,255,.025);
      padding: 12px;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .avatar { width: 36px; height: 36px; border-radius: 50%; background: linear-gradient(145deg, var(--purple), #4d2ed6); display: grid; place-items: center; font-weight: 700; }
    .account-copy { min-width: 0; flex: 1; }
    .account-copy strong { display: block; font-size: 12px; }
    .account-copy span { display: block; font-size: 11px; color: var(--muted); margin-top: 2px; }

    .workspace { min-width: 0; display: grid; grid-template-rows: 72px 1fr; }
    .topbar {
      border-bottom: 1px solid var(--border-soft);
      display: flex;
      align-items: center;
      gap: 18px;
      padding: 0 24px;
      background: rgba(9,13,19,.84);
      backdrop-filter: blur(12px);
    }
    .search {
      width: min(520px, 45vw);
      height: 39px;
      border: 1px solid var(--border);
      background: #111821;
      border-radius: 9px;
      display: flex;
      align-items: center;
      padding: 0 12px;
      gap: 9px;
    }
    .search input { flex: 1; border: 0; outline: 0; background: transparent; color: white; min-width: 0; }
    .search input::placeholder { color: var(--subtle); }
    .shortcut { font-size: 10px; color: var(--muted); border: 1px solid var(--border); padding: 3px 6px; border-radius: 5px; }
    .top-actions { margin-left: auto; display: flex; align-items: center; gap: 10px; }
    .top-icon { width: 36px; height: 36px; border-radius: 9px; border: 1px solid transparent; background: transparent; cursor: pointer; color: var(--muted); }
    .top-icon:hover { border-color: var(--border); color: white; background: rgba(255,255,255,.035); }
    .team-select { height: 38px; border: 1px solid var(--border); background: #111821; color: #dbe3ed; border-radius: 9px; padding: 0 12px; }

    .main {
      overflow: auto;
      padding: 22px 24px 34px;
      scrollbar-color: #2b3646 transparent;
    }
    .page { display: none; animation: fade .18s ease; }
    .page.active { display: block; }
    @keyframes fade { from { opacity: .25; transform: translateY(4px); } to { opacity: 1; transform: translateY(0); } }

    .page-head { display: flex; align-items: flex-start; gap: 18px; margin-bottom: 18px; }
    .page-head .copy { flex: 1; min-width: 0; }
    .eyebrow { color: var(--purple-2); font-size: 11px; margin-bottom: 7px; }
    h1 { font-size: 24px; margin: 0; letter-spacing: -.02em; }
    .subtitle { color: var(--muted); margin: 7px 0 0; font-size: 13px; }
    .head-actions { display: flex; gap: 9px; align-items: center; }

    .btn {
      min-height: 38px;
      border: 1px solid var(--border);
      background: #131b25;
      color: #dce4ee;
      padding: 0 14px;
      border-radius: 9px;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      transition: .16s ease;
      white-space: nowrap;
    }
    .btn:hover { transform: translateY(-1px); border-color: #3a475c; background: #182230; }
    .btn.primary { background: linear-gradient(135deg, #7455f4, #8a66ff); border-color: #8f70ff; color: white; box-shadow: 0 10px 26px rgba(124,92,255,.24); }
    .btn.danger { background: var(--red-soft); border-color: rgba(239,51,64,.35); color: #ff8f97; }
    .btn.success { background: var(--green-soft); border-color: rgba(53,201,120,.34); color: #7ee0a5; }
    .btn.ghost { background: transparent; }
    .btn.small { min-height: 32px; padding: 0 11px; font-size: 12px; }
    .btn.icon { width: 34px; min-width: 34px; padding: 0; }

    .card {
      background: linear-gradient(180deg, rgba(23,31,43,.96), rgba(18,25,35,.96));
      border: 1px solid var(--border-soft);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
    }
    .card.flat { box-shadow: none; }
    .card-head { padding: 17px 18px 0; display: flex; align-items: center; gap: 10px; }
    .card-head h2 { margin: 0; font-size: 15px; }
    .card-head .spacer { flex: 1; }
    .card-body { padding: 17px 18px 18px; }

    .stats { display: grid; grid-template-columns: repeat(5, minmax(0,1fr)); gap: 12px; margin-bottom: 14px; }
    .stat { padding: 16px; min-height: 125px; position: relative; overflow: hidden; }
    .stat::after { content:""; position:absolute; width:90px; height:90px; border-radius:50%; right:-36px; top:-36px; background: rgba(124,92,255,.08); }
    .stat-label { color: #cad3de; font-size: 12px; display: flex; align-items: center; gap: 8px; }
    .stat-value { font-size: 30px; font-weight: 750; margin-top: 14px; }
    .stat-foot { margin-top: 10px; font-size: 11px; color: var(--muted); }
    .good { color: var(--green); }
    .warn { color: var(--amber); }
    .bad { color: #ff6973; }

    .dash-grid { display: grid; grid-template-columns: 1.05fr 1.05fr .9fr; gap: 14px; margin-bottom: 14px; }
    .dash-grid.lower { grid-template-columns: 1.15fr 1fr 1fr; }
    .chart-shell { min-height: 255px; }
    .donut-wrap { display: grid; grid-template-columns: 160px 1fr; gap: 18px; align-items: center; }
    .donut {
      width: 148px; height: 148px; border-radius: 50%;
      background: conic-gradient(var(--green) 0 65%, var(--amber) 65% 81%, var(--red) 81% 84%, var(--blue) 84% 100%);
      position: relative; display: grid; place-items: center;
    }
    .donut::after { content:""; width: 95px; height: 95px; border-radius: 50%; background: #151d28; border: 1px solid var(--border-soft); position: absolute; }
    .donut span { z-index: 1; text-align: center; }
    .donut strong { display: block; font-size: 24px; }
    .donut small { color: var(--muted); }
    .legend { display: grid; gap: 10px; }
    .legend-row { display: grid; grid-template-columns: 10px 1fr auto; gap: 9px; align-items: center; font-size: 12px; }
    .dot { width: 8px; height: 8px; border-radius: 50%; }

    .bar-list { display: grid; gap: 15px; }
    .bar-row { font-size: 12px; }
    .bar-top { display: flex; gap: 10px; margin-bottom: 6px; }
    .bar-top span:last-child { margin-left: auto; color: var(--muted); }
    .bar { height: 5px; background: #222c3a; border-radius: 999px; overflow: hidden; }
    .bar i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--purple), #9b7aff); }

    .list { display: grid; }
    .list-row { display: grid; grid-template-columns: 1fr auto; gap: 14px; padding: 13px 0; border-bottom: 1px solid var(--border-soft); align-items: center; }
    .list-row:last-child { border-bottom: 0; }
    .list-title { font-size: 12px; display: flex; align-items: center; gap: 8px; }
    .list-meta { font-size: 11px; color: var(--muted); margin-top: 4px; }
    .date { font-size: 11px; color: var(--muted); white-space: nowrap; }

    .badge { display: inline-flex; align-items: center; justify-content: center; gap: 5px; min-height: 22px; border-radius: 6px; padding: 0 8px; font-size: 10px; text-transform: uppercase; letter-spacing: .035em; border: 1px solid transparent; }
    .badge.approved { color: #6fdfa0; background: var(--green-soft); border-color: rgba(53,201,120,.32); }
    .badge.pending { color: #ffd06d; background: var(--amber-soft); border-color: rgba(245,184,61,.35); }
    .badge.rejected { color: #ff8089; background: var(--red-soft); border-color: rgba(239,51,64,.35); }
    .badge.external { color: #a997ff; background: var(--purple-soft); border-color: rgba(124,92,255,.36); }
    .badge.internal { color: #7cbcff; background: var(--blue-soft); border-color: rgba(77,163,255,.34); }
    .badge.local { color: #6fdfa0; background: var(--green-soft); border-color: rgba(53,201,120,.32); text-transform:none; }
    .badge.nonlocal { color: #ff8e96; background: var(--red-soft); border-color: rgba(239,51,64,.32); text-transform:none; }
    .badge.role { text-transform:none; color:#d7deea; background:#202a38; border-color:#303c4d; }

    .toolbar { display: flex; gap: 9px; margin-bottom: 13px; flex-wrap: wrap; }
    .toolbar .grow { flex: 1; min-width: 230px; }
    .input, .select, .textarea {
      width: 100%; border: 1px solid var(--border); background: #111821; color: #edf2f8;
      border-radius: 8px; outline: none; transition: .16s ease;
    }
    .input, .select { height: 40px; padding: 0 11px; }
    .textarea { min-height: 94px; resize: vertical; padding: 10px 11px; line-height: 1.45; }
    .input:focus, .select:focus, .textarea:focus { border-color: var(--purple); box-shadow: 0 0 0 3px rgba(124,92,255,.11); }
    .input::placeholder, .textarea::placeholder { color: #667285; }
    .field { display: grid; gap: 7px; min-width: 0; }
    .field label { font-size: 11px; font-weight: 650; color: #dce3ec; }
    .field label .req { color: #ff5d68; }
    .help { font-size: 10px; color: var(--muted); line-height: 1.35; }
    .field-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 14px; }
    .field-grid.three { grid-template-columns: repeat(3, minmax(0,1fr)); }
    .span-2 { grid-column: 1 / -1; }

    .table-wrap { overflow: auto; }
    table { width: 100%; border-collapse: collapse; min-width: 920px; }
    th { text-align: left; font-size: 10px; color: var(--muted); font-weight: 600; padding: 10px 12px; border-bottom: 1px solid var(--border); }
    td { padding: 12px; font-size: 12px; border-bottom: 1px solid var(--border-soft); vertical-align: middle; }
    tbody tr { transition: .14s ease; cursor: pointer; }
    tbody tr:hover { background: rgba(255,255,255,.025); }
    .row-title strong { display: block; font-size: 12px; }
    .row-title span { display: block; margin-top: 4px; color: var(--muted); font-size: 10px; }
    .table-actions { display: flex; gap: 5px; }

    .tabs { display: flex; gap: 7px; border-bottom: 1px solid var(--border-soft); margin-bottom: 14px; overflow-x: auto; }
    .tab { border: 0; background: transparent; color: var(--muted); padding: 11px 12px; cursor: pointer; position: relative; white-space: nowrap; }
    .tab.active { color: #d9d0ff; }
    .tab.active::after { content:""; position:absolute; left:6px; right:6px; bottom:-1px; height:2px; background: var(--purple); border-radius: 4px 4px 0 0; }

    .wizard { display: flex; align-items: center; gap: 0; padding: 14px; margin-bottom: 14px; }
    .wizard-step { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 11px; }
    .wizard-step .num { width: 28px; height: 28px; border-radius: 50%; border: 1px solid var(--border); display: grid; place-items: center; background: #131b25; }
    .wizard-step.active { color: #e7e2ff; }
    .wizard-step.active .num { background: var(--purple); border-color: var(--purple); color: white; }
    .wizard-step.done .num { background: var(--green-soft); border-color: rgba(53,201,120,.35); color: #73dda0; }
    .wizard-line { flex: 1; height: 1px; background: var(--border); margin: 0 12px; min-width: 18px; }

    .form-layout { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(300px, .8fr); gap: 14px; }
    .stack { display: grid; gap: 14px; align-content: start; }
    .callout { border: 1px solid rgba(124,92,255,.36); background: var(--purple-soft); border-radius: 10px; padding: 12px; color: #cfc5ff; font-size: 11px; line-height: 1.45; }
    .callout.blue { border-color: rgba(77,163,255,.35); background: var(--blue-soft); color: #b9d7ff; }
    .callout.warn { border-color: rgba(245,184,61,.35); background: var(--amber-soft); color: #ffe0a1; }

    .choice-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 9px; }
    .choice { border: 1px solid var(--border); background: #111821; padding: 11px; border-radius: 9px; cursor: pointer; display: flex; gap: 10px; align-items: flex-start; }
    .choice input { margin-top: 3px; accent-color: var(--purple); }
    .choice strong { display: block; font-size: 11px; }
    .choice span { display: block; color: var(--muted); font-size: 10px; margin-top: 4px; line-height: 1.35; }
    .choice:has(input:checked) { border-color: var(--purple); background: var(--purple-soft); }

    .tagbox { min-height: 42px; display: flex; gap: 6px; flex-wrap: wrap; align-items: center; border: 1px solid var(--border); background: #111821; border-radius: 8px; padding: 6px; }
    .tag { display: inline-flex; align-items: center; gap: 5px; border-radius: 6px; background: #252f3f; border: 1px solid #313d50; padding: 5px 7px; font-size: 10px; }
    .tag button { border: 0; background: transparent; color: var(--muted); cursor: pointer; padding: 0; }
    .tag-input { border: 0; outline: 0; background: transparent; color: white; min-width: 140px; flex: 1; }

    .step-list { display: grid; gap: 9px; }
    .solution-row { border: 1px solid var(--border); background: #111821; border-radius: 10px; padding: 12px; display: grid; grid-template-columns: 34px 1fr auto; gap: 11px; align-items: center; }
    .solution-row.active { border-color: var(--purple); background: var(--purple-soft); }
    .step-num { width: 30px; height: 30px; border-radius: 8px; background: #202a38; display: grid; place-items: center; font-weight: 700; font-size: 11px; }
    .solution-copy strong { display: block; font-size: 12px; }
    .solution-copy span { display: block; color: var(--muted); font-size: 10px; margin-top: 4px; }
    .solution-meta { display: flex; gap: 5px; flex-wrap: wrap; justify-content: flex-end; }

    .preview-card { border: 1px solid var(--border); background: #0f161f; border-radius: 11px; padding: 15px; }
    .preview-card h3 { margin: 0; font-size: 14px; }
    .preview-card p { color: var(--muted); font-size: 11px; line-height: 1.5; }
    .preview-line { display: flex; gap: 7px; margin-top: 11px; flex-wrap: wrap; }

    .review-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
    .review-item { padding: 14px; display: grid; gap: 11px; }
    .review-top { display:flex; align-items:flex-start; gap:12px; }
    .review-icon { width:34px; height:34px; border-radius:9px; display:grid; place-items:center; background:var(--purple-soft); color:#b5a5ff; }
    .review-copy { flex:1; min-width:0; }
    .review-copy strong { display:block; font-size:12px; }
    .review-copy span { display:block; color:var(--muted); font-size:10px; margin-top:4px; }
    .review-actions { display:flex; gap:8px; justify-content:flex-end; }

    .empty { padding: 40px 20px; text-align: center; color: var(--muted); }
    .empty .big { font-size: 32px; margin-bottom: 8px; }

    .toast {
      position: fixed; right: 24px; bottom: 24px; z-index: 30;
      min-width: 280px; max-width: 420px; padding: 13px 15px;
      border-radius: 10px; background: #182130; border: 1px solid var(--border);
      box-shadow: var(--shadow); transform: translateY(20px); opacity: 0; pointer-events: none;
      transition: .22s ease; font-size: 12px;
    }
    .toast.show { transform: translateY(0); opacity: 1; }
    .toast.success { border-color: rgba(53,201,120,.4); }
    .toast.error { border-color: rgba(239,51,64,.4); }

    .modal-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.68); display: none; align-items: center; justify-content: center; z-index: 40; padding: 20px; }
    .modal-backdrop.show { display:flex; }
    .modal { width: min(720px, 96vw); max-height: 88vh; overflow: auto; }
    .modal .card-head { padding-bottom: 14px; border-bottom: 1px solid var(--border-soft); }
    .modal-footer { display:flex; gap:9px; justify-content:flex-end; padding: 0 18px 18px; }

    .mobile-overlay { display:none; }

    @media (max-width: 1180px) {
      .stats { grid-template-columns: repeat(3, minmax(0,1fr)); }
      .dash-grid, .dash-grid.lower { grid-template-columns: 1fr 1fr; }
      .dash-grid > :last-child, .dash-grid.lower > :last-child { grid-column: 1 / -1; }
      .form-layout { grid-template-columns: 1fr; }
    }
    @media (max-width: 820px) {
      body { overflow:auto; }
      .app { grid-template-columns: 1fr; height:auto; min-height:100vh; }
      .sidebar { position: fixed; left:0; top:0; bottom:0; width:226px; z-index:50; transform:translateX(-100%); transition:.2s ease; }
      .sidebar.open { transform:translateX(0); }
      .workspace { grid-template-rows:64px 1fr; min-height:100vh; }
      .main { overflow:visible; padding:18px 14px 30px; }
      .topbar { padding:0 14px; }
      .mobile-toggle { display:block !important; }
      .search { width:100%; }
      .team-select { display:none; }
      .stats { grid-template-columns: 1fr 1fr; }
      .dash-grid, .dash-grid.lower, .review-grid { grid-template-columns:1fr; }
      .dash-grid > :last-child, .dash-grid.lower > :last-child { grid-column:auto; }
      .field-grid, .field-grid.three { grid-template-columns:1fr; }
      .span-2 { grid-column:auto; }
      .page-head { flex-direction:column; }
      .head-actions { width:100%; flex-wrap:wrap; }
      .wizard-step span { display:none; }
      .donut-wrap { grid-template-columns:1fr; justify-items:center; }
    }

/* ===== Real MVP integration additions ===== */
html, body { min-height: 100%; }
body { overflow: hidden; }
form { margin: 0; }
.nav-item { text-decoration: none; }
.nav-item:hover { text-decoration: none; }
.sidebar .brand { text-decoration: none; color: inherit; }
.account { text-decoration: none; color: inherit; }
.main .page-shell { animation: fade .18s ease; }
.page-head { align-items: center; }
.page-head .head-actions form { display: inline-flex; }
.page-head .head-actions { flex-wrap: wrap; }
.page-head h1 { color: var(--text); text-shadow: none; font-size: 24px; }
.main h2 { color: var(--text); font-size: 15px; letter-spacing: 0; margin: 0; }
.main h3 { color: var(--text); font-size: 13px; margin: 0; }
.main a { color: inherit; }
.main a:hover { text-decoration: none; }
.muted { color: var(--muted); font-size: 11px; line-height: 1.45; }
.meta { color: var(--muted); font-size: 10px; line-height: 1.45; }
.card { margin: 0; padding: 0; }
.card + .card { margin-top: 0; }
.card-body > :first-child { margin-top: 0; }
.card-body > :last-child { margin-bottom: 0; }
.content-stack { display: grid; gap: 14px; }
.section-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.three-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 14px; }
.action-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.action-row.end { justify-content: flex-end; }
.action-row.between { justify-content: space-between; }
.inline-form { display: inline-flex; align-items: center; gap: 7px; flex-wrap: wrap; }
.inline-form .input, .inline-form .select { width: auto; min-width: 140px; }
.field input[type="checkbox"] { width: auto; height: auto; accent-color: var(--purple); }
.checkbox-line { display: flex; align-items: center; gap: 8px; min-height: 40px; }
.checkbox-line input { width: auto; margin: 0; accent-color: var(--purple); }
.input[type="file"] { padding: 8px 10px; height: auto; }
button.btn { font: inherit; }
a.btn:hover { text-decoration: none; }
.table-wrap table { margin: 0; background: transparent; border-radius: 0; }
.table-wrap tbody tr:last-child td { border-bottom: 0; }
.table-wrap td a { color: #ece9ff; }
.table-wrap td a:hover { color: var(--purple-2); }
.problem-title-link { font-weight: 700; }
.description-cell { max-width: 420px; color: #cbd4e0; line-height: 1.45; }
.empty-state { padding: 34px 18px; text-align: center; color: var(--muted); }
.empty-state .big { font-size: 30px; margin-bottom: 7px; }
.status-approved { color: #6fdfa0; background: var(--green-soft); border-color: rgba(53,201,120,.32); }
.status-pending { color: #ffd06d; background: var(--amber-soft); border-color: rgba(245,184,61,.35); }
.status-rejected, .status-delete_requested { color: #ff8089; background: var(--red-soft); border-color: rgba(239,51,64,.35); }
.status-draft { color: #b9d7ff; background: var(--blue-soft); border-color: rgba(77,163,255,.34); }
.scope-external { color: #6fdfa0; background: var(--green-soft); border-color: rgba(53,201,120,.32); text-transform: none; }
.scope-internal { color: #a997ff; background: var(--purple-soft); border-color: rgba(124,92,255,.36); text-transform: none; }
.tag-list { display: flex; flex-wrap: wrap; gap: 5px; }
.thumb { width: 100%; max-width: 280px; max-height: 190px; object-fit: contain; border-radius: 9px; border: 1px solid var(--border); background: #0d131c; }
.media-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 12px; }
.media-card { border: 1px solid var(--border); background: #101720; border-radius: 10px; padding: 12px; }
.media-card img { margin-top: 10px; }
details.admin-panel, details.solution-edit { border: 1px solid var(--border-soft); border-radius: 10px; background: #111821; overflow: hidden; }
details.admin-panel > summary, details.solution-edit > summary { list-style: none; cursor: pointer; padding: 12px 14px; color: #dce4ee; font-size: 12px; font-weight: 650; }
details.admin-panel > summary::-webkit-details-marker, details.solution-edit > summary::-webkit-details-marker { display: none; }
details.admin-panel[open] > summary, details.solution-edit[open] > summary { border-bottom: 1px solid var(--border-soft); background: rgba(124,92,255,.06); }
details.admin-panel .details-body, details.solution-edit .details-body { padding: 14px; }
.solution-list { display: grid; gap: 10px; }
.solution-entry { border: 1px solid var(--border); background: #111821; border-radius: 10px; padding: 13px; }
.solution-entry .solution-head { display: grid; grid-template-columns: 34px 1fr auto; gap: 11px; align-items: start; }
.solution-entry .solution-copy p { color: #cbd4e0; font-size: 12px; line-height: 1.5; margin: 5px 0 0; }
.stat a { display: block; }
.stat a:hover { text-decoration: none; }
.stat .stat-value { color: var(--text); }
.top-search-form { width: min(520px,45vw); margin: 0; }
.top-search-form .search { width: 100%; }
.top-search-form button { border: 0; background: transparent; color: var(--muted); cursor: pointer; padding: 0; }
.top-search-form button:hover { color: white; }
.account .avatar { flex: 0 0 auto; }
.account-copy strong, .account-copy span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.logout-link { color: var(--muted); font-size: 16px; }
.logout-link:hover { color: #fff; }
.login-body { overflow: auto; min-height: 100vh; background: radial-gradient(circle at 15% 0%, rgba(124,92,255,.10), transparent 32%), var(--bg); }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 24px; }
.login-card { width: min(430px,96vw); padding: 0; }
.login-brand { display:flex; align-items:center; gap:12px; padding:18px; border-bottom:1px solid var(--border-soft); }
.login-content { padding: 20px; }
.login-content .btn { width: 100%; margin-top: 4px; }
.login-title { font-size: 20px; margin: 0; }
.login-subtitle { color: var(--muted); font-size: 12px; margin: 5px 0 0; }
.tab-panel { display: none; }
.tab-panel.active { display: block; animation: fade .16s ease; }
.tabs.sticky-tabs { position: sticky; top: 0; z-index: 3; background: rgba(9,13,19,.94); backdrop-filter: blur(8px); }
.review-card { padding: 14px; display: grid; gap: 11px; }
.review-card .review-actions form { display: inline-flex; }
.review-note-form { display: grid; grid-template-columns: 1fr auto; gap: 8px; margin-top: 8px; }
.review-note-form .input { margin: 0; }
.role-chip { display:inline-flex; align-items:center; min-height:22px; padding:0 8px; border-radius:6px; font-size:10px; color:#d7deea; background:#202a38; border:1px solid #303c4d; }
.mobile-toggle { display:none; }

@media (max-width: 1180px) {
  .section-grid, .three-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
  .top-search-form { width: 100%; }
  .mobile-toggle { display:block; }
  .solution-entry .solution-head { grid-template-columns: 34px 1fr; }
  .solution-entry .solution-head > :last-child { grid-column: 2; justify-self: start; }
  .review-note-form { grid-template-columns: 1fr; }
}