
:root{
  --bg:#f7f9fc; --text:#0b1220; --muted:#4b5563; --card:#fff;
  --primary:#2563eb; --ok:#10b981; --bad:#ef4444; --border:#e5e7eb;
}
*{box-sizing:border-box} html,body{margin:0}
body{background:var(--bg);color:var(--text);font:16px/1.6 system-ui,Segoe UI,Roboto,Arial}
.container{max-width:min(1080px,92vw);margin:0 auto;padding:0 16px}
.site-header{display:flex;justify-content:space-between;align-items:center;padding:18px 0;border-bottom:1px solid var(--border);background:#fff;position:sticky;top:0;z-index:5}
.brand h1{margin:0;font-size:clamp(20px,3vw,32px)} .brand .sub{margin:4px 0 0;color:#334155}
.logos{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.logos img{width:42px;height:42px;object-fit:contain;border:1px solid var(--border);border-radius:10px;background:#fff;padding:6px}
.btn{border:1px solid var(--border);border-radius:12px;padding:10px 14px;background:#fff;cursor:pointer}
.btn.primary{background:var(--primary);color:#fff;border-color:var(--primary)}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:18px;margin:16px 0}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:900px){ .grid{grid-template-columns:1fr} }
label{font-weight:700;display:block;margin:6px 0} input{width:100%;padding:12px 14px;border:1px solid var(--border);border-radius:10px}
.actions{margin-top:10px} .muted{color:var(--muted)}
.meta{display:grid;grid-template-columns:1fr 1fr;gap:8px 12px;margin-top:8px}
.emoji-fx{min-height:24px;margin-top:6px}
.foot{text-align:center;color:#6b7280;padding:28px 0 48px}
.accepted{border-left:5px solid var(--ok)} .rejected{border-left:5px solid var(--bad)}

.emoji-fx.small span{font-size:14px}
.egg h3{margin:0 0 6px}

/* Smooth emoji rendering */
.emoji-fx span{filter: drop-shadow(0 1px 0 rgba(0,0,0,.04));}

/* Overlay styles reserved (most inline to ensure compatibility) */
#emojiOverlay span{filter: drop-shadow(0 1px 0 rgba(0,0,0,.06));}

/* Pastel gradient states */
.card.accepted{
  background:
    linear-gradient(180deg, rgba(16,185,129,.18) 0%, rgba(16,185,129,.08) 100%),
    var(--card);
  border-left-color: var(--ok);
}
.card.rejected{
  background:
    linear-gradient(180deg, rgba(239,68,68,.18) 0%, rgba(239,68,68,.08) 100%),
    var(--card);
  border-left-color: var(--bad);
}
