:root {
  --bg: #ffffff; --fg: #111111; --mid: #888888;
  --light: #f4f4f4; --border: #e0e0e0; --ball: #111111;
}
body.dark {
  --bg: #0d0d0d; --fg: #e8e8e8; --mid: #666666;
  --light: #1a1a1a; --border: #2a2a2a; --ball: #ffffff;
}
body { background:var(--bg); color:var(--fg); transition:background 0.3s,color 0.3s; }

/* ── Theme toggle ── */
.nav-theme-toggle {
  width:36px; height:36px; border-radius:50%;
  border:1px solid var(--border);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:background 0.2s,border-color 0.3s; flex-shrink:0;
}
.nav-theme-toggle:hover { background:var(--light); }
.theme-ball {
  width:14px; height:14px; border-radius:50%;
  background:var(--ball); transition:background 0.3s,transform 0.25s;
}
.nav-theme-toggle:hover .theme-ball { transform:scale(1.2); }

/* ── Custom cursor ── */
*, *::before, *::after { cursor:none !important; }
.cursor-dot {
  position:fixed; top:0; left:0; width:8px; height:8px;
  background:var(--fg); border-radius:50%; pointer-events:none;
  z-index:99999; transform:translate(-50%,-50%);
  transition:opacity 0.2s; mix-blend-mode:difference;
}
.cursor-ring {
  position:fixed; top:0; left:0; width:36px; height:36px;
  border:1px solid rgba(128,128,128,0.4); border-radius:50%;
  pointer-events:none; z-index:99998; transform:translate(-50%,-50%);
  transition:width 0.22s,height 0.22s,opacity 0.22s;
}
.cursor-ring.hover { width:56px; height:56px; }
.cursor-dot.hidden, .cursor-ring.hidden { opacity:0; }

/* ── Radial overlay ── */
.radial-overlay { position:fixed; inset:0; z-index:9000; display:none; }
.radial-overlay.open { display:block; }

/* ── Radial menu ── */
.radial-menu { position:fixed; z-index:9001; pointer-events:none; }
.radial-menu.open { pointer-events:auto; }

/* 中心の点 — 閉じてる時は完全に非表示 */
.radial-center {
  position:absolute; width:6px; height:6px;
  background:var(--fg); border-radius:50%;
  transform:translate(-50%,-50%); top:0; left:0;
  opacity:0; transition:opacity 0.15s;
  pointer-events:none;
}
.radial-menu.open .radial-center { opacity:1; }

.radial-item {
  position:absolute; top:0; left:0;
  opacity:0; transform:translate(-50%,-50%) scale(0.4);
  transition:opacity 0.22s,transform 0.22s;
}
.radial-menu.open .radial-item { opacity:1; transform:translate(-50%,-50%) scale(1); }
.radial-menu.open .radial-item:nth-child(2) { transition-delay:0.03s; }
.radial-menu.open .radial-item:nth-child(3) { transition-delay:0.06s; }
.radial-menu.open .radial-item:nth-child(4) { transition-delay:0.09s; }
.radial-menu.open .radial-item:nth-child(5) { transition-delay:0.12s; }

.radial-btn { display:flex; flex-direction:column; align-items:center; gap:6px; text-decoration:none; color:var(--fg); }
.radial-btn-circle {
  width:52px; height:52px; border:1px solid var(--border); border-radius:50%;
  background:var(--bg); display:flex; align-items:center; justify-content:center;
  font-size:1.1rem; transition:background 0.18s,border-color 0.18s,transform 0.18s,color 0.18s;
}
.radial-btn:hover .radial-btn-circle { background:var(--fg); color:var(--bg); border-color:var(--fg); transform:scale(1.1); }
.radial-btn-label { font-family:'Outfit',sans-serif; font-weight:300; font-size:0.6rem; letter-spacing:0.18em; text-transform:uppercase; color:var(--mid); white-space:nowrap; transition:color 0.18s; }
.radial-btn:hover .radial-btn-label { color:var(--fg); }

.radial-hint { position:fixed; bottom:2rem; left:50%; transform:translateX(-50%); font-family:'Outfit',sans-serif; font-weight:200; font-size:0.6rem; letter-spacing:0.3em; color:var(--mid); pointer-events:none; z-index:100; transition:opacity 0.6s; white-space:nowrap; }

/* ── Dark mode page overrides ── */
.page-header,.section-header,.meta-item,.projects-grid,.project-card,.link-row,.post-row,.source-label,footer,.bottom-strip { border-color:var(--border) !important; }
.project-card:hover,.link-row:hover,.post-row:hover { background:var(--light) !important; }
.page-eyebrow,.page-sub,.section-sub,.view-all,.project-num,.project-desc,.project-arrow,.link-handle,.link-arrow,.post-date,.post-arrow,.post-loading,.source-label span,.source-label a,#counter,.meta-label,.hero-sub,.hero-label,.hero-scroll span { color:var(--mid) !important; }
.source-label a:hover,.view-all:hover { color:var(--fg) !important; }
.scroll-line { background:linear-gradient(to bottom,var(--fg),transparent) !important; }
.project-name,.link-name,.post-title,.section-title,.page-title,.hero-name,.about-text h3,.meta-value,.footer-copy { color:var(--fg) !important; }

@media (hover:none) {
  .cursor-dot,.cursor-ring { display:none !important; }
  *,*::before,*::after { cursor:auto !important; }
}