107 lines
1.8 KiB
CSS
107 lines
1.8 KiB
CSS
:root {
|
|
--bg: #0b0f19;
|
|
--panel: rgba(255, 255, 255, 0.06);
|
|
--panel2: rgba(255, 255, 255, 0.09);
|
|
--text: rgba(255, 255, 255, 0.92);
|
|
--muted: rgba(255, 255, 255, 0.65);
|
|
--border: rgba(255, 255, 255, 0.12);
|
|
--accent: #ff4500;
|
|
--danger: #ff4d4f;
|
|
--ok: #25d366;
|
|
--mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
|
|
"Liberation Mono", "Courier New", monospace;
|
|
color-scheme: dark;
|
|
}
|
|
|
|
html,
|
|
body {
|
|
height: 100%;
|
|
}
|
|
|
|
body {
|
|
margin: 0;
|
|
font: 14px/1.35 system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial,
|
|
"Apple Color Emoji", "Segoe UI Emoji";
|
|
background: radial-gradient(1200px 800px at 25% 10%, #111b3a 0%, var(--bg) 55%)
|
|
fixed;
|
|
color: var(--text);
|
|
}
|
|
|
|
a {
|
|
color: inherit;
|
|
}
|
|
|
|
button,
|
|
input,
|
|
textarea,
|
|
select {
|
|
font: inherit;
|
|
color: inherit;
|
|
}
|
|
|
|
.row {
|
|
display: flex;
|
|
gap: 12px;
|
|
align-items: center;
|
|
}
|
|
|
|
.pill {
|
|
display: inline-flex;
|
|
align-items: center;
|
|
gap: 8px;
|
|
border: 1px solid var(--border);
|
|
padding: 6px 10px;
|
|
border-radius: 999px;
|
|
background: rgba(0, 0, 0, 0.2);
|
|
}
|
|
|
|
.btn {
|
|
border: 1px solid var(--border);
|
|
background: var(--panel);
|
|
padding: 7px 10px;
|
|
border-radius: 10px;
|
|
cursor: pointer;
|
|
}
|
|
.btn:hover {
|
|
background: var(--panel2);
|
|
}
|
|
.btn.primary {
|
|
border-color: rgba(255, 69, 0, 0.35);
|
|
background: rgba(255, 69, 0, 0.18);
|
|
}
|
|
.btn.danger {
|
|
border-color: rgba(255, 77, 79, 0.35);
|
|
background: rgba(255, 77, 79, 0.16);
|
|
}
|
|
|
|
.field {
|
|
display: grid;
|
|
gap: 6px;
|
|
}
|
|
.field label {
|
|
color: var(--muted);
|
|
font-size: 12px;
|
|
}
|
|
.field input,
|
|
.field textarea,
|
|
.field select {
|
|
border: 1px solid var(--border);
|
|
background: rgba(0, 0, 0, 0.25);
|
|
border-radius: 10px;
|
|
padding: 8px 10px;
|
|
outline: none;
|
|
}
|
|
.field textarea {
|
|
font-family: var(--mono);
|
|
min-height: 220px;
|
|
resize: vertical;
|
|
white-space: pre;
|
|
}
|
|
.muted {
|
|
color: var(--muted);
|
|
}
|
|
.mono {
|
|
font-family: var(--mono);
|
|
}
|
|
|