/* =====================================================================
   ArcheryEra Partner Tools — shared widget styles (assets/css/ae-embed.css)
   Used by every page under /embed/. Kept separate from archeryera.css on
   purpose: a widget loads inside someone else's page, so it ships one
   small stylesheet, system fonts only (no third-party font requests) and
   no site header/footer styles.

   Two themes, set on <html data-theme> by assets/js/ae-embed.js:
     standard — ArcheryEra colors and a small ArcheryEra title bar
     partner  — neutral greys, no ArcheryEra logo; the host site can pass
                ?accent=RRGGBB to tint buttons and the result. Attribution
                ("Powered by ArcheryEra") stays in both themes.
   ===================================================================== */
*,*::before,*::after{box-sizing:border-box}
:root{
  --e-bg:#FCFBF7; --e-card:#fff; --e-ink:#232522; --e-muted:#6B6555; --e-line:#E6E1D5;
  --e-head:#2C3B29; --e-head-ink:#F4F1E9; --e-result:#2C3B29; --e-soft:#F4F1E9;
  --e-accent:#A94A26; --e-accent-ink:#fff; --e-focus:#CB5E36;
  --e-font:system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --e-radius:10px;
}
html[data-theme="partner"]{
  --e-bg:#fff; --e-card:#fff; --e-ink:#1F1F1F; --e-muted:#5E5E5E; --e-line:#E2E2E2;
  --e-head:#fff; --e-head-ink:#1F1F1F; --e-result:#1F1F1F; --e-soft:#F5F5F3;
  --e-accent:#3A3A3A; --e-accent-ink:#fff; --e-focus:#3A3A3A;
}
html,body{margin:0;padding:0}
body{font-family:var(--e-font);font-size:15px;line-height:1.45;color:var(--e-ink);background:var(--e-bg);
  -webkit-text-size-adjust:100%;overflow-x:hidden}
.aeemb{max-width:860px;margin:0 auto;border:1px solid var(--e-line);border-radius:var(--e-radius);background:var(--e-card);overflow:hidden}
html.is-framed .aeemb{border-radius:var(--e-radius)}

/* title bar */
.aeemb-head{display:flex;align-items:center;gap:10px;padding:10px 16px;background:var(--e-head);color:var(--e-head-ink)}
.aeemb-head img{display:block;width:26px;height:26px;flex:none}
.aeemb-head h1{margin:0;font-size:16px;font-weight:700;letter-spacing:-.005em;line-height:1.2}
.aeemb-head p{margin:0;font-size:12.5px;opacity:.82}
html[data-theme="partner"] .aeemb-head{border-bottom:1px solid var(--e-line);padding:12px 16px 10px}
html[data-theme="partner"] .aeemb-head img{display:none}

/* body grid */
.aeemb-body{display:grid;grid-template-columns:1fr;gap:14px;padding:14px 16px 6px}
@media (min-width:600px){.aeemb-body{grid-template-columns:minmax(0,1.08fr) minmax(0,1fr);gap:18px}}

/* inputs */
.aeemb-fields{display:grid;gap:10px;margin:0;padding:0;border:0;min-width:0}
.aeemb-field{min-width:0}
.aeemb-row{display:flex;align-items:center;justify-content:space-between;gap:10px}
.aeemb-row label{font-size:13.5px;font-weight:600}
.aeemb-num{display:inline-flex;align-items:center;gap:4px;flex:none}
.aeemb-num input{width:74px;font:inherit;font-size:14px;font-weight:600;text-align:right;padding:5px 8px;border:1px solid var(--e-line);
  border-radius:7px;background:#fff;color:var(--e-ink)}
.aeemb-num span{font-size:12.5px;color:var(--e-muted);min-width:22px}
.aeemb-num input[aria-invalid="true"]{border-color:#B3261E;box-shadow:0 0 0 1px #B3261E}
.aeemb-err{margin:3px 0 0;font-size:12.5px;color:#B3261E;font-weight:600}
.aeemb-err:empty{display:none}
.aeemb-field input[type=range]{width:100%;margin:6px 0 0;accent-color:var(--e-accent);height:22px}
.aeemb-style legend{font-size:13.5px;font-weight:600;padding:0;margin:0 0 6px}
.aeemb-style{margin:0;padding:0;border:0;min-width:0}
.aeemb-seg{display:grid;grid-template-columns:1fr 1fr;gap:6px}
.aeemb-seg button{font:inherit;font-size:12.5px;font-weight:600;line-height:1.25;padding:8px 8px;border:1px solid var(--e-line);border-radius:7px;
  background:#fff;color:var(--e-ink);cursor:pointer;text-align:center;min-height:44px}
.aeemb-seg button[aria-pressed="true"]{background:var(--e-accent);border-color:var(--e-accent);color:var(--e-accent-ink)}

/* result */
.aeemb-result{display:flex;flex-direction:column;gap:10px;min-width:0}
.aeemb-card{background:var(--e-soft);border-radius:var(--e-radius);padding:14px 16px;min-height:132px}
.aeemb-card .k{display:block;font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--e-muted)}
.aeemb-card .v{display:block;font-size:40px;font-weight:800;letter-spacing:-.02em;line-height:1.1;margin:4px 0 2px;color:var(--e-result);
  font-variant-numeric:tabular-nums}
.aeemb-card .s{display:block;font-size:13px;color:var(--e-muted)}
.aeemb-card.is-stale .v{opacity:.35}
.aeemb-note{margin:0;font-size:13px;color:var(--e-muted)}
.aeemb-warn{margin:0;font-size:13px;padding:8px 10px;border-radius:7px;background:#FFF4E5;color:#6B3D00;border:1px solid #F2C98A}
.aeemb-cta{border-top:1px solid var(--e-line);padding-top:10px}
.aeemb-cta p{margin:0 0 7px;font-size:13.5px;font-weight:600}
.aeemb-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;font:inherit;font-size:14px;font-weight:700;text-decoration:none;
  padding:11px 14px;border-radius:8px;background:var(--e-accent);color:var(--e-accent-ink);text-align:center;line-height:1.25;min-height:44px}
.aeemb-btn:hover{filter:brightness(1.08)}

/* footer / attribution */
.aeemb-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;padding:8px 16px 10px;font-size:12px;color:var(--e-muted)}
.aeemb-foot a{color:var(--e-muted);text-decoration:underline;text-underline-offset:2px}
.aeemb-foot a:hover{color:var(--e-ink)}

/* focus + motion */
.aeemb a:focus-visible,.aeemb button:focus-visible,.aeemb input:focus-visible{outline:2px solid var(--e-focus);outline-offset:2px}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.aeemb-noscript{margin:0;padding:14px 16px;font-size:14px}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
/* inside an iframe the host page shows through around the card */
html.is-framed,html.is-framed body{background:transparent}
