
/* ============================================================
   NOTRE REFUGE — V74 NATIVE IDENTITY / SYNC
   ============================================================ */

.manage71-tabs{
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
}

.refuge74-panel{
  padding-bottom:30px;
}
.refuge74-panel-intro>span{
  background:linear-gradient(135deg,#9e718c,#756790)!important;
}
.refuge74-grid{
  display:grid;
  gap:10px;
}
.refuge74-card{
  padding:15px;
  border:1px solid rgba(82,55,69,.10);
  border-radius:20px;
  background:rgba(255,250,247,.92);
  box-shadow:0 10px 26px rgba(63,40,52,.045);
}
.refuge74-card>header{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.refuge74-card>header small{
  display:block;
  color:#9d687d;
  font-size:.47rem;
  font-weight:900;
  letter-spacing:.13em;
}
.refuge74-card>header h3{
  margin:3px 0 0;
  color:#4d3944;
  font:500 1.35rem/1 Georgia,serif;
}
.refuge74-card-icon{
  width:38px;
  height:38px;
  display:grid;
  place-items:center;
  border-radius:13px;
  color:#9c647b;
  background:#f1e2e7;
}

.refuge74-identity-main{
  display:flex;
  align-items:center;
  gap:12px;
}
.refuge74-identity-main>span{
  width:54px;
  height:54px;
  display:grid;
  place-items:center;
  flex:none;
  border-radius:18px;
  color:#fff;
  background:linear-gradient(135deg,#ba748d,#81739c);
  font:700 1.2rem Georgia,serif;
  box-shadow:0 9px 22px rgba(108,73,94,.14);
}
.refuge74-identity-main small{
  display:block;
  color:#967584;
  font-size:.48rem;
  font-weight:850;
}
.refuge74-identity-main strong{
  display:block;
  margin-top:2px;
  color:#4c3943;
  font:500 1.28rem Georgia,serif;
}
.refuge74-identity-main em{
  display:block;
  margin-top:3px;
  color:#9c657b;
  font-size:.62rem;
  font-style:normal;
}
#refuge74-identity dl{
  display:grid;
  gap:6px;
  margin:14px 0 0;
}
#refuge74-identity dl>div{
  display:flex;
  justify-content:space-between;
  gap:12px;
  padding:8px 10px;
  border-radius:11px;
  background:#f7efec;
}
#refuge74-identity dt{
  color:#8e7782;
  font-size:.56rem;
}
#refuge74-identity dd{
  margin:0;
  color:#5a444f;
  font-size:.57rem;
  font-weight:800;
  text-align:right;
  overflow-wrap:anywhere;
}

.refuge74-sync-card>header b{
  padding:6px 8px;
  border-radius:999px;
  color:#8d6074;
  background:#f1e2e7;
  font-size:.43rem;
  letter-spacing:.08em;
}
.refuge74-sync-state{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:12px;
  border:1px solid rgba(82,55,69,.07);
  border-radius:15px;
  background:#fff;
}
#refuge74-sync-dot{
  width:10px;
  height:10px;
  flex:none;
  margin-top:4px;
  border-radius:50%;
  background:#ad92a1;
  box-shadow:0 0 0 5px rgba(173,146,161,.12);
}
#refuge74-sync-dot[data-state="ok"]{background:#799b85;box-shadow:0 0 0 5px rgba(121,155,133,.12)}
#refuge74-sync-dot[data-state="syncing"]{background:#b99861;box-shadow:0 0 0 5px rgba(185,152,97,.12);animation:refuge74pulse 1.1s ease-in-out infinite}
#refuge74-sync-dot[data-state="offline"]{background:#96848d}
#refuge74-sync-dot[data-state="error"]{background:#b76868;box-shadow:0 0 0 5px rgba(183,104,104,.12)}
.refuge74-sync-state strong{
  display:block;
  color:#513e48;
  font-size:.76rem;
}
.refuge74-sync-state p{
  margin:4px 0 0;
  color:#816b76;
  font-size:.60rem;
  line-height:1.5;
}
@keyframes refuge74pulse{50%{transform:scale(.72);opacity:.55}}

.refuge74-actions{
  display:flex;
  flex-wrap:wrap;
  gap:7px;
  margin-top:10px;
}
.refuge74-actions button,
#refuge74-refresh-devices{
  min-height:37px;
  padding:0 11px;
  border:1px solid rgba(82,55,69,.09);
  border-radius:12px;
  color:#6e5360;
  background:#fff;
  font-size:.56rem;
  font-weight:850;
}
.refuge74-actions button:first-child{
  color:#fff;
  border-color:transparent;
  background:linear-gradient(135deg,#b66f89,#81739c);
}
.refuge74-actions button:disabled{
  opacity:.45;
  cursor:not-allowed;
}

.refuge74-devices{
  display:grid;
  gap:7px;
}
.refuge74-device{
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  align-items:center;
  gap:9px;
  padding:10px;
  border:1px solid rgba(82,55,69,.07);
  border-radius:14px;
  background:#fff;
}
.refuge74-device>span{
  color:#a07488;
  font-size:.72rem;
}
.refuge74-device.is-current>span{color:#6d967b}
.refuge74-device strong{
  display:block;
  color:#513e48;
  font-size:.67rem;
}
.refuge74-device small{
  display:block;
  margin-top:2px;
  color:#937c87;
  font-size:.51rem;
}
.refuge74-device em{
  color:#947887;
  font-size:.49rem;
  font-style:normal;
  font-weight:800;
}
.refuge74-device button{
  min-height:30px;
  padding:0 8px;
  border:1px solid rgba(175,92,106,.16);
  border-radius:10px;
  color:#a25968;
  background:#fff7f7;
  font-size:.48rem;
  font-weight:850;
}
.refuge74-loading{
  padding:15px;
  border-radius:14px;
  color:#8c7580;
  background:#f7efec;
  font-size:.60rem;
  text-align:center;
}

.refuge74-invite-output{
  margin-top:10px;
  padding:13px;
  border:1px dashed rgba(173,103,132,.25);
  border-radius:15px;
  background:linear-gradient(145deg,#fff8f6,#f4e8ed);
  text-align:center;
}
.refuge74-invite-output small{
  display:block;
  color:#9b687d;
  font-size:.46rem;
  font-weight:900;
  letter-spacing:.12em;
}
.refuge74-invite-output strong{
  display:block;
  margin:8px 0 4px;
  color:#49353f;
  font:700 clamp(.72rem,3vw,1rem)/1.45 ui-monospace,SFMono-Regular,Consolas,monospace;
  overflow-wrap:anywhere;
  letter-spacing:.04em;
}
.refuge74-invite-output p{
  margin:0;
  color:#896f7b;
  font-size:.54rem;
}
.refuge74-invite-output button{
  min-height:34px;
  margin-top:9px;
  padding:0 11px;
  border:0;
  border-radius:11px;
  color:#fff;
  background:#8a708f;
  font-size:.54rem;
  font-weight:850;
}

.refuge74-privacy-list{
  display:grid;
  gap:7px;
}
.refuge74-privacy-list p{
  display:grid;
  grid-template-columns:28px minmax(0,1fr);
  grid-template-rows:auto auto;
  gap:1px 8px;
  margin:0;
  padding:9px;
  border-radius:13px;
  background:#f8f0ed;
}
.refuge74-privacy-list p>span{
  grid-row:1/3;
  width:28px;
  height:28px;
  display:grid;
  place-items:center;
  border-radius:9px;
  color:#7d8f7c;
  background:#eef4ed;
  font-size:.59rem;
}
.refuge74-privacy-list strong{
  color:#59444f;
  font-size:.62rem;
}
.refuge74-privacy-list small{
  color:#8a747f;
  font-size:.51rem;
  line-height:1.45;
}

.refuge74-empty{
  padding:18px;
  border-radius:15px;
  background:#f7efec;
  text-align:center;
}
.refuge74-empty>span{
  display:block;
  color:#ad738a;
  font-size:1.2rem;
}
.refuge74-empty strong,
.refuge74-empty small{
  display:block;
}
.refuge74-empty strong{margin-top:5px;color:#513e48}
.refuge74-empty small{margin-top:3px;color:#8c7580;font-size:.55rem}

/* First activation + relay dialog */
.refuge74-onboarding-open{
  overflow:hidden!important;
}
.refuge74-overlay{
  position:fixed;
  z-index:2500;
  inset:0;
  display:grid;
  place-items:center;
  padding:16px;
  overflow:auto;
  background:
    linear-gradient(rgba(34,25,36,.62),rgba(34,25,36,.72)),
    url("../images/painting-hero.webp") center/cover no-repeat;
  backdrop-filter:blur(8px);
}
.refuge74-overlay[hidden]{display:none!important}
.refuge74-onboarding-card,
.refuge74-dialog-card{
  width:min(520px,100%);
  padding:clamp(20px,5vw,34px);
  border:1px solid rgba(255,255,255,.24);
  border-radius:28px;
  background:rgba(255,250,247,.96);
  box-shadow:0 28px 80px rgba(29,18,28,.34);
}
.refuge74-onboarding-mark{
  width:58px;
  height:58px;
  display:grid;
  place-items:center;
  margin-bottom:18px;
  border-radius:19px;
  color:#fff;
  background:linear-gradient(135deg,#ba748d,#786995);
  font:700 1.02rem Georgia,serif;
}
.refuge74-onboarding-card h2{
  margin:4px 0 13px;
  color:#48353f;
  font:500 clamp(2.65rem,11vw,4rem)/.90 Georgia,serif;
  letter-spacing:-.05em;
}
.refuge74-onboarding-card h2 em{
  color:#b16e87;
  font-style:italic;
}
.refuge74-onboarding-copy{
  max-width:40ch;
  margin:0;
  color:#79636e;
  font-size:.70rem;
  line-height:1.6;
}
.refuge74-onboarding-actions{
  display:grid;
  gap:8px;
  margin-top:20px;
}
.refuge74-onboarding-actions>button{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  align-items:center;
  gap:11px;
  min-height:66px;
  padding:9px 11px;
  border:1px solid rgba(82,55,69,.10);
  border-radius:17px;
  color:#513e48;
  background:#fff;
  text-align:left;
}
.refuge74-onboarding-actions>button>span{
  width:42px;
  height:42px;
  display:grid;
  place-items:center;
  border-radius:13px;
  color:#9f657d;
  background:#f2e3e8;
}
.refuge74-onboarding-actions>button.is-primary{
  color:#fff;
  border:0;
  background:linear-gradient(135deg,#b66f89,#7e7098);
}
.refuge74-onboarding-actions>button.is-primary>span{
  color:#fff;
  background:rgba(255,255,255,.16);
}
.refuge74-onboarding-actions strong,
.refuge74-onboarding-actions small{display:block}
.refuge74-onboarding-actions strong{font-size:.70rem}
.refuge74-onboarding-actions small{margin-top:3px;opacity:.75;font-size:.52rem}
.refuge74-back{
  margin:0 0 18px;
  padding:0;
  border:0;
  color:#8a6677;
  background:none;
  font-size:.60rem;
  font-weight:800;
}

.refuge74-form,
.refuge74-dialog-card{
  display:grid;
  gap:12px;
}
.refuge74-form label,
.refuge74-dialog-card label{
  display:grid;
  gap:6px;
}
.refuge74-form label>span,
.refuge74-dialog-card label>span{
  color:#795f6c;
  font-size:.56rem;
  font-weight:850;
}
.refuge74-form input,
.refuge74-form textarea,
.refuge74-dialog-card input{
  width:100%;
  padding:12px 13px;
  border:1px solid rgba(82,55,69,.11);
  border-radius:13px;
  outline:none;
  color:#4f3b46;
  background:#f8f0ed;
  font:600 .68rem/1.4 inherit;
}
.refuge74-form input:focus,
.refuge74-form textarea:focus,
.refuge74-dialog-card input:focus{
  border-color:rgba(177,103,134,.36);
  box-shadow:0 0 0 4px rgba(177,103,134,.07);
}
.refuge74-form button.is-primary,
.refuge74-dialog-card button.is-primary{
  min-height:44px;
  border:0;
  border-radius:13px;
  color:#fff;
  background:linear-gradient(135deg,#b66f89,#7f7099);
  font-size:.63rem;
  font-weight:900;
}
.refuge74-form-status{
  min-height:16px;
  color:#9a6678;
  font-size:.53rem;
  line-height:1.45;
}
.refuge74-dialog{
  z-index:2600;
}
.refuge74-dialog-card{
  position:relative;
}
.refuge74-dialog-card h3{
  margin:0;
  color:#493640;
  font:500 2rem/1 Georgia,serif;
}
.refuge74-dialog-card>p:not(.eyebrow){
  margin:0 0 4px;
  color:#7d6873;
  font-size:.66rem;
  line-height:1.55;
}
.refuge74-dialog-close{
  position:absolute;
  top:12px;
  right:12px;
  width:36px;
  height:36px;
  border:1px solid rgba(82,55,69,.09);
  border-radius:12px;
  color:#715763;
  background:#fff;
  font-size:1rem;
}

@media(min-width:780px){
  .refuge74-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .refuge74-devices-card{
    grid-column:1/-1;
  }
}
@media(min-width:1150px){
  .refuge74-grid{
    grid-template-columns:1fr 1fr;
  }
  .refuge74-devices-card,
  .refuge74-privacy-card{
    grid-column:auto;
  }
}
@media(max-width:699px){
  .manage71-tabs button strong{
    font-size:.46rem!important;
  }
  .manage71-tabs button{
    gap:3px!important;
  }
  .refuge74-card{
    padding:13px;
  }
}
@media(prefers-reduced-motion:reduce){
  #refuge74-sync-dot{animation:none!important}
}
