:root{--pink:#f02e65;--pink-dark:#a4123f;--ink:#222;--muted:#777;--line:#eee;--tint:#fff5f8}
*{box-sizing:border-box}
body{font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans",sans-serif;margin:0;color:var(--ink);background:#fff;line-height:1.9}
a{color:var(--pink-dark)}
header.site{background:linear-gradient(135deg,var(--pink),var(--pink-dark));color:#fff;padding:20px 16px;text-align:center}
header.site .tagline{font-size:.85em;opacity:.9;margin-bottom:6px}
header.site h1{margin:0;font-size:1.6em}
header.site h1 a{color:#fff;text-decoration:none}
nav.site{display:flex;justify-content:center;gap:20px;padding:10px;border-bottom:1px solid var(--line);font-size:.9em;flex-wrap:wrap}
nav.site a{color:var(--ink);text-decoration:none}
nav.site a:hover{color:var(--pink-dark)}
main{max-width:760px;margin:0 auto;padding:24px 16px 60px}
.updated{display:inline-block;background:var(--tint);color:var(--pink-dark);padding:4px 12px;border-radius:999px;font-size:.85em;margin-bottom:1em}
h1.page-title{font-size:1.5em}
h2{font-size:1.2em;margin-top:1.8em;border-left:4px solid var(--pink);padding-left:10px}
.article-list{list-style:none;padding:0;margin:1.5em 0}
.article-list li{border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin-bottom:14px}
.article-list a.title{font-weight:700;font-size:1.05em;text-decoration:none;color:var(--ink)}
.article-list a.title:hover{color:var(--pink-dark)}
.article-list p{margin:6px 0 0;color:var(--muted);font-size:.92em}
table{width:100%;border-collapse:collapse;margin:1em 0}
th,td{border:1px solid var(--line);padding:8px 10px;text-align:left;font-size:.95em}
footer.site{border-top:1px solid var(--line);margin-top:3em;padding:24px 16px;text-align:center;font-size:.85em;color:var(--muted)}
footer.site a{color:var(--muted);margin:0 8px}

/* === plan-hub additions === */
.filters{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin:1em 0;font-size:.9em}
.filters input[type="text"]{padding:10px 14px;font-size:1em;border:1px solid var(--line);border-radius:8px;flex:1 1 220px;max-width:320px}
.filters select{padding:6px;border:1px solid var(--line);border-radius:6px;margin-left:4px}
.filters label{display:flex;align-items:center;gap:4px}
.filters label.checkbox{gap:6px}
.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:1em 0}
.table-wrap table{min-width:640px}
th.sortable{cursor:pointer;user-select:none}
th.sortable:hover{color:var(--pink-dark)}
.counts{font-size:.85em;color:var(--muted)}
.note{font-size:.9em;color:var(--muted)}
.promo-notice{font-size:.8em;color:var(--muted);background:var(--tint);padding:8px 12px;border-radius:8px}
.age-notice{font-size:.8em;color:var(--muted);margin:0 0 .5em}
.creator-block{margin-top:2em}
.creator-block h2{display:flex;align-items:baseline;gap:8px}
.creator-block .followers{font-size:.7em;color:var(--muted);font-weight:normal}

.plan-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin:1em 0}
.plan-card{border:1px solid var(--line);border-radius:14px;padding:16px;display:flex;flex-direction:column;gap:10px}
.plan-card .creator-name{font-size:1.15em;font-weight:700}
.plan-card .plan-name{font-size:.9em;color:var(--muted)}
.plan-card .thumb{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:10px;display:block;background:var(--tint)}
.plan-card .specs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;text-align:center}
.plan-card .spec-label{display:block;font-size:.72em;color:var(--muted)}
.plan-card .spec-value{display:block;font-size:1.05em;font-weight:700}
.plan-btn{background:#FF3700;color:#fff;border-radius:9999px;display:block;width:100%;text-align:center;padding:14px;font-weight:700;text-decoration:none;font-size:1em}
.plan-btn:hover{background:#d92e00}

@media (max-width:600px){
  .filters{flex-direction:column;align-items:center}
  .filters label{justify-content:space-between;width:100%;max-width:240px}
  .filters input[type="text"]{width:100%;max-width:240px}
  h1.page-title,.updated,main>p,.note,.counts,.promo-notice{text-align:center}
}