@import url(‘https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500;700;900&family=M+PLUS+Rounded+1c:wght@400;500;700;800&family=DM+Sans:wght@400;500;700&display=swap’);
/* === Tokens === */
.kdo-hub{
–ink:#2b2230; –ink-soft:#5d4d5e; –ink-mute:#9c8c9c;
–cream:#fdf6f1; –cream-2:#faeae0; –cream-3:#f6dccd; –milk:#ffffff;
–coral:#ef7a6a; –coral-2:#f29f8b; –coral-soft:#fdd9cf;
–berry:#c0577d; –berry-soft:#f3c9d6;
–honey:#e8a958; –honey-soft:#f6d8a8;
–leaf:#6f9e7c; –leaf-soft:#cfe1d3;
–r-sm:12px; –r-md:18px; –r-lg:24px; –r-xl:32px;
–shadow-sm:0 4px 14px -8px rgba(189,90,100,.25);
–shadow-md:0 14px 30px -18px rgba(189,90,100,.35);
–shadow-lg:0 30px 60px -28px rgba(189,90,100,.35);
font-family:”M PLUS Rounded 1c”,”Zen Maru Gothic”,system-ui,sans-serif;
background:
radial-gradient(900px 600px at 10% 0%, color-mix(in oklab, var(–coral-soft) 60%, transparent), transparent 60%),
radial-gradient(800px 700px at 100% 100%, color-mix(in oklab, var(–berry-soft) 50%, transparent), transparent 60%),
var(–cream);
color:var(–ink);
min-height:100vh;
-webkit-font-smoothing:antialiased;
max-width:480px;
margin:0 auto;
padding:0 0 60px;
position:relative;
}
.kdo-hub *{ box-sizing:border-box; }
.kdo-hub button{ border:0; background:none; cursor:pointer; font-family:inherit; color:inherit; }
.kdo-hub a{ color:inherit; text-decoration:none; }
.kdo-hub img{ display:block; max-width:100%; }
/* fonts utility */
.kdo-hub .maru{ font-family:”Zen Maru Gothic”,”M PLUS Rounded 1c”,sans-serif; letter-spacing:.005em; }
.kdo-hub .dm{ font-family:”DM Sans”,system-ui,sans-serif; letter-spacing:.02em; }
@media (min-width: 481px){
.kdo-hub{
border-radius:32px;
margin:24px auto 60px;
box-shadow:0 50px 90px -30px rgba(120,50,70,.18);
overflow:hidden;
}
}
/* === Header === */
.kdo-hub .app-header{
position:sticky; top:0; z-index:30;
padding:12px 16px 12px;
display:flex; align-items:center; justify-content:space-between; gap:10px;
background:color-mix(in oklab, var(–cream) 88%, transparent);
backdrop-filter:blur(14px) saturate(160%);
-webkit-backdrop-filter:blur(14px) saturate(160%);
border-bottom:1px solid color-mix(in oklab, var(–ink) 6%, transparent);
}
.kdo-hub .brand{ display:flex; align-items:center; gap:8px; }
.kdo-hub .brand .logo{
width:30px; height:30px; border-radius:10px;
background:linear-gradient(135deg, var(–coral) 0%, var(–berry) 100%);
color:#fff; display:flex; align-items:center; justify-content:center;
font-family:”Zen Maru Gothic”,sans-serif; font-weight:900; font-size:14px;
box-shadow:0 6px 12px -8px rgba(192,87,125,.5);
}
.kdo-hub .brand .name{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:15px; color:var(–ink); }
.kdo-hub .brand .area{ font-size:10px; color:var(–berry); background:var(–cream-2); padding:2px 8px; border-radius:999px; margin-left:4px; font-weight:700; }
.kdo-hub .head-actions{ display:flex; gap:6px; align-items:center; }
.kdo-hub .icon-btn,
.kdo-hub .menu-btn{
width:36px; height:36px; border-radius:50%;
background:var(–milk); display:flex; align-items:center; justify-content:center;
box-shadow:var(–shadow-sm); color:var(–ink-soft);
}
.kdo-hub .menu-btn{ border-radius:12px; }
.kdo-hub .head-actions{ position:relative; }
.kdo-hub .menu-panel{ position:absolute; top:48px; right:0; min-width:200px; background:var(–milk); border-radius:14px; box-shadow:0 12px 30px -8px rgba(0,0,0,.18), 0 4px 8px rgba(0,0,0,.06); padding:6px; z-index:200; opacity:0; visibility:hidden; transform:translateY(-8px); transition:all .18s ease; }
.kdo-hub .menu-panel.open{ opacity:1; visibility:visible; transform:translateY(0); }
.kdo-hub .menu-panel a{ display:flex; align-items:center; gap:10px; padding:10px 12px; color:var(–ink); font-family:”Zen Maru Gothic”,sans-serif; font-size:13px; font-weight:700; border-radius:10px; text-decoration:none; transition:background .12s; }
.kdo-hub .menu-panel a:hover{ background:var(–cream-2); }
.kdo-hub .menu-panel a .ico{ width:18px; height:18px; flex-shrink:0; color:var(–coral); }
.kdo-hub .menu-panel a .ico svg{ width:100%; height:100%; stroke:currentColor; fill:none; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
/* === Big 3 Tabs === */
.kdo-hub .bigtabs-wrap{
position:sticky; top:60px; z-index:25;
padding:10px 16px 6px;
background:linear-gradient(180deg, var(–cream) 80%, transparent);
}
.kdo-hub .today-toggle{ background:var(–milk); color:var(–ink-soft); border:1.5px solid var(–coral-soft); border-radius:999px; padding:6px 14px; font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:11.5px; cursor:pointer; transition:all .15s; box-shadow:var(–shadow-sm); }
.kdo-hub .today-toggle:hover{ background:var(–cream-2); }
.kdo-hub .today-toggle.active{ background:var(–coral); color:#fff; border-color:var(–coral); box-shadow:0 4px 10px -2px rgba(239,122,106,.4); }
.kdo-hub .today-hidden{ display:none !important; }
.kdo-hub .expired-hidden{ display:none !important; }
.kdo-hub .page-intro{ padding:18px 18px 8px; }
.kdo-hub .page-intro .page-title{
font-family:”Zen Maru Gothic”,sans-serif; font-weight:900; font-size:22px;
line-height:1.4; color:var(–ink); margin:0 0 8px;
}
.kdo-hub .page-intro .page-sub{
font-size:12.5px; line-height:1.7; color:var(–ink-soft); margin:0;
}
.kdo-hub .bigtabs-label{
font-family:”DM Sans”,sans-serif; font-size:10px; font-weight:700;
color:var(–berry); letter-spacing:.14em; text-align:center; margin-bottom:8px;
}
.kdo-hub .bigtabs{
display:grid; grid-template-columns:1fr 1fr 1fr; gap:6px;
background:var(–milk); padding:6px; border-radius:22px;
box-shadow:var(–shadow-md), inset 0 0 0 1px color-mix(in oklab, var(–ink) 4%, transparent);
}
.kdo-hub .bigtab{
display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px;
padding:14px 6px; border-radius:18px;
background:transparent; color:var(–ink-mute);
transition:.2s; position:relative;
}
.kdo-hub .bigtab .ico{ font-size:22px; line-height:1; }
.kdo-hub .bigtab .lbl{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:12px; line-height:1.2; text-align:center; }
.kdo-hub .bigtab .sub{ font-size:9px; opacity:.65; font-family:”DM Sans”,sans-serif; letter-spacing:.04em; }
.kdo-hub .bigtab.active{
background:linear-gradient(135deg, var(–coral) 0%, var(–berry) 100%);
color:#fff; box-shadow:0 12px 24px -12px rgba(192,87,125,.55);
transform:translateY(-1px);
}
.kdo-hub .bigtab.active .sub{ opacity:.85; color:#fff; }
.kdo-hub .bigtab .badge{
position:absolute; top:8px; right:8px;
background:var(–honey); color:#fff;
font-size:9px; font-weight:700; font-family:”DM Sans”,sans-serif;
padding:1px 5px; border-radius:999px; min-width:16px; text-align:center;
}
.kdo-hub .bigtab.active .badge{ background:rgba(255,255,255,.25); }
.kdo-hub .tabpanel{ display:none; padding-top:6px; }
.kdo-hub .tabpanel.active{ display:block; }
/* === HERO 3 === */
.kdo-hub .hero3{
margin:6px 16px 0;
padding:18px 18px 16px;
background:
radial-gradient(280px 200px at 100% 0%, color-mix(in oklab, var(–honey-soft) 80%, transparent), transparent 60%),
radial-gradient(220px 200px at 0% 110%, color-mix(in oklab, var(–berry-soft) 70%, transparent), transparent 60%),
linear-gradient(135deg, var(–coral) 0%, var(–berry) 100%);
color:#fff; border-radius:var(–r-xl); box-shadow:var(–shadow-md);
position:relative; overflow:hidden;
}
.kdo-hub .hero3 .h3-meta{ display:flex; align-items:center; gap:8px; font-size:11px; opacity:.92; font-family:”DM Sans”,sans-serif; letter-spacing:.04em; }
.kdo-hub .hero3 .h3-meta .pulse{ width:6px; height:6px; border-radius:50%; background:#fff; box-shadow:0 0 0 0 rgba(255,255,255,.6); animation:kdo-pulse 2.4s infinite; }
@keyframes kdo-pulse{ 0%{box-shadow:0 0 0 0 rgba(255,255,255,.6)} 70%{box-shadow:0 0 0 8px rgba(255,255,255,0)} 100%{box-shadow:0 0 0 0 rgba(255,255,255,0)} }
.kdo-hub .hero3 h1{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:900; font-size:22px; line-height:1.4; margin:8px 0 14px; letter-spacing:.005em; }
.kdo-hub .hero3 h1 small{ display:block; font-size:11.5px; font-weight:500; opacity:.85; margin-top:4px; letter-spacing:.02em; }
.kdo-hub .h3-list{ display:flex; flex-direction:column; gap:8px; }
.kdo-hub .h3-item{ display:grid; grid-template-columns:28px 1fr auto; align-items:center; gap:10px; padding:12px; border-radius:var(–r-md); background:rgba(255,255,255,.14); backdrop-filter:blur(10px); }
.kdo-hub .h3-item .num{ font-family:”DM Sans”,sans-serif; font-weight:700; font-size:16px; color:#fff; opacity:.9; text-align:center; }
.kdo-hub .h3-item .body{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.kdo-hub .h3-item .tag{ display:inline-flex; align-items:center; gap:4px; font-size:9.5px; font-weight:700; padding:2px 7px; border-radius:999px; background:rgba(255,255,255,.22); color:#fff; align-self:flex-start; letter-spacing:.04em; }
.kdo-hub .h3-item h4{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:13.5px; margin:2px 0 0; line-height:1.4; color:#fff; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kdo-hub .h3-item .lim{ font-size:10.5px; color:rgba(255,255,255,.85); margin-top:1px; font-family:”DM Sans”,sans-serif; letter-spacing:.02em; }
.kdo-hub .h3-item .arr{ color:rgba(255,255,255,.7); display:flex; align-items:center; }
/* === Area Bubbles === */
.kdo-hub .area-row{ display:flex; gap:10px; padding:18px 16px 6px; overflow-x:auto; scrollbar-width:none; }
.kdo-hub .area-row::-webkit-scrollbar{ display:none; }
.kdo-hub .area-bubble{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:6px; width:64px; }
.kdo-hub .area-bubble .circle{ width:56px; height:56px; border-radius:50%; background:var(–milk); display:flex; align-items:center; justify-content:center; font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:16px; color:var(–berry); box-shadow:var(–shadow-sm); transition:.15s; }
.kdo-hub .area-bubble.active .circle{ background:linear-gradient(135deg, var(–coral) 0%, var(–berry) 100%); color:#fff; transform:scale(1.05); box-shadow:0 14px 28px -14px rgba(192,87,125,.6); }
.kdo-hub .area-bubble .lbl{ font-size:10px; color:var(–ink-soft); }
.kdo-hub .area-bubble.active .lbl{ color:var(–berry); font-weight:700; }
.kdo-hub .area-bubble .all .circle{ background:var(–cream-2); color:var(–ink-soft); border:1px dashed var(–coral-2); }
/* === Filter Chips === */
.kdo-hub .chip-row{ display:flex; gap:8px; padding:8px 16px 18px; overflow-x:auto; scrollbar-width:none; }
.kdo-hub .chip-row::-webkit-scrollbar{ display:none; }
.kdo-hub .chip{ flex:0 0 auto; padding:9px 14px; border-radius:999px; font-size:12px; font-weight:500; background:var(–milk); color:var(–ink-soft); box-shadow:var(–shadow-sm); display:inline-flex; align-items:center; gap:5px; }
.kdo-hub .chip.active{ background:var(–ink); color:var(–cream); box-shadow:0 8px 18px -10px rgba(43,34,48,.4); }
/* === Section Head === */
.kdo-hub .shead{ display:flex; align-items:flex-end; justify-content:space-between; padding:20px 20px 12px; }
.kdo-hub .shead h2{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:17px; margin:0; color:var(–ink); letter-spacing:.005em; }
.kdo-hub .shead h2 .icon{ display:inline-block; margin-right:6px; }
.kdo-hub .shead .more{ font-size:11.5px; color:var(–berry); font-weight:700; }
/* === SALE light === */
.kdo-hub .sale-section{ padding:0 16px; }
.kdo-hub .sale-hero{ background:linear-gradient(135deg, var(–ink) 0%, #4a334d 100%); color:var(–cream); border-radius:var(–r-xl); padding:18px 20px; display:grid; grid-template-columns:1fr 80px; gap:14px; align-items:center; box-shadow:var(–shadow-md); margin-bottom:12px; position:relative; overflow:hidden; }
.kdo-hub .sale-hero .kdo-ribbon{ display:inline-flex; align-items:center; gap:5px; background:var(–coral); color:#fff; padding:4px 10px; border-radius:999px; font-weight:700; font-size:10.5px; font-family:”DM Sans”,sans-serif; }
.kdo-hub .sale-hero h3{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:16px; margin:8px 0 4px; line-height:1.45; }
.kdo-hub .sale-hero .price{ display:flex; gap:8px; align-items:baseline; font-family:”DM Sans”,sans-serif; }
.kdo-hub .sale-hero .now{ font-size:22px; font-weight:700; color:var(–coral); }
.kdo-hub .sale-hero .was{ font-size:11px; color:rgba(255,255,255,.5); text-decoration:line-through; }
.kdo-hub .sale-hero .meta{ font-size:10.5px; color:rgba(255,255,255,.6); margin-top:4px; font-family:”DM Sans”,sans-serif; }
.kdo-hub .sale-hero .ph{ aspect-ratio:1; border-radius:var(–r-md); background:linear-gradient(135deg, var(–coral-soft), var(–berry-soft)); }
.kdo-hub .sale-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.kdo-hub .sale-card{ background:var(–milk); border-radius:var(–r-md); padding:12px; box-shadow:var(–shadow-sm); display:flex; flex-direction:column; gap:6px; }
.kdo-hub .sale-card .ph{ aspect-ratio:16/10; border-radius:var(–r-sm); background:linear-gradient(135deg, var(–cream-3), var(–coral-soft)); position:relative; }
.kdo-hub .sale-card .ph .ribbon-mini{ position:absolute; top:6px; left:6px; background:var(–berry); color:#fff; padding:2px 7px; border-radius:999px; font-size:9.5px; font-weight:700; font-family:”DM Sans”,sans-serif; }
.kdo-hub .sale-card h4{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:12.5px; margin:0; color:var(–ink); line-height:1.4; }
.kdo-hub .sale-card .price{ display:flex; gap:5px; align-items:baseline; font-family:”DM Sans”,sans-serif; }
.kdo-hub .sale-card .now{ font-size:14px; font-weight:700; color:var(–berry); }
.kdo-hub .sale-card .was{ font-size:10px; color:var(–ink-mute); text-decoration:line-through; }
/* === Feature Card === */
.kdo-hub .feature-card{ margin:0 16px; border-radius:var(–r-xl); background:var(–milk); overflow:hidden; box-shadow:var(–shadow-md); }
.kdo-hub .feature-card .ph{ aspect-ratio:16/10; background:radial-gradient(200px 160px at 80% 80%, color-mix(in oklab, var(–honey-soft) 80%, transparent), transparent 60%), linear-gradient(135deg, var(–leaf-soft), var(–cream-3)); position:relative; display:flex; align-items:flex-end; padding:14px; }
.kdo-hub .feature-card .ph .num{ background:rgba(255,255,255,.92); color:var(–berry); padding:5px 10px; border-radius:999px; font-weight:700; font-size:11px; font-family:”DM Sans”,sans-serif; }
.kdo-hub .feature-card .ph .save{ position:absolute; top:14px; right:14px; width:36px; height:36px; border-radius:50%; background:rgba(255,255,255,.95); color:var(–berry); display:flex; align-items:center; justify-content:center; font-size:17px; box-shadow:var(–shadow-sm); }
.kdo-hub .feature-card .body{ padding:16px 18px 18px; display:flex; flex-direction:column; gap:8px; }
.kdo-hub .feature-card h3{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:17px; margin:0; color:var(–ink); line-height:1.45; }
.kdo-hub .feature-card p{ margin:0; font-size:12.5px; color:var(–ink-soft); line-height:1.7; }
.kdo-hub .feature-card .stats{ display:flex; gap:14px; padding-top:8px; border-top:1px dashed var(–cream-3); }
.kdo-hub .feature-card .stats .s{ display:flex; flex-direction:column; gap:1px; }
.kdo-hub .feature-card .stats .v{ font-family:”DM Sans”,sans-serif; font-weight:700; font-size:13px; color:var(–berry); }
.kdo-hub .feature-card .stats .l{ font-size:9.5px; color:var(–ink-mute); letter-spacing:.04em; }
.kdo-hub .feature-card .review-row{ display:flex; align-items:center; gap:6px; font-size:11.5px; color:var(–ink-soft); }
.kdo-hub .feature-card .stars{ color:var(–honey); }
/* === Weekend / Events === */
.kdo-hub .weekend-section{ margin:12px 16px; padding:18px 18px 22px; background:linear-gradient(180deg, var(–cream-2) 0%, var(–cream) 100%); border-radius:var(–r-xl); }
.kdo-hub .weekend-bar{ display:flex; gap:6px; overflow-x:auto; scrollbar-width:none; padding-bottom:12px; }
.kdo-hub .weekend-bar::-webkit-scrollbar{ display:none; }
.kdo-hub .day{ flex:0 0 auto; padding:10px 12px; border-radius:18px; background:var(–milk); display:flex; flex-direction:column; align-items:center; gap:1px; min-width:60px; box-shadow:var(–shadow-sm); }
.kdo-hub .day .d{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:17px; color:var(–ink); }
.kdo-hub .day .w{ font-size:9px; color:var(–ink-mute); letter-spacing:.08em; font-family:”DM Sans”,sans-serif; }
.kdo-hub .day .c{ font-size:9.5px; color:var(–coral); font-weight:700; margin-top:2px; }
.kdo-hub .day.active{ background:linear-gradient(135deg, var(–coral) 0%, var(–berry) 100%); }
.kdo-hub .day.active .d, .kdo-hub .day.active .w{ color:#fff; }
.kdo-hub .day.active .c{ color:rgba(255,255,255,.85); }
.kdo-hub .wknd-list{ display:flex; flex-direction:column; gap:10px; }
.kdo-hub .wknd{ display:grid; grid-template-columns:70px 1fr auto; gap:12px; align-items:center; background:var(–milk); border-radius:var(–r-md); padding:10px 14px 10px 10px; box-shadow:var(–shadow-sm); }
.kdo-hub .wknd .ph{ aspect-ratio:1; border-radius:var(–r-sm); background:radial-gradient(60px 50px at 70% 30%, color-mix(in oklab, var(–honey-soft) 80%, transparent), transparent 60%), linear-gradient(135deg, var(–coral-soft), var(–berry-soft)); }
.kdo-hub .wknd .body{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.kdo-hub .wknd .when{ font-size:10px; color:var(–coral); font-weight:700; }
.kdo-hub .wknd h4{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:13px; margin:1px 0 2px; color:var(–ink); line-height:1.4; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.kdo-hub .wknd .where{ font-size:10.5px; color:var(–ink-soft); }
.kdo-hub .wknd .save{ width:32px; height:32px; border-radius:50%; background:var(–cream-2); color:var(–berry); display:flex; align-items:center; justify-content:center; font-size:14px; }
/* === Area Tiles === */
.kdo-hub .area-tiles{ display:flex; gap:10px; padding:0 16px 8px; overflow-x:auto; scrollbar-width:none; }
.kdo-hub .area-tiles::-webkit-scrollbar{ display:none; }
.kdo-hub .area-tile{ flex:0 0 180px; border-radius:var(–r-lg); padding:16px; background:var(–milk); box-shadow:var(–shadow-sm); display:flex; flex-direction:column; gap:8px; }
.kdo-hub .area-tile.east{ background:linear-gradient(135deg, color-mix(in oklab, var(–leaf-soft) 80%, var(–milk)), var(–milk)); }
.kdo-hub .area-tile.south{ background:linear-gradient(135deg, color-mix(in oklab, var(–coral-soft) 60%, var(–milk)), var(–milk)); }
.kdo-hub .area-tile.north{ background:linear-gradient(135deg, color-mix(in oklab, var(–honey-soft) 60%, var(–milk)), var(–milk)); }
.kdo-hub .area-tile.west{ background:linear-gradient(135deg, color-mix(in oklab, var(–berry-soft) 50%, var(–milk)), var(–milk)); }
.kdo-hub .area-tile.center{ background:linear-gradient(135deg, color-mix(in oklab, var(–cream-3) 80%, var(–milk)), var(–milk)); }
.kdo-hub .area-tile .name{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:17px; color:var(–ink); }
.kdo-hub .area-tile .name small{ display:block; font-family:”DM Sans”,sans-serif; font-size:9.5px; color:var(–ink-mute); letter-spacing:.08em; font-weight:500; margin-top:2px; }
.kdo-hub .area-tile .top{ font-size:11.5px; color:var(–ink-soft); display:flex; flex-direction:column; gap:3px; }
.kdo-hub .area-tile .top .item{ display:flex; gap:6px; align-items:baseline; }
.kdo-hub .area-tile .top .rk{ color:var(–coral); font-family:”DM Sans”,sans-serif; font-weight:700; font-size:10px; }
.kdo-hub .area-tile .stats{ font-family:”DM Sans”,sans-serif; font-size:10.5px; color:var(–ink-mute); padding-top:8px; border-top:1px dashed var(–cream-3); display:flex; gap:10px; }
.kdo-hub .area-tile .stats b{ color:var(–berry); font-weight:700; }
/* === Store Sale === */
.kdo-hub .store-row{ display:flex; gap:10px; padding:14px 16px 6px; overflow-x:auto; scrollbar-width:none; }
.kdo-hub .store-row::-webkit-scrollbar{ display:none; }
.kdo-hub .store-chip{ flex:0 0 auto; display:flex; flex-direction:column; align-items:center; gap:6px; width:68px; padding-top:2px; }
.kdo-hub .store-chip .ph{ width:56px; height:56px; border-radius:18px; background:var(–milk); display:flex; align-items:center; justify-content:center; font-family:”Zen Maru Gothic”,sans-serif; font-weight:800; font-size:11px; color:var(–ink); box-shadow:var(–shadow-sm); position:relative; text-align:center; line-height:1.1; padding:4px; }
.kdo-hub .store-chip .ph .dot{ position:absolute; top:-3px; right:-3px; background:var(–coral); color:#fff; font-family:”DM Sans”,sans-serif; font-weight:700; font-size:9px; padding:2px 6px; border-radius:999px; border:2px solid var(–cream); }
.kdo-hub .store-chip.active .ph{ background:linear-gradient(135deg, var(–ink) 0%, #4a334d 100%); color:#fff; transform:scale(1.05); }
.kdo-hub .store-chip .lbl{ font-size:10px; color:var(–ink-soft); white-space:nowrap; }
.kdo-hub .store-chip.active .lbl{ color:var(–berry); font-weight:700; }
.kdo-hub .store-sale-card{ margin:0 16px 10px; border-radius:var(–r-lg); background:var(–milk); box-shadow:var(–shadow-sm); overflow:hidden; display:flex; flex-direction:column; }
.kdo-hub .store-sale-card .top{ display:grid; grid-template-columns:56px 1fr auto; align-items:center; gap:12px; padding:12px 14px; border-bottom:1px dashed var(–cream-3); }
.kdo-hub .store-sale-card .logo{ width:56px; height:56px; border-radius:16px; background:var(–cream-2); display:flex; align-items:center; justify-content:center; font-family:”Zen Maru Gothic”,sans-serif; font-weight:800; font-size:12px; color:var(–berry); text-align:center; line-height:1.15; padding:4px; }
.kdo-hub .store-sale-card .who{ display:flex; flex-direction:column; gap:2px; min-width:0; }
.kdo-hub .store-sale-card .name{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:14px; color:var(–ink); }
.kdo-hub .store-sale-card .sub{ font-size:10.5px; color:var(–ink-mute); font-family:”DM Sans”,sans-serif; letter-spacing:.03em; }
.kdo-hub .store-sale-card .kdo-ribbon{ background:var(–coral); color:#fff; padding:4px 10px; border-radius:999px; font-family:”DM Sans”,sans-serif; font-weight:700; font-size:10.5px; letter-spacing:.04em; }
.kdo-hub .store-sale-card .body{ padding:12px 14px 14px; display:flex; flex-direction:column; gap:8px; }
.kdo-hub .store-sale-card .body h4{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:14px; margin:0; color:var(–ink); line-height:1.5; }
.kdo-hub .store-sale-card .body .lim{ font-size:11px; color:var(–berry); font-weight:700; display:flex; align-items:center; gap:4px; }
.kdo-hub .store-sale-card .items{ display:flex; flex-direction:column; gap:6px; font-size:12px; color:var(–ink-soft); line-height:1.5; }
.kdo-hub .store-sale-card .items .it{ display:grid; grid-template-columns:1fr auto; gap:8px; padding:6px 10px; border-radius:10px; background:var(–cream); }
.kdo-hub .store-sale-card .items .it .pr{ font-family:”DM Sans”,sans-serif; font-weight:700; color:var(–berry); white-space:nowrap; }
.kdo-hub .store-sale-card .items .it .pr s{ color:var(–ink-mute); font-weight:400; margin-right:4px; font-size:10.5px; }
/* === EC === */
.kdo-hub .ec-switch{ display:flex; gap:6px; padding:14px 16px 6px; overflow-x:auto; scrollbar-width:none; }
.kdo-hub .ec-switch::-webkit-scrollbar{ display:none; }
.kdo-hub .ec-pill{ flex:0 0 auto; padding:9px 16px; border-radius:999px; background:var(–milk); color:var(–ink-soft); font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:12px; box-shadow:var(–shadow-sm); display:inline-flex; align-items:center; gap:6px; }
.kdo-hub .ec-pill .dot{ display:inline-block; width:8px; height:8px; border-radius:50%; }
.kdo-hub .ec-pill.am .dot{ background:#ff9900; }
.kdo-hub .ec-pill.ra .dot{ background:#bf0000; }
.kdo-hub .ec-pill.ya .dot{ background:#ff0033; }
.kdo-hub .ec-pill.pp .dot{ background:#ee2737; }
.kdo-hub .ec-pill.active{ background:var(–ink); color:#fff; }
.kdo-hub .ec-hot{ margin:0 16px 10px; background:linear-gradient(135deg, #1a0e22 0%, #3a1c33 100%); color:#fff; border-radius:var(–r-lg); padding:16px 16px 18px; position:relative; overflow:hidden; }
.kdo-hub .ec-hot::before{ content:””; position:absolute; top:-40px; right:-40px; width:180px; height:180px; border-radius:50%; background:radial-gradient(circle, color-mix(in oklab, var(–coral) 50%, transparent), transparent 70%); }
.kdo-hub .ec-hot .badge{ display:inline-flex; align-items:center; gap:4px; background:var(–coral); color:#fff; font-family:”DM Sans”,sans-serif; font-weight:700; font-size:10px; padding:4px 10px; border-radius:999px; letter-spacing:.06em; }
.kdo-hub .ec-hot .timer{ font-family:”DM Sans”,sans-serif; font-size:11px; color:var(–honey-soft); margin-top:6px; letter-spacing:.04em; }
.kdo-hub .ec-hot h3{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:16px; margin:8px 0 10px; line-height:1.5; max-width:80%; }
.kdo-hub .ec-grid{ display:grid; grid-template-columns:1fr 1fr; gap:10px; padding:0 16px; }
.kdo-hub .ec-card{ background:var(–milk); border-radius:var(–r-md); overflow:hidden; box-shadow:var(–shadow-sm); display:flex; flex-direction:column; }
.kdo-hub .ec-card .ph{ aspect-ratio:1.1/1; background:linear-gradient(135deg, var(–cream-3), var(–coral-soft)); position:relative; display:flex; align-items:flex-end; padding:8px; }
.kdo-hub .ec-card .ph .pf{ background:rgba(255,255,255,.95); padding:3px 8px; border-radius:999px; font-family:”DM Sans”,sans-serif; font-weight:700; font-size:9.5px; display:inline-flex; align-items:center; gap:4px; }
.kdo-hub .ec-card .ph .pf .dot{ width:6px; height:6px; border-radius:50%; }
.kdo-hub .ec-card .ph .off{ position:absolute; top:8px; right:8px; background:var(–berry); color:#fff; font-family:”DM Sans”,sans-serif; font-weight:700; font-size:11px; padding:4px 8px; border-radius:10px; }
.kdo-hub .ec-card .body{ padding:10px 12px 12px; display:flex; flex-direction:column; gap:5px; }
.kdo-hub .ec-card h4{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:12.5px; margin:0; color:var(–ink); line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.kdo-hub .ec-card .price{ display:flex; gap:5px; align-items:baseline; font-family:”DM Sans”,sans-serif; }
.kdo-hub .ec-card .now{ font-size:14px; font-weight:700; color:var(–berry); }
.kdo-hub .ec-card .was{ font-size:10px; color:var(–ink-mute); text-decoration:line-through; }
.kdo-hub .ec-card .stars{ font-size:10px; color:var(–honey); }
.kdo-hub .ec-card .stars .cnt{ color:var(–ink-mute); font-family:”DM Sans”,sans-serif; margin-left:2px; }
/* === Reviews === */
.kdo-hub .reviews-section{ padding:0 16px; }
.kdo-hub .review-card{ background:var(–milk); border-radius:var(–r-lg); padding:16px; box-shadow:var(–shadow-sm); margin-bottom:10px; display:flex; flex-direction:column; gap:10px; }
.kdo-hub .review-card .top{ display:flex; align-items:center; justify-content:space-between; }
.kdo-hub .review-card .who{ display:flex; align-items:center; gap:8px; }
.kdo-hub .review-card .av{ width:34px; height:34px; border-radius:50%; background:linear-gradient(135deg, var(–coral-soft), var(–berry-soft)); display:flex; align-items:center; justify-content:center; color:var(–berry); font-weight:700; font-size:13px; }
.kdo-hub .review-card .name{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:13px; color:var(–ink); }
.kdo-hub .review-card .meta{ font-size:10px; color:var(–ink-mute); margin-top:1px; }
.kdo-hub .review-card .stars{ color:var(–honey); font-size:13px; }
.kdo-hub .review-card blockquote{ font-family:”Zen Maru Gothic”,sans-serif; font-size:14px; line-height:1.75; margin:0; color:var(–ink); font-weight:500; }
.kdo-hub .review-card .place-tag{ display:flex; align-items:center; gap:6px; font-size:11px; color:var(–berry); font-weight:700; background:var(–cream-2); padding:6px 10px; border-radius:999px; align-self:flex-start; }
.kdo-hub .review-cta{ background:linear-gradient(135deg, var(–cream-2), var(–cream)); border:2px dashed var(–coral-2); border-radius:var(–r-lg); padding:16px; text-align:center; margin-top:4px; }
.kdo-hub .review-cta h4{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:14px; margin:0 0 6px; color:var(–ink); }
.kdo-hub .review-cta p{ font-size:11.5px; color:var(–ink-soft); margin:0 0 10px; line-height:1.6; }
.kdo-hub .review-cta .btn{ background:linear-gradient(135deg, var(–coral) 0%, var(–berry) 100%); color:#fff; padding:10px 18px; border-radius:999px; font-weight:700; font-size:12px; border:0; box-shadow:0 8px 20px -10px rgba(192,87,125,.6); }
/* === About === */
.kdo-hub .about-section{ margin:24px 16px; padding:22px 18px 24px; background:var(–milk); border-radius:var(–r-xl); box-shadow:var(–shadow-sm); text-align:center; }
.kdo-hub .about-section .av{ width:76px; height:76px; border-radius:50%; margin:0 auto 12px; background:linear-gradient(135deg, var(–coral-soft), var(–berry-soft)); display:flex; align-items:center; justify-content:center; color:var(–berry); font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:12px; }
.kdo-hub .about-section .role{ display:inline-block; font-family:”DM Sans”,sans-serif; font-size:9.5px; color:var(–berry); letter-spacing:.14em; font-weight:700; background:var(–cream-2); padding:3px 10px; border-radius:999px; margin-bottom:8px; }
.kdo-hub .about-section .role.research{ background:var(–ink); color:var(–cream); }
.kdo-hub .about-section h3{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:17px; color:var(–ink); margin:0 0 8px; }
.kdo-hub .about-section p{ text-align:left; font-size:12.5px; color:var(–ink-soft); margin:0 0 8px; line-height:1.8; }
.kdo-hub .about-section .sites{ display:flex; gap:6px; justify-content:center; margin-top:12px; flex-wrap:wrap; }
.kdo-hub .about-section .sites a{ padding:7px 12px; border-radius:999px; background:var(–cream-2); color:var(–berry); font-size:11px; font-weight:700; }
/* === Footer === */
.kdo-hub .site-foot{ background:var(–ink); color:var(–cream); margin:16px 16px 0; padding:22px 18px 20px; border-radius:var(–r-xl); }
.kdo-hub .site-foot .logo-row{ display:flex; align-items:center; gap:8px; margin-bottom:12px; }
.kdo-hub .site-foot .logo{ width:28px; height:28px; border-radius:10px; background:linear-gradient(135deg, var(–coral), var(–berry)); display:flex; align-items:center; justify-content:center; color:#fff; font-family:”Zen Maru Gothic”,sans-serif; font-weight:900; font-size:13px; }
.kdo-hub .site-foot .lname{ font-family:”Zen Maru Gothic”,sans-serif; font-weight:700; font-size:14px; }
.kdo-hub .site-foot p{ font-size:11px; line-height:1.7; margin:0 0 14px; color:rgba(253,246,241,.7); }
.kdo-hub .site-foot .links{ display:grid; grid-template-columns:1fr 1fr; gap:4px 12px; font-size:11px; margin-bottom:14px; }
.kdo-hub .site-foot .links a{ color:rgba(253,246,241,.85); padding:4px 0; }
.kdo-hub .site-foot .copy{ font-family:”DM Sans”,sans-serif; font-size:9px; color:rgba(253,246,241,.45); letter-spacing:.08em; padding-top:12px; border-top:1px solid rgba(253,246,241,.12); display:flex; justify-content:space-between; }
.kdo-hub .h3-item { grid-template-columns: 28px 56px 1fr auto; gap: 10px; }
.kdo-hub .h3-item .thumb { width:56px; height:56px; border-radius:12px; object-fit:cover; box-shadow:0 4px 10px -4px rgba(0,0,0,.3); }
@media (max-width: 360px){
.kdo-hub .h3-item { grid-template-columns: 24px 48px 1fr auto; gap:8px; padding:10px; }
.kdo-hub .h3-item .thumb { width:48px; height:48px; border-radius:10px; }
}
.kdo-hub .h3-summary { grid-template-columns: 36px 1fr !important; gap: 12px !important; }
.kdo-hub .h3-summary h4 { white-space: normal !important; overflow: visible !important; }
body.page-id-188 #header, body.page-id-188 .header-container,
body.page-id-188 .tagline, body.page-id-188 .site-name-text,
body.page-id-188 .article-header,
body.page-id-188 .date-tags, body.page-id-188 .post-date,
body.page-id-188 .post-update, body.page-id-188 .breadcrumb,
body.page-id-188 .article-meta-info, body.page-id-188 .entry-author,
body.page-id-188 .toc, body.page-id-188 .toc-content,
body.page-id-188 .sns-share, body.page-id-188 .sns-share-buttons,
body.page-id-188 .sns-buttons, body.page-id-188 .sns-share-message,
body.page-id-188 .related-entries, body.page-id-188 .author-box,
body.page-id-188 .pager-post-navi, body.page-id-188 .comment-area { display: none !important; }
body.page-id-188 .author-info, body.page-id-188 .author-info-box,
body.page-id-188 .author-name, body.page-id-188 .article-footer,
body.page-id-188 .entry-footer, body.page-id-188 .footer,
body.page-id-188 .footer-bottom, body.page-id-188 .footer-meta,
body.page-id-188 .navi-footer, body.page-id-188 .copyright { display: none !important; }
.entry-content .toc, .entry-content .toc-content,
.entry-content .sns-share, .entry-content .related-entries,
.entry-content .author-box, .entry-content .pager-post-navi,
.entry-content .comment-area { display: none !important; }
body.page-id-188 .entry-title {
position: absolute !important;
width: 1px !important;
height: 1px !important;
clip: rect(0 0 0 0) !important;
clip-path: inset(50%) !important;
overflow: hidden !important;
white-space: nowrap !important;
margin: -1px !important;
padding: 0 !important;
border: 0 !important;
}
body.page-id-188 #main, body.page-id-188 .main { padding-top: 0 !important; }
body.page-id-188 .article { padding: 0 !important; margin: 0 !important; }
body.page-id-188 .entry-content { padding: 0 !important; }
body.page-id-188 #wpadminbar { display: none !important; }
body.page-id-188.admin-bar { margin-top: 0 !important; }
body.page-id-188 { padding-top: 0 !important; }
html.wp-toolbar { padding-top: 0 !important; }
.kdo-hub .area-bubble, .kdo-hub .store-chip, .kdo-hub .chip, .kdo-hub .ec-pill { cursor: pointer; }
.kdo-hub .filter-empty { padding: 24px 16px; text-align: center; color: var(–ink-mute); font-size: 13px; }
.kdo-hub .filter-empty.show { display: block; }
.kdo-hub [data-platform], .kdo-hub [data-store], .kdo-hub [data-area] { transition: opacity .15s; }
.kdo-hub .filter-hidden { display: none !important; }
.kdo-hub .area-bubble .circle { font-size: 13px !important; line-height: 1.2 !important; padding: 4px !important; text-align: center !important; }
.kdo-hub .area-bubble .all .circle { font-size: 12px !important; }
.kdo-hub .store-sale-card{ position:relative; overflow:visible !important; }
.kdo-hub .rank-badge{ position:absolute; top:-10px; left:-10px; z-index:10; width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; font-family:”DM Sans”,sans-serif; font-weight:900; font-size:14px; box-shadow:0 6px 18px -4px rgba(0,0,0,.45); border:3px solid var(–milk); }
.kdo-hub .rank-badge.rank-1{ background:linear-gradient(135deg, #ffd700, #ff9500); color:#3a2400; }
.kdo-hub .rank-badge.rank-2{ background:linear-gradient(135deg, #d8d8d8, #888); color:#222; }
.kdo-hub .rank-badge.rank-3{ background:linear-gradient(135deg, #cd7f32, #8b5a2b); color:#fff; }
.kdo-hub { padding-bottom: 100px !important; }
.kdo-hub .bnav { position: fixed; bottom: 0; left: 50%; transform: translateX(-50%); width: 100%; max-width: 480px; background: rgba(253,246,241,.95); backdrop-filter: blur(14px) saturate(160%); -webkit-backdrop-filter: blur(14px) saturate(160%); display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid rgba(43,34,48,.08); z-index: 100; box-shadow: 0 -4px 18px -4px rgba(0,0,0,.1); padding: 14px 0 calc(10px + env(safe-area-inset-bottom)); }
.kdo-hub .bnav::before { content: ”; position: absolute; top: 6px; bottom: calc(4px + env(safe-area-inset-bottom)); left: 25%; right: 25%; background: linear-gradient(180deg, rgba(255,107,90,.06), rgba(255,107,90,.12)); border-radius: 14px; z-index: 0; pointer-events: none; }
.kdo-hub .bnav::after { content: ‘お得情報’; position: absolute; top: -18px; left: 25%; right: 25%; background: var(–coral); color: #fff; font-family: “Zen Maru Gothic”,sans-serif; font-size: 10px; font-weight: 800; letter-spacing: .08em; padding: 3px 0; text-align: center; border-radius: 999px; box-shadow: 0 2px 6px -1px rgba(255,107,90,.4); z-index: 2; }
.kdo-hub .bnav a { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px; padding: 6px 2px; color: var(–ink-mute); font-size: 10px; font-weight: 700; text-decoration: none; transition: all .18s ease; border-radius: 12px; margin: 0 3px; }
.kdo-hub .bnav a:nth-child(2), .kdo-hub .bnav a:nth-child(3) { color: var(–coral); }
.kdo-hub .bnav a .ico { width: 22px; height: 22px; display: block; transition: transform .18s ease; }
.kdo-hub .bnav a .ico svg { width: 100%; height: 100%; stroke: currentColor; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.kdo-hub .bnav a.active { color: var(–coral); background: var(–milk); box-shadow: 0 0 0 1.5px var(–coral), 0 6px 14px -4px rgba(239,122,106,.45), 0 2px 4px -1px rgba(43,34,48,.08); transform: translateY(-4px); }
.kdo-hub .bnav a.active .ico { transform: scale(1.08); }
.mobile-footer-menu-buttons, .mobile-menu-buttons { display: none !important; }
今週・今月の
子連れイベント
熊本県全域で開催される、親子で楽しめる催し・ワークショップ・季節行事をまとめてお届け。
こ
RESEARCHED IN KUMAMOTO
「ガチで調べた」を、3つのインデックスに。
熊本県在住で、子どもと出かける前/買う前に「ちゃんと調べる」のって地味に時間がかかります。だから子連れイベント・常設の遊び場・お得情報を1か所にまとめました。
体験談はあえて前面に出していません。最終的に決めるのは、利用者のみなさんのレビューと、現場の情報そのものだと思っているからです。
画像の一部は Wikimedia Commons より引用（CC BY-SA 等のライセンスに基づく）
(function(){
// today-toggle
function isExpiredCard(c){
var e = c.dataset.periodEnd || ”;
if(!e) return false;
var today = new Date();
today.setHours(0,0,0,0);
var end = new Date(e + ‘T23:59:59’);
return end = s;
if (hit) hit = today = 0;
}
// wknd events + sale-hero + sale-card
panel.querySelectorAll(‘.wknd, .sale-hero, .sale-card’).forEach(function(card){
var area = card.getAttribute(‘data-area’) || ”;
var age = card.getAttribute(‘data-age’) || ”;
var place = card.getAttribute(‘data-place’) || ”;
var ok = match(area, st.area);
if (ok) ok = match(age, st.age);
if (ok) ok = match(place, st.place);
card.classList.toggle(‘filter-hidden’, !ok);
card.classList.toggle(‘expired-hidden’, isExpiredCard(card));
});
// area-tile
panel.querySelectorAll(‘.area-tile’).forEach(function(card){
var area = card.getAttribute(‘data-area’) || ”;
var ok = (st.area === ‘all’ || st.area === area);
card.classList.toggle(‘filter-hidden’, !ok);
});
} else if(panelName === ‘store’){
panel.querySelectorAll(‘.store-sale-card’).forEach(function(card){
var s = card.getAttribute(‘data-store’) || ”;
var cats = (card.getAttribute(‘data-cat’) || ”).split(‘,’);
var ok = (st.store === ‘all’ || st.store === s) &&
(st.cat === ‘all’ || cats.indexOf(st.cat) >= 0);
card.classList.toggle(‘filter-hidden’, !ok);
});
} else if(panelName === ‘ec’){
panel.querySelectorAll(‘.store-sale-card’).forEach(function(card){
var p = card.getAttribute(‘data-platform’) || ”;
var ok = (st.platform === ‘all’ || st.platform === p);
card.classList.toggle(‘filter-hidden’, !ok);
});
}
// Empty state hint
var visibleCards = panel.querySelectorAll(‘.store-sale-card:not(.filter-hidden):not(.expired-hidden), .wknd:not(.filter-hidden):not(.expired-hidden), .sale-hero:not(.filter-hidden):not(.expired-hidden), .sale-card:not(.filter-hidden):not(.expired-hidden)’).length;
var emptyEl = panel.querySelector(‘.filter-empty’);
if(!emptyEl){
emptyEl = document.createElement(‘div’);
emptyEl.className = ‘filter-empty’;
emptyEl.textContent = ‘😢 該当する情報がありません。フィルタを変更してみてください。’;
panel.appendChild(emptyEl);
}
emptyEl.style.display = (visibleCards === 0) ? ‘block’ : ‘none’;
}
// Filter buttons
document.querySelectorAll(‘.kdo-hub [data-filter-group]’).forEach(function(group){
var groupName = group.getAttribute(‘data-filter-group’);
var target = group.getAttribute(‘data-target’);
group.querySelectorAll(‘button[data-filter-value]’).forEach(function(btn){
btn.addEventListener(‘click’, function(e){
if(btn.disabled) return;
e.preventDefault();
var val = btn.getAttribute(‘data-filter-value’);
var key = btn.getAttribute(‘data-filter-key’) || groupName;
// Update active state
if(groupName === ‘age-place’ && val === ‘all’){
// reset both age + place
group.querySelectorAll(‘button’).forEach(function(b){ b.classList.remove(‘active’); });
btn.classList.add(‘active’);
state[target].age = ‘all’;
state[target].place = ‘all’;
} else if(groupName === ‘age-place’){
// toggle: same key/value → reset
if(state[target][key] === val){
btn.classList.remove(‘active’);
state[target][key] = ‘all’;
// If both reset, mark “all” active
if(state[target].age === ‘all’ && state[target].place === ‘all’){
var resetBtn = group.querySelector(‘button[data-filter-value=”all”]’);
if(resetBtn) resetBtn.classList.add(‘active’);
}
} else {
// Deactivate sibling with same key, then activate
group.querySelectorAll(‘button[data-filter-key=”‘ + key + ‘”]’).forEach(function(b){ b.classList.remove(‘active’); });
group.querySelector(‘button[data-filter-value=”all”]’).classList.remove(‘active’);
btn.classList.add(‘active’);
state[target][key] = val;
}
} else {
// simple single-select
group.querySelectorAll(‘button’).forEach(function(b){ b.classList.remove(‘active’); });
btn.classList.add(‘active’);
state[target][groupName] = val;
}
applyFilters(target);
});
});
});
})();
