:root{
  --rf-rose:#a14b68;
  --rf-rose-600:#8f425c;
  --rf-rose-700:#7a3b5a;

  --rf-text:#1f1a1d;
  --rf-muted:rgba(31,26,29,.72);

  --rf-bg:#ffffff;
  --rf-soft:#fff6f9;
  --rf-soft-2:#fff0f6;

  --rf-r:18px;
  --rf-r-sm:14px;

  --rf-shadow: 0 10px 34px rgba(31,26,29,.10);
  --rf-shadow-soft: 0 10px 30px rgba(31,26,29,.08);
}

/* Root */
.rfgt{
  max-width:1100px;
  margin:0 auto;
  padding:clamp(12px,2.2vw,22px);
  font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial;
  color:var(--rf-text);
}
.rfgt *{ box-sizing:border-box; }

.rfgt h1{
  font-size:clamp(1.65rem,2.2vw + 1rem,2.35rem);
  line-height:1.15;
  margin:10px 0 8px;
  letter-spacing:.2px;
}
.rfgt h2{
  font-size:clamp(1.15rem,1.2vw + .95rem,1.55rem);
  margin:0;
  line-height:1.2;
}
.rfgt p{ margin:.55em 0; color:var(--rf-muted); }
.rfgt strong{ color:var(--rf-text); }

/* “Cards” flat (pas de bordure), juste fond + arrondi + ombre très légère */
.rfgt-card{
  background:var(--rf-bg);
  border-radius:var(--rf-r);
  padding:18px;
}

/* HERO */
.rfgt-hero{
display: flex;
width:80%;
    margin: 10px 0 14px;
    align-content: stretch;
    justify-content: center;

}

.rfgt-hero-left{
  background:var(--rf-bg);
  border-radius:var(--rf-r);
  padding:18px;
}

.rfgt-brand{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:8px 12px;
  border-radius:999px;
  background:var(--rf-soft);
  color:var(--rf-rose);
  font-weight:900;
  letter-spacing:.2px;
}
.rfgt-heart{ font-size:18px; line-height:1; }
.rfgt-title{ margin-top:10px; }

.rfgt-lead{
  margin-top:8px;
  color:rgba(31,26,29,.78);
  font-size:1rem;
}

.rfgt-hero-links{
  display:flex;
  align-items:center;
  gap:10px;
  margin-top:10px;
}
.rfgt-link{
  appearance:none;
  border:none;
  background:transparent;
  padding:0;
  color:var(--rf-rose);
  font-weight:900;
  cursor:pointer;
  text-decoration:underline;
  text-underline-offset:3px;
}
.rfgt-link:hover{ color:var(--rf-rose-600); }
.rfgt-link-sub{
  color:rgba(31,26,29,.60);
  font-size:.95rem;
}

/* Rosy */
.rfgt-rosy{
  display:flex;
  align-items:flex-start;
  gap:12px;
  margin-top:12px;
  padding-top:12px;
  border-top:1px solid rgba(31,26,29,.06);
}
.rfgt-rosy-avatar{
  width:42px;
  height:42px;
  border-radius:999px;
  overflow:hidden;
  flex:0 0 42px;
  background:var(--rf-soft);
}
.rfgt-rosy-sprite{
  width:42px;
  height:42px;
  display:block;
  background-image:var(--rfgt-rosy-url);
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
}
.rfgt-rosy-bubble{
  flex:1 1 auto;
  background:var(--rf-soft);
  border-radius:var(--rf-r);
  padding:12px 14px;
}
.rfgt-rosy-name{
  font-weight:900;
  color:var(--rf-rose);
  margin-bottom:2px;
  font-size:.95rem;
}
.rfgt-rosy-bubble p{ margin:0; color:rgba(31,26,29,.78); }

/* Hero right (petit chip, pas de grand bloc) */
.rfgt-hero-right{
  background:linear-gradient(180deg, var(--rf-soft), var(--rf-soft-2));
  border-radius:var(--rf-r);
  padding:18px;
  display:flex;
  align-items:flex-start;
  justify-content:flex-start;
}
.rfgt-hero-chip{
  background:#fff;
  border-radius:999px;
  padding:10px 12px;
  display:flex;
  gap:10px;
  align-items:center;
}
.rfgt-hero-chip-k{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:56px;
  height:28px;
  border-radius:999px;
  background:var(--rf-soft);
  color:var(--rf-rose);
  font-weight:900;
  font-size:.85rem;
}
.rfgt-hero-chip-v{
  color:rgba(31,26,29,.78);
  font-weight:700;
  font-size:.95rem;
}

/* Finder header */
.rfgt-card-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:12px;
  margin-bottom:12px;
}
@media (max-width: 720px){
  .rfgt-card-head{ flex-direction:column; align-items:flex-start; }
}
.rfgt-card-sub{
  color:rgba(31,26,29,.65);
  font-size:.95rem;
}

/* Form grid */
.rfgt-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:12px;
  margin-top:12px;
  align-items:start;
}
.rfgt-col{ grid-column:span 12; }
@media (min-width: 720px){
  .rfgt-col{ grid-column:span 4; }
  .rfgt-quick{ grid-column:span 8; }
  .rfgt-dyn{ grid-column:span 12; }
}

.rfgt-quick-title{
  font-weight:900;
  font-size:.95rem;
  margin-bottom:6px;
}
.rfgt-quick-row{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
}

/* Inputs */
.rfgt-form label{
  font-weight:900;
  font-size:.95rem;
  margin-bottom:6px;
  display:block;
}
.rfgt-form select,
.rfgt-form input[type="number"]{
  width:100%;
  padding:12px 12px;
  border-radius:14px;
  border:none;
  background:var(--rf-soft);
  color:var(--rf-text);
  box-shadow: inset 0 0 0 1px rgba(31,26,29,.06);
}
.rfgt-form select:focus-visible,
.rfgt-form input[type="number"]:focus-visible{
  outline:2px solid rgba(161,75,104,.35);
  outline-offset:2px;
}

/* Dynamic zone */
.rfgt-dyn{
  background:rgba(255,255,255,.55);
  border-radius:var(--rf-r);
  padding:12px;
  box-shadow: inset 0 0 0 1px rgba(31,26,29,.06);
}
.rfgt-dyn:empty{ display:none; }

.rfgt-dyn-grid{
  display:grid;
  grid-template-columns:repeat(12,1fr);
  gap:12px;
}
.rfgt-dyn-col{ grid-column:span 12; }
@media (min-width:720px){
  .rfgt-dyn-col{ grid-column:span 6; }
}
.rfgt-dyn-note{
  grid-column:span 12;
  font-size:.92rem;
  color:rgba(31,26,29,.68);
}

/* Buttons */
.rfgt-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:12px;
}
.rfgt-btn{
  appearance:none;
  border:none;
  cursor:pointer;
  font-weight:900;
  letter-spacing:.2px;
  padding:11px 14px;
  border-radius:999px;
  background:var(--rf-rose);
  color:#fff;
  transition: background .15s ease, transform .05s ease;
}
.rfgt-btn:hover{ background:var(--rf-rose-600); }
.rfgt-btn:active{ transform: translateY(1px); }

.rfgt-btn-ghost{
  background:#fff;
  color:var(--rf-rose);
  box-shadow: inset 0 0 0 1px rgba(161,75,104,.20);
}
.rfgt-btn-ghost:hover{ background:var(--rf-soft); }

/* Alert */
.rfgt-alert{
  margin-top:12px;
  background:#fff;
  border-radius:var(--rf-r);
  padding:12px 14px;
  box-shadow: inset 0 0 0 1px rgba(225,29,72,.20);
}
.rfgt-alert[hidden]{ display:none; }
.rfgt-alert-head{
  display:flex;
  align-items:center;
  gap:8px;
  margin-bottom:6px;
}
.rfgt-alert-dot{
  width:10px;
  height:10px;
  border-radius:999px;
  background:#e11d48;
  opacity:.65;
}
.rfgt-alert-text{
  color:rgba(31,26,29,.78);
}

/* Result */
.rfgt-result{
  display:block;
  margin-top:12px;
  background:var(--rf-soft);
  border-radius:var(--rf-r);
  padding:12px 14px;
}
.rfgt-result:empty{ display:none; }
.rfgt-result strong{ color:var(--rf-rose); }
.rfgt-note{
  font-size:.92rem;
  color:rgba(31,26,29,.70);
  margin:.55em 0 0;
}

/* Tabs */
.rfgt-tabs{ margin-top:18px; }

.rfgt-tablist{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  align-items:center;
  margin:12px 0 10px;
}
@media (max-width: 720px){
  .rfgt-tablist{
    flex-wrap:nowrap;
    overflow-x:auto;
    padding-bottom:8px;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:thin;
    scrollbar-color: rgba(161,75,104,.35) transparent;
  }
  .rfgt-tablist::-webkit-scrollbar{ height:6px; }
  .rfgt-tablist::-webkit-scrollbar-thumb{
    background: rgba(161,75,104,.35);
    border-radius:99px;
  }
}
.rfgt-tab{
  appearance:none;
  border:none;
  background:var(--rf-soft);
  color:rgba(31,26,29,.86);
  padding:10px 12px;
  border-radius:999px;
  cursor:pointer;
  font-weight:900;
  white-space:nowrap;
}
.rfgt-tab[aria-selected="true"]{
  background:var(--rf-rose);
  color:#fff;
}

.rfgt-panels{ margin-top:10px; }
.rfgt-panel{ display:none; }
.rfgt-panel[aria-hidden="false"]{ display:block; }

/* Tables (flat, pas de bordure forte) */
.rfgt-table-wrap{
  overflow:auto;
  border-radius:var(--rf-r);
  background:#fff;
  box-shadow: inset 0 0 0 1px rgba(31,26,29,.06);
}
table.rfgt-table{
  width:100%;
  min-width:520px;
  border-collapse:collapse;
}
.rfgt-table thead th{
  text-align:left;
  padding:10px 12px;
  font-weight:900;
  background:#fff;
  color:rgba(31,26,29,.85);
  border-bottom:1px solid rgba(31,26,29,.06);
}
.rfgt-table tbody td{
  padding:10px 12px;
  color:rgba(31,26,29,.82);
  border-bottom:1px solid rgba(31,26,29,.05);
}
.rfgt-table .cn{ font-weight:900; color:var(--rf-rose); }

.rfgt-hint{
  margin-top:10px;
  color:rgba(31,26,29,.72);
  font-size:.95rem;
}

/* Footer */
.rfgt-footer{ margin-top:14px; }
.rfgt-footer-note{
  background:var(--rf-soft);
  border-radius:var(--rf-r);
  padding:12px 14px;
  color:rgba(31,26,29,.78);
  box-shadow: inset 0 0 0 1px rgba(31,26,29,.06);
}
.rfgt-footer-note strong{ color:var(--rf-text); }

/* =========================
   MODAL (popup)
   ========================= */
.rfgt-modal[hidden]{ display:none; }

.rfgt-modal{
  position:fixed;
  inset:0;
  z-index:999999;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
}

.rfgt-modal-backdrop{
  position:absolute;
  inset:0;
  background: rgba(31,26,29,.55);
}

.rfgt-modal-panel{
  position:relative;
  width:min(860px, 100%);
  max-height: min(84vh, 860px);
  overflow:auto;
  border-radius: 22px;
  background:#fff;
}

.rfgt-modal-head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  padding:16px 18px 10px;
  background: linear-gradient(180deg, var(--rf-soft), #fff);
}
.rfgt-modal-kicker{
  display:inline-block;
  font-weight:900;
  color:var(--rf-rose);
  font-size:.85rem;
  margin-bottom:4px;
}
.rfgt-modal-title{
  font-weight:900;
  font-size:1.2rem;
}
.rfgt-modal-sub{
  color:rgba(31,26,29,.65);
  font-size:.95rem;
  margin-top:2px;
}
.rfgt-modal-x{
  appearance:none;
  border:none;
  background:transparent;
  cursor:pointer;
  font-size:26px;
  line-height:1;
  padding:6px 10px;
  color:rgba(31,26,29,.60);
}
.rfgt-modal-x:hover{ color:rgba(31,26,29,.90); }

.rfgt-modal-body{
  padding:14px 18px 4px;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap:14px;
  align-items:start;
}
@media (max-width: 820px){
  .rfgt-modal-body{ grid-template-columns: 1fr; }
}
.rfgt-diagram{
  width:100%;
  height:auto;
  display:block;
  max-width:520px;
  margin:0 auto;
}
.rfgt-modal-points{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:10px;
}
.rfgt-modal-points li{
  background: var(--rf-soft);
  border-radius: 16px;
  padding: 10px 12px;
}
.rfgt-modal-points b{
  display:block;
  color:var(--rf-text);
  margin-bottom:2px;
}
.rfgt-modal-points span{
  display:block;
  color:rgba(31,26,29,.72);
  line-height:1.35;
}

.rfgt-modal-foot{
  padding:12px 18px 16px;
  display:flex;
  justify-content:flex-end;
  gap:10px;
}