:root{
  --bg:#eef0eb;--card:#ffffff;--ink:#15171c;--sub:#5a6068;--line:#d8dbd3;--rail:#b9beb4;
  --graphite:#1b1f27;--graphite-2:#2a303b;--signal:#ffe14d;--signal-soft:#fff8c9;--signal-ink:#4a3f00;
  --up:#c8321a;--up-soft:#fdece8;--down:#08764f;--down-soft:#e4f5ee;--live:#27c46f;
  --cta-a:#5b3df5;--cta-b:#8f63ff;--cta-edge:#3b25b8;
  --mono:ui-monospace,"SF Mono","Menlo","Consolas","Roboto Mono",monospace;
}
*{box-sizing:border-box}
html{background:var(--bg)}
body{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",sans-serif;margin:0;
  color:var(--ink);background:var(--bg);line-height:1.8;-webkit-text-size-adjust:100%}
a{color:#3a2bc4}
img{max-width:100%;height:auto}
time.vol,.mono{font-family:var(--mono);font-variant-numeric:tabular-nums}

/* 計器帯・ヘッダー */
header.site{background:var(--card);border-bottom:1px solid var(--line)}
.gauge{background:var(--graphite);color:#cfd5df;font-size:.74em}
.gauge-in{max-width:1040px;margin:0 auto;padding:6px 16px;display:flex;align-items:center;gap:10px;font-family:var(--mono);letter-spacing:.02em}
.gauge .live{width:8px;height:8px;border-radius:50%;background:var(--live);box-shadow:0 0 0 0 rgba(39,196,111,.6);animation:live-pulse 2.2s ease-out infinite}
.gauge time{margin-left:auto;color:#fff}
@keyframes live-pulse{0%{box-shadow:0 0 0 0 rgba(39,196,111,.55)}70%,100%{box-shadow:0 0 0 7px rgba(39,196,111,0)}}
@media (prefers-reduced-motion:reduce){.gauge .live{animation:none}}
header.site .bar{max-width:1040px;margin:0 auto;padding:14px 16px 8px;display:flex;flex-wrap:wrap;align-items:center;gap:4px 18px}
.logo{display:inline-flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font-weight:800;font-size:1.22em;letter-spacing:.01em}
.logo .mark{display:inline-block;width:34px;height:34px;line-height:0}
.logo .mark svg{width:34px;height:34px;display:block}
.tagline{font-size:.74em;color:var(--sub)}
nav.menu{max-width:1040px;margin:0 auto;padding:0 10px;display:flex;gap:2px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
nav.menu::-webkit-scrollbar{display:none}
nav.menu a{color:var(--ink);text-decoration:none;font-size:.88em;font-weight:700;padding:9px 14px;border-bottom:3px solid transparent}
nav.menu a.on,nav.menu a:hover{border-bottom-color:var(--graphite);background:var(--signal-soft)}

main{max-width:1040px;margin:0 auto;padding:20px 16px 60px}
h1.page-title{font-size:1.3em;line-height:1.55;margin:.5em 0 .7em;font-weight:800;letter-spacing:.01em}
h2{font-size:1.04em;margin:2.4em 0 .9em;padding:0 0 8px;border-bottom:2px solid var(--graphite);font-weight:800;display:flex;align-items:center;gap:10px}
h2::before{content:"";flex:0 0 auto;width:10px;height:18px;background:var(--signal);border:1px solid var(--graphite)}
h3{font-size:.98em;margin:1.6em 0 .6em}
p{margin:.6em 0}
.lead{color:var(--sub);font-size:.9em}
.more{text-align:right;font-size:.9em;margin:.8em 0 0}
.crumb{font-size:.78em;color:var(--sub)}

/* 計器パネル（トップの数字・作品ページの読み取り値） */
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px;margin:1em 0 .4em}
.tile{background:var(--card);border:1px solid var(--line);border-top:3px solid var(--graphite);padding:10px 14px}
.tile .k{display:block;font-size:.74em;color:var(--sub)}
.tile .v{display:block;font-family:var(--mono);font-size:1.7em;font-weight:700;line-height:1.3;font-variant-numeric:tabular-nums}
.tile .v small{font-size:.5em;margin-left:4px;color:var(--sub);font-weight:600}
.tile.hot{border-top-color:var(--signal);background:var(--signal-soft)}
.readout{display:grid;grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:0;background:var(--card);border-top:1px solid var(--line);border-left:1px solid var(--line);margin:0 0 18px}
.readout>div{background:var(--card);padding:10px 14px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.readout .k{display:block;font-size:.72em;color:var(--sub)}
.readout .v{display:block;font-family:var(--mono);font-size:1.15em;font-weight:700;font-variant-numeric:tabular-nums}
.readout .v small{font-size:.66em;font-weight:600;color:var(--sub);margin-left:3px}
.readout .hl{background:var(--signal-soft)}

/* 動きログ（縦の時間軸） */
ol.log{list-style:none;margin:0;padding:0}
ol.log li.day{margin:1.6em 0 .4em;padding:0}
ol.log li.day:first-child{margin-top:.4em}
ol.log li.day span{display:inline-block;font-family:var(--mono);font-size:.82em;font-weight:700;background:var(--graphite);color:#fff;padding:2px 12px}
ol.log li.ev{display:grid;grid-template-columns:54px 18px minmax(0,1fr);gap:0 8px;align-items:start;position:relative}
ol.log li.ev .tm{font-family:var(--mono);font-size:.84em;font-weight:700;padding-top:14px;text-align:right;color:var(--ink)}
ol.log li.ev .rail{position:relative;align-self:stretch}
ol.log li.ev .rail::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;margin-left:-1px;background:var(--rail)}
ol.log li.ev .rail::after{content:"";position:absolute;left:50%;top:17px;width:12px;height:12px;margin-left:-6px;border-radius:50%;
  background:var(--card);border:3px solid var(--graphite)}
ol.log li.ev.price-up .rail::after{border-color:var(--up);background:var(--up)}
ol.log li.ev.price-down .rail::after{border-color:var(--down);background:var(--down)}
ol.log li.ev.title .rail::after{border-color:#b08a00;background:var(--signal)}
ol.log li.ev.publish .rail::after{border-color:var(--graphite);background:var(--card)}
ol.log li.ev .box{margin:6px 0;background:var(--card);border:1px solid var(--line);padding:10px 12px}
ol.log li.ev .box a.w{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;color:var(--ink);text-decoration:none;align-items:start}
ol.log li.ev .box a.w:hover .t{text-decoration:underline}
ol.log li.ev .box img{width:72px;aspect-ratio:1/1;object-fit:cover;display:block;background:var(--line)}
.chip{display:inline-block;font-size:.72em;font-weight:800;padding:1px 8px;border:1px solid var(--graphite);margin-right:6px;vertical-align:1px;letter-spacing:.02em}
.chip.pub{background:var(--card)}
.chip.up{background:var(--up-soft);border-color:var(--up);color:var(--up)}
.chip.down{background:var(--down-soft);border-color:var(--down);color:var(--down)}
.chip.ttl{background:var(--signal-soft);border-color:#b08a00;color:var(--signal-ink)}
.chip.same{background:#f3f4f1;border-color:var(--line);color:var(--sub)}
.t{display:block;font-weight:700;font-size:.94em;line-height:1.55;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.c{display:block;font-size:.8em;color:var(--sub);margin-top:2px}
.chg{display:block;font-family:var(--mono);font-size:.86em;margin-top:4px;font-variant-numeric:tabular-nums}
.chg .old{color:var(--sub);text-decoration:line-through}
.chg .arr{margin:0 6px;color:var(--sub)}
.chg b.up{color:var(--up)}
.chg b.down{color:var(--down)}

/* 作品の行（一覧） */
ul.feed{list-style:none;margin:0;padding:0;background:var(--card);border:1px solid var(--line)}
ul.feed li{border-bottom:1px solid var(--line)}
ul.feed li:last-child{border-bottom:none}
ul.feed a{display:grid;grid-template-columns:88px minmax(0,1fr);gap:14px;align-items:center;padding:10px 12px;color:var(--ink);text-decoration:none}
ul.feed a:hover{background:var(--signal-soft)}
ul.feed img{width:88px;aspect-ratio:1/1;object-fit:cover;display:block;background:var(--line)}
ul.feed .m{display:flex;flex-wrap:wrap;gap:2px 14px;font-family:var(--mono);font-size:.78em;color:var(--sub);margin-top:4px;font-variant-numeric:tabular-nums}
ul.feed .m b{color:var(--ink)}
ul.feed .m .age{color:var(--signal-ink);background:var(--signal-soft);padding:0 6px}

/* 値動きの一覧（価格が変わった作品。表ではなく縦の一覧にして、スマホでも作品名が読めるようにする） */
ul.moves{list-style:none;margin:0;padding:0;background:var(--card);border:1px solid var(--line)}
ul.moves li{border-bottom:1px solid var(--line)}
ul.moves li:last-child{border-bottom:none}
ul.moves a{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;padding:10px 12px;color:var(--ink);text-decoration:none;align-items:start}
ul.moves a:hover{background:var(--signal-soft)}
ul.moves img{width:72px;aspect-ratio:1/1;object-fit:cover;display:block;background:var(--line)}
ul.moves .when{display:block;font-family:var(--mono);font-size:.78em;font-weight:700;color:var(--sub);margin-bottom:2px}

/* 作品ページ */
.work-head{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:24px;align-items:start}
.work-head img.hero{width:100%;aspect-ratio:1/1;object-fit:cover;display:block;background:var(--line);border:1px solid var(--line)}
.table-wrap{overflow-x:auto;margin:1em 0}
table{width:100%;border-collapse:collapse;font-size:.9em;background:var(--card)}
th,td{border-bottom:1px solid var(--line);padding:9px 10px;text-align:left;vertical-align:top}
thead th{border-bottom:2px solid var(--graphite);font-size:.84em;white-space:nowrap;background:#f6f7f3}
tbody th{font-weight:700;white-space:nowrap;color:var(--sub);width:34%}
table.wide{min-width:560px}
td.num,th.num{text-align:right;font-family:var(--mono);font-variant-numeric:tabular-nums;white-space:nowrap}
tr.now td,tr.now th{background:var(--signal-soft);font-weight:700}
.chart{background:var(--card);border:1px solid var(--line);padding:10px 12px;margin:1em 0}
.chart svg{display:block;width:100%;height:auto}
.chart .cap{font-size:.76em;color:var(--sub);margin:6px 0 0}
.titlediff{background:var(--card);border:1px solid var(--line);margin:1em 0}
.titlediff .row{display:grid;grid-template-columns:112px minmax(0,1fr);gap:10px;padding:10px 12px;border-bottom:1px solid var(--line)}
.titlediff .row:last-child{border-bottom:none}
.titlediff .row .tm{font-family:var(--mono);font-size:.82em;font-weight:700}
.titlediff .row .tx{font-size:.92em;word-break:break-word}
.titlediff .row.now{background:var(--signal-soft)}
.cta{margin:1.8em 0}
/* ボタン: 紫のグラデーション・白の太字・立体の影・矢印の動き。prefers-reduced-motion では止める。1ページ3か所（基本情報の直後／価格・タイトルの記録の直後／まとめの直後） */
.cta-btn{position:relative;display:flex;align-items:center;justify-content:center;gap:12px;width:100%;max-width:460px;margin:0 auto;
  padding:17px 22px;border-radius:12px;overflow:hidden;
  background:linear-gradient(180deg,var(--cta-b) 0%,var(--cta-a) 100%);color:#fff!important;text-decoration:none;
  font-weight:900;font-size:1.14em;letter-spacing:.05em;line-height:1.3;
  border:1px solid #a58bff;box-shadow:0 5px 0 var(--cta-edge),0 10px 22px rgba(91,61,245,.32),inset 0 1px 0 rgba(255,255,255,.4);
  transition:transform .12s ease,box-shadow .12s ease,filter .12s ease}
.cta-btn::after{content:"";width:.6em;height:.6em;border-top:.2em solid #fff;border-right:.2em solid #fff;
  transform:rotate(45deg);margin-left:2px;flex:0 0 auto;animation:cta-nudge 1.3s ease-in-out infinite}
.cta-btn:hover{filter:brightness(1.06);transform:translateY(2px);box-shadow:0 3px 0 var(--cta-edge),0 8px 18px rgba(91,61,245,.32),inset 0 1px 0 rgba(255,255,255,.4)}
.cta-btn:active{transform:translateY(5px);box-shadow:0 0 0 var(--cta-edge),0 3px 8px rgba(91,61,245,.3)}
@keyframes cta-nudge{0%,100%{transform:rotate(45deg) translate(0,0)}50%{transform:rotate(45deg) translate(3px,-3px)}}
@media (prefers-reduced-motion:reduce){.cta-btn::after{animation:none}}
.cta-note{font-size:.76em;color:var(--sub);text-align:center;margin-top:.9em}
.pn{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:1em 0}
.pn a{display:block;border:1px solid var(--line);background:var(--card);padding:10px 12px;color:var(--ink);text-decoration:none;font-size:.86em}
.pn a:hover{border-color:var(--graphite)}
.pn .k{display:block;font-size:.8em;color:var(--sub)}
.pn .nx{text-align:right}
.qa{margin:1em 0}
.qa details{border-bottom:1px solid var(--line);padding:10px 0}
.qa summary{font-weight:700;cursor:pointer}
.qa p{color:var(--sub);margin:.5em 0 0}
.pager{display:flex;flex-wrap:wrap;gap:6px;margin:1.6em 0}
.pager a,.pager span{display:inline-block;min-width:38px;text-align:center;padding:4px 10px;border:1px solid var(--graphite);text-decoration:none;color:var(--ink);background:var(--card)}
.pager span.on{background:var(--graphite);color:#fff}
.prose{max-width:760px}
.prose h2{margin-top:2.2em}
.prose ul,.prose ol{padding-left:1.4em}
.prose li{margin:.35em 0}
.note{font-size:.88em;color:var(--sub);background:var(--card);border:1px solid var(--line);border-left:5px solid var(--signal);padding:12px 14px;margin:1em 0}
.empty{background:var(--card);border:1px dashed var(--rail);padding:18px 16px;color:var(--sub);font-size:.92em;margin:1em 0}
.tabs{display:flex;flex-wrap:wrap;gap:8px;margin:1em 0;padding:0;list-style:none}
.tabs a,.tabs span{display:inline-block;border:1px solid var(--graphite);padding:4px 14px;font-size:.86em;font-weight:700;color:var(--ink);text-decoration:none;background:var(--card)}
.tabs a:hover{background:var(--signal-soft)}
.tabs .on{background:var(--graphite);color:#fff}
.clist{columns:3 240px;column-gap:24px;margin:1em 0;padding:0;list-style:none}
.clist li{break-inside:avoid;border-bottom:1px dotted var(--rail);padding:6px 0;font-size:.92em}
.clist a{color:var(--ink);text-decoration:none;font-weight:700}
.clist a:hover{text-decoration:underline}
.clist span{color:var(--sub);font-size:.82em;margin-left:6px;font-family:var(--mono)}

.stamp{display:inline-block;font-size:.78em;color:var(--sub);border:1px solid var(--line);padding:2px 10px;background:var(--card)}
.callout{background:var(--card);border-left:5px solid var(--signal);border-top:1px solid var(--line);border-right:1px solid var(--line);border-bottom:1px solid var(--line);padding:12px 16px;margin:1.2em 0;font-size:.92em}
.article-list{display:grid;gap:12px;margin:1em 0;padding:0;list-style:none}
.article-card{display:block;border:1px solid var(--line);border-top:3px solid var(--graphite);padding:16px 18px;color:var(--ink);text-decoration:none;background:var(--card)}
.article-card:hover{background:var(--signal-soft)}
.article-card .t{display:block;font-weight:800;line-height:1.55}
.article-card .d{display:block;color:var(--sub);font-size:.86em;margin-top:4px}
.article-card .k{display:block;font-size:.74em;font-weight:800;color:var(--signal-ink);background:var(--signal-soft);display:inline-block;padding:0 8px;margin-bottom:6px;letter-spacing:.06em}

.promo-notice{font-size:.76em;color:var(--sub);border-top:1px solid var(--line);padding-top:12px;margin-top:3em}
footer.site{border-top:3px solid var(--graphite);background:var(--card);color:var(--sub);padding:22px 16px 30px;text-align:center;font-size:.8em}
footer.site a{color:var(--ink)}
.foot-links{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 16px;margin-bottom:10px}
.age-notice,.copy{margin:.3em 0}
.age-gate{position:fixed;inset:0;background:rgba(27,31,39,.97);display:flex;align-items:center;justify-content:center;z-index:999;padding:20px}
.age-gate-inner{background:#fff;padding:28px 24px;max-width:340px;text-align:center;border-top:6px solid var(--signal)}
.age-gate-title{font-weight:800;font-size:1.15em;margin:0 0 8px}
.age-btn{background:var(--graphite);color:#fff;border:none;padding:12px 26px;font-size:1em;font-weight:700;cursor:pointer;margin-top:8px}
.age-no{display:inline-block;margin-top:8px;color:var(--sub);font-size:.88em}

@media (max-width:640px){
  ol.log li.ev{grid-template-columns:44px 16px minmax(0,1fr)}
  ol.log li.ev .box a.w{grid-template-columns:60px minmax(0,1fr);gap:10px}
  ol.log li.ev .box img{width:60px}
  ul.feed a{grid-template-columns:72px minmax(0,1fr);gap:10px}
  ul.feed img{width:72px}
  .work-head{grid-template-columns:1fr}
  .tagline{display:none}
  nav.menu a{padding:9px 10px;font-size:.84em}
  .pn{grid-template-columns:1fr}
  .titlediff .row{grid-template-columns:1fr;gap:2px}
}
