/* Scoped styles for alienwords-tool (BEM) - mobile-first */
:root{
  --aw-bg: #070712;
  --aw-panel: linear-gradient(180deg, rgba(112,40,228,0.06), rgba(0,243,255,0.02));
  --aw-cyan: #00f3ff;
  --aw-purple: #7028e4;
  --aw-green: #00ff9d;
  --aw-accent: linear-gradient(90deg,var(--aw-cyan),var(--aw-purple));
  --aw-font: ui-monospace, SFMono-Regular, Menlo, Monaco, "Roboto Mono", monospace;
  --aw-radius: 10px;
  --aw-trans: 220ms;
}

/* Container */
.alienwords-tool { max-width: 880px; margin:18px auto; font-family:var(--aw-font); color:#dffcf2; padding:14px; }
.alienwords-tool__panel { background: var(--aw-bg); border-radius:var(--aw-radius); padding:16px; border:1px solid rgba(255,255,255,0.03); box-shadow: 0 8px 30px rgba(2,6,23,0.6); position:relative; overflow:hidden; }

/* Header */
.alienwords-tool__header { text-align:center; margin-bottom:10px; }
.alienwords-tool__title { margin:0; font-size:18px; color:var(--aw-cyan); text-transform:lowercase; background:var(--aw-accent); -webkit-background-clip:text; color:transparent; }
.alienwords-tool__tag { margin:6px 0 0 0; font-size:13px; color:rgba(200,245,240,0.85); }

/* Controls grid */
.alienwords-tool__controls { display:grid; gap:10px; grid-template-columns:1fr 1fr; align-items:center; margin-bottom:12px; }
.alienwords-tool__label { grid-column: auto; font-size:13px; color:#bfeee6; }

/* Inputs */
.alienwords-tool__input, .alienwords-tool__select {
  width:100%; padding:10px; border-radius:8px; min-height:44px; box-sizing:border-box;
  background: rgba(255,255,255,0.02); color:#e8ffff; border:1px solid rgba(255,255,255,0.03);
  font-family:var(--aw-font); font-size:14px;
}
.alienwords-tool__input[type="range"]{ padding:6px; height:36px; }

/* Toggles */
.alienwords-tool__toggles { grid-column:1 / -1; display:flex; gap:12px; align-items:center; }
.alienwords-tool__toggle { display:flex; gap:8px; align-items:center; font-size:13px; color:#cfeff4; }
.alienwords-tool__toggle input { width:18px; height:18px; min-width:18px; }

/* Actions row */
.alienwords-tool__actions { grid-column:1 / -1; display:flex; gap:10px; justify-content:flex-end; }
.alienwords-tool__btn { min-height:44px; padding:10px 14px; border-radius:8px; cursor:pointer; border:none; font-weight:700; letter-spacing:0.6px; transition:all var(--aw-trans); }
.alienwords-generate-btn { background:var(--aw-accent); color:#071017; box-shadow:0 8px 20px rgba(112,40,228,0.08); }
.alienwords-copy-btn { background:transparent; border:1px solid rgba(255,255,255,0.04); color:#bff9dd; }
.alienwords-download-btn { background:rgba(0,255,157,0.06); color:#bff9dd; border:1px solid rgba(0,255,157,0.08); }

.alienwords-tool__btn:active{ transform:translateY(2px); }

/* Output */
.alienwords-tool__output { padding:12px; border-radius:8px; background:linear-gradient(180deg, rgba(255,255,255,0.01), rgba(0,0,0,0.14)); border:1px solid rgba(255,255,255,0.03); min-height:120px; }
.alienwords-tool__list { margin:0; white-space:pre-wrap; word-break:break-word; font-size:15px; color:#cfeff4; }

/* Footer */
.alienwords-tool__footer { margin-top:10px; font-size:13px; color:#9fe9c9; text-align:center; }

/* Responsive */
@media (max-width:760px){
  .alienwords-tool__controls{ grid-template-columns:1fr; }
  .alienwords-tool__actions{ justify-content:stretch; flex-direction:row; }
}

/* Small micro-interactions */
.alienwords-tool__list .aw-highlight { color:var(--aw-cyan); text-shadow:0 0 8px rgba(0,243,255,0.09); }
