/* KIMYA.DEV™ — SILENCE ENGINEERING — Three modes: dark / light / earth */

/* ===== EARTH (default) ===== */
[data-theme="earth"]{
  --bg:#f0e4ce;--bg-alt:#e6d8bc;--bg-deep:#d4c5a5;--bg-invert:#1a1510;--bg-sand:#f5ecd6;
  --border:#d4c5a5;--text:#2e2418;--text-mid:#4a3d2e;--text-dim:#8a7560;--text-ghost:#a8957d;
  --accent:#c43020;--accent2:#2a7a50;--accent3:#2a5090;--ochre:#b8862a;
  --grid:rgba(74,61,46,0.06);
  --ticker-bg:#1a1510;--ticker-text:rgba(240,228,206,0.3);--ticker-val:rgba(240,228,206,0.75);--ticker-gv:#00cc66;
  --manifesto-bg:#1a1510;--manifesto-text:#f0e4ce;--manifesto-strike:#666;--manifesto-right-bg:#f5ecd6;
}
/* ===== DARK ===== */
[data-theme="dark"]{
  --bg:#0a0a0a;--bg-alt:#111;--bg-deep:#1a1a1a;--bg-invert:#f0f0f0;--bg-sand:#1a1a1a;
  --border:#2a2a2a;--text:#f0f0f0;--text-mid:#ccc;--text-dim:#888;--text-ghost:#555;
  --accent:#ff3333;--accent2:#00ff88;--accent3:#3366ff;--ochre:#ffcc00;
  --grid:rgba(255,255,255,0.03);
  --ticker-bg:#111;--ticker-text:rgba(255,255,255,0.35);--ticker-val:rgba(255,255,255,0.8);--ticker-gv:#00ff88;
  --manifesto-bg:#111;--manifesto-text:#f0f0f0;--manifesto-strike:#555;--manifesto-right-bg:#0a0a0a;
}
/* ===== LIGHT ===== */
[data-theme="light"]{
  --bg:#fafafa;--bg-alt:#f2f2f0;--bg-deep:#e8e8e4;--bg-invert:#0a0a0a;--bg-sand:#f2f2f0;
  --border:#d0d0cc;--text:#0a0a0a;--text-mid:#1a1a1a;--text-dim:#666;--text-ghost:#999;
  --accent:#e02020;--accent2:#00875a;--accent3:#2255cc;--ochre:#c49000;
  --grid:rgba(0,0,0,0.035);
  --ticker-bg:#0a0a0a;--ticker-text:rgba(255,255,255,0.35);--ticker-val:rgba(255,255,255,0.8);--ticker-gv:#00ff88;
  --manifesto-bg:#0a0a0a;--manifesto-text:#fafafa;--manifesto-strike:#666;--manifesto-right-bg:#fafafa;
}

/* ===== RESET ===== */
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:'DM Sans',sans-serif;overflow-x:hidden;-webkit-font-smoothing:antialiased;transition:background .4s,color .4s}
body::before{content:'';position:fixed;top:0;left:0;right:0;bottom:0;background:repeating-linear-gradient(0deg,var(--grid) 0px,var(--grid) 1px,transparent 1px,transparent 80px),repeating-linear-gradient(90deg,var(--grid) 0px,var(--grid) 1px,transparent 1px,transparent 80px);pointer-events:none;z-index:0}
a{color:inherit}

/* ===== NAV ===== */
nav{position:fixed;top:0;left:0;right:0;z-index:100;display:flex;justify-content:space-between;align-items:stretch;background:var(--bg);border-bottom:1px solid var(--border);height:48px;transition:background .4s}
.nav-brand{display:flex;align-items:center;padding:0 1.5rem;border-right:1px solid var(--border);font-weight:900;font-size:.9rem;letter-spacing:.1em;color:var(--text);text-decoration:none}
.nav-brand .tm{font-size:.55rem;vertical-align:super;color:var(--accent);font-weight:400}
.nav-links{display:flex;list-style:none;height:100%}
.nav-links li{border-left:1px solid var(--border)}
.nav-links a{display:flex;align-items:center;padding:0 1.5rem;height:100%;font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);text-decoration:none;transition:all .2s}
.nav-links a:hover{background:var(--accent);color:var(--bg)}
.nav-right{display:flex;align-items:stretch}
.theme-toggle{display:flex;align-items:center;gap:6px;padding:0 1rem;border-left:1px solid var(--border)}
.theme-dot{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--border);cursor:pointer;transition:all .2s;background:none;padding:0}
.theme-dot:hover{transform:scale(1.3)}
.theme-dot.active{border-width:2px;transform:scale(1.2)}
.dot-dark{background:#0a0a0a;border-color:#555}.dot-dark.active{border-color:#ff3333}
.dot-earth{background:#d4c5a5;border-color:#a8957d}.dot-earth.active{border-color:#c43020}
.dot-light{background:#fafafa;border-color:#ccc}.dot-light.active{border-color:#e02020}
.nav-status{display:flex;align-items:center;padding:0 1.5rem;border-left:1px solid var(--border);font-family:'Space Mono',monospace;font-size:.6rem;color:var(--accent2);gap:.4rem;letter-spacing:.08em}
.status-dot{width:6px;height:6px;border-radius:50%;background:var(--accent2);animation:pulse 2s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.3}}
.nav-toggle{display:none;background:none;border:none;cursor:pointer;width:28px;height:20px;position:relative;margin:auto 1rem}
.nav-toggle span{display:block;width:100%;height:2px;background:var(--text);position:absolute;left:0;transition:all .3s}
.nav-toggle span:nth-child(1){top:0}.nav-toggle span:nth-child(2){top:9px}.nav-toggle span:nth-child(3){top:18px}

/* ===== HERO ===== */
.hero{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;position:relative;z-index:1;padding-top:48px}
.hero-left{display:flex;flex-direction:column;justify-content:center;padding:4rem 3rem;border-right:1px solid var(--border)}
.hero-label{font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text-dim);margin-bottom:1.5rem;display:flex;align-items:center;gap:.8rem}
.hero-label::before{content:'';width:30px;height:1px;background:var(--accent)}
.hero-title{font-size:clamp(3rem,7vw,6rem);font-weight:900;line-height:.9;letter-spacing:-.03em;margin-bottom:.5rem}
.hero-title .accent{color:var(--accent)}
.hero-title .jp-sub{display:block;font-family:'Noto Sans JP',sans-serif;font-size:clamp(1.2rem,3vw,2.2rem);font-weight:100;letter-spacing:.15em;color:var(--text-dim);margin-top:.5rem;opacity:.5}
.hero-tagline{font-size:clamp(1rem,2vw,1.3rem);font-weight:300;color:var(--text-dim);margin:2rem 0;max-width:400px;line-height:1.7}
.hero-cta{display:flex;gap:0;margin-top:1rem}
.cta-btn{font-family:'Space Mono',monospace;font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;padding:.9rem 2rem;text-decoration:none;border:1px solid var(--border);transition:all .2s;color:var(--text)}
.cta-primary{background:var(--text);color:var(--bg);border-color:var(--text)}
.cta-btn:hover{background:var(--accent);color:var(--bg);border-color:var(--accent)}
.hero-right{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:4rem 2rem;overflow:hidden;background:var(--bg-alt);transition:background .4s}
.geo-container{position:relative;width:min(360px,80%);height:min(360px,80%)}
.geo-ring{position:absolute;border:1px solid;border-radius:50%;animation:spin linear infinite}
.geo-ring:nth-child(1){inset:0;border-color:color-mix(in srgb,var(--accent) 20%,transparent);animation-duration:20s}
.geo-ring:nth-child(2){inset:30px;border-color:color-mix(in srgb,var(--accent2) 15%,transparent);animation-duration:30s;animation-direction:reverse}
.geo-ring:nth-child(3){inset:60px;border-color:color-mix(in srgb,var(--accent3) 15%,transparent);animation-duration:25s}
.geo-ring:nth-child(4){inset:90px;border-color:color-mix(in srgb,var(--ochre) 12%,transparent);animation-duration:35s;animation-direction:reverse}
@keyframes spin{to{transform:rotate(360deg)}}
.geo-center{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}
.geo-center .kanji{font-family:'Noto Sans JP',sans-serif;font-size:4rem;font-weight:100;color:var(--text);opacity:.18;display:block;line-height:1}
.geo-center .label{font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.3em;color:var(--text-dim);margin-top:.5rem}

/* ===== TICKER ===== */
.ticker{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:.8rem 0;overflow:hidden;position:relative;z-index:1;background:var(--ticker-bg);transition:background .4s}
.ticker-track{display:flex;gap:3rem;animation:scroll 30s linear infinite;white-space:nowrap}
@keyframes scroll{to{transform:translateX(-50%)}}
.ticker-item{font-family:'Space Mono',monospace;font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--ticker-text);flex-shrink:0}
.ticker-item .val{color:var(--ticker-val)}
.ticker-item .gv{color:var(--ticker-gv)}

/* ===== SECTIONS ===== */
.section{position:relative;z-index:1;border-bottom:1px solid var(--border)}
.section-header{display:flex;align-items:center;justify-content:space-between;padding:1.2rem 3rem;border-bottom:1px solid var(--border);background:var(--bg-alt);transition:background .4s}
.section-id{font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text-dim);display:flex;align-items:center;gap:.8rem}
.section-id::before{content:'';width:8px;height:8px;background:var(--accent)}
.section-id.yellow-id::before{background:var(--ochre)}
.section-jp{font-family:'Noto Sans JP',sans-serif;font-size:.75rem;font-weight:300;color:var(--text-ghost);letter-spacing:.2em}

/* ===== BLOG GRID ===== */
.blog-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.blog-card{padding:2rem 1.5rem;border-right:1px solid var(--border);position:relative;transition:all .25s;cursor:pointer;text-decoration:none;display:block;color:var(--text)}
.blog-card:last-child{border-right:none}
.blog-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .3s}
.blog-card:hover{background:var(--bg-alt)}
.blog-card:hover::before{transform:scaleX(1)}
.blog-num{font-size:3rem;font-weight:900;color:var(--border);line-height:1;margin-bottom:1rem;transition:color .3s}
.blog-card:hover .blog-num{color:var(--accent)}
.blog-cat{font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.15em;text-transform:uppercase;margin-bottom:.8rem;display:flex;align-items:center;gap:.4rem;color:var(--text-dim)}
.blog-cat-dot{width:5px;height:5px;border-radius:50%;background:var(--accent2)}
.blog-title{font-size:1.05rem;font-weight:700;line-height:1.3;margin-bottom:.6rem;letter-spacing:-.01em}
.blog-excerpt{font-size:.8rem;font-weight:300;color:var(--text-dim);line-height:1.6;margin-bottom:1rem}
.blog-date{font-family:'Space Mono',monospace;font-size:.55rem;color:var(--text-ghost);letter-spacing:.1em}

/* ===== MANIFESTO ===== */
.manifesto{display:grid;grid-template-columns:1fr 1fr;min-height:60vh}
.manifesto-left{display:flex;flex-direction:column;justify-content:center;padding:4rem 3rem;border-right:1px solid var(--border);background:var(--manifesto-bg);transition:background .4s}
.manifesto-slogans{display:flex;flex-direction:column;gap:.3rem}
.slogan{font-weight:900;font-size:clamp(1.5rem,3.5vw,2.8rem);line-height:1.1;letter-spacing:-.02em;color:var(--manifesto-text);transition:color .2s;cursor:default}
.slogan:hover{color:var(--accent)}
.slogan .strike{text-decoration:line-through;color:var(--manifesto-strike)}
.manifesto-right{display:flex;flex-direction:column;justify-content:center;padding:4rem 3rem;background:var(--manifesto-right-bg);transition:background .4s}
.manifesto-text{font-size:1rem;font-weight:300;line-height:1.9;color:var(--text-dim);max-width:420px}
.manifesto-text strong{color:var(--text);font-weight:500}
.manifesto-sig{margin-top:2rem;font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--text-ghost)}

/* ===== SINGLE POST ===== */
.post-single{padding-top:48px;position:relative;z-index:1}
.post-header{padding:4rem 3rem 3rem;border-bottom:1px solid var(--border);max-width:800px;margin:0 auto}
.post-meta-top{display:flex;gap:2rem;font-family:'Space Mono',monospace;font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-ghost);margin-bottom:1.5rem}
.post-title-full{font-size:clamp(2rem,4vw,3rem);font-weight:900;line-height:1.1;letter-spacing:-.02em;margin-bottom:1rem}
.post-description{font-size:1.1rem;font-weight:300;color:var(--text-dim);line-height:1.7;margin-bottom:1.5rem}
.post-tags-full{display:flex;gap:.4rem;flex-wrap:wrap}
.post-tag-full{font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.12em;text-transform:uppercase;padding:.3rem .6rem;border:1px solid var(--border);color:var(--text-dim);text-decoration:none;transition:all .2s}
.post-tag-full:hover{border-color:var(--accent);color:var(--accent)}
.post-content{max-width:680px;margin:0 auto;padding:3rem 2rem 4rem;font-size:1.05rem;font-weight:300;line-height:1.9;color:var(--text-mid)}
.post-content h2{font-size:1.5rem;font-weight:900;margin:2.5rem 0 1rem;color:var(--text);letter-spacing:-.01em}
.post-content h3{font-size:1.2rem;font-weight:700;margin:2rem 0 .8rem;color:var(--text)}
.post-content p{margin-bottom:1.2rem}
.post-content a{color:var(--accent);text-decoration:underline;text-underline-offset:3px}
.post-content a:hover{color:var(--accent2)}
.post-content blockquote{border-left:3px solid var(--accent);margin:1.5rem 0;padding:.8rem 1.5rem;background:var(--bg-alt);color:var(--text);font-style:italic}
.post-content code{font-family:'Space Mono',monospace;font-size:.9em;background:var(--bg-alt);padding:.15rem .4rem;border-radius:2px}
.post-content pre{background:var(--bg-invert);color:var(--bg);padding:1.5rem;overflow-x:auto;margin:1.5rem 0;font-size:.85rem;line-height:1.6}
.post-content pre code{background:none;padding:0;color:inherit}
.post-content img{max-width:100%;height:auto;margin:1.5rem 0}
.post-content strong{color:var(--text);font-weight:500}
.post-content ol,.post-content ul{margin:0 0 1.2rem 1.5rem}
.post-content li{margin-bottom:.4rem}
.post-content hr{border:none;height:1px;background:var(--border);margin:2rem 0}
.post-footer-nav{display:flex;border-top:1px solid var(--border);max-width:800px;margin:0 auto}
.post-nav-link{flex:1;padding:2rem;text-decoration:none;color:var(--text);transition:background .2s;border-right:1px solid var(--border)}
.post-nav-link:last-child{border-right:none}
.post-nav-link:hover{background:var(--bg-alt)}
.post-nav-link.next{text-align:right}
.post-nav-label{font-family:'Space Mono',monospace;font-size:.55rem;letter-spacing:.15em;text-transform:uppercase;color:var(--text-ghost);display:block;margin-bottom:.3rem}
.post-nav-title{font-size:.95rem;font-weight:700}

/* ===== FOOTER ===== */
footer{position:relative;z-index:1;border-top:1px solid var(--border)}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.5rem;background:var(--ticker-bg);transition:background .4s}
.footer-copy{font-family:'Space Mono',monospace;font-size:.5rem;letter-spacing:.12em;color:var(--ticker-text);text-transform:uppercase}
.footer-barcode{display:flex;gap:2px;align-items:end}
.footer-barcode span{display:block;width:2px;background:var(--ticker-text)}

/* ===== REVEAL ===== */
.reveal{opacity:0;transform:translateY(15px);transition:opacity .6s,transform .6s}
.reveal.visible{opacity:1;transform:translateY(0)}

/* ===== RESPONSIVE ===== */
@media(max-width:900px){
  .hero{grid-template-columns:1fr}.hero-right{min-height:50vh}
  .blog-grid{grid-template-columns:1fr 1fr}
  .manifesto{grid-template-columns:1fr}.manifesto-left{border-right:none;border-bottom:1px solid var(--border)}
}
@media(max-width:600px){
  .nav-links{display:none;position:absolute;top:100%;right:0;left:0;background:var(--bg);border-bottom:1px solid var(--border);flex-direction:column}
  .nav-links.open{display:flex}
  .nav-links li{border-left:none;border-top:1px solid var(--border)}
  .nav-links a{padding:1rem 1.5rem}
  .nav-toggle{display:block}
  .nav-status{display:none}
  .blog-grid{grid-template-columns:1fr}
  .blog-card{border-right:none;border-bottom:1px solid var(--border)}
  .hero-left{padding:3rem 1.5rem}
  .section-header{padding:1rem 1.5rem}
  .post-header{padding:3rem 1.5rem 2rem}
  .post-content{padding:2rem 1.5rem 3rem}
}