/* ===== CSS変数・リセット・共通レイアウト ===== */
:root {
  --bg:#080b10; --bg2:#0d1117; --bg3:#111820;
  --border:#1e2d3d; --border2:#243447;
  --red:#e84040; --red-dim:#7a1f1f;
  --amber:#f0a500; --cyan:#00c8e0; --cyan-dim:#006370;
  --green:#00e57a; --green-dim:#006638;
  --blue:#3b82f6; --purple:#a855f7;
  --text:#c9d5e0; --text-dim:#5a7080; --text-bright:#e8f0f8;
  --mono:'JetBrains Mono',monospace; --sans:'Noto Sans JP',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{font-family:var(--sans);background:var(--bg);color:var(--text);min-height:100vh;background-image:linear-gradient(180deg,#080b10 0%,#060810 100%);}
.header-wrap{position:relative;border-bottom:1px solid var(--border);}
.header{max-width:1400px;margin:0 auto;padding:28px 32px 24px;display:grid;grid-template-columns:1fr auto;align-items:start;gap:16px;}
.header h1{font-family:var(--mono);font-size:1.7rem;font-weight:700;color:var(--text-bright);letter-spacing:-0.01em;line-height:1.2;}
.header-meta{margin-top:10px;display:flex;flex-wrap:wrap;gap:20px;}
.header-meta-item{font-family:var(--mono);font-size:0.85rem;color:var(--text-dim);display:flex;align-items:center;gap:6px;}
.header-meta-item .meta-label{color:var(--text-dim);}
.header-meta-item span{color:var(--cyan);}
.header-meta-item span a{color:inherit;text-decoration:none;border-bottom:1px dotted rgba(0,200,224,0.4);transition:border-color 0.15s;}
.header-meta-item span a:hover{border-bottom-color:var(--cyan);}
.header-note{margin-top:10px;font-size:0.83rem;color:var(--text-dim);background:rgba(0,200,224,0.05);border:1px solid rgba(0,200,224,0.12);border-left:2px solid var(--cyan-dim);padding:6px 12px;border-radius:0 4px 4px 0;}
.header-right{display:flex;flex-direction:column;align-items:flex-end;gap:10px;}
.lang-toggle{display:flex;gap:4px;}
.lang-btn{font-family:var(--mono);font-size:0.7rem;font-weight:600;letter-spacing:0.05em;padding:5px 12px;border-radius:3px;border:1px solid var(--border2);background:transparent;color:var(--text-dim);cursor:pointer;transition:all 0.15s;}
.container{max-width:1400px;margin:0 auto;padding:28px 32px 48px;}
.section-title{font-family:var(--mono);font-size:0.82rem;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-dim);margin:28px 0 14px;display:flex;align-items:center;gap:10px;}
.section-title::after{content:'';flex:1;height:1px;background:var(--border);}
.footer{border-top:1px solid var(--border);padding:20px 32px;max-width:1400px;margin:0 auto;display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;}
.footer-left{display:flex;flex-direction:column;gap:4px;}
.footer p{font-family:var(--mono);font-size:0.74rem;color:var(--text-dim);opacity:0.6;letter-spacing:0.03em;}
.footer a{color:var(--text-dim);text-decoration:none;}
.footer a:hover{color:var(--cyan);}
@media(max-width:768px){
  .header{grid-template-columns:1fr;padding:20px 16px;}
  .header-right{flex-direction:row;align-items:center;}
  .container{padding:20px 16px 40px;}
  .footer{padding:16px;}
}