/* HAYDIGEL DISCOVERY + ENGAGEMENT V5 — 18.08.2026 */
:root{--hg-rose:#cf777b;--hg-rose-dark:#b85f66;--hg-blush:#fff5f2;--hg-cream:#fffaf7;--hg-gold:#c69550;--hg-ink:#342d2a;--hg-muted:#7d6e67;--hg-line:#eee1da}
.discovery-hub{margin-top:34px;margin-bottom:26px;background:linear-gradient(135deg,#fffaf7 0%,#fff4ef 56%,#fffdfb 100%);border:1px solid var(--hg-line);border-radius:18px;padding:28px}
.discovery-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:20px}
.discovery-head .eyebrow,.color-explore .eyebrow,.recent-zone .eyebrow{display:block;color:#b98443;font-size:11px;font-weight:900;letter-spacing:.12em;text-transform:uppercase;margin-bottom:6px}
.discovery-head h2,.color-explore h2,.recent-zone h2{font-family:Georgia,serif;color:var(--hg-ink);font-size:34px;line-height:1.05;margin:0}
.discovery-head p{max-width:560px;color:var(--hg-muted);margin:0;line-height:1.55}
.discovery-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr);gap:20px}
.occasion-box,.style-finder{background:#fff;border:1px solid #eadfd8;border-radius:14px;padding:20px;min-width:0}
.occasion-box h3,.style-finder h3{margin:0 0 6px;font-family:Georgia,serif;font-size:24px;color:var(--hg-ink)}
.occasion-box>p,.style-finder>p{margin:0 0 14px;color:var(--hg-muted);font-size:14px;line-height:1.5}
.choice-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.choice-btn{appearance:none;border:1px solid #ead5d1;background:#fff8f5;color:#5e4d47;border-radius:999px;padding:9px 13px;font-weight:800;font-size:13px;cursor:pointer;transition:.16s ease}
.choice-btn:hover,.choice-btn.active{background:var(--hg-rose);border-color:var(--hg-rose);color:#fff;transform:translateY(-1px)}
.choice-btn:focus-visible,.discover-more:focus-visible,.explore-fab:focus-visible,.discover-close:focus-visible{outline:3px solid rgba(207,119,123,.32);outline-offset:3px}
.look-result{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.look-card{display:block;border:1px solid #eee4df;border-radius:12px;overflow:hidden;background:#fff;color:var(--hg-ink);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.look-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(69,49,42,.09);border-color:#e2cac5;color:var(--hg-rose-dark)}
.look-card img{display:block;width:100%;aspect-ratio:16/10;object-fit:cover;background:#f5ede8}
.look-card span{display:block;padding:11px 12px 12px;font-size:13px;font-weight:800;line-height:1.35}
.style-result{min-height:58px;border-radius:10px;background:#fff8f5;border:1px dashed #e6cbc5;padding:12px 13px;color:#66554f;font-size:13px;line-height:1.45}
.style-result strong{display:block;color:var(--hg-ink);font-size:15px;margin-bottom:3px}
.style-result a{color:var(--hg-rose-dark);font-weight:800;text-decoration:underline;text-underline-offset:2px}
.color-explore{margin-top:26px;margin-bottom:26px;border:1px solid var(--hg-line);border-radius:16px;background:#fff;padding:24px}
.color-head{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:16px}
.color-head p{color:var(--hg-muted);margin:0;max-width:540px}
.color-links{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.color-link{display:flex;align-items:center;gap:10px;border:1px solid #eee5df;border-radius:12px;padding:12px;background:#fffaf8;font-weight:800;color:#51443f;transition:.16s ease}
.color-link:hover{border-color:#dfc4bf;transform:translateY(-2px);box-shadow:0 7px 18px rgba(71,49,42,.07)}
.color-dot{width:22px;height:22px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #d9ccc6;flex:0 0 auto}
.color-dot.black{background:#1f1d1c}.color-dot.white{background:#fff}.color-dot.red{background:#b5363c}.color-dot.green{background:#547659}.color-dot.navy{background:#26364e}
.week-style-links{display:flex;gap:6px;flex-wrap:wrap;margin:10px 0 0}
.week-style-links a{display:inline-flex!important;width:auto!important;align-items:center;justify-content:center;padding:7px 9px!important;background:#fff7f3!important;border:1px solid #efdcd5!important;color:#8e5e59!important;border-radius:999px!important;font-size:11px!important;font-weight:800!important}
.recent-zone{margin-top:26px;margin-bottom:28px;display:none}
.recent-zone.has-items{display:block}
.recent-cards{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:16px}
.recent-card{display:grid;grid-template-columns:92px 1fr;min-height:92px;border:1px solid #eee4df;background:#fff;border-radius:12px;overflow:hidden;color:var(--hg-ink)}
.recent-card:hover{border-color:#e0c8c2;color:var(--hg-rose-dark)}
.recent-card img{width:92px;height:100%;object-fit:cover;background:#f5ede8}
.recent-card span{display:flex;align-items:center;padding:10px;font-size:12px;font-weight:800;line-height:1.35}
.article-progress{position:fixed;left:0;top:0;height:3px;background:var(--hg-rose);width:0;z-index:1000;box-shadow:0 0 8px rgba(207,119,123,.34);pointer-events:none}
.article-discover{margin:30px 0 8px;padding:22px;background:#fff8f5;border:1px solid #ecd8d1;border-radius:14px}
.article-discover-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:14px}
.article-discover h2{font-family:Georgia,serif!important;font-size:26px!important;margin:0!important;color:var(--hg-ink)}
.article-discover .mini-note{font-size:11px;color:#9a7d72;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.article-discover-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.article-next-card{display:block;border:1px solid #eadfd8;border-radius:11px;overflow:hidden;background:#fff;color:var(--hg-ink)}
.article-next-card:hover{color:var(--hg-rose-dark);border-color:#ddc2bc;box-shadow:0 8px 20px rgba(66,46,39,.07)}
.article-next-card img{display:block;width:100%;aspect-ratio:16/9;object-fit:cover;background:#f5ede8}
.article-next-card strong{display:block;padding:10px 11px 12px;font-size:13px;line-height:1.35}
.article-recent{margin:18px 0 0}
.discover-more{border:0;background:#332c29;color:#fff;border-radius:999px;padding:9px 14px;font-weight:800;font-size:12px;cursor:pointer}
.discover-more:hover{background:var(--hg-rose)}
.explore-fab{display:none;position:fixed;left:50%;transform:translateX(-50%);bottom:14px;z-index:190;border:0;background:#332c29;color:#fff;border-radius:999px;padding:11px 17px;font-weight:900;box-shadow:0 10px 28px rgba(42,31,27,.24);cursor:pointer;white-space:nowrap}
.discover-drawer{position:fixed;inset:0;z-index:420;display:none;background:rgba(42,34,31,.46);backdrop-filter:blur(3px)}
.discover-drawer.open{display:block}
.discover-sheet{position:absolute;left:0;right:0;bottom:0;max-height:82vh;overflow:auto;background:#fff;border-radius:20px 20px 0 0;padding:20px 18px 28px;box-shadow:0 -20px 60px rgba(39,27,23,.2)}
.discover-sheet-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:15px}
.discover-sheet-head h2{font-family:Georgia,serif;font-size:27px;margin:0;color:var(--hg-ink)}
.discover-close{border:0;background:#f7ece7;border-radius:50%;width:38px;height:38px;font-size:22px;cursor:pointer}
.discover-quick{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin-bottom:16px}
.discover-quick a{border:1px solid #eadfd8;border-radius:12px;padding:12px;background:#fff8f5;font-weight:800;color:#564843}
.discover-random{border-top:1px solid #eee5df;padding-top:14px}
.discover-random>strong{display:block;margin-bottom:8px}
.discover-random a{display:block;padding:9px 2px;border-bottom:1px solid #f2eae5;font-weight:700;color:#514541}
@media(max-width:1050px){.discovery-grid{grid-template-columns:1fr}.color-links{grid-template-columns:repeat(3,1fr)}.recent-cards{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.discovery-hub{padding:20px;margin-top:22px}.discovery-head{align-items:start;flex-direction:column}.look-result{grid-template-columns:repeat(3,1fr)}.article-discover-grid{grid-template-columns:repeat(3,1fr)}.explore-fab{display:block}.back-top{bottom:66px!important}}
@media(max-width:620px){.discovery-head h2,.color-explore h2,.recent-zone h2{font-size:29px}.look-result{grid-template-columns:1fr}.look-card{display:grid;grid-template-columns:120px 1fr;min-height:88px}.look-card img{width:120px;height:100%;aspect-ratio:auto}.look-card span{display:flex;align-items:center}.color-explore{padding:18px}.color-head{align-items:start;flex-direction:column}.color-links{grid-template-columns:1fr 1fr}.recent-cards{grid-template-columns:1fr}.article-discover{padding:17px}.article-discover-head{align-items:start;flex-direction:column}.article-discover-grid{grid-template-columns:1fr}.article-next-card{display:grid;grid-template-columns:115px 1fr}.article-next-card img{width:115px;height:100%;aspect-ratio:auto}.article-next-card strong{display:flex;align-items:center}.explore-fab{bottom:12px}}
@media(prefers-reduced-motion:reduce){.choice-btn,.look-card,.color-link,.article-next-card{transition:none}.article-progress{display:none}}
/* Article reactions: real counts are loaded from the same-origin PHP endpoint. */
.article-reactions{margin:2rem 0;padding:1.25rem;border:1px solid #eadfd7;border-radius:16px;background:#fffaf6}.article-reactions>strong{display:block;margin-bottom:.8rem}.article-reactions>div{display:flex;flex-wrap:wrap;gap:.7rem}.article-reactions button{border:1px solid #d9c5b8;border-radius:999px;background:#fff;padding:.7rem 1rem;cursor:pointer;color:#302821;font:inherit}.article-reactions button:hover{border-color:#b88b70}.article-reactions button.voted,.article-reactions button:disabled{background:#f2e9e3;cursor:default}.article-reactions small{display:block;margin-top:.7rem;color:#756860}