@charset "UTF-8";
/* =====================================================================
   コミット数の折れ線（activity-chart.js が描く SVG の色。1 点 = 1 週の合計）
   ---------------------------------------------------------------------
   開発ノートの一覧とトップの幕 2 で共有する。寸法は JS が器の幅から決めるので、
   ここは色と太さだけ。

   器に .activity-chart を付けて、必要なら --ac-* を上書きする。
   既定値は開発ノートの --dot 系に寄せてあるので、あちらは見た目が変わらない。
   ===================================================================== */

.activity-chart {
    --ac-ink:  var(--dot-ink, #23232a);      /* データ点・外れ値のリング */
    --ac-dot:  var(--dot, #d9d9d2);          /* コミットが 0 の週 */
    --ac-weak: var(--dot-weak, #b6b6ae);     /* 目盛線 */
    --ac-line: var(--nzw-text-strong);       /* 週の合計を結ぶ線 */
    --ac-tick: var(--nzw-muted);             /* 目盛の文字 */
}

.activity-chart svg {
    display: block;
    width: 100%;
    height: auto;
    overflow: visible;
}

/* 目盛線も点線。実線を引くと図の中で唯一の直線になってしまう */
.activity-chart .p-grid { stroke: var(--ac-weak); stroke-width: 1; }

.activity-chart .p-ytick,
.activity-chart .p-xtick {
    font-family: var(--nzw-font-mono);
    font-size: 9px;
    fill: var(--ac-tick);
}

/* 点より細くして、点のほうが主役だと分かるようにする */
.activity-chart .p-line {
    fill: none;
    stroke: var(--ac-line);
    stroke-width: 1.4;
    stroke-linejoin: round;
    stroke-linecap: round;
}

.activity-chart .p-dot { fill: var(--ac-ink); }
.activity-chart .p-dot.is-zero { fill: var(--ac-dot); }

/* かざしたときの当たり判定。透明だが fill: none にすると当たらない。
   <title> で週の範囲と合計が出る（日ごとの数字は無い） */
.activity-chart .p-hit { fill: transparent; }