EmilandClaude Sonnet 5
b5ffc67a82
New design: studio backdrop with a perspective floor and X/Z axis lines, an orientation gizmo that orbits on scroll, Bricolage Grotesque and Instrument Sans (bundled, no build-time network). Projects are laid out as plates by a row planner that keeps every row full for any count; a demo image from the repo root is shown when present, otherwise a generated voxel sculpture. Text and projects still come live from Gitea. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_01XtcZtnG4GQA1d6mW5PNrS9
43 lines
1.4 KiB
CSS
43 lines
1.4 KiB
CSS
/* Design tokens: a studio-lit 3D viewport. Axis colours (X red, Y green, Z blue) are marks and lines, not text. */
|
|
:root {
|
|
--studio: #e6e9ed;
|
|
--studio-deep: #cdd3db;
|
|
--paper: #f4f6f8;
|
|
--ink: #15181d;
|
|
--muted: #5b6571;
|
|
--line: rgba(21, 24, 29, 0.14);
|
|
--x: #e0384b;
|
|
--y: #5aa300;
|
|
--z: #2c63e0;
|
|
--z-text: #2455c9;
|
|
|
|
--radius-plate: 18px;
|
|
--radius-control: 10px;
|
|
--shell: min(1240px, calc(100% - 48px));
|
|
--gutter: clamp(20px, 3vw, 32px);
|
|
--section: clamp(84px, 11vw, 148px);
|
|
|
|
--font-body: var(--font-text), 'Segoe UI', system-ui, sans-serif;
|
|
--font-head: var(--font-display), 'Segoe UI', system-ui, sans-serif;
|
|
}
|
|
|
|
* { box-sizing: border-box; }
|
|
html { background: var(--paper); scroll-behavior: smooth; scroll-padding-top: 88px; }
|
|
body {
|
|
margin: 0;
|
|
color: var(--ink);
|
|
font: 400 17px/1.6 var(--font-body);
|
|
-webkit-font-smoothing: antialiased;
|
|
text-rendering: optimizeLegibility;
|
|
}
|
|
a { color: inherit; }
|
|
h1, h2, h3, p, ul, dl, dd, figure { margin: 0; }
|
|
ul { padding: 0; list-style: none; }
|
|
::selection { background: var(--z); color: #fff; }
|
|
:focus-visible { outline: 3px solid var(--z); outline-offset: 3px; border-radius: 4px; }
|
|
|
|
@media (prefers-reduced-motion: reduce) {
|
|
html { scroll-behavior: auto; }
|
|
*, *::before, *::after { animation-duration: 0.01ms !important; animation-delay: 0ms !important; transition-duration: 0.01ms !important; }
|
|
}
|