/* --- ZERO GRAVITY CORE --- */
:root {
    --bg: #000; --txt: #888; --hl: #fff; --lnk: #fff;
    --bd: #333; 
}
[data-theme="light"] {
    --bg: #fff; --txt: #666; --hl: #000; --lnk: #000; --bd: #ccc;
}

* { box-sizing: border-box; margin: 0; padding: 0; -webkit-tap-highlight-color: transparent; }

body {
    background: var(--bg); color: var(--txt);
    font-family: system-ui, -apple-system, sans-serif;
    font-size: 13px; line-height: 1.5;
    height: 100dvh; width: 100vw; overflow: hidden;
    
    display: flex; flex-direction: column; 
    align-items: center; 
    justify-content: flex-start;
    
    /* HİZALAMA KİLİDİ */
    padding-top: 18vh; 
    padding-left: 2rem; padding-right: 2rem;
    
    user-select: none;
}

.container {
    width: 100%; 
    max-width: 350px; 
    display: flex; flex-direction: column;
}

/* --- HEADER --- */
header {
    flex-shrink: 0; display: flex; justify-content: space-between; align-items: baseline;
    margin-bottom: 1.5rem;
    border-bottom: 1px solid var(--bd); padding-bottom: 0.5rem;
}

.identity { display: flex; gap: 1.2rem; align-items: baseline; }

h1 { color: var(--hl); font-size: 13px; font-weight: 700; letter-spacing: -0.01em; white-space: nowrap; }

nav { display: flex; gap: 1rem; }

/* HIT AREA OPTIMIZATION: Navigasyon linkleri için genişletilmiş tıklama alanı */
a.nav-link { 
    color: var(--txt); text-decoration: none; font-size: 13px; 
    border-bottom: 1px dotted var(--bd); 
    transition: color 0.2s, border-color 0.2s;
    position: relative;
    touch-action: manipulation;
}
a.nav-link::after {
    content: ''; position: absolute; top: -10px; bottom: -10px; left: -10px; right: -10px;
}
a.nav-link:hover { color: var(--hl); border-bottom-color: var(--hl); }

/* HIT AREA OPTIMIZATION: Tema butonu */
button#theme { 
    background: none; border: none; color: var(--txt); cursor: pointer; font-size: 14px; padding: 0; line-height: 1; 
    position: relative;
    touch-action: manipulation;
}
button#theme::after {
    content: ''; position: absolute; top: -15px; bottom: -15px; left: -15px; right: -15px;
}
button#theme:hover { color: var(--hl); }

/* --- MAIN --- */
main { flex-grow: 0; width: 100%; }

ul.node-list { 
    display: grid; 
    grid-template-columns: max-content max-content; 
    gap: 0.6rem 1rem; 
    justify-content: center; 
    list-style: none; 
}

li { display: contents; }

li span { 
    font-size: 11px; opacity: 0.5; text-transform: uppercase; letter-spacing: 0.05em; text-align: right; align-self: center;
}
li span::after { content: ":"; }

li a { 
    color: var(--lnk); text-decoration: none; font-weight: 500; font-family: monospace; font-size: 12px; text-align: left; align-self: center;
    position: relative;
    touch-action: manipulation;
}

/* HIT AREA OPTIMIZATION: Liste linkleri için genişletilmiş tıklama alanı */
li a::after {
    content: ''; position: absolute; top: -8px; bottom: -8px; left: -20px; right: -20px;
}

li a:hover { text-decoration: underline; }

/* --- FOOTER --- */
footer {
    position: fixed; bottom: 1.5rem; left: 0; width: 100%;
    text-align: center; font-size: 10px; opacity: 0.3;
    pointer-events: none; text-transform: uppercase;
}