/* Quick peek drawer */

/* ═══ QUICK PEEK DRAWER ═══ */
.qp-backdrop{
  position:fixed;inset:0;z-index:90;
  background:rgba(0,0,0,.55);backdrop-filter:blur(6px);
  opacity:0;pointer-events:none;
  transition:opacity .22s ease-out;
}
.qp-backdrop.open{opacity:1;pointer-events:auto}

.qp-drawer{
  position:fixed;top:0;right:0;bottom:0;
  width:min(520px, 92vw);z-index:91;
  background:var(--bg);border-left:1px solid var(--line);
  display:flex;flex-direction:column;
  transform:translateX(100%);transition:transform .28s cubic-bezier(.22,.9,.3,1);
  box-shadow:-16px 0 40px -10px rgba(0,0,0,.6);
}
.qp-drawer.open{transform:translateX(0)}

.qp-header{
  display:flex;justify-content:space-between;align-items:center;
  padding:18px 22px;border-bottom:1px solid var(--line);
  background:var(--surface);flex-shrink:0;
}
.qp-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-dim);font-weight:600;
}
.qp-eyebrow svg{width:14px;height:14px;color:var(--accent)}
.qp-close{
  width:32px;height:32px;border-radius:50%;
  background:transparent;border:1px solid var(--line);color:var(--ink-soft);
  display:grid;place-items:center;cursor:pointer;
  transition:background .15s, color .15s, border-color .15s;
}
.qp-close:hover{background:var(--bg-2);color:var(--ink);border-color:var(--line-strong)}
.qp-close svg{width:14px;height:14px}

.qp-body{
  flex:1;overflow-y:auto;
  scrollbar-width:thin;scrollbar-color:var(--line-strong) transparent;
}
.qp-body::-webkit-scrollbar{width:6px}
.qp-body::-webkit-scrollbar-thumb{background:var(--line);border-radius:3px}

.qp-hero{
  aspect-ratio:16/10;background-size:cover;background-position:center;
  position:relative;border-bottom:1px solid var(--line);
}
.qp-hero-badge{
  position:absolute;top:14px;left:14px;
  padding:5px 10px;border-radius:4px;
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.18em;font-weight:700;
  background:rgba(0,0,0,.6);color:#fff;backdrop-filter:blur(8px);
  text-transform:uppercase;
}

.qp-content{padding:22px}
.qp-cat{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--ink-dim);margin-bottom:8px;
}
.qp-cat span{color:var(--line-strong);margin:0 6px}
.qp-title{
  font-family:"Fraunces",serif;font-weight:400;font-size:26px;letter-spacing:-0.015em;
  line-height:1.2;margin:0 0 14px;color:var(--ink);
}
.qp-short{
  font-size:14.5px;line-height:1.6;color:var(--ink-soft);
  margin:0 0 18px;
}

.qp-meta-row{
  display:flex;gap:16px;flex-wrap:wrap;padding:14px 0;
  border-top:1px dashed var(--line);border-bottom:1px dashed var(--line);
  font-family:"JetBrains Mono",monospace;font-size:11.5px;color:var(--ink-soft);margin-bottom:18px;
}
.qp-meta-row .qp-m-item{display:flex;align-items:center;gap:6px}
.qp-meta-row .qp-m-item svg{width:13px;height:13px;color:var(--ink-dim);flex-shrink:0}
.qp-meta-row .qp-m-item b{color:var(--ink);font-weight:600}
.qp-meta-row .qp-m-author{cursor:pointer;transition:color .12s}
.qp-meta-row .qp-m-author:hover{color:var(--accent)}

.qp-gallery{
  display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:20px;
}
.qp-gallery-item{
  aspect-ratio:1;background-size:cover;background-position:center;
  border-radius:6px;border:1px solid var(--line);
  transition:transform .15s, border-color .15s;cursor:pointer;
}
.qp-gallery-item:hover{transform:scale(1.03);border-color:var(--accent)}

.qp-tags{
  display:flex;flex-wrap:wrap;gap:6px;margin-bottom:22px;
}
.qp-tag{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;
  padding:5px 10px;border-radius:4px;
  background:var(--surface);border:1px solid var(--line);color:var(--ink-soft);
  cursor:pointer;transition:all .12s;
}
.qp-tag:hover{background:var(--bg-2);border-color:var(--line-strong);color:var(--ink)}

.qp-actions{
  display:flex;gap:10px;flex-wrap:wrap;
}
.qp-actions .btn{flex:1;min-width:120px;justify-content:center;padding:12px 18px}

/* Mobile — bottom sheet */
@media (max-width:700px){
  .qp-drawer{
    top:auto;left:0;right:0;width:100%;bottom:0;
    max-height:85vh;
    border-left:0;border-top:1px solid var(--line);border-radius:16px 16px 0 0;
    transform:translateY(100%);
  }
  .qp-drawer.open{transform:translateY(0)}
  .qp-drawer::before{
    content:'';position:absolute;top:8px;left:50%;transform:translateX(-50%);
    width:40px;height:4px;border-radius:2px;background:var(--line-strong);
  }
  .qp-header{padding-top:22px}
}

/* Card top-right action buttons (quick peek + favorite) */
.card .card-actions{
  position:absolute;right:10px;top:10px;z-index:3;
  display:flex;gap:6px;
}

/* Shared action button style */
.card .card-action-btn{
  width:28px;height:28px;border-radius:50%;
  background:rgba(11,11,10,.7);backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.12);color:var(--ink-soft);
  display:grid;place-items:center;cursor:pointer;
  transition:background .15s, border-color .15s, color .15s, transform .15s;
  padding:0;
}
.card .card-action-btn:hover{background:rgba(11,11,10,.9);border-color:rgba(255,255,255,.25);color:var(--ink)}
.card .card-action-btn svg{width:14px;height:14px;transition:transform .2s, fill .2s}

/* Quick peek button — subtle initially, pops on hover */
.card .quick-peek-btn{opacity:.7}
.card:hover .quick-peek-btn{opacity:1}
.card .quick-peek-btn:hover{background:var(--accent);color:#0b0b0a;border-color:var(--accent)}

.card .fav-toggle{
  position:static;  /* inside .card-actions wrapper now */
  width:28px;height:28px;border-radius:50%;
  background:rgba(11,11,10,.7);backdrop-filter:blur(6px);
  border:1px solid rgba(255,255,255,.12);color:var(--ink-soft);
  display:grid;place-items:center;cursor:pointer;
  transition:background .15s, border-color .15s, color .15s, transform .15s;
  padding:0;
}
.card .fav-toggle:hover{background:rgba(11,11,10,.9);border-color:rgba(255,255,255,.25);color:var(--ink)}
.card .fav-toggle svg{width:14px;height:14px;transition:transform .2s, fill .2s}
.card .fav-toggle.active{
  background:rgba(255,92,41,.15);border-color:var(--accent-2);color:var(--accent-2);
}
.card .fav-toggle.active svg{fill:var(--accent-2);stroke:var(--accent-2)}
.card .fav-toggle.pop svg{animation:fav-pop .35s cubic-bezier(.5,1.5,.5,1)}
@keyframes fav-pop{
  0%{transform:scale(1)}
  50%{transform:scale(1.4)}
  100%{transform:scale(1)}
}

.card .bottom{
  padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1;
  min-width:0;  /* allow child ellipsis */
}
.card .cat{
  font-family:"JetBrains Mono",monospace;font-size:10.5px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink-dim);display:flex;align-items:center;gap:8px;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}
.card .cat span{color:var(--accent)}
.card h3{
  font-family:"Fraunces",serif;font-weight:500;font-size:17px;line-height:1.25;letter-spacing:-0.01em;margin:0;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;text-overflow:ellipsis;
  min-height:calc(17px * 1.25 * 2); /* reserve 2 lines always */
  min-width:0;word-break:break-word;overflow-wrap:anywhere;
}

/* Short description (teaser) */
.card .short{
  margin:0;font-size:12.5px;line-height:1.45;color:var(--ink-dim);
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;
  overflow:hidden;text-overflow:ellipsis;
}
.grid.view-titles .card .short{display:none}

/* Card tags (clickable filter chips) */
.card-tags{
  display:flex;flex-wrap:wrap;gap:5px;margin-top:2px;
}
.card-tag{
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.02em;font-weight:500;
  padding:3px 8px;border-radius:999px;
  background:rgba(212,255,62,.08);color:var(--accent);
  border:1px solid rgba(212,255,62,.25);
  cursor:pointer;text-transform:lowercase;font-family:inherit;
  transition:background .12s, border-color .12s, color .12s, transform .1s;
}
.card-tag:hover{
  background:var(--accent);color:#0b0b0a;border-color:var(--accent);
  transform:translateY(-1px);
}
.card-tag:active{transform:translateY(0)}
.grid.view-titles .card-tags{display:none}

/* Post meta line (date · author · size · filetype) */
.card .post-meta-line{
  margin-top:auto;padding-top:10px;border-top:1px dashed var(--line);
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  font-family:"JetBrains Mono",monospace;font-size:11px;color:var(--ink-dim);
  min-width:0;
}
.card .post-meta-line .pm-date{
  font-size:10.5px;letter-spacing:.02em;
  color:var(--ink-dim);flex-shrink:0;white-space:nowrap;
}
.card .post-meta-line .pm-author{
  color:var(--ink-soft);font-weight:500;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;
  font-family:inherit;text-align:center;
}
.card .post-meta-line .pm-author:hover{color:var(--accent);cursor:pointer}
.card .post-meta-line .pm-size{
  font-size:10.5px;
  color:var(--ink-dim);flex-shrink:0;white-space:nowrap;
}
.card .post-meta-line .pm-sep{display:none}

/* File type badge (green "F" / blue "F") */
.card .post-meta-line .pm-ftype{
  display:inline-grid;place-items:center;
  width:22px;height:22px;flex-shrink:0;border-radius:5px;
  line-height:1;
}
.card .post-meta-line .pm-ftype svg{width:22px;height:22px;display:block}
/* Fixed colors regardless of parent text color */
.pm-ftype{display:inline-grid;place-items:center;line-height:1;flex-shrink:0}
.pm-ftype svg{display:block}
.pm-ftype.ftype-green{color:#22c55e !important}
.pm-ftype.ftype-blue{color:#3b82f6 !important}

/* Detail-page admin card — stick to slider + admin-only actions */
.ds-admin-card{
  background:linear-gradient(135deg, rgba(212,255,62,.04), rgba(212,255,62,.01));
  border:1px solid rgba(212,255,62,.25);
}
.ds-admin-card .ds-card-title{
  color:var(--accent);display:flex;align-items:center;
}
.ds-stick-toggle{
  display:flex;align-items:center;gap:12px;
  padding:10px 12px;border-radius:8px;
  background:var(--bg-2);border:1px solid var(--line);
  cursor:pointer;transition:background .12s, border-color .12s;
}
.ds-stick-toggle:hover{border-color:var(--line-strong)}
.ds-stick-toggle.on{
  background:rgba(212,255,62,.08);border-color:rgba(212,255,62,.35);
}
.ds-stick-label{flex:1;min-width:0}
.ds-stick-label b{display:block;color:var(--ink);font-weight:600;font-size:12.5px;margin-bottom:2px}
.ds-stick-label span{font-size:11px;color:var(--ink-dim);line-height:1.4}
.ds-stick-counter{
  margin-top:8px;font-family:"JetBrains Mono",monospace;font-size:10.5px;
  color:var(--ink-dim);letter-spacing:.08em;text-align:center;
}
.ds-stick-counter b{color:var(--accent)}
.ds-stick-counter.full{color:#ff8c65}
.ds-stick-counter.full b{color:#ff8c65}

.ds-admin-actions{
  margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);
  display:flex;flex-direction:column;gap:4px;
}
.ds-action.danger{color:#ff8888}
.ds-action.danger:hover{border-color:rgba(255,60,60,.4);background:rgba(255,60,60,.06);color:#ff6666}
.ds-action.danger svg{color:inherit}

/* Sidebar widget toggles in detail admin card */
.ds-widget-toggles{
  margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);
  display:flex;flex-direction:column;gap:6px;
}
.ds-widget-section-label{
  font-family:"JetBrains Mono",monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;
  color:var(--ink-soft);font-weight:600;margin-bottom:4px;
}
.ds-widget-toggle{
  display:flex;align-items:center;gap:10px;
  padding:8px 10px;border-radius:7px;
  background:var(--bg-2);border:1px solid var(--line);
  cursor:pointer;transition:background .12s, border-color .12s;
}
.ds-widget-toggle:hover{border-color:var(--line-strong)}
.ds-widget-toggle.on{background:rgba(212,255,62,.08);border-color:rgba(212,255,62,.3)}
.ds-widget-label{flex:1;font-size:12.5px;color:var(--ink);font-weight:500}


