:root { color-scheme:light dark; --background:#fff; --foreground:#000; --primary:#000; --primary-foreground:#fff; --radius:0; }
* { box-sizing:border-box; }
body { margin:0; background:var(--background); color:var(--foreground); font-family:'Helvetica Neue',Helvetica,Arial,sans-serif; -webkit-font-smoothing:antialiased; }
.homepage { width:min(calc(100% - 64px),640px); min-height:100svh; margin:0 auto; padding:clamp(64px,12vh,120px) 0 48px; display:flex; flex-direction:column; }
h1 { margin:0; font-size:clamp(2rem,5vw,2.75rem); font-weight:600; letter-spacing:-.055em; line-height:1.1; }
.apps { display:flex; justify-content:flex-start; flex-wrap:wrap; gap:48px; margin-top:88px; }
.app-link { display:flex; flex-direction:column; align-items:center; width:112px; text-align:center; gap:10px; color:var(--foreground); text-decoration:none; font-size:1rem; font-weight:bold; line-height:1.4; letter-spacing:-.02em; }
.app-link img { display:block; width:112px; height:112px; max-width:100%; object-fit:contain; border-radius:24px; }
.app-link:hover span { text-decoration:underline; text-underline-offset:5px; }
footer { margin-top:auto; padding-top:100px; }
.contact { display:inline-flex; justify-content:center; align-items:center; min-height:48px; min-width:128px; padding:12px 24px; border:1px solid var(--foreground); background:var(--foreground); color:var(--background); font-size:1rem; font-weight:500; line-height:1.4; text-decoration:none; }
.contact:hover { background:var(--background); color:var(--foreground); }
a:focus-visible { outline:2px solid var(--foreground); outline-offset:7px; }
@media(max-width:480px) { .homepage { width:calc(100% - 48px); padding-top:56px; padding-bottom:32px; } .apps { margin-top:64px; gap:24px; } .app-link { width:96px; } .app-link img { width:96px; height:96px; border-radius:21px; } }

@media (prefers-color-scheme:dark) {
  :root { --background:#000; --foreground:#fff; --primary:#fff; --primary-foreground:#000; }
}