html{scroll-behavior:smooth}
main.home-main{flex-direction:column;align-items:center}
.apps-section{width:100%;max-width:1100px;margin:100px auto 20px;padding-top:60px;border-top:1px solid #34353a;scroll-margin-top:32px;outline:none}
.apps-heading{margin-bottom:42px}.apps-heading h2{font-size:clamp(36px,5vw,62px);font-weight:500;line-height:1.08;letter-spacing:-.055em;margin:0 0 16px}.apps-heading>p{font-size:16px;line-height:1.6;color:#a7a8b1;margin:0}
.apps-grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:46px 32px;align-items:start}
.app-card{min-width:0}.app-launch{display:block;color:var(--text);text-decoration:none}.app-art{display:grid;place-items:center;aspect-ratio:1;overflow:hidden;border-radius:24px;background:#202221;box-shadow:inset 0 0 0 1px #ffffff0b;transition:transform .25s ease,box-shadow .25s ease}
.app-art img{display:block;width:100%;height:100%;object-fit:contain;min-width:0;min-height:0}
.app-wissen .app-art{background:#7655d9}.app-wissen .app-art img{width:78%;height:78%}.app-auge .app-art{background:#f4eee9}.app-auge .app-art img{width:91%;height:91%}.app-verschwoerung .app-art{background:#f5b511}.app-verschwoerung .app-art img{width:68%;height:68%}.app-banane .app-art{background:#ffe286}.app-banane .app-art img{object-fit:cover}
.app-launch h3{font-size:18px;line-height:1.35;letter-spacing:-.025em;font-weight:500;min-height:2.7em;margin:17px 0 0;overflow-wrap:anywhere;hyphens:auto}
.app-detail{margin-top:4px}.app-detail summary{list-style:none;display:inline-flex;align-items:center;gap:7px;min-height:36px;padding:3px 3px 3px 0;cursor:pointer;color:#a7a8b1;font-size:12px;user-select:none}.app-detail summary::-webkit-details-marker{display:none}.info-symbol{display:grid;place-items:center;border:1px solid #6a6b75;width:16px;height:16px;border-radius:50%;font-size:11px;font-weight:500;line-height:1}.info-less{display:none}.app-detail[open] .info-more{display:none}.app-detail[open] .info-less{display:inline}.app-detail summary:hover,.app-detail[open] summary{color:var(--lime)}.app-detail summary:focus-visible{outline:2px solid var(--accent);outline-offset:4px;border-radius:3px}.app-detail p{font-size:14px;line-height:1.75;color:#b9b9c2;margin:9px 0 0;overflow-wrap:anywhere}.app-launch:focus-visible{outline:2px solid var(--accent);outline-offset:6px;border-radius:24px 24px 0 0}
@media(hover:hover){.app-launch:hover .app-art{transform:translateY(-5px) scale(1.015);box-shadow:0 14px 30px #0004}.app-launch:hover h3{color:var(--app-accent,var(--lime))}}
@media(max-width:900px){.apps-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:36px 24px}}
@media(max-width:600px){.apps-section{margin-top:64px;padding-top:36px;scroll-margin-top:20px}.apps-heading{margin-bottom:28px}.apps-heading>p{font-size:14px;max-width:260px}.apps-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 20px}.app-art{border-radius:19px}.app-launch h3{font-size:15px;margin-top:13px;min-height:2.7em}.app-detail{margin-top:1px}.app-detail p{font-size:13px}.app-detail summary{min-height:38px}.apps-heading h2{font-size:38px}}
@media(max-width:350px){.apps-grid{gap:26px 16px}.app-launch h3{font-size:14px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.app-art{transition:none}}

/* Accent colors from the individual apps, shared by hover and keyboard focus. */
.app-chaoschess{--app-accent:#ffe34a}.app-wissen{--app-accent:#b39aff}.app-auge{--app-accent:#f2537b}.app-musik{--app-accent:#ff722d}.app-verschwoerung{--app-accent:#f5b511}.app-banane{--app-accent:#f5d540}.app-pawnshift{--app-accent:#c8f863}
.app-launch h3{transition:color .18s ease}.app-launch:focus-visible h3{color:var(--app-accent,var(--lime))}
@media(prefers-reduced-motion:reduce){.app-launch h3{transition:none}}
