:root {
    --ink: #27221d;
    --muted: #6d6256;
    --paper: #f7edd8;
    --paper-deep: #ead4ad;
    --accent: #8b4513;
    --accent-light: #f2ce9e;
    --danger: #8f2f2f;
    --line: rgba(67, 48, 29, 0.25);
}

body {
    background: #d2b48c;
    color: var(--ink);
    font-family: 'Roboto Slab', Georgia, serif;
    margin: 20px;
}

.workshop { max-width: 1120px; }
.page-header { border-bottom: 2px solid var(--accent); margin-bottom: 1.5em; padding-bottom: 1em; }
.eyebrow { color: var(--accent); font-size: 0.75em; font-weight: bold; letter-spacing: 0.12em; margin: 0; text-transform: uppercase; }
h1, h2 { color: var(--accent); }
h1 { margin: 0.15em 0; }
h2 { border-bottom: 1px solid var(--line); font-size: 1.25em; padding-bottom: 0.4em; }
.lead { color: var(--muted); margin-bottom: 0; }
.workbench, .tables { background: rgba(247, 237, 216, 0.58); border: 1px solid var(--line); border-radius: 8px; margin-bottom: 1.5em; padding: 1.2em; }
.two-column { display: grid; gap: 1.5em; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.tool-form { align-items: end; display: grid; gap: 0.6em 0.8em; grid-template-columns: 1.2fr 1fr 1.2fr 1fr auto auto; }
.tool-form label { font-size: 0.8em; font-weight: bold; }
.tool-form input, .tool-form select { background: var(--paper) !important; border: 1px solid var(--line); border-radius: 5px; color: var(--ink) !important; min-height: 2.25em; padding: 0.35em 0.5em; }
.tool-form button, .tab { background: var(--accent-light); border: 1px solid var(--line); border-radius: 5px; color: var(--ink); cursor: pointer; font-weight: bold; min-height: 2.25em; padding: 0.35em 0.9em; }
.tool-form button:hover, .tab:hover, .tab.active { background: #ff9900; }
.compact-form { grid-template-columns: 1fr 1fr; }
.compact-form button { grid-column: 1 / -1; justify-self: start; }
.check-label { align-items: center; display: flex; gap: 0.4em; }
.check-label input { accent-color: var(--accent); min-height: auto; }
.result-panel { background: rgba(0, 0, 0, 0.07); border-left: 4px solid var(--accent); border-radius: 4px; margin-top: 1em; padding: 0.8em 1em; }
.result-panel strong { color: var(--accent); }
.result-panel.failure { border-color: var(--danger); }
.result-hidden { display: none; }
table { border-collapse: collapse; width: 100%; }
th, td { border-bottom: 1px solid var(--line); padding: 0.55em; text-align: left; vertical-align: top; }
th { color: var(--accent); }
tbody tr:nth-child(even) { background: rgba(0, 0, 0, 0.04); }
@media (max-width: 760px) {
    body { margin: 10px; }
    .two-column { grid-template-columns: 1fr; }
    .tool-form { grid-template-columns: 1fr 1fr; }
    .tool-form label { grid-column: span 1; }
    .tool-form input, .tool-form select { width: 100%; }
    .tool-form button { grid-column: 1 / -1; justify-self: start; }
}
