/**
 * Workspace Studio Store — global foundations.
 *
 * Keep this file limited to tokens, accessibility and global utilities.
 * Brand typography and visual direction will be defined in a later phase.
 */

:root {
	--wss-color-background: #ffffff;
	--wss-color-surface: #ffffff;
	--wss-color-text: #171717;
	--wss-color-muted: #686868;
	--wss-color-border: #dedede;
	--wss-color-accent: #171717;
	--wss-radius-sm: 0.375rem;
	--wss-radius-md: 0.75rem;
	--wss-radius-lg: 1.25rem;
	--wss-shadow-sm: 0 1px 2px rgb(0 0 0 / 0.06);
	--wss-container-width: 80rem;
	--wss-gutter: clamp(1rem, 3vw, 2rem);
}

html {
	scroll-behavior: smooth;
}

body {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

:focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 3px;
}

.wss-container {
	width: min(100% - (2 * var(--wss-gutter)), var(--wss-container-width));
	margin-inline: auto;
}

.wss-visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	padding: 0 !important;
	margin: -1px !important;
	overflow: hidden !important;
	clip: rect(0, 0, 0, 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}