{"version":3,"file":"CodeBlock.module.cjs","names":[],"sources":["../../../src/components/CodeBlock/CodeBlock.module.css"],"sourcesContent":[".wrapper {\n    border: 1px solid var(--tempest-border);\n    border-radius: var(--tempest-radius-lg);\n    background-color: var(--tempest-surface);\n    overflow: hidden;\n}\n\n.header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: var(--tempest-space-2);\n    padding: var(--tempest-space-2) var(--tempest-space-3);\n    border-bottom: 1px solid var(--tempest-border);\n    background-color: var(--tempest-bg);\n}\n\n.filename {\n    font-family: var(--tempest-font-mono);\n    font-size: var(--tempest-text-xs);\n    color: var(--tempest-text-muted);\n    overflow: hidden;\n    text-overflow: ellipsis;\n    white-space: nowrap;\n}\n\n.copy {\n    flex-shrink: 0;\n}\n\n.pre {\n    margin: 0;\n    padding: var(--tempest-space-3) 0;\n    overflow: auto;\n    font-family: var(--tempest-font-mono);\n    font-size: var(--tempest-text-sm);\n    line-height: 1.6;\n    tab-size: 4;\n}\n\n.pre:focus-visible {\n    outline: var(--tempest-focus-ring-width) solid var(--tempest-focus-ring-color);\n    outline-offset: -2px;\n}\n\n.code {\n    display: block;\n    font: inherit;\n    min-width: max-content;\n}\n\n.wrap .code {\n    min-width: 0;\n}\n\n.wrap .lineContent {\n    white-space: pre-wrap;\n    overflow-wrap: anywhere;\n}\n\n/*\n * `inline-block` with a full-width box, not `flex`: the line break comes from\n * the real newline character inside the line, and a flex item would wrap on it\n * and render every line twice as tall. Full width is what lets the marked-line\n * background span the whole row rather than stopping at the last character.\n */\n.line {\n    display: inline-block;\n    width: 100%;\n    padding-inline: var(--tempest-space-3);\n}\n\n/*\n * The marked line is called out with a left bar and a tinted ground rather than\n * a different text colour: the syntax colours already carry meaning, and\n * recolouring the text would collide with them.\n *\n * The tint is a thin wash of the primary rather than `--tempest-primary-soft`,\n * because it sits *behind text*. The soft token is a solid ground and moved the\n * effective background far enough to drop a keyword to 3.94:1 in dark mode —\n * the syntax colours are solved against the code surface, so the highlight has\n * to leave that surface roughly where it was. The bar carries the emphasis.\n */\n.marked {\n    background-color: color-mix(in srgb, var(--tempest-primary) 10%, transparent);\n    box-shadow: inset 2px 0 0 var(--tempest-primary);\n}\n\n/*\n * The gutter wears the comment colour, not `--tempest-text-subtle`: subtle is\n * tuned to recede against the page and measures 4.04:1 on the dark code\n * surface, which is below AA. The comment token recedes the same way and is\n * solved for that surface.\n */\n.lineNumber {\n    display: inline-block;\n    width: 2.5ch;\n    margin-right: var(--tempest-space-3);\n    text-align: right;\n    color: var(--tempest-code-comment);\n    user-select: none;\n}\n\n.lineContent {\n    white-space: pre;\n}\n\n/*\n * Syntax colours come from their own `--tempest-code-*` tokens, not from the\n * chart ramp. The ramp is validated for marks, where the contrast floor is 3:1;\n * this is text and needs 4.5:1, and measuring the ramp as text fails in both\n * modes (a keyword came out at 3.47 on the dark surface, a string at 2.03 on\n * the light one). The code tokens are solved for that floor instead.\n */\n.comment {\n    color: var(--tempest-code-comment);\n    font-style: italic;\n}\n\n.string {\n    color: var(--tempest-code-string);\n}\n\n.number {\n    color: var(--tempest-code-number);\n}\n\n.keyword {\n    color: var(--tempest-code-keyword);\n    font-weight: 600;\n}\n\n.literal {\n    color: var(--tempest-code-literal);\n}\n\n.function {\n    color: var(--tempest-code-function);\n}\n\n.tag {\n    color: var(--tempest-code-tag);\n}\n\n.attribute {\n    color: var(--tempest-code-attribute);\n}\n\n.property {\n    color: var(--tempest-code-property);\n}\n\n.punctuation {\n    color: var(--tempest-code-punctuation);\n}\n\n.plain {\n    color: var(--tempest-text);\n}\n"],"mappings":";"}