:root{
  --accent:#f6a623;
  --muted:#666;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  background:#ffffff;
  color:#222;
}
.container{max-width:980px;margin:0 auto;padding:24px}
.site-header{border-bottom:1px solid #eee}
.site-title{margin:18px 0;font-weight:600;text-align:center}
.lead{color:var(--muted);margin:12px 0 24px}
.cards{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.card{background:#fff;border:1px solid #eee;box-shadow:0 2px 6px rgba(0,0,0,0.03);border-left:6px solid var(--accent);overflow:hidden}
.card-toggle{width:100%;display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:20px;background:transparent;border:0;cursor:pointer;font-size:20px;text-align:left}
.card-toggle:focus{outline:2px solid #ddd}
.card-head{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.card-tease{font-size:13px;font-weight:500;color:var(--muted);line-height:1.4;max-width:42em}
.card-content{padding:0 20px 20px;color:var(--muted)}
.card-content p{margin:0 0 10px;line-height:1.5}
.chev{fill:var(--muted);transform:rotate(0);transition:transform .2s;flex-shrink:0;margin-top:6px}
.card-toggle[aria-expanded="true"] .chev{transform:rotate(180deg)}
@media (max-width:720px){.cards{grid-template-columns:1fr}}

/* Suggestions floating button and modal */
.sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;border:0!important}
.suggest-btn{position:fixed;right:20px;bottom:20px;width:56px;height:56px;border-radius:50%;background:var(--accent);color:#fff;border:0;box-shadow:0 6px 18px rgba(0,0,0,0.18);display:flex;align-items:center;justify-content:center;font-size:24px;cursor:pointer;z-index:1200}
.suggest-btn .emoji{line-height:1}
.suggest-badge{position:absolute;top:-6px;right:-6px;background:#222;color:#fff;border-radius:999px;padding:2px 6px;font-size:12px}
.suggest-overlay{position:fixed;inset:0;background:rgba(0,0,0,0.45);align-items:flex-end;justify-content:center;padding:24px;z-index:1190}
.suggest-overlay[hidden]{display:none}
.suggest-overlay:not([hidden]){display:flex}
.suggest-modal{background:#fff;width:100%;max-width:420px;border-radius:8px;padding:18px;box-shadow:0 10px 40px rgba(0,0,0,0.25);position:relative}
.suggest-modal h3{margin:0 0 8px}
.close-btn{position:absolute;right:8px;top:8px;border:0;background:transparent;font-size:22px;cursor:pointer}
#suggestText{width:100%;padding:10px;border:1px solid #e6e6e6;border-radius:6px;font-size:14px;font-family:inherit}
.actions{display:flex;gap:8px;justify-content:flex-end;margin-top:12px}
.btn{background:var(--accent);color:#fff;padding:8px 12px;border-radius:6px;border:0;cursor:pointer}
.btn.secondary{background:#f3f3f3;color:#222}
.suggest-msg{margin-top:10px;color:var(--muted);font-size:13px}
