.eomdg-wrap{
  border:1px solid #d0d7de;
  border-radius:12px;
  padding:14px;
  max-width:1000px;
  margin:18px 0;
  background:#fff;
}

.eomdg-header{ margin-bottom:12px; }
.eomdg-title{ font-size:30px; font-weight:700; margin-bottom:6px; }
.eomdg-subtitle{ color:#57606a; font-size:18px; font-weight:600; }

.eomdg-chat{
  border:1px solid #d0d7de;
  border-radius:12px;
  padding:12px;
  height:460px;
  overflow:auto;
  background:#f6f8fa;
}

.eomdg-msg{ display:flex; margin:10px 0; }
.eomdg-msg.is-user{ justify-content:flex-end; }
.eomdg-msg.is-assistant{ justify-content:flex-start; }

/* WELCOME + ASSISTANT/USER MESSAGE TEXT SIZE */
.eomdg-bubble{
  max-width:100%;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid rgba(0,0,0,0.08);
  white-space:pre-wrap;
  font-size:20px;
  line-height:1.55;
  background:#fff;
  color:#111;
}

.eomdg-msg.is-user .eomdg-bubble{ background:#e7f5ff; }
.eomdg-msg.is-assistant .eomdg-bubble{ background:#fff; }

/* ------------------------------------------------------------
   INPUT ROW LAYOUT
   - textarea left
   - actions column right (2/3 SEND, 1/3 START OVER)
------------------------------------------------------------ */
.eomdg-inputrow{
  display:flex;
  gap:12px;
  margin-top:10px;
  align-items:stretch; /* textarea + actions share height */
}

/* TEXTAREA */
.eomdg-input{
  flex:1;
  border:2px solid #d0d7de;
  border-radius:12px;
  padding:14px;
  font-size:22px;
  line-height:1.6;
  resize:vertical;
  font-family:inherit;
  color:#111;
}

/* ACTIONS COLUMN (RIGHT SIDE) */
.eomdg-actions{
  display:flex;
  flex-direction:column;
  width:96px;                 /* same width for both buttons */
}

/* SEND — top 2/3 */
.eomdg-send{
  flex:2;
  border:1px solid #1f2328;
  border-radius:12px;
  background:#1f2328;
  color:#fff;
  font-size:15px;
  font-weight:600;
  cursor:pointer;
}

/* START OVER — bottom 1/3 */
.eomdg-start-over{
  flex:1;
  margin-top:10px;           /* restores visual gap from SEND */

  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;

  border:1px solid #9ca3af;
  border-radius:12px;
  background:#e5e7eb;        /* preferred default color */
  color:#374151;

  font-size:11px;
  font-weight:600;
  letter-spacing:0.05em;
  text-transform:uppercase;
  line-height:1.1;
  cursor:pointer;
}

.eomdg-start-over span{
  display:block;
}

/* Hover + focus */
.eomdg-start-over:hover{
  background:#dfe3e8;        /* slightly darker than default */
  border-color:#6b7280;
}

.eomdg-start-over:focus{
  outline:none;
  box-shadow:0 0 0 2px rgba(55,65,81,0.25);
}



.eomdg-footnote{
  margin-top:10px;
  color:#57606a;
  font-size:20px;
}

/* HARD OVERRIDE: user typing font size */
.eomdg-wrap .eomdg-inputrow textarea.eomdg-input[data-eomdg-input]{
  font-size:20px !important;
  line-height:1.6 !important;
}

/* Welcome instruction emphasis */
.eomdg-welcome-instruction{
  margin-top:16px;
  font-size:24px;
  font-weight:700;
  line-height:1.4;
  color:#111;
}

/* ================================
   PRACTICE FOOTER (PRINT / EMAIL)
   ================================ */

.eomdg-practice-footer{
  display:flex;
  gap:12px;
  margin-top:16px;
  padding-top:12px;
  border-top:1px solid #e3e8ef;
}

/* Base button style (idle shading for visibility) */
.eomdg-practice-footer button,
.eomdg-practice-footer .eomdg-print,
.eomdg-practice-footer .eomdg-email{
  appearance:none;
  border:1px solid #d6dee9;
  background:#f2f5f9;
  color:#1f2937;
  padding:8px 14px;
  font-size:14px;
  font-weight:500;
  border-radius:10px;
  cursor:pointer;
  opacity:1;
  visibility:visible;
}

/* Hover (slightly darker than idle) */
.eomdg-practice-footer button:hover,
.eomdg-practice-footer .eomdg-print:hover,
.eomdg-practice-footer .eomdg-email:hover{
  background:#e8edf4;
  border-color:#cfd7e3;
}

/* Ensure they are not affected by text selection */
.eomdg-practice-footer,
.eomdg-practice-footer *{
  user-select:none;
}