:root {
font-family: system-ui, -apple-system, sans-serif;
background: #0f0f12;
color: #eaeaea;
}
body {
margin: 0;
}
.container {
max-width: 760px;
margin: 60px auto;
padding: 24px;
}
.subtitle {
opacity: 0.7;
margin-top: 6px;
margin-bottom: 18px;
}
label {
display: block;
margin-bottom: 8px;
opacity: 0.85;
}
textarea {
width: 100%;
padding: 12px;
border-radius: 10px;
border: 1px solid #2a2a33;
background: #15151b;
color: #eaeaea;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", monospace;
font-size: 14px;
line-height: 1.4;
resize: vertical;
}
.row {
display: flex;
gap: 10px;
margin-top: 12px;
}
button {
padding: 12px 16px;
border-radius: 10px;
border: 1px solid #2a2a33;
cursor: pointer;
font-weight: 600;
}
.primary {
background: #1db954;
border-color: #1db954;
color: #0b0b0d;
}
.secondary {
background: transparent;
color: #eaeaea;
}
.status {
margin-top: 16px;
border: 1px solid #2a2a33;
background: #121218;
border-radius: 10px;
padding: 12px;
min-height: 60px;
}
pre {
margin: 0;
white-space: pre-wrap;
}
input[type="text"] {
width: 100%;
padding: 10px 12px;
border-radius: 10px;
border: 1px solid #2a2a33;
background: #15151b;
color: #eaeaea;
font-size: 14px;
box-sizing: border-box;
margin-bottom: 4px;
}