:root { color-scheme: light; --ink:#172725; --soft:#64716e; --teal:#123b39; --paper:#fffdf8; --ivory:#f3f0e7; --line:rgba(23,62,59,.16); }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:var(--ivory); font:15px/1.5 Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; }
header { padding:28px clamp(18px,4vw,54px); color:white; background:var(--teal); }
header a { color:white; }
header h1 { margin:12px 0 4px; font-size:clamp(30px,5vw,54px); letter-spacing:-.04em; }
header p { max-width:760px; margin:0; color:rgba(255,255,255,.72); }
main { width:min(1180px,calc(100% - 32px)); margin:28px auto 60px; }
.screen-links { margin:0; padding:0; list-style:none; border-top:1px solid var(--line); }
.screen-links li { border-bottom:1px solid var(--line); }
.screen-links a { display:block; padding:12px 14px; color:var(--teal); background:var(--paper); font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Courier New",monospace; text-decoration:underline; overflow-wrap:anywhere; }
.screen-links a:hover, .screen-links a:focus-visible { color:white; background:#285f5d; outline:none; }