/* Archived FX — fx.js'in stilleri. Yalnızca sitenin renk/yazı tipi değişkenleri kullanılır. */
.fx-hidden{opacity:0!important;pointer-events:none!important;visibility:hidden}
.fx-burst{position:fixed;z-index:200;pointer-events:none;color:var(--wine);transform:translate(-50%,-50%)}

/* ---------- 1) damla menü ---------- */
.fx-dm{position:fixed;right:24px;bottom:24px;width:68px;height:68px;z-index:60;-webkit-tap-highlight-color:transparent;transition:opacity .2s,visibility .2s}
.fx-dm__goo{position:absolute;left:50%;top:50%;width:360px;height:360px;margin:-180px 0 0 -180px;overflow:visible;pointer-events:none}
.fx-dm__liquid{fill:var(--wine)}
.fx-dm__btn,.fx-dm__item{position:absolute;left:50%;top:50%;display:grid;place-items:center;padding:0;border:0;border-radius:50%;background:transparent;color:var(--on-wine);cursor:pointer;touch-action:manipulation}
.fx-dm__btn{width:68px;height:68px;margin:-34px 0 0 -34px;font-size:26px;box-shadow:0 10px 24px -8px color-mix(in srgb,var(--wine) 70%,transparent);border-radius:50%}
.fx-dm__plus{display:block;line-height:1}
.fx-dm__item{width:48px;height:48px;margin:-24px 0 0 -24px;font-size:20px;opacity:0}
.fx-dm__items{margin:0;padding:0;list-style:none}
.fx-dm__btn:focus-visible,.fx-dm__item:focus-visible{outline:3px solid var(--lavender);outline-offset:3px}
.fx-dm__label{position:absolute;left:50%;top:50%;opacity:0;pointer-events:none;white-space:nowrap;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:999px;padding:6px 12px;font:500 13px var(--sans);box-shadow:0 6px 16px -8px color-mix(in srgb,var(--ink) 40%,transparent)}
@media (max-width:640px){.fx-dm{right:16px;bottom:16px;width:62px;height:62px}.fx-dm__btn{width:62px;height:62px;margin:-31px 0 0 -31px}.fx-dm__item{width:44px;height:44px;margin:-22px 0 0 -22px}}

/* ---------- 2) basılı tut: yuvarlak menü ---------- */
.fx-holding{user-select:none;-webkit-user-select:none;-webkit-touch-callout:none}
.fx-rh-ring{position:fixed;z-index:300;width:44px;height:44px;margin:-22px 0 0 -22px;pointer-events:none}
.fx-rh-ring svg{width:100%;height:100%;transform:rotate(-90deg)}
.fx-rh-ring circle{fill:none;stroke:var(--wine);stroke-width:3;stroke-linecap:round}
.fx-rh{position:fixed;z-index:300;width:0;height:0}
.fx-rh__veil{position:fixed;inset:0;background:color-mix(in srgb,var(--paper) 55%,transparent);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);pointer-events:none}
.fx-rh.is-sticky .fx-rh__veil{pointer-events:auto}
.fx-rh__core{position:absolute;left:0;top:0;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:999px;background:var(--surface);border:1px solid var(--line);box-shadow:0 8px 22px -10px color-mix(in srgb,var(--ink) 45%,transparent);display:grid;place-items:center;transition:width .25s,margin .25s;overflow:hidden}
.fx-rh__core.has-name{width:96px;margin-left:-48px}
.fx-rh__name{font:500 12px var(--sans);color:var(--ink);white-space:nowrap}
.fx-rh__item{position:absolute;left:0;top:0;width:46px;height:46px;margin:-23px 0 0 -23px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);font-size:19px;display:grid;place-items:center;cursor:pointer;padding:0;box-shadow:0 6px 16px -8px color-mix(in srgb,var(--ink) 45%,transparent);transition:background .18s,color .18s}
.fx-rh__item.is-on,.fx-rh__item:focus-visible{background:var(--wine);color:var(--on-wine);border-color:transparent;outline:none}
.fx-rh__item.is-danger{color:#a8483f}
.fx-rh__item.is-danger.is-on,.fx-rh__item.is-danger:focus-visible{background:#a8483f;color:#fff}
.fx-holding{transition:transform .35s cubic-bezier(.2,.8,.2,1)}
.fx-holding:not(.fx-rh){transform:scale(.985)}

/* ---------- 3) cam arama ---------- */
body.fx-gs-open{overflow:hidden}
.fx-gs{position:fixed;inset:0;z-index:400;display:flex;justify-content:center;align-items:flex-start;padding:min(14vh,120px) 16px 24px;background:color-mix(in srgb,var(--paper) 52%,transparent);backdrop-filter:blur(16px) saturate(1.1);-webkit-backdrop-filter:blur(16px) saturate(1.1)}
.fx-gs__panel{width:min(620px,100%);max-height:100%;display:flex;flex-direction:column;min-height:0}
.fx-gs__bar{--mx:50%;--my:50%;position:relative;display:flex;align-items:center;gap:10px;padding:0 10px 0 18px;height:58px;border-radius:999px;background:color-mix(in srgb,var(--surface) 72%,transparent);border:1px solid var(--line);box-shadow:0 14px 40px -18px color-mix(in srgb,var(--ink) 40%,transparent);overflow:hidden;font-size:18px;color:var(--muted)}
.fx-gs__bar::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1.5px;background:radial-gradient(120px circle at var(--mx) var(--my),var(--wine),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);pointer-events:none;opacity:.8}
.fx-gs__bar input{flex:1;min-width:0;border:0;background:transparent;font:400 18px var(--sans);color:var(--ink);outline:none;height:100%}
.fx-gs__bar input::-webkit-search-cancel-button{display:none}
.fx-gs__x{border:0;background:var(--cream-deep);color:var(--ink);width:36px;height:36px;border-radius:50%;cursor:pointer;display:grid;place-items:center;font-size:14px;padding:0}
.fx-gs__sweep{position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,color-mix(in srgb,var(--surface) 90%,transparent) 50%,transparent 70%);pointer-events:none}
.fx-gs__hint{font:500 12px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:18px 6px 8px;min-height:1em}
.fx-gs__list{list-style:none;margin:0;padding:0 14px 12px;display:flex;flex-direction:column;gap:10px;overflow:auto;min-height:0}
.fx-gs__card{position:relative;margin-left:var(--off,0)}
.fx-gs__card button{width:100%;display:flex;align-items:center;gap:14px;text-align:left;padding:10px 14px 10px 10px;border-radius:18px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 78%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);cursor:pointer;color:var(--ink);transition:background .15s,border-color .15s,transform .15s}
.fx-gs__card.is-active button{border-color:var(--wine);background:var(--surface);transform:translateX(3px)}
.fx-gs__thumb{flex:none;width:48px;height:48px;border-radius:12px;background:var(--cream-deep);display:grid;place-items:center;color:var(--wine);font-size:20px;background-size:cover;background-position:center}
.fx-gs__txt{display:flex;flex-direction:column;min-width:0}
.fx-gs__txt b{font:400 18px/1.25 var(--serif);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-gs__txt small{font:400 13px var(--sans);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-gs__txt em{font-style:normal;color:var(--wine);font-weight:500}
.fx-gs mark{background:color-mix(in srgb,var(--peach) 70%,transparent);color:inherit;border-radius:3px;padding:0 1px}

/* ---------- 4) kâğıt takvim ---------- */
.fx-cal{position:relative;width:min(100%,300px);margin:0 auto;padding-top:14px;perspective:1100px}
.fx-cal__wire{position:absolute;left:14px;right:14px;top:0;height:26px;display:flex;justify-content:space-between;z-index:6;pointer-events:none}
.fx-cal__wire i{width:7px;height:24px;border-radius:5px;background:linear-gradient(90deg,color-mix(in srgb,var(--ink) 35%,var(--surface)),var(--surface) 45%,color-mix(in srgb,var(--ink) 30%,var(--surface)));border:1px solid color-mix(in srgb,var(--ink) 25%,transparent)}
.fx-cal__stack{position:relative;min-height:300px;transform-style:preserve-3d}
.fx-cal__stack::after{content:"";position:absolute;left:5px;right:5px;bottom:-6px;height:10px;background:var(--cream-deep);border:1px solid var(--line);border-top:0;border-radius:0 0 8px 8px;z-index:0}
.fx-cal__sheet{position:absolute;inset:0 0 auto 0;padding:26px 18px 18px;background:var(--surface);border:1px solid var(--line);border-radius:6px 6px 8px 8px;box-shadow:0 14px 30px -18px color-mix(in srgb,var(--ink) 50%,transparent);backface-visibility:hidden;transform-origin:50% 0;touch-action:pan-x}
.fx-cal__year{font:500 13px var(--sans);letter-spacing:.2em;color:var(--muted);text-align:center}
.fx-cal__month{font:italic 400 34px/1.1 var(--serif);text-align:center;margin:2px 0 12px;text-transform:capitalize;color:var(--ink)}
.fx-cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:2px;text-align:center}
.fx-cal__dow{font:600 11px var(--sans);color:var(--muted);padding:4px 0;text-transform:uppercase}
.fx-cal__dow.is-sun,.fx-cal__day.is-sun{color:color-mix(in srgb,var(--wine) 85%,var(--ink))}
.fx-cal__day{position:relative;aspect-ratio:1;border:0;background:transparent;color:var(--ink);font:400 15px var(--sans);cursor:pointer;border-radius:50%;padding:0;display:grid;place-items:center}
.fx-cal__day>span{display:block;transition:transform .2s}
.fx-cal__day:hover{background:color-mix(in srgb,var(--cream-deep) 80%,transparent)}
.fx-cal__day:focus-visible{outline:2px solid var(--wine);outline-offset:1px}
.fx-cal__day.is-today>span{font-weight:700;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--rose)}
.fx-cal__day.has-mark::after{content:"";position:absolute;bottom:3px;left:50%;width:4px;height:4px;margin-left:-2px;border-radius:50%;background:var(--wine)}
.fx-cal__ring{position:absolute;left:-15%;top:-15%;width:130%;height:130%;overflow:visible;pointer-events:none}
.fx-cal__ring path{fill:none;stroke:var(--wine);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.fx-cal__nav{display:flex;justify-content:center;gap:10px;margin-top:20px}
.fx-cal__nav button{width:38px;height:38px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;display:grid;place-items:center;padding:0;transition:background .15s}
.fx-cal__nav button:hover{background:var(--cream-deep)}

/* ---------- 5) yırtılan bilet ---------- */
.fx-tk{width:100%;max-width:520px;margin:0 auto;text-align:center}
.fx-tk__scale{position:relative;margin:0 auto}
.fx-tk__ticket{position:absolute;left:0;top:0;transform-origin:0 0}
.fx-tk__main,.fx-tk__stub{position:absolute;top:0;height:200px;background:var(--surface);border:1px solid var(--line);box-shadow:0 14px 28px -18px color-mix(in srgb,var(--ink) 50%,transparent)}
.fx-tk__main{left:0;width:400px;display:flex;border-radius:14px 0 0 14px;overflow:hidden;background:linear-gradient(90deg,var(--wine) 0 12px,var(--surface) 12px)}
.fx-tk__art{position:absolute;right:0;bottom:0;width:60%;height:70%;opacity:.14;background:radial-gradient(circle at 70% 30%,var(--peach) 0 18px,transparent 19px),linear-gradient(160deg,transparent 40%,var(--sage) 41%) ;mask:linear-gradient(90deg,transparent,#000)}
.fx-tk__txt{position:relative;padding:22px 28px 18px 34px;text-align:left;display:flex;flex-direction:column;gap:4px;min-width:0}
.fx-tk__kicker{font:600 11px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--wine)}
.fx-tk__txt h3{margin:0;font:400 28px/1.1 var(--serif);color:var(--ink)}
.fx-tk__txt p{margin:0;font:400 14px var(--sans);color:var(--muted)}
.fx-tk__meta{display:flex;gap:18px;margin-top:auto}
.fx-tk__meta small{display:block;font:500 10px var(--sans);letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.fx-tk__meta b{font:500 15px var(--sans);color:var(--ink)}
.fx-tk__stub{left:400px;width:120px;border-radius:0 14px 14px 0;border-left:2px dashed var(--line);background:var(--cream-deep)}
.fx-tk__flap{pointer-events:none}.fx-tk__held{pointer-events:none}
.fx-tk__stubin{height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;color:var(--ink)}
.fx-tk__stubin small{font:600 10px var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.fx-tk__stubin b{font:400 34px var(--serif)}
.fx-tk__bars{width:70px;height:34px;background:repeating-linear-gradient(90deg,var(--ink) 0 2px,transparent 2px 4px,var(--ink) 4px 5px,transparent 5px 8px);opacity:.55}
.fx-tk__grab{position:absolute;left:400px;top:0;width:120px;height:200px;cursor:grab;touch-action:none;z-index:5}
.fx-tk__grab:active{cursor:grabbing}
.fx-tk__stamp{position:absolute;left:210px;top:96px;font:700 30px var(--sans);letter-spacing:.14em;text-transform:uppercase;color:var(--wine);border:4px double var(--wine);border-radius:8px;padding:6px 16px;opacity:0;transform:rotate(-12deg);pointer-events:none;z-index:6}
.fx-tk__status{min-height:1.4em;font:400 13px var(--sans);color:var(--muted);margin:14px 0 6px}
.fx-tk__btn{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:var(--surface);color:var(--ink);border-radius:999px;padding:9px 18px;font:500 14px var(--sans);cursor:pointer}
.fx-tk__btn:hover:not(:disabled){background:var(--cream-deep)}
.fx-tk__btn:disabled{opacity:.5;cursor:default}

/* ---------- 6) disk dizisi ---------- */
.fx-cr{--fx-size:200px;position:relative;min-height:380px;padding-bottom:110px;perspective:1500px;outline:none;overflow:visible}
.fx-cr:focus-visible{outline:2px solid var(--wine);outline-offset:6px;border-radius:12px}
.fx-cr__stage{position:relative;height:calc(var(--fx-size) + 60px);transform-style:preserve-3d;margin-top:20px}
.fx-cr__disc{position:absolute;left:50%;top:30px;width:var(--fx-size);height:var(--fx-size);margin-left:calc(var(--fx-size) / -2);cursor:pointer;transform-style:preserve-3d;will-change:transform}
.fx-cr__face{position:relative;width:100%;height:100%;border-radius:50%;background-size:cover!important;background-position:center!important;box-shadow:0 18px 30px -16px color-mix(in srgb,var(--ink) 55%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--ink) 15%,transparent);overflow:hidden}
.fx-cr__rim{position:absolute;inset:0;border-radius:50%;box-shadow:inset 0 0 0 5px color-mix(in srgb,var(--surface) 55%,transparent),inset 0 0 0 6px color-mix(in srgb,var(--ink) 12%,transparent)}
.fx-cr__hole{position:absolute;left:50%;top:50%;width:19%;height:19%;transform:translate(-50%,-50%);border-radius:50%;background:var(--paper);box-shadow:0 0 0 5px color-mix(in srgb,var(--surface) 70%,transparent),inset 0 2px 4px color-mix(in srgb,var(--ink) 35%,transparent)}
.fx-cr__title{position:absolute;left:0;right:0;top:15%;text-align:center;font:italic 400 clamp(14px,calc(var(--fx-size)*.1),22px)/1.1 var(--serif);color:var(--on-wine);text-shadow:0 1px 6px color-mix(in srgb,var(--ink) 55%,transparent);padding:0 14%;overflow:hidden;max-height:30%}
.fx-cr__shine{position:absolute;inset:0;border-radius:50%;pointer-events:none;background:conic-gradient(from 30deg,transparent 0 12%,color-mix(in srgb,var(--surface) 38%,transparent) 18%,transparent 26% 62%,color-mix(in srgb,var(--surface) 30%,transparent) 70%,transparent 78%)}
.fx-cr__disc.is-front .fx-cr__face{box-shadow:0 26px 40px -18px color-mix(in srgb,var(--ink) 60%,transparent),inset 0 0 0 1px color-mix(in srgb,var(--ink) 18%,transparent)}
.fx-cr__info{position:absolute;left:0;right:0;bottom:0;text-align:center;pointer-events:none}
.fx-cr__t{font:400 28px/1.15 var(--serif);color:var(--ink);min-height:1.15em}
.fx-cr__s{font:400 14px var(--sans);color:var(--muted);min-height:1.4em}
.fx-cr__hint{font:500 12px var(--sans);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-top:10px}
.fx-cr__nav{position:absolute;top:calc(var(--fx-size) / 2 + 30px);width:42px;height:42px;border-radius:50%;border:1px solid var(--line);background:var(--surface);color:var(--ink);cursor:pointer;display:grid;place-items:center;padding:0;z-index:200}
.fx-cr__nav.is-prev{left:0}.fx-cr__nav.is-next{right:0}
.fx-cr__nav:hover{background:var(--cream-deep)}

/* ---------- 7) yırtılan karakter alanı ---------- */
.fx-torn{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}

/* ---------- 8) patlatılmış görünüm ---------- */
.fx-ex{position:relative}
.fx-ex--live{height:320vh}
.fx-ex__stage{position:relative;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);align-items:center;gap:20px;height:100vh;max-height:760px;min-height:520px;overflow:hidden}
.fx-ex--live .fx-ex__stage{position:sticky;top:0;max-height:none}
.fx-ex__scene{position:relative;height:100%;perspective:1300px;display:grid;place-items:center}
.fx-ex__obj{position:relative;margin-top:70px;width:200px;height:260px;transform-style:preserve-3d;transform:rotateX(58deg) rotateZ(-32deg)}
.fx-ex__layer{position:absolute;inset:0;border-radius:6px;transform-style:preserve-3d;box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 14%,transparent);will-change:transform}
.fx-ex__layer.is-board{background:var(--rose);box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 14%,transparent),8px 12px 24px -8px color-mix(in srgb,var(--ink) 40%,transparent)}
.fx-ex__layer.is-board i{position:absolute;left:14px;right:14px;top:14px;height:34px;border:1.5px solid color-mix(in srgb,var(--ink) 40%,transparent);border-radius:3px}
.fx-ex__layer.is-pages{inset:6px 10px 6px 6px;background:repeating-linear-gradient(var(--surface) 0 17px,var(--line) 17px 18px);}
.fx-ex__layer.is-pages b{position:absolute;left:12px;right:12px;top:12px;height:3px;background:var(--wine);opacity:.6}
.fx-ex__layer.is-ink{background:var(--surface);border:1px solid var(--line)}
.fx-ex__layer.is-ink svg{position:absolute;inset:6%;width:88%;height:88%;fill:none;stroke:var(--wine);stroke-width:2;stroke-linecap:round}
.fx-ex__layer.is-ribbon{inset:-8px auto -14px 54px;width:22px;background:var(--wine);clip-path:polygon(0 0,100% 0,100% 100%,50% 94%,0 100%);box-shadow:none}
.fx-ex__layer.is-stamp{inset:auto 14px 16px auto;width:58px;height:70px;background:var(--surface);border:1px dashed var(--wine);display:grid;place-items:center;transform-origin:center}
.fx-ex__layer.is-stamp span{width:34px;height:34px;border-radius:50%;background:radial-gradient(circle,var(--wine) 0 40%,var(--peach) 42%)}
.fx-ex__calls{display:flex;flex-direction:column;gap:22px;align-self:center;padding-right:8px}
.fx-ex__call{display:flex;align-items:flex-start;gap:14px;opacity:0}
.fx-ex__line{flex:none;width:64px;height:1px;background:var(--wine);margin-top:13px}
.fx-ex__call b{font:400 21px/1.2 var(--serif);color:var(--ink)}
.fx-ex__call p{margin:3px 0 0;font:400 14px/1.45 var(--sans);color:var(--muted);max-width:30ch}
.fx-ex--static .fx-ex__stage{height:auto;min-height:0;padding:30px 0}
.fx-ex--static .fx-ex__scene{min-height:420px}
.fx-ex--static .fx-ex__call{opacity:1}
@media (max-width:720px){.fx-ex__stage{grid-template-columns:1fr;grid-template-rows:55% 45%}.fx-ex__calls{gap:10px}.fx-ex__line{width:30px}.fx-ex__call p{display:none}.fx-ex__obj{transform:rotateX(58deg) rotateZ(-32deg) scale(.75)}}

/* ---------- 9) şekil değiştiren menü paneli ---------- */
.fx-sn{position:absolute;left:0;top:0;width:0;height:0;z-index:70;pointer-events:none}
.fx-sn.is-open{pointer-events:auto}
.fx-sn__bridge{position:absolute;top:-14px;height:16px}
.fx-sn__bg{position:absolute;left:0;top:0;border-radius:18px;background:var(--surface);border:1px solid var(--line);box-shadow:0 22px 44px -22px color-mix(in srgb,var(--ink) 50%,transparent);opacity:0}
.fx-sn__arrow{position:absolute;top:-6px;left:-6px;width:12px;height:12px;background:var(--surface);border-left:1px solid var(--line);border-top:1px solid var(--line);transform:rotate(45deg)}
.fx-sn__clip{position:absolute;left:0;top:0;overflow:hidden;border-radius:18px}
.fx-sn__list{position:absolute;left:0;top:0;min-width:220px;padding:10px;opacity:0;pointer-events:none;display:flex;flex-direction:column;gap:2px;width:max-content}
.fx-sn__list.is-on{pointer-events:auto}
.fx-sn__list button,.fx-sn__list a{display:flex;align-items:center;gap:12px;border:0;background:transparent;text-align:left;color:var(--ink);font:500 14px var(--sans);padding:10px 12px;border-radius:12px;cursor:pointer;text-decoration:none}
.fx-sn__list button:hover,.fx-sn__list a:hover,.fx-sn__list button:focus-visible,.fx-sn__list a:focus-visible{background:var(--cream-deep);outline:none}
.fx-sn__list i{display:grid;place-items:center;width:32px;height:32px;border-radius:10px;background:var(--rose);color:var(--ink);font-size:15px}
.fx-sn__list small{display:block;font:400 12px var(--sans);color:var(--muted)}
.fx-sn-on{color:var(--wine)}

/* ---------- 10) cam "şimdi okunuyor" ---------- */
.fx-gp{--c1:var(--wine);--c2:var(--lavender);position:relative;width:min(100%,380px);perspective:900px}
.fx-gp__glow{position:absolute;inset:14% 6% -10%;border-radius:40px;background:radial-gradient(60% 80% at 30% 40%,var(--c1),transparent 70%),radial-gradient(60% 80% at 80% 70%,var(--c2),transparent 70%);filter:blur(30px);opacity:.38;z-index:0}
.fx-gp__glass{--lx:50%;--ly:0%;position:relative;z-index:1;display:grid;grid-template-columns:76px 1fr;gap:6px 16px;padding:16px;border-radius:26px;background:linear-gradient(135deg,color-mix(in srgb,var(--c1) 14%,transparent),color-mix(in srgb,var(--c2) 16%,transparent)),color-mix(in srgb,var(--surface) 62%,transparent);backdrop-filter:blur(16px) saturate(1.2);-webkit-backdrop-filter:blur(16px) saturate(1.2);border:1px solid color-mix(in srgb,var(--surface) 70%,var(--line));box-shadow:0 22px 40px -22px color-mix(in srgb,var(--ink) 50%,transparent);touch-action:pan-y;cursor:grab;transform-style:preserve-3d}
.fx-gp__light{position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:radial-gradient(180px circle at var(--lx) var(--ly),color-mix(in srgb,var(--surface) 55%,transparent),transparent 70%);opacity:.7}
.fx-gp__cover{position:relative;grid-row:1/3;width:76px;height:76px;border:0;padding:0;border-radius:16px;cursor:pointer;background:transparent}
.fx-gp__img{display:block;width:100%;height:100%;border-radius:16px;background-size:cover!important;box-shadow:0 8px 18px -8px color-mix(in srgb,var(--ink) 50%,transparent)}
.fx-gp__drops{position:absolute;left:0;right:0;bottom:-4px;height:0;pointer-events:none}
.fx-gp__drops i{position:absolute;bottom:0;width:7px;height:9px;border-radius:50% 50% 50% 50%/60% 60% 40% 40%;background:var(--c1)}
.fx-gp__meta{display:flex;flex-direction:column;justify-content:center;min-width:0;cursor:pointer}
.fx-gp__title{font:400 19px/1.2 var(--serif);color:var(--ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-gp__sub{font:400 13px var(--sans);color:var(--muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fx-gp__bar{grid-column:2;height:5px;border-radius:5px;background:color-mix(in srgb,var(--ink) 12%,transparent);position:relative;margin-top:4px}
.fx-gp__fill{position:absolute;left:0;top:0;bottom:0;border-radius:5px;background:linear-gradient(90deg,var(--c1),var(--c2));width:4%}
.fx-gp__fill i{position:absolute;right:-3px;top:-4px;width:20px;height:13px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--surface) 95%,transparent),transparent);filter:blur(1px)}
.fx-gp__row{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;font:500 12px var(--sans);color:var(--muted)}
.fx-gp__btns{display:flex;gap:6px}
.fx-gp__btns button{width:38px;height:38px;border-radius:50%;border:0;background:color-mix(in srgb,var(--surface) 70%,transparent);color:var(--ink);cursor:pointer;display:grid;place-items:center;padding:0;font-size:15px;transition:background .15s,transform .15s}
.fx-gp__btns button:hover{background:var(--surface);transform:scale(1.06)}
.fx-gp__left::before{content:"/ "}

/* ---------- 11) Stella ---------- */
@keyframes fx-float{0%,100%{transform:translateY(0) rotate(-4deg)}50%{transform:translateY(-8px) rotate(4deg)}}