/* Jernbroderskabet – værktøjssider */
.jb-tools { max-width: 920px; margin: 0 auto; padding: 8px 0 24px; }
.jb-h1 { font-family: "Barlow", sans-serif; font-size: 2em; font-weight: 800; margin: 8px 0 6px; border: 0; color: var(--nn-text, #15171A); }
.jb-lead { font-size: 1.2em; line-height: 1.5; color: var(--nn-muted, #5B5F66); margin: 0 0 14px; }
.jb-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 16px; }
.jb-tabs a { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--nn-line, #E2E0DB); background: var(--nn-surface, #fff); font-weight: 600; font-size: 1.1em; color: var(--nn-text, #15171A); }
.jb-tabs a:hover, .jb-tabs a.active { border-color: var(--nn-accent, #C8401C); color: var(--nn-accent, #C8401C); }
.jb-card { background: var(--nn-surface, #fff); border: 1px solid var(--nn-line, #E2E0DB); border-radius: var(--nn-radius, 14px); padding: 18px 20px; margin: 0 0 16px; scroll-margin-top: 70px; }
.jb-card h3 { font-family: "Barlow", sans-serif; font-size: 1.5em; margin: 0 0 6px; border: 0; color: var(--nn-text, #15171A); text-transform: none; }
.jb-card p, .jb-tools li { font-size: 1.15em; line-height: 1.5; }
.jb-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 12px 14px; margin: 12px 0; }
.jb-grid label { display: flex; flex-direction: column; gap: 4px; font-weight: 600; font-size: 1.1em; color: var(--nn-text, #15171A); }
.jb-grid .jb-wide { grid-column: 1 / -1; }
.jb-grid input, .jb-grid select, .jb-grid textarea { font-size: 15px; padding: 8px 10px; border-radius: 8px; border: 1px solid var(--nn-line, #E2E0DB); background: var(--nn-bg, #F2F1EE); color: var(--nn-text, #15171A); font-weight: 400; width: 100%; box-sizing: border-box; }
.jb-grid textarea { font-family: inherit; }
.jb-result { border-top: 1px solid var(--nn-line-soft, #ECEAE6); padding-top: 12px; }
.jb-big { font-size: 1.6em; margin: 4px 0 10px; color: var(--nn-text, #15171A); }
.jb-big strong { color: var(--nn-accent, #C8401C); font-size: 1.3em; }
.jb-macros { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.jb-macros span { background: var(--nn-bg, #F2F1EE); border-radius: 10px; padding: 10px 12px; font-size: 1.2em; color: var(--nn-text, #15171A); }
.jb-small, .jb-small p { font-size: 1.05em; color: var(--nn-muted, #5B5F66); }
.jb-note { font-size: 1.1em; color: var(--nn-muted, #5B5F66); }
.jb-table { width: 100%; border-collapse: collapse; margin: 8px 0; font-size: 1.15em; }
.jb-table th, .jb-table td { padding: 6px 8px; border-bottom: 1px solid var(--nn-line-soft, #ECEAE6); text-align: left; color: var(--nn-text, #15171A); }
.jb-right { text-align: right !important; }
.jb-chart { width: 100%; height: auto; display: block; margin: 8px 0; }
.jb-chart .jb-line { fill: none; stroke: var(--nn-accent, #C8401C); stroke-width: 2.5; stroke-linejoin: round; }
.jb-chart .jb-dot { fill: var(--nn-accent, #C8401C); }
.jb-chart .jb-ref { fill: #2e9e5b; opacity: .12; }
.jb-chart .jb-avg { stroke: var(--nn-muted, #5B5F66); stroke-dasharray: 4 4; stroke-width: 1; }
.jb-chart .jb-axis { fill: var(--nn-muted, #5B5F66); font-size: 11px; }
.jb-markers { display: grid; grid-template-columns: repeat(auto-fill, minmax(380px, 1fr)); gap: 0 16px; }
.jb-marker header { margin-bottom: 4px; }
.jb-latest { font-size: 1.4em; color: var(--nn-text, #15171A); }
.jb-latest strong { font-size: 1.3em; }
.jb-flag { display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px; background: #F7E1D9; color: #9E3215; font-size: .7em; font-weight: 700; vertical-align: middle; }
.jb-high .jb-latest strong, .jb-low .jb-latest strong { color: #C8401C; }
.jb-marker details summary { cursor: pointer; font-weight: 600; font-size: 1.1em; color: var(--nn-muted, #5B5F66); }
.jb-del { background: none; border: 0; color: #C8401C; cursor: pointer; font-size: 1em; }
.jb-copy { width: 100%; box-sizing: border-box; font-family: monospace; font-size: 13px; padding: 10px; border-radius: 8px; border: 1px solid var(--nn-line, #E2E0DB); background: var(--nn-bg, #F2F1EE); color: var(--nn-text, #15171A); }
.jb-error, .jb-ok { padding: 10px 14px; border-radius: 10px; margin: 0 0 14px; font-size: 1.15em; }
.jb-error { background: #F7E1D9; color: #9E3215; }
.jb-ok { background: #DDF1E4; color: #1D6B3C; }
.jb-points { margin: 0 0 16px 20px; color: var(--nn-text, #15171A); }
.jb-plot { overflow-x: auto; }
.jb-anon-note { margin-top: 12px; padding: 6px 10px; border-radius: 8px; background: #FFF4D6; color: #6B4E00; font-size: .9em; }
.jb-anon-btn { margin-left: 6px; }
html[data-theme="dark"] .jb-flag, html[data-theme="dark"] .jb-error { background: #3A2219; color: #F28A66; }
html[data-theme="dark"] .jb-ok { background: #17311F; color: #8BD3A5; }
html[data-theme="dark"] .jb-anon-note { background: #3A3016; color: #F0D589; }
@media (max-width: 700px) {
	.jb-markers { grid-template-columns: 1fr; }
	.jb-macros { grid-template-columns: 1fr; }
	.jb-h1 { font-size: 1.6em; }
	.jb-card { padding: 14px; }
}

.jb-grid [hidden], .jb-grid label[hidden] { display: none !important; }