.plant-preview-open{overflow:hidden}
.plant-preview-layer{position:fixed;inset:0;z-index:9998;display:grid;place-items:center;padding:24px}
.plant-preview-layer[hidden]{display:none!important}
.plant-preview-backdrop{position:absolute;inset:0;border:0;background:rgba(15,32,23,.58);backdrop-filter:blur(6px);cursor:pointer}
.plant-preview{position:relative;width:min(900px,calc(100vw - 48px));max-height:min(720px,calc(100vh - 48px));overflow:auto;display:grid;grid-template-columns:minmax(300px,.92fr) minmax(0,1.08fr);background:#fbfaf6;border:1px solid rgba(25,45,34,.16);border-radius:22px;box-shadow:0 30px 80px rgba(10,26,18,.28);transform:translateY(12px) scale(.985);opacity:0;transition:transform .2s ease,opacity .2s ease}
.plant-preview-layer.is-open .plant-preview{transform:none;opacity:1}
.plant-preview__close{position:absolute;top:14px;right:14px;z-index:2;width:42px;height:42px;border:1px solid rgba(25,45,34,.16);border-radius:50%;background:rgba(251,250,246,.92);color:#193025;font-size:26px;line-height:1;cursor:pointer;display:grid;place-items:center}
.plant-preview__close:hover,.plant-preview__close:focus-visible{background:#193025;color:#fff}
.plant-preview__media{min-height:440px;background:#eef0e8;overflow:hidden}
.plant-preview__media img{width:100%;height:100%;min-height:440px;object-fit:cover;display:block}
.plant-preview__media.is-empty{display:grid;place-items:center}
.plant-preview__content{padding:54px 46px 42px;display:flex;flex-direction:column;align-items:flex-start}
.plant-preview__category{display:inline-flex;align-items:center;min-height:28px;padding:5px 10px;border-radius:999px;background:#edf1e8;color:#415846;font-size:12px;font-weight:600;margin-bottom:14px}
.plant-preview__content h2{margin:0;color:#17372a;font-size:clamp(30px,3.2vw,46px);line-height:1.05;letter-spacing:-.04em;font-weight:500!important}
.plant-preview__botanical{margin:9px 0 0;color:#7c8178;font-size:14px;font-style:italic}
.plant-preview__summary{margin:22px 0 0;color:#4f5c54;font-size:15px;line-height:1.75;max-width:48ch}
.plant-preview__tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:20px}
.plant-preview__tags span{display:inline-flex;padding:7px 10px;border:1px solid rgba(25,45,34,.13);border-radius:999px;color:#4b5b51;background:#fff;font-size:12px;font-weight:500}
.plant-preview__actions{width:100%;margin-top:auto;padding-top:30px;display:grid;grid-template-columns:1fr 1fr;gap:10px}
.plant-preview__action{min-height:50px;border-radius:10px;padding:0 18px;display:inline-flex;align-items:center;justify-content:center;border:1px solid #1e4d39;font-size:13px;font-weight:600;text-align:center;cursor:pointer}
.plant-preview__action--primary{background:#1f513c;color:#fff}
.plant-preview__action--primary.is-added{background:#edf1e8;color:#244535;border-color:#d8dfd3}
.plant-preview__action--secondary{background:#fff;color:#1f513c}
.plant-preview__detail{grid-column:1/-1;display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:42px;color:#274d3c;font-size:13px;font-weight:600}
.plant-preview__detail:hover{text-decoration:underline}
@media(max-width:760px){.plant-preview-layer{padding:12px}.plant-preview{width:calc(100vw - 24px);max-height:calc(100vh - 24px);grid-template-columns:1fr}.plant-preview__media{min-height:220px;max-height:280px}.plant-preview__media img{min-height:220px;max-height:280px}.plant-preview__content{padding:28px 22px 24px}.plant-preview__close{top:10px;right:10px}.plant-preview__actions{grid-template-columns:1fr}.plant-preview__detail{grid-column:auto}.plant-preview__summary{font-size:14px}}

/* 2026-09-09 — resilient media fallback and final typography polish. */
.plant-preview__media{position:relative}
.plant-preview__media.is-empty{min-height:440px;background:linear-gradient(145deg,#eef2e9,#e3e9dd)}
.plant-preview__media.is-empty::before{content:"";width:54px;height:54px;border:1px solid rgba(45,78,55,.18);border-radius:50%;background:rgba(255,255,255,.48)}
.plant-preview__media.is-empty::after{content:"Bitki görseli";position:absolute;left:50%;top:calc(50% + 44px);transform:translate(-50%,-50%);color:#657368;font-size:12px;font-weight:600;letter-spacing:.02em}
.plant-preview__content h2{font-weight:550!important}
.plant-preview__summary{color:#46564d;font-size:15.5px}
@media(max-width:760px){.plant-preview__media.is-empty{min-height:220px}.plant-preview__media.is-empty::after{top:calc(50% + 39px)}}