/*
 * Dalga Review Wall: the /reviews/ page. Scoped to #drw so the Elementor kit and theme cannot leak in.
 * Same language as the homepage review spotlight (#dlr): the summary panel is the lavender card in
 * light mode and the violet card in dark mode; review cards are the quiet surface around it.
 * The stylesheet is tagged dracula-ignore. Light = base tokens, dark = html[data-dracula-scheme="dark"].
 */

#drw{
	--drw-ink:#12112e; --drw-ink-2:#4a4675; --drw-ink-3:#6b6792;
	--drw-line:rgba(18,17,46,.1); --drw-line-2:rgba(18,17,46,.18);
	--drw-surface:#ffffff; --drw-surface-2:#f7f6fd;
	--drw-panel:#f4f2fe; --drw-panel-edge:rgba(96,80,220,.16); --drw-panel-ink:#12112e; --drw-panel-ink-2:#4a4675;
	--drw-panel-track:rgba(18,17,46,.1); --drw-panel-fill:#6050dc; --drw-panel-hover:rgba(96,80,220,.08);
	--drw-glow:rgba(63,208,194,.22);
	--drw-accent:#5646d6; --drw-accent-fill:#6050dc; --drw-on-accent:#ffffff;
	--drw-star:#e59c12; --drw-star-e:rgba(18,17,46,.15);
	--drw-pill:rgba(96,80,220,.1); --drw-pill-ink:#3d2fb8;
	--drw-reply:#f4f2fe;
	--drw-shadow:0 1px 2px rgba(18,17,46,.04),0 18px 40px -30px rgba(60,40,200,.3);
	--drw-panel-shadow:0 1px 2px rgba(18,17,46,.04),0 24px 48px -30px rgba(60,40,200,.35);
	--drw-p-atb:#1aa596; --drw-p-ayb:#e0343f; --drw-p-wacb:#2d8fd5; --drw-p-baps:#e07a12; --drw-p-other:#8a7ff0;
	--drw-sel:#b5f0e9; --drw-sel-ink:#0b2b28;
	--drw-display:"Poppins",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
	--drw-body:"Nunito","Nunito Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
	color-scheme:light;
}
html[data-dracula-scheme="dark"] #drw{
	--drw-ink:#ffffff; --drw-ink-2:#bdb9df; --drw-ink-3:#9a95c4;
	--drw-line:rgba(236,234,248,.1); --drw-line-2:rgba(236,234,248,.2);
	--drw-surface:#17153a; --drw-surface-2:#1d1a47;
	--drw-panel:#5a49d6; --drw-panel-edge:transparent; --drw-panel-ink:#ffffff; --drw-panel-ink-2:rgba(255,255,255,.82);
	--drw-panel-track:rgba(255,255,255,.2); --drw-panel-fill:#ffffff; --drw-panel-hover:rgba(255,255,255,.1);
	--drw-glow:rgba(63,208,194,.32);
	--drw-accent:#a79cff; --drw-accent-fill:#6050dc; --drw-on-accent:#ffffff;
	--drw-star:#f6b93b; --drw-star-e:rgba(236,234,248,.18);
	--drw-pill:rgba(139,127,243,.18); --drw-pill-ink:#d9d4ff;
	--drw-reply:#221e52;
	--drw-shadow:none;
	--drw-panel-shadow:0 30px 60px -34px rgba(60,40,200,.75);
	--drw-p-atb:#3fd0c2; --drw-p-ayb:#ff7a7a; --drw-p-wacb:#8fd0ff; --drw-p-baps:#ffc37a; --drw-p-other:#b3aaff;
	--drw-sel:#3fd0c2; --drw-sel-ink:#062421;
	color-scheme:dark;
}

/* ---------- reset inside the block ---------- */
#drw{max-width:1180px;margin:0 auto;padding:56px 20px 96px;color:var(--drw-ink);font:400 16px/1.6 var(--drw-body);text-align:left;-webkit-font-smoothing:antialiased}
#drw *,#drw *::before,#drw *::after{box-sizing:border-box}
#drw [hidden]{display:none!important}
#drw h1,#drw h2,#drw p,#drw ul,#drw li{margin:0;padding:0;border:0;background:none;text-transform:none;letter-spacing:normal;list-style:none}
#drw button,#drw select{margin:0;border:0;background:none;box-shadow:none;border-radius:0;min-height:0;font:inherit;line-height:inherit;color:inherit;text-transform:none;letter-spacing:normal;cursor:pointer}
#drw button{padding:0;-webkit-appearance:none;appearance:none}
#drw button:disabled{cursor:default}
#drw a{color:inherit}
#drw :focus-visible{outline:2px solid var(--drw-accent);outline-offset:3px;border-radius:8px}
#drw ::selection{background:var(--drw-sel);color:var(--drw-sel-ink)}
#drw .drw-stars,#drw .drw-star{display:inline-block;vertical-align:middle;flex:none}
#drw .drw-stars .f,#drw .drw-star path{fill:var(--drw-star)}
#drw .drw-stars .e{fill:var(--drw-star-e)}

/* ---------- hero: title + summary panel ---------- */
#drw .drw-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,1fr);gap:40px 56px;align-items:center}
#drw .drw-h1{font:800 clamp(32px,4.2vw,50px)/1.08 var(--drw-display);letter-spacing:-.03em;color:var(--drw-ink);text-wrap:balance;max-width:16ch}
#drw .drw-lede{margin-top:18px;font-size:17.5px;line-height:1.6;color:var(--drw-ink-2);max-width:52ch}

#drw .drw-score{position:relative;overflow:hidden;isolation:isolate;background:var(--drw-panel);color:var(--drw-panel-ink);border:1px solid var(--drw-panel-edge);border-radius:26px;padding:28px 28px 22px;box-shadow:var(--drw-panel-shadow)}
#drw .drw-score::before{content:"";position:absolute;width:420px;height:420px;right:-170px;top:-230px;border-radius:50%;background:radial-gradient(circle,var(--drw-glow),transparent 62%);z-index:-1;pointer-events:none}
#drw .drw-avg{display:grid;grid-template-columns:auto 1fr;grid-template-rows:auto auto;column-gap:16px;align-items:center;margin-bottom:18px}
#drw .drw-avg strong{grid-row:1/3;font:800 64px/1 var(--drw-display);letter-spacing:-.045em;font-variant-numeric:tabular-nums}
#drw .drw-avg .drw-stars{align-self:end}
#drw .drw-avg .drw-stars .f{fill:var(--drw-star)}
html[data-dracula-scheme="dark"] #drw .drw-avg .drw-stars .f,html[data-dracula-scheme="dark"] #drw .drw-score .drw-star path{fill:#ffffff}
html[data-dracula-scheme="dark"] #drw .drw-avg .drw-stars .e{fill:rgba(255,255,255,.3)}
#drw .drw-avg span{align-self:start;margin-top:4px;font-size:14.5px;font-weight:700;color:var(--drw-panel-ink-2)}
#drw .drw-dist{display:grid;gap:2px}
#drw .drw-bar{width:100%;display:grid;grid-template-columns:34px 1fr 30px;align-items:center;gap:12px;padding:5px 8px;border-radius:10px;font:700 13.5px/1 var(--drw-body);color:var(--drw-panel-ink);transition:background .2s}
#drw .drw-bar:not(:disabled):hover{background:var(--drw-panel-hover)}
#drw .drw-bar:disabled{opacity:.5}
#drw .drw-bar[aria-pressed="true"]{background:var(--drw-panel-hover);box-shadow:inset 0 0 0 1.5px var(--drw-panel-fill)}
#drw .drw-bar-k{display:inline-flex;align-items:center;gap:4px;font-variant-numeric:tabular-nums}
#drw .drw-bar-t{height:8px;border-radius:99px;background:var(--drw-panel-track);overflow:hidden}
#drw .drw-bar-t i{display:block;height:100%;border-radius:inherit;background:var(--drw-panel-fill)}
#drw .drw-bar-n{text-align:right;font-variant-numeric:tabular-nums;color:var(--drw-panel-ink-2)}

#drw .drw-chip i,#drw .drw-prod i{width:8px;height:8px;border-radius:50%;flex:none;background:var(--drw-p-other)}
#drw [data-p="atb"] i{background:var(--drw-p-atb)}
#drw [data-p="ayb"] i{background:var(--drw-p-ayb)}
#drw [data-p="wacb"] i{background:var(--drw-p-wacb)}
#drw [data-p="baps"] i{background:var(--drw-p-baps)}

/* ---------- toolbar ---------- */
#drw .drw-tools{margin-top:48px;padding-top:32px;border-top:1px solid var(--drw-line)}
#drw .drw-chips{display:flex;flex-wrap:wrap;gap:8px}
#drw .drw-chip{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border:1px solid var(--drw-line-2);border-radius:999px;font:700 13.5px/1.2 var(--drw-body);color:var(--drw-ink-2);white-space:nowrap;transition:background .2s,border-color .2s,color .2s}
#drw .drw-chip span{font-weight:600;opacity:.7;font-variant-numeric:tabular-nums}
#drw .drw-chip:hover{border-color:var(--drw-accent);color:var(--drw-ink)}
#drw .drw-chip[aria-pressed="true"]{background:var(--drw-accent-fill);border-color:var(--drw-accent-fill);color:var(--drw-on-accent)}
#drw .drw-chip[data-p="all"] i{display:none}
#drw .drw-sort{display:inline-flex;align-items:center;gap:10px;font:700 13.5px var(--drw-body);color:var(--drw-ink-3)}
#drw .drw-sort select{padding:8px 34px 8px 14px;border:1px solid var(--drw-line-2);border-radius:999px;background:var(--drw-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 16 16'%3E%3Cpath d='M4 6l4 4 4-4' fill='none' stroke='%238a86b3' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 13px center;font:700 13.5px var(--drw-body);color:var(--drw-ink);-webkit-appearance:none;appearance:none}
#drw .drw-meta{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 20px;margin-top:16px}
#drw .drw-status{font-size:14px;color:var(--drw-ink-3)}

/* ---------- the wall ---------- */
#drw .drw-wall{display:grid;grid-template-columns:repeat(auto-fill,minmax(320px,1fr));gap:18px;margin-top:20px}
#drw .drw-card{display:flex;flex-direction:column;gap:14px;padding:22px 22px 18px;background:var(--drw-surface);border:1px solid var(--drw-line);border-radius:20px;box-shadow:var(--drw-shadow)}
#drw .drw-card.in{animation:drw-in .5s cubic-bezier(.16,1,.3,1) both}
@keyframes drw-in{from{opacity:.001;transform:translateY(10px)}to{opacity:1;transform:none}}
#drw .drw-top{display:flex;align-items:center;justify-content:space-between;gap:10px}
#drw .drw-top time{font-size:13px;color:var(--drw-ink-3);font-variant-numeric:tabular-nums}
#drw .drw-text p{font-size:15.5px;line-height:1.65;color:var(--drw-ink);overflow-wrap:anywhere}
#drw .drw-text.clamp p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:7;overflow:hidden}
#drw .drw-more{align-self:flex-start;margin-top:-6px;font:700 13.5px var(--drw-body);color:var(--drw-accent);text-decoration:underline;text-underline-offset:3px}
#drw .drw-reply{padding:12px 14px;border-radius:12px;background:var(--drw-reply)}
#drw .drw-reply b{display:block;margin-bottom:4px;font:700 12.5px/1.3 var(--drw-body);color:var(--drw-accent)}
#drw .drw-reply p{font-size:14px;line-height:1.55;color:var(--drw-ink-2)}
#drw .drw-foot{margin-top:auto;padding-top:14px;border-top:1px solid var(--drw-line);display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;font-size:13px;color:var(--drw-ink-3)}
#drw .drw-who{font:600 15px/1.25 var(--drw-display);color:var(--drw-ink);margin-right:auto;overflow-wrap:anywhere}
#drw .drw-prod{display:inline-flex;align-items:center;gap:6px;padding:3px 10px 3px 8px;border-radius:999px;background:var(--drw-pill);color:var(--drw-pill-ink);font-weight:700;white-space:nowrap}
#drw .drw-src a{text-decoration:underline;text-underline-offset:2px}

#drw .drw-pager{display:flex;justify-content:center;margin-top:32px}
#drw .drw-load{padding:12px 24px;border:1px solid var(--drw-line-2);border-radius:999px;font:700 15px var(--drw-body);color:var(--drw-ink);transition:background .2s,border-color .2s,color .2s}
#drw .drw-load:hover{background:var(--drw-accent-fill);border-color:var(--drw-accent-fill);color:var(--drw-on-accent)}

/* ---------- close ---------- */
#drw .drw-cta{margin-top:72px;padding-top:40px;border-top:1px solid var(--drw-line);text-align:center}
#drw .drw-cta h2{font:800 clamp(24px,2.6vw,30px)/1.2 var(--drw-display);letter-spacing:-.02em;color:var(--drw-ink)}
#drw .drw-cta p{margin:10px auto 0;max-width:56ch;color:var(--drw-ink-2)}
#drw .drw-cta-links{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:22px}
#drw .drw-cta-links a{padding:10px 18px;border-radius:999px;background:var(--drw-pill);color:var(--drw-pill-ink);font:700 14px var(--drw-body);text-decoration:none;transition:background .2s,color .2s}
#drw .drw-cta-links a:hover{background:var(--drw-accent-fill);color:var(--drw-on-accent)}

@media (max-width:900px){
	#drw .drw-hero{grid-template-columns:minmax(0,1fr)}
	#drw .drw-h1{max-width:20ch}
}
@media (max-width:560px){
	#drw{padding:36px 16px 72px}
	#drw .drw-score{padding:22px 18px 16px}
	#drw .drw-avg strong{font-size:52px}
	#drw .drw-wall{grid-template-columns:minmax(0,1fr)}
	#drw .drw-chips{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;margin-inline:-16px;padding-inline:16px}
	#drw .drw-chips::-webkit-scrollbar{display:none}
}
@media (prefers-reduced-motion:reduce){
	#drw .drw-card.in{animation:none}
}
