.tr-frontend{
    font-family:Arial,Helvetica,sans-serif;
    max-width:760px;
    margin:0 auto;
}

.tr-addbar{
  background:transparent;
  padding:18px 0;
  text-align:center;
}

.tr-add-btn{
  display:inline-flex !important;
  align-items:center !important;
  gap:10px !important;
  background:linear-gradient(135deg,#6fa6d9,#4f89c8) !important;
  color:#fff !important;
  border:0 !important;
  padding:12px 28px !important;
  font-size:18px !important;
  font-weight:600 !important;
  border-radius:6px !important;
  cursor:pointer !important;
  box-shadow:0 6px 18px rgba(79,137,200,.35) !important;
  transition:all .25s ease !important;
}

.tr-add-btn::before{
  content:"✎" !important;
  font-size:18px !important;
}

.tr-add-btn:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 10px 25px rgba(79,137,200,.45) !important;
  background:linear-gradient(135deg,#5f97cf,#3f78b6) !important;
}

.tr-add-btn:active{
  transform:translateY(0) !important;
  box-shadow:0 5px 14px rgba(79,137,200,.35) !important;
}

.tr-review{border:1px solid #dadada;background:#efefef;padding:8px 10px;margin:0 0 12px}
.tr-stars{color:#f3b400;font-size:14px;letter-spacing:1px;margin-bottom:4px}
.tr-text{
    color:#333;
    font-size:17px;
    line-height:1.45;
    font-family: 'Montserrat';
}
.tr-meta{display:flex;justify-content:space-between;font-size:10px;color:#8a8a8a;margin-top:6px}
.tr-pagination{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0 0}
.tr-page{border:1px solid #d7d7d7;background:#fff;color:#333;text-decoration:none;padding:3px 8px;font-size:11px}
.tr-page.active{background:#6f9fcd;color:#fff;border-color:#5b8dbd}

/* Modal */
.tr-modal{position:fixed;inset:0;display:none;z-index:99999}
.tr-modal.open{display:block}
.tr-modal-overlay{position:absolute;inset:0;background:rgba(0,0,0,.55)}
.tr-modal-box{position:relative;width:min(900px,96vw);margin:3vh auto;background:#fff;box-shadow:0 10px 35px rgba(0,0,0,.35);padding:18px;border:1px solid #dcdcdc}
.tr-x{position:absolute;right:10px;top:6px;border:0;background:transparent;font-size:26px;cursor:pointer;color:#666}

.tr-modal-head{display:flex;gap:12px;align-items:flex-start;margin-bottom:10px}
.tr-head-icon{font-size:30px;color:#1d9b45;line-height:1;margin-top:2px}
.tr-modal-head h3{margin:0;color:#1d9b45;font-size:26px;font-weight:700}
.tr-modal-head p{margin:6px 0 0;color:#777;font-size:13px}

.tr-note{background:#fbe6e6;border:1px solid #f2bcbc;color:#c23a3a;padding:10px;font-size:12px;margin-bottom:14px}

.tr-form label{display:block;font-weight:700;font-size:12px;color:#222;margin-bottom:6px}
.tr-form input,.tr-form select,.tr-form textarea{width:100%;border:1px solid #d7d7d7;padding:8px;border-radius:2px;font-size:13px}
.tr-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:14px}

.tr-submit{width:100%;background:#148a38;color:#fff;border:0;padding:10px;font-weight:700;cursor:pointer;margin-top:8px}
.tr-submit:hover{filter:brightness(.95)}

.tr-checks{margin-top:12px;background:#e7f1fb;border:1px solid #cfe3f7;padding:10px;font-size:12px}
.tr-checks label{display:block;margin:6px 0;font-weight:400}
.tr-checks input{margin-right:6px}

.tr-msg{margin-top:10px;font-size:13px}
.tr-msg.ok{color:#148a38}
.tr-msg.err{color:#c23a3a}

@media(max-width:760px){.tr-grid-2{grid-template-columns:1fr}}