/* Enigma app styles — aligned with main app aesthetic */
:root {
  --bg: #f2f2f7;
  --card: #ffffff;
  --muted: #8e8e93;
  --ink: #1c1c1e;
  --accent: #007aff;
  --ff-serif: 'Libre Baskerville', Georgia, serif;
  --ff-mono: 'DM Mono', 'Courier New', monospace;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  min-height: 100vh; background: var(--bg); color: var(--ink); font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', Arial, sans-serif;
}
.back-nav { position: fixed; top: 12px; left: 12px; z-index: 60; }
.back-btn { display:inline-flex; align-items:center; gap:8px; text-decoration:none; background: rgba(255,255,255,0.9); padding:8px 12px; border-radius:999px; color:var(--ink); border:1px solid rgba(0,0,0,0.06); }
.app { max-width: 480px; margin: 72px auto; padding: 0 20px 60px; }
.badge { font-size: 11px; font-weight: 600; letter-spacing: 3px; text-transform: uppercase; color: var(--muted); margin-bottom: 8px; text-align:left; }
.header h1 { font-family: var(--ff-serif); font-size: 28px; margin: 0 0 6px 0; }
.subtitle { color: var(--muted); margin-bottom: 16px; }
.card { background: var(--card); border-radius: 16px; padding: 20px; box-shadow: 0 8px 30px rgba(0,0,0,0.06); }
.card label { display:block; font-size: 13px; font-weight:600; margin-bottom:6px; color:var(--muted); }
textarea, input { font-family: inherit; font-size: 14px; padding: 10px 12px; border-radius: 10px; border: 1px solid #e6e6ea; width:100%; box-shadow:none; }
input { height: 40px; }
.btn-primary { padding: 12px 16px; border-radius: 12px; background: var(--accent); color: white; border: none; cursor: pointer; font-weight:600; box-shadow: 0 8px 20px rgba(0,122,255,0.16); }
.btn-primary:active { transform: translateY(1px); }
.footer { margin-top: 14px; color: var(--muted); font-size: 13px; }
.cmd { background: rgba(0,0,0,0.03); padding: 10px; border-radius: 8px; font-family: var(--ff-mono); }
.small { color: var(--muted); font-size: 13px; }

/* Form layout helpers */
.field-row { display:flex; gap:12px; margin-top:12px; flex-wrap:wrap; }
.field { flex:1; min-width:140px; }
.field--full { flex-basis:100%; }

/* Info button & text */
.info-btn { background:#eef6ff; border:1px solid rgba(0,122,255,0.12); color:var(--accent); padding:2px 8px; border-radius:8px; font-weight:700; cursor:pointer; margin-left:8px; font-size:12px; }
.info-text { display:none; margin-top:8px; color:var(--muted); font-size:13px; line-height:1.35; }
.info-text.open { display:block; }

.field label { display:flex; align-items:center; gap:8px; }