@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&family=JetBrains+Mono:wght@400;600&display=swap');

#crazy_coder-statement-wrapper {
  font-family: 'Poppins', system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
  background: #000;
  color: #fff;
  min-height: 100%;
  width: 100%;
  padding: 24px 12px;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
}

#crazy_coder-statement-wrapper .crazy_coder-container {
  background: rgba(20,20,20,0.92);
  border: 1px solid rgba(124,104,255,0.35);
  box-shadow: 0 0 26px rgba(124,104,255,0.35);
  border-radius: 20px;
  padding: 28px 22px;
  width: 100%;
  max-width: 1100px;
  box-sizing: border-box;
}

#crazy_coder-statement-wrapper .crazy_coder-title {
  margin: 0 0 6px;
  font-weight: 700;
  font-size: 1.9rem;
  text-align: center;
}

#crazy_coder-statement-wrapper .crazy_coder-subtitle {
  margin: 0 0 18px;
  text-align: center;
  color: #bdbdbd;
}

#crazy_coder-statement-wrapper .crazy_coder-inputs { display: grid; gap: 14px; }
#crazy_coder-statement-wrapper .crazy_coder-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(180px, 1fr));
  gap: 12px;
}

#crazy_coder-statement-wrapper .crazy_coder-field { display: flex; flex-direction: column; gap: 6px; }
#crazy_coder-statement-wrapper .crazy_coder-label { font-size: 0.9rem; color:#cfcafc; }

#crazy_coder-statement-wrapper .crazy_coder-input,
#crazy_coder-statement-wrapper .crazy_coder-select {
  width: 100%;
  box-sizing: border-box;
  border-radius: 10px;
  border: 1px solid rgba(124,104,255,0.45);
  background: #0f0f10;
  color: #fff;
  padding: 10px 12px;
  font-size: 0.98rem;
  transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

#crazy_coder-statement-wrapper .crazy_coder-select {
  cursor: pointer;
  background: #fff;
  color: #4A3AFD;
  font-weight: 600;
}

#crazy_coder-statement-wrapper .crazy_coder-input:focus,
#crazy_coder-statement-wrapper .crazy_coder-select:focus {
  outline:none; border-color:#7C68FF; box-shadow:0 0 10px rgba(124,104,255,0.7);
}

#crazy_coder-statement-wrapper .crazy_coder-table-wrap {
  margin-top: 8px;
  background: rgba(10,10,10,0.6);
  border: 1px solid rgba(124,104,255,0.25);
  border-radius: 12px;
  padding: 8px;
}

#crazy_coder-statement-wrapper .crazy_coder-table-head,
#crazy_coder-statement-wrapper .crazy_coder-row {
  display: grid;
  grid-template-columns: 140px 1fr 140px 160px 60px;
  align-items: center;
  gap: 8px;
}

#crazy_coder-statement-wrapper .crazy_coder-table-head {
  font-weight: 600;
  color: #cfcafc;
  padding: 8px 6px;
  border-bottom: 1px dashed rgba(124,104,255,0.35);
}

#crazy_coder-statement-wrapper .crazy_coder-row { padding: 6px; }

#crazy_coder-statement-wrapper .crazy_coder-row input,
#crazy_coder-statement-wrapper .crazy_coder-row select {
  width: 100%;
  box-sizing: border-box;
  border-radius: 8px;
  border: 1px solid rgba(124,104,255,0.25);
  background: #0f0f10;
  color: #fff;
  padding: 8px 10px;
  font-size: 0.95rem;
}

#crazy_coder-statement-wrapper .crazy_coder-row .crazy_coder-del {
  background: transparent;
  border: 1px solid rgba(255,85,85,0.5);
  color: #ff8f8f;
  border-radius: 8px;
  cursor: pointer;
  padding: 6px 8px;
}

#crazy_coder-statement-wrapper .small { padding:8px 12px; margin-top:8px; }

#crazy_coder-statement-wrapper .crazy_coder-actions-top {
  display: flex; gap: 10px; flex-wrap: wrap; margin-top: 10px;
}

#crazy_coder-statement-wrapper .crazy_coder-btn {
  padding: 12px 22px; border-radius: 12px; border:none;
  background: linear-gradient(90deg,#4A3AFD,#7C68FF); color:#fff; font-weight:700; cursor:pointer;
  box-shadow:0 0 18px rgba(124,104,255,0.6); transition: transform 0.2s ease, box-shadow 0.2s ease;
}
#crazy_coder-statement-wrapper .crazy_coder-btn:hover { transform: translateY(-1px) scale(1.02); box-shadow:0 0 24px rgba(124,104,255,0.9); }

#crazy_coder-statement-wrapper .crazy_coder-btn-outline {
  padding: 10px 16px; border-radius: 10px; background: transparent;
  border: 1px solid rgba(124,104,255,0.6); color:#e9e6ff; cursor:pointer;
  transition: background 0.2s ease, transform 0.2s ease;
}
#crazy_coder-statement-wrapper .crazy_coder-btn-outline:hover { background: rgba(124,104,255,0.12); transform: translateY(-1px); }

#crazy_coder-statement-wrapper .crazy_coder-output { margin-top: 16px; }

#crazy_coder-statement-wrapper .crazy_coder-sheet {
  position: relative;
  background:#fff; color:#1a1a1a; border-radius:12px; padding:22px; min-height:380px;
  box-shadow:0 0 24px rgba(0,0,0,0.35);
}

#crazy_coder-statement-wrapper .crazy_coder-watermark {
  position:absolute; inset:0; pointer-events:none; display:flex; align-items:center; justify-content:center;
  font-weight:800; color:rgba(124,104,255,0.12); font-size:64px; letter-spacing:0.2em; text-align:center;
  transform: rotate(-15deg);
}

#crazy_coder-statement-wrapper .crazy_coder-sheet h2 { margin:0 0 8px; }
#crazy_coder-statement-wrapper .crazy_coder-meta { color:#444; font-size:0.92rem; margin-bottom:12px; }
#crazy_coder-statement-wrapper .crazy_coder-stats { margin: 8px 0 14px; font-weight:600; }

#crazy_coder-statement-wrapper .crazy_coder-tbl {
  width:100%; border-collapse: collapse; font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
}
#crazy_coder-statement-wrapper .crazy_coder-tbl th,
#crazy_coder-statement-wrapper .crazy_coder-tbl td {
  border-bottom:1px solid #eee; padding:8px 6px; text-align:left; font-size: 13.5px;
}
#crazy_coder-statement-wrapper .crazy_coder-tbl th { color:#666; font-weight:700; }
#crazy_coder-statement-wrapper .right { text-align:right; }

/* Responsive */
@media (max-width: 900px) {
  #crazy_coder-statement-wrapper .crazy_coder-grid { grid-template-columns: 1fr 1fr; }
  #crazy_coder-statement-wrapper .crazy_coder-table-head,
  #crazy_coder-statement-wrapper .crazy_coder-row {
    grid-template-columns: 120px 1fr 120px 140px 50px;
  }
}
@media (max-width: 640px) {
  #crazy_coder-statement-wrapper .crazy_coder-grid { grid-template-columns: 1fr; }
  #crazy_coder-statement-wrapper .crazy_coder-table-head,
  #crazy_coder-statement-wrapper .crazy_coder-row {
    grid-template-columns: 1fr;
  }
}
