/* Original CSS night sky. Shared palette, type, header and socials. */
.directory-frame{min-height:100svh;display:flex;flex-direction:column}
.directory-sky{background-color:var(--bg);background-image:radial-gradient(ellipse at 78% 12%,#405fa11c,transparent 58%),radial-gradient(1px 1px at 23px 46px,var(--accent) 95%,transparent),radial-gradient(1px 1px at 118px 160px,#8199d269 95%,transparent),radial-gradient(1px 1px at 186px 62px,#a8c6ff57 95%,transparent),radial-gradient(1px 1px at 80px 224px,#8199d24d 95%,transparent);background-size:auto,247px 283px,331px 347px,457px 419px,293px 373px}
.directory-main{flex:1;width:86%;max-width:1040px;margin:0 auto;padding:78px 0 80px}
.directory-intro{margin-bottom:58px}.directory-intro h1{font-size:26px;line-height:1.25;letter-spacing:-.02em;font-weight:650;margin:0 0 10px}.directory-intro p{font-size:17px;line-height:1.6;color:var(--muted)}
.directory-projects>h2{font:550 12px/1.5 Familjen,Arial,sans-serif;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);margin:0 0 18px}
.directory-list{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.directory-list li{margin:0;min-width:0}
.directory-project{display:block;height:100%;padding:8px 8px 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel);transition:border-color .2s,background .2s}
.directory-project:hover{border-color:var(--accent);background:var(--paper)}.directory-project h3{font-size:16px;line-height:1.4;letter-spacing:-.2px;font-weight:500;margin:13px 6px 5px}.directory-project p{font:14px/1.5 Familjen,Arial,sans-serif;color:var(--muted);margin:0 6px}
.project-preview{position:relative;aspect-ratio:1.6;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;padding:20px;border:1px solid var(--line);border-radius:7px;background-color:var(--sky);background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:32px 32px;color:var(--muted)}
.preview-number{align-self:end;font:36px/1 Familjen,Arial,sans-serif;letter-spacing:-.06em;color:var(--accent);opacity:.65}.preview-label{font:9px/1.5 JetBrains,monospace;letter-spacing:.025em;align-self:start;padding:5px 7px;background:var(--sky)}.preview-two{background-position:16px 16px}.preview-three{background-size:48px 48px}
.directory-heading{margin-bottom:46px}.directory-eyebrow{font:10px/1.7 JetBrains,monospace;letter-spacing:.045em;color:var(--muted)}.directory-heading h1{font-size:clamp(48px,6vw,80px);line-height:1.05;letter-spacing:-.055em;font-weight:500;margin:20px 0 18px}.directory-lede{font-size:19px;line-height:1.6;color:var(--muted)}
.play-header nav a[aria-current=page]{color:var(--accent)}.directory-page .play-footer{border-top:1px solid var(--line);flex-wrap:wrap;background:transparent}.directory-page .footer-social{margin-left:auto}.directory-credits{flex-basis:100%;font:9px/1.9 JetBrains,monospace;color:var(--muted)}.directory-credits a{text-decoration:underline;text-underline-offset:3px}.directory-credits a:hover{color:var(--text)}
.directory-back{display:inline-flex;align-items:center;min-height:44px;color:var(--muted);font:11px/1.7 JetBrains,monospace;margin-bottom:32px}.directory-back:hover{color:var(--accent)}.directory-placeholder{padding:20px 0 60px}
@media(max-width:960px){.directory-list{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:760px){.directory-main{width:88%;padding:44px 0 52px}.directory-intro{margin-bottom:42px}.directory-intro p{font-size:16px}.directory-page .footer-social{margin-left:0;order:initial;width:auto;gap:20px}.directory-credits{font-size:8px;line-height:2}.directory-placeholder{padding-top:4px}.directory-placeholder h1{font-size:clamp(48px,13vw,64px)}}
@media(max-width:620px){.directory-list{grid-template-columns:minmax(0,1fr);gap:20px}.project-preview{aspect-ratio:1.7}.directory-project h3{font-size:16px}.directory-project p{font-size:14px}}
