/*! © 2026 Huascar Trinidad · TrinaxCode. Todos los derechos reservados / All rights reserved. Uso: https://trinaxcode.com/terminos/ */
.card__media.has-demo{position:relative;overflow:hidden;background:#0b1018 50% 0 / cover no-repeat}.card__demo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;user-select:none;-webkit-user-drag:none;transition:transform .9s var(--ease-out)}.card__media.has-demo:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 60%,rgba(13,18,27,.45))}.card__media.has-demo>.art__big,.card__media.has-demo>.art__code,.card__media.has-demo>.pv{display:none}.card--pm>article{cursor:pointer}@media(hover:hover){.card--pm:hover .card__demo{transform:scale(1.035)}}.card__more{display:inline-flex;align-items:center;gap:6px;min-height:44px;margin-left:auto;font:600 15px/1 var(--f-body);color:var(--ink-2);background:none;border:0;padding:0;cursor:pointer;border-bottom:1px solid transparent;transition:color var(--d-fast),border-color var(--d-fast)}.card__more svg{color:var(--blue-hi);transition:transform var(--d-med) var(--ease-out)}.card__more:focus-visible{outline:2px solid var(--blue-hi);outline-offset:3px;border-radius:4px}@media(hover:hover){.card--pm:hover .card__more{color:var(--ink)}.card__more:hover{border-color:var(--blue-hi)}.card--pm:hover .card__more svg{transform:rotate(90deg)}}.tai-panel__art.has-demo{cursor:pointer;justify-content:flex-end;align-items:flex-start;padding:var(--s-5);background:#0b1018 50% 0 / cover no-repeat}.tai-panel__demo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 0;user-select:none;-webkit-user-drag:none;transition:transform .9s var(--ease-out)}.tai-panel__art.has-demo:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,transparent 45%,rgba(9,13,20,.88))}.tai-panel__art.has-demo .tai-panel__ring{display:none}.tai-panel__art.has-demo .tai-wordmark,.tai-panel__art.has-demo .art__code{z-index:1}.tai-panel__art.has-demo .tai-wordmark img{width:clamp(130px,12vw,170px)}.tai-panel__art.has-demo:focus-visible{outline:2px solid var(--blue-hi);outline-offset:-4px}@media(hover:hover){.tai-panel:hover .tai-panel__demo{transform:scale(1.03)}}@media(min-width:900px){.tai-panel__art.has-demo{min-height:380px}}html.pm-open{overflow:hidden}.pm{width:100%;max-width:none;height:100%;max-height:none;margin:0;padding:clamp(12px,3vw,40px);border:0;background:#06090fb8;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:var(--ink);overflow:hidden;display:none;place-items:center}.pm[open]{display:grid;animation:pm-fade .32s var(--ease-out)}.pm::backdrop{background:transparent}.pm.is-closing{animation:pm-fade-out .26s ease-in forwards}.pm.is-closing .pm__panel{transform:scale(.97) translateY(10px);opacity:0;transition:transform .26s ease-in,opacity .26s ease-in}@keyframes pm-fade{0%{background-color:#06090f00;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}@keyframes pm-fade-out{to{background-color:#06090f00;-webkit-backdrop-filter:blur(0);backdrop-filter:blur(0)}}.pm__panel{position:relative;width:min(100%,1040px,calc(56svh * var(--ar, 1.7778)));max-height:100%;overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--line-2);border-radius:20px;background:#111722f0;box-shadow:0 60px 140px -40px #000000e6,0 0 0 1px #4aa8f014;scrollbar-width:thin;scrollbar-color:var(--line-2) transparent}.pm__media{position:relative;aspect-ratio:var(--ar, 1.7778);background:#0b1018;border-bottom:1px solid var(--line)}.pm__img{display:block;width:100%;height:100%;object-fit:contain;user-select:none;-webkit-user-drag:none}.pm__nodemo{display:none}.pm__media.is-empty{display:grid;place-items:center;aspect-ratio:16 / 6;background-image:radial-gradient(rgba(74,168,240,.45) 1.5px,transparent 1.7px);background-size:18px 18px}.pm__media.is-empty .pm__nodemo{display:block;font-family:var(--f-display);font-weight:700;font-size:clamp(36px,6vw,72px);letter-spacing:-.04em;color:var(--ink)}.pm__body{display:grid;gap:var(--s-4);padding:clamp(20px,3.4vw,40px)}.pm__meta{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--ink-3)}.pm__num{color:var(--blue-hi)}.pm__title{margin:0;font-family:var(--f-display);font-weight:700;font-size:clamp(30px,4vw,52px);line-height:1;letter-spacing:-.035em}.pm__lead{margin:0;max-width:64ch;color:var(--ink-2);font-size:clamp(17px,1.4vw,19px);line-height:1.6}.pm__cols{display:grid;gap:var(--s-5);margin-top:var(--s-2)}@media(min-width:760px){.pm__cols{grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:var(--s-6)}}.pm__h{margin:0 0 12px;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--blue-hi)}.pm__did{display:grid;gap:10px;margin:0;padding:0;list-style:none}.pm__did li{position:relative;padding-left:22px;color:var(--ink-2);font-size:16px;line-height:1.5}.pm__did li:before{content:"";position:absolute;left:2px;top:.62em;width:8px;height:8px;border-radius:50%;background:var(--blue-hi);box-shadow:0 0 10px #4aa8f0b3}.pm__stack{margin:0;padding:0;list-style:none}.pm__links{display:flex;flex-wrap:wrap;gap:12px;margin-top:var(--s-2)}.pm__links .btn svg{flex:none}.pm__private{margin:0;font-size:13px;color:var(--ink-3)}.pm__btn{position:absolute;z-index:2;display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--line-2);background:#171d29d9;color:var(--ink);cursor:pointer;transition:background-color var(--d-fast),border-color var(--d-fast),transform var(--d-fast)}.pm__btn:focus-visible{outline:2px solid var(--blue-hi);outline-offset:3px}@media(hover:hover){.pm__btn:hover{border-color:var(--blue-hi);background:#0074b659}}.pm__close{top:16px;right:16px}.pm__nav{top:50%;margin-top:-24px}.pm__nav--prev{left:clamp(8px,1.6vw,28px)}.pm__nav--next{right:clamp(8px,1.6vw,28px)}@media(hover:hover){.pm__nav--prev:hover{transform:translate(-3px)}.pm__nav--next:hover{transform:translate(3px)}}@media(max-width:1199px){.pm{padding-inline:12px}.pm__nav{top:auto;bottom:16px;margin-top:0;width:44px;height:44px}.pm__nav--prev{left:50%;margin-left:-52px}.pm__nav--next{right:50%;margin-right:-52px}.pm{padding-bottom:76px}}@media(max-width:767px){.pm{padding:0 0 72px}.pm__panel{border-radius:0 0 18px 18px;border-top:0}.pm__close{top:10px;right:10px;width:44px;height:44px}}@media(prefers-reduced-motion:reduce){.pm[open],.pm.is-closing{animation:none}.card__demo,.tai-panel__demo{transition:none}}