.dxw-root{
  --dxw-font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  font-family:var(--dxw-font-family);
  --dxw-radius: 14px;
  --dxw-radius-container: 20px;
  --dxw-radius-input: var(--dxw-radius);
  --dxw-radius-button: var(--dxw-radius);
  --dxw-accent1: #59d7ff;
  --dxw-accent2: #ff4fd8;
  --dxw-accent3: #35f5a3;
  --dxw-bg: #ffffff;
  --dxw-border: #cfd2d9;
  --dxw-text: #111111;
  --dxw-muted: #555555;
  --dxw-placeholder: #4a4a4a;
  --dxw-btn-font-family: inherit;
  --dxw-btn-text: #ffffff;
  --dxw-btn-bg1: #000000;
  --dxw-btn-bg2: #000000;
  --dxw-dir-text: #0b5;
  --dxw-dir-bg1: #ffffff;
  --dxw-dir-bg2: #ffffff;
}
.dxw-card{
  border:1px solid var(--dxw-border);
  border-radius: var(--dxw-radius-container);
  padding:14px;
  background: var(--dxw-bg);
  color: var(--dxw-text);
  box-shadow: 0 10px 22px rgba(0,0,0,.08);
}
.dxw-root.dxw-bg-transparent .dxw-card{
  background: transparent;
  box-shadow: none;
}
.dxw-row{display:flex;gap:10px;flex-wrap:wrap;align-items:end}
.dxw-input,.dxw-button{
  padding:11px 12px;
  border-radius: var(--dxw-radius-input);
  border:1px solid color-mix(in srgb, var(--dxw-border) 70%, #0000);
  font-size:16px
}
.dxw-input{
  background: var(--dxw-bg);
  color: var(--dxw-text) !important;
  -webkit-text-fill-color: var(--dxw-text);
  border: 1px solid var(--dxw-border);
}
.dxw-input::placeholder{color: var(--dxw-placeholder)}
.dxw-input:focus{
  outline: none;
  border-color: var(--dxw-border);
}
.dxw-button{
  color:var(--dxw-btn-text);
  cursor:pointer;
  border-color: color-mix(in srgb, var(--dxw-btn-bg1) 35%, var(--dxw-border));
  background: var(--dxw-btn-bg1);
  transition: transform .16s ease, filter .16s ease;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font-family: var(--dxw-btn-font-family);
  border-radius: var(--dxw-radius-button);
}
.dxw-button:hover{transform: translateY(-1px); filter: brightness(1.03); background: var(--dxw-btn-bg2)}
.dxw-result{border-top:1px solid color-mix(in srgb, var(--dxw-border) 70%, #0000);padding:10px 0}
.dxw-muted{color:var(--dxw-muted)}
.dxw-error{color:#b00020}

.dxw-directions{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:800;
  color:var(--dxw-dir-text);
  text-decoration:none;
  margin-top:8px;
}
.dxw-directions.dxw-directions--button{
  padding:10px 12px;
  border-radius:var(--dxw-radius);
  border:1px solid color-mix(in srgb, var(--dxw-dir-bg1) 35%, var(--dxw-border));
  background: linear-gradient(135deg, var(--dxw-dir-bg1), var(--dxw-dir-bg2));
  color: var(--dxw-dir-text);
}
.dxw-icon{
  width:16px;
  height:16px;
  display:inline-block;
}
.dxw-icon svg{width:16px;height:16px;display:block;fill:currentColor}

.dxw-pager{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.dxw-pagebtn{
  padding:9px 12px;
  border-radius: var(--dxw-radius-button);
  border:1px solid color-mix(in srgb, var(--dxw-border) 70%, #0000);
  background:rgba(255,255,255,.04);
  color:var(--dxw-text);
  cursor:pointer;
  font-weight:800;
}
.dxw-pagebtn:disabled{
  opacity:.55;
  cursor:not-allowed;
}
