:root{--bg:#fafafa;--card:#fff;--line:#e6e3ee;--text:#222;--muted:#666;--lav:#8b6fd6;--lav-soft:#f3effc;--pink:#f06fa4;--pink-soft:#fdeef5;--red:#e0245e;--shadow:0 1px 3px rgba(34,34,34,.08)}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font:16px/1.75 system-ui,-apple-system,"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI",Meiryo,sans-serif}
a{color:inherit}main{max-width:1120px;margin:0 auto;padding:16px}
header.site{position:sticky;top:0;z-index:5;display:flex;flex-wrap:wrap;align-items:center;gap:6px 20px;padding:10px 16px;background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}
.logo{font-weight:700;font-size:19px;text-decoration:none;color:var(--lav)}.logo::before{content:"🌙 "}
nav a{margin-right:14px;text-decoration:none;color:var(--muted);font-size:15px}nav a:hover{color:var(--lav)}
.pr{margin:0 0 0 auto;font-size:13px;color:var(--muted)}
h1{font-size:24px;line-height:1.4}h2{font-size:20px;margin:32px 0 12px;border-left:5px solid var(--lav);padding-left:10px}
.note,.updated,.empty{color:var(--muted);font-size:14px}
.grid{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:16px}
.card a{display:flex;flex-direction:column;height:100%;background:var(--card);border:1px solid var(--line);border-radius:10px;overflow:hidden;text-decoration:none;box-shadow:var(--shadow)}
.card a:hover{border-color:var(--lav)}
.thumb{aspect-ratio:800/538;background:#f2f0f7;display:flex;align-items:center;justify-content:center}
.thumb img{max-width:100%;max-height:100%;display:block}.noimg{color:var(--muted);font-size:14px}
.card .ttl{padding:6px 10px 0;font-size:14px;line-height:1.6;max-height:calc(1.6em * 2 + 6px);display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-break:break-all}
.card .price{padding:2px 10px;font-size:15px}.card .end{padding:0 10px 10px;font-size:14px;color:var(--red);font-weight:700}
s{color:var(--muted)}b{color:var(--red);font-size:17px}
.badges{display:flex;flex-wrap:wrap;gap:4px;padding:8px 10px 0}.badge{font-size:13px;padding:1px 8px;border-radius:99px;font-weight:700;line-height:1.6}
.badge.sale{background:var(--red);color:#fff}.badge.low{background:var(--lav);color:#fff}.badge.soon{background:var(--pink-soft);color:var(--red);border:1px solid var(--pink)}
.mina{display:flex;gap:12px;align-items:flex-start;background:var(--lav-soft);border:2px solid var(--lav);border-radius:14px;padding:12px 14px;margin:14px 0}
.mina img{flex:none;border-radius:50%;background:#fff}.mina p{margin:0}.mina .who{font-weight:700;color:var(--lav);font-size:14px}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px;background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px;box-shadow:var(--shadow)}
.hero img{max-width:100%;height:auto;display:block}
.facts{display:grid;grid-template-columns:auto 1fr;gap:4px 14px;margin:0}.facts dt{color:var(--muted)}.facts dd{margin:0}
.facts dd.strong{color:var(--red);font-weight:700;font-size:18px}
.label{color:var(--lav);font-weight:700}
.btn{display:inline-block;background:var(--pink);color:#fff;font-weight:700;font-size:17px;padding:12px 22px;border-radius:99px;text-decoration:none;box-shadow:var(--shadow)}
.btn:hover{background:var(--lav)}.btn.off,.btn.off:hover{background:#ecebf0;color:var(--muted);box-shadow:none;font-size:15px;cursor:default}
.stale{background:#fff7e6;border:1px solid #f2d39b;border-radius:10px;padding:8px 12px;font-size:15px}
.chart{width:100%;height:auto;background:var(--card);border:1px solid var(--line);border-radius:10px}.chart .axis{stroke:var(--line)}
.chart .paid{fill:none;stroke:var(--red);stroke-width:2.5}.chart .regular{fill:none;stroke:#999;stroke-width:1.5;stroke-dasharray:5 4}
.chart .low{fill:var(--lav)}.chart .tick{fill:var(--muted)}.chart-narrow{display:none}
.legend{font-size:14px;color:var(--muted)}.sw{display:inline-block;width:14px;height:4px;margin:0 4px 2px 10px;vertical-align:middle}
.sw.paid{background:var(--red)}.sw.regular{background:#999}.sw.low{background:var(--lav);width:9px;height:9px;border-radius:50%}
.tags a{display:inline-block;margin:0 6px 6px 0;padding:2px 12px;border:1px solid var(--line);background:#fff;border-radius:99px;text-decoration:none;font-size:14px}
.tags a:hover{border-color:var(--lav);color:var(--lav)}
.samples{display:flex;flex-wrap:wrap;gap:8px}.samples img{max-width:100%;height:auto}
.memo{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:4px 16px 8px;margin-top:24px}
.taglist{columns:3 200px;padding-left:18px}
footer.site{border-top:1px solid var(--line);background:#fff;margin-top:40px;padding:18px 16px;color:var(--muted);font-size:13px;text-align:center}
#gate{position:fixed;inset:0;z-index:50;display:grid;place-items:center;background:var(--bg);padding:16px}
html.age-ok #gate,html[data-gate=preview] #gate{display:none}
html:not(.age-ok):not([data-gate=preview]) body>header,html:not(.age-ok):not([data-gate=preview]) main,html:not(.age-ok):not([data-gate=preview]) footer{display:none}
.gate-box{max-width:460px;background:#fff;border:1px solid var(--line);border-top:5px solid var(--lav);border-radius:14px;padding:24px;text-align:center;box-shadow:0 4px 16px rgba(34,34,34,.08)}
.gate-title{font-size:22px;font-weight:700;color:var(--lav)}
.gate-buttons button{font:inherit;margin:4px;padding:12px 22px;border-radius:99px;border:1px solid var(--line);background:#fff;color:var(--text);cursor:pointer}
#gate-yes{background:var(--pink);color:#fff;border:0;font-weight:700}
@media (max-width:640px){.hero{grid-template-columns:1fr}.pr{margin:0;width:100%}h1{font-size:21px}
.grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.card .ttl{padding:6px 8px 0}.card .price{padding:2px 8px}
.card .end{padding:0 8px 8px}.badges{padding:6px 8px 0}.chart-wide{display:none}.chart-narrow{display:block}}
