@font-face {
	font-family: "PT Sans";
	src: url("assets/pt-sans-regular-full.woff2") format("woff2");
	font-weight: 400;
	font-display: swap;
}
@font-face {
	font-family: "PT Sans";
	src: url("assets/pt-sans-bold-full.woff2") format("woff2");
	font-weight: 700;
	font-display: swap;
}

/* Component-specific styles. Global tokens and primitives live in design-system.css. */

*, *::before, *::after { box-sizing: border-box; }
html { background: var(--ds-bg); }
body { margin: 0; }
body [mol_view_root] {
	display: block;
	height: auto;
	min-height: 100svh;
	background: var(--ds-bg);
	font: 400 16px/1.45 "PT Sans", sans-serif;
	color: var(--ds-text-inverse);
}
main[mol_view] { display: block; }
[hidden] { display: none !important; }
h1, h2, h3, p { margin: 0; }
a { color: inherit; text-decoration: none; text-underline-offset: .22em; }
button, input, select, textarea { color: inherit; font: inherit; }
button { cursor: pointer; }
button:disabled { opacity: .44; cursor: default; }
:focus-visible { outline: 2px solid var(--ds-focus); outline-offset: 4px; }
::selection { background: #f9b4bf; color: var(--ds-text); }
.shell { width: min(100%, var(--ds-max-width)); margin-inline: auto; padding-inline: var(--ds-gutter); }

.site-header { background: var(--ds-bg-raised); }
.header-inner, .brand { display: flex; align-items: center; }
.header-inner { min-height: var(--ds-header-height); }
.brand { gap: 9px; font-weight: 700; font-size: 17px; letter-spacing: .065em; white-space: nowrap; }
.brand img { margin-right: 3px; }
.brand-product { color: var(--ds-text-inverse-muted); font-weight: 400; }
.button { display: inline-flex; justify-content: center; align-items: center; gap: 8px; padding: 9px 13px; border: 1px solid transparent; border-radius: var(--ds-radius-sm); font-weight: 700; line-height: 1.25; }
.button-primary { color: #fff; background: var(--ds-accent); }
.button-primary:hover:not(:disabled) { background: var(--ds-accent-hover); }

main[detabit_gauss_home], main[detabit_gauss_map] {
	background: var(--ds-canvas);
	color: var(--ds-text);
	color-scheme: light;
	min-height: calc(100svh - var(--ds-header-height));
}
.tool-catalog { padding-block: clamp(36px, 5vw, 64px); }
.tool-catalog h1 { font-size: clamp(38px, 4.5vw, 54px); line-height: 1.05; letter-spacing: -.03em; }
.catalog-lead { margin-top: 8px; color: var(--ds-text-muted); font-size: 19px; }
.tool-entry {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	align-items: center;
	gap: 20px;
	margin-top: 32px;
	padding: 22px 24px;
	background: var(--ds-surface);
}
.tool-entry h2 { font-size: 26px; line-height: 1.15; letter-spacing: -.02em; }
.tool-description { max-width: 60ch; margin-top: 6px; color: var(--ds-text-muted); }
.tool-open { min-height: 44px; }
.tool-open:focus-visible { outline-color: var(--ds-accent); }

.workspace { padding-top: 29px; padding-bottom: 40px; }
.map-heading, .map-meta, .map-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.breadcrumb { display: inline-flex; align-items: center; gap: 6px; color: var(--ds-text-muted); font-size: 15px; }
.breadcrumb:hover, .map-help a:hover { color: var(--ds-accent); text-decoration: underline; }
.breadcrumb svg { width: 17px; height: 17px; }
.map-heading h1 { font-size: 48px; line-height: 1; letter-spacing: -.035em; margin-top: 10px; }
.map-files, .edit-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.map-files { align-self: end; }
.button-outline { background: transparent; color: var(--ds-text); border-color: var(--ds-border-strong); }
.button-outline:hover:not(:disabled) { background: #eae3df; }
.map-files svg, .edit-actions svg { width: 17px; height: 17px; }
.map-meta { margin-block: 22px 10px; }
.map-title { width: min(100%, 460px); min-width: 0; border: 1px solid var(--ds-border); border-radius: var(--ds-radius-sm); padding: 8px 11px; background: var(--ds-surface); font-size: 18px; font-weight: 700; }
.save-status { color: var(--ds-text-muted); text-align: right; font-size: 14px; }
.editor { display: grid; grid-template-columns: minmax(0, 1fr) minmax(245px, 282px); border: 1px solid var(--ds-border); background: var(--ds-surface); }
.map-surface { min-width: 0; }
.map-toolbar { padding: 11px 14px; border-bottom: 1px solid var(--ds-border); flex-wrap: wrap; } /* taste-skill-ignore: chart toolbar */
.map-modes { display: flex; gap: 4px; }
.mode-option { padding: 8px 11px; border: 0; border-radius: var(--ds-radius-sm); background: transparent; color: var(--ds-text-muted); }
.mode-option:hover { color: var(--ds-text); }
.mode-option[aria-pressed="true"] { background: var(--ds-selected-bg); color: var(--ds-accent-dark); font-weight: 700; }
.chart-scroll { overflow-x: auto; }
.chart-inner { display: grid; grid-template-columns: 29px 1fr; gap: 6px; min-width: 550px; padding: 21px 25px 18px 13px; }
.vertical-axis, .horizontal-axis { color: var(--ds-text-muted); font-size: 14px; }
.vertical-axis { writing-mode: vertical-rl; transform: rotate(180deg); text-align: center; align-self: center; justify-self: center; }
.horizontal-axis { display: flex; align-items: center; justify-content: center; gap: 5px; padding-top: 10px; }
.horizontal-axis svg { width: 15px; height: 15px; }
.plot-outer {
	position: relative;
	height: clamp(365px, 39vw, 540px);
	border-left: 1px solid #928784; /* taste-skill-ignore: visibility axis */
	border-bottom: 1px solid #928784; /* taste-skill-ignore: evolution axis */
	background-image: linear-gradient(to right, #ded6d1 1px, transparent 1px), linear-gradient(to bottom, #ebe4df 1px, transparent 1px); /* taste-skill-ignore: stage grid */
	background-size: 25% 100%, 100% 20%;
	background-position: -1px 0;
}
.map-plot { position: absolute; inset: 16px 0; }
.map-lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; pointer-events: none; }
.edge { stroke: #8a7f7e; stroke-width: 1.3; }
.edge-active { stroke: #a92a3c; stroke-width: 1.6; }
.planned-edge { stroke: #bd2338; stroke-width: 2; stroke-dasharray: 5 4; fill: none; }
.map-pin { position: absolute; display: flex; align-items: center; justify-content: center; width: 29px; height: 29px; transform: translate(-50%, -50%); border: 0; padding: 0; background: transparent; color: var(--ds-text); touch-action: none; cursor: grab; z-index: 1; }
.map-pin:active { cursor: grabbing; }
.map-pin:focus-visible, .map-pin:hover, .map-pin[aria-pressed="true"] { z-index: 2; outline-offset: 0; }
.pin-dot { width: 11px; height: 11px; flex: 0 0 11px; border: 2px solid var(--ds-surface); border-radius: 50%; background: var(--ds-accent); outline: 1px solid var(--ds-accent); }
.map-pin[aria-pressed="true"] .pin-dot { outline-width: 2px; }
.pin-label { position: absolute; bottom: calc(50% + 6px); left: calc(50% + 8px); max-width: 142px; width: max-content; padding: 1px 3px; border-radius: 2px; background: var(--ds-surface); font-size: 14px; line-height: 1.16; text-align: left; overflow-wrap: anywhere; }
.map-pin.label-left .pin-label { left: auto; right: calc(50% + 8px); text-align: right; }
.map-pin[aria-pressed="true"] .pin-label { color: var(--ds-accent-dark); font-weight: 700; }
.map-stages { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; font-size: 14px; padding-block: 8px; }
.map-empty { position: absolute; inset: 0; display: grid; place-content: center; gap: 4px; text-align: center; pointer-events: none; }
.map-empty strong { font-size: 22px; }
.map-empty p { color: var(--ds-text-muted); }
.inspector { min-width: 0; padding: 16px; background: var(--ds-panel); }
.inspector h2 { font-size: 21px; line-height: 1.2; }
.panel-empty { margin-top: 12px; color: var(--ds-text-muted); }
.property-stack { display: grid; gap: 12px; margin-top: 14px; }
.property { display: grid; gap: 4px; min-width: 0; font-size: 14px; color: var(--ds-text-muted); }
.property input, .property textarea, .link-add select { display: block; min-width: 0; width: 100%; padding: 7px 8px; border: 1px solid var(--ds-border-strong); border-radius: var(--ds-radius-sm); background: var(--ds-surface); color: var(--ds-text); font-size: 16px; }
.property textarea { resize: vertical; }
.coords, .link-add { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.stage-name { color: var(--ds-accent-dark); font-size: 14px; }
.property-section { display: grid; gap: 9px; padding-top: 11px; }
.property-section h3 { font-size: 16px; }
.link-add { grid-template-columns: minmax(0, 1fr) auto; }
.link-add .button { padding-inline: 8px; font-size: 14px; }
.link-list { margin: 0; padding: 0; list-style: none; }
.link-list li { display: flex; align-items: center; justify-content: space-between; gap: 4px; font-size: 14px; overflow-wrap: anywhere; }
.remove-link { display: grid; place-items: center; min-width: 31px; min-height: 31px; padding: 0; border: 0; background: transparent; color: var(--ds-text-muted); }
.remove-link:hover, .delete-button:hover { background: #f0e1df; color: var(--ds-accent); }
.delete-button { justify-self: start; padding: 5px 7px; border: 0; border-radius: var(--ds-radius-sm); background: transparent; color: var(--ds-accent-dark); font-size: 14px; }
.map-help { padding-top: 14px; color: var(--ds-text-muted); }
.map-help summary { color: var(--ds-text); width: fit-content; cursor: pointer; }
.map-help p { max-width: 72ch; margin-block: 8px; }
.map-help a { display: inline-flex; align-items: center; gap: 4px; }
.map-help svg { width: 15px; height: 15px; }

@media (max-width: 990px) {
	.editor { grid-template-columns: minmax(0, 1fr) 245px; }
}
@media (max-width: 900px) {
	.editor { grid-template-columns: 1fr; }
	.chart-inner { min-width: 0; }
}
@media (max-width: 740px) {
	:root { --ds-header-height: 64px; }
	.chart-inner { grid-template-columns: 18px minmax(0, 1fr); gap: 4px; padding: 16px 14px 12px 6px; }
	.plot-outer { height: 395px; }
	.pin-label { max-width: 86px; font-size: 13px; }
	.map-stages { font-size: 13px; }
	.map-heading { align-items: start; flex-direction: column; }
	.map-heading h1 { font-size: 42px; }
	.map-files { align-self: start; }
	.map-meta { flex-direction: column; align-items: start; gap: 5px; }
	.save-status { text-align: left; }
}
@media (max-width: 440px) {
	.brand { gap: 6px; font-size: 14px; }
	.brand img { width: 19px; height: 21px; margin-right: 1px; }
	.tool-entry { grid-template-columns: 1fr; padding: 18px; }
	.tool-open { justify-self: start; }
	.map-files .button { padding-inline: 8px; font-size: 14px; }
	.map-files .button svg { display: none; }
}
@media (max-width: 360px) {
	:root { --ds-gutter: 16px; }
	.chart-inner { padding-right: 11px; }
	.pin-label { max-width: 75px; }
}
@media (prefers-reduced-motion: reduce) {
	[mol_view] { transition: none; }
}

/* GAUSS catalog: priority tools + reference templates */
.gauss-templates{grid-column:1/-1;border-top:1px solid var(--ds-border,#383838);padding-top:30px;margin-top:26px}.gauss-templates h2{font-size:clamp(24px,2.7vw,36px);margin:0 0 10px}.gauss-templates .catalog-lead{font-size:16px;max-width:750px;margin:0 0 14px}.gauss-template-link{display:inline-block;margin:4px 19px 8px 0;padding:9px 0;text-decoration:underline;text-underline-offset:4px}