:root{font-family:Inter,"Segoe UI",Arial,sans-serif;color:#142b32;background:#f4f8f7;font-synthesis:none;font-weight:400;--ink:#142b32;--muted:#657a7d;--teal:#117b6c;--line:#e3ece9;--wash:#edf7f4}*{box-sizing:border-box}body{margin:0;min-height:100vh}.topbar{height:72px;padding:0 max(calc((100vw - 1040px)/2),24px);display:flex;justify-content:space-between;align-items:center;background:#fff;border-bottom:1px solid var(--line)}.brand{display:flex;gap:11px;align-items:center;text-decoration:none;color:var(--ink);font-size:17px}.brand strong{color:var(--teal)}.brand-mark{width:35px;height:35px;border-radius:11px;background:#e0f3ee;color:var(--teal);display:grid;place-items:center;font-size:23px}.country{font-size:13px;color:var(--muted)}main{width:min(760px,calc(100% - 36px));margin:54px auto 64px}.intro{margin-bottom:30px}.eyebrow{font-size:11px;letter-spacing:1.8px;font-weight:700;color:var(--teal);margin:0 0 10px}.intro h1{font-size:clamp(32px,5vw,46px);letter-spacing:-1.6px;margin:0 0 10px}.intro>p:last-child{color:var(--muted);margin:0;font-size:16px}.tabs{display:flex;gap:7px;padding:6px;background:#eaf1ef;border-radius:13px;margin-bottom:16px;overflow:auto}.tab{border:0;background:transparent;color:#586d6e;font:600 13px inherit;padding:11px 16px;border-radius:9px;white-space:nowrap;cursor:pointer}.tab.active{background:white;color:var(--ink);box-shadow:0 2px 7px #173c3012}.workspace{background:white;border:1px solid var(--line);border-radius:17px;padding:28px 30px;box-shadow:0 12px 34px #164b3908}.panel{display:none}.panel.active{display:block}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.panel-heading>div{display:flex;align-items:center;gap:11px}.panel-heading h2{font-size:21px;margin:0;letter-spacing:-.4px}.icon{width:34px;height:34px;background:var(--wash);border-radius:10px;color:var(--teal);display:grid;place-items:center;font-size:17px}.tag{font-size:11px;color:#47706a;background:#eff7f4;border-radius:99px;padding:7px 10px}.muted{font-size:14px;color:var(--muted);margin:0 0 25px}label{display:block;font-weight:600;font-size:13px;margin:0 0 8px}label span{float:right;color:#829391;font-weight:400}.input-wrap{height:48px;border:1px solid #dce7e4;border-radius:9px;display:flex;align-items:center;padding:0 13px;color:#738482}.input-wrap input{border:0;outline:0;width:100%;height:100%;padding-left:9px;font:500 16px inherit;color:var(--ink);background:transparent}input,select{font:inherit;color:var(--ink)}input[type=number],select{width:100%;height:46px;border:1px solid #dce7e4;border-radius:9px;padding:0 12px;background:white;outline-color:#63b7a5}.result-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.result{border:1px solid var(--line);border-radius:11px;padding:15px}.result span{display:block;font-size:12px;color:var(--muted);margin-bottom:9px}.result strong{font-size:22px;letter-spacing:-.6px;font-variant-numeric:tabular-nums}.result.highlight{background:var(--wash);border-color:#d7eee7}.result.highlight strong{color:#0b7664}.source-note{font-size:11.5px;line-height:1.55;color:#768886;margin:15px 0 0}.source-note a{color:#087563;font-weight:600;text-decoration:none}.converter-row{display:grid;grid-template-columns:1.3fr 1fr 25px 1fr;align-items:end;gap:10px}.converter-row .swap{font-size:20px;color:var(--teal);text-align:center;padding-bottom:11px}.single{margin-top:18px}.two-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}.notice{margin-top:15px;border:1px solid #e8eee8;background:#fafcf9;border-radius:11px;padding:13px 15px;display:flex;gap:11px;align-items:flex-start}.notice-icon{flex:0 0 19px;width:19px;height:19px;border-radius:50%;background:#e5f3ed;color:var(--teal);font-size:12px;font-weight:700;display:grid;place-items:center}.notice p{margin:0;color:#647776;font-size:11.5px;line-height:1.55}.notice strong{color:#34504c}footer{text-align:center;color:#879493;font-size:11px;padding:0 15px 25px}footer span{color:#526c68}@media(max-width:560px){.topbar{height:60px;padding:0 18px}.country{font-size:11px}main{margin:34px auto 44px;width:calc(100% - 28px)}.workspace{padding:22px 17px}.panel-heading h2{font-size:18px}.tag{font-size:10px;padding:6px 8px}.tab{padding:10px 12px;font-size:12px}.converter-row{grid-template-columns:1fr 1fr 20px 1fr;gap:6px}.converter-row label{font-size:11px}.result strong{font-size:19px}.two-fields{grid-template-columns:1fr}}

.currency-details,.pension-details{margin-top:14px}

.year-picker{display:flex;align-items:center;gap:7px;margin:0;color:#829391;font-weight:400;font-size:12px}.year-picker select{height:34px;width:auto;padding:0 24px 0 9px;font-size:12px}.divider{height:1px;background:var(--line);margin:24px 0 21px}.subheading{margin-bottom:7px}.subheading h2{font-size:18px}.compact{margin-bottom:16px}.result-grid .result strong{font-size:20px}@media(max-width:560px){.year-picker{font-size:11px}.year-picker select{height:32px}.result-grid .result strong{font-size:18px}}

.custom-deductions{margin-top:23px;padding:16px;border:1px solid var(--line);border-radius:12px;background:#fbfdfc}.deductions-heading{display:flex;justify-content:space-between;gap:12px;align-items:center}.deductions-heading h3{margin:0 0 4px;font-size:14px}.deductions-heading p{margin:0;color:var(--muted);font-size:12px}.add-button{border:1px solid #b9ded4;background:white;color:#087563;border-radius:8px;padding:8px 11px;font:600 12px inherit;cursor:pointer;white-space:nowrap}.custom-deductions-list{display:grid;gap:8px;margin-top:12px}.discount-row{display:grid;grid-template-columns:minmax(130px,1.5fr) minmax(125px,1fr) minmax(95px,.8fr) auto;gap:8px;align-items:center}.discount-row input,.discount-row select{height:40px;min-width:0;font-size:12px}.remove-button{border:0;background:transparent;color:#a34a48;font:600 11px inherit;padding:7px;cursor:pointer}.session-note{margin:10px 0 0;color:#829391;font-size:10.5px;line-height:1.45}.result-grid .result.highlight{grid-column:auto}@media(max-width:560px){.discount-row{grid-template-columns:1fr 1fr;gap:7px}.discount-row .discount-name{grid-column:1/-1}.discount-row .remove-button{justify-self:start}.deductions-heading p{font-size:11px}.custom-deductions{padding:13px}}

.mode-label{margin-top:19px}.mode-note{font-size:12px;line-height:1.5;color:#54706d;background:#f4f9f7;padding:10px 12px;border-radius:8px;margin:9px 0 0}.result-grid .result{min-width:0}@media(max-width:560px){.result-grid .result span{font-size:11px}}

.salary-fields{margin-top:14px}.tax-settings{margin-top:18px;padding:17px;border:1px solid #dfeae7;background:#f9fcfb;border-radius:12px}.tax-extra{margin-top:13px}.payroll-deductions{margin-top:16px}.payroll-results{margin-top:19px}.payroll-results .result.highlight{grid-column:1/-1}.payroll-results .result strong{font-size:19px}.mode-note{overflow-wrap:anywhere}@media(max-width:560px){.tax-settings{padding:13px}.payroll-results .result.highlight{grid-column:auto}.payroll-results .result strong{font-size:17px}}

/* Cocina e historial de conversiones */
.kitchen-fields{margin-top:15px}.kitchen-results{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:14px}.kitchen-result{display:flex;flex-direction:column;align-items:flex-start;gap:7px;padding:13px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);text-align:left;cursor:pointer}.kitchen-result:hover,.kitchen-result:focus-visible{border-color:#8bc9b8;background:#f7fbf9;outline-color:var(--teal)}.kitchen-result span{font-size:12px;color:var(--muted)}.kitchen-result strong{font-size:17px;color:var(--teal)}.calculation-detail{margin-top:12px;padding:13px 14px;border-radius:10px;background:#f6faf8;border:1px solid #e5efeb;font-size:12px;line-height:1.55;color:#526b67}.calculation-detail strong{display:block;color:var(--ink);font-size:13px}.calculation-detail p{margin:7px 0 0}.conversion-history{margin-top:22px;padding-top:18px;border-top:1px solid var(--line)}.history-heading{display:flex;justify-content:space-between;gap:10px;align-items:center}.history-heading h3{margin:0 0 4px;font-size:14px}.history-heading p{margin:0;color:var(--muted);font-size:11px}.history-list{padding-left:22px;margin:12px 0 0;color:var(--muted);font-size:12px}.history-list li{padding:4px 0}.history-list button{border:0;background:none;color:#176d60;font:inherit;text-align:left;cursor:pointer;padding:2px}.history-list button:hover{text-decoration:underline}
@media(max-width:560px){.kitchen-results{grid-template-columns:1fr 1fr}.kitchen-result{padding:11px}.kitchen-result strong{font-size:15px}.history-heading{align-items:flex-start}.history-heading .remove-button{padding-top:2px}}

/* Accesible en pantallas táctiles y móviles */
.accordion{margin-top:18px;border:1px solid var(--line);border-radius:12px;background:#fbfdfc;overflow:hidden}.accordion>summary{min-height:58px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 15px;cursor:pointer;list-style:none}.accordion>summary::-webkit-details-marker{display:none}.accordion>summary::after{content:'＋';color:var(--teal);font-size:20px;font-weight:500}.accordion[open]>summary::after{content:'−'}.accordion>summary>span:first-child{display:flex;flex-direction:column;gap:4px}.accordion>summary strong{font-size:14px;color:var(--ink)}.accordion>summary small{font-size:11px;color:var(--muted)}.accordion>summary .tag{display:none}.accordion-content{padding:0 15px 15px}.kitchen-accordion .accordion-content>.muted{margin:0 0 14px}.conversion-history{padding:0;border:1px solid var(--line);border-radius:12px}.conversion-history .accordion-content{padding-top:0}.conversion-history .history-heading{min-height:0}.conversion-history .history-heading>span{display:none}
button,input,select,summary{-webkit-tap-highlight-color:transparent}button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:3px solid #8bc9b8;outline-offset:2px}input[type=number],input[type=date],select{min-height:46px}html{scroll-behavior:smooth}body{overflow-x:hidden}.tabs{scrollbar-width:thin;scroll-snap-type:x proximity}.tab{scroll-snap-align:start;min-height:42px}.panel{min-width:0}.panel-heading{gap:12px}.panel-heading>div{min-width:0}.panel-heading h2{overflow-wrap:anywhere}.result strong{overflow-wrap:anywhere}.source-note{overflow-wrap:anywhere}
@media(max-width:700px){main{width:min(100% - 28px,600px);margin:34px auto 44px}.workspace{padding:22px 18px}.intro{margin-bottom:22px}.tabs{margin-left:-2px;margin-right:-2px}.panel-heading{align-items:flex-start}.tag{white-space:normal;text-align:center}.discount-row{grid-template-columns:minmax(0,1fr) minmax(0,1fr) auto}.discount-row .discount-name{grid-column:1/-1}}
@media(max-width:560px){.topbar{padding:0 14px}.brand{font-size:15px;gap:8px}.brand-mark{width:32px;height:32px}.country{font-size:10px}.intro h1{font-size:34px;letter-spacing:-1px}.intro>p:last-child{font-size:14px}.workspace{padding:18px 14px;border-radius:14px}.tabs{padding:5px}.tab{padding:10px 12px;font-size:12px}.panel-heading h2{font-size:17px}.panel-heading .tag{max-width:110px}.converter-row{grid-template-columns:1fr 1fr;gap:12px}.converter-row>div:first-child{grid-column:1/-1}.converter-row .swap{display:none}.two-fields{grid-template-columns:1fr;gap:12px}.result-grid{grid-template-columns:1fr;gap:9px}.result-grid .result.highlight,.payroll-results .result.highlight{grid-column:1/-1}.result{padding:13px}.result strong,.result-grid .result strong{font-size:19px}.discount-row{grid-template-columns:1fr 1fr;gap:8px}.discount-row .discount-name{grid-column:1/-1}.discount-row .remove-button{justify-self:start}.tax-settings{padding:12px}.accordion>summary{padding:12px}.accordion-content{padding:0 12px 13px}.kitchen-results{grid-template-columns:1fr 1fr}.kitchen-result strong{font-size:14px}.history-list{padding-left:19px}.history-list button{font-size:12px}.notice{padding:11px}.source-note{font-size:11px}.year-picker{flex-shrink:0}}
@media(max-width:360px){main{width:calc(100% - 20px)}.topbar{padding:0 10px}.country{max-width:104px;text-align:right}.intro h1{font-size:30px}.workspace{padding:16px 11px}.panel-heading h2{font-size:16px}.kitchen-results{grid-template-columns:1fr}.deductions-heading{align-items:flex-start}.deductions-heading h3{font-size:13px}}

.guide-content,.guide-section{margin-top:22px;padding:20px 22px;border:1px solid var(--line);border-radius:13px;background:#fff}.guide-content h2,.guide-page h1{margin:0 0 11px;letter-spacing:-.5px}.guide-content p,.guide-section p,.lead{color:#526b67;font-size:14px;line-height:1.7}.guide-content p{margin:8px 0}.guide-link{display:inline-flex;align-items:center;gap:8px;margin-top:8px;color:#087563;font-size:14px;font-weight:700;text-decoration:none}.guide-link:hover,.back-link:hover,footer nav a:hover{text-decoration:underline}.share-button{display:block;margin-top:15px;padding:10px 14px;min-height:44px;border:1px solid #b9ded4;border-radius:9px;background:var(--wash);color:#087563;font:600 13px inherit;cursor:pointer}.share-status{display:block;margin-top:7px;color:var(--muted);font-size:12px}.guide-page{max-width:760px}.guide-page h1{font-size:clamp(32px,5vw,42px)}.guide-page .lead{font-size:16px}.guide-section{margin-top:13px}.guide-section h2{font-size:18px;margin:0 0 8px}.guide-section p{margin:7px 0}.guide-section a{color:#087563;font-weight:600}.back-link{color:#087563;font-size:13px;font-weight:600;text-decoration:none}footer nav{display:flex;justify-content:center;gap:16px;margin-top:8px}footer nav a,footer>a{color:#087563;text-decoration:none}
@media(max-width:560px){.guide-content,.guide-section{padding:16px 14px}.guide-content h2{font-size:19px}.guide-content p,.guide-section p{font-size:13px}.back-link{max-width:135px;text-align:right;font-size:12px}.guide-page .lead{font-size:14px}}

/* Mantiene el valor y su unidad de origen visualmente unidos. */
.converter-row{grid-template-columns:minmax(0,1.8fr) 24px minmax(0,1fr);gap:8px}
.measure-source{display:grid;grid-template-columns:minmax(95px,.8fr) minmax(0,1.25fr);gap:0;min-width:0}
.measure-source>div,.measure-destination{min-width:0}
.measure-source input,.currency-entry .currency-amount input{border-radius:9px 0 0 9px;border-right:0;width:100%;min-width:0}
.measure-source select,.currency-entry .currency-code select{border-radius:0 9px 9px 0;width:100%;min-width:0}
.measure-destination select{width:100%;min-width:0}
.currency-entry{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:0;margin-top:14px}
.currency-entry>div{min-width:0}
@media(max-width:560px){
  .converter-row{grid-template-columns:minmax(0,1fr);gap:8px}
  .measure-source,.measure-destination{grid-column:1}
  .converter-row .swap{transform:rotate(90deg);justify-self:center}
  .currency-entry{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
}
/* Barra principal con navegación de calculadoras y ayudas de lectura */
.topbar{position:sticky;top:0;z-index:100;height:auto;min-height:72px;padding:8px max(calc((100vw - 1340px)/2),18px);gap:12px}
.topbar .tabs{flex:1;min-width:0;max-width:none;justify-content:center;margin:0;padding:4px;background:transparent}
.topbar .tab{padding:9px 10px;font-size:12px}
.topbar .country{white-space:nowrap}
.field-help,.calculation-note{display:block;color:#657a7d;font-size:11px;line-height:1.5;margin:5px 0 10px}
.calculation-note{padding:9px 11px;border-left:3px solid #9bcfc2;background:#f6faf8;border-radius:0 8px 8px 0}
.money-field{margin-bottom:2px}
.money-field input{min-width:0}
.currency-entry{align-items:end}
.currency-rate-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:12px;margin-top:14px}
.currency-rate-row .input-wrap input{min-width:0}
.currency-rate-row .add-button{min-height:46px;white-space:nowrap}
.currency-rate-row .field-help{margin-bottom:0}
.other-currency{margin-top:12px}
.other-currency input{width:100%}
#currencyRateStatus{margin:8px 0;color:#526b67}
.saving-guide{margin:13px 0 16px;padding:15px 17px;border:1px solid var(--line);border-radius:11px;background:#f7faf9;color:#526b67;font-size:13px;line-height:1.55}
.saving-guide strong{color:var(--ink)}
.saving-guide ol{padding-left:20px;margin:8px 0}
.saving-guide li{margin:4px 0}
.saving-guide p{margin:8px 0 0}
.discount-input-wrap{height:40px;padding:0 9px;font-size:12px}
.discount-input-wrap input{height:100%;min-height:0;padding-left:5px;font-size:12px}
@media(max-width:1100px){
  .topbar{flex-wrap:wrap;justify-content:space-between;padding:8px 18px}
  .topbar .country{margin-left:auto}
  .topbar .tabs{order:3;flex:1 0 100%;justify-content:flex-start;width:100%;max-width:100%;overflow-x:auto}
}
@media(max-width:560px){
  .topbar{position:sticky;min-height:0;gap:4px;padding:7px 10px}
  .topbar .tabs{padding:3px 0;gap:4px}
  .topbar .tab{padding:8px 10px;font-size:11px}
  .currency-entry{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
  .currency-rate-row{grid-template-columns:1fr;align-items:stretch}
  .currency-rate-row .add-button{width:100%}
  .saving-guide{padding:12px 13px}
}
.number-prefix{white-space:nowrap;color:#657a7d;font-size:13px;font-variant-numeric:tabular-nums}.discount-percent .number-prefix{color:#657a7d}.other-currency>input{height:46px;border:1px solid #dce7e4;border-radius:9px;padding:0 12px;background:#fff;outline-color:#63b7a5}
.topbar .tab{font:inherit;font-size:12px;font-weight:600}

/* Navegación de alto contraste y marca propia */
.brand-mark{width:40px;height:40px;flex:0 0 40px;padding:0;border-radius:14px;background:transparent;overflow:visible}
.brand-mark svg{display:block;width:100%;height:100%}
.topbar .tab{color:#17191a;border-radius:9px;transition:background-color .15s ease,box-shadow .15s ease}
.topbar .tab:hover{background:#f5f5f5;color:#111}
.topbar .tab.active{background:#f0f1f1;color:#111;box-shadow:inset 0 0 0 1px #e1e3e3}
.brand strong{color:#086b66}
@media(max-width:560px){.brand-mark{width:36px;height:36px;flex-basis:36px}}

.pdf-actions{display:flex;align-items:center;gap:12px;margin-top:18px;flex-wrap:wrap}.pdf-actions .add-button{min-height:42px;padding:10px 14px}.pdf-actions small,.pdf-status{color:#657a7d;font-size:11px;line-height:1.45}.pdf-status:empty{display:none}.pdf-status{margin:7px 0 0}
@media(max-width:560px){.pdf-actions{align-items:stretch;flex-direction:column;gap:7px}.pdf-actions .add-button{width:100%}}

/* Entrada sutil y movimiento reducido para una navegación más fluida */
@keyframes claraDropIn{from{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}
@keyframes claraRiseIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@keyframes claraPanelIn{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:translateY(0)}}
.topbar{animation:claraDropIn .48s cubic-bezier(.2,.7,.25,1) both}
.intro{animation:claraRiseIn .52s .07s cubic-bezier(.2,.7,.25,1) both}
.workspace{animation:claraRiseIn .56s .14s cubic-bezier(.2,.7,.25,1) both}
footer{animation:claraRiseIn .48s .2s cubic-bezier(.2,.7,.25,1) both}
.panel.active{animation:claraPanelIn .38s cubic-bezier(.2,.7,.25,1) both}
.panel.active .result-grid .result{animation:claraRiseIn .38s cubic-bezier(.2,.7,.25,1) both}
.panel.active .result-grid .result:nth-child(2){animation-delay:.035s}
.panel.active .result-grid .result:nth-child(3){animation-delay:.07s}
.panel.active .result-grid .result:nth-child(4){animation-delay:.105s}
.panel.active .result-grid .result:nth-child(5){animation-delay:.14s}
.panel.active .result-grid .result:nth-child(6){animation-delay:.175s}
.panel.active .result-grid .result:nth-child(7){animation-delay:.21s}
.tab,.add-button,.share-button,.kitchen-result,.remove-button{transition:color .18s ease,background-color .18s ease,border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.add-button:hover,.share-button:hover{transform:translateY(-1px);box-shadow:0 4px 12px #173c3010}
.kitchen-result:hover{transform:translateY(-2px)}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

.currency-entry{align-items:start}

.currency-entry{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:start}.currency-entry>div{min-width:0}.currency-custom-entry{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.currency-custom-entry>div{min-width:0}.currency-entry .input-wrap,.currency-entry select{width:100%;min-width:0}.currency-entry .input-wrap{padding:0 9px}.currency-entry .input-wrap input{padding-left:6px}.currency-custom-entry .field-help{margin-top:5px}
@media(max-width:700px){.currency-entry{grid-template-columns:repeat(2,minmax(0,1fr))}.currency-entry .currency-amount{grid-column:1/-1}}
@media(max-width:560px){.currency-entry,.currency-custom-entry{grid-template-columns:1fr}.currency-entry .currency-amount{grid-column:auto}.currency-entry .currency-code select{border-radius:9px}.currency-entry .currency-amount input{border-radius:0 9px 9px 0}}

.currency-entry .currency-code select{border-radius:9px}

/* Las calculadoras ahora son enlaces entre páginas independientes. */
.topbar .tab{text-decoration:none;display:inline-block}


/* Logo monocromático compartido por las páginas del sitio. */
.brand-mark img{display:block;width:100%;height:100%;object-fit:contain}
