/*
 * KOKO MATCH · CP180 (0.14.83) · Identidad petróleo
 * Capa visual transversal: público, invitado, acceso y panel autenticado.
 * No toca geolocalización, datos, formularios, vídeo ni posiciones del menú móvil.
 * Acabado de marca inspirado en KOKO Inicio 1.5.9: Match. / #FEC300.
 */

/* BASE: también respeta el modo de presentación heredado. */
body.km-match-page{
  --km-petrol-bg:#091b28;
  --km-petrol-deep:#071723;
  --km-petrol-mid:#0c2432;
  --km-petrol-panel:#122d3c;
  --km-petrol-surface:#193849;
  --km-petrol-hover:#21465a;
  --km-petrol-input:#0b2534;
  --km-petrol-border:#53798b;
  --km-petrol-fine:rgba(151,197,213,.26);
  --km-petrol-text:#f6f9fb;
  --km-petrol-muted:#c2d6e0;
  --km-petrol-soft:#a5c2d0;
  --km-petrol-yellow:#fec300;
  background:var(--km-petrol-bg);
  color:var(--km-petrol-text);
}
body.km-match-page .km-app{
  --bg:var(--km-petrol-bg);
  --panel:var(--km-petrol-panel);
  --line:var(--km-petrol-fine);
  --muted:var(--km-petrol-muted);
  --text:var(--km-petrol-text);
  --y:var(--km-petrol-yellow);
}
/* Graphite / black legacy base: replacement has no raster image or external dependency. */
body.km-match-page:not(.km-da05-mode) :is(.site,.site-content){background:#091b28!important}
body.km-match-page:not(.km-da05-mode) .km-app::before{
  background:
    radial-gradient(ellipse 780px 560px at 8% 7%,rgba(63,134,166,.19),transparent 74%),
    radial-gradient(ellipse 700px 570px at 92% 85%,rgba(19,101,131,.15),transparent 75%),
    linear-gradient(125deg,#112b3b 0%,#091b28 52%,#071722 100%)!important;
}
body.km-match-page:not(.km-da05-mode) .km-app::after{opacity:.13!important}
body.km-match-page:not(.km-da05-mode) .km-app :is(.km-form-card,.km-card,.km-panel,.km-policy,.km-auth-card,.km-choice,.km-summary>div,.km-result,.km-match-result){
  background:var(--km-petrol-panel)!important;
  border-color:var(--km-petrol-fine)!important;
}
body.km-match-page:not(.km-da05-mode) .km-app :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea){
  background-color:var(--km-petrol-input)!important;
  color:var(--km-petrol-text)!important;
  -webkit-text-fill-color:var(--km-petrol-text)!important;
  border-color:var(--km-petrol-border)!important;
  color-scheme:dark;
}
body.km-match-page:not(.km-da05-mode) .km-app :is(input,textarea)::placeholder{color:var(--km-petrol-soft)!important}
body.km-match-page:not(.km-da05-mode) .km-app :is(.km-field-help,.km-intro,.km-form-foot,.km-form label>span){color:var(--km-petrol-muted)!important}

/* ACTIVE DA05 — all routes share these variables, including guest and logged-in views. */
body.km-da05-mode{background:#091b28!important}
body.km-da05-mode #km-da05-app{
  --da-bg:#091b28;
  --da-panel:#122d3c;
  --da-surface:#193849;
  --da-line:#648a9b;
  --da-text:#f6f9fb;
  --da-muted:#c2d6e0;
  --da-accent:#fec300;
  --da-error:#ff9fb2;
  --da-field:#0b2534;
  background:
    radial-gradient(ellipse 760px 590px at 6% 12%,rgba(66,145,177,.20) 0%,transparent 74%),
    radial-gradient(ellipse 680px 580px at 96% 77%,rgba(22,92,121,.18) 0%,transparent 76%),
    linear-gradient(125deg,#102a3b 0%,#091b28 51%,#071622 100%)!important;
  color:var(--da-text)!important;
}
/* Header and sticky sections: stable colors, no accidental translucent stripes. */
body.km-da05-mode #km-da05-app .km-da05-head{
  background:#091925!important;
  border-bottom:1px solid var(--km-petrol-fine)!important;
  box-shadow:0 1px 0 rgba(0,0,0,.12);
}
body.km-da05-mode #km-da05-app .km-da05-tools{
  background:transparent!important;
}
body.km-da05-mode #km-da05-app .km-da05-tool{
  background:rgba(25,56,73,.92)!important;
  border:1px solid rgba(125,178,197,.38)!important;
  color:var(--da-text);
  box-shadow:0 4px 14px rgba(1,10,16,.14);
}
body.km-da05-mode #km-da05-app .km-da05-tool:hover{
  background:#23465a!important;
  border-color:#a3cbd9!important;
}
body.km-da05-mode #km-da05-app .km-da05-tool[aria-current=page]{
  background:var(--da-accent)!important;
  color:#071924!important;
  border-color:var(--da-accent)!important;
  box-shadow:0 2px 0 rgba(122,91,0,.32);
}
body.km-da05-mode #km-da05-app .km-da05-tool[aria-current=page] :is(.km-da05-tool-label,.km-da05-tool-label small,.km-da05-icon){color:#071924!important}
body.km-da05-mode #km-da05-app .km-da05-search summary,
body.km-da05-mode #km-da05-app .km-da05-account>summary{
  background:#132f3f!important;
  border-color:var(--km-petrol-border)!important;
}
body.km-da05-mode #km-da05-app :is(.km-da05-search-panel,.km-da05-account-menu){
  background:#142e3d!important;
  border-color:var(--km-petrol-border)!important;
  box-shadow:0 22px 46px rgba(1,8,16,.38);
}
body.km-da05-mode #km-da05-app .km-da05-account-menu a:hover{background:#21475a!important}
body.km-da05-mode #km-da05-app .km-da05-footer{border-color:var(--km-petrol-fine);color:var(--da-muted)}

/* BRAND: Match. from KOKO's homepage, no old all-caps oblique treatment. */
body.km-da05-mode #km-da05-app .km-da05-wordmark{
  font-family:Inter,Arial,sans-serif!important;
  font-weight:900!important;
  font-style:normal!important;
  font-size:clamp(30px,2.4vw,37px)!important;
  letter-spacing:-.09em!important;
  line-height:1.03;
  text-transform:none!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff;
}
body.km-da05-mode #km-da05-app .km-da05-wordmark b{
  color:#fec300!important;
  -webkit-text-fill-color:#fec300!important;
  font:inherit;
}
body.km-da05-mode #km-da05-app .km-da05-origin{color:var(--km-petrol-soft)!important}
body.km-da05-mode #km-da05-app .km-da05-origin:hover{background:rgba(156,208,222,.08)!important}

/* WELCOME: reproduced visual hierarchy, with the film itself unaltered. */
body.km-da05-mode #km-da05-app :is(.km-da05-welcome-surface,.km-da05-welcome){
  background:linear-gradient(140deg,rgba(20,51,68,.96),rgba(9,30,44,.98))!important;
  border-color:var(--km-petrol-fine)!important;
  box-shadow:0 20px 44px rgba(1,8,14,.12);
}
body.km-da05-mode #km-da05-app .km-da05-welcome-surface>.km-da05-welcome{
  background:transparent!important;
  border:0!important;
  box-shadow:none;
}
body.km-da05-mode #km-da05-app .km-petrol-welcome-top{
  display:grid;
  grid-template-columns:minmax(0,.78fr) minmax(0,1.22fr);
  align-items:center;
  gap:clamp(26px,5vw,72px);
  margin:0 0 32px;
}
body.km-da05-mode #km-da05-app .km-petrol-welcome-brand{min-width:0;display:flex;flex-direction:column;align-items:flex-start;gap:0}
body.km-da05-mode #km-da05-app .km-petrol-kicker{
  display:block;color:var(--da-accent);font:850 11px/1.3 Inter,Arial,sans-serif;
  letter-spacing:.23em;margin-bottom:13px;
}
body.km-da05-mode #km-da05-app .km-petrol-brand-word{
  font:900 clamp(72px,8.2vw,132px)/.98 Inter,Arial,sans-serif!important;
  letter-spacing:-.092em;color:#fff!important;-webkit-text-fill-color:#fff!important;
  white-space:nowrap;max-width:100%;display:block;
}
body.km-da05-mode #km-da05-app .km-petrol-brand-word>span{color:#fec300!important;-webkit-text-fill-color:#fec300!important}
body.km-da05-mode #km-da05-app .km-petrol-welcome-brand>small{
  color:var(--km-petrol-muted)!important;letter-spacing:.15em;
  font:800 10px/1.5 Inter,Arial,sans-serif;margin-top:14px;
}
body.km-da05-mode #km-da05-app .km-petrol-welcome-copy{
  min-width:0;align-self:center;
}
body.km-da05-mode #km-da05-app .km-petrol-welcome-copy .km-da05-eyebrow{
  color:var(--da-accent)!important;
  font-size:11px;font-weight:800;letter-spacing:.13em;
}
body.km-da05-mode #km-da05-app .km-petrol-welcome-copy h1{
  font-family:Inter,Arial,sans-serif!important;
  font-size:clamp(26px,3.15vw,45px);font-weight:850!important;
  line-height:1.14!important;letter-spacing:-.035em!important;
  max-width:23ch;margin-bottom:16px;
}
body.km-da05-mode #km-da05-app .km-petrol-welcome-copy .km-da05-lead{
  font-size:clamp(14px,1.35vw,16px);line-height:1.65;margin-bottom:0;
  max-width:59ch;color:var(--da-muted)!important;
}
body.km-da05-mode #km-da05-app .km-da05-entry-pair>a{
  background:linear-gradient(140deg,#1a3a4b 0%,#102c3d 100%)!important;
  border:1px solid rgba(151,195,213,.39)!important;
  border-radius:13px!important;
  box-shadow:0 8px 26px rgba(0,7,15,.13);
  transition:border-color .2s ease,background .2s ease,transform .2s ease,box-shadow .2s ease;
}
body.km-da05-mode #km-da05-app .km-da05-entry-pair>a:hover,
body.km-da05-mode #km-da05-app .km-da05-entry-pair>a:focus-visible{
  background:linear-gradient(145deg,#224a5c,#17384a)!important;
  border-color:#fec300!important;
  box-shadow:0 12px 30px rgba(0,8,16,.23);
  transform:translateY(-3px);
}
body.km-da05-mode #km-da05-app .km-da05-entry-pair h2{color:#fff!important}
body.km-da05-mode #km-da05-app .km-da05-entry-pair p{color:var(--da-muted)!important}
body.km-da05-mode #km-da05-app .km-da05-entry-pair>a strong{color:#fec300!important;-webkit-text-fill-color:#fec300!important}
body.km-da05-mode #km-da05-app .km-da05-fineprint{border-top-color:var(--km-petrol-fine)!important;color:var(--da-muted)!important}

/* FORM SURFACES: all create/search/rent/access, both anonymous and signed in. */
body.km-da05-mode #km-da05-app .km-da05-content :is(.km-form-card,.km-card,.km-panel,.km-policy),
body.km-da05-mode #km-da05-app .km-access--account .km-auth-card{
  background:#122d3c!important;
  background-image:none!important;
  border-color:rgba(142,192,209,.35)!important;
  color:var(--da-text)!important;
  box-shadow:0 10px 30px rgba(0,8,16,.12);
}
body.km-da05-mode #km-da05-app .km-da05-content :is(.km-form-card,.km-panel,.km-auth-card){border-radius:13px}
body.km-da05-mode #km-da05-app .km-form fieldset{
  background:rgba(8,29,43,.34)!important;
  border-color:var(--km-petrol-fine)!important;
}
body.km-da05-mode #km-da05-app :is(.km-form,.km-access,.km-auth,.km-report-form) :is(
  input:not([type=checkbox]):not([type=radio]):not([type=hidden]):not([type=button]):not([type=submit]):not([type=reset]),
  select,textarea),
body.km-da05-mode #km-da05-app .km-da05-site-search input{
  background-color:#0b2534!important;
  color:#f7fbff!important;
  -webkit-text-fill-color:#f7fbff!important;
  border:1px solid #648b9f!important;
  border-radius:8px!important;
  caret-color:#fec300;
  box-shadow:inset 0 1px 1px rgba(0,0,0,.10);
  color-scheme:dark;
}
body.km-da05-mode #km-da05-app :is(.km-form,.km-access,.km-auth,.km-report-form) :is(input,select,textarea):hover:not(:disabled):not([readonly]){
  border-color:#9ac7d9!important;
}
body.km-da05-mode #km-da05-app :is(.km-form,.km-access,.km-auth,.km-report-form) :is(input,select,textarea):focus:not([aria-invalid=true]):not(.km-input-invalid){
  border-color:#fec300!important;
  outline-color:#fec300;
  box-shadow:0 0 0 3px rgba(254,195,0,.13)!important;
}
body.km-da05-mode #km-da05-app :is(input,textarea)::placeholder{
  color:#b2cad7!important;
  -webkit-text-fill-color:#b2cad7!important;
  opacity:1;
}
body.km-da05-mode #km-da05-app :is(input,select,textarea):disabled{
  background:#203b4b!important;
  color:#d8e6ec!important;
  -webkit-text-fill-color:#d8e6ec!important;
}
body.km-da05-mode #km-da05-app :is(input,textarea)[readonly]{
  background:#19394b!important;
  color:#e5eff3!important;
  -webkit-text-fill-color:#e5eff3!important;
}
body.km-da05-mode #km-da05-app :is(input,select,textarea)[aria-invalid=true],
body.km-da05-mode #km-da05-app :is(input,select,textarea).km-input-invalid{
  border-color:var(--da-error)!important;
}
body.km-da05-mode #km-da05-app :is(.km-field-help,.km-form small,.km-form .km-help,.km-access-security-note,.km-da05-page-intro p){
  color:var(--da-muted)!important;
  -webkit-text-fill-color:currentColor!important;
}
body.km-da05-mode #km-da05-app .km-form label>span,
body.km-da05-mode #km-da05-app .km-form legend,
body.km-da05-mode #km-da05-app .km-field-label{color:#e3edf2!important}
body.km-da05-mode #km-da05-app :is(.km-required,.km-required-star){color:#ff9fb2!important}
body.km-da05-mode #km-da05-app input[type=checkbox],
body.km-da05-mode #km-da05-app input[type=radio]{accent-color:#fec300!important}
body.km-da05-mode #km-da05-app .km-access--account .km-auth-identity,
body.km-da05-mode #km-da05-app .km-access--account .km-auth-identity .km-identity-option{
  background:#193849!important;
  border-color:var(--km-petrol-border)!important;
}
body.km-da05-mode #km-da05-app .km-access--account .km-auth-identity .km-identity-option:hover,
body.km-da05-mode #km-da05-app .km-access--account .km-auth-identity .km-identity-option:focus-within{
  background:#21465a!important;
  border-color:#fec300!important;
}
/* Preserve CTA semantics and destructive states. Only neutral secondary buttons change. */
body.km-da05-mode #km-da05-app .km-btn.km-btn-ghost,
body.km-da05-mode #km-da05-app .km-form-actions>a.km-btn:not(.km-btn-primary){
  background:#193a4d!important;
  color:#f2f8fb!important;
  -webkit-text-fill-color:currentColor!important;
  border-color:#729aaa!important;
}
body.km-da05-mode #km-da05-app .km-btn.km-btn-ghost:hover,
body.km-da05-mode #km-da05-app .km-form-actions>a.km-btn:not(.km-btn-primary):hover{
  background:#254c60!important;
  border-color:#a7d4e1!important;
}

/* AUTHENTICATED DASHBOARD: original geometry, warmer sea-blue panels. */
body.km-da05-mode #km-da05-app :is(.km-dash-stage,.km-dash-saved,.km-dash-choices :is(a,button),.km-dash-records .km-card,
  .km-da05-match-card,.km-da05-email-prompt,.km-dash-attention){
  background:#142f40!important;
  border-color:rgba(143,190,207,.39)!important;
}
body.km-da05-mode #km-da05-app .km-dash-choices :is(a,button):hover{background:#224657!important}
body.km-da05-mode #km-da05-app .km-dash-choices :is(a,button)[aria-current=true]{
  background:#26495b!important;border-color:#fec300!important;
}
body.km-da05-mode #km-da05-app .km-dash-previews .km-da05-match-card,
body.km-da05-mode #km-da05-app .km-home-match-preview .km-da05-match-card{
  background:#193849!important;border-color:var(--km-petrol-border)!important;
}
body.km-da05-mode #km-da05-app :is(.km-dash-panel,.km-dash-sections,.km-dash-shortcuts,.km-dash-row,.km-dash-saved-reference,.km-da05-pair-top,.km-da05-pair-foot,.km-da05-match-detail){
  border-color:var(--km-petrol-fine)!important;
}
body.km-da05-mode #km-da05-app .km-da05-match-card>details>summary:hover,
body.km-da05-mode #km-da05-app .km-da05-match-link:hover{background:#21465a!important}
body.km-da05-mode #km-da05-app :is(.km-da05-nav-status,.km-dash-attention){
  background:#193a4d!important;border-color:rgba(254,195,0,.38)!important;
}
/* Modals, dropdowns and message surfaces: color only, never pointer-events, scrolling or layout. */
body.km-da05-mode #km-da05-app :is(.km-modal,.km-dialog,.km-popup,.km-message,.km-message-card,.km-notification-card,.km-result-card,.km-preview-card),
body.km-da05-mode #km-da05-app .km-dash-records .km-card{
  border-color:var(--km-petrol-fine)!important;
}

/* Responsive: preserve CP179 compact landscape tabs and CP179/DA05 phone dock. */
@media(max-width:900px){
 body.km-da05-mode #km-da05-app .km-petrol-welcome-top{grid-template-columns:1fr;gap:22px}
 body.km-da05-mode #km-da05-app .km-petrol-brand-word{font-size:clamp(70px,13vw,112px)!important}
 body.km-da05-mode #km-da05-app .km-petrol-welcome-copy h1{max-width:34ch}
}
@media(max-width:600px){
 body.km-da05-mode #km-da05-app .km-da05-tools{
  background:#091925!important;
  border-top:1px solid var(--km-petrol-fine)!important;
  box-shadow:0 -12px 25px rgba(0,8,14,.32)!important;
 }
 body.km-da05-mode #km-da05-app .km-da05-tool{
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
 }
 body.km-da05-mode #km-da05-app .km-da05-tool[aria-current=page]{
  background:rgba(254,195,0,.13)!important;
  border-color:rgba(254,195,0,.36)!important;
  color:#fec300!important;
  box-shadow:none!important;
 }
 body.km-da05-mode #km-da05-app .km-da05-tool[aria-current=page] :is(.km-da05-tool-label,.km-da05-tool-label small,.km-da05-icon){color:#fec300!important}
 body.km-da05-mode #km-da05-app .km-da05-wordmark{font-size:32px!important}
 body.km-da05-mode #km-da05-app .km-petrol-welcome-top{gap:20px;margin-bottom:22px}
 body.km-da05-mode #km-da05-app .km-petrol-brand-word{font-size:clamp(65px,16vw,92px)!important}
 body.km-da05-mode #km-da05-app .km-petrol-kicker{font-size:10px;margin-bottom:8px}
 body.km-da05-mode #km-da05-app .km-petrol-welcome-brand>small{margin-top:8px;font-size:9px}
 body.km-da05-mode #km-da05-app .km-petrol-welcome-copy h1{font-size:clamp(27px,7.4vw,34px);max-width:100%}
 body.km-da05-mode #km-da05-app .km-da05-entry-pair>a:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
 body.km-da05-mode #km-da05-app .km-da05-entry-pair>a{transition:none!important;transform:none!important}
}

/* CP180 · Nested surfaces that otherwise retain the former black theme. */
body.km-da05-mode #km-da05-app .km-form-more,
body.km-da05-mode #km-da05-app .km-verification-card,
body.km-da05-mode #km-da05-app :is(.km-access-steps>span,.km-auth-card,.km-safety-panel details),
body.km-da05-mode #km-da05-app .km-form-stage{
  background:#112c3b!important;
  border-color:rgba(142,192,209,.31)!important;
  color:var(--da-text)!important;
}
body.km-da05-mode #km-da05-app .km-form-more>summary{
  color:var(--da-text)!important;
}
body.km-da05-mode #km-da05-app .km-form-more>summary:hover,
body.km-da05-mode #km-da05-app .km-form-more>summary:focus-visible{
  background:#1e4355!important;
}
body.km-da05-mode #km-da05-app .km-form-more>summary>small,
body.km-da05-mode #km-da05-app .km-verification-card>p,
body.km-da05-mode #km-da05-app .km-access-steps>span{
  color:var(--da-muted)!important;
}
body.km-da05-mode #km-da05-app .km-form-more__body{border-top-color:var(--km-petrol-fine)!important}
body.km-da05-mode #km-da05-app .km-verification-card h3{color:var(--da-text)!important}
body.km-da05-mode #km-da05-app :is(.km-preview-results,.km-match-result,.km-result,.km-conversation-row,.km-notification-row){
  border-color:var(--km-petrol-fine)!important;
}
/* Never repaint dynamic intro video, its poster or caption positioning. */
/* Shared KOKO account: scoped to MATCH; the main Kadence header stays owner-managed. */
.km-app .km-shared-avatar{display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;width:var(--km-profile-size,36px);height:var(--km-profile-size,36px);min-width:var(--km-profile-size,36px);flex:none;overflow:hidden;border-radius:50%;background:#173c4f;color:#f3f5f5;border:1px solid #5a8394;line-height:0}
.km-app .km-shared-avatar-image{display:flex!important;align-items:center;justify-content:center;width:100%!important;height:100%!important;min-width:0;object-fit:cover;border-radius:50%;margin:0}
.km-app .km-shared-avatar svg{width:24px!important;height:24px!important;flex:none;fill:none;stroke:currentColor}
.km-app .km-shared-avatar svg.km-icon--profile{fill:currentColor!important;stroke:none!important}
.km-app .km-shared-profile-link{display:inline-flex;align-items:center;gap:10px;color:inherit;text-decoration:none}
.km-app .km-shared-profile-card{display:flex;align-items:center;gap:18px;border:1px solid #5a8394;border-radius:10px;padding:20px;background:#142e3d;margin:22px 0}
.km-app .km-shared-profile-card h2{font-family:Inter,system-ui,sans-serif;font-size:18px;line-height:1.4;margin:0 0 6px;text-transform:none;color:#f3f5f5;overflow-wrap:anywhere}
.km-app .km-shared-profile-card p{font-size:14px;line-height:1.6;color:#cfdee4;margin:0 0 9px}
.km-app .km-shared-profile-card a{display:inline-flex;align-items:center;gap:8px;color:#fec300;font-size:14px;line-height:1.5;text-decoration:underline;text-underline-offset:3px}
.km-app .km-shared-profile-card a:focus-visible,.km-app .km-shared-profile-link:focus-visible{outline:2px solid #fec300;outline-offset:4px;border-radius:4px}
@media(max-width:420px){.km-app .km-shared-profile-card{padding:16px;gap:12px}.km-app .km-shared-profile-card .km-shared-avatar{--km-profile-size:48px!important}}