:root{
  --bg:#050b07;
  --b:#0e3a22;
  --b2:#144b2c;
  --txt:#b9ffd1;
  --muted:#6ddf97;
  --hi:#20ff74;
  --warn:#ffd66d;
  --bad:#ff6d6d;
  --shadow:0 10px 30px rgba(0,0,0,.45);
}

*{ box-sizing:border-box; }

body{
  margin:0;
  background:
    radial-gradient(1200px 700px at 30% -10%, rgba(32,255,116,.10), transparent 60%),
    radial-gradient(900px 600px at 90% 20%, rgba(32,255,116,.08), transparent 60%),
    linear-gradient(180deg, #030805 0%, var(--bg) 100%);
  color:var(--txt);
  font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Arial,sans-serif;
  padding:14px;
  min-height:100vh;
}

.wrap{ max-width:1280px; margin:0 auto; }

.top{
  display:flex;
  gap:10px;
  align-items:center;
  justify-content:space-between;
  padding:14px;
  border:1px solid var(--b);
  border-radius:18px;
  background:linear-gradient(180deg, rgba(10,40,24,.55), rgba(5,14,9,.55));
  box-shadow:var(--shadow);
  position:sticky;
  top:10px;
  z-index:10;
  backdrop-filter:blur(8px);
}

.brandBlock{ display:flex; align-items:center; gap:14px; }
.logoWrap{
  width:78px; min-width:78px; height:78px; display:flex; align-items:center; justify-content:center;
  border:1px solid rgba(32,255,116,.18); border-radius:16px; background:rgba(0,0,0,.22); overflow:hidden;
}
.bigLogoWrap{ width:96px; min-width:96px; height:96px; }
.logoChilquinta{ max-width:90%; max-height:90%; object-fit:contain; }
.logoFallback{
  width:100%; height:100%; display:flex; align-items:center; justify-content:center;
  font-weight:800; font-size:12px; color:var(--hi); letter-spacing:.8px;
}
.top h1{ font-size:18px; margin:0; color:var(--hi); }
.top small{ display:block; color:var(--muted); margin-top:4px; font-size:13px; }
.badge{
  display:flex; align-items:center; gap:8px; padding:8px 10px; border:1px solid var(--b2);
  border-radius:999px; background:rgba(0,0,0,.25); color:var(--muted); font-size:12px;
}
.badge b{ color:var(--hi); }
.grid{ margin-top:12px; display:grid; grid-template-columns:1.1fr .9fr; gap:12px; }

.card, .menuCard{
  border:1px solid var(--b); border-radius:18px;
  background:linear-gradient(180deg, rgba(9,32,20,.60), rgba(3,10,6,.55));
  box-shadow:var(--shadow); overflow:hidden;
}
.card .hd{ padding:12px 14px; border-bottom:1px solid rgba(32,255,116,.12); display:flex; align-items:center; justify-content:space-between; gap:10px; }
.card .hd h2{ margin:0; font-size:14px; color:var(--hi); }
.card .bd{ padding:14px; }

.row{ display:grid; grid-template-columns:repeat(12,1fr); gap:10px; margin-bottom:10px; }
.f{ grid-column:span 12; }
.c2{ grid-column:span 6; }
.c3{ grid-column:span 4; }
.c4{ grid-column:span 3; }

label{ display:block; font-size:11px; color:var(--muted); margin:0 0 6px 2px; }
input,select,textarea,button{
  width:100%; border-radius:12px; border:1px solid rgba(32,255,116,.18);
  background:rgba(0,0,0,.30); color:var(--txt); padding:10px; font-size:14px; outline:none;
}
input::placeholder, textarea::placeholder{ color:rgba(109,223,151,.65); }
input:focus, select:focus, textarea:focus{
  border-color:rgba(32,255,116,.55); box-shadow:0 0 0 3px rgba(32,255,116,.12);
}
textarea{
  min-height:620px; resize:vertical; line-height:1.3;
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace; font-size:12.5px;
}
.commentBox{ min-height:140px; font-family:inherit; font-size:14px; line-height:1.35; }
.btns, .menuActions{ display:flex; gap:10px; flex-wrap:wrap; }
.btn{
  cursor:pointer; border:1px solid rgba(32,255,116,.25); background:rgba(0,0,0,.25);
  transition:.15s transform,.15s border-color; font-weight:600;
}
.btn:hover{ transform:translateY(-1px); border-color:rgba(32,255,116,.55); }
.btn:active{ transform:translateY(0); }
.btn.primary{ background:rgba(32,255,116,.10); }
.btn.danger{ border-color:rgba(255,109,109,.35); }
.btn.danger:hover{ border-color:rgba(255,109,109,.75); }
.btn[disabled]{ opacity:.45; cursor:not-allowed; transform:none; }
.hint{ margin-top:10px; font-size:12px; color:rgba(109,223,151,.85); }
.pill{
  display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px;
  border:1px solid rgba(32,255,116,.18); color:var(--muted); font-size:12px; background:rgba(0,0,0,.22);
}
.sep{ height:1px; background:rgba(32,255,116,.12); margin:12px 0; }
.hide{ display:none !important; }
.checkboxLine{ display:flex; align-items:center; }
.toggleLabel{ display:flex; align-items:center; gap:10px; font-size:14px; color:var(--txt); cursor:pointer; }
.toggleLabel input{ width:auto; transform:scale(1.1); }
.breadcrumbRow{ margin-bottom:6px; }
.backLink{ color:var(--muted); text-decoration:none; font-size:13px; }
.backLink:hover{ color:var(--hi); }

.menuBody{ display:flex; align-items:flex-start; }
.menuWrap{ max-width:1180px; }
.menuTop{ position:static; }
.menuGrid{ margin-top:18px; display:grid; grid-template-columns:repeat(auto-fit, minmax(280px, 1fr)); gap:16px; }
.menuCard{ padding:18px; }
.menuCardHeader{ display:flex; justify-content:space-between; align-items:center; gap:10px; margin-bottom:12px; }
.moduleTag{ color:var(--hi); font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.06em; }
.menuCard h2{ margin:0 0 10px; font-size:20px; color:var(--txt); }
.menuCard p{ margin:0 0 16px; color:rgba(185,255,209,.82); line-height:1.45; }
.navBtn{ text-decoration:none; display:inline-flex; align-items:center; justify-content:center; min-width:180px; }
.activeModule{ border-color:rgba(32,255,116,.35); }
.placeholderModule{ opacity:.92; }

@media (max-width:980px){
  .grid{ grid-template-columns:1fr; }
  .top{ position:static; }
  .brandBlock{ align-items:flex-start; }
}

@media (max-width:680px){
  .c2,.c3,.c4{ grid-column:span 12; }
  .top{ flex-direction:column; align-items:flex-start; }
  .menuCard h2{ font-size:18px; }
}
