/* Romuvos gimnazijos dizaino tokenai Pagrindas: geltona/oranžinė + tamsus; WCAG 2.1 AA atitiktis */ :root { /* Brand */ --brand-yellow: #F5B301; /* pagrindinė geltona */ --brand-yellow-deep: #E09600; --brand-orange: #E8541E; /* akcentas */ --brand-orange-deep: #C33E0E; --brand-amber: #FFD54A; /* Neutrals — warm */ --ink-900: #1A1410; /* pagrindinis tekstas */ --ink-700: #3A2F26; --ink-500: #6B5D52; --ink-300: #A89C92; --ink-100: #E8E0D6; --ink-50: #F5EFE6; --paper: #FAF6EF; /* lengvas kreminės */ --white: #FFFFFF; /* Functional */ --green: #2E7D3A; --green-soft: #E6F2E8; --red: #C63B2F; --red-soft: #FAE6E3; --blue: #1E5BA8; --blue-soft: #E3EDF8; /* Radii */ --r-xs: 4px; --r-sm: 8px; --r-md: 12px; --r-lg: 20px; --r-xl: 32px; /* Shadows */ --shadow-sm: 0 1px 2px rgba(26,20,16,.06), 0 1px 3px rgba(26,20,16,.08); --shadow-md: 0 4px 12px rgba(26,20,16,.08), 0 2px 4px rgba(26,20,16,.06); --shadow-lg: 0 12px 32px rgba(26,20,16,.12), 0 4px 8px rgba(26,20,16,.06); /* Spacing scale */ --s-1: 4px; --s-2: 8px; --s-3: 12px; --s-4: 16px; --s-5: 24px; --s-6: 32px; --s-7: 48px; --s-8: 64px; --s-9: 96px; /* Type */ --font-sans: "Inter Tight", "Helvetica Neue", system-ui, sans-serif; --font-serif: "Source Serif 4", "Georgia", serif; --font-display: "Fraunces", "Source Serif 4", Georgia, serif; /* Accessibility defaults (overrideable) */ --a-font-scale: 1; --a-line-height: 1.55; --a-letter-spacing: 0; --a-content-scale: 1; } /* Accessibility themes (toggled via data attribute on ) */ html[data-theme="invert"] { filter: invert(1) hue-rotate(180deg); } html[data-theme="grayscale"] { filter: grayscale(1); } html[data-theme="dark-contrast"] { --paper: #0B0906; --white: #0B0906; --ink-900: #FFF8E8; --ink-700: #F0E6D0; --ink-500: #CDBDA8; --ink-300: #8A7E6E; --ink-100: #2A231C; --ink-50: #1A1410; --brand-yellow: #FFD400; --brand-orange: #FF7A3D; } html[data-theme="light-contrast"] { --paper: #FFFFFF; --white: #FFFFFF; --ink-900: #000000; --ink-700: #111111; --brand-yellow: #FFC000; --brand-orange: #D6401A; } html[data-saturation="low"] { filter: saturate(.4); } html[data-saturation="high"] { filter: saturate(1.6); } html[data-links="bold"] a { text-decoration: underline !important; font-weight: 600 !important; } html[data-headings="bold"] h1, html[data-headings="bold"] h2, html[data-headings="bold"] h3 { font-weight: 800 !important; } html[data-reading="on"] *:not(.a11y-panel):not(.a11y-panel *):not(.a11y-toggle):not(.a11y-toggle *) { background: var(--paper) !important; color: var(--ink-900) !important; box-shadow: none !important; } body { font-size: calc(16px * var(--a-font-scale)); line-height: var(--a-line-height); letter-spacing: var(--a-letter-spacing); } /* Content scale wrapper */ .a-content { zoom: var(--a-content-scale); } /* Reset */ *, *::before, *::after { box-sizing: border-box; } html, body { margin: 0; padding: 0; } body { background: var(--paper); color: var(--ink-900); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; } a { color: inherit; } button { font-family: inherit; cursor: pointer; border: none; background: none; } img { max-width: 100%; display: block; } /* Skip link */ .skip-link { position: absolute; top: -100px; left: 16px; z-index: 9999; background: var(--ink-900); color: var(--brand-yellow); padding: 12px 20px; font-weight: 700; border-radius: 0 0 8px 8px; } .skip-link:focus { top: 0; outline: 3px solid var(--brand-yellow); } /* Focus */ :focus-visible { outline: 3px solid var(--brand-orange); outline-offset: 2px; border-radius: 2px; }