/* Mobile-first Pink & Blue theme (Love version) */
:root{
  --rekoi-pink:#ff67a3;
  --rekoi-blue:#5aa9ff;
  --rekoi-bg:#ffffff;
  --rekoi-text:#1a1a1a;
  --rekoi-border:#e9e9ee;
  --tap-min:48px;
}

#rekoi-app{max-width:720px;margin:0 auto;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica,Arial,sans-serif;color:var(--rekoi-text);font-size:20px;-webkit-tap-highlight-color:transparent}
#rekoi-form{margin:12px 0;background:linear-gradient(135deg, rgba(255,103,163,.08), rgba(90,169,255,.08));padding:16px;border-radius:14px;border:1px solid var(--rekoi-border)}
.rekoi-grid{display:grid;grid-template-columns:1fr;gap:12px}
#rekoi-form label{display:block;line-height:1.25}
#rekoi-form label.rekoi-tight br{line-height:0;display:block;margin:0;padding:0}
#rekoi-form label.rekoi-tight input{margin-top:0}
#rekoi-form input,#rekoi-form select{width:100%;min-height:var(--tap-min);padding:12px;border:1px solid var(--rekoi-border);border-radius:12px;background:#fff}
#rekoi-form .rekoi-consent{display:flex;align-items:center;gap:8px}
#rekoi-form .rekoi-consent input{width:20px;height:20px}

.rekoi-sticky{position:sticky;bottom:calc(env(safe-area-inset-bottom) + 8px);padding:8px 0 0 0;background:transparent}
.rekoi-btn{width:100%;min-height:56px;padding:12px 16px;border:none;border-radius:999px;cursor:pointer;font-weight:800;background:linear-gradient(45deg,var(--rekoi-pink),var(--rekoi-blue));color:#fff;box-shadow:0 8px 28px rgba(255,103,163,.25)}
.rekoi-btn:active{transform:translateY(1px)}

.rekoi-result{margin-top:16px}
.rekoi-box{border:1px solid var(--rekoi-border);padding:18px;border-radius:16px;background:var(--rekoi-bg)}
.rekoi-score{font-size:56px;font-weight:900;line-height:1;margin-bottom:4px;letter-spacing:-.02em;background:linear-gradient(45deg,var(--rekoi-pink),var(--rekoi-blue));-webkit-background-clip:text;background-clip:text;color:transparent}
.rekoi-label{opacity:.85;margin-bottom:10px}
.rekoi-msg{margin:0 0 8px 0}
.rekoi-meta{list-style:none;padding:0;margin:10px 0 0 0;display:grid;grid-template-columns:1fr;gap:6px}
.rekoi-tip{margin-top:10px;padding:10px 12px;border-radius:12px;background:linear-gradient(135deg, rgba(255,103,163,.08), rgba(90,169,255,.08))}
.rekoi-loading{padding:20px;text-align:center;border:1px dashed var(--rekoi-border);border-radius:12px;background:#fff}

@media (min-width: 768px){
  .rekoi-grid{grid-template-columns:1fr 1fr}
  .rekoi-meta{grid-template-columns:1fr 1fr}
}

@media (max-width: 360px){
  #rekoi-app{font-size:18px}
}

@media (prefers-contrast: more){
  #rekoi-form,#rekoi-result .rekoi-box{border-color:#bbb}
  .rekoi-btn{box-shadow:none}
}

@media (prefers-reduced-motion: reduce){
  .rekoi-btn,.rekoi-score{transition:none}
}


/* ===== Hotfix: theme-safe hardening ===== */

#rekoi-app, #rekoi-app * , #rekoi-app *::before, #rekoi-app *::after { box-sizing: border-box; }
#rekoi-app{ width:100%; max-width:720px; }
#rekoi-app label{ display:block !important; }
#rekoi-app input, #rekoi-app select, #rekoi-app button{ min-width:0; width:100%; }
#rekoi-form select{ background-image:none; color:inherit; }

@supports not (display: grid){
  #rekoi-app .rekoi-grid{ display:flex; flex-direction:column; gap:12px; }
}

#rekoi-form{ padding-bottom: calc(env(safe-area-inset-bottom) + 80px); }
#rekoi-app .rekoi-sticky{ z-index: 20; }
#rekoi-app .rekoi-btn{ width:100% !important; display:block; }
.wp-site-blocks #rekoi-app{ margin-top:0; margin-bottom:0; }
#rekoi-result .rekoi-box{ overflow:hidden; word-break:break-word; }
