/* ===== EA検証ラボ — quant research-journal / terminal theme ===== */
:root{
  --bg:#090c11; --bg2:#06080c; --surface:#0f151e; --panel:#1a2230; --panel2:#212b3a;
  --line:#222c38; --line2:#303c4b;
  --fg:#dce3ea; --fg2:#bcc6d1; --mut:#7d8896; --faint:#566170;
  --accent:#22d3ee;            /* cyan — primary/links */
  --blue:#60a5fa; --green:#34d399; --amber:#fbbf24; --red:#f87171;
  --cyan:#22d3ee; --violet:#c4a7fb;
  --radius:6px;
  --mono:ui-monospace,"JetBrains Mono","SF Mono","Cascadia Code",Consolas,"Courier New",monospace;
  --sans:system-ui,-apple-system,"Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif;
}
/* category accent mapping (any element with data-cat exposes --c) */
[data-cat="confirmed-system"]{--c:var(--green)}
[data-cat="trend"]{--c:var(--blue)}
[data-cat="mean-reversion"]{--c:var(--cyan)}
[data-cat="risk"]{--c:var(--amber)}
[data-cat="rejected"]{--c:var(--red)}
[data-cat="notes"]{--c:var(--violet)}

/* light theme (cool blue-gray paper — gentle, tinted, no pure white) */
:root[data-theme="light"]{
  --bg:#d2dbe8; --bg2:#c5d0df; --surface:#dee6f1; --panel:#f3f6fb; --panel2:#e6ecf5;
  --line:#bfcadb; --line2:#a3b1c6;
  --fg:#18212e; --fg2:#2f3a49; --mut:#54616f; --faint:#7a8796;
  --accent:#0e8da6; --blue:#2456d6; --green:#0f766e; --amber:#a85a09; --red:#c62828;
  --cyan:#0e8da6; --violet:#6d3bd1;
}

*{box-sizing:border-box}
html{font-size:clamp(15px,14px + 0.28vw,17px);-webkit-text-size-adjust:100%}
body{margin:0;color:var(--fg);background:var(--bg);font-family:var(--sans);line-height:1.78;
  -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(900px 520px at 82% -10%,color-mix(in srgb,var(--cyan) 7%,transparent),transparent 60%),
    radial-gradient(760px 460px at 4% -4%,color-mix(in srgb,var(--blue) 6%,transparent),transparent 58%);
  background-attachment:fixed}
:root[data-theme="light"] body{
  background-image:
    radial-gradient(900px 520px at 82% -10%,color-mix(in srgb,var(--cyan) 14%,transparent),transparent 60%),
    radial-gradient(760px 460px at 4% -4%,color-mix(in srgb,var(--blue) 12%,transparent),transparent 58%);}
.container{width:100%;max-width:clamp(760px,94vw,1280px);margin:0 auto;padding:0 clamp(14px,3vw,28px)}
a{color:var(--accent);text-decoration:none;transition:color .15s}
a:hover{color:var(--fg)}
::selection{background:rgba(34,211,238,.28)}

/* ===== header ===== */
.site-header{position:sticky;top:0;z-index:20;
  background:color-mix(in srgb,var(--bg) 82%,transparent);backdrop-filter:saturate(150%) blur(10px);
  border-bottom:1px solid var(--line)}
.hd{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding:12px 0}
.brand{font-family:var(--mono);font-weight:700;font-size:1.02rem;letter-spacing:.2px;color:var(--fg);
  display:flex;align-items:center;gap:9px}
.brand::before{content:"";width:9px;height:9px;border-radius:2px;background:var(--accent);
  box-shadow:0 0 10px var(--accent);animation:blink 1.6s steps(1) infinite}
@keyframes blink{50%{opacity:.25}}
.brand{order:0}
.menu{display:contents}
.nav{order:1;display:flex;gap:18px;flex-wrap:wrap;font-size:.88rem}
.nav a{color:var(--mut);font-weight:500}
.nav a:hover{color:var(--fg)}
.search{order:2;margin-left:auto;position:relative;display:flex}
.search input{width:clamp(150px,16vw,230px);font:inherit;font-size:.82rem;color:var(--fg);
  background:var(--panel);border:1px solid var(--line2);border-radius:7px;padding:6px 11px;outline:none;
  transition:border-color .15s,box-shadow .15s}
.search input::placeholder{color:var(--faint)}
.search input:focus{border-color:var(--accent);box-shadow:0 0 0 2px color-mix(in srgb,var(--accent) 22%,transparent)}
.search-results{position:absolute;top:calc(100% + 8px);right:0;width:min(360px,84vw);z-index:30;
  background:var(--panel);border:1px solid var(--line);border-radius:10px;overflow:hidden;
  box-shadow:var(--shadow);display:none}
.search-results.show{display:block}
.sr-item{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 14px;
  color:var(--fg2);border-bottom:1px solid var(--line)}
.sr-item:last-child{border-bottom:none}
.sr-item:hover{background:var(--panel2);color:var(--accent)}
.sr-t{font-size:.86rem;font-weight:600;line-height:1.4}
.sr-c{font-family:var(--mono);font-size:.66rem;color:var(--mut);white-space:nowrap}
.sr-empty{padding:14px;color:var(--mut);font-size:.84rem;text-align:center}
.langs{order:3;font-family:var(--mono);font-size:.78rem;display:flex;gap:5px;align-items:center}
.langs .lang{color:var(--mut);padding:3px 7px;border-radius:5px}
.langs a.lang:hover{color:var(--fg);background:var(--panel)}
.lang.on{color:var(--bg);background:var(--accent);font-weight:700}
.theme-btn{order:4;margin-left:6px;width:32px;height:28px;display:inline-flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid var(--line2);border-radius:6px;color:var(--fg);cursor:pointer;
  font-size:.95rem;line-height:1;transition:border-color .15s,background .15s}
.theme-btn:hover{border-color:var(--accent);background:var(--panel)}
.theme-btn .ic-sun{display:none}
:root[data-theme="light"] .theme-btn .ic-sun{display:inline}
:root[data-theme="light"] .theme-btn .ic-moon{display:none}
/* hamburger (mobile only) */
.hamburger{order:5;display:none;flex-direction:column;justify-content:center;gap:5px;
  width:36px;height:30px;padding:0 8px;background:transparent;border:1px solid var(--line2);
  border-radius:6px;cursor:pointer}
.hamburger span{display:block;height:2px;background:var(--fg);border-radius:2px;transition:transform .2s,opacity .2s}
.site-header.nav-open .hamburger span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.site-header.nav-open .hamburger span:nth-child(2){opacity:0}
.site-header.nav-open .hamburger span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
@media(max-width:680px){
  .hamburger{display:flex;order:3;margin-left:8px}
  .theme-btn{order:2;margin-left:auto}
  .menu{order:5;flex-basis:100%;display:none}
  .site-header.nav-open .menu{display:block;background:var(--panel);border:1px solid var(--line);
    border-radius:12px;overflow:hidden;box-shadow:var(--shadow);margin:8px 0 2px;animation:menudrop .18s ease}
  .menu .nav{flex-direction:column;gap:0;font-size:1rem}
  .menu .nav a{display:flex;align-items:center;justify-content:space-between;
    padding:14px 16px;color:var(--fg2);font-weight:600;border-bottom:1px solid var(--line)}
  .menu .nav a::after{content:"›";color:var(--faint);font-size:1.15em;line-height:1}
  .menu .nav a:hover,.menu .nav a:active{background:var(--panel2);color:var(--accent)}
  .menu .search{display:block;margin:0;padding:12px 14px;border-bottom:1px solid var(--line);position:static}
  .menu .search input{width:100%}
  .menu .search-results{position:static;width:auto;margin-top:10px;border-radius:8px;box-shadow:none}
  .menu .langs{display:flex;align-items:center;gap:8px;padding:13px 16px;font-size:.82rem}
  .menu .langs::before{content:"🌐";margin-right:2px;opacity:.7}
  .menu .langs .lang{padding:7px 14px;border:1px solid var(--line2);border-radius:7px}
}
@keyframes menudrop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* ===== ticker (auto-scroll marquee) ===== */
.ticker{overflow:hidden;border-bottom:1px solid var(--line);background:var(--bg2);
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.tk-track{display:inline-flex;align-items:center;gap:30px;white-space:nowrap;padding:7px 0;
  animation:ticker 55s linear infinite;will-change:transform}
.ticker:hover .tk-track{animation-play-state:paused}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.tk{font-family:var(--mono);font-size:.74rem;color:var(--mut);display:inline-flex;align-items:center;gap:7px;
  padding-left:30px}
.tk-dot{width:6px;height:6px;border-radius:50%;background:var(--c,var(--accent));flex:none;
  box-shadow:0 0 7px var(--c,var(--accent))}
@media(prefers-reduced-motion:reduce){.tk-track{animation:none}}

/* ===== hero = terminal ===== */
.term{margin:clamp(18px,4vw,30px) 0 clamp(22px,4vw,32px);border:1px solid var(--line);border-radius:8px;
  background:var(--panel);overflow:hidden;box-shadow:0 12px 40px rgba(0,0,0,.30)}
.term-bar{display:flex;align-items:center;gap:8px;padding:9px 14px;background:var(--panel2);
  border-bottom:1px solid var(--line);font-family:var(--mono);font-size:.76rem;color:var(--mut)}
.term-bar .dot{width:11px;height:11px;border-radius:50%}
.term-bar .r{background:#ff5f56}.term-bar .y{background:#ffbd2e}.term-bar .g{background:#27c93f}
.term-bar .ttl{margin-left:6px}
.term-body{padding:clamp(16px,3.5vw,24px);position:relative;overflow:hidden}
.term-body::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.35;
  background:repeating-linear-gradient(transparent 0 3px,rgba(255,255,255,.018) 3px 4px)}
.term-body>*{position:relative;z-index:1}
/* glowing candlestick backdrop — continuous horizontal scroll */
.chart{position:absolute;right:0;bottom:-2px;width:72%;height:88%;z-index:0;opacity:.6;pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 24%,#000 92%,transparent);
  mask-image:linear-gradient(90deg,transparent,#000 24%,#000 92%,transparent)}
.scroll{animation:chartscroll 32s linear infinite;will-change:transform}
/* candle color/stroke/glow are baked as SVG attributes so the <use> copy renders identically */
@keyframes chartscroll{from{transform:translateX(0)}to{transform:translateX(-784px)}}
@media(prefers-reduced-motion:reduce){.scroll{animation:none}}
.prompt{font-family:var(--mono);font-size:.84rem;color:var(--mut);margin:0 0 12px}
.prompt .u{color:var(--green)}.prompt .p{color:var(--blue)}.prompt .c{color:var(--fg)}
.term h1{font-family:var(--sans);font-size:clamp(1.45rem,1.05rem + 1.9vw,2.05rem);line-height:1.28;
  margin:0 0 10px;font-weight:800;letter-spacing:-.01em;color:var(--fg)}
.lead{color:var(--mut);font-size:1.0rem;margin:.2em 0;max-width:64ch}
.readout{font-family:var(--mono);font-size:.92rem;color:var(--mut);margin:18px 0 0;letter-spacing:.2px}
.readout b{color:var(--accent);font-weight:700;
  text-shadow:0 0 9px color-mix(in srgb,var(--accent) 75%,transparent)}
.readout .sep{color:var(--faint);margin:0 .55em}
.cursor{display:inline-block;width:.6ch;background:var(--accent);margin-left:.3ch;color:transparent;
  box-shadow:0 0 8px var(--accent);animation:blink 1.1s steps(1) infinite}

/* ===== section headings ===== */
section{margin:clamp(22px,4vw,34px) 0}
h2{font-family:var(--mono);font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
  color:var(--mut);margin:1.6em 0 .9em;display:flex;align-items:center;gap:9px}
h2::before{content:"//";color:var(--accent);font-weight:700}

/* ===== home 2-column layout (sidebar on wide) ===== */
.home-grid{display:grid;grid-template-columns:1fr;gap:clamp(20px,3vw,34px)}
.col-side{order:0}
.col-main{order:1;min-width:0}
.col-side section,.col-main section{margin-top:0}
@media(min-width:920px){
  .home-grid{grid-template-columns:1fr clamp(240px,25vw,300px);align-items:start}
  .col-side{order:2;position:sticky;top:70px}
  /* sidebar categories become a vertical list */
  .col-side .cat-rail{flex-direction:column;align-items:stretch;gap:0;padding:6px 14px}
  .col-side .chip{justify-content:space-between;padding:10px 2px;border-bottom:1px solid var(--line)}
  .col-side .chip:last-child{border-bottom:none}
}

/* ===== category rail (framed surface) ===== */
.cat-rail{display:flex;flex-wrap:wrap;gap:4px 22px;padding:8px 16px;
  background:var(--panel);border:1px solid var(--line);border-radius:8px;
  box-shadow:0 1px 0 color-mix(in srgb,var(--line) 60%,transparent),0 10px 30px rgba(0,0,0,.18)}
.chip{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.84rem;color:var(--mut);
  padding:7px 0;border-bottom:2px solid transparent}
.chip:hover{color:var(--fg);border-bottom-color:var(--c,var(--accent))}
.chip .cn{display:inline-flex;align-items:center;gap:8px}
.chip .cdot{width:8px;height:8px;border-radius:2px;background:var(--c,var(--accent));flex:none}
.chip b{color:var(--c,var(--accent));font-weight:700}
@media(min-width:920px){.col-side .chip{display:flex;border-bottom:1px solid var(--line)}}

/* ===== ledger (post rows) — distinct content surface ===== */
.ledger{background:var(--panel);border:1px solid var(--line);border-radius:8px;overflow:hidden;
  box-shadow:0 1px 0 color-mix(in srgb,var(--line) 60%,transparent),0 10px 30px rgba(0,0,0,.18)}
.row{display:grid;grid-template-columns:minmax(44px,auto) minmax(86px,auto) 1fr;align-items:baseline;
  gap:clamp(8px,1.4vw,16px);padding:11px 12px 11px 13px;border-bottom:1px solid var(--line);
  border-left:2px solid transparent;color:var(--fg2);transition:background .12s,border-color .12s}
.row:last-child{border-bottom:none}
.row:hover{background:color-mix(in srgb,var(--accent) 9%,var(--panel));border-left-color:var(--c,var(--accent));color:var(--fg)}
.rid{font-family:var(--mono);font-size:.82rem;color:var(--c,var(--faint));font-weight:600;text-align:right}
.rdate{font-family:var(--mono);font-size:.8rem;color:var(--faint)}
.rtitle{font-size:.98rem;font-weight:600;line-height:1.5}
.rcat{font-family:var(--mono);font-size:.68rem;color:var(--c,var(--mut));margin-left:9px;
  white-space:nowrap;opacity:.85}
.rcat::before{content:"●";font-size:.6em;vertical-align:middle;margin-right:4px}
.more{font-family:var(--mono);font-size:.86rem;font-weight:600;display:inline-block;margin-top:16px}
.more:hover{color:var(--accent)}

/* ===== article ===== */
.post-hero{margin:0 0 6px;border:1px solid var(--line);border-radius:12px;overflow:hidden;
  box-shadow:var(--shadow);border-left:3px solid var(--c,var(--accent))}
.post-hero img{display:block;width:100%;height:auto;aspect-ratio:960/360;object-fit:cover}
.list-head h1,.post-head h1{font-size:clamp(1.4rem,1.05rem + 1.6vw,1.9rem);margin:.5em 0 .3em;
  line-height:1.34;font-weight:800;letter-spacing:-.01em}
/* article body chart images */
.prose p > img,.prose img{border:1px solid var(--line);border-radius:10px;background:var(--panel)}
.prose em{color:var(--mut)}
.list-head .count{font-family:var(--mono);font-size:.62em;font-weight:700;color:var(--accent);
  vertical-align:middle;margin-left:.4em}
.post-head .meta,.list-head .meta{display:flex;flex-wrap:wrap;align-items:center;gap:12px;
  font-family:var(--mono);font-size:.8rem;color:var(--faint);margin:.6em 0}
.post-head .lead{margin-top:.7em}
.byline{color:var(--accent);font-weight:700}
.badge{display:inline-flex;align-items:center;gap:6px;font-family:var(--mono);font-size:.74rem;
  color:var(--c,var(--mut));font-weight:600}
.badge::before{content:"";width:7px;height:7px;border-radius:2px;background:var(--c,var(--mut))}
.prose{font-size:1.03rem;color:var(--fg2)}
.prose h2{font-family:var(--sans);font-size:1.32rem;font-weight:800;letter-spacing:-.005em;
  text-transform:none;color:var(--fg);margin:1.7em 0 .6em;padding-left:12px;border-left:4px solid var(--accent)}
.prose h2::before{content:none}
.prose h3{font-size:1.12rem;margin:1.5em 0 .5em;color:var(--fg);font-weight:700}
.prose p{margin:.9em 0}
.prose strong{color:var(--fg)}
.prose a{text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--accent) 45%,transparent);
  text-underline-offset:3px}
.prose a:hover{color:var(--accent)}
.prose ul,.prose ol{padding-left:1.35em}
.prose li{margin:.35em 0}
.prose hr{border:0;border-top:1px solid var(--line);margin:2em 0}
.prose table{border-collapse:collapse;width:100%;margin:1.2em 0;font-size:.88rem;display:block;overflow-x:auto;
  border:1px solid var(--line);border-radius:8px;font-family:var(--mono)}
.prose th,.prose td{border-bottom:1px solid var(--line);padding:8px 12px;text-align:left;white-space:nowrap}
.prose thead th{background:var(--panel2);color:var(--fg);font-weight:700;border-bottom:1px solid var(--line2)}
.prose tbody tr:nth-child(even){background:rgba(255,255,255,.018)}
.prose tbody tr:hover{background:color-mix(in srgb,var(--accent) 8%,transparent)}
.prose img{max-width:100%;height:auto;border:1px solid var(--line);border-radius:8px;background:var(--panel)}
.prose code{background:var(--panel2);color:var(--cyan);padding:.12em .4em;border-radius:4px;font-size:.86em;
  border:1px solid var(--line);font-family:var(--mono)}
.prose pre{background:var(--bg2);border:1px solid var(--line);border-radius:8px;padding:14px 16px;overflow-x:auto}
.prose pre code{background:none;border:0;color:var(--fg2);padding:0}
.prose blockquote{border-left:3px solid var(--accent);margin:1.2em 0;padding:.5em 1.1em;
  background:var(--panel);border-radius:0 6px 6px 0;color:var(--fg2)}
.tags{margin:1.8em 0;font-family:var(--mono);font-size:.8rem;display:flex;flex-wrap:wrap;gap:8px 14px}
.tags a{color:var(--mut)}
.tags a:hover{color:var(--accent)}
.post-nav{display:flex;justify-content:space-between;gap:12px;margin:2.4em 0 1em;font-size:.9rem}
.post-nav a{flex:1;border:1px solid var(--line);border-radius:6px;padding:12px 14px;color:var(--fg2)}
.post-nav a:hover{border-color:var(--accent);color:var(--accent)}
.post-nav .next{text-align:right}

/* ===== guide (doc with TOC) ===== */
.guide-grid{display:grid;grid-template-columns:1fr;gap:clamp(16px,3vw,30px)}
@media(min-width:920px){
  .guide-grid{grid-template-columns:210px 1fr;align-items:start}
  .toc{position:sticky;top:70px}
}
.guide-body{min-width:0}
.toc-inner{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:13px 16px}
.toc-title{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--mut);margin:0 0 8px}
.toc nav ul{list-style:none;margin:0;padding:0}
.toc nav ul ul{padding-left:12px;border-left:1px solid var(--line);margin-left:3px}
.toc nav li{margin:.3em 0}
.toc nav a{color:var(--mut);font-size:.84rem;line-height:1.5}
.toc nav a:hover{color:var(--accent)}

/* ===== features (card grid) ===== */
.feat-group{margin:clamp(22px,4vw,34px) 0}
.feat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.feat-card{background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:15px 16px;
  transition:transform .14s,border-color .14s,box-shadow .14s}
.feat-card:hover{transform:translateY(-2px);border-color:var(--accent);box-shadow:var(--shadow)}
.feat-name{font-weight:700;color:var(--fg);margin-bottom:5px}
.feat-desc{color:var(--mut);font-size:.9rem;line-height:1.65}
.feat-code{display:inline-block;margin-top:9px;font-family:var(--mono);font-size:.74rem;color:var(--cyan);
  background:var(--panel2);border:1px solid var(--line);border-radius:5px;padding:2px 8px}

/* ===== ads ===== */
.ad{margin:24px 0;text-align:center;min-height:90px}
.ad-banner{min-height:60px;margin:18px 0}        /* トップ等の横長(短い)枠 */
.ad-placeholder{display:flex;align-items:center;justify-content:center;background:var(--panel);
  border:1px dashed var(--line2);border-radius:6px;color:var(--faint);font-size:.76rem;min-height:90px;
  font-family:var(--mono)}
.ad-banner.ad-placeholder{min-height:50px}

/* ===== footer ===== */
.site-footer{border-top:1px solid var(--line);margin-top:56px;padding:28px 0;background:var(--bg2)}
.page-title{font-size:clamp(1.4rem,1.05rem + 1.6vw,1.9rem);margin:.6em 0 .4em;font-weight:800;letter-spacing:-.01em}
.foot-links{margin:.6em 0 0;font-size:.82rem}
.foot-links a{color:var(--mut)}
.foot-links a:hover{color:var(--accent)}
.disclaimer{color:var(--mut);font-size:.8rem;line-height:1.7;max-width:78ch}
.copy{color:var(--faint);font-family:var(--mono);font-size:.76rem;margin:.9em 0 0}

/* scrollbar */
*::-webkit-scrollbar{height:9px;width:9px}
*::-webkit-scrollbar-thumb{background:var(--line2);border-radius:5px}
*::-webkit-scrollbar-track{background:transparent}

@media(max-width:600px){
  .container{padding:0 12px}
  .cat-rail{padding:6px 12px;gap:2px 16px}
  .term{margin-top:0}
  .term-body{padding:18px}
  .term h1{font-size:1.5rem}
  .readout{font-size:.82rem;line-height:2}
  .nav{font-size:.82rem;gap:13px}
  .row{grid-template-columns:48px 1fr;gap:4px 12px;row-gap:2px}
  .rdate{grid-column:2;font-size:.74rem}
  .rtitle{grid-column:1 / -1}
  .post-nav{flex-direction:column}
  .ad{margin:14px 0;min-height:60px}            /* スマホは余白と確保高さを圧縮 */
  .ad-banner{min-height:50px;margin:10px 0}
}