.kys{--kys-gap:26px;--kys-height:390px;--kys-main:65%;--kys-radius:24px;--kys-pad:25px;--kys-side-pad:18px;--kys-side-height:190px;--kys-mobile-columns:2;--kys-zoom:1.035;--kys-position:center center;--kys-title:#fff;--kys-side-title:#fff;--kys-date:#fff;--kys-lines:3;--kys-side-lines:3;--kys-main-bg:#284bd8;--kys-side-bg:#ad0c22;--kys-side-bg-2:#c620de;--kys-overlay-top:#0000;--kys-overlay-bottom:#000c;--kys-overlay-start:35%;--kys-nav-bg:#000;--kys-nav-color:#fff;--kys-active-bg:#00a568;--kys-active-color:#fff;--kys-nav-hover:#ffffff26;--kys-number-size:32px;--kys-nav-pad:4px;--kys-badge-bg:#fff;--kys-badge-color:#284bd8;--kys-badge-radius:24px;--kys-badge-offset:16px;--kys-arrow-bg:#fff;--kys-arrow-color:#284bd8;--kys-arrow-size:38px;display:grid;grid-template-columns:minmax(0,var(--kys-main)) minmax(0,1fr);gap:var(--kys-gap);width:100%;min-width:0;isolation:isolate;font-family:inherit;line-height:1.3;text-align:start;direction:ltr}
.kys,.kys *{box-sizing:border-box}.kys [hidden]{display:none!important}.kys button{font:inherit;text-transform:none;letter-spacing:normal;cursor:pointer;margin:0;box-shadow:none;border:0;outline-offset:3px;min-width:0}.kys button:focus-visible,.kys a:focus-visible{outline:3px solid #ffda64;outline-offset:-4px}.kys-main,.kys-side-card{border-radius:var(--kys-radius);overflow:hidden;min-width:0}.kys-main{background:var(--kys-main-bg);align-self:start}.kys-stage{height:var(--kys-height);position:relative;overflow:hidden}.kys-slide,.kys-side-card{position:relative;display:block;text-decoration:none!important;color:var(--kys-title);background:var(--kys-main-bg);overflow:hidden}.kys-slide{position:absolute;inset:0;opacity:0;visibility:hidden;pointer-events:none;z-index:0;transition:opacity var(--kys-duration,650ms) ease,transform var(--kys-duration,650ms) cubic-bezier(.2,.7,.25,1),filter var(--kys-duration,650ms) ease,visibility 0s var(--kys-duration,650ms)}.kys-slide.is-active{opacity:1;visibility:visible;pointer-events:auto;z-index:1;transform:none!important;filter:none!important;transition-delay:0s}.kys[data-effect=soft] .kys-slide{transform:translate3d(0,8px,0) scale(1.015);filter:blur(7px)}.kys[data-effect=slide] .kys-slide{transform:translate3d(5%,0,0)}.kys[data-effect=zoom] .kys-slide{transform:scale(1.06)}.kys[data-effect=lift] .kys-slide{transform:translate3d(0,8%,0)}.kys-image{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;object-position:var(--kys-position);display:block;max-width:none!important;border-radius:0!important;transition:transform .8s cubic-bezier(.2,.7,.25,1)}
.kys-shade{position:absolute;inset:0;background:linear-gradient(to bottom,var(--kys-overlay-top) var(--kys-overlay-start),var(--kys-overlay-bottom) 100%);pointer-events:none}.kys-caption{position:absolute;inset:auto var(--kys-pad) var(--kys-pad);display:block;z-index:2;padding-right:calc(var(--kys-arrow-size) + 12px)}.kys-title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:var(--kys-lines);overflow:hidden;color:var(--kys-title);font-size:clamp(20px,2.3vw,28px);font-weight:700;line-height:1.15;overflow-wrap:anywhere;text-wrap:pretty}.kys-date{display:block;font-size:14px;line-height:1.3;margin-bottom:4px;color:var(--kys-date)}.kys-badge{position:absolute;top:var(--kys-badge-offset);left:var(--kys-badge-offset);z-index:3;background:var(--kys-badge-bg);color:var(--kys-badge-color);padding:5px 11px;border-radius:var(--kys-badge-radius);font-size:13px;font-weight:500;line-height:1.3;max-width:75%;overflow-wrap:anywhere}.kys-arrow{position:absolute;bottom:var(--kys-pad);right:var(--kys-pad);width:var(--kys-arrow-size);height:var(--kys-arrow-size);border-radius:50%;background:var(--kys-arrow-bg);color:var(--kys-arrow-color);display:grid;place-items:center;z-index:3}.kys-arrow svg{width:64%;height:64%;display:block}.kys-nav{display:grid;grid-template-columns:repeat(auto-fit,minmax(var(--kys-number-size),1fr));gap:4px;align-items:center;padding:var(--kys-nav-pad) 18px;background:var(--kys-nav-bg);position:relative;z-index:2}.kys .kys-number{display:grid;place-items:center;justify-self:center;width:var(--kys-number-size);height:var(--kys-number-size);padding:0;border-radius:50%;background:transparent;color:var(--kys-nav-color);font-size:20px;font-weight:700;line-height:1;transition:background-color .2s,color .2s,transform .2s}.kys .kys-number:hover{background:var(--kys-nav-hover);color:var(--kys-nav-color)}.kys .kys-number.is-active{background:var(--kys-active-bg);color:var(--kys-active-color)}.kys-side{display:grid;grid-auto-rows:minmax(0,1fr);gap:var(--kys-gap);min-width:0;min-height:0}.kys-side-card{height:100%;min-height:160px;background:var(--kys-side-bg)}.kys-side-2{background:var(--kys-side-bg-2)}.kys-side-card .kys-caption{inset:auto var(--kys-side-pad) var(--kys-side-pad);padding-right:0}.kys-side-card .kys-title{font-size:clamp(17px,1.6vw,21px);color:var(--kys-side-title);-webkit-line-clamp:var(--kys-side-lines)}.kys-side-card .kys-date{font-size:11px}.kys-side-card .kys-arrow{top:10px;right:10px;bottom:auto}.kys .kys-pause{position:absolute;top:14px;right:14px;z-index:4;width:30px;height:30px;display:grid;place-items:center;border-radius:50%;background:#0007;color:#fff;font-size:14px;line-height:1;padding:0;backdrop-filter:blur(6px)}.kys .kys-pause:hover{background:#000b;color:#fff}.kys-no-side,.kys-no-main{grid-template-columns:minmax(0,1fr)}.kys-no-main .kys-side{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:var(--kys-side-height)}.kys-sr{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}.kys-editor-note{padding:16px;background:#f2f5fc;border:1px dashed #9baad1;color:#29385b;font:14px/1.5 sans-serif}
@media(hover:hover){.kys-slide:hover .kys-image,.kys-side-card:hover .kys-image{transform:scale(var(--kys-zoom))}}
@media(max-width:1024px){.kys{--kys-gap:20px;--kys-height:340px;--kys-pad:22px;--kys-side-pad:16px;--kys-number-size:30px;--kys-arrow-size:34px}.kys-title{font-size:23px}.kys-side-card .kys-title{font-size:18px}.kys-nav{padding-inline:10px}.kys .kys-number{font-size:20px}}
@media(max-width:767px){.kys{--kys-gap:14px;--kys-height:280px;--kys-pad:18px;--kys-side-pad:12px;--kys-number-size:28px;--kys-arrow-size:30px;grid-template-columns:minmax(0,1fr)}.kys-side,.kys-no-main .kys-side{grid-template-columns:repeat(var(--kys-mobile-columns),minmax(0,1fr));grid-auto-rows:var(--kys-side-height)}.kys-side-card{min-height:0}.kys-title{font-size:22px}.kys-side-card .kys-title{font-size:16px;line-height:1.2}.kys-date{font-size:12px}.kys-side-card .kys-date{font-size:10px}.kys-nav{padding-inline:8px}.kys .kys-number{font-size:19px}.kys-badge{font-size:12px}}
@media(prefers-reduced-motion:reduce){.kys .kys-slide,.kys .kys-image,.kys .kys-number{transition:none!important;transform:none!important;filter:none!important}}
/* Compact navigation and optional separators. */
.kys-stage { touch-action: pan-y; }
.kys {
    --kys-nav-pad-x: 12px;
    --kys-nav-gap-x: 4px;
    --kys-nav-gap-y: 2px;
    --kys-number-radius: 0px;
    --kys-separator-color: #ffffff40;
    --kys-separator-width: 1px;
    --kys-separator-height: 60%;
    --kys-text-bg: #000000d9;
    --kys-text-x: 10px;
    --kys-text-y: 4px;
    --kys-text-radius: 2px;
    --kys-caption-gap: 6px;
    --kys-blur: 10px;
    --kys-blur-start: 40%;
}
.kys .kys-nav {
    gap: var(--kys-nav-gap-y) var(--kys-nav-gap-x);
    padding: var(--kys-nav-pad) var(--kys-nav-pad-x);
}
.kys-nav-item {
    position: relative;
    display: grid;
    place-items: center;
    min-width: 0;
}
.kys[data-separators="yes"] .kys-nav-item:not(:last-child)::after {
    content: "";
    position: absolute;
    inset-inline-end: calc(var(--kys-nav-gap-x) / -2);
    top: calc((100% - var(--kys-separator-height)) / 2);
    width: var(--kys-separator-width);
    height: var(--kys-separator-height);
    background: var(--kys-separator-color);
    pointer-events: none;
}
.kys[data-nav-shape="square"] .kys-number,
.kys[data-nav-shape="segments"] .kys-number { border-radius: var(--kys-number-radius); }
.kys[data-nav-shape="segments"] .kys-number { width: 100%; }
.kys[data-separators="yes"] .kys-nav-item.is-row-end::after { display: none; }

/* Each card reveals its own decorative arrow; keyboard users get the same cue. */
.kys[data-arrow-visibility="hover"] .kys-arrow {
    opacity: 0;
    transform: translateX(-4px);
    transition: opacity .2s ease, transform .2s ease;
    pointer-events: none;
}
.kys[data-arrow-visibility="hover"] a:focus-visible .kys-arrow,
.kys[data-arrow-visibility="hover"] a:active .kys-arrow {
    opacity: 1;
    transform: none;
}
@media (hover: hover) {
    .kys[data-arrow-visibility="hover"] .kys-slide:hover .kys-arrow,
    .kys[data-arrow-visibility="hover"] .kys-side-card:hover .kys-arrow { opacity: 1; transform: none; }
}
.kys[data-arrows="no"] .kys-caption { padding-right: 0; }

/* Text backgrounds follow each line, with a separate whole-title option. */
.kys .kys-date { margin-bottom: var(--kys-caption-gap); }
.kys[data-readability="text"] .kys-shade,
.kys[data-readability="none"] .kys-shade,
.kys[data-readability="blur"] .kys-shade { display: none; }
.kys[data-readability="text"] .kys-title {
    width: fit-content;
    max-width: 100%;
    padding: var(--kys-text-y) var(--kys-text-x);
    line-height: calc(1.2em + var(--kys-text-y) * 2);
}
.kys[data-readability="text"] .kys-title-text,
.kys[data-readability="text"][data-date-background="yes"] .kys-date-text {
    background: var(--kys-text-bg);
    padding: var(--kys-text-y) var(--kys-text-x);
    border-radius: var(--kys-text-radius);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
}
.kys[data-readability="text"][data-date-background="yes"] .kys-date {
    width: fit-content;
    max-width: 100%;
    padding: var(--kys-text-y) var(--kys-text-x);
    line-height: calc(1.3em + var(--kys-text-y) * 2);
}
.kys[data-readability="text"][data-text-box="block"] .kys-title {
    background: var(--kys-text-bg);
    border-radius: var(--kys-text-radius);
    line-height: 1.2;
}
.kys[data-readability="text"][data-text-box="block"] .kys-title-text { background: none; padding: 0; }

/* One masked backdrop layer blends the sharp image into the blurred lower region. */
.kys-blur {
    position: absolute;
    inset: var(--kys-blur-start) 0 0;
    pointer-events: none;
    background: linear-gradient(to bottom, #0000, #000a);
}
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) and ((mask-image: linear-gradient(#0000, #000)) or (-webkit-mask-image: linear-gradient(#0000, #000))) {
    .kys-blur {
        background: transparent;
        -webkit-backdrop-filter: blur(var(--kys-blur));
        backdrop-filter: blur(var(--kys-blur));
        -webkit-mask-image: linear-gradient(to bottom, transparent, #000 85%);
        mask-image: linear-gradient(to bottom, transparent, #000 85%);
    }
}
@media (max-width: 1024px) { .kys { --kys-nav-pad-x: 10px; } }
@media (max-width: 767px) {
    .kys { --kys-nav-pad-x: 8px; }
    .kys:not([data-mobile-blur="yes"]) .kys-blur {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        -webkit-mask-image: none;
        mask-image: none;
        background: linear-gradient(to bottom, #0000, #000a);
    }
}
@media (prefers-reduced-motion: reduce) { .kys .kys-arrow { transition: none; transform: none; } }
.kys[data-readability="blur_gradient"] .kys-blur { background: transparent; }