:root {
    --bg-dark: #141414;
    --bg-deep: #1b2430;
    --bg-panel: rgba(18, 18, 18, 0.96);
    --bg-input: rgba(50, 50, 50, 0.95);

    --border: #444;
    --border-soft: #333;

    --text-main: #f5f5f5;
    --text-dim: #c9c9c9;
    --text-soft: #9fa3a7;

    --accent: #F5A500;
    --accent-hover: #ffb733;
    --accent-soft: rgba(245, 165, 0, 0.15);

    --radius: 8px;
    --blur: 6px;
}

* {
    box-sizing: border-box;
}

html,
body {
    margin: 0;
    height: 100%;
    color: var(--text-main);
}

body {
    background: var(--bg-dark);
    color: var(--text-main);
    font-family: system-ui, -apple-system, Segoe UI, Roboto, sans-serif;
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
div,
span,
label {
    color: inherit;
}

input,
select,
textarea,
button {
    font: inherit;
}

.textInput,
select,
input,
textarea {
    color: var(--text-main);
    background: var(--bg-input);
    border: 1px solid var(--border);
    border-radius: 6px;
}

.textInput::placeholder,
input::placeholder,
textarea::placeholder {
    color: var(--text-soft);
}

option {
    color: var(--text-main);
    background: #2b2b2b;
}

.label {
    color: var(--text-dim);
}

.helpText {
    color: var(--text-dim);
}

.valueBox {
    color: var(--text-main);
    background: var(--bg-input);
    border: 1px solid var(--border);
    border-radius: 6px;
}

.hidden {
    display: none !important;
}

#devMenuWrap {
    position: fixed;
    top: 12px;
    right: 12px;
    z-index: 9999;
}

#devMenuPanel {
    margin-top: 8px;
    min-width: 190px;
    padding: 10px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.devLink {
    display: block;
    padding: 8px 10px;
    border-radius: 6px;
    text-decoration: none;
    color: var(--text-main);
    background: rgba(50, 50, 50, 0.85);
    border: 1px solid var(--border);
}

.devLink:hover {
    background: var(--accent);
    color: #111;
    border-color: var(--accent);
}
/* Shared tool nav for Bus-World pipeline pages */
.toolNav {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    align-items: center;
    margin: -4px 0 10px;
    color: #9ca3af;
    font-size: 13px;
}
.toolNav a {
    color: #ffb347;
    text-decoration: none;
    font-weight: 700;
}
.toolNav a:hover { text-decoration: underline; }