
:root {
    --tb: 64px;
}

:root {
    --blue: #1F75BC;
    --blue-dark: #175F99;
    --blue-pale: #EEF7FD;
    --line: #D7EAF7;
    --ink: #17324D;
    --ink-2: #5F7182;
    --white: #FFFFFF;
    --wrap: 1220px;
    --sp: clamp(64px, 9.5vh, 124px);
    --sph: clamp(28px, 4vh, 46px);
    --hdr: 106px;
    --ubar: 34px;
    --r-card: 20px;
    --r-in: 12px;
    --r-pill: 100px;
    --bw: 1px;
    --bw-btn:1px;
    --sh-card: 0 1px 3px rgba(23, 50, 77, .03), 0 10px 30px rgba(23, 50, 77, .05);
    --lift: -3px;
    --sh-hov: 0 2px 6px rgba(23, 50, 77, .04),
    0 18px 44px color-mix(in srgb, var(--h, #1F75BC) 20%, transparent);
    --foc: 2px;
    --h1: #1F75BC;
    --h2: #7A4CA6;
    --h3: #CE3E52;
    --h4: #2E9E5B;
    --h5: #E07B22;
    --h6: #3F51C4;
    --h7: #0E9488;
    --h8: #C43A78;
    --h9: #D9663C;
    --h10: #6B9E28;
    --h11: #1C93B8;
    --h12: #9C7B1E;
    --h13: #A03E93;
    --h14: #2F9E44;
    --h15: #F59F00;
    --h16: #4263EB;
    --h17: #AE3EC9;
    --h18: #0CA678;
    --h19: #E8590C;
    --h20: #495057;

    --ok: #1E8E5A;
    --ok-bg: #E6F5EC;
    --warn: #B4750F;
    --warn-bg: #FDF3E0;
    --info: #1F75BC;
    --info-bg: #EAF4FC;
}

.hero {
    position: relative;
    min-height: calc(100svh - var(--hdr));
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-top: clamp(16px, 3vh, 38px);
}

.blobs {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
    overflow: hidden;
}

.blob {
    position: absolute;
    border-radius: 50%;
    filter: blur(40px);
}

.b1 {
    width: 52vw;
    height: 52vw;
    left: -14vw;
    top: -16vw;
    background: radial-gradient(circle, rgba(31, 117, 188, .09) 0%, rgba(31, 117, 188, 0) 68%);
    animation: drift1 68s ease-in-out infinite;
}

.b2 {
    width: 44vw;
    height: 44vw;
    right: -12vw;
    top: 2vw;
    background: radial-gradient(circle, rgba(31, 117, 188, .072) 0%, rgba(31, 117, 188, 0) 68%);
    animation: drift2 84s ease-in-out infinite;
}

.b3 {
    width: 38vw;
    height: 38vw;
    left: 34vw;
    top: 24vw;
    background: radial-gradient(circle, rgba(23, 95, 153, .06) 0%, rgba(23, 95, 153, 0) 70%);
    animation: drift3 96s ease-in-out infinite;
}

@keyframes drift1 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(5vw, 3vw) scale(1.1);
    }
}

@keyframes drift2 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(-4vw, 4vw) scale(1.08);
    }
}

@keyframes drift3 {
    0%, 100% {
        transform: translate(0, 0) scale(1);
    }
    50% {
        transform: translate(3vw, -3vw) scale(1.12);
    }
}

.waves {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 46vh;
    z-index: 0;
    pointer-events: none;
    opacity: .6;
}

.waves svg {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 220%;
    height: 100%;
}

.waves path {
    fill: none;
    stroke: var(--blue);
    stroke-width: 1.1;
    opacity: .195;
}

.wv1 {
    animation: slide 90s linear infinite;
}

.wv2 {
    animation: slide 130s linear infinite reverse;
    opacity: .7;
}

@keyframes slide {
    from {
        transform: translateX(0);
    }
    to {
        transform: translateX(-50%);
    }
}

.pano {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 1;
    pointer-events: none;
}

.pano {
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 7%, #000 93%, transparent 100%);
}

#pano {
    width: 108%;
    margin-left: -4%;
    height: auto;
    display: block;
    opacity: 0;
    transition: opacity .8s ease-out;
    mix-blend-mode: multiply;
    -webkit-mask-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, .18) 22%, rgba(0, 0, 0, .62) 44%, #000 66%, #000 100%);
    mask-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, .18) 22%, rgba(0, 0, 0, .62) 44%, #000 66%, #000 100%);
}

#pano.on {
    opacity: .8;
}

.hero-top {
    position: relative;
    z-index: 3;
    text-align: center;
    flex: 0 0 auto;
}

.hero-sp {
    flex: 1 1 auto;
    min-height: clamp(170px, 30vh, 340px);
}

.rv {
    opacity: 0;
    transform: translateY(14px);
}

body.ready .rv {
    opacity: 1;
    transform: none;
    transition: opacity .5s cubic-bezier(.22, .7, .3, 1), transform .5s cubic-bezier(.22, .7, .3, 1);
}

body.ready .rv-1 {
    transition-delay: 0ms;
}

body.ready .rv-2 {
    transition-delay: 150ms;
}

body.ready .rv-3 {
    transition-delay: 350ms;
}

body.ready .rv-4 {
    transition-delay: 550ms;
}

h1 {
    margin: 14px 0 0;
    font-weight: 800;
    letter-spacing: -.025em;
    line-height: 1.03;
    font-size: clamp(38px, 6.4vw, 76px);
}

h1 .ht {
    display: inline-block;
    position: relative;
    background-image: linear-gradient(96deg,
    #17324D 0%, #1F75BC 17%, #0E9488 33%, #2E9E5B 45%,
    #1F75BC 59%, #7A4CA6 76%, #17324D 96%);
    background-size: 260% 100%;
    background-position: 6% 50%;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    animation: h1flow 22s ease-in-out infinite;
    margin-top:1.2rem!important;
}

@keyframes h1flow {
    0%, 100% {
        background-position: 6% 50%;
    }
    50% {
        background-position: 94% 50%;
    }
}

h1 .uln {
    position: absolute;
    left: 1.5%;
    width: 97%;
    bottom: -.045em;
    height: .15em;
    overflow: visible;
    color: #8CC8EC;
    pointer-events: none;
}

h1 .uln path {
    fill: none;
    stroke: currentColor;
    stroke-width: 5.5;
    stroke-linecap: round;
    stroke-dasharray: 210;
    stroke-dashoffset: 210;
}

body.ready h1 .uln path {
    animation: uDraw 1.2s .95s cubic-bezier(.3, .85, .3, 1) forwards;
}

@keyframes uDraw {
    to {
        stroke-dashoffset: 0;
    }
}

.bubs {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 2;
    pointer-events: none;
}

.bub {
    position: absolute;
    opacity: 0;
    transform: translate(-50%, 12px) scale(.94);
    transition: opacity .75s ease, transform .85s cubic-bezier(.22, .7, .3, 1);
}

.bub.on {
    opacity: 1;
    transform: translate(-50%, 0) scale(1);
}

.bub .bb {
    position: relative;
    display: flex;
    align-items: center;
    gap: 7px;
    white-space: nowrap;
    background: rgba(255, 255, 255, .84);
    -webkit-backdrop-filter: blur(7px);
    backdrop-filter: blur(7px);
    border: 1px solid rgba(31, 117, 188, .26);
    border-radius: 100px 100px 100px 7px;
    padding: 7px 14px 7px 11px;
    font-size:12px;
    font-weight: 500;
    color: #2E5F87;
    letter-spacing: .005em;
    box-shadow: 0 3px 12px rgba(23, 50, 77, .07);
}

.bub .bd {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--h);
    flex: 0 0 auto;
}

.bub i {
    position: absolute;
    display: block;
    border-radius: 50%;
    background: rgba(255, 255, 255, .82);
    border: 1px solid rgba(31, 117, 188, .34);
}

.bub i.t1 {
    width: 8px;
    height: 8px;
    left: 9px;
    bottom: -11px;
}

.bub i.t2 {
    width: 4px;
    height: 4px;
    left: 4px;
    bottom: -19px;
}

.search {
    margin: clamp(16px, 2.2vh, 28px) auto 0;
    background: linear-gradient(180deg, rgba(255, 255, 255, .84), rgba(255, 255, 255, .62));
    -webkit-backdrop-filter: blur(24px) saturate(178%);
    backdrop-filter: blur(24px) saturate(178%);
    border: 1px solid rgba(255, 255, 255, .85);
    border-radius: var(--r-card);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .95) inset,
    0 2px 6px rgba(23, 50, 77, .04), 0 20px 52px rgba(23, 50, 77, .1);
    padding: 13px;
    text-align: left;
    transition: box-shadow .25s, border-color .25s, transform .25s, background .25s;
}

.search:focus-within {
    background: linear-gradient(180deg, rgba(255, 255, 255, .95), rgba(255, 255, 255, .82));
    border-color: rgba(190, 220, 241, .95);
    transform: translateY(-2px);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .95) inset,
    0 3px 8px rgba(23, 50, 77, .05), 0 26px 62px rgba(31, 117, 188, .16);
}

.srow {
    display: flex;
    align-items: center;
    gap: 11px;
}

.sfield {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 11px;
    background: rgba(255, 255, 255, .68);
    border: 1px solid rgba(215, 234, 247, .95);
    border-radius: var(--r-in);
    padding: 0 16px;
    height: 54px;
    transition: border-color .18s, box-shadow .18s, background .18s;
}

.sfield:focus-within {
    background: #fff;
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .12);
}

.sfield input {
    flex: 1;
    border: 0;
    outline: 0;
    background: none;
    font-size: 15px;
    height: 100%;
    min-width: 0;
}

.sfield input::placeholder {
    color: #93A7B8;
}

.sbtn {
    height: 54px;
    padding: 0 25px;
    border-radius: var(--r-in);
    background: var(--blue);
    color: #fff;
    font-size:14px;
    font-weight: 600;
    white-space: nowrap;
    transition: background .18s, transform .18s;
}

.sbtn:hover {
    background: var(--blue-dark);
}

.sbtn:active {
    transform: scale(.985);
}

.sbtn:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.sfield input:focus-visible {
    outline: none;
}

.tags {
    display: none;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 11px;
}

.tags.has {
    display: flex;
}

.tag {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: var(--blue-pale);
    border: 1px solid #C3E0F5;
    border-radius: var(--r-pill);
    padding: 5px 7px 5px 12px;
    font-size: 12px;
    font-weight: 600;
    color: var(--blue);
}

.tag b {
    font-weight: 500;
    color: var(--ink-2);
}

.tag button {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--blue);
    transition: .15s;
}

.tag button:hover {
    background: #D3E9F8;
}

.tag button:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 1px;
}

.clearall {
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-2);
    text-decoration: underline;
    align-self: center;
}

.clearall:hover {
    color: var(--blue);
}

.catwrap {
    margin: clamp(14px, 2vh, 24px) 0 0;
    overflow: hidden;
    position: relative;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
}

.cattrack {
    display: flex;
    gap: 8px;
    width: max-content;
    animation: marquee 52s linear infinite;
}

@keyframes marquee {
    to {
        transform: translateX(-50%);
    }
}

.catwrap:hover .cattrack, .cattrack:focus-within {
    animation-play-state: paused;
}

.cat {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    padding: 13px 10px 12px;
    border-radius: var(--r-card);
    position: relative;
    flex: 0 0 auto;
    width: 114px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    box-shadow: var(--sh-card);
    transition: background .2s, border-color .2s, transform .2s, box-shadow .2s;
}

.cat .ico {
    width: 33px;
    height: 33px;
    display: block;
    transition: color .2s;
}

.cat .ico.ico-bi {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    line-height: 1;
}

.cat .nm {
    font-size:11px;
    font-weight: 500;
    color: var(--ink-2);
    text-align: center;
    line-height: 1.3;
    transition: color .2s;
}

.cnum {
    position: absolute;
    top: 7px;
    right: 9px;
    min-width: 21px;
    height: 21px;
    padding: 0 5px;
    border-radius: var(--r-pill);
    background: var(--white);
    border: 1px solid var(--line);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:10px;
    font-weight: 700;
    transition: background .2s, border-color .2s, color .2s;
}

.cat {
    --h: var(--blue);
}

.cat .ico {
    color: var(--h);
}

.cnum {
    color: var(--h);
}

.cat:hover, .cat[aria-pressed="true"] {
    background: var(--h);
    border-color: var(--h);
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
}

.cat:hover .ico, .cat[aria-pressed="true"] .ico {
    color: #fff;
}

.cat:hover .nm, .cat[aria-pressed="true"] .nm {
    color: #fff;
    font-weight: 600;
}

.cat:hover .cnum, .cat[aria-pressed="true"] .cnum {
    background: rgba(255, 255, 255, .22);
    border-color: rgba(255, 255, 255, .5);
    color: #fff;
}

.cat:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.cat .chk {
    position: absolute;
    top: 8px;
    left: 9px;
    opacity: 0;
    transform: scale(.6);
    color: #fff;
    transition: .18s;
}

.cat[aria-pressed="true"] .chk {
    opacity: 1;
    transform: none;
}

.ico [data-d] {
    stroke-dasharray: 100;
    stroke-dashoffset: 100;
}

body.ready .ico [data-d] {
    animation: draw .5s cubic-bezier(.3, .65, .35, 1) forwards;
}

@keyframes draw {
    to {
        stroke-dashoffset: 0;
    }
}

.cat:hover .ico [data-d] {
    animation: draw .34s cubic-bezier(.3, .65, .35, 1) forwards;
}

.replay {
    position: absolute;
    right: 24px;
    bottom: 16px;
    z-index: 4;
    display: inline-flex;
    align-items: center;
    gap: 7px;
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, .9);
    backdrop-filter: blur(3px);
    border-radius: var(--r-pill);
    padding: 7px 13px;
    font-size:11px;
    font-weight: 600;
    color: var(--ink-2);
    opacity: 0;
    transition: opacity .4s, color .16s, border-color .16s;
}

body.drawn .replay {
    opacity: 1;
}

.replay:hover {
    color: var(--blue);
    border-color: #BEDCF1;
}

.replay:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
    opacity: 1;
}

.sec-dom {
    padding: var(--sp) 0;
    background: var(--white);
}

.bento-more {
    margin: 16px 0 0;
    font-size:12px;
    color: var(--ink-2);
}

.bento-more a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-weight: 600;
    color: var(--blue);
}

.bento-more a svg {
    width: 15px;
    height: 15px;
}

.bento {
    display: grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    grid-auto-rows: minmax(152px, auto);
    gap: 14px;
    grid-auto-flow: dense;
}

.bt {
    position: relative;
    overflow: hidden;
    border-radius: var(--r-card);
    text-align: left;
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    border: var(--bw) solid var(--line);
    background: var(--white);
    box-shadow: var(--sh-card);
    transition: transform .26s cubic-bezier(.22, .7, .3, 1), box-shadow .26s,
    background-color .26s, border-color .26s;
    opacity: 0;
    transform: translateY(16px);
}

body.dom-in .bt {
    opacity: 1;
    transform: none;
}

.bt.w2 {
    grid-column: span 2;
}

.bt.h2 {
    grid-row: span 2;
}

.bt::before {
    content: "";
    position: absolute;
    width: 340px;
    height: 340px;
    border-radius: 50%;
    left: var(--mx, 50%);
    top: var(--my, 50%);
    transform: translate(-50%, -50%);
    background: radial-gradient(circle, rgba(255, 255, 255, .26) 0%, rgba(255, 255, 255, 0) 65%);
    opacity: 0;
    transition: opacity .3s;
    pointer-events: none;
}

.bt:hover::before {
    opacity: 1;
}

.bt.solid {
    background: var(--h);
    border-color: var(--h);
}

.bt.solid .bt-lab {
    color: rgba(255, 255, 255, .86);
}

.bt.solid .bt-n {
    color: #fff;
}

.bt.solid .bt-d {
    color: rgba(255, 255, 255, .8);
}

.bt.solid .bt-ico {
    color: rgba(255, 255, 255, .28);
}

.bt:not(.solid) .bt-lab {
    color: var(--h);
}

.bt:not(.solid) .bt-n {
    color: var(--ink);
}

.bt:not(.solid) .bt-d {
    color: var(--ink-2);
}

.bt:not(.solid) .bt-ico {
    color: color-mix(in srgb, var(--h) 16%, transparent);
}

.bt:not(.solid):hover {
    background: var(--h);
    border-color: var(--h);
}

.bt:not(.solid):hover .bt-lab {
    color: rgba(255, 255, 255, .86);
}

.bt:not(.solid):hover .bt-n {
    color: #fff;
}

.bt:not(.solid):hover .bt-d {
    color: rgba(255, 255, 255, .8);
}

.bt:not(.solid):hover .bt-ico {
    color: rgba(255, 255, 255, .3);
}

.bt:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
}

.bt:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.bt-lab {
    font-size:12px;
    font-weight: 700;
    line-height: 1.25;
    letter-spacing: -.005em;
    transition: color .26s;
    position: relative;
}

.bt-n {
    font-size: clamp(34px, 3.6vw, 46px);
    font-weight: 800;
    line-height: .94;
    letter-spacing: -.035em;
    margin-top: 6px;
    font-variant-numeric: tabular-nums;
    transition: color .26s;
    position: relative;
}

.bt.h2 .bt-n {
    font-size: clamp(44px, 4.6vw, 60px);
}

.bt-d {
    font-size:11px;
    line-height: 1.45;
    margin-top: auto;
    padding-top: 12px;
    transition: color .26s;
    position: relative;
    max-width: 30ch;
}

.bt-u {
    font-size: 9px;
    font-weight: 600;
    letter-spacing: .1em;
    text-transform: uppercase;
    opacity: .72;
    margin-top: 4px;
    position: relative;
    transition: color .26s;
}

.bt-ico {
    position: absolute;
    right: -14px;
    bottom: -14px;
    width: 104px;
    height: 104px;
    transition: color .26s, transform .4s cubic-bezier(.22, .7, .3, 1);
    pointer-events: none;
}

.bt.h2 .bt-ico {
    width: 150px;
    height: 150px;
    right: -18px;
    bottom: -18px;
}

.bt:hover .bt-ico {
    transform: scale(1.08) rotate(-4deg);
}

.bt-chk {
    position: absolute;
    top: 16px;
    right: 16px;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .24);
    border: 1px solid rgba(255, 255, 255, .5);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    opacity: 0;
    transform: scale(.6);
    transition: .2s;
}

.bt[aria-pressed="true"] {
    background: var(--h);
    border-color: var(--h);
}

.bt[aria-pressed="true"] .bt-lab {
    color: rgba(255, 255, 255, .86);
}

.bt[aria-pressed="true"] .bt-n {
    color: #fff;
}

.bt[aria-pressed="true"] .bt-d {
    color: rgba(255, 255, 255, .8);
}

.bt[aria-pressed="true"] .bt-ico {
    color: rgba(255, 255, 255, .3);
}

.bt[aria-pressed="true"] .bt-chk {
    opacity: 1;
    transform: none;
}

@media (max-width: 1080px) {
    .bento {
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    .bento {
        grid-template-columns:repeat(2, minmax(0, 1fr));
        grid-auto-rows: minmax(142px, auto);
        gap: 11px;
    }

    .bt.w2, .bt.h2 {
        grid-column: span 2;
        grid-row: span 1;
    }

    .bt.h2 .bt-ico {
        width: 104px;
        height: 104px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .bt {
        opacity: 1 !important;
        transform: none !important;
    }

    .bt-ico {
        transition: none;
    }
}

.sec-inst {
    padding: var(--sp) 0;
    background: var(--white);
}

.insbar {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
}

.insbar p {
    margin: 0;
    font-size: 15px;
    color: var(--ink-2);
}

.insbar p b {
    color: var(--ink);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.insb-all {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    flex: 0 0 auto;
    font-size: 13px;
    font-weight: 600;
    color: var(--blue);
}

.insb-all svg {
    width: 15px;
    height: 15px;
    transition: transform .18s;
}

.insb-all:hover svg {
    transform: translateX(3px);
}

.inshint {
    margin: 0;
    font-size:11px;
    color: var(--ink-3, #93A7B8);
}

.inswrap {
    position: relative;
    overflow: hidden;
    padding: 22px 0 26px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 6%, #000 94%, transparent 100%);
}

.instrack {
    display: flex;
    gap: 14px;
    width: max-content;
    animation: insMq 62s linear infinite;
}

@keyframes insMq {
    to {
        transform: translateX(-50%);
    }
}

.inswrap:hover .instrack, .instrack:focus-within {
    animation-play-state: paused;
}

.insb {
    flex: 0 0 auto;
    width: 152px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 9px;
    padding: 16px 10px 15px;
    border-radius: var(--r-card);
    text-align: center;
    background: var(--white);
    border: var(--bw) solid var(--line);
    box-shadow: var(--sh-card);
    transition: background .2s, border-color .2s, transform .2s, box-shadow .2s;
}

.insb:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
    border-color: color-mix(in srgb, var(--h) 42%, var(--line));
}

.insb:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.insb-l {
    position: relative;
    width: 66px;
    height: 66px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: .01em;
    color: #fff;
    background: var(--h);
    box-shadow: 0 6px 18px color-mix(in srgb, var(--h) 34%, transparent);
}

.insb-c {
    position: absolute;
    right: -6px;
    top: -5px;
    min-width: 28px;
    height: 24px;
    padding: 0 6px;
    border-radius: var(--r-pill);
    background: var(--white);
    border:1px solid var(--h);
    color: var(--h);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:11px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    letter-spacing: 0;
}

.insb-n {
    font-size:12px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.32;
    min-height: 2.64em;
}

.insb-s {
    font-size:10px;
    color: var(--ink-2);
}

.insb-t {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--h);
    opacity: .75;
}

@media (max-width: 680px) {
    .insb {
        width: 126px;
    }

    .insb-l {
        width: 56px;
        height: 56px;
        font-size: 16px;
    }

    .instrack {
        animation-duration: 44s;
    }
}

i.crs-gl {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 52px;
    line-height: 1;
}

.crs-dom i {
    font-size: 12px;
    line-height: 1;
}

.crs-t a {
    color: inherit;
    text-decoration: none;
}

.crs-t a:hover {
    text-decoration: underline;
}

a.crs-cta {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: none;
}

.mvbar {
    margin-top: clamp(24px, 3.4vh, 38px);
    padding-top: clamp(22px, 3vh, 30px);
    border-top: 1px solid var(--line);
}

.mvbar-h {
    display: flex;
    align-items: baseline;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

.mvbar-h > span:first-child {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--ink);
}

.mvbar-l {
    font-size:12px;
    color: var(--ink-2);
}

.mvs {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(250px, 1fr));
    gap: 14px;
}

.mv {
    position: relative;
    overflow: hidden;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    padding: 18px 22px 22px;
    box-shadow: var(--sh-card);
    transition: transform .26s, box-shadow .26s, border-color .26s;
}

.mv::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    background: var(--h);
}

.mv:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
    border-color: color-mix(in srgb, var(--h) 42%, var(--line));
}

.mv-art {
    position: relative;
    height: 116px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    margin-bottom: 13px;
}

.mv-art::before {
    content: "";
    position: absolute;
    left: 2%;
    right: 2%;
    bottom: -8px;
    height: 70%;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(62% 100% at 50% 100%,
    color-mix(in srgb, var(--h) 15%, transparent) 0%, transparent 72%);
}

html.hc .mv-art::before {
    display: none;
}

.mv-art svg {
    width: auto;
    height: var(--mvh, 100px);
    max-width: 100%;
    display: block;
    overflow: visible;
    color: var(--blue);
}

.mv-p {
    fill: none;
    stroke: currentColor;
    stroke-width: var(--mvw, 28);
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: .9;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
}

.mvs.on .mv-p {
    animation: mvDraw 5s cubic-bezier(.36, .12, .28, 1) forwards;
}

.mvs.on .mv:nth-child(2) .mv-p {
    animation-delay: .38s;
}

.mvs.on .mv:nth-child(3) .mv-p {
    animation-delay: .76s;
}

@keyframes mvDraw {
    to {
        stroke-dashoffset: 0;
    }
}

.mv-lab {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--h);
}

.mv h3 {
    margin: 9px 0 8px;
    font-size:15px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -.008em;
    line-height: 1.32;
    text-wrap: balance;
}

.mv p {
    margin: 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ink-2);
}

.sec-must {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #EFF7FD 0%, #F7FBFE 62%, var(--white) 100%);
    padding: var(--sp) 0;
}

.must {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(272px, 1fr));
    gap: 18px;
}

.mst {
    position: relative;
    overflow: hidden;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    padding: 20px 24px 24px;
    box-shadow: var(--sh-card);
    transition: transform .26s, box-shadow .26s, border-color .26s;
}

.mst::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 3px;
    background: var(--h);
}

.mst:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
    border-color: color-mix(in srgb, var(--h) 42%, var(--line));
}

.mst-art {
    position: relative;
    height: 190px;
    margin: 6px 0 16px;
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.mst-art::before {
    content: "";
    position: absolute;
    left: 4%;
    right: 4%;
    bottom: -10px;
    height: 66%;
    border-radius: 50%;
    pointer-events: none;
    background: radial-gradient(62% 100% at 50% 100%,
    color-mix(in srgb, var(--h) 13%, transparent) 0%, transparent 72%);
}

.mst-art svg {
    position: relative;
    width: auto;
    height: var(--mh, 150px);
    max-width: 100%;
    display: block;
    overflow: visible;
    color: var(--blue);
}

.mst-p {
    fill: none;
    stroke: currentColor;
    stroke-linecap: round;
    stroke-linejoin: round;
    opacity: .9;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
}

.must.on .mst-p {
    animation: mvDraw 5.4s cubic-bezier(.36, .12, .28, 1) forwards;
}

.must.on .mst:nth-child(2) .mst-p {
    animation-delay: .42s;
}

.must.on .mst:nth-child(3) .mst-p {
    animation-delay: .84s;
}

.mst-lab {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--h);
}

.mst h3 {
    margin: 9px 0 11px;
    font-size: clamp(18px, 1.45vw, 21px);
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -.012em;
    line-height: 1.24;
    text-wrap: balance;
}

.mst p {
    margin: 0 0 16px;
    font-size: 14px;
    line-height: 1.62;
    color: var(--ink-2);
}

.mst ul {
    list-style: none;
    margin: 0 0 18px;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mst li {
    display: flex;
    gap: 9px;
    align-items: flex-start;
    font-size: 13px;
    line-height: 1.45;
    color: var(--ink);
}

.mst li svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    color: var(--h);
    margin-top: 3px;
}

.mst-cta {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size:12px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 9px 15px;
    transition: .18s;
}

.mst-cta:hover {
    background: var(--h);
    border-color: var(--h);
    color: #fff;
}

.mst-cta .k {
    font-weight: 700;
    opacity: .6;
    font-variant-numeric: tabular-nums;
}

.mst-cta:hover .k {
    opacity: .85;
}

.mst-cta:focus-visible {
    outline: 2px solid var(--h);
    outline-offset: 2px;
}

.must-ft {
    margin-top: 24px;
    font-size:12px;
    color: var(--ink-2);
    text-align: center;
}

.must-ft a {
    color: var(--blue);
    border-bottom: 1px solid rgba(31, 117, 188, .3);
}

.must-ft a:hover {
    border-bottom-color: var(--blue);
}

html.hc .mst-art::before {
    display: none;
}

.sec-cal {
    padding: var(--sp) 0;
    background: var(--white);
}

.calbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.caltabs {
    display: flex;
    gap: 3px;
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 3px;
}

.caltabs button {
    font-size:12px;
    font-weight: 600;
    color: var(--ink-2);
    padding: 8px 15px;
    border-radius: var(--r-pill);
    transition: .16s;
    white-space: nowrap;
}

.caltabs button[aria-selected="true"] {
    background: var(--white);
    color: var(--blue);
    box-shadow: 0 2px 8px rgba(23, 50, 77, .09);
}

.caltabs button:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.calnow {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin: 0;
    font-size:12px;
    color: var(--ink-2);
}

.calnow b {
    color: var(--ink);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.calnow .lv {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--ok);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 22%, transparent);
    animation: lvPulse 2.6s ease-in-out infinite;
}

@keyframes lvPulse {
    0%, 100% {
        box-shadow: 0 0 0 3px color-mix(in srgb, var(--ok) 22%, transparent);
    }
    50% {
        box-shadow: 0 0 0 7px color-mix(in srgb, var(--ok) 0%, transparent);
    }
}

.calgrid {
    display: grid;
    grid-template-columns:repeat(7, minmax(0, 1fr));
    gap: 10px;
}

.cd {
    position: relative;
    overflow: hidden;
    text-align: left;
    min-height: 132px;
    padding: 13px 14px 12px;
    border-radius: var(--r-card);
    border: var(--bw) solid var(--line);
    background: var(--white);
    box-shadow: var(--sh-card);
    display: flex;
    flex-direction: column;
    transition: transform .22s, box-shadow .22s, background .22s, border-color .22s;
}

.cd.solid {
    background: var(--h);
    border-color: var(--h);
}

.cd:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
    border-color: color-mix(in srgb, var(--h) 42%, var(--line));
}

.cd:not(.solid):hover {
    background: var(--h);
    border-color: var(--h);
}

.cd[aria-pressed="true"] {
    box-shadow: 0 0 0 2px var(--blue) inset, 0 10px 26px rgba(31, 117, 188, .18);
}

.cd-wd {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase;
}

.cd-n {
    font-size: clamp(24px, 2.3vw, 32px);
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1;
    margin-top: 5px;
    font-variant-numeric: tabular-nums;
}

.cd-mo {
    font-size:10px;
    font-weight: 500;
    margin-top: 3px;
}

.cd-b {
    margin-top: auto;
    display: flex;
    align-items: baseline;
    gap: 5px;
}

.cd-c {
    font-size: 16px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.cd-u {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.cd-dots {
    display: flex;
    gap: 3px;
    margin-top: 8px;
    flex-wrap: wrap;
}

.cd-dots i {
    width: 5px;
    height: 5px;
    border-radius: 50%;
}

.cd-t {
    position: absolute;
    right: 11px;
    top: 11px;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    border-radius: var(--r-pill);
    padding: 3px 8px;
}

.cd.solid .cd-wd {
    color: rgba(255, 255, 255, .72);
}

.cd.solid .cd-n, .cd.solid .cd-c {
    color: #fff;
}

.cd.solid .cd-mo, .cd.solid .cd-u {
    color: rgba(255, 255, 255, .72);
}

.cd.solid .cd-dots i {
    background: rgba(255, 255, 255, .72);
}

.cd.solid .cd-t {
    background: rgba(255, 255, 255, .22);
    color: #fff;
}

.cd:not(.solid) .cd-wd {
    color: var(--h);
}

.cd:not(.solid) .cd-n, .cd:not(.solid) .cd-c {
    color: var(--ink);
}

.cd:not(.solid) .cd-mo, .cd:not(.solid) .cd-u {
    color: var(--ink-2);
}

.cd:not(.solid) .cd-dots i {
    background: var(--h);
}

.cd:not(.solid) .cd-t {
    background: var(--blue);
    color: #fff;
}

.cd:not(.solid):hover .cd-wd, .cd:not(.solid):hover .cd-mo, .cd:not(.solid):hover .cd-u {
    color: rgba(255, 255, 255, .75);
}

.cd:not(.solid):hover .cd-n, .cd:not(.solid):hover .cd-c {
    color: #fff;
}

.cd:not(.solid):hover .cd-dots i {
    background: rgba(255, 255, 255, .75);
}

.cd.zero {
    opacity: .6;
}

.calgrid.on .cd {
    animation: cdIn .42s cubic-bezier(.2, .9, .3, 1) backwards;
    animation-delay: calc(var(--i) * 32ms);
}

@keyframes cdIn {
    from {
        opacity: 0;
        transform: translateY(12px) scale(.96);
    }
}

.calday {
    margin-top: clamp(20px, 2.6vh, 30px);
    padding-top: clamp(18px, 2.4vh, 26px);
    border-top: 1px solid var(--line);
}

.calday-h {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 14px;
}

.calday-h h3 {
    margin: 0;
    font-size: 16px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -.01em;
}

.calday-h span {
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-2);
}

.calagenda {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));
    gap: 9px;
}

.cev {
    display: flex;
    gap: 11px;
    padding: 11px 13px 11px 10px;
    border-radius: var(--r-in);
    border: var(--bw) solid var(--line);
    background: var(--white);
    position: relative;
    transition: border-color .16s, box-shadow .16s, transform .16s;
}

.cev::before {
    content: "";
    position: absolute;
    left: 0;
    top: 10px;
    bottom: 10px;
    width: 3px;
    border-radius: 0 3px 3px 0;
    background: var(--h);
}

.cev:hover {
    border-color: color-mix(in srgb, var(--h) 42%, var(--line));
    transform: translateY(-2px);
    box-shadow: 0 8px 20px color-mix(in srgb, var(--h) 15%, transparent);
}

.cev-t {
    font-size:12px;
    font-weight: 700;
    color: var(--h);
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
    padding-left: 6px;
    padding-top: 1px;
}

.cev-b {
    min-width: 0;
    flex: 1;
}

.cev-n {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.34;
}

.cev-m {
    display: block;
    font-size:11px;
    color: var(--ink-2);
    margin-top: 2px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cev-s {
    flex: 0 0 auto;
    align-self: center;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: var(--r-pill);
}

.cev-s.f {
    background: var(--ok-bg);
    color: var(--ok);
}

.cev-s.p {
    background: var(--blue-pale);
    color: var(--blue);
}

.cal-em {
    font-size: 13px;
    line-height: 1.6;
    color: var(--ink-2);
    padding: 6px 2px;
}

.calmore {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    margin-top: 14px;
    font-size:12px;
    font-weight: 600;
    color: var(--blue);
}

.calmore[hidden] {
    display: none;
}

.calmore svg {
    width: 15px;
    height: 15px;
    transition: transform .18s;
}

.calmore:hover svg {
    transform: translateX(2px);
}

.callegend {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 14px;
    margin-top: 16px;
}

.callegend span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size:10px;
    color: var(--ink-2);
}

.callegend i {
    width: 8px;
    height: 8px;
    border-radius: 3px;
    background: var(--h);
    flex: 0 0 auto;
}

@media (max-width: 1000px) {
    .calgrid {
        grid-template-columns:repeat(4, minmax(0, 1fr));
    }
}

@media (max-width: 680px) {
    .calgrid {
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .cd {
        min-height: 116px;
    }

    .caltabs {
        width: 100%;
    }

    .caltabs button {
        flex: 1;
        padding: 8px 6px;
        font-size:11px;
    }
}

.sec-un {
    position: relative;
    overflow: hidden;
    background: linear-gradient(158deg, #173352 0%, #112A44 48%, #0C1E33 100%);
    padding: var(--sp) 0;
}

.sec-un::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(58% 66% at 16% 6%, rgba(31, 117, 188, .26) 0%, transparent 62%),
    radial-gradient(46% 58% at 88% 92%, rgba(14, 148, 136, .18) 0%, transparent 64%);
}

.sec-un .wrap {
    position: relative;
    z-index: 1;
}

.sec-un .kicker {
    color: #8FC8F0;
    background: rgba(255, 255, 255, .07);
    border-color: rgba(255, 255, 255, .17);
}

.sec-un .sec-head h2 {
    color: #fff;
}

.sec-un .sec-head .lede {
    color: #A6BDD1;
}

.sec-un .sec-btn {
    background: rgba(255, 255, 255, .06);
    border-color: rgba(255, 255, 255, .26);
    color: #fff;
}

.sec-un .sec-btn:hover {
    background: #fff;
    border-color: #fff;
    color: #12283E;
    box-shadow: 0 8px 24px rgba(0, 0, 0, .28);
}

.unstage {
    display: grid;
    grid-template-columns:minmax(0, .94fr) minmax(0, 1.1fr);
    gap: clamp(26px, 3.8vw, 58px);
    align-items: center;
}

.undials {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap: 14px;
}

.und {
    background: rgba(255, 255, 255, .055);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: var(--r-card);
    padding: 16px 14px 15px;
    text-align: center;
    transition: background .24s, border-color .24s, transform .24s;
}

.und:hover {
    background: rgba(255, 255, 255, .09);
    transform: translateY(var(--lift));
    border-color: color-mix(in srgb, var(--g) 50%, transparent);
}

.und-r {
    position: relative;
    width: 92px;
    height: 92px;
    margin: 0 auto 11px;
}

.und-r svg {
    width: 92px;
    height: 92px;
    transform: rotate(-90deg);
    display: block;
}

.und-r circle {
    fill: none;
    stroke-width: 8;
    stroke-linecap: round;
}

.und-r .tk {
    stroke: rgba(255, 255, 255, .11);
}

.und-r .fl {
    stroke: var(--g);
    stroke-dasharray: 276.5;
    stroke-dashoffset: 276.5;
}

.undials.on .und-r .fl {
    animation: unRing 1.5s cubic-bezier(.22, .85, .25, 1) forwards;
    animation-delay: calc(var(--i) * 170ms);
}

@keyframes unRing {
    to {
        stroke-dashoffset: calc(276.5 - 276.5 * var(--p) / 100);
    }
}

.und-v {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1px;
}

.und-v b {
    font-size: 23px;
    font-weight: 800;
    color: #fff;
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.und-v i {
    font-style: normal;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--g);
}

.und-l {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    line-height: 1.34;
}

.und-s {
    display: block;
    font-size: 11px;
    color: #8FA6BC;
    margin-top: 4px;
    line-height: 1.4;
}

.unlinks {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap: 1px;
    background: rgba(255, 255, 255, .05);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: var(--r-card);
    padding: 8px;
}

@media (max-width: 560px) {
    .unlinks {
        grid-template-columns:minmax(0, 1fr);
    }
}

.unl {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 12px;
    border-radius: var(--r-in);
    font-size: 13px;
    line-height: 1.35;
    color: #D6E4EF;
    transition: background .16s, color .16s;
}

.unl:hover {
    background: rgba(255, 255, 255, .09);
    color: #fff;
}

.unl:focus-visible {
    outline: 2px solid #8FC8F0;
    outline-offset: 1px;
}

.unl svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    opacity: .55;
    margin-left: auto;
    transition: .18s;
}

.unl:hover svg {
    opacity: 1;
    transform: translateX(2px);
}

.unl .un-i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: #8FC8F0;
    flex: 0 0 auto;
    opacity: .7;
}

.unnote {
    margin: clamp(20px, 2.6vh, 28px) 0 0;
    font-size:11px;
    line-height: 1.6;
    color: #93AABF;
    max-width: 74ch;
}

@media (max-width: 900px) {
    .unstage {
        grid-template-columns:minmax(0, 1fr);
        gap: clamp(24px, 4vh, 36px);
    }

    .unlogo-w {
        max-width: min(340px, 76vw);
    }
}

@media (max-width: 420px) {
    .undials {
        grid-template-columns:minmax(0, 1fr);
    }
}

.sec-st {
    padding: var(--sp) 0;
    overflow: hidden;
    background: linear-gradient(180deg, #F2F8FD 0%, var(--white) 100%);
}

.st-quote {
    position: relative;
    padding-left: 46px;
    max-width: min(64ch, 780px);
    min-height: clamp(140px, 16vh, 186px);
}

.st-m {
    position: absolute;
    left: 0;
    top: -22px;
    font-size: 90px;
    line-height: 1;
    font-weight: 800;
    color: #CDE6F7;
    pointer-events: none;
    user-select: none;
}

.st-q {
    position: relative;
    margin: 0;
    font-size: clamp(19px, 1.95vw, 26px);
    font-weight: 600;
    line-height: 1.42;
    letter-spacing: -.016em;
    color: var(--ink);
    text-wrap: pretty;
}

.st-q.sw {
    animation: stSw .5s cubic-bezier(.2, .85, .3, 1);
}

@keyframes stSw {
    0% {
        opacity: 0;
        transform: translateY(9px);
    }
    100% {
        opacity: 1;
        transform: none;
    }
}

.st-who {
    display: flex;
    align-items: center;
    gap: 13px;
    margin-top: clamp(16px, 2.2vh, 24px);
}

.st-av {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    background: var(--h);
    letter-spacing: .02em;
}

.st-who b {
    display: block;
    font-size:14px;
    font-weight: 700;
    color: var(--ink);
}

.st-who span span {
    display: block;
    font-size:12px;
    color: var(--ink-2);
    margin-top: 2px;
}

.st-bleed {
    position: relative;
    overflow: hidden;
    margin-top: clamp(20px, 2.6vh, 30px);
    padding: 14px 0 22px;
    -webkit-mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
    mask-image: linear-gradient(90deg, transparent 0, #000 5%, #000 95%, transparent 100%);
}

.st-rail {
    display: flex;
    gap: 14px;
    width: max-content;
    animation: stMq 96s linear infinite;
}

@keyframes stMq {
    to {
        transform: translateX(-50%);
    }
}

.st-bleed:hover .st-rail, .st-rail:focus-within {
    animation-play-state: paused;
}

.rl {
    flex: 0 0 172px;
    text-align: left;
    transition: transform .3s cubic-bezier(.22, .7, .3, 1), opacity .3s;
    opacity: .9;
}

.rl:hover {
    opacity: 1;
}

.rl[aria-pressed="true"] {
    opacity: 1;
}

.rl:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 3px;
    border-radius: var(--r-card);
    opacity: 1;
}

.rl-c {
    position: relative;
    display: block;
    aspect-ratio: 9/16;
    border-radius: var(--r-card);
    overflow: hidden;
    box-shadow: var(--sh-card);
    background: linear-gradient(160deg, color-mix(in srgb, var(--h) 84%, #0E2134) 0%,
    color-mix(in srgb, var(--h) 32%, #0E2134) 100%);
    transition: box-shadow .26s;
}

.rl[aria-pressed="true"] .rl-c {
    box-shadow: 0 0 0 3px var(--h), 0 16px 38px color-mix(in srgb, var(--h) 34%, transparent);
}

.rl-pat {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    color: #fff;
    opacity: .17;
}

.rl-vd {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.rl-av {
    position: absolute;
    left: 0;
    right: 0;
    top: 27%;
    text-align: center;
    font-size: 23px;
    font-weight: 800;
    color: rgba(255, 255, 255, .9);
    letter-spacing: .04em;
}

.rl-p {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: rgba(255, 255, 255, .9);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--h);
    transition: transform .2s, background .2s;
}

.rl-p svg {
    width: 14px;
    height: 14px;
    margin-left: 2px;
}

.rl:hover .rl-p {
    transform: translate(-50%, -50%) scale(1.12);
    background: #fff;
}

.rl-d {
    position: absolute;
    right: 8px;
    bottom: 8px;
    font-size: 9px;
    font-weight: 700;
    color: #fff;
    background: rgba(14, 33, 52, .55);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    border-radius: var(--r-pill);
    padding: 3px 7px;
    font-variant-numeric: tabular-nums;
}

.rl-cap {
    position: absolute;
    left: 9px;
    right: 9px;
    bottom: 27px;
    font-size: 10px;
    line-height: 1.4;
    color: rgba(255, 255, 255, .92);
    font-weight: 600;
}

.rl-n {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--ink);
    margin-top: 10px;
    line-height: 1.3;
}

.rl-m {
    display: block;
    font-size:10px;
    color: var(--ink-2);
    margin-top: 2px;
}

.st-nav {
    flex: 0 0 auto;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .9);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: var(--bw) solid var(--line);
    box-shadow: var(--sh-card);
    color: var(--ink);
    transition: .18s;
}

.st-nav svg {
    width: 17px;
    height: 17px;
}

.st-nav:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.st-nav:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 3px;
}

.st-foot {
    display: flex;
    align-items: center;
    gap: clamp(12px, 1.6vw, 20px);
    margin-top: clamp(14px, 2vh, 22px);
    flex-wrap: wrap;
}

.st-ct {
    display: flex;
    align-items: baseline;
    gap: 8px;
    flex: 0 0 auto;
    font-variant-numeric: tabular-nums;
}

.st-ct b {
    font-size: 20px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -.02em;
}

.st-ct span {
    font-size:12px;
    color: var(--ink-2);
}

.st-foot .st-note {
    flex: 1 1 100%;
}

.st-note {
    margin: 0;
    flex: 0 0 100%;
    font-size:11px;
    color: var(--ink-3, #8A9CAC);
}

@media (max-width: 860px) {
    .st-quote {
        padding-left: 30px;
        min-height: 0;
    }

    .st-m {
        font-size: 62px;
        top: -14px;
    }

    .rl {
        flex: 0 0 148px;
    }

    .st-rail {
        animation-duration: 74s;
    }
}

.sec2 {
    padding: var(--sp) 0;
    background: var(--white);
}

@media (max-width: 820px) {
    .sec-head {
        flex-direction: column;
        align-items: flex-start;
        gap: 18px;
    }
}

.mapcard {
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    overflow: hidden;
    background: var(--white);
    box-shadow: var(--sh-card);
}

.mapbox {
    position: relative;
    height: clamp(300px, 44vh, 430px);
    background: var(--blue-pale);
}

#map {
    position: absolute;
    inset: 0;
    z-index: 1;
}

.leaflet-container {
    background: var(--blue-pale);
    font-family: 'Inter', sans-serif;
}

.leaflet-tile-pane {
    filter: grayscale(1) sepia(.3) hue-rotate(175deg) saturate(1.5) brightness(1.07) contrast(.92);
}

.leaflet-control-attribution {
    display: none;
}

.osm {
    position: absolute;
    right: 10px;
    bottom: 8px;
    z-index: 10;
    font-size: 9px;
    letter-spacing: .03em;
    color: #8FA3B5;
    background: rgba(255, 255, 255, .8);
    padding: 3px 7px;
    border-radius: 8px;
}

.osm a {
    color: #5F7182;
    text-decoration: underline;
}

.geoctl {
    position: absolute;
    left: 14px;
    top: 14px;
    z-index: 10;
    max-width: 290px;
}

.geobtn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 10px 15px;
    background: rgba(255, 255, 255, .94);
    backdrop-filter: blur(4px);
    font-size:12px;
    font-weight: 600;
    color: var(--ink);
    transition: .18s;
    box-shadow: 0 2px 10px rgba(23, 50, 77, .08);
}

.geobtn:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.geobtn:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.geobtn[disabled] {
    opacity: .65;
    cursor: default;
}

.geobtn .spin {
    animation: spin 1s linear infinite;
}

.geolive {
    display: none;
    align-items: center;
    gap: 8px;
    background: var(--blue);
    color: #fff;
    border-radius: var(--r-pill);
    padding: 10px 15px;
    font-size: 12px;
    font-weight: 600;
    box-shadow: 0 2px 10px rgba(31, 117, 188, .3);
}

.geolive.show {
    display: inline-flex;
}

.geolive button {
    margin-left: 2px;
    font-size: 11px;
    font-weight: 700;
    text-decoration: underline;
    color: #fff;
}

.geomsg {
    display: none;
    margin-top: 8px;
    font-size: 11px;
    line-height: 1.45;
    color: var(--ink);
    background: rgba(255, 255, 255, .94);
    border: 1px solid var(--line);
    border-radius: var(--r-in);
    padding: 8px 11px;
}

.geomsg.show {
    display: block;
}

.geonote {
    margin: 8px 0 0;
    font-size: 10px;
    line-height: 1.4;
    color: #7D8FA3;
    background: rgba(255, 255, 255, .86);
    border-radius: 8px;
    padding: 5px 9px;
    display: inline-block;
}

.pstrip {
    display: flex;
    border-top: 1px solid var(--line);
    overflow-x: auto;
    scrollbar-width: none;
}

.pstrip::-webkit-scrollbar {
    display: none;
}

.pc {
    flex: 1 1 0;
    min-width: 0;
    position: relative;
    overflow: hidden;
    text-align: left;
    padding: 16px 18px 15px;
    border-right: 1px solid var(--line);
    transition: background .3s;
}

.pc:last-child {
    border-right: 0;
}

.pc-bg {
    position: absolute;
    inset: 0;
    opacity: 0;
    transition: opacity .34s;
    background: linear-gradient(140deg, var(--blue) 0%, var(--blue-dark) 100%);
}

.pc.on .pc-bg {
    opacity: 1;
}

.pc-in {
    position: relative;
    display: flex;
    flex-direction: column;
    height: 100%;
}

.pc-top {
    display: flex;
    align-items: flex-start;
    gap: 8px;
}

.pc-n {
    display: block;
    font-size: clamp(26px, 2.3vw, 34px);
    font-weight: 800;
    line-height: .92;
    color: var(--blue);
    letter-spacing: -.02em;
    transition: color .3s;
}

.pc-u {
    display: block;
    margin-top: 4px;
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: #93A7B8;
    line-height: 1.45;
    transition: color .3s;
}

.pc-nm {
    display: block;
    margin-top: auto;
    padding-top: 14px;
    font-size:12px;
    font-weight: 600;
    line-height: 1.34;
    color: var(--ink);
    transition: color .3s;
}

.pc-s {
    display: block;
    margin-top: 5px;
    font-size:10px;
    color: var(--ink-2);
    transition: color .3s;
}

.pc.on .pc-n, .pc.on .pc-nm {
    color: #fff;
}

.pc.on .pc-u, .pc.on .pc-s {
    color: #BBD6F2;
}

.pc:hover:not(.on) {
    background: var(--blue-pale);
}

.pc:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: -2px;
}

.mk {
    position: relative;
    width: 20px;
    height: 20px;
}

.mk-dot {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    border: 2px solid #8FAFCF;
    background: #fff;
    transition: .26s cubic-bezier(.34, 1.4, .5, 1);
}

.mk.on .mk-dot {
    background: var(--blue);
    border-color: #fff;
    transform: scale(1.4);
    box-shadow: 0 3px 12px rgba(31, 117, 188, .5);
}

.mk-ring {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border:1px solid var(--blue);
    border-radius: 50%;
    opacity: 0;
}

.mk.on .mk-ring {
    animation: ring 2.1s ease-out infinite;
}

@keyframes ring {
    0% {
        opacity: .7;
        transform: scale(.7);
    }
    100% {
        opacity: 0;
        transform: scale(2.6);
    }
}

.mk-lbl {
    position: absolute;
    left: 28px;
    top: 50%;
    transform: translateY(-50%) translateX(-6px);
    background: var(--ink);
    color: #fff;
    border-radius: 8px;
    padding: 5px 10px;
    font-size:10px;
    font-weight: 600;
    white-space: nowrap;
    opacity: 0;
    pointer-events: none;
    transition: .24s;
}

.mk.on .mk-lbl {
    opacity: 1;
    transform: translateY(-50%) translateX(0);
}

.mk.flip .mk-lbl {
    left: auto;
    right: 28px;
}

.anchor {
    position: relative;
    width: 44px;
    height: 44px;
    transition: opacity .3s;
}

.anchor.muted {
    opacity: .4;
}

.anchor-c {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 44px;
    height: 44px;
    margin: -22px 0 0 -22px;
    border-radius: 50%;
    background: var(--ink);
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 6px 18px rgba(23, 50, 77, .3);
}

.anchor-r {
    position: absolute;
    left: 50%;
    top: 50%;
    border-radius: 50%;
    border: 1px dashed rgba(23, 50, 77, .35);
}

.anchor-r.r1 {
    width: 78px;
    height: 78px;
    margin: -39px 0 0 -39px;
}

.anchor-t {
    position: absolute;
    left: 50%;
    top: -15px;
    transform: translateX(-50%);
    font-size: 8px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--ink);
    white-space: nowrap;
}

.me {
    position: relative;
    width: 22px;
    height: 22px;
}

.me-dot {
    position: absolute;
    inset: 0;
    border-radius: 50%;
    background: var(--blue);
    border: 3px solid #fff;
    box-shadow: 0 3px 14px rgba(31, 117, 188, .55);
}

.me-pulse {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 22px;
    height: 22px;
    margin: -11px 0 0 -11px;
    border: 2px solid var(--blue);
    border-radius: 50%;
    animation: ring 2.4s ease-out infinite;
}

.me-lbl {
    position: absolute;
    left: 30px;
    top: 50%;
    transform: translateY(-50%);
    background: var(--blue);
    color: #fff;
    border-radius: 8px;
    padding: 5px 10px;
    font-size:10px;
    font-weight: 700;
    white-space: nowrap;
}

.link-path {
    stroke: var(--ink);
    stroke-width: 1.6;
    fill: none;
    stroke-dasharray: 4 6;
}

.pgh {
    position: relative;
    overflow: hidden;
    padding: clamp(26px, 4vh, 44px) 0 clamp(20px, 3vh, 30px);
    background: linear-gradient(180deg, #EFF7FD 0%, #F6FBFE 70%, var(--white) 100%);
    border-bottom: 1px solid var(--line);
}

.crumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--ink-2);
}

.crumb svg {
    width: 13px;
    height: 13px;
    opacity: .45;
}

.pgh h1 {
    margin: 12px 0 0;
    font-size: clamp(30px, 4.2vw, 50px);
    font-weight: 800;
    letter-spacing: -.025em;
    line-height: 1.06;
    color: var(--ink);
    text-wrap: balance;
}

.pgh h1 em {
    font-style: normal;
    color: var(--h, var(--blue));
}

.pgh .lede {
    margin: 12px 0 0;
    max-width: 60ch;
}

.qs {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: clamp(16px, 2.4vh, 24px);
}

.qs .chip {
    cursor: pointer;
    background: var(--white);
}

.qs .chip svg {
    width: 14px;
    height: 14px;
    color: var(--h, var(--blue));
}

.qs .chip:hover {
    border-color: var(--blue);
    color: var(--blue);
    transform: translateY(-1px);
    box-shadow: 0 6px 16px rgba(31, 117, 188, .1);
}

.qs .chip[aria-pressed="true"] {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.qs .chip[aria-pressed="true"] svg {
    color: #fff;
}

.tbar {
    position: sticky;
    top: var(--hdr);
    z-index: 60;
    background: linear-gradient(180deg, rgba(255, 255, 255, .9), rgba(255, 255, 255, .76));
    -webkit-backdrop-filter: blur(20px) saturate(175%);
    backdrop-filter: blur(20px) saturate(175%);
    border-bottom: 1px solid var(--line);
}

.tbar .wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    padding-top: 11px;
    padding-bottom: 11px;
}

.tsrch {
    flex: 1 1 320px;
    min-width: 0;
    display: flex;
    align-items: center;
    gap: 10px;
    height: 44px;
    padding: 0 14px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    transition: border-color .18s, box-shadow .18s;
}

.tsrch:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .13);
}

.tsrch svg {
    width: 17px;
    height: 17px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.tsrch input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    outline: 0;
    font-size:14px;
}

.tsrch input::placeholder {
    color: #93A7B8;
}

.tsrch kbd {
    flex: 0 0 auto;
    font: inherit;
    font-size:10px;
    font-weight: 600;
    color: #93A7B8;
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 2px 6px;
    background: var(--blue-pale);
}

.tsrch .xq {
    display: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    background: var(--blue-pale);
    color: var(--ink-2);
}

.tsrch.has .xq {
    display: flex;
}

.tsrch.has kbd {
    display: none;
}

.tsrch .xq:hover {
    background: var(--line);
    color: var(--ink);
}

.tcnt {
    flex: 0 0 auto;
    font-size: 13px;
    color: var(--ink-2);
    white-space: nowrap;
}

.tcnt b {
    font-size: 17px;
    font-weight: 800;
    color: var(--ink);
    letter-spacing: -.02em;
    font-variant-numeric: tabular-nums;
}

.tsort {
    flex: 0 0 auto;
    height: 44px;
    padding: 0 34px 0 13px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white) no-repeat right 12px center/12px 12px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235F7182' stroke-width='2.6' stroke-linecap='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    appearance: none;
    cursor: pointer;
}

.tsort:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.tview {
    flex: 0 0 auto;
    display: flex;
    gap: 2px;
    padding: 3px;
    background: var(--blue-pale);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
}

.tview button {
    width: 38px;
    height: 36px;
    border-radius: 9px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ink-2);
    transition: .16s;
}

.tview button svg {
    width: 16px;
    height: 16px;
}

.tview button:hover {
    color: var(--blue);
}

.tview button[aria-pressed="true"] {
    background: var(--white);
    color: var(--blue);
    box-shadow: 0 1px 3px rgba(23, 50, 77, .1);
}

.tfilt {
    display: none;
    flex: 0 0 auto;
    align-items: center;
    gap: 8px;
    height: 44px;
    padding: 0 16px;
    font-size:13px;
    font-weight: 600;
    color: #fff;
    background: var(--blue);
    border-radius: var(--r-in);
}

.tfilt svg {
    width: 16px;
    height: 16px;
}

.tfilt .k {
    background: rgba(255, 255, 255, .26);
    border-radius: var(--r-pill);
    padding: 1px 7px;
    font-size:11px;
    font-variant-numeric: tabular-nums;
}

.cbody {
    padding: clamp(20px, 3vh, 30px) 0 var(--sp);
}

.cgrid {
    display: grid;
    grid-template-columns:286px minmax(0, 1fr);
    gap: clamp(22px, 2.6vw, 38px);
    align-items: start;
}

.fcol {
    position: sticky;
    top: calc(var(--hdr) + 78px);
    max-height: calc(100vh - var(--hdr) - 100px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    padding-right: 4px;
}

.fcol-h {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 10px;
    margin-bottom: 12px;
}

.fcol-h b {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .02em;
}

.fclr {
    font-size: 12px;
    font-weight: 600;
    color: var(--blue);
}

.fclr[hidden] {
    display: none;
}

.fclr:hover {
    text-decoration: underline;
}

.fg {
    border-bottom: 1px solid var(--line);
}

.fg:first-of-type {
    border-top: 1px solid var(--line);
}

.fgb {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    padding: 13px 2px;
    font-size:13px;
    font-weight: 600;
    color: var(--ink);
    text-align: left;
}

.fgb .car {
    width: 13px;
    height: 13px;
    margin-left: auto;
    opacity: .42;
    transition: transform .22s;
    flex: 0 0 auto;
}

.fgb[aria-expanded="true"] .car {
    transform: rotate(180deg);
    opacity: .8;
}

.fgb .n {
    font-size:10px;
    font-weight: 800;
    color: #fff;
    background: var(--blue);
    border-radius: var(--r-pill);
    min-width: 18px;
    height: 18px;
    padding: 0 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-variant-numeric: tabular-nums;
}

.fgb .n[hidden] {
    display: none;
}

.fgp {
    display: grid;
    grid-template-rows:0fr;
    overflow: hidden;
    transition: grid-template-rows .26s ease;
}

.fgb[aria-expanded="true"] + .fgp {
    grid-template-rows:1fr;
}

.fgp > div {
    min-height: 0;
}

.fgin {
    padding: 0 0 12px;
}

.fo {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 7px 8px;
    border-radius: var(--r-in);
    font-size: 13px;
    color: var(--ink);
    text-align: left;
    transition: background .14s, color .14s;
}

.fo:hover {
    background: var(--blue-pale);
}

.fo:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: -1px;
}

.fo .bx {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    border: 2px solid #BFD9EC;
    border-radius: 5px;
    background: var(--white);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background .14s, border-color .14s;
}

.fo .bx svg {
    width: 11px;
    height: 11px;
    color: #fff;
    opacity: 0;
    transition: opacity .14s;
}

.fo[aria-pressed="true"] .bx {
    background: var(--blue);
    border-color: var(--blue);
}

.fo[aria-pressed="true"] .bx svg {
    opacity: 1;
}

.fo[aria-pressed="true"] {
    font-weight: 600;
}

.fo .tx {
    flex: 1;
    min-width: 0;
}

.fo .dt {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--h);
    flex: 0 0 auto;
}

.fo .c {
    font-size:11px;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
}

.fo.zero {
    opacity: .38;
    cursor: not-allowed;
}

.fo.zero:hover {
    background: none;
}

.fmore {
    font-size: 12px;
    font-weight: 600;
    color: var(--blue);
    padding: 7px 8px;
}

.fmore:hover {
    text-decoration: underline;
}

.fsh-l {
    display: block;
    font-size: 12px;
    font-weight: 700;
    letter-spacing: .02em;
    color: var(--ink-2);
    margin: 12px 0 6px;
}

.ffind {
    width: 100%;
    height: 34px;
    margin: 0 0 6px;
    padding: 0 11px;
    font-size:12px;
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    background: var(--white);
}

.ffind:focus {
    outline: 0;
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .12);
}

.chips {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-bottom: 16px;
}

.chips[hidden] {
    display: none;
}

.chips .ch {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size:12px;
    font-weight: 600;
    padding: 6px 8px 6px 12px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--h, var(--blue)) 10%, #fff);
    border: 1px solid color-mix(in srgb, var(--h, var(--blue)) 26%, #fff);
    color: color-mix(in srgb, var(--h, var(--blue)) 82%, #17324D);
}

.chips .ch i {
    font-style: normal;
    opacity: .62;
    font-weight: 500;
}

.chips .ch b {
    font-weight: 700;
}

.chips .ch .x {
    width: 18px;
    height: 18px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .75);
    transition: .15s;
}

.chips .ch .x svg {
    width: 9px;
    height: 9px;
}

.chips .ch:hover .x {
    background: var(--h, var(--blue));
    color: #fff;
}

.chips .all {
    background: none;
    border-style: dashed;
    color: var(--ink-2);
}

.chips .all:hover {
    color: var(--blue);
    border-color: var(--blue);
}

.res {
    display: grid;
    grid-template-columns:repeat(auto-fill, minmax(248px, 1fr));
    gap: 18px;
}

.res .crs {
    flex: auto;
    width: auto;
}

.res .crs {
    opacity: 0;
    transform: translateY(10px);
    animation: crsIn .34s cubic-bezier(.22, .7, .3, 1) forwards;
    animation-delay: calc(min(var(--i), 11) * 28ms);
}

@keyframes crsIn {
    to {
        opacity: 1;
        transform: none;
    }
}

.res.list {
    grid-template-columns:minmax(0, 1fr);
    gap: 10px;
}

.res.list .crs {
    flex-direction: row;
    align-items: stretch;
    padding: 0;
}

.res.list .crs-img {
    flex: 0 0 132px;
    height: auto;
    min-height: 118px;
}

.res.list .crs-dom, .res.list .crs-st {
    display: none;
}

.res.list .crs-b {
    padding: 13px 18px;
    flex: 1;
}

.res.list .crs-org {
    margin-top: 7px;
}

.res.list .crs-meta {
    margin-top: 10px;
    padding-top: 9px;
}

.res.list .crs-foot {
    padding-top: 10px;
}

.res.list .crs-t {
    min-height: 0;
    font-size:15px;
}

.res.list .crs-occ {
    display: none;
}

.res.list .crs-foot {
    padding-top: 12px;
}

@media (max-width: 620px) {
    .res.list .crs {
        flex-direction: column;
    }

    .res.list .crs-img {
        flex: 0 0 auto;
        height: 118px;
    }
}

.empty {
    border:1px dashed #C6E0F2;
    border-radius: var(--r-card);
    background: var(--blue-pale);
    padding: clamp(26px, 4vh, 44px) clamp(20px, 3vw, 36px);
    text-align: center;
}

.empty h3 {
    margin: 0;
    font-size: 20px;
    font-weight: 700;
    letter-spacing: -.015em;
}

.empty p {
    margin: 9px auto 0;
    max-width: 52ch;
    font-size:13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.empty .fix {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    justify-content: center;
    margin-top: 18px;
}

.empty .fix .chip {
    cursor: pointer;
    background: var(--white);
}

.empty .fix .chip:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.empty .fix .chip b {
    font-weight: 700;
}

.more {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    margin-top: clamp(22px, 3vh, 32px);
}

.more[hidden] {
    display: none;
}

.more-b {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size:13px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw-btn) solid var(--line);
    border-radius: var(--r-pill);
    padding: 12px 24px;
    transition: .18s;
}

.more-b:hover {
    border-color: var(--blue);
    color: var(--blue);
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(31, 117, 188, .12);
}

.more-p {
    width: min(240px, 60%);
    height: 4px;
    border-radius: 2px;
    background: var(--line);
    overflow: hidden;
}

.more-p i {
    display: block;
    height: 100%;
    border-radius: 2px;
    background: var(--blue);
    transition: width .34s cubic-bezier(.22, .7, .3, 1);
}

.more-t {
    font-size:11px;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}

.alert {
    margin-top: clamp(24px, 3.4vh, 36px);
    display: flex;
    align-items: center;
    gap: clamp(14px, 2vw, 26px);
    flex-wrap: wrap;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    padding: 18px 22px;
}

.alert-i {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--blue-pale);
    color: var(--blue);
}

.alert-i svg {
    width: 19px;
    height: 19px;
}

.alert-t {
    flex: 1 1 260px;
    min-width: 0;
}

.alert-t b {
    display: block;
    font-size: 14px;
    font-weight: 700;
}

.alert-t span {
    display: block;
    font-size:12px;
    color: var(--ink-2);
    margin-top: 3px;
    line-height: 1.5;
}

.alert form {
    display: flex;
    gap: 8px;
    flex: 1 1 300px;
    min-width: 0;
}

.alert input {
    flex: 1;
    min-width: 0;
    height: 42px;
    padding: 0 14px;
    font-size:13px;
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    background: var(--white);
}

.alert input:focus {
    outline: 0;
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .12);
}

.alert button {
    flex: 0 0 auto;
    height: 42px;
    padding: 0 20px;
    font-size: 13px;
    font-weight: 600;
    color: #fff;
    background: var(--blue);
    border-radius: var(--r-in);
    transition: .18s;
}

.alert button:hover {
    background: var(--blue-dark);
}

.alert.done {
    border-color: var(--ok);
    background: var(--ok-bg);
}

.alert.done .alert-i {
    background: #fff;
    color: var(--ok);
}

.goals {
    margin-top: var(--sp);
    padding-top: clamp(28px, 4vh, 46px);
    border-top: 1px solid var(--line);
}

.goals h2 {
    margin: 0;
    font-size: clamp(22px, 2.4vw, 30px);
    font-weight: 800;
    letter-spacing: -.02em;
}

.goals p.lede {
    margin: 10px 0 0;
}

.glg {
    display: grid;
    grid-template-columns:repeat(auto-fill, minmax(232px, 1fr));
    gap: 12px;
    margin-top: clamp(18px, 2.6vh, 26px);
}

.gl3 {
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: left;
    padding: 15px 16px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    transition: transform .22s, box-shadow .22s, border-color .22s;
}

.gl3:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
    border-color: color-mix(in srgb, var(--h) 42%, var(--line));
}

.gl3 .gi {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--h);
    background: color-mix(in srgb, var(--h) 12%, #fff);
}

.gl3 .gi svg {
    width: 18px;
    height: 18px;
}

.gl3 span {
    flex: 1;
    min-width: 0;
    font-size:13px;
    font-weight: 600;
    line-height: 1.35;
}

.gl3 .ga {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    color: var(--ink-2);
    opacity: .5;
    transition: .18s;
}

.gl3:hover .ga {
    opacity: 1;
    color: var(--h);
    transform: translateX(2px);
}

.fsheet {
    position: fixed;
    inset: 0;
    z-index: 88;
    display: none;
}

.fsheet.open {
    display: block;
}

.fsheet-v {
    position: absolute;
    inset: 0;
    background: rgba(14, 33, 52, .42);
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
}

.fsheet-p {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    max-height: 88vh;
    display: flex;
    flex-direction: column;
    background: var(--white);
    border-radius: var(--r-card) var(--r-card) 0 0;
    box-shadow: 0 -18px 50px rgba(23, 50, 77, .22);
    animation: shUp .3s cubic-bezier(.22, .7, .3, 1);
}

@keyframes shUp {
    from {
        transform: translateY(18px);
        opacity: .6;
    }
    to {
        transform: none;
        opacity: 1;
    }
}

.fsheet-h {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 16px 20px 12px;
    border-bottom: 1px solid var(--line);
}

.fsheet-h b {
    font-size:15px;
    font-weight: 700;
    flex: 1;
}

.fsheet-x {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--blue-pale);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ink);
}

.fsheet-x svg {
    width: 14px;
    height: 14px;
}

.fsheet-b {
    flex: 1;
    overflow-y: auto;
    padding: 4px 20px 10px;
    overscroll-behavior: contain;
}

.fsheet-f {
    padding: 12px 20px calc(12px + env(safe-area-inset-bottom));
    border-top: 1px solid var(--line);
    display: flex;
    gap: 10px;
    background: var(--white);
}

.fsheet-f .go {
    flex: 1;
    height: 48px;
    border-radius: var(--r-in);
    background: var(--blue);
    color: #fff;
    font-size:14px;
    font-weight: 600;
}

.fsheet-f .rst {
    flex: 0 0 auto;
    height: 48px;
    padding: 0 18px;
    border-radius: var(--r-in);
    border: var(--bw-btn) solid var(--line);
    font-size:13px;
    font-weight: 600;
    color: var(--ink);
}

@media (max-width: 1000px) {
    .cgrid {
        grid-template-columns:minmax(0, 1fr);
    }

    .fcol {
        display: none;
    }

    .tfilt {
        display: inline-flex;
    }

    .tsort {
        display: none;
    }
}

@media (max-width: 680px) {
    .tbar .wrap {
        flex-wrap: wrap;
        gap: 9px;
    }

    .tsrch {
        flex: 1 1 100%;
        order: -1;
    }

    .tsrch kbd {
        display: none;
    }

    .tcnt {
        flex: 1;
    }

    .tview button {
        width: 34px;
    }

    .res {
        grid-template-columns:minmax(0, 1fr);
    }
}

@media (prefers-reduced-motion: reduce) {
    .res .crs {
        opacity: 1 !important;
        transform: none !important;
        animation: none !important;
    }

    .fgp {
        transition: none !important;
    }

    .fsheet-p {
        animation: none !important;
    }
}

.pnl .dm[aria-pressed="true"], .pnl .lk[aria-pressed="true"] {
    background: var(--blue-pale);
    color: var(--blue);
    font-weight: 600;
}

.pnl .dm[aria-pressed="true"] {
    background: color-mix(in srgb, var(--h) 12%, #fff);
    color: var(--h);
}

.pnl .chip {
    cursor: pointer;
}

.note {
    margin: clamp(20px, 2.6vh, 28px) 0 0;
    font-size:11px;
    line-height: 1.6;
    color: #8A9CAC;
    max-width: 74ch;
}

.sec-top {
    padding: var(--sp) 0 calc(var(--sp) - 24px);
    background: var(--white);
}

.trk {
    display: flex;
    gap: 16px;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    scrollbar-width: none;
    padding: 4px 24px 24px;
    margin: -4px -24px 0;
}

.trk::-webkit-scrollbar {
    display: none;
}

.crs {
    flex: 0 0 318px;
    scroll-snap-align: start;
    position: relative;
    text-align: left;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    padding: 0 0 18px;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    transition: transform .22s cubic-bezier(.22, .7, .3, 1), box-shadow .22s, border-color .22s;
}

.crs:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
    border-color: color-mix(in srgb, var(--h) 42%, var(--line));
}

.crs:focus-within {
    border-color: var(--h);
}

.crs-st {
    position: absolute;
    left: 12px;
    top: 12px;
    z-index: 2;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    padding: 4px 9px;
    border-radius: var(--r-pill);
    white-space: nowrap;
}

.crs-st.ok {
    background: var(--ok-bg);
    color: var(--ok);
}

.crs-st.warn {
    background: var(--warn-bg);
    color: var(--warn);
}

.crs-st.info {
    background: var(--info-bg);
    color: var(--info);
}

.crs-pill {
    position: absolute;
    right: 12px;
    top: 12px;
    z-index: 2;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    padding: 4px 10px;
    border-radius: var(--r-pill);
    background: rgba(255, 255, 255, .9);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    color: var(--ink);
}

.crs-pill.free {
    color: var(--ok);
}

.crs-dom {
    position: absolute;
    left: 12px;
    bottom: 11px;
    z-index: 2;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--h);
    background: rgba(255, 255, 255, .86);
    -webkit-backdrop-filter: blur(6px);
    backdrop-filter: blur(6px);
    border-radius: var(--r-pill);
    padding: 4px 11px 4px 8px;
}

.crs-dom svg {
    width: 13px;
    height: 13px;
}

.crs-b {
    padding: 15px 18px 0;
    display: flex;
    flex-direction: column;
    flex: 1;
}

.crs-t {
    font-size:16px;
    font-weight: 700;
    line-height: 1.28;
    color: var(--ink);
    letter-spacing: -.012em;
    min-height: 2.56em;
}

.crs-org {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 10px;
    font-size:12px;
    color: var(--ink-2);
    min-width: 0;
}

.crs-av {
    width: 24px;
    height: 24px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 9px;
    font-weight: 800;
    color: #fff;
    background: var(--h);
    letter-spacing: .02em;
}

.crs-org span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.crs-meta {
    margin-top: 13px;
    padding-top: 12px;
    border-top: 1px solid var(--line);
    display: flex;
    flex-wrap: wrap;
    gap: 6px 14px;
}

.crs-r {
    display: flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    color: var(--ink-2);
}

.crs-r svg {
    width: 14px;
    height: 14px;
    flex-shrink: 0;
    color: var(--ink-3, #93A7B8);
}

.crs-occ {
    margin-top: 13px;
}

.crs-occ-h {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    font-size: 11px;
    color: var(--ink-2);
    margin-bottom: 6px;
}

.crs-occ-h b {
    font-weight: 700;
    color: var(--h);
    white-space: nowrap;
}

.crs-occ-b {
    height: 5px;
    border-radius: 4px;
    overflow: hidden;
    background: color-mix(in srgb, var(--h) 13%, #fff);
}

.crs-occ-b i {
    display: block;
    height: 100%;
    border-radius: 4px;
    width: 0;
    background: var(--h);
}

.trk.on .crs-occ-b i {
    animation: occIn .9s cubic-bezier(.2, .85, .25, 1) forwards;
    animation-delay: calc(var(--i) * 80ms);
}

@keyframes occIn {
    to {
        width: calc(var(--p) * 1%);
    }
}

.crs-foot {
    margin-top: auto;
    padding-top: 15px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
}

.crs-cost {
    font-size: 13px;
    font-weight: 700;
    color: var(--ink);
}

.crs-cost.free {
    color: var(--ok);
    font-weight: 600;
    font-size: 12px;
}

.crs-cta {
    font-size:12px;
    font-weight: 600;
    color: #fff;
    background: var(--h);
    padding: 10px 17px;
    border-radius: var(--r-pill);
    transition: filter .18s, transform .18s;
    white-space: nowrap;
}

.crs-cta:hover {
    filter: brightness(.92);
    transform: translateY(-1px);
}

.crs-cta:focus-visible {
    outline: 2px solid var(--ink);
    outline-offset: 2px;
}

@media (max-width: 760px) {
    .crs {
        flex: 0 0 84vw;
    }
}

.dhero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(180deg, #EFF7FD 0%, #F6FBFE 72%, var(--white) 100%);
    border-bottom: 1px solid var(--line);
    padding: clamp(22px, 3.4vh, 34px) 0 clamp(26px, 4vh, 42px);
}

.crumb {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 12px;
    color: var(--ink-2);
    flex-wrap: wrap;
}

.crumb a:hover {
    color: var(--blue);
}

.crumb svg {
    width: 13px;
    height: 13px;
    opacity: .45;
    flex: 0 0 auto;
}

.crumb .cur {
    color: var(--ink);
    font-weight: 600;
}

.dtop {
    display: grid;
    grid-template-columns:minmax(0, 1fr) 372px;
    gap: clamp(24px, 3vw, 46px);
    align-items: start;
    margin-top: clamp(14px, 2vh, 20px);
}

.dbadges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.bdg {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size:11px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    padding: 6px 12px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--h) 11%, #fff);
    color: var(--h);
    border: 1px solid color-mix(in srgb, var(--h) 24%, #fff);
}

.bdg svg {
    width: 14px;
    height: 14px;
}

.bdg.ok {
    background: var(--ok-bg);
    color: var(--ok);
    border-color: #BFE6CF;
}

.bdg.warn {
    background: var(--warn-bg);
    color: var(--warn);
    border-color: #F2DCB0;
}

.bdg.n {
    background: var(--white);
    color: var(--ink-2);
    border-color: var(--line);
}

h1.dh {
    margin: 14px 0 0;
    font-size: clamp(28px, 3.7vw, 45px);
    font-weight: 800;
    letter-spacing: -.025em;
    line-height: 1.08;
    color: var(--ink);
    text-wrap: balance;
}

.dsub {
    margin: 13px 0 0;
    font-size: clamp(14px, 1.05vw,16px);
    line-height: 1.6;
    color: var(--ink-2);
    max-width: 58ch;
}

.dorg {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: clamp(16px, 2.2vh, 22px);
}

.dorg .dorg-a {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 14px;
    font-weight: 800;
    color: #fff;
    background: var(--h);
    letter-spacing: .02em;
}

.dorg b {
    display: block;
    font-size:14px;
    font-weight: 700;
}

.dorg span {
    display: block;
    font-size:12px;
    color: var(--ink-2);
    margin-top: 2px;
}

.dorg a {
    color: var(--blue);
    font-weight: 600;
}

.dfacts {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(132px, 1fr));
    gap: 12px;
    margin-top: clamp(20px, 2.8vh, 28px);
}

.dfact {
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    padding: 13px 15px;
}

.dfact i {
    display: block;
    font-style: normal;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.dfact b {
    display: block;
    margin-top: 5px;
    font-size: 16px;
    font-weight: 700;
    color: var(--ink);
    letter-spacing: -.01em;
    line-height: 1.25;
}

.dfact b small {
    display: block;
    font-size:11px;
    font-weight: 500;
    color: var(--ink-2);
    margin-top: 2px;
}

.dsec button > svg:not([class]), .dsec a > svg:not([class]),
.enr button > svg:not([class]), .enr a > svg:not([class]) {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.enr {
    position: sticky;
    top: calc(var(--hdr) + 18px);
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: 0 1px 3px rgba(23, 50, 77, .04), 0 18px 44px rgba(23, 50, 77, .09);
    overflow: hidden;
}

.enr-h {
    padding: 18px 20px 0;
}

.enr-p {
    display: flex;
    align-items: baseline;
    gap: 9px;
}

.enr-p b {
    font-size: 26px;
    font-weight: 800;
    letter-spacing: -.025em;
    color: var(--ink);
}

.enr-p b.free {
    color: var(--ok);
}

.enr-p span {
    font-size:12px;
    color: var(--ink-2);
}

.enr-occ {
    margin-top: 14px;
}

.enr-occ-h {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    font-size: 12px;
    color: var(--ink-2);
    margin-bottom: 6px;
}

.enr-occ-h b {
    font-weight: 700;
    color: var(--h);
}

.enr-bar {
    height: 6px;
    border-radius: 4px;
    overflow: hidden;
    background: color-mix(in srgb, var(--h) 13%, #fff);
}

.enr-bar i {
    display: block;
    height: 100%;
    border-radius: 4px;
    background: var(--h);
    width: 0;
    transition: width .9s cubic-bezier(.22, .85, .25, 1);
}

.enr-b {
    padding: 16px 20px 20px;
}

.enr-cta {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    width: 100%;
    height: 52px;
    border-radius: var(--r-in);
    background: var(--h);
    color: #fff;
    font-size:15px;
    font-weight: 700;
    transition: filter .18s, transform .18s;
}

.enr-cta:hover {
    filter: brightness(.93);
    transform: translateY(-1px);
}

.enr-cta:focus-visible {
    outline: var(--foc) solid var(--ink);
    outline-offset: 3px;
}

.enr-cta svg {
    width: 17px;
    height: 17px;
}

.enr-alt {
    display: flex;
    gap: 8px;
    margin-top: 10px;
}

.enr-alt button {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    border-radius: var(--r-in);
    border: var(--bw) solid var(--line);
    background: var(--white);
    font-size:12px;
    font-weight: 600;
    color: var(--ink);
    transition: .16s;
}

.enr-alt button:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.enr-alt svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.enr-alt button[aria-pressed="true"] {
    background: var(--blue-pale);
    border-color: var(--blue);
    color: var(--blue);
}

.enr-note {
    margin: 14px 0 0;
    font-size:11px;
    line-height: 1.55;
    color: var(--ink-2);
}

.enr-note b {
    color: var(--ink);
    font-weight: 600;
}

.enr-l {
    margin-top: 14px;
    padding-top: 14px;
    border-top: 1px solid var(--line);
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.enr-l div {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-size:12px;
    color: var(--ink-2);
    line-height: 1.45;
}

.enr-l svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    margin-top: 2px;
    color: var(--h);
}

.enr-l b {
    color: var(--ink);
    font-weight: 600;
}

.enr-form {
    display: none;
    padding: 0 20px 20px;
}

.enr.step1 .enr-form, .enr.step2 .enr-form {
    display: block;
}

.enr.step1 .enr-b, .enr.step2 .enr-b, .enr.done .enr-b {
    display: none;
}

.enr.done .enr-h {
    display: none;
}

.steps {
    display: flex;
    align-items: center;
    gap: 6px;
    margin: 0 0 16px;
}

.steps i {
    flex: 1;
    height: 4px;
    border-radius: 2px;
    background: var(--line);
    transition: background .3s;
}

.enr.step1 .steps i:nth-child(1),
.enr.step2 .steps i:nth-child(-n+2),
.enr.done .steps i {
    background: var(--h);
}

.fld {
    margin-bottom: 12px;
}

.fld label {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-2);
    margin-bottom: 5px;
}

.fld input, .fld select {
    width: 100%;
    height: 44px;
    padding: 0 13px;
    font-size: 14px;
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    background: var(--white);
}

.fld input:focus, .fld select:focus {
    outline: 0;
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .13);
}

.fld input:invalid:not(:placeholder-shown) {
    border-color: var(--h3);
}

.fld .hint {
    display: block;
    margin-top: 5px;
    font-size: 11px;
    color: var(--ink-2);
}

.chkl {
    display: flex;
    gap: 9px;
    align-items: flex-start;
    font-size:12px;
    line-height: 1.5;
    color: var(--ink-2);
    margin: 14px 0 4px;
    cursor: pointer;
}

.chkl input {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    margin: 1px 0 0;
    accent-color: var(--blue);
}

.enr-row {
    display: flex;
    gap: 9px;
    margin-top: 14px;
}

.enr-row button {
    flex: 1;
    height: 46px;
    border-radius: var(--r-in);
    font-size: 14px;
    font-weight: 600;
}

.enr-row .bk {
    flex: 0 0 auto;
    padding: 0 16px;
    border: var(--bw) solid var(--line);
    color: var(--ink);
}

.enr-row .bk:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.enr-row .go {
    background: var(--h);
    color: #fff;
}

.enr-row .go:hover {
    filter: brightness(.93);
}

.rev {
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: var(--r-in);
    padding: 13px 15px;
    font-size:12px;
    line-height: 1.6;
    color: var(--ink);
}

.rev b {
    display: block;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
    margin-bottom: 6px;
}

.rev span {
    display: block;
}

.enr-done {
    display: none;
    padding: 24px 20px 22px;
    text-align: center;
}

.enr.done .enr-done {
    display: block;
}

.enr-done .tick {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    margin: 0 auto 14px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--ok-bg);
    color: var(--ok);
}

.enr-done .tick svg {
    width: 26px;
    height: 26px;
}

.enr-done h3 {
    margin: 0;
    font-size: 18px;
    font-weight: 800;
    letter-spacing: -.015em;
}

.enr-done p {
    margin: 8px 0 0;
    font-size: 13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.enr-code {
    margin: 16px 0 0;
    padding: 12px;
    border-radius: var(--r-in);
    background: var(--blue-pale);
    border: 1px dashed #BEDCF1;
}

.enr-code i {
    display: block;
    font-style: normal;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.enr-code b {
    display: block;
    margin-top: 4px;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: .08em;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.subnav {
    position: sticky;
    top: var(--hdr);
    z-index: 58;
    background: linear-gradient(180deg, rgba(255, 255, 255, .92), rgba(255, 255, 255, .78));
    -webkit-backdrop-filter: blur(18px) saturate(170%);
    backdrop-filter: blur(18px) saturate(170%);
    border-bottom: 1px solid var(--line);
}

.subnav .wrap {
    display: flex;
    gap: 4px;
    overflow-x: auto;
    scrollbar-width: none;
}

.subnav .wrap::-webkit-scrollbar {
    display: none;
}

.subnav a {
    position: relative;
    flex: 0 0 auto;
    padding: 15px 14px;
    font-size:13px;
    font-weight: 600;
    color: var(--ink-2);
    white-space: nowrap;
    transition: color .16s;
}

.subnav a:hover {
    color: var(--ink);
}

.subnav a::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 0;
    height: 3px;
    border-radius: 2px;
    background: var(--h);
    opacity: 0;
    transition: opacity .2s;
}

.subnav a.on {
    color: var(--h);
}

.subnav a.on::after {
    opacity: 1;
}

.dbody {
    padding: clamp(26px, 4vh, 44px) 0 var(--sp);
}

.dgrid {
    display: grid;
    grid-template-columns:minmax(0, 1fr) 372px;
    gap: clamp(24px, 3vw, 46px);
    align-items: start;
}

.dsec {
    scroll-margin-top: calc(var(--hdr) + 70px);
}

.dsec + .dsec {
    margin-top: clamp(30px, 4.4vh, 50px);
}

.dsec h2 {
    margin: 0 0 4px;
    font-size: clamp(19px, 1.9vw, 25px);
    font-weight: 800;
    letter-spacing: -.02em;
    color: var(--ink);
}

.dsec .lead {
    margin: 0 0 clamp(14px, 2vh, 20px);
    font-size: 14px;
    line-height: 1.65;
    color: var(--ink-2);
    max-width: 66ch;
}

.dsec > p {
    font-size: 14px;
    line-height: 1.7;
    color: var(--ink-2);
    max-width: 66ch;
}

.outs {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(258px, 1fr));
    gap: 12px;
}

.out {
    display: flex;
    gap: 11px;
    align-items: flex-start;
    padding: 14px 16px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
}

.out .tk {
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    background: color-mix(in srgb, var(--h) 13%, #fff);
    color: var(--h);
}

.out .tk svg {
    width: 12px;
    height: 12px;
}

.out span {
    font-size:13px;
    line-height: 1.5;
    color: var(--ink);
}

.syl {
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    overflow: hidden;
    background: var(--white);
    box-shadow: var(--sh-card);
}

.sylb {
    display: flex;
    align-items: center;
    gap: 13px;
    width: 100%;
    padding: 14px 18px;
    text-align: left;
    border-bottom: 1px solid var(--line);
    transition: background .16s;
}

.syl > div:last-child .sylb {
    border-bottom: 0;
}

.syl > div.op .sylb {
    border-bottom: 0;
}

.sylb:hover {
    background: var(--blue-pale);
}

.sylb .no {
    width: 28px;
    height: 28px;
    border-radius: 9px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:12px;
    font-weight: 800;
    background: color-mix(in srgb, var(--h) 12%, #fff);
    color: var(--h);
    font-variant-numeric: tabular-nums;
}

.sylb .tt {
    flex: 1;
    min-width: 0;
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
}

.sylb .mt {
    flex: 0 0 auto;
    font-size:11px;
    color: var(--ink-2);
}

.sylb .car {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
    opacity: .4;
    transition: transform .22s;
}

.sylb[aria-expanded="true"] .car {
    transform: rotate(180deg);
    opacity: .8;
}

.sylp {
    display: grid;
    grid-template-rows:0fr;
    overflow: hidden;
    transition: grid-template-rows .26s ease;
    border-bottom: 1px solid var(--line);
}

.sylb[aria-expanded="true"] + .sylp {
    grid-template-rows:1fr;
}

.sylp > div {
    min-height: 0;
}

.sylp ul {
    margin: 0;
    padding: 2px 18px 16px 59px;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.sylp li {
    position: relative;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink-2);
    padding-left: 15px;
}

.sylp li::before {
    content: "";
    position: absolute;
    left: 0;
    top: 8px;
    width: 5px;
    height: 5px;
    border-radius: 50%;
    background: color-mix(in srgb, var(--h) 55%, #fff);
}

.sch {
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    overflow: hidden;
    background: var(--white);
    box-shadow: var(--sh-card);
}

.sch-w {
    overflow-x: auto;
}

.sch table {
    width: 100%;
    border-collapse: collapse;
    min-width: 520px;
}

.sch th {
    text-align: left;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
    padding: 12px 16px;
    background: var(--blue-pale);
    border-bottom: 1px solid var(--line);
}

.sch td {
    padding: 12px 16px;
    font-size: 13px;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
    vertical-align: middle;
}

.sch tr:last-child td {
    border-bottom: 0;
}

.sch tr.next td {
    background: color-mix(in srgb, var(--h) 7%, #fff);
}

.sch tr.past td {
    color: var(--ink-2);
}

.sch tr.past .dnum {
    opacity: .5;
}

.sch .dnum {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

.sch .tag {
    display: inline-block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    padding: 3px 8px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--h) 13%, #fff);
    color: var(--h);
    margin-left: 8px;
}

.sch .tag.past {
    background: var(--blue-pale);
    color: var(--ink-2);
}

.sch-f {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    flex-wrap: wrap;
    padding: 13px 16px;
    background: var(--blue-pale);
    font-size:12px;
    color: var(--ink-2);
}

.sch-f b {
    color: var(--ink);
}

.ics {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size:12px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-pill);
    padding: 8px 15px;
    transition: .18s;
}

.ics:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.ics svg {
    width: 15px;
    height: 15px;
}

.loc {
    display: grid;
    grid-template-columns:minmax(280px, 1.4fr) minmax(0, 1fr);
    gap: 0;
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    overflow: hidden;
    background: var(--white);
    box-shadow: var(--sh-card);
}

.loc-m {
    position: relative;
    min-height: 288px;
    background: #EAF3FA;
}

.loc-m > svg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
}

#locMap {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: none;
    background: #EAF3FA;
}

#locMap.on {
    display: block;
}

.leaflet-container {
    font: inherit;
}

.leaflet-popup-content {
    margin: 11px 14px;
    font-size: 13px;
    line-height: 1.5;
}

.leaflet-popup-content b {
    display: block;
    font-size:13px;
    margin-bottom: 3px;
}

.leaflet-popup-content-wrapper {
    border-radius: var(--r-in);
}

.loc-mk {
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border-radius: 50%;
    background: var(--h);
    border: 3px solid #fff;
    box-shadow: 0 4px 12px rgba(23, 50, 77, .34);
}

.loc-mk::after {
    content: "";
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #fff;
}

.loc-pin {
    position: absolute;
    left: 52%;
    top: 46%;
    transform: translate(-50%, -100%);
    width: 34px;
    height: 34px;
    color: var(--h);
    filter: drop-shadow(0 4px 8px rgba(23, 50, 77, .22));
}

.loc-pulse {
    position: absolute;
    left: 52%;
    top: 46%;
    width: 60px;
    height: 60px;
    transform: translate(-50%, -50%);
    border-radius: 50%;
    background: color-mix(in srgb, var(--h) 22%, transparent);
    animation: locP 2.6s ease-out infinite;
}

@keyframes locP {
    0% {
        transform: translate(-50%, -50%) scale(.5);
        opacity: .75;
    }
    100% {
        transform: translate(-50%, -50%) scale(1.5);
        opacity: 0;
    }
}

.loc-b {
    padding: 20px 22px;
    display: flex;
    flex-direction: column;
    gap: 14px;
}

.loc-b h3 {
    margin: 0;
    font-size:15px;
    font-weight: 700;
}

.loc-ad {
    font-size: 13px;
    line-height: 1.55;
    color: var(--ink-2);
}

.loc-w {
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.loc-w div {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: var(--ink);
}

.loc-w svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    color: var(--h);
}

.loc-w b {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.loc-w span {
    color: var(--ink-2);
}

.loc-cta {
    margin-top: auto;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    align-self: flex-start;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw-btn) solid var(--line);
    border-radius: var(--r-pill);
    padding: 10px 17px;
    transition: .18s;
}

.loc-cta:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.loc-cta svg {
    width: 15px;
    height: 15px;
}

#railCol {
    position: sticky;
    top: calc(var(--hdr) + 70px);
}

.tut {
    display: flex;
    gap: 18px;
    align-items: flex-start;
    padding: 20px 22px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
}

.tut-a {
    width: 74px;
    height: 74px;
    border-radius: 50%;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 22px;
    font-weight: 800;
    color: #fff;
    background: var(--h);
    letter-spacing: .02em;
}

.tut-b b {
    display: block;
    font-size: 16px;
    font-weight: 700;
}

.tut-b i {
    display: block;
    font-style: normal;
    font-size:12px;
    color: var(--h);
    font-weight: 600;
    margin-top: 3px;
}

.tut-b p {
    margin: 9px 0 0;
    font-size: 13px;
    line-height: 1.62;
    color: var(--ink-2);
    max-width: 60ch;
}

.tut-t {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 12px;
}

.tut-t span {
    font-size:11px;
    font-weight: 600;
    color: var(--ink-2);
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 5px 11px;
}

.faq {
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    overflow: hidden;
    background: var(--white);
    box-shadow: var(--sh-card);
}

.faqb {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 15px 18px;
    text-align: left;
    font-size: 14px;
    font-weight: 600;
    color: var(--ink);
    border-bottom: 1px solid var(--line);
    transition: background .16s;
}

.faq > div:last-child .faqb {
    border-bottom: 0;
}

.faq > div.op .faqb {
    border-bottom: 0;
}

.faqb:hover {
    background: var(--blue-pale);
}

.faqb .car {
    width: 13px;
    height: 13px;
    margin-left: auto;
    flex: 0 0 auto;
    opacity: .4;
    transition: transform .22s;
}

.faqb[aria-expanded="true"] .car {
    transform: rotate(180deg);
    opacity: .8;
}

.faqp {
    display: grid;
    grid-template-rows:0fr;
    overflow: hidden;
    transition: grid-template-rows .26s ease;
    border-bottom: 1px solid var(--line);
}

.faqb[aria-expanded="true"] + .faqp {
    grid-template-rows:1fr;
}

.faqp > div {
    min-height: 0;
}

.faqp p {
    margin: 0;
    padding: 0 18px 16px;
    font-size: 13px;
    line-height: 1.68;
    color: var(--ink-2);
    max-width: 66ch;
}

.axs {
    display: grid;
    grid-template-columns:repeat(auto-fit, minmax(220px, 1fr));
    gap: 12px;
}

.axb {
    display: flex;
    gap: 11px;
    align-items: flex-start;
    padding: 14px 16px;
    border-radius: var(--r-card);
    background: var(--white);
    border: var(--bw) solid var(--line);
    box-shadow: var(--sh-card);
}

.axb svg {
    width: 19px;
    height: 19px;
    flex: 0 0 auto;
    color: var(--h);
    margin-top: 1px;
}

.axb b {
    display: block;
    font-size: 13px;
    font-weight: 700;
}

.axb span {
    display: block;
    font-size: 12px;
    color: var(--ink-2);
    margin-top: 3px;
    line-height: 1.45;
}

.axb.no {
    opacity: .55;
}

.axb.no svg {
    color: var(--ink-2);
}

.pol {
    background: var(--blue-pale);
    border: 1px solid #CFE6F6;
    border-radius: var(--r-card);
    padding: 18px 20px;
}

.pol h3 {
    margin: 0 0 8px;
    font-size: 14px;
    font-weight: 700;
}

.pol p {
    margin: 0;
    font-size: 13px;
    line-height: 1.65;
    color: var(--ink-2);
    max-width: 70ch;
}

.pol p + p {
    margin-top: 8px;
}

.sim {
    display: grid;
    grid-template-columns:repeat(auto-fill, minmax(248px, 1fr));
    gap: 18px;
}

.sim .crs {
    flex: auto;
    width: auto;
}

.bbar {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 70;
    display: none;
    align-items: center;
    gap: 12px;
    padding: 11px 18px calc(11px + env(safe-area-inset-bottom));
    background: rgba(255, 255, 255, .94);
    -webkit-backdrop-filter: blur(20px) saturate(175%);
    backdrop-filter: blur(20px) saturate(175%);
    border-top: 1px solid var(--line);
    box-shadow: 0 -8px 26px rgba(23, 50, 77, .09);
}

.bbar-p {
    flex: 1;
    min-width: 0;
}

.bbar-p b {
    display: block;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -.02em;
}

.bbar-p b.free {
    color: var(--ok);
}

.bbar-p span {
    display: block;
    font-size:11px;
    color: var(--ink-2);
}

.bbar a {
    flex: 0 0 auto;
    height: 48px;
    padding: 0 26px;
    border-radius: var(--r-in);
    background: var(--h);
    color: #fff;
    font-size: 15px;
    font-weight: 700;
    display: flex;
    align-items: center;
}

@media (max-width: 1080px) {
    #railCol {
        position: static;
    }

    .dtop, .dgrid {
        grid-template-columns:minmax(0, 1fr);
    }

    .enr {
        position: static;
    }

    .dtop .enr {
        display: none;
    }

    .loc {
        grid-template-columns:minmax(0, 1fr);
    }
}

@media (max-width: 760px) {
    .bbar {
        display: flex;
    }

    body {
        padding-bottom: 82px;
    }

    .tut {
        flex-direction: column;
        gap: 14px;
    }

    .subnav a {
        padding: 13px 11px;
        font-size: 13px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .loc-pulse {
        animation: none;
        opacity: .35;
    }

    .sylp, .faqp {
        transition: none !important;
    }

    .enr-bar i {
        transition: none !important;
    }
}

.bbar.on {
    display: flex;
}

body.bb {
    padding-bottom: 82px;
}

.mapp {
    display: grid;
    grid-template-columns:392px minmax(0, 1fr);
    grid-template-rows:minmax(0, 1fr);
    height: calc(100vh - var(--hdr));
    min-height: 520px;
}

.mlist, .mmap {
    min-height: 0;
}

.mlist {
    display: flex;
    flex-direction: column;
    min-width: 0;
    border-right: 1px solid var(--line);
    background: var(--white);
}

.mtop {
    padding: 14px 18px 12px;
    border-bottom: 1px solid var(--line);
    flex: 0 0 auto;
}

.msrch {
    display: flex;
    align-items: center;
    gap: 9px;
    height: 42px;
    padding: 0 13px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    transition: border-color .18s, box-shadow .18s;
    position: relative;
}

.msrch:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .13);
}

.msrch > svg {
    width: 16px;
    height: 16px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.msrch input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    outline: 0;
    font-size: 14px;
}

.msrch kbd {
    font: inherit;
    font-size:10px;
    font-weight: 600;
    color: #93A7B8;
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 2px 6px;
    background: var(--blue-pale);
}

.msrch .xq {
    display: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    background: var(--blue-pale);
    color: var(--ink-2);
}

.msrch .xq svg {
    width: 10px;
    height: 10px;
}

.msrch.has .xq {
    display: flex;
}

.msrch.has kbd {
    display: none;
}

.mac {
    position: absolute;
    left: -1px;
    right: -1px;
    top: 46px;
    z-index: 30;
    max-height: 284px;
    overflow-y: auto;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    box-shadow: 0 14px 34px rgba(23, 50, 77, .14);
    padding: 6px;
    display: none;
}

.mac.on {
    display: block;
}

.mac button {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 8px 9px;
    text-align: left;
    border-radius: 9px;
    font-size: 13px;
    color: var(--ink);
}

.mac button:hover, .mac button.sel {
    background: var(--blue-pale);
}

.mac .dt {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--h);
    flex: 0 0 auto;
}

.mac .tx {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mac .n {
    font-size:11px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.mac .em {
    padding: 10px;
    font-size:12px;
    color: var(--ink-2);
}

.mchips-w {
    position: relative;
    margin-top: 11px;
}

.mchips-w::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    bottom: 2px;
    width: 34px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, var(--white) 72%);
}

.mchips {
    display: flex;
    gap: 7px;
    overflow-x: auto;
    scrollbar-width: none;
    padding-bottom: 2px;
}

.mchips::-webkit-scrollbar {
    display: none;
}

.mch {
    flex: 0 0 auto;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 11px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
    white-space: nowrap;
    transition: .15s;
}

.mch svg {
    width: 13px;
    height: 13px;
    color: var(--h, var(--blue));
}

.mch:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.mch[aria-pressed="true"] {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.mch[aria-pressed="true"] svg {
    color: #fff;
}

.mch .k {
    font-size:10px;
    font-variant-numeric: tabular-nums;
    opacity: .75;
}

.mbar {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 18px;
    border-bottom: 1px solid var(--line);
    flex: 0 0 auto;
    background: var(--blue-pale);
}

.mbar b {
    font-size: 13px;
    font-weight: 700;
}

.mbar span {
    font-size: 12px;
    color: var(--ink-2);
}

.mbar select {
    margin-left: auto;
    height: 32px;
    padding: 0 26px 0 9px;
    font-size: 12px;
    font-weight: 600;
    border: var(--bw) solid var(--line);
    border-radius: 9px;
    background: var(--white) no-repeat right 8px center/10px 10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235F7182' stroke-width='2.8' stroke-linecap='round'%3E%3Cpath d='M6 9.5l6 6 6-6'/%3E%3C/svg%3E");
    appearance: none;
    cursor: pointer;
}

.mroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 10px 14px 18px;
}

.mit {
    display: flex;
    gap: 12px;
    width: 100%;
    text-align: left;
    padding: 12px;
    border-radius: var(--r-in);
    border: 1px solid transparent;
    transition: background .14s, border-color .14s;
}

.mit:hover, .mit.hot {
    background: var(--blue-pale);
    border-color: #CFE6F6;
}

.mit[aria-current="true"] {
    background: color-mix(in srgb, var(--h) 9%, #fff);
    border-color: color-mix(in srgb, var(--h) 34%, #fff);
}

.mit-b {
    width: 38px;
    height: 38px;
    border-radius: 11px;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size:12px;
    font-weight: 800;
    color: #fff;
    background: var(--h);
    letter-spacing: .01em;
}

.mit-x {
    flex: 1;
    min-width: 0;
}

.mit-n {
    display: block;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    line-height: 1.32;
}

.mit-a {
    display: block;
    font-size: 12px;
    color: var(--ink-2);
    margin-top: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.mit-m {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-top: 7px;
    flex-wrap: wrap;
}

.mit-m span {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size: 11px;
    color: var(--ink-2);
}

.mit-m svg {
    width: 12px;
    height: 12px;
}

.mit-m b {
    color: var(--ink);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.mit-o {
    font-size: 11px;
    font-weight: 700;
    padding: 2px 7px;
    border-radius: var(--r-pill);
}

.mit-o.y {
    background: var(--ok-bg);
    color: var(--ok);
}

.mit-o.n {
    background: var(--blue-pale);
    color: var(--ink-2);
}

.mit-s {
    flex: 0 0 auto;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #B4C6D4;
    transition: .16s;
}

.mit-s svg {
    width: 15px;
    height: 15px;
}

.mit-s:hover {
    background: var(--blue-pale);
    color: var(--h3);
}

.mit-s[aria-pressed="true"] {
    color: var(--h3);
}

.mempty {
    padding: 26px 12px;
    text-align: center;
}

.mempty b {
    display: block;
    font-size:14px;
}

.mempty p {
    margin: 7px 0 0;
    font-size: 13px;
    line-height: 1.55;
    color: var(--ink-2);
}

.mempty button {
    margin-top: 13px;
}

.mmap {
    position: relative;
    min-width: 0;
    background: #E8F2FA;
}

#map {
    position: absolute;
    inset: 0;
}

.leaflet-container {
    font: inherit;
    background: #E8F2FA;
}

.leaflet-container a {
    color: var(--blue);
}

.leaflet-control-attribution {
    font-size: 10px;
}

.leaflet-tile-pane {
    filter: grayscale(.55) sepia(.14) hue-rotate(174deg) saturate(1.25) brightness(1.04);
}

.mk {
    position: relative;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: var(--h);
    border: 3px solid #fff;
    color: #fff;
    box-shadow: 0 3px 10px rgba(23, 50, 77, .3);
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    transition: transform .16s;
}

.mk:hover {
    transform: scale(1.12);
    z-index: 500;
}

.mk.on {
    box-shadow: 0 0 0 4px color-mix(in srgb, var(--h) 34%, transparent), 0 4px 14px rgba(23, 50, 77, .34);
    transform: scale(1.14);
}

.mk.dim {
    opacity: .35;
}

.mk-s {
    font-size: 10px;
}

.mk-m {
    font-size:11px;
}

.mk-l {
    font-size: 13px;
}

.mctl {
    position: absolute;
    z-index: 410;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.mctl.tr {
    right: 12px;
    top: 12px;
    align-items: flex-end;
}

.mctl.br {
    right: 12px;
    bottom: 22px;
    align-items: flex-end;
}

.mbtn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    height: 38px;
    padding: 0 13px;
    background: rgba(255, 255, 255, .95);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-pill);
    box-shadow: 0 3px 12px rgba(23, 50, 77, .12);
    font-size:12px;
    font-weight: 600;
    color: var(--ink);
    transition: .16s;
    white-space: nowrap;
}

.mbtn svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.mbtn:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.mbtn[aria-pressed="true"] {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.mbtn.load svg {
    animation: mspin 1s linear infinite;
}

@keyframes mspin {
    to {
        transform: rotate(360deg);
    }
}

.msect {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
    justify-content: flex-end;
    max-width: 300px;
}

.msect button {
    height: 30px;
    padding: 0 11px;
    font-size:11px;
    font-weight: 600;
    border-radius: var(--r-pill);
    background: rgba(255, 255, 255, .95);
    border: var(--bw) solid var(--line);
    color: var(--ink-2);
    box-shadow: 0 2px 8px rgba(23, 50, 77, .1);
    transition: .15s;
}

.msect button:hover {
    color: var(--blue);
    border-color: var(--blue);
}

.msect button[aria-pressed="true"] {
    background: var(--ink);
    border-color: var(--ink);
    color: #fff;
}

.mrad {
    background: rgba(255, 255, 255, .95);
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: 0 3px 12px rgba(23, 50, 77, .12);
    padding: 11px 14px 9px;
    width: 224px;
}

.mrad-h {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 8px;
    font-size:11px;
    color: var(--ink-2);
}

.mrad-h b {
    font-size: 13px;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.mrad input[type=range] {
    width: 100%;
    margin: 8px 0 0;
    accent-color: var(--blue);
}

.mrad p {
    margin: 4px 0 0;
    font-size:10px;
    color: var(--ink-2);
}

.mpan {
    position: absolute;
    left: 16px;
    bottom: 16px;
    z-index: 420;
    width: min(368px, calc(100% - 32px));
    max-height: calc(100% - 108px);
    display: flex;
    flex-direction: column;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: 0 2px 6px rgba(23, 50, 77, .06), 0 22px 52px rgba(23, 50, 77, .2);
    opacity: 0;
    transform: translateY(14px) scale(.985);
    pointer-events: none;
    transition: opacity .18s ease, transform .22s cubic-bezier(.22, .7, .3, 1);
}

.mpan.on {
    opacity: 1;
    transform: none;
    pointer-events: auto;
}

.mpan-h {
    position: relative;
    padding: 16px 46px 0 18px;
    flex: 0 0 auto;
}

.mpan-x {
    position: absolute;
    right: 12px;
    top: 12px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--blue-pale);
    color: var(--ink-2);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .15s;
}

.mpan-x svg {
    width: 12px;
    height: 12px;
}

.mpan-x:hover {
    background: var(--line);
    color: var(--ink);
}

.mpan svg:not([class]), .mit svg:not([class]), .mch svg:not([class]),
.mbtn svg:not([class]), .mempty svg:not([class]) {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

.mpan-k svg {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
}

.mpan-k {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--h);
    background: color-mix(in srgb, var(--h) 11%, #fff);
    border-radius: var(--r-pill);
    padding: 4px 10px;
}

.mpan-n {
    margin: 9px 0 0;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.015em;
    line-height: 1.24;
}

.mpan-a {
    margin: 6px 0 0;
    font-size:12px;
    color: var(--ink-2);
    line-height: 1.5;
}

.mpan-r {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 14px;
    margin-top: 11px;
}

.mpan-r span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    color: var(--ink-2);
}

.mpan-r svg {
    width: 13px;
    height: 13px;
    color: var(--h);
}

.mpan-r b {
    color: var(--ink);
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.mpan-b {
    flex: 1;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 18px 0;
}

.mpan-t {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-2);
    margin: 0 0 8px;
}

.mpan-d {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-bottom: 15px;
}

.mpan-d a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size:11px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: var(--r-pill);
    background: color-mix(in srgb, var(--dh) 11%, #fff);
    color: var(--dh);
    border: 1px solid color-mix(in srgb, var(--dh) 24%, #fff);
    transition: .15s;
}

.mpan-d a:hover {
    background: var(--dh);
    color: #fff;
    border-color: var(--dh);
}

.mpan-d a i {
    font-style: normal;
    opacity: .7;
    font-variant-numeric: tabular-nums;
}

.mnx {
    display: flex;
    flex-direction: column;
    gap: 1px;
    margin-bottom: 15px;
}

.mnx a {
    display: flex;
    gap: 10px;
    align-items: flex-start;
    padding: 9px 10px;
    border-radius: var(--r-in);
    transition: background .14s;
}

.mnx a:hover {
    background: var(--blue-pale);
}

.mnx .dd {
    flex: 0 0 auto;
    width: 38px;
    text-align: center;
}

.mnx .dd b {
    display: block;
    font-size:14px;
    font-weight: 800;
    line-height: 1;
    color: var(--dh);
    font-variant-numeric: tabular-nums;
}

.mnx .dd i {
    display: block;
    font-style: normal;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-2);
    margin-top: 2px;
}

.mnx .tt {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    line-height: 1.4;
    color: var(--ink);
}

.mnx .tt small {
    display: block;
    font-size: 11px;
    color: var(--ink-2);
    margin-top: 2px;
}

.mpan-f {
    flex: 0 0 auto;
    display: flex;
    gap: 8px;
    padding: 12px 18px 16px;
    border-top: 1px solid var(--line);
    background: var(--white);
    border-radius: 0 0 var(--r-card) var(--r-card);
}

.mpan-f a, .mpan-f button {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 7px;
    height: 42px;
    border-radius: var(--r-in);
    font-size: 13px;
    font-weight: 600;
    transition: .16s;
}

.mpan-f svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.mpan-f .pr {
    background: var(--h);
    color: #fff;
}

.mpan-f .pr:hover {
    filter: brightness(.93);
}

.mpan-f .se {
    border: var(--bw) solid var(--line);
    color: var(--ink);
    flex: 0 0 auto;
    width: 42px;
}

.mpan-f .se:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.mpan-f .se[aria-pressed="true"] {
    color: var(--h3);
    border-color: var(--h3);
}

.mtoggle {
    display: none;
    position: absolute;
    left: 50%;
    bottom: 16px;
    transform: translateX(-50%);
    z-index: 430;
}

@media (max-width: 1000px) {
    .mapp {
        grid-template-columns:minmax(0, 1fr);
        position: relative;
    }

    .mlist {
        position: absolute;
        inset: auto 0 0 0;
        z-index: 440;
        height: 64%;
        border-right: 0;
        border-top: 1px solid var(--line);
        border-radius: var(--r-card) var(--r-card) 0 0;
        box-shadow: 0 -14px 40px rgba(23, 50, 77, .16);
        transform: translateY(calc(100% - 132px));
        transition: transform .28s cubic-bezier(.22, .7, .3, 1);
    }

    .mapp.list .mlist {
        transform: none;
    }

    .mlist::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 7px;
        translate: -50% 0;
        width: 42px;
        height: 4px;
        border-radius: 2px;
        background: var(--line);
    }

    .mtop {
        padding-top: 20px;
    }

    .mmap {
        position: absolute;
        inset: 0;
    }

    .mtoggle {
        display: inline-flex;
        bottom: 148px;
        z-index: 450;
    }

    .mpan {
        left: 12px;
        right: 12px;
        bottom: 200px;
        width: auto;
        max-height: calc(100% - 280px);
    }

    .mctl.br {
        bottom: 200px;
    }

    .mrad {
        width: 196px;
    }
}

@media (max-width: 560px) {
    .msect {
        max-width: 196px;
    }

    .mctl.tr .mbtn span {
        display: none;
    }

    .mctl.tr .mbtn {
        padding: 0 11px;
    }
}

@media (prefers-reduced-motion: reduce) {
    .mpan {
        transition: none !important;
    }

    .mlist {
        transition: none !important;
    }

    .mbtn.load svg {
        animation: none !important;
    }
}

html, body {
    overflow-x: hidden;
}

.mapnote {
    padding: 14px 0;
    font-size:11px;
    line-height: 1.6;
    color: #8A9CAC;
    border-top: 1px solid var(--line);
    background: var(--white);
}

.calp {
    padding-bottom: clamp(40px, 6vh, 72px);
}

.chead {
    padding: clamp(26px, 3.4vh, 40px) 0 clamp(16px, 2vh, 24px);
    background: linear-gradient(180deg, var(--blue-pale), rgba(238, 247, 253, 0));
}

.chead h1 {
    margin: 13px 0 0;
    font-size: clamp(28px, 3.4vw, 44px);
    font-weight: 800;
    letter-spacing: -.022em;
    line-height: 1.06;
    text-wrap: balance;
}

.chead .lede {
    margin: 11px 0 0;
    max-width: 64ch;
}

.ctool {
    position: sticky;
    top: var(--hdr);
    z-index: 44;
    background: rgba(255, 255, 255, .92);
    -webkit-backdrop-filter: blur(14px) saturate(160%);
    backdrop-filter: blur(14px) saturate(160%);
    border-bottom: 1px solid var(--line);
}

.ctool .wrap {
    display: flex;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    padding-top: 11px;
    padding-bottom: 11px;
}

.cper {
    min-width: 0;
}

.cper b {
    display: block;
    font-size: clamp(15px, 1.5vw, 19px);
    font-weight: 800;
    letter-spacing: -.01em;
    text-transform: capitalize;
}

.csum {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    margin-top: 2px;
    font-size:11px;
    color: var(--ink-2);
}

.csum i {
    font-style: normal;
    font-variant-numeric: tabular-nums;
}

.csum s {
    text-decoration: none;
    opacity: .4;
}

.csum .cflag {
    color: var(--ok);
    font-weight: 600;
}

.cnav {
    display: flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
}

.cbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 38px;
    padding: 0 15px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw-btn) solid var(--line);
    border-radius: var(--r-pill);
    transition: .16s;
    white-space: nowrap;
}

.cbtn:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.cbtn:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.cbtn svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.cbtn.ico {
    width: 38px;
    padding: 0;
}

.cbtn.ico svg {
    width: 17px;
    height: 17px;
}

.cbtn.pr {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.cbtn.pr:hover {
    background: var(--blue-dark);
    border-color: var(--blue-dark);
    color: #fff;
}

.cbtn[disabled] {
    opacity: .42;
    cursor: default;
}

.cbtn .k {
    font-size: 11px;
    font-variant-numeric: tabular-nums;
    opacity: .7;
}

.ctool-r {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-left: auto;
    flex-wrap: wrap;
}

.cseg {
    display: inline-flex;
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 3px;
    flex: 0 0 auto;
}

.cseg button {
    height: 32px;
    padding: 0 14px;
    font-size:12px;
    font-weight: 600;
    color: var(--ink-2);
    border-radius: var(--r-pill);
    transition: .16s;
}

.cseg button:hover {
    color: var(--blue);
}

.cseg button[aria-pressed="true"] {
    background: var(--white);
    color: var(--blue);
    box-shadow: 0 1px 3px rgba(23, 50, 77, .1);
}

.cseg button:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 1px;
}

.csrch {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 38px;
    padding: 0 13px;
    width: 236px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    transition: border-color .18s, box-shadow .18s;
}

.csrch:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .13);
}

.csrch > svg {
    width: 16px;
    height: 16px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.csrch input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    outline: 0;
    font-size:13px;
}

.csrch kbd {
    font: inherit;
    font-size:10px;
    font-weight: 600;
    color: #93A7B8;
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 2px 6px;
}

.csrch .xq {
    display: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    background: var(--blue-pale);
    color: var(--ink-2);
}

.csrch .xq svg {
    width: 10px;
    height: 10px;
}

.csrch.has .xq {
    display: flex;
}

.csrch.has kbd {
    display: none;
}

.cbody {
    display: grid;
    grid-template-columns:262px minmax(0, 1fr);
    gap: clamp(18px, 2vw, 30px);
    align-items: start;
    padding-top: clamp(18px, 2.4vh, 28px);
}

.cstage {
    min-width: 0;
}

.crail {
    position: sticky;
    top: calc(var(--hdr) + var(--tb));
    max-height: calc(100vh - var(--hdr) - var(--tb) - 20px);
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    padding: 4px 0;
}

.crail-h {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 13px 16px 11px;
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: 0;
    background: var(--white);
    z-index: 3;
    border-radius: var(--r-card) var(--r-card) 0 0;
}

.crail-h b {
    font-size: 13px;
    font-weight: 700;
    flex: 1;
    min-width: 0;
}

.crail-h .n {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 19px;
    height: 19px;
    padding: 0 5px;
    border-radius: var(--r-pill);
    background: var(--blue);
    color: #fff;
    font-size: 11px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.crail-h .n[hidden] {
    display: none;
}

.crail-h .xa[hidden] {
    display: none;
}

.crail-h .xa {
    font-size:11px;
    font-weight: 600;
    color: var(--ink-2);
    text-decoration: underline;
    text-decoration-color: var(--line);
}

.crail-h .xa:hover {
    color: var(--h3);
}

.crail-h .xs {
    display: none;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: var(--blue-pale);
    align-items: center;
    justify-content: center;
    color: var(--ink);
    flex: 0 0 auto;
}

.crail-h .xs svg {
    width: 12px;
    height: 12px;
}

.ctgs {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 8px 8px 10px;
    border-bottom: 1px solid var(--line);
}

.ctg {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 8px 9px;
    border-radius: var(--r-in);
    font-size:12px;
    font-weight: 500;
    color: var(--ink);
    text-align: left;
    transition: .14s;
}

.ctg:hover {
    background: var(--blue-pale);
}

.ctg .bx {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    border: 2px solid var(--line);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    transition: .14s;
}

.ctg .bx svg {
    width: 11px;
    height: 11px;
    opacity: 0;
}

.ctg[aria-pressed="true"] .bx {
    background: var(--blue);
    border-color: var(--blue);
}

.ctg[aria-pressed="true"] .bx svg {
    opacity: 1;
}

.ctg[aria-pressed="true"] {
    font-weight: 600;
}

.ctg .tx {
    flex: 1;
    min-width: 0;
}

.ctg .k {
    font-size: 11px;
    color: #93A7B8;
    font-variant-numeric: tabular-nums;
}

.ctg:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 1px;
}

.cfg {
    border-bottom: 1px solid var(--line);
}

.cfg:last-child {
    border-bottom: 0;
}

.cfh {
    display: flex;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 12px 16px;
    text-align: left;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.cfh:hover {
    color: var(--blue);
}

.cfh .tx {
    flex: 1;
    min-width: 0;
}

.cfh .n {
    font-size:10px;
    font-weight: 700;
    color: var(--blue);
    letter-spacing: 0;
}

.cfh .car {
    width: 13px;
    height: 13px;
    opacity: .45;
    transition: transform .22s;
    flex: 0 0 auto;
}

.cfh[aria-expanded="true"] .car {
    transform: rotate(180deg);
}

.cfb {
    padding: 0 8px 10px;
    display: none;
}

.cfg.open .cfb {
    display: block;
}

.cfo {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    padding: 7px 9px;
    border-radius: var(--r-in);
    font-size:12px;
    color: var(--ink);
    text-align: left;
    transition: .14s;
}

.cfo:hover {
    background: var(--blue-pale);
}

.cfo:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 1px;
}

.cfo .bx {
    width: 17px;
    height: 17px;
    flex: 0 0 auto;
    border: 2px solid var(--line);
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    transition: .14s;
}

.cfo .bx svg {
    width: 11px;
    height: 11px;
    opacity: 0;
}

.cfo[aria-pressed="true"] .bx {
    background: var(--h, var(--blue));
    border-color: var(--h, var(--blue));
}

.cfo[aria-pressed="true"] .bx svg {
    opacity: 1;
}

.cfo[aria-pressed="true"] {
    font-weight: 600;
}

.cfo .dt {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--h, var(--blue));
    flex: 0 0 auto;
}

.cfo .tx {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cfo .k {
    font-size: 11px;
    color: #93A7B8;
    font-variant-numeric: tabular-nums;
}

.cfo.z {
    opacity: .42;
}

.cfo.z:hover {
    background: none;
}

.cfind {
    margin: 0 9px 7px;
    display: flex;
    align-items: center;
    gap: 7px;
    height: 32px;
    padding: 0 10px;
    border: 1px solid var(--line);
    border-radius: var(--r-in);
}

.cfind svg {
    width: 13px;
    height: 13px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.cfind input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    outline: 0;
    font-size:12px;
}

.cmore {
    display: block;
    width: 100%;
    padding: 7px 9px;
    font-size:11px;
    font-weight: 600;
    color: var(--blue);
    text-align: left;
}

.cmore:hover {
    text-decoration: underline;
}

.cmy {
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
    padding: 12px 16px 14px;
}

.cmy-h {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
    margin-bottom: 9px;
}

.cmy-h svg {
    width: 13px;
    height: 13px;
    color: var(--h3);
}

.cmy-h .n {
    margin-left: auto;
    font-size:10px;
    letter-spacing: 0;
    color: var(--blue);
}

.cmy p {
    margin: 0;
    font-size:11px;
    line-height: 1.55;
    color: var(--ink-2);
}

.cmy-l {
    display: flex;
    flex-direction: column;
    gap: 5px;
}

.cmi {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    width: 100%;
    padding: 7px 8px;
    text-align: left;
    border-radius: var(--r-in);
    border: 1px solid var(--line);
    background: var(--white);
    transition: .15s;
}

.cmi:hover {
    border-color: var(--h, var(--blue));
    background: var(--blue-pale);
}

.cmi .dt {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--h);
    margin-top: 5px;
    flex: 0 0 auto;
}

.cmi .tx {
    flex: 1;
    min-width: 0;
}

.cmi b {
    display: block;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.3;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.cmi i {
    font-style: normal;
    font-size: 11px;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}

.cmi .wr {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-size:10px;
    font-weight: 600;
    color: var(--warn);
}

.cmi .wr svg {
    width: 11px;
    height: 11px;
}

.cmy-f {
    display: flex;
    gap: 7px;
    margin-top: 9px;
}

.cmy-f .cbtn {
    height: 32px;
    padding: 0 12px;
    font-size:11px;
    flex: 1;
}

.crail-f {
    display: none;
}

.cvm-h {
    display: grid;
    grid-template-columns:repeat(7, minmax(0, 1fr));
    gap: 8px;
    position: sticky;
    top: calc(var(--hdr) + var(--tb));
    z-index: 12;
    background: var(--white);
    padding: 8px 0 9px;
}

.cvm-h span {
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
    text-align: center;
}

.cvm-h .we {
    color: #A8B7C4;
}

.cvm {
    display: grid;
    grid-template-columns:repeat(7, minmax(0, 1fr));
    gap: 8px;
}

.cd {
    display: flex;
    flex-direction: column;
    gap: 6px;
    min-height: 124px;
    padding: 9px 9px 10px;
    text-align: left;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    transition: border-color .16s, box-shadow .16s, transform .16s;
}

.cd:hover {
    border-color: var(--h);
    box-shadow: 0 8px 22px rgba(23, 50, 77, .08);
    transform: translateY(-2px);
}

.cd:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.cd.out {
    background: #FBFDFF;
}

.cd.out .cd-n {
    color: #A8B7C4;
}

.cd.zero {
    cursor: default;
}

.cd.zero:hover {
    border-color: var(--line);
    box-shadow: none;
    transform: none;
}

.cd.tod {
    border-color: var(--blue);
    box-shadow: 0 0 0 1px var(--blue) inset;
}

.cd-t {
    display: flex;
    align-items: center;
    gap: 6px;
}

.cd-n {
    font-size:14px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.cd-td {
    font-style: normal;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    background: var(--blue);
    border-radius: var(--r-pill);
    padding: 2px 7px;
}

.cd-c {
    font-style: normal;
    margin-left: auto;
    font-size: 11px;
    font-weight: 700;
    color: var(--h);
    font-variant-numeric: tabular-nums;
}

.cd-bar {
    display: block;
    height: 3px;
    border-radius: 3px;
    background: var(--blue-pale);
    overflow: hidden;
}

.cd-bar i {
    display: block;
    height: 100%;
    border-radius: 3px;
    background: var(--h);
}

.cd.zero .cd-bar {
    background: #F2F7FB;
}

.cd-l {
    display: flex;
    flex-direction: column;
    gap: 3px;
    min-width: 0;
}

.ce {
    display: flex;
    align-items: baseline;
    gap: 5px;
    min-width: 0;
    font-size:11px;
    line-height: 1.35;
    color: var(--ink);
    padding: 3px 6px;
    border-radius: 7px;
    background: color-mix(in srgb, var(--h) 9%, transparent);
    border-left: 3px solid var(--h);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: .14s;
}

.ce:hover {
    background: color-mix(in srgb, var(--h) 18%, transparent);
}

.ce i {
    font-style: normal;
    font-weight: 700;
    font-size:10px;
    color: var(--h);
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
}

.ce[data-my] {
    box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--h) 45%, transparent);
}

.cd-more {
    font-size:10px;
    font-weight: 600;
    color: var(--ink-2);
    padding-left: 6px;
}

.cd:hover .cd-more {
    color: var(--blue);
}

.cvw {
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
}

.cvw-h {
    display: grid;
    grid-template-columns:58px repeat(7, minmax(0, 1fr));
    border-bottom: 1px solid var(--line);
    position: sticky;
    top: calc(var(--hdr) + var(--tb));
    z-index: 12;
    background: var(--white);
    border-radius: var(--r-card) var(--r-card) 0 0;
}

.cvw-dh {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1px;
    padding: 9px 4px 10px;
    border-left: 1px solid var(--line);
    transition: .15s;
}

.cvw-dh:hover {
    background: var(--blue-pale);
}

.cvw-dh:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: -2px;
}

.cvw-dh i {
    font-style: normal;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.cvw-dh b {
    font-size: 16px;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
    line-height: 1.1;
}

.cvw-dh span {
    font-size: 10px;
    font-weight: 600;
    color: var(--blue);
    font-variant-numeric: tabular-nums;
}

.cvw-dh.tod b {
    color: #fff;
    background: var(--blue);
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 13px;
}

.cvw-w {
    position: relative;
}

.cvw-b {
    display: grid;
    grid-template-columns:58px repeat(7, minmax(0, 1fr));
    position: relative;
}

.cvw-t {
    grid-area: 1/1/2/2;
    display: flex;
    flex-direction: column;
}

.cvw-t span {
    font-size:10px;
    color: #93A7B8;
    font-variant-numeric: tabular-nums;
    padding: 0 8px;
    text-align: right;
    transform: translateY(-6px);
}

.cvw-t span:first-child {
    transform: none;
    padding-top: 2px;
}

.cvw-g {
    grid-area: 1/2/2/-1;
    display: flex;
    flex-direction: column;
    pointer-events: none;
}

.cvw-g span {
    border-top: 1px solid #EDF5FB;
}

.cvw-g span:first-child {
    border-top: 0;
}

.cvw-d {
    grid-row: 1;
    position: relative;
    border-left: 1px solid var(--line);
    min-width: 0;
}

.cvw-d:nth-child(3) {
    grid-column: 2;
}

.cvw-d:nth-child(4) {
    grid-column: 3;
}

.cvw-d:nth-child(5) {
    grid-column: 4;
}

.cvw-d:nth-child(6) {
    grid-column: 5;
}

.cvw-d:nth-child(7) {
    grid-column: 6;
}

.cvw-d:nth-child(8) {
    grid-column: 7;
}

.cvw-d:nth-child(9) {
    grid-column: 8;
}

.cvw-d.we {
    background: #FBFDFF;
}

button.we {
    position: absolute;
    display: flex;
    flex-direction: column;
    gap: 1px;
    overflow: hidden;
    padding: 4px 6px;
    text-align: left;
    border-radius: 8px;
    min-height: 20px;
    background: color-mix(in srgb, var(--h) 12%, #fff);
    border-left: 3px solid var(--h);
    transition: .14s;
}

button.we:hover {
    background: color-mix(in srgb, var(--h) 22%, #fff);
    z-index: 6;
    box-shadow: 0 6px 18px rgba(23, 50, 77, .14);
}

button.we:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 1px;
    z-index: 7;
}

button.we i {
    font-style: normal;
    font-size: 10px;
    font-weight: 700;
    color: var(--h);
    font-variant-numeric: tabular-nums;
}

button.we b {
    font-size:11px;
    font-weight: 600;
    line-height: 1.25;
    color: var(--ink);
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

button.we u {
    text-decoration: none;
    font-size: 10px;
    color: var(--ink-2);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

button.we.nw b, button.we.nw u {
    display: none;
}

button.we.nw:hover, button.we.nw:focus-visible {
    left: 1px !important;
    width: calc(100% - 2px) !important;
    z-index: 9;
}

button.we.nw:hover b, button.we.nw:hover u,
button.we.nw:focus-visible b, button.we.nw:focus-visible u {
    display: block;
}

button.we.past {
    opacity: .5;
}

button.we.my {
    box-shadow: inset 0 0 01px var(--h);
}

button.we.on {
    background: var(--h);
}

button.we.on i, button.we.on b, button.we.on u {
    color: #fff;
}

.we-more {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 8px;
    border: 1px dashed var(--line);
    background: var(--blue-pale);
    font-size: 11px;
    font-weight: 700;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}

.we-more:hover {
    border-color: var(--blue);
    color: var(--blue);
    background: #E4F1FB;
}

.we-more:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 1px;
}

.nowl {
    position: absolute;
    left: 0;
    right: 0;
    height: 0;
    border-top: 2px solid var(--h3);
    z-index: 8;
    pointer-events: none;
}

.nowl i {
    position: absolute;
    left: 0;
    top: -8px;
    font-style: normal;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #fff;
    background: var(--h3);
    border-radius: var(--r-pill);
    padding: 1px 6px;
}

.cva {
    display: flex;
    flex-direction: column;
    gap: clamp(16px, 2vh, 24px);
}

.ag-g {
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    overflow: hidden;
}

.ag-d {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 11px 16px;
    background: var(--blue-pale);
    border-bottom: 1px solid var(--line);
}

.ag-d b {
    font-size: 18px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    line-height: 1;
}

.ag-d span {
    display: flex;
    flex-direction: column;
    line-height: 1.25;
}

.ag-d span i {
    font-style: normal;
    font-size:12px;
    font-weight: 600;
    text-transform: capitalize;
}

.ag-d span {
    font-size: 11px;
    color: var(--ink-2);
}

.ag-d em {
    font-style: normal;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #fff;
    background: var(--blue);
    border-radius: var(--r-pill);
    padding: 3px 8px;
}

.ag-d u {
    text-decoration: none;
    margin-left: auto;
    font-size:11px;
    font-weight: 600;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}

.ag-ics {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: var(--white);
    border: 1px solid var(--line);
    color: var(--ink-2);
    flex: 0 0 auto;
    transition: .15s;
}

.ag-ics:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.ag-ics svg {
    width: 14px;
    height: 14px;
}

.ag-i {
    position: relative;
    display: flex;
    align-items: flex-start;
    gap: 13px;
    width: 100%;
    padding: 12px 16px 12px 18px;
    text-align: left;
    border-top: 1px solid #EDF5FB;
    transition: .15s;
}

.ag-i:first-of-type {
    border-top: 0;
}

.ag-i:hover {
    background: color-mix(in srgb, var(--h) 5%, transparent);
}

.ag-i:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: -2px;
}

.ag-i.past {
    opacity: .52;
}

.ag-i.on {
    background: color-mix(in srgb, var(--h) 9%, transparent);
}

.ag-d2 {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
}

.ag-h {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    flex: 0 0 auto;
    width: 52px;
    font-variant-numeric: tabular-nums;
}

.ag-h b {
    font-size: 14px;
    font-weight: 700;
}

.ag-h i {
    font-style: normal;
    font-size: 11px;
    color: var(--ink-2);
}

.ag-x {
    flex: 1;
    min-width: 0;
}

.ag-n {
    display: block;
    font-size:14px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--ink);
}

.ag-my {
    font-style: normal;
    color: var(--h3);
}

.ag-my svg {
    width: 12px;
    height: 12px;
    vertical-align: -1px;
}

.ag-m {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 14px;
    margin-top: 5px;
    font-size:11px;
    color: var(--ink-2);
}

.ag-m > span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 0;
}

.ag-m svg {
    width: 13px;
    height: 13px;
    color: #93A7B8;
    flex: 0 0 auto;
}

.ag-m b {
    font-weight: 700;
    color: var(--ink);
}

.ag-m .fr {
    color: var(--ok);
    font-weight: 600;
}

.ag-m .fr svg {
    color: var(--ok);
}

.cempty {
    padding: clamp(36px, 7vh, 72px) 24px;
    text-align: center;
    background: var(--white);
    border: var(--bw) dashed var(--line);
    border-radius: var(--r-card);
}

.cempty b {
    display: block;
    font-size: 17px;
    font-weight: 700;
}

.cempty p {
    margin: 9px auto 0;
    max-width: 52ch;
    font-size:13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.cemw {
    margin-bottom: 16px;
}

.cempty-f {
    display: flex;
    gap: 9px;
    justify-content: center;
    flex-wrap: wrap;
    margin-top: 18px;
}

.cpan {
    position: fixed;
    top: var(--hdr);
    right: 0;
    width: 404px;
    max-width: 100vw;
    height: calc(100vh - var(--hdr));
    z-index: 120;
    display: flex;
    flex-direction: column;
    background: var(--white);
    border-left: 1px solid var(--line);
    box-shadow: -18px 0 48px rgba(23, 50, 77, .14);
    transform: translateX(101%);
    transition: transform .2s cubic-bezier(.22, .7, .3, 1);
    visibility: hidden;
}

.cpan.on {
    transform: none;
    visibility: visible;
}

.cpan-h {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    padding: 15px 18px 13px;
    border-bottom: 1px solid var(--line);
    flex: 0 0 auto;
}

.cpan-h .tx {
    flex: 1;
    min-width: 0;
}

.cpan-dm {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--h);
}

.cpan-dm .dt {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--h);
}

.cpan-h h2 {
    margin: 7px 0 0;
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -.015em;
    line-height: 1.24;
    text-wrap: balance;
}

.cpan-x {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--blue-pale);
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ink);
}

.cpan-x:hover {
    background: var(--blue);
    color: #fff;
}

.cpan-x svg {
    width: 12px;
    height: 12px;
}

.cpan-b {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 18px 18px;
}

.cpan-when {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 11px 13px;
    border-radius: var(--r-in);
    background: color-mix(in srgb, var(--h) 8%, transparent);
    border: 1px solid color-mix(in srgb, var(--h) 22%, transparent);
}

.cpan-when .hr {
    font-size: 19px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--h);
    line-height: 1.1;
}

.cpan-when .dy {
    font-size:12px;
    color: var(--ink);
    line-height: 1.4;
}

.cpan-when .dy b {
    display: block;
    font-weight: 700;
    text-transform: capitalize;
}

.cpan-ses {
    margin-left: auto;
    text-align: right;
    font-size:10px;
    font-weight: 700;
    color: var(--ink-2);
    letter-spacing: .04em;
    text-transform: uppercase;
    flex: 0 0 auto;
}

.cpan-warn {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin-top: 11px;
    padding: 10px 12px;
    border-radius: var(--r-in);
    background: var(--warn-bg);
    color: var(--warn);
    font-size: 12px;
    line-height: 1.5;
    font-weight: 500;
}

.cpan-warn svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    margin-top: 1px;
}

.cpan-r {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 11px 0;
    border-bottom: 1px solid #EDF5FB;
    font-size: 13px;
    line-height: 1.5;
}

.cpan-r > svg {
    width: 16px;
    height: 16px;
    color: #93A7B8;
    flex: 0 0 auto;
    margin-top: 1px;
}

.cpan-r .k {
    font-size:10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #93A7B8;
    display: block;
    margin-bottom: 2px;
}

.cpan-r .v {
    min-width: 0;
}

.cpan-r .v b {
    font-weight: 600;
}

.cpan-r .ok {
    color: var(--ok);
    font-weight: 600;
}

.cpan-r .no {
    color: var(--h3);
    font-weight: 600;
}

.cpan-h4 {
    margin: 16px 0 8px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.cpan-ss {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.cpan-ss button {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size:11px;
    font-weight: 600;
    padding: 5px 9px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    color: var(--ink-2);
    background: var(--white);
    font-variant-numeric: tabular-nums;
    transition: .14s;
}

.cpan-ss button:hover {
    border-color: var(--h);
    color: var(--h);
}

.cpan-ss button.on {
    background: var(--h);
    border-color: var(--h);
    color: #fff;
}

.cpan-ss button.past {
    opacity: .45;
}

.cpan-f {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 13px 18px 16px;
    border-top: 1px solid var(--line);
    background: var(--white);
}

.cpan-f .row {
    display: flex;
    gap: 8px;
}

.cpan-f .cbtn {
    flex: 1;
    height: 42px;
}

.cpan-sv {
    border-color: var(--line);
}

.cpan-sv[aria-pressed="true"] {
    background: color-mix(in srgb, var(--h3) 10%, #fff);
    border-color: var(--h3);
    color: var(--h3);
}

.cpan-sv svg {
    color: var(--h3);
}

.cpan-sv[aria-pressed="true"] svg {
    fill: var(--h3);
}

.ckbd {
    margin-top: clamp(18px, 2.4vh, 28px);
    font-size:11px;
    color: #8A9CAC;
    display: flex;
    align-items: center;
    gap: 8px;
}

.ckbd svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

.cnote {
    padding: 16px 0 0;
    font-size:11px;
    line-height: 1.6;
    color: #8A9CAC;
}

.csveil {
    position: fixed;
    inset: 0;
    z-index: 110;
    background: rgba(23, 50, 77, .3);
    opacity: 0;
    visibility: hidden;
    transition: .2s;
}

.csveil.on {
    opacity: 1;
    visibility: visible;
}

.cfbtn {
    display: none;
}

@media (max-width: 1000px) {
    .cbody {
        grid-template-columns:minmax(0, 1fr);
    }

    .cfbtn {
        display: inline-flex;
    }

    .crail {
        position: fixed;
        left: 0;
        right: 0;
        bottom: 0;
        top: auto;
        width: auto;
        max-height: 84vh;
        z-index: 130;
        border-radius: var(--r-card) var(--r-card) 0 0;
        border-left: 0;
        border-right: 0;
        border-bottom: 0;
        box-shadow: 0 -18px 48px rgba(23, 50, 77, .18);
        transform: translateY(101%);
        transition: transform .24s cubic-bezier(.22, .7, .3, 1);
        visibility: hidden;
        padding-bottom: 0;
    }

    .crail.open {
        transform: none;
        visibility: visible;
    }

    .crail-h .xs {
        display: flex;
    }

    .crail-f {
        display: block;
        padding: 10px 14px 14px;
        border-top: 1px solid var(--line);
        position: sticky;
        bottom: 0;
        background: var(--white);
    }

    .crail-f .cbtn {
        width: 100%;
        height: 44px;
    }

    .cvm-h, .cvw-h {
        position: static;
    }
}

@media (max-width: 900px) {
    .cvw {
        overflow-x: auto;
    }

    .cvw-h, .cvw-b {
        min-width: 720px;
    }

    .cpan {
        width: 100%;
        top: auto;
        bottom: 0;
        height: auto;
        max-height: 88vh;
        border-left: 0;
        border-radius: var(--r-card) var(--r-card) 0 0;
        border-top: 1px solid var(--line);
        box-shadow: 0 -18px 48px rgba(23, 50, 77, .18);
        transform: translateY(101%);
    }

    .cpan.on {
        transform: none;
    }

    .ctool .wrap {
        gap: 9px;
    }

    .cnav {
        order: 1;
    }

    .cper {
        flex: 1;
        order: 2;
        min-width: 120px;
    }

    .ctool-r {
        order: 3;
        width: 100%;
        margin-left: 0;
        gap: 8px;
        flex-wrap: nowrap;
    }

    .cseg {
        flex: 1;
        min-width: 0;
    }

    .cseg button {
        flex: 1;
        padding: 0 6px;
    }

    .csrch {
        order: 0;
        width: 38px;
        padding: 0;
        justify-content: center;
        flex: 0 0 auto;
        transition: width .2s;
    }

    .csrch input, .csrch kbd {
        display: none;
    }

    .csrch.exp {
        width: 100%;
        order: 9;
        padding: 0 13px;
        justify-content: flex-start;
    }

    .csrch.exp input {
        display: block;
    }

    #calFbtn, #calDl {
        flex: 0 0 auto;
    }

    #calDl {
        width: 38px;
        padding: 0;
    }

    #calDl .lb {
        display: none;
    }

    #calFbtn span[data-i18n] {
        display: none;
    }
}

@media (max-width: 680px) {
    .ctool .wrap {
        gap: 8px;
    }

    .csum {
        display: none;
    }

    .cseg button {
        font-size: 12px;
        padding: 0 4px;
    }

    #calFbtn {
        padding: 0 10px;
    }

    .cvm {
        gap: 5px;
    }

    .cvm-h {
        gap: 5px;
    }

    .cd {
        min-height: 64px;
        padding: 6px 5px 7px;
        gap: 4px;
    }

    .cd-l {
        display: none;
    }

    .cd-td {
        display: none;
    }

    .cd-n {
        font-size:12px;
    }

    .ag-i {
        padding: 11px 13px 11px 15px;
        gap: 10px;
    }

    .ag-h {
        width: 44px;
    }

    .ag-n {
        font-size:13px;
    }

    .cnav .cbtn.ico {
        width: 34px;
        height: 34px;
    }
}

.cbtn > svg:not([class]), .ctg svg:not([class]), .cfo svg:not([class]),
.cmi svg:not([class]), .cmy-h svg:not([class]), .cpan-r > svg:not([class]),
.cpan-warn svg:not([class]), .cpan-f svg:not([class]), .cfind svg:not([class]),
.ag-m svg:not([class]), .ag-ics svg:not([class]), .ckbd svg:not([class]),
.cempty svg:not([class]) {
    width: 15px;
    height: 15px;
}

.instp {
    padding-bottom: clamp(40px, 6vh, 72px);
}

.ihead {
    padding: clamp(26px, 3.4vh, 40px) 0 4px;
    background: linear-gradient(180deg, var(--blue-pale), rgba(238, 247, 253, 0));
}

.ihead h1 {
    margin: 13px 0 0;
    font-size: clamp(28px, 3.4vw, 44px);
    font-weight: 800;
    letter-spacing: -.022em;
    line-height: 1.06;
    text-wrap: balance;
}

.ihead .lede {
    margin: 11px 0 0;
    max-width: 66ch;
}

.isum {
    display: grid;
    grid-template-columns:repeat(6, minmax(0, 1fr));
    gap: 10px;
    margin-top: clamp(18px, 2.4vh, 26px);
}

.isc {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 13px 14px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    box-shadow: var(--sh-card);
}

.isc svg {
    width: 16px;
    height: 16px;
    color: var(--blue);
    margin-bottom: 4px;
}

.isc b {
    font-size: clamp(20px, 2.2vw, 27px);
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.isc span {
    font-size:11px;
    line-height: 1.4;
    color: var(--ink-2);
}

.ihow {
    margin-top: clamp(22px, 3vh, 34px);
}

.ihow-h {
    margin: 0 0 12px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.ihow-l {
    display: grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap: 12px;
}

.ihw {
    position: relative;
    padding: 16px 17px 17px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    border-top: 3px solid var(--h);
}

.ihw-n {
    position: absolute;
    right: 14px;
    top: 12px;
    font-size: 26px;
    font-weight: 800;
    line-height: 1;
    color: color-mix(in srgb, var(--h) 18%, transparent);
    font-variant-numeric: tabular-nums;
}

.ihw-i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 32px;
    height: 32px;
    border-radius: 10px;
    background: color-mix(in srgb, var(--h) 11%, transparent);
    color: var(--h);
    margin-bottom: 11px;
}

.ihw-i svg {
    width: 17px;
    height: 17px;
}

.ihw b {
    display: block;
    font-size:14px;
    font-weight: 700;
    line-height: 1.3;
}

.ihw p {
    margin: 6px 0 0;
    font-size:12px;
    line-height: 1.6;
    color: var(--ink-2);
}

.imxs {
    padding-top: var(--sp);
}

.imxs .sec-head {
    margin-bottom: clamp(16px, 2vh, 24px);
}

.imxby {
    display: inline-flex;
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 3px;
    flex: 0 0 auto;
}

.imxby button {
    height: 32px;
    padding: 0 15px;
    font-size:12px;
    font-weight: 600;
    color: var(--ink-2);
    border-radius: var(--r-pill);
    transition: .16s;
}

.imxby button:hover {
    color: var(--blue);
}

.imxby button[aria-pressed="true"] {
    background: var(--white);
    color: var(--blue);
    box-shadow: 0 1px 3px rgba(23, 50, 77, .1);
}

.imxby button:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 1px;
}

.imx {
    overflow-x: auto;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    scrollbar-width: thin;
}

.imx table {
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 660px;
}

.imx th, .imx td {
    padding: 0;
    border-bottom: 1px solid #EDF5FB;
}

.imx tbody tr:last-child th, .imx tbody tr:last-child td {
    border-bottom: 1px solid var(--line);
}

.imx thead th {
    position: sticky;
    top: 0;
    z-index: 3;
    background: var(--white);
    border-bottom: 1px solid var(--line);
    padding: 0 0 0 0;
    vertical-align: bottom;
}

.imx thead th button {
    display: block;
    width: 100%;
    padding: 11px 6px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--ink-2);
    transition: .15s;
}

.imx thead th button:hover {
    color: var(--blue);
    background: var(--blue-pale);
}

.imx thead th button[aria-pressed="true"] {
    color: #fff;
    background: var(--blue);
}

.imx thead th button:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: -2px;
}

.imx .rh {
    position: sticky;
    left: 0;
    z-index: 2;
    background: var(--white);
    text-align: left;
    border-right: 1px solid var(--line);
    min-width: 186px;
}

.imx thead .rh {
    z-index: 4;
    padding: 11px 14px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.imx tbody .rh button {
    display: flex;
    align-items: center;
    gap: 9px;
    width: 100%;
    padding: 9px 14px;
    text-align: left;
    transition: .15s;
}

.imx tbody .rh button:hover {
    background: var(--blue-pale);
}

.imx tbody .rh button:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: -2px;
}

.imx tbody .rh .tx {
    min-width: 0;
}

.imx tbody .rh b {
    display: block;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.25;
}

.imx tbody .rh i {
    font-style: normal;
    font-size:10px;
    color: #93A7B8;
}

.imx tbody tr.on .rh {
    background: var(--blue-pale);
}

.imx td {
    text-align: center;
    vertical-align: middle;
}

.imx td a {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 40px;
    margin: 3px;
    border-radius: 9px;
    font-size: 13px;
    font-weight: 700;
    color: #0D3D63;
    font-variant-numeric: tabular-nums;
    background: rgba(31, 117, 188, var(--a, .1));
    transition: .15s;
}

.imx td a:hover {
    transform: scale(1.06);
    box-shadow: 0 4px 12px rgba(31, 117, 188, .25);
}

.imx td a:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.imx td.z {
    background: repeating-linear-gradient(135deg, transparent 0 5px, #F6FAFD 5px 6px);
}

.imx .tt {
    font-size: 12px;
    font-weight: 700;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
    background: #FBFDFF;
    padding: 0 10px;
}

.imx thead .tt {
    font-size: 11px;
    letter-spacing: .05em;
    text-transform: uppercase;
    padding: 11px 10px;
}

.imx tfoot .tt {
    border-bottom: 0;
}

.imx tfoot .rh {
    background: #FBFDFF;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--ink-2);
    padding: 10px 14px;
    border-bottom: 0;
}

.imx.dom table {
    min-width: 1020px;
}

.imx.dom .rh {
    min-width: 150px;
}

.imx.dom tbody .rh button {
    padding: 8px 10px;
    gap: 7px;
}

.imx.dom tbody .rh b {
    font-size: 12px;
}

.imx.dom thead th button {
    padding: 9px 3px;
    font-size: 9px;
    letter-spacing: .02em;
}

.imx.dom thead .rh, .imx.dom tfoot .rh {
    padding: 9px 10px;
}

.imx.dom td a {
    height: 34px;
    margin: 2px;
    font-size: 12px;
    border-radius: 8px;
}

.imx.dom .tt {
    font-size:11px;
    padding: 0 7px;
}

.imx.dom thead .tt {
    font-size: 9px;
    padding: 9px 7px;
}

.imx-lg {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 11px;
    font-size:11px;
    color: #8A9CAC;
    flex-wrap: wrap;
}

.imx-lg .sc {
    display: flex;
    align-items: center;
    gap: 3px;
}

.imx-lg .sc i {
    width: 16px;
    height: 10px;
    border-radius: 3px;
    background: rgba(31, 117, 188, var(--a, 0));
}

.imx-lg .sc .zi {
    background: repeating-linear-gradient(135deg, transparent 0 5px, #E4EEF6 5px 6px);
    border: 1px solid #EDF5FB;
}

.ilist {
    padding-top: var(--sp);
    scroll-margin-top: calc(var(--hdr) + 18px);
}

.itool {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: clamp(14px, 1.8vh, 20px);
}

.isw {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 13px;
    width: 280px;
    max-width: 100%;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    transition: border-color .18s, box-shadow .18s;
}

.isw:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .13);
}

.isw > svg {
    width: 16px;
    height: 16px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.isw input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    outline: 0;
    font-size:13px;
}

.isw kbd {
    font: inherit;
    font-size:10px;
    font-weight: 600;
    color: #93A7B8;
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 2px 6px;
}

.isw .xq {
    display: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    background: var(--blue-pale);
    color: var(--ink-2);
}

.isw .xq svg {
    width: 10px;
    height: 10px;
}

.isw.has .xq {
    display: flex;
}

.isw.has kbd {
    display: none;
}

.icnt {
    font-size: 13px;
    color: var(--ink-2);
}

.icnt b {
    font-size: 15px;
    font-weight: 800;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.itool-r {
    display: flex;
    align-items: center;
    gap: 9px;
    margin-left: auto;
}

.itool-r select {
    height: 40px;
    padding: 0 12px;
    font-size: 13px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    color: var(--ink);
}

.ixa {
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-2);
    text-decoration: underline;
    text-decoration-color: var(--line);
}

.ixa:hover {
    color: var(--h3);
}

.ixa[hidden] {
    display: none;
}

.ichips {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.ich {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size:12px;
    font-weight: 600;
    padding: 7px 13px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
    transition: .15s;
}

.ich:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.ich[aria-pressed="true"] {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.ich:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.ich .k {
    font-size:10px;
    font-variant-numeric: tabular-nums;
    opacity: .7;
}

.ich.z {
    opacity: .44;
}

.ich .tk {
    width: 12px;
    height: 12px;
    opacity: 0;
    margin-right: -3px;
}

.ich.tg[aria-pressed="true"] .tk {
    opacity: 1;
}

.ich.tg {
    border-style: dashed;
}

.ich.tg[aria-pressed="true"] {
    border-style: solid;
}

.ipills {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.ipills[hidden] {
    display: none;
}

.ipill {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    padding: 6px 10px 6px 11px;
    border-radius: var(--r-pill);
    color: var(--ink);
    background: color-mix(in srgb, var(--h, var(--blue)) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--h, var(--blue)) 34%, transparent);
    transition: .15s;
}

.ipill:hover {
    background: color-mix(in srgb, var(--h, var(--blue)) 18%, transparent);
}

.ipill .dt {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--h);
}

.ipill .pn {
    width: 12px;
    height: 12px;
    color: var(--blue);
}

.ipill .xx {
    width: 9px;
    height: 9px;
    opacity: .55;
}

.ipill:hover .xx {
    opacity: 1;
}

.igrid {
    display: grid;
    grid-template-columns:repeat(auto-fill, minmax(316px, 1fr));
    gap: 14px;
    align-items: stretch;
}

.igrid.empty {
    display: block;
}

.ic {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 18px 18px 16px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    border-top: 3px solid var(--h);
    transition: transform .2s, box-shadow .2s, border-color .2s;
}

.ic:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
}

.ic.on {
    border-color: var(--h);
    box-shadow: var(--sh-hov);
}

.ic-h {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

.imono {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size:12px;
    font-weight: 800;
    letter-spacing: .02em;
    color: #fff;
    background: var(--h, var(--blue));
}

.imono.lg {
    width: 46px;
    height: 46px;
    border-radius: 13px;
    font-size: 16px;
}

.ic-t {
    min-width: 0;
}

.ic-ty {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--h);
}

.ic-role {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    font-style: normal;
    font-size: 9px;
    letter-spacing: .06em;
    color: var(--blue);
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 2px 8px;
}

.ic-role svg {
    width: 10px;
    height: 10px;
    fill: currentColor;
    stroke-width: 1;
}

.ic-nm {
    margin: 6px 0 0;
    font-size: 17px;
    font-weight: 800;
    letter-spacing: -.015em;
    line-height: 1.2;
}

.ic-fl {
    margin: 3px 0 0;
    font-size:11px;
    line-height: 1.45;
    color: #8A9CAC;
}

.ic-d {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.ic-st {
    display: grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap: 8px;
}

.ic-st span {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 9px 10px;
    border-radius: var(--r-in);
    background: var(--blue-pale);
}

.ic-st b {
    font-size: 17px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.ic-st i {
    font-style: normal;
    font-size:10px;
    color: var(--ink-2);
}

.ic-fr {
    display: flex;
    align-items: center;
    gap: 10px;
}

.ic-frb {
    flex: 1;
    min-width: 0;
    height: 5px;
    border-radius: 5px;
    background: var(--blue-pale);
    overflow: hidden;
}

.ic-frb i {
    display: block;
    height: 100%;
    border-radius: 5px;
    background: var(--ok);
}

.ic-frt {
    font-size:11px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.ic-frt b {
    font-weight: 700;
    color: var(--ok);
}

.ic-sc {
    display: flex;
    gap: 5px;
}

.ic-sd {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
}

.ic-sd i {
    display: block;
    width: 100%;
    height: 4px;
    border-radius: 4px;
    background: #E8F1F8;
}

.ic-sd u {
    text-decoration: none;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #B3C2CE;
}

.ic-sd.on i {
    background: var(--h);
}

.ic-sd.on u {
    color: var(--ink-2);
}

.ic-coord {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0;
    padding: 11px 12px;
    border-radius: var(--r-in);
    background: var(--info-bg);
    color: var(--blue-dark);
    font-size: 12px;
    line-height: 1.55;
}

.ic-coord svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    margin-top: 1px;
}

.ic-dm {
    display: flex;
    gap: 6px;
    flex-wrap: wrap;
}

.idm {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size:11px;
    font-weight: 600;
    padding: 5px 10px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    color: var(--ink-2);
}

.idm i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--h);
}

.idm.mo {
    color: #93A7B8;
}

.ic-a {
    display: flex;
    gap: 8px;
    margin-top: auto;
    padding-top: 2px;
}

.ibtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 38px;
    padding: 0 15px;
    font-size:12px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw-btn) solid var(--line);
    border-radius: var(--r-pill);
    transition: .16s;
    white-space: nowrap;
}

.ibtn:hover {
    border-color: var(--h, var(--blue));
    color: var(--h, var(--blue));
}

.ibtn:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.ibtn svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.ibtn.pr {
    background: var(--h, var(--blue));
    border-color: var(--h, var(--blue));
    color: #fff;
}

.ibtn.pr:hover {
    color: #fff;
    filter: brightness(.94);
}

.ibtn.ico {
    width: 38px;
    padding: 0;
    flex: 0 0 auto;
}

.iempty {
    padding: clamp(36px, 7vh, 72px) 24px;
    text-align: center;
    background: var(--white);
    border: var(--bw) dashed var(--line);
    border-radius: var(--r-card);
}

.iempty b {
    display: block;
    font-size: 17px;
    font-weight: 700;
}

.iempty p {
    margin: 9px auto 18px;
    max-width: 52ch;
    font-size:13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.ipan {
    position: fixed;
    top: var(--hdr);
    right: 0;
    width: 428px;
    max-width: 100vw;
    height: calc(100vh - var(--hdr));
    z-index: 120;
    display: flex;
    flex-direction: column;
    background: var(--white);
    border-left: 1px solid var(--line);
    box-shadow: -18px 0 48px rgba(23, 50, 77, .14);
    transform: translateX(101%);
    transition: transform .2s cubic-bezier(.22, .7, .3, 1);
    visibility: hidden;
}

.ipan.on {
    transform: none;
    visibility: visible;
}

.ipan-h {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 15px 18px 14px;
    border-bottom: 1px solid var(--line);
    flex: 0 0 auto;
}

.ipan-h .tx {
    flex: 1;
    min-width: 0;
}

.ipan-h h2 {
    margin: 6px 0 0;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -.015em;
    line-height: 1.22;
    text-wrap: balance;
}

.ipan-x {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--blue-pale);
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ink);
}

.ipan-x:hover {
    background: var(--blue);
    color: #fff;
}

.ipan-x svg {
    width: 12px;
    height: 12px;
}

.ipan-b {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 18px 18px;
}

.ipan-full {
    margin: 0;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.5;
    color: var(--h);
}

.ipan-d {
    margin: 8px 0 14px;
    font-size:13px;
    line-height: 1.65;
    color: var(--ink-2);
}

.ipan-st {
    display: grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap: 7px;
}

.ipan-st span {
    display: flex;
    flex-direction: column;
    gap: 1px;
    padding: 9px 8px;
    border-radius: var(--r-in);
    background: color-mix(in srgb, var(--h) 8%, transparent);
}

.ipan-st b {
    font-size: 16px;
    font-weight: 800;
    line-height: 1;
    font-variant-numeric: tabular-nums;
}

.ipan-st i {
    font-style: normal;
    font-size: 10px;
    color: var(--ink-2);
}

.ipan-note {
    margin: 8px 0 14px;
    font-size:11px;
    line-height: 1.5;
    color: #8A9CAC;
}

.ipan-coord {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    margin: 0 0 14px;
    padding: 11px 12px;
    border-radius: var(--r-in);
    background: var(--info-bg);
    color: var(--blue-dark);
    font-size:12px;
    line-height: 1.55;
}

.ipan-coord svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
    margin-top: 1px;
}

.ipan-r {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 11px 0;
    border-bottom: 1px solid #EDF5FB;
    font-size: 13px;
    line-height: 1.5;
}

.ipan-r > svg {
    width: 16px;
    height: 16px;
    color: #93A7B8;
    flex: 0 0 auto;
    margin-top: 1px;
}

.ipan-r .k {
    display: block;
    margin-bottom: 2px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #93A7B8;
}

.ipan-r .v {
    min-width: 0;
}

.ipan-r .ok {
    color: var(--ok);
    font-weight: 600;
}

.ipan-r .no {
    color: var(--ink-2);
}

.ipan-h4 {
    margin: 18px 0 9px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.ipan-h4 .n {
    color: var(--blue);
    letter-spacing: 0;
}

.ipan-ct {
    margin-top: 16px;
    padding: 13px 14px;
    border-radius: var(--r-card);
    background: #FBFDFF;
    border: 1px dashed var(--line);
}

.ipan-ct .ipan-h4 {
    margin: 0 0 9px;
}

.ipan-cl {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.ipan-cf {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size:12px;
}

.ipan-cf svg {
    width: 15px;
    height: 15px;
    color: #B3C2CE;
    flex: 0 0 auto;
}

.ipan-cf .cfl {
    color: var(--ink-2);
    flex: 0 0 auto;
}

.ipan-cf .cfv {
    flex: 1;
    height: 1px;
    border-bottom:1px dashed #D7E5F0;
}

.ipan-cp {
    margin: 10px 0 0;
    font-size: 11px;
    line-height: 1.55;
    color: #8A9CAC;
}

.idml {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.idmr {
    display: flex;
    align-items: center;
    gap: 9px;
    font-size:12px;
}

.idmr-n {
    flex: 0 0 118px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.idmr-b {
    flex: 1;
    min-width: 0;
    height: 6px;
    border-radius: 6px;
    background: var(--blue-pale);
    overflow: hidden;
}

.idmr-b i {
    display: block;
    height: 100%;
    border-radius: 6px;
    background: var(--h);
}

.idmr-v {
    flex: 0 0 auto;
    font-size:11px;
    font-weight: 700;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}

.ilocs {
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.iloc {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 12px;
    border-radius: var(--r-in);
    border: 1px solid var(--line);
    background: var(--white);
    transition: .15s;
}

.iloc:hover {
    border-color: var(--h);
    background: color-mix(in srgb, var(--h) 5%, transparent);
}

.iloc-x {
    flex: 1;
    min-width: 0;
}

.iloc b {
    display: block;
    font-size: 13px;
    font-weight: 600;
    line-height: 1.3;
}

.iloc i {
    display: block;
    font-style: normal;
    font-size:11px;
    color: var(--ink-2);
    margin-top: 1px;
}

.iloc u {
    display: block;
    text-decoration: none;
    font-size: 11px;
    color: #93A7B8;
    margin-top: 2px;
}

.iloc .ar {
    width: 14px;
    height: 14px;
    color: #B3C2CE;
    flex: 0 0 auto;
}

.iloc:hover .ar {
    color: var(--h);
}

.ipan-f {
    flex: 0 0 auto;
    display: flex;
    gap: 8px;
    padding: 13px 18px 16px;
    border-top: 1px solid var(--line);
    background: var(--white);
}

.ipan-f .ibtn {
    flex: 1;
    height: 42px;
}

.iveil {
    position: fixed;
    inset: var(--hdr) 0 0 0;
    z-index: 110;
    background: rgba(23, 50, 77, .28);
    opacity: 0;
    visibility: hidden;
    transition: .2s;
}

.iveil.on {
    opacity: 1;
    visibility: visible;
}

.ipart {
    margin-top: var(--sp);
    padding: clamp(28px, 4vh, 44px) 0;
    background: var(--blue-pale);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.ipart h2 {
    margin: 12px 0 0;
    font-size: clamp(24px, 2.8vw, 34px);
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.1;
    text-wrap: balance;
}

.ipart .lede {
    margin: 10px 0 0;
    max-width: 62ch;
}

.ipart-s {
    display: grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap: 12px;
    margin-top: clamp(20px, 2.6vh, 30px);
}

.ips {
    position: relative;
    padding: 15px 16px 16px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
}

.ips-n {
    position: absolute;
    right: 13px;
    top: 11px;
    font-size: 24px;
    font-weight: 800;
    line-height: 1;
    color: color-mix(in srgb, var(--h) 20%, transparent);
    font-variant-numeric: tabular-nums;
}

.ips-i {
    width: 17px;
    height: 17px;
    color: var(--h);
    margin-bottom: 9px;
}

.ips b {
    display: block;
    font-size:13px;
    font-weight: 700;
    line-height: 1.3;
}

.ips p {
    margin: 5px 0 0;
    font-size: 12px;
    line-height: 1.55;
    color: var(--ink-2);
}

.ipart-l {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin-top: 12px;
}

.ipl {
    padding: 15px 17px 16px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
}

.ipl-h {
    margin: 0 0 9px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.ipl ul {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 7px;
}

.ipl li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-size: 13px;
    line-height: 1.5;
}

.ipl li .tk {
    width: 14px;
    height: 14px;
    color: var(--ok);
    flex: 0 0 auto;
    margin-top: 2px;
}

.ipl.give li .tk {
    color: var(--blue);
}

.ipart-a {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.ipart-a .ibtn {
    height: 44px;
    padding: 0 20px;
    font-size:13px;
}

.ipart-a .ibtn.pr {
    --h: var(--blue);
}

.ikbd {
    margin-top: clamp(16px, 2.2vh, 24px);
    display: flex;
    align-items: center;
    gap: 8px;
    font-size:11px;
    color: #8A9CAC;
}

.ikbd svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

.inote {
    padding: 16px 0 0;
    font-size:11px;
    line-height: 1.6;
    color: #8A9CAC;
}

@media (max-width: 1080px) {
    .isum {
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }

    .ihow-l {
        grid-template-columns:minmax(0, 1fr);
    }

    .ipart-s {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {

    .imxs .sec-head {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
    }

    .imxs .sec-head-r {
        padding-bottom: 0;
    }

    .imxby {
        width: 100%;
    }

    .imxby button {
        flex: 1;
        padding: 0 8px;
    }

    .ipan {
        width: 100%;
        top: auto;
        bottom: 0;
        height: auto;
        max-height: 88vh;
        border-left: 0;
        border-radius: var(--r-card) var(--r-card) 0 0;
        border-top: 1px solid var(--line);
        box-shadow: 0 -18px 48px rgba(23, 50, 77, .18);
        transform: translateY(101%);
    }

    .ipan.on {
        transform: none;
    }

    .itool-r {
        width: 100%;
        margin-left: 0;
    }

    .itool-r select {
        flex: 1;
    }

    .isw {
        width: 100%;
    }

    .igrid {
        grid-template-columns:minmax(0, 1fr);
    }
}

@media (max-width: 680px) {
    .isum {
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .isc {
        padding: 11px 12px;
    }

    .ipart-s, .ipart-l {
        grid-template-columns:minmax(0, 1fr);
    }

    .ipan-st {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }

    .ic-st b {
        font-size: 15px;
    }

    .ipart-a .ibtn {
        width: 100%;
    }

    .imx .rh {
        min-width: 140px;
    }

    .imx table {
        min-width: 560px;
    }
}

.ibtn > svg:not([class]), .ich svg:not([class]), .isc svg:not([class]),
.ipan-r > svg:not([class]), .ipan-cf svg:not([class]), .ic-coord svg:not([class]),
.ipan-coord svg:not([class]), .iempty svg:not([class]), .ikbd svg:not([class]),
.ipill svg:not([class]), .ic-role svg:not([class]), .ihw-i svg:not([class]) {
    width: 15px;
    height: 15px;
}

.unside {
    display: flex;
    flex-direction: column;
    gap: clamp(16px, 2.2vh, 22px);
    min-width: 0;
}

.unlogo {
    position: relative;
    margin: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    padding: clamp(10px, 2vh, 22px) 0;
}

.unlogo::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 44%;
    translate: -50% -50%;
    width: 118%;
    aspect-ratio: 1;
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
    background: radial-gradient(circle, rgba(143, 200, 240, .26) 0%, rgba(31, 117, 188, .10) 38%, transparent 66%);
    transition: opacity 1.6s ease-out;
}

.unlogo.lit::before {
    opacity: 1;
}

.unlogo-w {
    position: relative;
    width: 100%;
    max-width: clamp(268px, 32vw, 428px);
}

.unlogo-s {
    width: 100%;
    height: auto;
    display: block;
    overflow: visible;
}

.unl-d {
    fill: none;
    stroke: #DCEEFB;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
    stroke-dasharray: 1000;
    stroke-dashoffset: 1000;
}

.unlogo.on .unl-d {
    animation: unDraw var(--dur) cubic-bezier(.42, .05, .3, 1) forwards;
    animation-delay: var(--t);
}

@keyframes unDraw {
    to {
        stroke-dashoffset: 0;
    }
}

.unl-f {
    fill: #DCEEFB;
}

.unl-fg {
    opacity: 0;
}

.unlogo-s {
    filter: drop-shadow(0 0 0 rgba(143, 200, 240, 0));
    transition: filter 1.6s ease-out;
}

.unlogo.lit .unlogo-s {
    filter: drop-shadow(0 4px 26px rgba(143, 200, 240, .34));
}

.unlogo.on .unl-fg {
    animation: unFill var(--df) ease-out forwards;
    animation-delay: var(--tf);
}

@keyframes unFill {
    to {
        opacity: 1;
    }
}

.unlogo-c {
    text-align: center;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.unlogo-c b {
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #8FC8F0;
}

.unlogo-c span {
    font-size:12px;
    color: #A6BDD1;
}

.unredraw {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size:11px;
    font-weight: 600;
    color: #A6BDD1;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: var(--r-pill);
    padding: 7px 14px;
    transition: .18s;
    opacity: 0;
}

.unlogo.on .unredraw {
    opacity: 1;
    transition: opacity .5s ease-out 4.8s, color .18s, border-color .18s;
}

.unredraw:hover {
    color: #fff;
    border-color: rgba(255, 255, 255, .4);
}

.unredraw:focus-visible {
    outline: var(--foc) solid #8FC8F0;
    outline-offset: 3px;
    opacity: 1;
}

.unp {
    padding-bottom: clamp(40px, 6vh, 72px);
}

.uhero {
    position: relative;
    overflow: hidden;
    background: linear-gradient(158deg, #173352 0%, #112A44 48%, #0C1E33 100%);
    padding: clamp(26px, 3.4vh, 42px) 0 clamp(30px, 4vh, 50px);
}

.uhero::before {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: radial-gradient(58% 66% at 16% 6%, rgba(31, 117, 188, .26) 0%, transparent 62%),
    radial-gradient(46% 58% at 88% 92%, rgba(14, 148, 136, .18) 0%, transparent 64%);
}

.uhero .wrap {
    position: relative;
    z-index: 1;
}

.uhero .kicker {
    color: #8FC8F0;
    background: rgba(255, 255, 255, .07);
    border-color: rgba(255, 255, 255, .17);
}

.uhero .kicker a {
    color: inherit;
}

.uhero h1 {
    margin: 14px 0 0;
    font-size: clamp(28px, 3.6vw, 46px);
    font-weight: 800;
    letter-spacing: -.022em;
    line-height: 1.05;
    color: #fff;
    text-wrap: balance;
}

.uhero .lede {
    margin: 12px 0 0;
    max-width: 66ch;
    color: #A6BDD1;
}

.ustage {
    display: grid;
    grid-template-columns:minmax(0, .86fr) minmax(0, 1.14fr);
    gap: clamp(24px, 3.6vw, 54px);
    align-items: center;
    margin-top: clamp(20px, 3vh, 34px);
}

.unet {
    display: grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.unc {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 13px 14px;
    background: rgba(255, 255, 255, .055);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: var(--r-in);
}

.unc svg {
    width: 16px;
    height: 16px;
    color: #8FC8F0;
    margin-bottom: 5px;
}

.unc-k {
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #8FA6BC;
}

.unc b {
    font-size: clamp(15px, 1.5vw, 19px);
    font-weight: 800;
    color: #fff;
    letter-spacing: -.015em;
    line-height: 1.2;
    font-variant-numeric: tabular-nums;
}

.unc i {
    font-style: normal;
    font-size: 11px;
    line-height: 1.4;
    color: #8FA6BC;
}

.unet-src {
    margin: 11px 0 0;
    font-size: 11px;
    line-height: 1.6;
    color: #7F97AD;
}

.usec {
    padding-top: var(--sp);
    scroll-margin-top: calc(var(--hdr) + 18px);
}

.usec .sec-head {
    margin-bottom: clamp(16px, 2.2vh, 26px);
}

.ubadge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    flex: 0 0 auto;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--ink-2);
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 6px 12px;
}

.ubadge .bi {
    width: 12px;
    height: 12px;
}

.ubadge.r {
    color: var(--ok);
    background: var(--ok-bg);
    border-color: transparent;
}

.usrc {
    margin: 10px 0 0;
    font-size:11px;
    line-height: 1.6;
    color: #8A9CAC;
}

.ubtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 17px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw-btn) solid var(--line);
    border-radius: var(--r-pill);
    transition: .16s;
    white-space: nowrap;
}

.ubtn:hover {
    border-color: var(--h, var(--blue));
    color: var(--h, var(--blue));
}

.ubtn:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.ubtn svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.ubtn.sm {
    height: 34px;
    padding: 0 13px;
    font-size: 12px;
}

.ubtn.pr {
    background: var(--h, var(--blue));
    border-color: var(--h, var(--blue));
    color: #fff;
}

.ubtn.pr:hover {
    color: #fff;
    filter: brightness(.94);
}

.uch {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size:12px;
    font-weight: 600;
    padding: 7px 13px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
    transition: .15s;
}

.uch:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.uch[aria-pressed="true"] {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.uch[aria-pressed="true"] .dt {
    background: #fff;
}

.uch:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.uch .k {
    font-size:10px;
    font-variant-numeric: tabular-nums;
    opacity: .7;
}

.uch .dt {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--h, var(--blue));
}

.uempty {
    padding: 28px;
    text-align: center;
    font-size:13px;
    color: var(--ink-2);
    background: var(--white);
    border: 1px dashed var(--line);
    border-radius: var(--r-card);
}

.kftabs {
    display: grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-bottom: 16px;
}

.kftab {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 5px;
    padding: 15px 16px 16px;
    text-align: left;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    border-top: 3px solid var(--h);
    transition: .18s;
}

.kftab:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
}

.kftab b {
    font-size: 15px;
    font-weight: 800;
    letter-spacing: -.01em;
    line-height: 1.25;
}

.kftab span {
    font-size:12px;
    line-height: 1.55;
    color: var(--ink-2);
}

.kftab i {
    font-style: normal;
    margin-top: 4px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--h);
}

.kftab[aria-pressed="true"] {
    background: color-mix(in srgb, var(--h) 7%, #fff);
    border-color: color-mix(in srgb, var(--h) 34%, transparent);
    box-shadow: 0 0 0 1px color-mix(in srgb, var(--h) 34%, transparent), var(--sh-card);
}

.kftab:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.kflist {
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    overflow: hidden;
}

.kfi {
    border-bottom: 1px solid #EDF5FB;
}

.kfi:last-child {
    border-bottom: 0;
}

.kfi-h {
    display: flex;
    align-items: center;
    gap: 13px;
    width: 100%;
    padding: 14px 17px;
    text-align: left;
    transition: .15s;
}

.kfi-h:hover {
    background: color-mix(in srgb, var(--h) 5%, transparent);
}

.kfi-h:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: -2px;
}

.kfi-n {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 34px;
    height: 34px;
    border-radius: 10px;
    font-size: 13px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--h);
    background: color-mix(in srgb, var(--h) 11%, transparent);
}

.kfi-t {
    flex: 1;
    min-width: 0;
    font-size:14px;
    font-weight: 600;
    line-height: 1.35;
}

.kfi-c {
    flex: 0 0 auto;
    font-size: 11px;
    color: #93A7B8;
}

.kfi .car {
    width: 14px;
    height: 14px;
    opacity: .4;
    transition: transform .22s;
    flex: 0 0 auto;
}

.kfi.on .car {
    transform: rotate(180deg);
    opacity: 1;
    color: var(--h);
}

.kfi-b {
    display: none;
    padding: 0 17px 16px 64px;
}

.kfi.on .kfi-b {
    display: grid;
    grid-template-columns:minmax(0, 1.4fr) minmax(0, 1fr);
    gap: 18px;
}

.kfi-x .k {
    display: block;
    margin-bottom: 4px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #93A7B8;
}

.kfi-x p {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.kfi-l {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: 13px;
    font-weight: 600;
    color: var(--h);
}

.kfi-l svg {
    width: 14px;
    height: 14px;
    transition: transform .18s;
}

.kfi-l:hover svg {
    transform: translateX(3px);
}

.kftot {
    margin: 12px 0 0;
    font-size:11px;
    font-weight: 600;
    letter-spacing: .04em;
    color: #8A9CAC;
}

.uind-g {
    margin-bottom: clamp(18px, 2.4vh, 26px);
}

.uind-gh {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 11px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.uind-gh i {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: var(--h);
}

.uind-r {
    display: grid;
    grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));
    gap: 12px;
}

.uind {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 16px 17px 15px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    border-top: 3px solid var(--h);
    transition: .2s;
}

.uind:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
}

.uind-h {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 10px;
}

.uind-v {
    font-size: 34px;
    font-weight: 800;
    letter-spacing: -.03em;
    line-height: 1;
    color: var(--h);
    font-variant-numeric: tabular-nums;
}

.uind-v i {
    font-style: normal;
    font-size: 16px;
    font-weight: 700;
    margin-left: 1px;
}

.uind-tr {
    display: inline-flex;
    align-items: center;
    gap: 3px;
    font-size:11px;
    font-weight: 700;
    padding: 4px 9px;
    border-radius: var(--r-pill);
    font-variant-numeric: tabular-nums;
    background: var(--blue-pale);
    color: var(--ink-2);
}

.uind-tr svg {
    width: 12px;
    height: 12px;
}

.uind-tr.up {
    background: var(--ok-bg);
    color: var(--ok);
}

.uind-tr.dn {
    background: #FDECEE;
    color: var(--h3);
}

.uind h3 {
    margin: 0;
    font-size:14px;
    font-weight: 700;
    line-height: 1.3;
}

.uind p {
    margin: 0;
    font-size: 12px;
    line-height: 1.5;
    color: var(--ink-2);
}

.uind-b {
    margin-top: auto;
}

.uind-bar {
    display: block;
    height: 6px;
    border-radius: 6px;
    background: var(--blue-pale);
    overflow: hidden;
}

.uind-bar i {
    display: block;
    height: 100%;
    border-radius: 6px;
    background: var(--h);
}

.uind-bt {
    display: block;
    margin-top: 5px;
    font-size: 11px;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}

.uind-f {
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding-top: 10px;
    border-top: 1px solid #EDF5FB;
}

.uind-m {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    align-self: flex-start;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--warn);
    background: var(--warn-bg);
    border-radius: var(--r-pill);
    padding: 4px 10px;
}

.uind-m svg {
    width: 12px;
    height: 12px;
}

.uind-s {
    font-size: 11px;
    color: #93A7B8;
}

.uind-src {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size:11px;
    font-weight: 600;
    color: var(--blue);
}

.uind-src svg {
    width: 13px;
    height: 13px;
}

.uind-src:hover {
    text-decoration: underline;
}

.ustw {
    display: grid;
    grid-template-columns:minmax(0, 1.25fr) minmax(0, .75fr);
    gap: clamp(18px, 2.4vw, 30px);
    align-items: start;
}

.ust-meta {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.ust-meta span {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size:12px;
    color: var(--ink-2);
    background: var(--white);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 7px 14px;
}

.ust-meta b {
    font-size:10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: #93A7B8;
}

.ust-vis {
    padding: 18px 20px;
    border-radius: var(--r-card);
    background: var(--blue-pale);
    border: 1px solid var(--line);
    margin-bottom: 14px;
}

.ust-vis .k {
    display: block;
    margin-bottom: 6px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--blue);
}

.ust-vis p {
    margin: 0;
    font-size: 15px;
    line-height: 1.6;
    font-weight: 500;
    color: var(--ink);
    text-wrap: pretty;
}

.uax {
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    margin-bottom: 9px;
    overflow: hidden;
}

.uax-h {
    display: flex;
    align-items: center;
    gap: 12px;
    width: 100%;
    padding: 14px 16px;
    text-align: left;
    transition: .15s;
}

.uax-h:hover {
    background: color-mix(in srgb, var(--h) 5%, transparent);
}

.uax-h:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: -2px;
}

.uax-n {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    font-size:12px;
    font-weight: 800;
    color: #fff;
    background: var(--h);
}

.uax-t {
    flex: 1;
    min-width: 0;
    font-size: 15px;
    font-weight: 700;
    line-height: 1.3;
}

.uax .car {
    width: 14px;
    height: 14px;
    opacity: .4;
    transition: transform .22s;
    flex: 0 0 auto;
}

.uax.on .car {
    transform: rotate(180deg);
    opacity: 1;
}

.uax-b {
    display: none;
    padding: 0 16px 16px 56px;
}

.uax.on .uax-b {
    display: block;
}

.uax-b .k {
    display: block;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #93A7B8;
    margin-bottom: 4px;
}

.uax-o {
    margin: 0 0 12px;
    font-size:13px;
    line-height: 1.6;
    color: var(--ink);
}

.uax-m {
    margin: 0 0 12px;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.uax-m li {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink-2);
}

.uax-m .tk {
    width: 14px;
    height: 14px;
    color: var(--h);
    flex: 0 0 auto;
    margin-top: 2px;
}

.uax-k {
    display: flex;
    align-items: center;
    gap: 9px;
    margin: 0;
    padding: 10px 12px;
    border-radius: var(--r-in);
    background: color-mix(in srgb, var(--h) 8%, transparent);
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
}

.uax-k svg {
    width: 14px;
    height: 14px;
    color: var(--h);
    flex: 0 0 auto;
}

.uax-k .k {
    margin: 0;
    flex: 0 0 auto;
}

.ust-tl {
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    padding: 17px 19px 19px;
    position: sticky;
    top: calc(var(--hdr) + 18px);
}

.ust-th {
    margin: 0 0 13px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.utl {
    margin: 0;
    padding: 0 0 0 18px;
    list-style: none;
    position: relative;
}

.utl::before {
    content: "";
    position: absolute;
    left: 4px;
    top: 5px;
    bottom: 5px;
    width: 2px;
    background: var(--line);
    border-radius: 2px;
}

.utl-i {
    position: relative;
    padding: 0 0 15px;
}

.utl-i:last-child {
    padding-bottom: 0;
}

.utl-i::before {
    content: "";
    position: absolute;
    left: -18px;
    top: 4px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: var(--white);
    border: 2px solid var(--line);
}

.utl-i.past::before {
    background: var(--blue);
    border-color: var(--blue);
}

.utl-i.real::before {
    background: var(--ok);
    border-color: var(--ok);
}

.utl-d {
    display: block;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: #93A7B8;
}

.utl-t {
    display: block;
    margin-top: 2px;
    font-size: 13px;
    line-height: 1.45;
    color: var(--ink);
}

.utl-t em {
    font-style: normal;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ok);
    background: var(--ok-bg);
    border-radius: var(--r-pill);
    padding: 2px 7px;
    white-space: nowrap;
}

.urepF {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.urepL {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.urep {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 13px 16px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    transition: .16s;
}

.urep:hover {
    border-color: var(--blue);
}

.urep-i {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 10px;
    background: var(--blue-pale);
    color: var(--blue);
    flex: 0 0 auto;
}

.urep-i svg {
    width: 17px;
    height: 17px;
}

.urep-x {
    flex: 1;
    min-width: 0;
}

.urep-x b {
    display: block;
    font-size: 14px;
    font-weight: 600;
    line-height: 1.35;
}

.urep-x i {
    display: block;
    font-style: normal;
    margin-top: 2px;
    font-size:11px;
    color: var(--ink-2);
}

.urep-st {
    flex: 0 0 auto;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ok);
    background: var(--ok-bg);
    border-radius: var(--r-pill);
    padding: 4px 10px;
}

.urep.wip .urep-st {
    color: var(--warn);
    background: var(--warn-bg);
}

.urep.wip .urep-i {
    background: var(--warn-bg);
    color: var(--warn);
}

.ustoF {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.ustoL {
    display: grid;
    grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
    gap: 12px;
}

.usto {
    display: flex;
    flex-direction: column;
    gap: 12px;
    padding: 17px 18px 16px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    transition: .2s;
}

.usto:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
}

.usto-h {
    display: flex;
    align-items: center;
    gap: 12px;
}

.ust-cv {
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    width: 46px;
    height: 46px;
    border-radius: 14px;
    color: #fff;
    font-size: 15px;
    font-weight: 800;
    background: linear-gradient(140deg, color-mix(in srgb, var(--h) 82%, #fff), var(--h));
}

.ust-cv i {
    font-style: normal;
}

.usto-n {
    min-width: 0;
}

.usto-n b {
    display: block;
    font-size:15px;
    font-weight: 700;
    line-height: 1.25;
}

.usto-n i {
    display: block;
    font-style: normal;
    font-size: 12px;
    color: var(--ink-2);
    margin-top: 1px;
}

.usto-q {
    position: relative;
    margin: 0;
    padding: 0 0 0 22px;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink);
    font-weight: 500;
}

.usto-q .qi {
    position: absolute;
    left: 0;
    top: 2px;
    width: 15px;
    height: 15px;
    fill: var(--h);
    stroke: none;
    opacity: .5;
}

.usto-f {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: auto;
}

.usto-d {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size:11px;
    font-weight: 600;
    color: var(--ink-2);
}

.usto-d i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--h);
}

.uprL {
    display: grid;
    grid-template-columns:repeat(auto-fill, minmax(320px, 1fr));
    gap: 12px;
}

.upr {
    display: flex;
    flex-direction: column;
    gap: 9px;
    padding: 17px 18px 16px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    transition: .2s;
}

.upr:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
}

.upr.real {
    border-left: 3px solid var(--ok);
}

.upr-h {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
}

.upr-p {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--blue);
    min-width: 0;
}

.upr-p svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

.upr-st {
    flex: 0 0 auto;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    color: var(--ink-2);
    background: var(--blue-pale);
    border-radius: var(--r-pill);
    padding: 3px 9px;
}

.upr-st.on {
    color: var(--ok);
    background: var(--ok-bg);
}

.upr h3 {
    margin: 0;
    font-size:15px;
    font-weight: 700;
    line-height: 1.3;
}

.upr p {
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.upr-f {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    margin-top: auto;
    padding-top: 4px;
}

.upr-f > span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    color: var(--ink-2);
    font-variant-numeric: tabular-nums;
}

.upr-f svg {
    width: 14px;
    height: 14px;
    color: #93A7B8;
}

.usteps {
    display: grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap: 12px;
}

.ustep {
    position: relative;
    padding: 16px 17px 17px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    border-top: 3px solid var(--h);
}

.ustep-n {
    position: absolute;
    right: 14px;
    top: 11px;
    font-size: 26px;
    font-weight: 800;
    line-height: 1;
    color: color-mix(in srgb, var(--h) 18%, transparent);
    font-variant-numeric: tabular-nums;
}

.ustep-i {
    width: 18px;
    height: 18px;
    color: var(--h);
    margin-bottom: 10px;
}

.ustep b {
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}

.ustep p {
    margin: 6px 0 0;
    font-size:12px;
    line-height: 1.6;
    color: var(--ink-2);
}

.ustep-a {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-top: 10px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--blue);
    background: var(--info-bg);
    border-radius: var(--r-pill);
    padding: 4px 10px;
}

.ustep-a svg {
    width: 12px;
    height: 12px;
}

.udocL {
    display: grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));
    gap: 12px;
}

.udoc-c {
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    padding: 15px 16px 14px;
}

.udoc-h {
    margin: 0 0 9px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.udoc {
    display: flex;
    align-items: center;
    gap: 11px;
    padding: 10px 11px;
    border-radius: var(--r-in);
    transition: .15s;
}

.udoc:hover {
    background: var(--blue-pale);
}

.udoc > svg {
    width: 16px;
    height: 16px;
    color: #93A7B8;
    flex: 0 0 auto;
}

.udoc-t {
    flex: 1;
    min-width: 0;
    font-size: 13px;
    line-height: 1.4;
}

.udoc-y {
    font-size:11px;
    color: #93A7B8;
    font-variant-numeric: tabular-nums;
    flex: 0 0 auto;
}

.udoc .ar {
    width: 13px;
    height: 13px;
    color: #B3C2CE;
    flex: 0 0 auto;
}

.udoc:hover .ar {
    color: var(--blue);
}

.upan {
    position: fixed;
    top: var(--hdr);
    right: 0;
    width: 420px;
    max-width: 100vw;
    height: calc(100vh - var(--hdr));
    z-index: 120;
    display: flex;
    flex-direction: column;
    background: var(--white);
    border-left: 1px solid var(--line);
    box-shadow: -18px 0 48px rgba(23, 50, 77, .14);
    transform: translateX(101%);
    transition: transform .2s cubic-bezier(.22, .7, .3, 1);
    visibility: hidden;
}

.upan.on {
    transform: none;
    visibility: visible;
}

.upan-h {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 15px 18px 14px;
    border-bottom: 1px solid var(--line);
    flex: 0 0 auto;
}

.upan-h .tx {
    flex: 1;
    min-width: 0;
}

.upan-d {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: var(--h);
}

.upan-d i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--h);
}

.upan-h h2 {
    margin: 6px 0 0;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -.015em;
    line-height: 1.2;
}

.upan-h p {
    margin: 2px 0 0;
    font-size:12px;
    color: var(--ink-2);
}

.upan-x {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--blue-pale);
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ink);
}

.upan-x:hover {
    background: var(--blue);
    color: #fff;
}

.upan-x svg {
    width: 12px;
    height: 12px;
}

.upan-b {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 18px 18px;
}

.upan-img {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    aspect-ratio: 16/10;
    border-radius: var(--r-card);
    border: 1px dashed var(--line);
    background: repeating-linear-gradient(135deg, #FBFDFF 0 8px, #F4F9FD 8px 16px);
    color: #A8BACA;
    font-size:11px;
    text-align: center;
    padding: 14px;
}

.upan-img svg {
    width: 26px;
    height: 26px;
}

.upan-q {
    position: relative;
    margin: 14px 0 0;
    padding: 0 0 0 24px;
    font-size: 16px;
    line-height: 1.55;
    font-weight: 600;
    color: var(--ink);
}

.upan-q .qi {
    position: absolute;
    left: 0;
    top: 3px;
    width: 17px;
    height: 17px;
    fill: var(--h);
    stroke: none;
    opacity: .55;
}

.upan-t {
    margin: 12px 0 0;
    font-size:13px;
    line-height: 1.7;
    color: var(--ink-2);
}

.upan-m {
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
    margin-top: 14px;
    padding-top: 12px;
    border-top: 1px solid #EDF5FB;
    font-size:12px;
    color: var(--ink-2);
}

.upan-m span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.upan-m svg {
    width: 14px;
    height: 14px;
    color: #93A7B8;
}

.upan-f {
    flex: 0 0 auto;
    padding: 13px 18px 16px;
    border-top: 1px solid var(--line);
}

.upan-f .ubtn {
    width: 100%;
    height: 44px;
}

.uveil {
    position: fixed;
    inset: var(--hdr) 0 0 0;
    z-index: 110;
    background: rgba(23, 50, 77, .28);
    opacity: 0;
    visibility: hidden;
    transition: .2s;
}

.uveil.on {
    opacity: 1;
    visibility: visible;
}

.unote {
    padding: 16px 0 0;
    font-size:11px;
    line-height: 1.6;
    color: #8A9CAC;
}

@media (max-width: 1080px) {
    .ustage {
        grid-template-columns:minmax(0, 1fr);
    }

    .unet {
        grid-template-columns:repeat(3, minmax(0, 1fr));
    }

    .kftabs {
        grid-template-columns:minmax(0, 1fr);
    }

    .ustw {
        grid-template-columns:minmax(0, 1fr);
    }

    .ust-tl {
        position: static;
    }

    .usteps {
        grid-template-columns:repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 900px) {
    .upan {
        width: 100%;
        top: auto;
        bottom: 0;
        height: auto;
        max-height: 88vh;
        border-left: 0;
        border-radius: var(--r-card) var(--r-card) 0 0;
        border-top: 1px solid var(--line);
        box-shadow: 0 -18px 48px rgba(23, 50, 77, .18);
        transform: translateY(101%);
    }

    .upan.on {
        transform: none;
    }

    .kfi.on .kfi-b {
        grid-template-columns:minmax(0, 1fr);
        gap: 12px;
    }

    .udocL {
        grid-template-columns:minmax(0, 1fr);
    }
}

@media (max-width: 680px) {
    .unet {
        grid-template-columns:repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    .usteps {
        grid-template-columns:minmax(0, 1fr);
    }

    .kfi-h {
        gap: 10px;
        padding: 12px 13px;
    }

    .kfi-n {
        width: 30px;
        height: 30px;
        font-size: 12px;
    }

    .kfi-t {
        font-size:13px;
    }

    .kfi-c {
        font-size: 10px;
    }

    .kfi-b, .kfi.on .kfi-b {
        padding-left: 13px;
        padding-right: 13px;
    }

    .uax-b {
        padding-left: 16px;
    }

    .urep {
        flex-wrap: wrap;
    }

    .urep-x {
        flex: 1 1 100%;
        order: 2;
    }

    .uind-v {
        font-size: 29px;
    }
}

.uhero .unlogo {
    padding-top: 0;
}

.usrc em {
    font-style: italic;
}

.usrc a {
    color: var(--blue);
    text-decoration: underline;
    text-decoration-color: var(--line);
}

.usrc a:hover {
    text-decoration-color: var(--blue);
}

.ubtn > svg:not([class]), .uch svg:not([class]), .unc > svg:not([class]),
.uind-tr svg:not([class]), .uind-m svg:not([class]), .uind-src svg:not([class]),
.uax-k > svg:not([class]), .urep-i svg:not([class]), .upr-p svg:not([class]),
.upr-f svg:not([class]), .ustep-a svg:not([class]), .udoc > svg:not([class]),
.upan-m svg:not([class]), .upan-img svg:not([class]), .usto-d svg:not([class]),
.kfi-l svg:not([class]) {
    width: 15px;
    height: 15px;
}

.evp {
    padding-bottom: clamp(40px, 6vh, 72px);
}

.ehead {
    padding: clamp(26px, 3.4vh, 40px) 0 4px;
    background: linear-gradient(180deg, var(--blue-pale), rgba(238, 247, 253, 0));
}

.ehead h1 {
    margin: 13px 0 0;
    font-size: clamp(28px, 3.4vw, 44px);
    font-weight: 800;
    letter-spacing: -.022em;
    line-height: 1.06;
    text-wrap: balance;
}

.ehead .lede {
    margin: 11px 0 0;
    max-width: 66ch;
}

.evn {
    display: grid;
    grid-template-columns:minmax(0, 1fr) auto;
    gap: clamp(18px, 2.6vw, 34px);
    align-items: center;
    margin-top: clamp(18px, 2.4vh, 28px);
    padding: clamp(18px, 2.4vw, 26px);
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    border-left: 4px solid var(--h);
}

.evn-k {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--h);
}

.evn-k svg {
    width: 13px;
    height: 13px;
}

.evn-ty {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    margin-top: 9px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .07em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.evn-ty svg {
    width: 14px;
    height: 14px;
    color: var(--h);
}

.evn-ty i {
    font-style: normal;
    font-size: 10px;
    color: #93A7B8;
    background: var(--blue-pale);
    border-radius: var(--r-pill);
    padding: 3px 9px;
    letter-spacing: .04em;
}

.evn h2 {
    margin: 7px 0 0;
    font-size: clamp(21px, 2.4vw, 30px);
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.14;
    text-wrap: balance;
}

.evn-s {
    margin: 7px 0 0;
    font-size:14px;
    line-height: 1.55;
    color: var(--ink-2);
}

.evn-m {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    margin-top: 13px;
    font-size:12px;
    color: var(--ink-2);
}

.evn-m span {
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.evn-m svg {
    width: 14px;
    height: 14px;
    color: #93A7B8;
}

.evn-a {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.evn-d {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 132px;
    padding: 18px 16px;
    border-radius: var(--r-card);
    background: color-mix(in srgb, var(--h) 10%, transparent);
    border: 1px solid color-mix(in srgb, var(--h) 26%, transparent);
}

.evn-d b {
    font-size: 52px;
    font-weight: 800;
    line-height: .95;
    letter-spacing: -.04em;
    color: var(--h);
    font-variant-numeric: tabular-nums;
}

.evn-d i {
    font-style: normal;
    margin-top: 3px;
    font-size:12px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--h);
}

.evn-d u {
    text-decoration: none;
    margin-top: 7px;
    font-size: 11px;
    color: var(--ink-2);
    background: var(--white);
    border-radius: var(--r-pill);
    padding: 3px 10px;
}

.emons {
    display: flex;
    gap: 6px;
    overflow-x: auto;
    scrollbar-width: thin;
    padding: 2px 0 6px;
    margin-top: clamp(18px, 2.4vh, 26px);
}

.emb {
    flex: 1 0 auto;
    min-width: 62px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    padding: 9px 8px 10px;
    border-radius: var(--r-in);
    border: 1px solid var(--line);
    background: var(--white);
    transition: .15s;
}

.emb:hover {
    border-color: var(--blue);
}

.emb-b {
    display: flex;
    align-items: flex-end;
    height: 42px;
}

.emb-b i {
    display: block;
    width: 22px;
    border-radius: 4px 4px 2px 2px;
    background: var(--blue);
    opacity: .28;
    transition: .15s;
}

.emb:hover .emb-b i {
    opacity: .5;
}

.emb-l {
    font-size: 11px;
    font-weight: 600;
    color: var(--ink-2);
}

.emb-n {
    font-size:12px;
    font-weight: 800;
    font-variant-numeric: tabular-nums;
    color: var(--ink);
    min-height: 16px;
}

.emb.z {
    opacity: .5;
}

.emb.z .emb-n {
    color: #B3C2CE;
}

.emb[aria-pressed="true"] {
    background: var(--blue);
    border-color: var(--blue);
}

.emb[aria-pressed="true"] .emb-l, .emb[aria-pressed="true"] .emb-n {
    color: #fff;
}

.emb[aria-pressed="true"] .emb-b i {
    background: #fff;
    opacity: .85;
}

.emb.all {
    min-width: 96px;
    justify-content: center;
}

.emb.all .emb-l {
    font-size:12px;
    font-weight: 700;
    color: var(--ink);
}

.emb.all[aria-pressed="true"] .emb-l {
    color: #fff;
}

.emb:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.etool {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.esw {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 13px;
    width: 280px;
    max-width: 100%;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    transition: border-color .18s, box-shadow .18s;
}

.esw:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .13);
}

.esw > svg {
    width: 16px;
    height: 16px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.esw input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    outline: 0;
    font-size:13px;
}

.esw kbd {
    font: inherit;
    font-size:10px;
    font-weight: 600;
    color: #93A7B8;
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 2px 6px;
}

.esw .xq {
    display: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    background: var(--blue-pale);
    color: var(--ink-2);
}

.esw .xq svg {
    width: 10px;
    height: 10px;
}

.esw.has .xq {
    display: flex;
}

.esw.has kbd {
    display: none;
}

.ecnt {
    font-size: 13px;
    color: var(--ink-2);
}

.ecnt b {
    font-size: 15px;
    font-weight: 800;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.exa {
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-2);
    text-decoration: underline;
    text-decoration-color: var(--line);
    margin-left: auto;
}

.exa:hover {
    color: var(--h3);
}

.exa[hidden] {
    display: none;
}

.echips {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: clamp(16px, 2vh, 24px);
}

.ech {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size:12px;
    font-weight: 600;
    padding: 7px 13px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
    transition: .15s;
}

.ech:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.ech .ti {
    width: 14px;
    height: 14px;
    color: var(--ink-2);
}

.ech:hover .ti {
    color: var(--blue);
}

.ech[aria-pressed="true"] {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.ech[aria-pressed="true"] .ti {
    color: #fff;
}

.ech .k {
    font-size:10px;
    font-variant-numeric: tabular-nums;
    opacity: .7;
}

.ech.z {
    opacity: .44;
}

.ech.tg {
    border-style: dashed;
}

.ech.tg[aria-pressed="true"] {
    border-style: solid;
}

.ech:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.evg {
    margin-bottom: clamp(20px, 2.6vh, 30px);
}

.evg-h {
    display: flex;
    align-items: baseline;
    gap: 11px;
    margin: 0 0 11px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.evg-h span {
    font-size:10px;
    font-weight: 600;
    letter-spacing: .02em;
    text-transform: none;
    color: #93A7B8;
}

.evg-l {
    display: flex;
    flex-direction: column;
    gap: 10px;
}

.evc {
    display: grid;
    grid-template-columns:78px minmax(0, 1fr) auto;
    gap: 16px;
    align-items: center;
    padding: 15px 17px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    transition: .18s;
}

.evc:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
    border-color: var(--h);
}

.evc.past {
    opacity: .62;
}

.evc.past:hover {
    opacity: 1;
}

.evc-d {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px 6px;
    border-radius: var(--r-in);
    background: color-mix(in srgb, var(--h) 10%, transparent);
}

.evc-d b {
    font-size: 27px;
    font-weight: 800;
    line-height: 1;
    letter-spacing: -.03em;
    color: var(--h);
    font-variant-numeric: tabular-nums;
}

.evc-d i {
    font-style: normal;
    margin-top: 2px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--h);
}

.evc-d u {
    text-decoration: none;
    margin-top: 4px;
    font-size: 10px;
    font-weight: 700;
    color: #fff;
    background: var(--h);
    border-radius: var(--r-pill);
    padding: 1px 7px;
}

.evc-x {
    min-width: 0;
}

.evc-t {
    display: flex;
    align-items: center;
    gap: 7px;
    flex-wrap: wrap;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--h);
}

.evc-t svg {
    width: 13px;
    height: 13px;
}

.evc-t em {
    font-style: normal;
    font-size: 9px;
    letter-spacing: .04em;
    color: #93A7B8;
    background: var(--blue-pale);
    border-radius: var(--r-pill);
    padding: 2px 8px;
}

.evc-t s {
    text-decoration: none;
    font-size: 9px;
    letter-spacing: .04em;
    color: var(--mut, #6B7C8C);
    background: #F1F5F9;
    border-radius: var(--r-pill);
    padding: 2px 8px;
}

.evc-t u {
    text-decoration: none;
    font-size: 9px;
    letter-spacing: .04em;
    color: #fff;
    background: var(--h3);
    border-radius: var(--r-pill);
    padding: 2px 8px;
}

.evc-x h3 {
    margin: 6px 0 0;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.012em;
    line-height: 1.28;
}

.evc-x p {
    margin: 3px 0 0;
    font-size: 13px;
    line-height: 1.5;
    color: var(--ink-2);
}

.evc-m {
    display: flex;
    flex-wrap: wrap;
    gap: 5px 15px;
    margin-top: 8px;
    font-size:11px;
    color: var(--ink-2);
}

.evc-m span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    min-width: 0;
}

.evc-m svg {
    width: 13px;
    height: 13px;
    color: #93A7B8;
    flex: 0 0 auto;
}

.evc-m .fr {
    color: var(--ok);
    font-weight: 600;
}

.evc-m .fr svg {
    color: var(--ok);
}

.evc-a {
    flex: 0 0 auto;
}

.ebtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 17px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw-btn) solid var(--line);
    border-radius: var(--r-pill);
    transition: .16s;
    white-space: nowrap;
}

.ebtn:hover {
    border-color: var(--h, var(--blue));
    color: var(--h, var(--blue));
}

.ebtn:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.ebtn svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.ebtn.sm {
    height: 36px;
    padding: 0 14px;
    font-size:12px;
}

.ebtn.pr {
    background: var(--h, var(--blue));
    border-color: var(--h, var(--blue));
    color: #fff;
}

.ebtn.pr:hover {
    color: #fff;
    filter: brightness(.94);
}

.eempty {
    padding: clamp(36px, 7vh, 72px) 24px;
    text-align: center;
    background: var(--white);
    border: var(--bw) dashed var(--line);
    border-radius: var(--r-card);
}

.eempty b {
    display: block;
    font-size: 17px;
    font-weight: 700;
}

.eempty p {
    margin: 9px auto 18px;
    max-width: 52ch;
    font-size:13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.epan {
    position: fixed;
    top: var(--hdr);
    right: 0;
    width: 436px;
    max-width: 100vw;
    height: calc(100vh - var(--hdr));
    z-index: 120;
    display: flex;
    flex-direction: column;
    background: var(--white);
    border-left: 1px solid var(--line);
    box-shadow: -18px 0 48px rgba(23, 50, 77, .14);
    transform: translateX(101%);
    transition: transform .2s cubic-bezier(.22, .7, .3, 1);
    visibility: hidden;
}

.epan.on {
    transform: none;
    visibility: visible;
}

.epan-h {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 15px 18px 14px;
    border-bottom: 1px solid var(--line);
    flex: 0 0 auto;
}

.epan-h .tx {
    flex: 1;
    min-width: 0;
}

.epan-h h2 {
    margin: 7px 0 0;
    font-size: 20px;
    font-weight: 800;
    letter-spacing: -.015em;
    line-height: 1.2;
    text-wrap: balance;
}

.epan-h p {
    margin: 4px 0 0;
    font-size:12px;
    line-height: 1.45;
    color: var(--ink-2);
}

.epan-x {
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: var(--blue-pale);
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--ink);
}

.epan-x:hover {
    background: var(--blue);
    color: #fff;
}

.epan-x svg {
    width: 12px;
    height: 12px;
}

.epan-b {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    overscroll-behavior: contain;
    padding: 14px 18px 18px;
}

.epan-when {
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 12px 14px;
    border-radius: var(--r-in);
    background: color-mix(in srgb, var(--h) 9%, transparent);
    border: 1px solid color-mix(in srgb, var(--h) 24%, transparent);
}

.epan-when .dd {
    display: flex;
    flex-direction: column;
    align-items: center;
    flex: 0 0 auto;
}

.epan-when .dd b {
    font-size: 28px;
    font-weight: 800;
    line-height: 1;
    color: var(--h);
    font-variant-numeric: tabular-nums;
}

.epan-when .dd i {
    font-style: normal;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--h);
}

.epan-when .tt {
    font-size:12px;
    line-height: 1.45;
    color: var(--ink-2);
}

.epan-when .tt b {
    display: block;
    font-size: 14px;
    font-weight: 700;
    color: var(--ink);
    text-transform: capitalize;
}

.epan-d {
    margin: 13px 0 0;
    font-size:13px;
    line-height: 1.7;
    color: var(--ink-2);
}

.epan-h4 {
    margin: 18px 0 9px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.eprog {
    position: relative;
    padding-left: 16px;
}

.eprog::before {
    content: "";
    position: absolute;
    left: 3px;
    top: 8px;
    bottom: 8px;
    width: 2px;
    border-radius: 2px;
    background: color-mix(in srgb, var(--h) 26%, transparent);
}

.epr {
    position: relative;
    display: grid;
    grid-template-columns:52px minmax(0, 1fr);
    gap: 11px;
    padding: 7px 0;
    font-size: 13px;
    line-height: 1.45;
}

.epr::before {
    content: "";
    position: absolute;
    left: -16px;
    top: 13px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--h);
}

.epr b {
    font-weight: 700;
    color: var(--h);
    font-variant-numeric: tabular-nums;
}

.epr span {
    color: var(--ink-2);
}

.epan-r {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    padding: 11px 0;
    border-bottom: 1px solid #EDF5FB;
    font-size: 13px;
    line-height: 1.5;
}

.epan-r > svg {
    width: 16px;
    height: 16px;
    color: #93A7B8;
    flex: 0 0 auto;
    margin-top: 1px;
}

.epan-r .k {
    display: block;
    margin-bottom: 2px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .09em;
    text-transform: uppercase;
    color: #93A7B8;
}

.epan-r .v {
    min-width: 0;
}

.epan-r .mut {
    color: #93A7B8;
    font-size: 12px;
}

.eparts {
    display: flex;
    gap: 5px;
    flex-wrap: wrap;
    margin-top: 3px;
}

.epart {
    font-size:11px;
    color: var(--ink-2);
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 3px 9px;
}

.epan-f {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 13px 18px 16px;
    border-top: 1px solid var(--line);
    background: var(--white);
}

.epan-f .ebtn {
    width: 100%;
    height: 42px;
}

.eveil {
    position: fixed;
    inset: var(--hdr) 0 0 0;
    z-index: 110;
    background: rgba(23, 50, 77, .28);
    opacity: 0;
    visibility: hidden;
    transition: .2s;
}

.eveil.on {
    opacity: 1;
    visibility: visible;
}

.eprop {
    margin-top: var(--sp);
    padding: clamp(26px, 3.6vh, 42px) 0;
    background: var(--blue-pale);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.eprop h2 {
    margin: 12px 0 0;
    font-size: clamp(23px, 2.6vw, 32px);
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.1;
}

.eprop .lede {
    margin: 10px 0 0;
    max-width: 62ch;
}

.esteps {
    display: grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap: 12px;
    margin-top: clamp(18px, 2.4vh, 26px);
}

.estep {
    position: relative;
    padding: 16px 17px 17px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    border-top: 3px solid var(--h);
}

.estep-n {
    position: absolute;
    right: 14px;
    top: 11px;
    font-size: 26px;
    font-weight: 800;
    line-height: 1;
    color: color-mix(in srgb, var(--h) 18%, transparent);
    font-variant-numeric: tabular-nums;
}

.estep-i {
    width: 18px;
    height: 18px;
    color: var(--h);
    margin-bottom: 10px;
}

.estep b {
    display: block;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.3;
}

.estep p {
    margin: 6px 0 0;
    font-size:12px;
    line-height: 1.6;
    color: var(--ink-2);
}

.eprop-a {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
    margin-top: 16px;
}

.eprop-a .ebtn {
    height: 44px;
    padding: 0 20px;
    font-size:13px;
}

.eprop-a .ebtn.pr {
    --h: var(--blue);
}

.ekbd {
    margin-top: clamp(16px, 2.2vh, 24px);
    display: flex;
    align-items: center;
    gap: 8px;
    font-size:11px;
    color: #8A9CAC;
}

.ekbd svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

.enote {
    padding: 16px 0 0;
    font-size:11px;
    line-height: 1.6;
    color: #8A9CAC;
}

.elist {
    padding-top: clamp(18px, 2.4vh, 26px);
}

@media (max-width: 1000px) {
    .evn {
        grid-template-columns:minmax(0, 1fr);
    }

    .evn-d {
        flex-direction: row;
        gap: 14px;
        min-width: 0;
    }

    .evn-d b {
        font-size: 38px;
    }

    .esteps {
        grid-template-columns:minmax(0, 1fr);
    }
}

@media (max-width: 900px) {
    .epan {
        width: 100%;
        top: auto;
        bottom: 0;
        height: auto;
        max-height: 88vh;
        border-left: 0;
        border-radius: var(--r-card) var(--r-card) 0 0;
        border-top: 1px solid var(--line);
        box-shadow: 0 -18px 48px rgba(23, 50, 77, .18);
        transform: translateY(101%);
    }

    .epan.on {
        transform: none;
    }

    .esw {
        width: 100%;
    }

    .exa {
        margin-left: 0;
    }
}

@media (max-width: 680px) {
    .evc {
        grid-template-columns:62px minmax(0, 1fr);
        gap: 12px;
        padding: 13px 14px;
    }

    .evc-d b {
        font-size: 22px;
    }

    .evc-a {
        grid-column: 1 / -1;
    }

    .evc-a .ebtn {
        width: 100%;
    }

    .evn-a .ebtn {
        width: 100%;
    }

    .emb {
        min-width: 56px;
    }

    .eprop-a .ebtn {
        width: 100%;
    }
}

.ebtn > svg:not([class]), .ech svg:not([class]), .evn-m svg:not([class]),
.evn-k svg:not([class]), .evn-ty svg:not([class]), .evc-t svg:not([class]),
.evc-m svg:not([class]), .epan-r > svg:not([class]), .eempty svg:not([class]),
.ekbd svg:not([class]) {
    width: 15px;
    height: 15px;
}

* {
    box-sizing: border-box;
}

html, body {
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

section[id] {
    scroll-margin-top: calc(var(--hdr) + 18px);
}

body {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    color: var(--ink);
    background: var(--white);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

button, select, input {
    font: inherit;
    color: inherit;
}

button {
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
}

a {
    color: inherit;
    text-decoration: none;
}

.wrap {
    width: 100%;
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 0 24px;
}

.sr {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

.hdr {
    position: sticky;
    top: 0;
    z-index: 80;
    height: var(--hdr);
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, rgba(255, 255, 255, .74), rgba(255, 255, 255, .5));
    -webkit-backdrop-filter: blur(20px) saturate(175%);
    backdrop-filter: blur(20px) saturate(175%);
    border-bottom: 1px solid rgba(215, 234, 247, .55);
    transition: background .3s, border-color .3s, box-shadow .3s;
}

.hdr.stuck {
    background: linear-gradient(180deg, rgba(255, 255, 255, .93), rgba(255, 255, 255, .84));
    border-bottom-color: var(--line);
    box-shadow: 0 6px 26px rgba(23, 50, 77, .07);
}

.hdr::after {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 1px;
    pointer-events: none;
    background: linear-gradient(90deg, transparent, rgba(255, 255, 255, .95) 20%, rgba(255, 255, 255, .95) 80%, transparent);
}

.ubar {
    height: var(--ubar);
    flex: 0 0 auto;
    font-size:11px;
    border-bottom: 1px solid rgba(215, 234, 247, .5);
}

.ubar .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    height: 100%;
}

.ub-l, .ub-r {
    display: flex;
    align-items: center;
    gap: 1px;
    min-width: 0;
}

.ubar a, .ubar button {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: 4px 9px;
    border-radius: 7px;
    color: var(--ink-2);
    transition: .15s;
    white-space: nowrap;
}

.ubar a:hover, .ubar button:hover {
    color: var(--blue);
    background: rgba(255, 255, 255, .75);
}

.ubar a:focus-visible, .ubar button:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 1px;
}

.ubar svg {
    width: 13px;
    height: 13px;
    flex: 0 0 auto;
    opacity: .8;
}

.ub-sep {
    width: 1px;
    height: 12px;
    background: var(--line);
    margin: 0 5px;
    flex: 0 0 auto;
}

.ub-org {
    font-weight: 600;
    color: var(--ink);
}

.ub-dash {
    color: var(--blue);
    font-weight: 600;
}

.ubar button[aria-pressed="true"] {
    background: var(--blue);
    color: #fff;
}

.ubar button[aria-pressed="true"] svg {
    opacity: 1;
}

.hrow {
    flex: 1 1 auto;
    display: flex;
    align-items: center;
    min-height: 0;
}

.hrow .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    align-self: stretch;
    position: relative;
}

.brand {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}

.brand-nm {
    font-size:16px;
    font-weight: 800;
    letter-spacing: -.01em;
    color: var(--ink);
    white-space: nowrap;
}

.bwm {
    position: relative;
    display: inline-block;
}

.bwm-t {
    background-image: linear-gradient(96deg, #1B7A4C 0%, #17868F 25%, #1F75BC 52%, #3F51C4 75%, #6E3F94 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.bwm-u {
    position: absolute;
    left: -1.5%;
    width: 103%;
    bottom: -3px;
    height: 4px;
    overflow: visible;
    color: #A6D3F0;
    pointer-events: none;
}

.bwm-u path {
    fill: none;
    stroke: currentColor;
    stroke-width: 6;
    stroke-linecap: round;
}

.nav {
    display: flex;
    align-items: center;
    gap: 1px;
}

.nvi {
    display: flex;
}

.nvb {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-size:13px;
    font-weight: 500;
    color: var(--ink-2);
    padding: 9px 11px;
    border-radius: var(--r-in);
    transition: .16s;
    white-space: nowrap;
}

.nvb:hover {
    color: var(--blue);
    background: rgba(255, 255, 255, .8);
}

.nvb .car {
    transition: transform .2s;
    opacity: .55;
}

.nvb[aria-expanded="true"] {
    color: var(--blue);
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .95) inset, 0 2px 10px rgba(23, 50, 77, .06);
}

.nvb[aria-expanded="true"] .car {
    transform: rotate(180deg);
    opacity: 1;
}

.nvb:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 1px;
}

.pwrap {
    position: fixed;
    left: 0;
    right: 0;
    top: var(--hdr);
    z-index: 81;
    pointer-events: none;
}

.pin {
    max-width: var(--wrap);
    margin: 0 auto;
    padding: 0 24px;
    position: relative;
    height: 0;
}

.pnl {
    position: absolute;
    top: 9px;
    left: 24px;
    z-index: 1;
    pointer-events: auto;
    background: linear-gradient(180deg, rgba(255, 255, 255, .94), rgba(255, 255, 255, .88));
    -webkit-backdrop-filter: blur(26px) saturate(180%);
    backdrop-filter: blur(26px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, .85);
    border-radius: var(--r-card);
    padding: 18px;
    box-shadow: 0 1px 0 rgba(255, 255, 255, .95) inset,
    0 26px 64px rgba(23, 50, 77, .17), 0 2px 8px rgba(23, 50, 77, .05);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-9px) scale(.986);
    transform-origin: top left;
    transition: opacity .2s, transform .24s cubic-bezier(.22, .7, .3, 1), visibility .24s;
}

.pnl.open {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.pnl-mega {
    left: 24px;
    right: 24px;
    padding: 22px 24px 18px;
}

.veil.on {
    background: rgba(23, 50, 77, .22);
}

.pnl-r {
    transform-origin: top right;
}

.mgh {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #93A7B8;
    margin: 0 0 9px;
}

.mgh.sp {
    margin-top: 17px;
}

.mg {
    display: grid;
    grid-template-columns:1.6fr 1fr 1fr .92fr;
    gap: 24px;
}

.dom2 {
    display: grid;
    grid-template-columns:1fr 1fr;
    gap: 1px 12px;
}

.dm {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 6px 8px;
    border-radius: 9px;
    transition: .14s;
}

.dm:hover, .dm:focus-visible {
    background: rgba(255, 255, 255, .98);
    box-shadow: 0 2px 9px rgba(23, 50, 77, .07);
    outline: 0;
}

.dm:focus-visible {
    box-shadow: 0 0 0 2px var(--blue);
}

.dm .di {
    width: 21px;
    height: 21px;
    flex: 0 0 auto;
    color: var(--h);
}

.dm .di svg {
    width: 21px;
    height: 21px;
    display: block;
}

.dm .dt {
    font-size: 13px;
    font-weight: 500;
    color: var(--ink);
    flex: 1;
    min-width: 0;
}

.dm .dc {
    font-size: 10px;
    font-weight: 700;
    color: var(--h);
    flex: 0 0 auto;
    background: color-mix(in srgb, var(--h) 13%, #fff);
    border: 1px solid color-mix(in srgb, var(--h) 22%, #fff);
    border-radius: var(--r-pill);
    padding: 1px 6px;
    min-width: 22px;
    text-align: center;
    font-variant-numeric: tabular-nums;
}

.lst {
    display: flex;
    flex-direction: column;
    gap: 1px;
}

.lk {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 7px 9px;
    border-radius: 9px;
    font-size: 13px;
    color: var(--ink);
    transition: .14s;
}

.lk:hover {
    background: rgba(255, 255, 255, .98);
    color: var(--blue);
}

.lk:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 0;
}

.lk svg {
    width: 16px;
    height: 16px;
    flex: 0 0 auto;
    opacity: .7;
}

.lk:hover svg {
    opacity: 1;
}

.lk .lkc {
    margin-left: auto;
    font-size:10px;
    font-weight: 600;
    color: #93A7B8;
    font-variant-numeric: tabular-nums;
}

.lk .lkd {
    display: block;
    font-size: 11px;
    color: var(--ink-2);
    margin-top: 1px;
}

.lk.two {
    align-items: flex-start;
}

.lk.two svg {
    margin-top: 2px;
}

.gls {
    display: grid;
    grid-template-columns:1fr 1fr;
    gap: 2px 14px;
    width: min(640px, 74vw);
}

.gl2 {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px 10px;
    border-radius: var(--r-in);
    font-size: 13px;
    color: var(--ink);
    transition: .14s;
}

.gl2 .gn {
    width: 23px;
    height: 23px;
    border-radius: 8px;
    background: var(--blue-pale);
    color: var(--blue);
    display: flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    transition: .14s;
}

.gl2 .gn svg {
    width: 14px;
    height: 14px;
}

.gl2:hover {
    background: rgba(255, 255, 255, .98);
}

.gl2:hover .gn {
    background: var(--blue);
    color: #fff;
}

.gl2:focus-visible {
    outline: 2px solid var(--blue);
}

.cols2 {
    display: grid;
    grid-template-columns:1fr 1fr;
    gap: 24px;
    width: min(580px, 74vw);
}

.pnl-list .lst {
    width: min(330px, 74vw);
}

.pnl-wide .lst {
    width: min(370px, 74vw);
}

.cal2 {
    margin-top: 17px;
    border: 1px dashed rgba(31, 117, 188, .38);
    border-radius: var(--r-in);
    padding: 12px 14px;
    background: rgba(238, 247, 253, .75);
}

.cal2 b {
    display: block;
    font-size:12px;
    color: var(--ink);
    margin-bottom: 3px;
}

.cal2 > span {
    display: block;
    font-size:11px;
    color: var(--ink-2);
    line-height: 1.45;
}

.cal2 a {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    margin-top: 9px;
    font-size: 12px;
    font-weight: 600;
    color: var(--blue);
}

.cal2 a svg {
    width: 15px;
    height: 15px;
}

.cal2 a:hover {
    color: var(--blue-dark);
}

.pnl-ft {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 17px;
    padding-top: 14px;
    border-top: 1px solid rgba(215, 234, 247, .8);
}

.chip {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: 12px;
    font-weight: 600;
    padding: 7px 13px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: rgba(255, 255, 255, .75);
    color: var(--ink);
    transition: .15s;
    white-space: nowrap;
}

.chip:hover {
    border-color: var(--blue);
    color: var(--blue);
    background: #fff;
}

.chip:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.chip.pr {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.chip.pr:hover {
    background: var(--blue-dark);
    color: #fff;
}

.chip .k {
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

.hdr-r {
    display: flex;
    align-items: center;
    gap: 10px;
}

.isrch {
    width: 38px;
    height: 38px;
    border-radius: var(--r-in);
    color: var(--ink-2);
    display: flex;
    align-items: center;
    justify-content: center;
    transition: .15s;
}

.isrch:hover {
    background: rgba(255, 255, 255, .85);
    color: var(--blue);
}

.isrch:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 1px;
}

/* Selectorul de limbă a devenit un dropdown (RO/RU/EN, extensibil fără sa
   ocupe mai mult loc in antet la o a 4-a limba) -- .lang e acum doar
   ancora de poziționare pentru panoul .pnl-lang, iar pastila vizuala e pe
   .lang-btn (fostele 3 pastile "RO"/"RU"/"EN" alaturate deveneau prea late
   in antet, vezi si pragul din @media (max-width:1280px) mai jos). */
.lang {
    position: relative;
}

.lang-btn {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    background: rgba(255, 255, 255, .7);
    border: 1px solid rgba(215, 234, 247, .9);
    border-radius: var(--r-pill);
    padding: 6px 10px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .05em;
    color: var(--ink-2);
    transition: .16s;
}

.lang-btn:hover {
    border-color: var(--blue);
    color: var(--blue);
    background: #fff;
}

.lang-btn:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.lang-btn .lang-ico {
    opacity: .8;
}

.lang-btn .car {
    opacity: .6;
    transition: transform .2s;
}

.lang-btn[aria-expanded="true"] {
    border-color: var(--blue);
    color: var(--blue);
    background: #fff;
}

.lang-btn[aria-expanded="true"] .car {
    transform: rotate(180deg);
    opacity: 1;
}

/* Panoul dropdown -- bazat vizual pe #pnl-acc (clasa .pnl de baza: fundal
   sticla, umbra, animatia de deschidere), dar ancorat sub buton (dreapta),
   nu poziționat via place()/#hwrap ca meniurile din NAVDEF. */
.pnl-lang {
    top: calc(100% + 10px);
    left: auto;
    right: 0;
    min-width: 172px;
    transform-origin: top right;
    padding: 8px;
}

.pnl-lang .lst {
    gap: 2px;
}

.pnl-lang .lk {
    justify-content: space-between;
}

.pnl-lang .lk[aria-current="true"] {
    color: var(--blue);
    background: rgba(31, 117, 188, .09);
    font-weight: 600;
}

.pnl-lang .lk-ck {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
    color: var(--blue);
}

.login {
    border: var(--bw-btn) solid var(--line);
    color: var(--ink);
    background: rgba(255, 255, 255, .7);
    font-size:12px;
    font-weight: 600;
    padding: 9px 16px;
    border-radius: var(--r-pill);
    white-space: nowrap;
    transition: .16s;
}

.login:hover {
    border-color: var(--blue);
    color: var(--blue);
    background: #fff;
}

.login:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.acc {
    display: none;
    align-items: center;
    gap: 8px;
    padding: 5px 12px 5px 5px;
    border-radius: var(--r-pill);
    border: var(--bw-btn) solid var(--line);
    background: rgba(255, 255, 255, .75);
    transition: .16s;
}

.acc.on {
    display: inline-flex;
}

.acc:hover {
    border-color: var(--blue);
    background: #fff;
}

.acc:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.acc .avt {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--blue);
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    font-weight: 700;
    flex: 0 0 auto;
}

.acc .anm {
    font-size:12px;
    font-weight: 600;
    color: var(--ink);
}

.acc .car {
    opacity: .5;
    transition: transform .2s;
}

.acc[aria-expanded="true"] .car {
    transform: rotate(180deg);
}

.burger {
    display: none;
    width: 40px;
    height: 40px;
    border-radius: var(--r-in);
    align-items: center;
    justify-content: center;
    color: var(--ink);
}

.burger-box {
    position: relative;
    width: 19px;
    height: 13px;
    display: block;
}

.burger-ln {
    position: absolute;
    left: 0;
    width: 100%;
    height: 2px;
    border-radius: 2px;
    background: currentColor;
    transition: top .24s cubic-bezier(.22, .7, .3, 1), transform .24s cubic-bezier(.22, .7, .3, 1), opacity .18s;
}

.burger-ln:nth-child(1) { top: 0; }
.burger-ln:nth-child(2) { top: 5.5px; }
.burger-ln:nth-child(3) { top: 11px; }

.burger[aria-expanded="true"] .burger-ln:nth-child(1) {
    top: 5.5px;
    transform: rotate(45deg);
}

.burger[aria-expanded="true"] .burger-ln:nth-child(2) {
    opacity: 0;
}

.burger[aria-expanded="true"] .burger-ln:nth-child(3) {
    top: 5.5px;
    transform: rotate(-45deg);
}

.burger:hover {
    background: rgba(255, 255, 255, .85);
}

.burger:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 1px;
}

.veil {
    position: fixed;
    inset: 0;
    z-index: 78;
    background: rgba(23, 50, 77, .16);
    opacity: 0;
    visibility: hidden;
    transition: .24s;
    -webkit-backdrop-filter: blur(1px);
    backdrop-filter: blur(1px);
}

.veil.on {
    opacity: 1;
    visibility: visible;
}

html.hc {
    --ink-2: #33465A;
    --line: #8FBFE0;
    --blue: #12558E;
    --blue-dark: #0C3F6D;
}

html.hc .hdr, html.hc .pnl, html.hc .search {
    background: #fff !important;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border-color: var(--line) !important;
}

html.hc .sfield {
    background: #fff;
}

html.hc .bwm-t {
    -webkit-text-fill-color: #12325A;
    color: #12325A;
    background: none;
}

html.hc .bwm-u {
    display: none;
}

html.hc h1 .ht {
    -webkit-text-fill-color: #12325A;
    color: #12325A;
    background: none;
    animation: none;
}

html.hc .blobs, html.hc .waves {
    display: none;
}

.kicker {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size:10px;
    font-weight: 600;
    letter-spacing: .17em;
    text-transform: uppercase;
    color: var(--blue);
    background: rgba(238, 247, 253, .9);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 8px 17px;
}

.kicker .gl {
    animation: spin 26s linear infinite;
    transform-origin: 50% 50%;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.lede {
    margin: 14px 0;
    max-width: 690px;
    font-size: clamp(14px, 1.05vw,16px);
    line-height: 1.6;
    color: var(--ink-2);
}

.sublede {
    margin: 10px 0 0;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #93A7B8;
}

section > .wrap > :last-child, .ft .wrap > :last-child {
    margin-bottom: 0;
}

.sec-head {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 30px;
    text-align: left;
    margin-bottom: var(--sph);
}

.sec-head .tx {
    min-width: 0;
}

.sec-head h2 {
    margin: 13px 0 0;
    font-size: clamp(27px, 3.2vw, 42px);
    font-weight: 800;
    letter-spacing: -.022em;
    line-height: 1.08;
    color: var(--ink);
    text-wrap: balance;
}

.sec-head .lede {
    margin: 11px 0 0;
    max-width: 56ch;
}

.sec-head-r {
    display: flex;
    align-items: center;
    gap: 9px;
    flex: 0 0 auto;
    padding-bottom: 3px;
}

.sec-btn {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    white-space: nowrap;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw-btn) solid var(--line);
    border-radius: var(--r-pill);
    padding: 11px 19px;
    transition: .18s;
}

.sec-btn:hover {
    border-color: var(--blue);
    color: var(--blue);
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(31, 117, 188, .12);
}

.sec-btn:focus-visible {
    outline: 2px solid var(--blue);
    outline-offset: 2px;
}

.sec-btn svg {
    width: 16px;
    height: 16px;
    transition: transform .2s;
}

.sec-btn:hover svg {
    transform: translateX(2px);
}

.ft {
    position: relative;
    overflow: hidden;
    background: #132B45;
    color: #A9BFD3;
    padding: var(--sp) 0 26px;
}

.ft-pano {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
    pointer-events: none;
    height: clamp(150px, 26vh, 300px);
    -webkit-mask-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, .35) 46%, #000 100%);
    mask-image: linear-gradient(180deg, transparent 0, rgba(0, 0, 0, .35) 46%, #000 100%);
}

.ft-pano video {
    position: absolute;
    left: -4%;
    bottom: -2%;
    width: 108%;
    height: auto;
    display: block;
    opacity: 0;
    transition: opacity 1s ease-out;
    filter: invert(1) hue-rotate(180deg) saturate(1.15);
    mix-blend-mode: screen;
}

.ft-pano video.on {
    opacity: .34;
}

.ft .wrap {
    position: relative;
    z-index: 1;
}

.ft-top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 26px;
    flex-wrap: wrap;
    padding-bottom: clamp(28px, 3.6vh, 40px);
    border-bottom: 1px solid rgba(255, 255, 255, .11);
}

.ft-mk {
    font-size: 19px;
    font-weight: 800;
    letter-spacing: -.015em;
    color: #fff;
    position: relative;
    display: inline-block;
}

.ft-mk svg {
    position: absolute;
    left: -1.5%;
    width: 103%;
    bottom: -5px;
    height: 5px;
    overflow: visible;
    color: #5FA8DA;
}

.ft-mk svg path {
    fill: none;
    stroke: currentColor;
    stroke-width: 6;
    stroke-linecap: round;
}

.ft-sl {
    margin: 14px 0 0;
    font-size:13px;
    color: #8FA8BF;
    max-width: 34ch;
    font-style: italic;
}

.ft-un {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    margin-top: 16px;
    font-size: 11px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: #8FC8F0;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: var(--r-pill);
    padding: 7px 14px;
}

.ft-cols {
    display: grid;
    grid-template-columns:repeat(4, minmax(0, 1fr));
    gap: 26px;
    padding: clamp(28px, 3.6vh, 40px) 0;
}

.ft-c h4 {
    margin: 0 0 12px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #6F8AA3;
}

.ft-c ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.ft-c a {
    font-size: 13px;
    color: #C4D6E5;
    transition: color .16s;
}

.ft-c a:hover {
    color: #fff;
}

.ft-c p {
    margin: 0;
    font-size:12px;
    line-height: 1.6;
    color: #8FA8BF;
}

.ft-c p + p {
    margin-top: 9px;
}

.ft-nl {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 22px;
    flex-wrap: wrap;
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, .11);
}

.ft-nl-t {
    min-width: 0;
}

.ft-nl-t h4 {
    margin: 0 0 6px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #6F8AA3;
}

.ft-nl-t p {
    margin: 0;
    font-size:12px;
    line-height: 1.55;
    color: #9DB4C8;
    max-width: 52ch;
}

.ft-nl-ok {
    margin: 0 0 8px;
    font-size: 13px;
    color: #8CE0AE;
}

.ft-nlf {
    display: flex;
    gap: 8px;
    flex: 0 1 380px;
    min-width: 250px;
}

.ft-nlf input {
    flex: 1;
    min-width: 0;
    height: 42px;
    border-radius: var(--r-in);
    border: 1px solid rgba(255, 255, 255, .18);
    background: rgba(255, 255, 255, .06);
    color: #fff;
    font-size:13px;
    padding: 0 14px;
    transition: .16s;
}

.ft-nlf input::placeholder {
    color: #7B94AB;
}

.ft-nlf input:focus {
    outline: 0;
    border-color: #5FA8DA;
    background: rgba(255, 255, 255, .11);
}

.ft-nlf button {
    height: 42px;
    padding: 0 18px;
    border-radius: var(--r-in);
    background: #3E92D4;
    color: #fff;
    font-size: 13px;
    font-weight: 600;
    white-space: nowrap;
    transition: .16s;
}

.ft-nlf button:hover {
    background: #5FA8DA;
}

.ft-nlf button:focus-visible {
    outline: 2px solid #8FC8F0;
    outline-offset: 2px;
}

.ft-src {
    padding: 20px 0;
    border-top: 1px solid rgba(255, 255, 255, .11);
}

.ft-src h4 {
    margin: 0 0 11px;
    font-size: 10px;
    font-weight: 700;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #6F8AA3;
}

.ft-src .lst2 {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.ft-src a {
    font-size:11px;
    color: #C4D6E5;
    background: rgba(255, 255, 255, .06);
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: var(--r-pill);
    padding: 6px 13px;
    transition: .16s;
}

.ft-src a:hover {
    background: rgba(255, 255, 255, .13);
    color: #fff;
}

.ft-src p {
    margin: 11px 0 0;
    font-size: 11px;
    color: #7B94AB;
    max-width: 78ch;
    line-height: 1.55;
}

.ft-bot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    flex-wrap: wrap;
    padding-top: 20px;
    border-top: 1px solid rgba(255, 255, 255, .11);
    font-size:11px;
    color: #7B94AB;
}

.ft-bot .lnk {
    display: flex;
    flex-wrap: wrap;
    gap: 4px 16px;
}

.ft-bot a {
    color: #9DB4C8;
}

.ft-bot a:hover {
    color: #fff;
}

.ft a:focus-visible {
    outline: 2px solid #8FC8F0;
    outline-offset: 2px;
}

@media (max-width: 880px) {
    .ft-cols {
        grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
        gap: 22px;
    }
}

@media (max-width: 520px) {
    .ft-cols {
        grid-template-columns:minmax(0, 1fr);
    }
}

.mnav {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    width: min(82vw, 360px);
    z-index: 90;
    background: var(--white, #fff);
    box-shadow: 24px 0 60px rgba(15, 35, 55, .22);
    padding: calc(env(safe-area-inset-top, 0px) + 20px) 22px calc(env(safe-area-inset-bottom, 0px) + 28px);
    overflow-y: auto;
    overscroll-behavior: contain;
    transform: translateX(-100%);
    visibility: hidden;
    transition: transform .32s cubic-bezier(.22, .7, .3, 1), visibility 0s linear .32s;
}

.mnav.open {
    transform: translateX(0);
    visibility: visible;
    transition: transform .32s cubic-bezier(.22, .7, .3, 1), visibility 0s linear 0s;
}

.mnav-veil {
    position: fixed;
    inset: 0;
    z-index: 89;
    background: rgba(11, 22, 35, .46);
    opacity: 0;
    visibility: hidden;
    transition: opacity .32s ease, visibility 0s linear .32s;
}

.mnav-veil.on {
    opacity: 1;
    visibility: visible;
    transition: opacity .32s ease, visibility 0s linear 0s;
}

.mgi {
    border-bottom: 1px solid rgba(215, 234, 247, .85);
}

.mgb {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    width: 100%;
    padding: 15px 2px;
    font-size:15px;
    font-weight: 600;
    color: var(--ink);
    text-align: left;
}

.mgb .car {
    opacity: .45;
    transition: transform .22s;
    flex: 0 0 auto;
}

.mgb[aria-expanded="true"] {
    color: var(--blue);
}

.mgb[aria-expanded="true"] .car {
    transform: rotate(180deg);
    opacity: 1;
}

.mgb-l::after {
    content: "";
    width: 7px;
    height: 7px;
    flex: 0 0 auto;
    margin-right: 5px;
    border-right: 2px solid currentColor;
    border-top: 2px solid currentColor;
    transform: rotate(45deg);
    opacity: .34;
}

.mgb-l:hover {
    color: var(--blue);
}

.mgp {
    display: grid;
    grid-template-rows:0fr;
    overflow: hidden;
    transition: grid-template-rows .28s cubic-bezier(.22, .7, .3, 1);
}

.mgp.open {
    grid-template-rows:1fr;
}

.mgin {
    min-height: 0;
    overflow: hidden;
}

.mgin > div {
    padding-bottom: 10px;
}

.mgin a {
    display: flex;
    align-items: center;
    gap: 9px;
    padding: 9px 10px;
    border-radius: 9px;
    font-size: 14px;
    color: var(--ink-2);
}

.mgin a:hover {
    background: var(--blue-pale);
    color: var(--blue);
}

.mgin a .lkc {
    margin-left: auto;
    font-size:10px;
    font-weight: 700;
    color: #93A7B8;
}

.mgin a .di {
    width: 19px;
    height: 19px;
    color: var(--h);
    flex: 0 0 auto;
}

.mgin a .di svg {
    width: 19px;
    height: 19px;
    display: block;
}

.mgh2 {
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .13em;
    text-transform: uppercase;
    color: #93A7B8;
    padding: 11px 10px 3px;
}

.mnav .login {
    width: 100%;
    margin-top: 16px;
    text-align: center;
    display: block;
}

.mnav .mub {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 16px;
}

.mnav .mub a, .mnav .mub button {
    font-size:11px;
    color: var(--ink-2);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 6px 12px;
}

.crs-cv {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.crs-cv .c1 {
    fill: var(--h);
}

.crs-cv .c2 {
    fill: color-mix(in srgb, var(--h) 52%, #fff);
}

.crs-cv .c3 {
    fill: color-mix(in srgb, var(--h) 22%, #fff);
}

.crs-cv .c4 {
    fill: #fff;
}

.crs-cv .s4 {
    fill: none;
    stroke: #fff;
    stroke-width: 3;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.crs-cv .s1 {
    fill: none;
    stroke: var(--h);
    stroke-width: 3;
    stroke-linecap: round;
}

.crs-cv .cv-sun {
    opacity: .55;
}

.crs-cv .cv-h1 {
    opacity: .85;
}

.crs-cv .cv-art {
    opacity: .95;
}

.crs-cv .cv-art {
    transition: transform .34s cubic-bezier(.22, .7, .3, 1);
}

.crs:hover .crs-cv .cv-art {
    transform: translateY(-4px);
}

.crs-img {
    background: linear-gradient(160deg,
    color-mix(in srgb, var(--h) 24%, #fff) 0%,
    color-mix(in srgb, var(--h) 8%, #fff) 62%,
    color-mix(in srgb, var(--h) 14%, #fff) 100%);
}

.crs-img::after {
    height: 34%;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, .66));
}

@media (prefers-reduced-motion: reduce) {
    .crs-cv .cv-art {
        transition: none !important;
    }
}

.crs-img {
    position: relative;
    height: 138px;
    overflow: hidden;
    background: linear-gradient(140deg, color-mix(in srgb, var(--h) 17%, #fff) 0%,
    color-mix(in srgb, var(--h) 5%, #fff) 100%);
}

.crs-ph {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.crs-pat {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    color: var(--h);
    opacity: .14;
}

.crs-gl {
    position: absolute;
    right: 6px;
    bottom: -6px;
    width: 72px;
    height: 72px;
    color: var(--h);
    opacity: .18;
}

.crs-img::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 52%;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, .75));
}

.blp {
    padding-bottom: clamp(40px, 6vh, 72px);
}

.blp.reading .bl-list, .blp.reading .bl-nl {
    display: none;
}

.blp:not(.reading) .bl-art {
    display: none;
}

.bhead {
    padding: clamp(26px, 3.4vh, 40px) 0 4px;
    background: linear-gradient(180deg, var(--blue-pale), rgba(238, 247, 253, 0));
}

.bhead h1 {
    margin: 13px 0 0;
    font-size: clamp(28px, 3.4vw, 44px);
    font-weight: 800;
    letter-spacing: -.022em;
    line-height: 1.06;
    text-wrap: balance;
}

.bhead .lede {
    margin: 11px 0 0;
    max-width: 66ch;
}

.blp.reading .bhead {
    display: none;
}

.bcv {
    position: relative;
    display: block;
    overflow: hidden;
    border-radius: var(--r-in);
    height: 150px;
    background: linear-gradient(160deg,
    color-mix(in srgb, var(--h) 16%, #fff), color-mix(in srgb, var(--h) 5%, #fff));
}

.bcv.lg {
    height: 100%;
    min-height: 230px;
    border-radius: var(--r-card) 0 0 var(--r-card);
}

.bcv.xl {
    height: clamp(190px, 26vw, 300px);
    border-radius: var(--r-card);
}

.bcv::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 34%;
    background: linear-gradient(180deg, transparent, rgba(255, 255, 255, .72));
}

.bfeat {
    display: grid;
    grid-template-columns:minmax(0, .9fr) minmax(0, 1.1fr);
    gap: 0;
    margin-top: clamp(18px, 2.4vh, 26px);
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    overflow: hidden;
    transition: .2s;
}

.bfeat:hover {
    box-shadow: var(--sh-hov);
}

.bfeat-i {
    display: block;
    padding: 0;
    height: 100%;
}

.bfeat-x {
    padding: clamp(18px, 2.2vw, 28px);
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 0;
    justify-content: center;
}

.bfeat h2 {
    margin: 9px 0 0;
    font-size: clamp(21px, 2.5vw, 31px);
    font-weight: 800;
    letter-spacing: -.022em;
    line-height: 1.14;
    text-wrap: balance;
}

.bcat {
    display: inline-flex;
    align-items: center;
    gap: 7px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--h);
}

.bcat i {
    width: 7px;
    height: 7px;
    border-radius: 50%;
    background: var(--h);
}

.bcat em {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    font-style: normal;
    font-size: 9px;
    letter-spacing: .06em;
    color: var(--blue);
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 3px 9px;
}

.bcat em svg {
    width: 10px;
    height: 10px;
    fill: currentColor;
    stroke-width: 1;
}

.bdk {
    margin: 9px 0 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink-2);
    max-width: 60ch;
}

.bmeta {
    display: flex;
    flex-wrap: wrap;
    gap: 6px 16px;
    margin-top: 12px;
    font-size:11px;
    color: #8A9CAC;
}

.bmeta span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.bmeta svg {
    width: 13px;
    height: 13px;
    color: #B3C2CE;
}

.bmeta.sm {
    margin-top: 9px;
    font-size: 11px;
}

.bbtn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    height: 40px;
    padding: 0 18px;
    font-size: 13px;
    font-weight: 600;
    color: var(--ink);
    background: var(--white);
    border: var(--bw-btn) solid var(--line);
    border-radius: var(--r-pill);
    transition: .16s;
    white-space: nowrap;
}

.bbtn:hover {
    border-color: var(--h, var(--blue));
    color: var(--h, var(--blue));
}

.bbtn:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.bbtn svg {
    width: 15px;
    height: 15px;
    flex: 0 0 auto;
}

.bbtn.pr {
    background: var(--h, var(--blue));
    border-color: var(--h, var(--blue));
    color: #fff;
    margin-top: 16px;
}

.bbtn.pr:hover {
    color: #fff;
    filter: brightness(.94);
}

.bl-list {
    padding-top: var(--sp);
}

.btool {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-wrap: wrap;
    margin-bottom: 12px;
}

.bsw {
    position: relative;
    display: flex;
    align-items: center;
    gap: 8px;
    height: 40px;
    padding: 0 13px;
    width: 270px;
    max-width: 100%;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-in);
    transition: border-color .18s, box-shadow .18s;
}

.bsw:focus-within {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .13);
}

.bsw > svg {
    width: 16px;
    height: 16px;
    color: var(--ink-2);
    flex: 0 0 auto;
}

.bsw input {
    flex: 1;
    min-width: 0;
    border: 0;
    background: none;
    outline: 0;
    font-size:13px;
}

.bsw kbd {
    font: inherit;
    font-size:10px;
    font-weight: 600;
    color: #93A7B8;
    background: var(--blue-pale);
    border: 1px solid var(--line);
    border-radius: 5px;
    padding: 2px 6px;
}

.bsw .xq {
    display: none;
    width: 22px;
    height: 22px;
    border-radius: 50%;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    background: var(--blue-pale);
    color: var(--ink-2);
}

.bsw .xq svg {
    width: 10px;
    height: 10px;
}

.bsw.has .xq {
    display: flex;
}

.bsw.has kbd {
    display: none;
}

.bcnt {
    font-size: 13px;
    color: var(--ink-2);
}

.bcnt b {
    font-size: 15px;
    font-weight: 800;
    color: var(--ink);
    font-variant-numeric: tabular-nums;
}

.bxa {
    font-size: 12px;
    font-weight: 600;
    color: var(--ink-2);
    text-decoration: underline;
    text-decoration-color: var(--line);
    margin-left: auto;
}

.bxa:hover {
    color: var(--h3);
}

.bxa[hidden] {
    display: none;
}

.bchips {
    display: flex;
    gap: 7px;
    flex-wrap: wrap;
    margin-bottom: clamp(14px, 2vh, 20px);
}

.bch {
    font-size:12px;
    font-weight: 600;
    padding: 7px 14px;
    border-radius: var(--r-pill);
    border: 1px solid var(--line);
    background: var(--white);
    color: var(--ink);
    transition: .15s;
    display: inline-flex;
    align-items: center;
    gap: 7px;
}

.bch:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.bch[aria-pressed="true"] {
    background: var(--blue);
    border-color: var(--blue);
    color: #fff;
}

.bch .k {
    font-size:10px;
    font-variant-numeric: tabular-nums;
    opacity: .7;
}

.bch.z {
    opacity: .44;
}

.bch:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
}

.bgrid {
    display: grid;
    grid-template-columns:repeat(auto-fill, minmax(300px, 1fr));
    gap: 14px;
}

.bgrid.empty {
    display: block;
}

.bc {
    display: flex;
    flex-direction: column;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    overflow: hidden;
    transition: .2s;
}

.bc:hover {
    transform: translateY(var(--lift));
    box-shadow: var(--sh-hov);
}

.bc-i {
    display: block;
    padding: 0;
    width: 100%;
}

.bc-i .bcv {
    border-radius: 0;
}

.bc-x {
    padding: 15px 17px 16px;
    display: flex;
    flex-direction: column;
    gap: 0;
    flex: 1;
}

.bc-x h3 {
    margin: 8px 0 0;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: -.012em;
    line-height: 1.3;
}

.bc-t {
    text-align: left;
    font: inherit;
    color: inherit;
}

.bc-t:hover {
    color: var(--h);
}

.bc-t:focus-visible {
    outline: var(--foc) solid var(--blue);
    outline-offset: 2px;
    border-radius: 4px;
}

.bc .bdk {
    font-size: 13px;
    margin-top: 6px;
}

.bc .bmeta {
    margin-top: auto;
    padding-top: 10px;
}

.bempty {
    padding: clamp(36px, 7vh, 72px) 24px;
    text-align: center;
    background: var(--white);
    border: var(--bw) dashed var(--line);
    border-radius: var(--r-card);
}

.bempty b {
    display: block;
    font-size: 17px;
    font-weight: 700;
}

.bempty p {
    margin: 9px auto 18px;
    max-width: 52ch;
    font-size:13px;
    line-height: 1.6;
    color: var(--ink-2);
}

.bl-art {
    padding-top: clamp(20px, 3vh, 34px);
}

.bart {
    max-width: 760px;
    margin: 0 auto;
}

.bback {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size:12px;
    font-weight: 600;
    color: var(--ink-2);
    border: 1px solid var(--line);
    border-radius: var(--r-pill);
    padding: 8px 15px;
    background: var(--white);
    transition: .15s;
    margin-bottom: 20px;
}

.bback:hover {
    border-color: var(--blue);
    color: var(--blue);
}

.bback svg {
    width: 14px;
    height: 14px;
}

.bart h1 {
    margin: 10px 0 0;
    font-size: clamp(27px, 3.6vw, 42px);
    font-weight: 800;
    letter-spacing: -.024em;
    line-height: 1.08;
    text-wrap: balance;
}

.bart-dk {
    margin: 12px 0 0;
    font-size: clamp(15px, 1.5vw, 18px);
    line-height: 1.6;
    color: var(--ink-2);
    font-weight: 500;
    text-wrap: pretty;
}

.bart .bmeta {
    margin-top: 14px;
    padding-bottom: 16px;
    border-bottom: 1px solid var(--line);
}

.bart-cv {
    margin: 18px 0 0;
}

.bart-b {
    margin-top: 22px;
    font-size: 16px;
    line-height: 1.75;
    color: var(--ink);
}

.bart-b p {
    margin: 0 0 17px;
    max-width: 66ch;
}

.bart-b h2 {
    margin: 28px 0 12px;
    font-size: 21px;
    font-weight: 800;
    letter-spacing: -.015em;
    line-height: 1.25;
}

.bart-b ul {
    margin: 0 0 19px;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: 9px;
}

.bart-b li {
    display: flex;
    align-items: flex-start;
    gap: 11px;
    font-size: 15px;
    line-height: 1.62;
    max-width: 66ch;
}

.bart-b li .li {
    width: 15px;
    height: 15px;
    color: var(--h);
    flex: 0 0 auto;
    margin-top: 5px;
}

.bart-b blockquote {
    position: relative;
    margin: 22px 0;
    padding: 18px 20px 18px 46px;
    border-radius: var(--r-card);
    background: color-mix(in srgb, var(--h) 7%, transparent);
    border-left: 3px solid var(--h);
}

.bart-b blockquote .qi {
    position: absolute;
    left: 18px;
    top: 20px;
    width: 18px;
    height: 18px;
    fill: var(--h);
    stroke: none;
    opacity: .5;
}

.bart-b blockquote p {
    margin: 0;
    font-size:16px;
    line-height: 1.62;
    font-weight: 500;
    color: var(--ink);
}

.bart-b blockquote cite {
    display: block;
    margin-top: 9px;
    font-style: normal;
    font-size:12px;
    font-weight: 700;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: var(--h);
}

.bimg {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    margin: 22px 0;
    aspect-ratio: 16/9;
    border-radius: var(--r-card);
    border: 1px dashed var(--line);
    background: repeating-linear-gradient(135deg, #FBFDFF 0 8px, #F4F9FD 8px 16px);
    color: #A8BACA;
    font-size: 12px;
    text-align: center;
    padding: 16px;
}

.bimg svg {
    width: 28px;
    height: 28px;
}

.bart-cta {
    margin-top: 6px;
    padding-top: 18px;
    border-top: 1px solid var(--line);
}

.bart-cta .bbtn {
    margin-top: 0;
}

.bart-h4 {
    margin: 32px 0 11px;
    font-size:10px;
    font-weight: 700;
    letter-spacing: .11em;
    text-transform: uppercase;
    color: var(--ink-2);
}

.brel {
    display: grid;
    grid-template-columns:repeat(3, minmax(0, 1fr));
    gap: 10px;
}

.brc {
    display: flex;
    flex-direction: column;
    text-align: left;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-card);
    box-shadow: var(--sh-card);
    overflow: hidden;
    transition: .18s;
}

.brc:hover {
    transform: translateY(-3px);
    box-shadow: var(--sh-hov);
}

.brc-c .bcv {
    height: 88px;
    border-radius: 0;
}

.brc-x {
    padding: 11px 13px 13px;
}

.brc-x i {
    font-style: normal;
    font-size: 9px;
    font-weight: 700;
    letter-spacing: .1em;
    text-transform: uppercase;
    color: var(--h);
}

.brc-x b {
    display: block;
    margin-top: 5px;
    font-size:13px;
    font-weight: 600;
    line-height: 1.35;
}

.bl-nl {
    margin-top: var(--sp);
    padding: clamp(26px, 3.6vh, 42px) 0;
    background: var(--blue-pale);
    border-top: 1px solid var(--line);
    border-bottom: 1px solid var(--line);
}

.bnl {
    display: grid;
    grid-template-columns:minmax(0, 1fr) minmax(0, .85fr);
    gap: clamp(18px, 3vw, 44px);
    align-items: center;
}

.bnl h2 {
    margin: 11px 0 0;
    font-size: clamp(21px, 2.4vw, 30px);
    font-weight: 800;
    letter-spacing: -.02em;
    line-height: 1.12;
}

.bnl p {
    margin: 9px 0 0;
    font-size: 14px;
    line-height: 1.6;
    color: var(--ink-2);
    max-width: 56ch;
}

.bnl form {
    display: flex;
    gap: 9px;
    flex-wrap: wrap;
}

.bnl input {
    flex: 1;
    min-width: 200px;
    height: 46px;
    padding: 0 16px;
    font-size: 14px;
    background: var(--white);
    border: var(--bw) solid var(--line);
    border-radius: var(--r-pill);
    outline: 0;
    transition: .16s;
}

.bnl input:focus {
    border-color: var(--blue);
    box-shadow: 0 0 0 3px rgba(31, 117, 188, .13);
}

.bnl button {
    height: 46px;
    padding: 0 22px;
    font-size:13px;
    font-weight: 600;
    color: #fff;
    background: var(--blue);
    border-radius: var(--r-pill);
    transition: .16s;
}

.bnl button:hover {
    background: var(--blue-dark);
}

.bnl-ok {
    margin: 10px 0 0;
    font-size:12px;
    font-weight: 600;
    color: var(--ok);
}

.bnl-ok[hidden] {
    display: none;
}

.bkbd {
    margin-top: clamp(16px, 2.2vh, 24px);
    display: flex;
    align-items: center;
    gap: 8px;
    font-size:11px;
    color: #8A9CAC;
}

.bkbd svg {
    width: 14px;
    height: 14px;
    flex: 0 0 auto;
}

.bnote {
    padding: 16px 0 0;
    font-size:11px;
    line-height: 1.6;
    color: #8A9CAC;
}

@media (max-width: 900px) {
    .bfeat {
        grid-template-columns:minmax(0, 1fr);
    }

    .bcv.lg {
        min-height: 190px;
        border-radius: 0;
    }

    .bnl {
        grid-template-columns:minmax(0, 1fr);
    }

    .brel {
        grid-template-columns:minmax(0, 1fr);
    }

    .brc {
        flex-direction: row;
        align-items: center;
    }

    .brc-c {
        flex: 0 0 104px;
    }

    .brc-c .bcv {
        height: 76px;
    }

    .bsw {
        width: 100%;
    }

    .bxa {
        margin-left: 0;
    }
}

@media (max-width: 680px) {
    .bgrid {
        grid-template-columns:minmax(0, 1fr);
    }

    .bart-b {
        font-size: 15px;
    }

    .bnl button {
        width: 100%;
    }
}

.pnl .dm, .pnl .lk {
    width: 100%;
    text-align: left;
}

.pnl .lst + .mgh {
    margin-top: 16px;
}

.bcv .crs-cv {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

.bbtn > svg:not([class]), .bmeta svg:not([class]), .bback svg:not([class]),
.bempty svg:not([class]), .bkbd svg:not([class]), .bimg svg:not([class]),
.bcat em svg:not([class]) {
    width: 15px;
    height: 15px;
}

/* Pragul de mai jos a fost 1140px, dar la acea lățime .nav nu mai încape pe
   un singur rând (brand ~170px + cele 7 itemi de meniu, "UNESCO Learning
   City" fiind cel mai lat, ~660px însumat + .hdr-r cu isrch + selectorul de
   limbă -- extins de la 2 la 3 pastile RO/RU/EN, ~+35px -- + login, ~300px;
   170+660+300 + cele doua gap-uri de 18px din .hrow .wrap trec de 1170px,
   deci mai mult decât cei 1140-48(padding .wrap)=1092px disponibili), iar
   .nav dă wrap pe al doilea rând în loc să treacă direct la burger. Pragul
   e ridicat la 1280px, care lasă o rezervă confortabilă peste lățimea reală
   necesară (~1224px), ca meniul să nu mai apuce starea intermediară "ar
   trebui să încapă, dar dă wrap" -- fie stă pe un rând, fie e ascuns după
   burger, niciodată pe jumătate. */
@media (max-width: 1280px) {
    .nav {
        display: none;
    }

    .burger {
        display: flex;
    }

    .pwrap {
        display: none;
    }
}

@media (max-width: 1000px) {
    .ub-hide {
        display: none;
    }
}

@media (max-width: 900px) {

    .ub-r > a:nth-of-type(1), .ub-r > .ub-sep:nth-of-type(1) {
        display: none;
    }
}

@media (max-width: 900px) {
    .pc {
        flex: 0 0 auto;
        min-width: 210px;
        scroll-snap-align: start;
    }

    .pstrip {
        scroll-snap-type: x mandatory;
    }

    .geoctl {
        max-width: calc(100% - 28px);
    }

    .hdr-r .login, .hdr-r .acc, .isrch {
        display: none;
    }

    .mnav .login {
        display: block;
    }
}

@media (max-width: 620px) {

    .mv-art, .mst-art {
        height: auto;
    }
}

@media (max-width: 680px) {
    :root {
        --hdr: 64px;
    }

    .ubar {
        display: none;
    }

    .srow {
        flex-direction: column;
        align-items: stretch;
    }

    .sbtn {
        width: 100%;
    }

    h1 {
        font-size: clamp(34px, 10.5vw, 46px);
    }

    .catwrap {
        margin-left: -24px;
        margin-right: -24px;
    }

    .cattrack {
        animation-duration: 38s;
    }

    .cat {
        width: 100px;
    }

    .pano {
        height: clamp(160px, 28vh, 240px);
    }

    #pano {
        width: 210%;
        margin-left: -55%;
    }

    .replay {
        display: none;
    }

    .bubs {
        display: none;
    }

    .bwm-u {
        bottom: -2px;
    }

    .hero-sp {
        min-height: 120px;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    .rv {
        opacity: 1 !important;
        transform: none !important;
        transition: none !important;
    }

    .ico [data-d] {
        stroke-dashoffset: 0 !important;
        animation: none !important;
    }

    .blob, .wv1, .wv2, .kicker .gl, .me-pulse, .mk.on .mk-ring, .cattrack {
        animation: none !important;
    }

    .bub {
        transition: none !important;
    }

    h1 .ht {
        animation: none !important;
        background-position: 20% 50% !important;
    }

    h1 .uln path {
        animation: none !important;
        stroke-dashoffset: 0 !important;
    }

    .mv-p, .mst-p, .unl-d {
        animation: none !important;
        stroke-dashoffset: 0 !important;
    }

    .crs-occ-b i {
        animation: none !important;
        width: calc(var(--p) * 1%) !important;
    }

    .unl-fg {
        animation: none !important;
        opacity: 1 !important;
    }

    .unlogo::before, .unredraw {
        opacity: 1 !important;
    }

    .unlogo-s {
        filter: none !important;
    }

    .und-r .fl {
        animation: none !important;
        stroke-dashoffset: calc(276.5 - 276.5 * var(--p) / 100) !important;
    }

    .instrack, .st-rail {
        animation: none !important;
    }

    .inswrap, .st-bleed {
        overflow-x: auto;
        scrollbar-width: thin;
    }

    * {
        transition-duration: .01s !important;
    }
}

.loginp{ padding: clamp(48px, 8vh, 96px) 0; min-height: 60vh; display:flex; align-items:center; }
.loginp-wrap{ display:flex; justify-content:center; }
.loginp-card{
    width:100%; max-width:440px; background:var(--white,#fff);
    border:1px solid var(--line); border-radius:var(--r-card);
    box-shadow:var(--sh-card); padding:clamp(24px,4vw,36px);
}
.loginp-card .kicker{
    display:inline-flex; align-items:center; gap:9px; font-size:10px; font-weight:700;
    letter-spacing:.13em; text-transform:uppercase; color:var(--blue);
}
.loginp-h{ margin:14px 0 0; font-size:clamp(22px,3vw,28px); font-weight:800; letter-spacing:-.02em; color:var(--ink); }
.loginp-lede{ margin:10px 0 22px; font-size:14px; line-height:1.6; color:var(--ink-2); }

.loginp-steps{ display:flex; gap:10px; margin-bottom:20px; }
.loginp-steps span{
    flex:1; text-align:center; font-size:11px; font-weight:700; letter-spacing:.02em;
    padding:8px 6px; border-radius:100px; background:var(--blue-pale,#EEF7FD); color:var(--ink-2);
    border:1px solid var(--line);
}
.loginp-steps span.on{ background:var(--blue); color:#fff; border-color:var(--blue); }

.loginp-alert{ margin-bottom:16px; padding:10px 14px; border-radius:10px; font-size:13px; line-height:1.5; }
.loginp-alert--err{ background:#FDEEEC; color:#B3261E; border:1px solid #F6C7C0; }
.loginp-alert--ok{ background:#E6F5EC; color:#1E8E5A; border:1px solid #BFE6D0; }

.loginp-field{ display:block; margin-bottom:16px; }
.loginp-field span{ display:block; font-size:12px; font-weight:700; color:var(--ink); margin-bottom:6px; }
.loginp-field input{
    width:100%; box-sizing:border-box; padding:11px 14px; border-radius:10px;
    border:1px solid var(--line); font:inherit; font-size:14px; color:var(--ink);
    background:#fff; transition:border-color .15s ease;
}
.loginp-field input:focus{ outline:none; border-color:var(--blue); }

.loginp-tosent{ margin:0 0 16px; font-size:13px; color:var(--ink-2); }

.loginp-btn{
    width:100%; padding:12px 16px; border-radius:100px; border:0; cursor:pointer;
    font:inherit; font-size:14px; font-weight:700; background:var(--blue); color:#fff;
    transition:background .15s ease, opacity .15s ease; margin-top:2px;
}
.loginp-btn:hover{ background:var(--blue-dark,#175F99); }
.loginp-btn:disabled{ opacity:.6; cursor:not-allowed; }
.loginp-btn--ghost{ background:transparent; color:var(--ink-2); border:1px solid var(--line); margin-top:10px; }
.loginp-btn--ghost:hover{ background:var(--blue-pale,#EEF7FD); color:var(--ink); }

.cat2-head { padding: 40px 0 28px; border-bottom: 1px solid var(--line); background: var(--blue-pale); }
.cat2-head h1 { margin: 10px 0 6px; font-size: clamp(28px, 4vw, 40px); }
.cat2-body { display: grid; grid-template-columns: 260px 1fr; gap: 32px; padding: 32px 24px 64px; align-items: start; }
@media (max-width: 860px) { .cat2-body { grid-template-columns: 1fr; } }

.cat2-filters { position: sticky; top: 90px; }
.cat2-form { display: flex; flex-direction: column; gap: 14px; background: #fff; border: 1px solid var(--line); border-radius: var(--r-card); padding: 18px; box-shadow: var(--sh-card); }
.cat2-field { display: flex; flex-direction: column; gap: 6px; }
.cat2-field label { font-size:12px; font-weight: 600; color: var(--ink-2); }
.cat2-field input[type="search"],
.cat2-field input[type="text"],
.cat2-field select { border: 1px solid var(--line); border-radius: var(--r-in); padding: 9px 12px; font: inherit; color: var(--ink); background: #fff; }
.cat2-field input:focus, .cat2-field select:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,117,188,.16); }
.cat2-check label { display: flex; align-items: center; gap: 8px; font-size:13px; color: var(--ink); font-weight: 500; }

.cat2-btn { display: inline-flex; align-items: center; justify-content: center; gap: 6px; padding: 10px 16px; border-radius: var(--r-pill); font-size: 14px; font-weight: 600; text-decoration: none; border: none; cursor: pointer; transition: .16s; }
.cat2-btn--primary { background: var(--blue); color: #fff; }
.cat2-btn--primary:hover { background: var(--blue-dark); }
.cat2-btn--ghost { background: transparent; color: var(--ink-2); border: 1px solid var(--line); text-align: center; }
.cat2-btn--ghost:hover { color: var(--blue); border-color: var(--blue); }

.cat2-count { font-size:13px; color: var(--ink-2); margin-bottom: 14px; }
.cat2-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 18px; }
.cat2-card { display: flex; flex-direction: column; gap: 8px; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--accent, var(--blue)); border-radius: var(--r-card); padding: 18px; text-decoration: none; color: inherit; box-shadow: var(--sh-card); transition: transform .16s, box-shadow .16s; }
.cat2-card:hover { transform: translateY(-2px); box-shadow: 0 4px 10px rgba(23,50,77,.06), 0 16px 34px rgba(23,50,77,.10); }
.cat2-card-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; }
.cat2-tag { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--accent, var(--blue)); }
.cat2-price { font-size:12px; font-weight: 600; color: var(--ink-2); }
.cat2-card h3 { margin: 0; font-size: 17px; line-height: 1.3; color: var(--ink); }
.cat2-card p { margin: 0; font-size:13px; color: var(--ink-2); flex: 1; }
.cat2-card-meta { display: flex; justify-content: space-between; gap: 8px; font-size: 12px; color: var(--ink-2); border-top: 1px dashed var(--line); padding-top: 10px; margin-top: 4px; }

.cat2-empty { text-align: center; padding: 60px 20px; background: #fff; border: 1px dashed var(--line); border-radius: var(--r-card); display: flex; flex-direction: column; align-items: center; gap: 16px; color: var(--ink-2); }

.cat2-pagination { margin-top: 32px; }
.cat2-pg { display: flex; flex-wrap: wrap; gap: 7px; align-items: center; justify-content: center; }
.cat2-pg-num, .cat2-pg-arrow { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 8px; font-size:13px; font-weight: 700; border-radius: var(--r-pill); border: 1px solid var(--line); color: var(--ink-2); background: #fff; text-decoration: none; transition: .16s; }
.cat2-pg-num:hover, .cat2-pg-arrow:hover { border-color: var(--blue); color: var(--blue); background: color-mix(in srgb, var(--blue) 6%, #fff); transform: translateY(-1px); }
.cat2-pg-num.is-active { background: var(--blue); border-color: var(--blue); color: #fff; box-shadow: 0 4px 12px rgba(31,117,188,.28); }
.cat2-pg-num.is-active:hover { transform: none; }
.cat2-pg-dots { display: inline-flex; align-items: center; justify-content: center; min-width: 24px; height: 40px; color: var(--ink-2); font-weight: 700; letter-spacing: .04em; }
.cat2-pg-arrow.is-disabled { opacity: .35; pointer-events: none; }
.cat2-pg-arrow i, .cat2-pg-arrow svg { font-size: 15px; }

.inst2-head { padding: 40px 0 28px; border-bottom: 1px solid var(--line); background: var(--blue-pale); }
.inst2-head h1 { margin: 10px 0 6px; font-size: clamp(28px, 4vw, 40px); }
.inst2-body { display: grid; grid-template-columns: 260px 1fr; gap: 32px; padding: 32px 24px 64px; align-items: start; }
@media (max-width: 860px) { .inst2-body { grid-template-columns: 1fr; } }
.inst2-filters { position: sticky; top: 90px; }
.inst2-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px; }
.inst2-card { display: flex; flex-direction: column; gap: 8px; background: #fff; border: 1px solid var(--line); border-top: 3px solid var(--blue); border-radius: var(--r-card); padding: 18px; box-shadow: var(--sh-card); }
.inst2-card-top { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }
.inst2-count { font-size: 12px; font-weight: 600; color: var(--ink-2); background: var(--blue-pale); border-radius: var(--r-pill); padding: 3px 10px; white-space: nowrap; }
.inst2-card h3 { margin: 0; font-size: 17px; line-height: 1.3; color: var(--ink); }
.inst2-card p { margin: 0; font-size:13px; color: var(--ink-2); }
.inst2-card-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 6px; }

/* ═════════════ HARTA -- refacere vizuala dupa front/04-harta.html ═════════════
   Clasele sunt proprii paginii ("hrt-...") ca sa nu se ciocneasca nici cu alte
   pagini, nici cu id-urile vechi (#map, .mit, .mch...) pe care scriptul mock
   din main.js le asteapta pe macheta originala -- vezi harta.blade.php. */
.hrt { display: grid; grid-template-columns: 340px minmax(0, 1fr); min-height: 560px; height: calc(100vh - var(--hdr) - 1px); border-top: 1px solid var(--line); }
.hrt-side { display: flex; flex-direction: column; min-width: 0; border-right: 1px solid var(--line); background: var(--white); padding: 16px 16px 0; overflow-y: auto; }
.hrt-search { display: flex; align-items: center; gap: 9px; height: 42px; padding: 0 13px; border: var(--bw) solid var(--line); border-radius: var(--r-in); transition: border-color .18s, box-shadow .18s; flex: 0 0 auto; }
.hrt-search:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31, 117, 188, .13); }
.hrt-search svg { width: 16px; height: 16px; color: var(--ink-2); flex: 0 0 auto; }
.hrt-search input { flex: 1; min-width: 0; border: 0; background: none; outline: 0; font-size: 14px; font: inherit; }
.hrt-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 14px; flex: 0 0 auto; }
.hrt-chip { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; padding: 6px 12px; border-radius: var(--r-pill); border: var(--bw) solid var(--line); background: var(--white); color: var(--ink); transition: .15s; cursor: pointer; }
.hrt-chip .dt { width: 8px; height: 8px; border-radius: 50%; background: var(--h, var(--blue)); flex: 0 0 auto; }
.hrt-chip .k { font-size: 10.5px; opacity: .7; font-variant-numeric: tabular-nums; }
.hrt-chip:hover { border-color: var(--blue); color: var(--blue); }
.hrt-chip.is-on { background: var(--blue); border-color: var(--blue); color: #fff; }
.hrt-chip.is-on .dt { background: #fff; }
.hrt-bar { display: flex; align-items: baseline; gap: 6px; padding: 12px 2px; border-top: 1px solid var(--line); margin-top: 14px; font-size: 13px; color: var(--ink-2); flex: 0 0 auto; }
.hrt-bar b { font-size: 15px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.hrt-list { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 2px 2px 16px; }
.hrt-item { display: flex; gap: 11px; align-items: flex-start; width: 100%; text-align: left; padding: 11px 12px; border-radius: var(--r-in); border: var(--bw) solid var(--line); background: var(--white); transition: .14s; cursor: pointer; font: inherit; }
.hrt-item:hover, .hrt-item.is-hot { border-color: var(--blue); background: var(--blue-pale); }
.hrt-item-b { width: 34px; height: 34px; border-radius: 10px; flex: 0 0 auto; display: flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 800; color: #fff; background: var(--h, var(--blue)); }
.hrt-item-x { flex: 1; min-width: 0; }
.hrt-item-n { display: block; font-size: 13.3px; font-weight: 600; color: var(--ink); line-height: 1.3; }
.hrt-item-m { display: flex; flex-wrap: wrap; gap: 4px 10px; margin-top: 3px; font-size: 11.3px; color: var(--ink-2); }
.hrt-empty { padding: 24px 12px; text-align: center; font-size: 13px; color: var(--ink-2); }
.hrt-map { position: relative; z-index: 1; min-height: 320px; background: #E8F2FA; }
.hrt-map #hrtCanvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.hrt-reset { position: absolute; z-index: 410; right: 14px; top: 14px; display: inline-flex; align-items: center; gap: 8px; height: 38px; padding: 0 14px; background: rgba(255, 255, 255, .95); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); border: var(--bw) solid var(--line); border-radius: var(--r-pill); box-shadow: 0 3px 12px rgba(23, 50, 77, .12); font-size: 12.5px; font-weight: 600; color: var(--ink); }
.hrt-reset:hover { border-color: var(--blue); color: var(--blue); }
.hrt-reset svg { width: 15px; height: 15px; flex: 0 0 auto; }
.hrt-mk { display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; border-radius: 50%; color: #fff; font-weight: 800; font-size: 11px; border: 2.5px solid #fff; box-shadow: 0 3px 10px rgba(23, 50, 77, .3); font-variant-numeric: tabular-nums; }
.hrt-pop-wrap .leaflet-popup-content-wrapper { border-radius: var(--r-in); }
.hrt-pop { font-size: 13px; min-width: 180px; }
.hrt-pop strong { display: block; font-size: 14px; color: var(--ink); margin-bottom: 2px; }
.hrt-pop .adr { display: block; color: var(--ink-2); font-size: 12px; }
.hrt-pop .cnt { display: inline-block; margin-top: 6px; font-size: 11px; font-weight: 600; color: var(--blue); background: var(--blue-pale); border-radius: var(--r-pill); padding: 2px 8px; }
.hrt-pop a { display: inline-flex; margin-top: 8px; font-size: 12.5px; font-weight: 600; color: var(--blue); }
.hrt-pop a:hover { color: var(--blue-dark); }
@media (max-width: 860px) {
  .hrt { grid-template-columns: 1fr; height: auto; }
  .hrt-side { border-right: 0; border-bottom: 1px solid var(--line); max-height: 420px; }
  .hrt-map { height: 420px; }
}

.cal3-head { padding: 40px 0 28px; border-bottom: 1px solid var(--line); background: var(--blue-pale); }
.cal3-head h1 { margin: 10px 0 6px; font-size: clamp(28px, 4vw, 40px); }
.cal3-body { padding: 32px 24px 64px; }
.cal3-nav { display: flex; align-items: center; gap: 14px; margin-bottom: 20px; }
.cal3-nav h2 { margin: 0; font-size: 20px; text-transform: capitalize; flex: 1; text-align: center; }
.cal3-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 1px; background: var(--line); border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; }
.cal3-dow { background: var(--blue-pale); text-align: center; font-size: 12px; font-weight: 700; color: var(--ink-2); padding: 8px 4px; text-transform: uppercase; }
.cal3-cell { background: #fff; min-height: 96px; padding: 6px; display: flex; flex-direction: column; gap: 4px; }
.cal3-cell.is-out { background: #FAFBFC; }
.cal3-cell.is-out .cal3-daynum { color: var(--ink-3, #A7B2BC); }
.cal3-cell.is-today { background: color-mix(in srgb, var(--blue) 8%, #fff); }
.cal3-daynum { font-size:12px; font-weight: 700; color: var(--ink-2); }
.cal3-events { display: flex; flex-direction: column; gap: 3px; }
.cal3-event { font-size: 11px; font-weight: 600; color: var(--accent, var(--blue)); background: color-mix(in srgb, var(--accent, var(--blue)) 12%, #fff); border-radius: 5px; padding: 3px 6px; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal3-more { font-size:10px; color: var(--ink-2); padding: 2px 6px; }
@media (max-width: 720px) {
    .cal3-grid { grid-template-columns: repeat(7, minmax(38px, 1fr)); }
    .cal3-cell { min-height: 64px; }
    .cal3-event { display: none; }
    .cal3-cell.is-today .cal3-daynum, .cal3-cell:has(.cal3-event) .cal3-daynum { text-decoration: underline; }
}

.cal3-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 16px; }
.cal3-tabs { display: inline-flex; background: var(--blue-pale); border-radius: 999px; padding: 3px; gap: 2px; }
.cal3-tab { padding: 7px 16px; border-radius: 999px; font-size:13px; font-weight: 700; color: var(--ink-2); text-decoration: none; }
.cal3-tab.is-active { background: #fff; color: var(--ink); box-shadow: 0 1px 3px rgba(0,0,0,.12); }
.cal3-ics { display: inline-flex; align-items: center; gap: 7px; }

.cal3-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 10px; }
.cal3-weekday { background: #fff; border: 1px solid var(--line); border-radius: var(--r-card); padding: 10px; min-height: 220px; display: flex; flex-direction: column; gap: 8px; }
.cal3-weekday.is-today { background: color-mix(in srgb, var(--blue) 6%, #fff); border-color: var(--blue); }
.cal3-weekday-head { display: flex; flex-direction: column; align-items: center; padding-bottom: 8px; border-bottom: 1px solid var(--line); text-align: center; }
.cal3-weekday-name { font-size: 11px; font-weight: 700; text-transform: uppercase; color: var(--ink-2); }
.cal3-weekday-num { font-size:13px; font-weight: 700; }
.cal3-weekday-events { display: flex; flex-direction: column; gap: 6px; }
.cal3-event--block { display: block; white-space: normal; }
.cal3-empty-day { font-size: 12px; color: var(--ink-3, #A7B2BC); text-align: center; padding: 8px 0; }
@media (max-width: 900px) {
    .cal3-week { grid-template-columns: 1fr; }
    .cal3-weekday { min-height: auto; }
}

.cal3-agenda { display: flex; flex-direction: column; gap: 22px; }
.cal3-agenda-date { font-size: 14px; font-weight: 700; text-transform: capitalize; color: var(--ink-2); margin-bottom: 10px; padding-bottom: 6px; border-bottom: 1px solid var(--line); }
.cal3-agenda-list { display: flex; flex-direction: column; gap: 8px; }
.cal3-agenda-item { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border: 1px solid var(--line); border-radius: var(--r-card); text-decoration: none; color: var(--ink); background: #fff; }
.cal3-agenda-item:hover { border-color: var(--accent, var(--blue)); }
.cal3-agenda-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--accent, var(--blue)); flex-shrink: 0; }
.cal3-agenda-title { font-weight: 700; font-size: 14px; }
.cal3-agenda-meta { margin-left: auto; font-size:12px; color: var(--ink-2); text-align: right; }
.cal3-empty { text-align: center; color: var(--ink-2); padding: 40px 0; }

.act2-head { padding: 36px 0 26px; border-bottom: 1px solid var(--line); background: linear-gradient(180deg, color-mix(in srgb, var(--accent, var(--blue)) 8%, #fff), #fff); }
.act2-head h1 { margin: 8px 0 6px; font-size: clamp(26px, 4vw, 38px); }
.act2-tag { display: inline-block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var(--accent, var(--blue)); }
.act2-body { display: grid; grid-template-columns: 1fr 320px; gap: 28px; padding: 32px 24px 64px; align-items: start; }
@media (max-width: 860px) { .act2-body { grid-template-columns: 1fr; } }
.act2-card { background: #fff; border: 1px solid var(--line); border-radius: var(--r-card); padding: 22px; box-shadow: var(--sh-card); margin-bottom: 20px; }
.act2-card h2 { margin: 0 0 12px; font-size: 18px; }
.act2-prose { color: var(--ink); line-height: 1.6; font-size: 15px; }
.act2-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.act2-chip { font-size:12px; font-weight: 600; color: var(--blue-dark); background: var(--blue-pale); border: 1px solid var(--line); border-radius: var(--r-pill); padding: 6px 12px; }

.act2-facts dl { display: flex; flex-direction: column; gap: 12px; margin: 0; }
.act2-facts dl > div { display: flex; flex-direction: column; gap: 2px; border-bottom: 1px dashed var(--line); padding-bottom: 10px; }
.act2-facts dl > div:last-child { border-bottom: none; padding-bottom: 0; }
.act2-facts dt { font-size:11px; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-2); }
.act2-facts dd { margin: 0; font-size:14px; color: var(--ink); font-weight: 600; }

.act2-enroll .act2-form { display: flex; flex-direction: column; gap: 10px; }
.act2-enroll label { font-size:12px; font-weight: 600; color: var(--ink-2); }
.act2-enroll input { border: 1px solid var(--line); border-radius: var(--r-in); padding: 10px 12px; font: inherit; color: var(--ink); }
.act2-enroll input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,117,188,.16); }
.act2-honeypot { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.act2-fine { font-size: 12px; color: var(--ink-2); margin: 4px 0 0; }
.act2-full { color: var(--ink-2); font-size: 14px; }
.act2-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; font: inherit; font-weight: 700; font-size: 14px; border-radius: var(--r-pill); padding: 10px 20px; border: 1px solid transparent; cursor: pointer; text-decoration: none; }
.act2-btn--primary { background: var(--accent, var(--blue)); color: #fff; }
.act2-btn--primary:hover { filter: brightness(.94); }

.act2-alert { border-radius: var(--r-in); padding: 12px 14px; font-size:13px; margin-bottom: 14px; }
.act2-alert--ok { background: var(--ok-bg, #E6F5EC); color: var(--ok, #1E8E5A); border: 1px solid rgba(30,142,90,.25); }
.act2-alert--err { background: #FBE9EC; color: #8C2534; border: 1px solid rgba(206,62,82,.25); }
.act2-alert--err ul { margin: 0; padding-left: 18px; }

.blog2-head { padding: clamp(28px,4vh,46px) 0 clamp(18px,3vh,28px); }
.blog2-head h1 { margin: 10px 0 6px; font-size: clamp(26px,3.2vw,38px); font-weight: 800; letter-spacing: -.02em; color: var(--ink); }
.blog2-head .lede { margin: 0; color: var(--ink-2); font-size: 15px; max-width: 60ch; }

.blog2-feat { display: grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap: 0; background: #fff; border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; box-shadow: var(--sh-card); text-decoration: none; margin-bottom: 28px; transition: .16s; }
.blog2-feat:hover { box-shadow: var(--sh-hov); }
.blog2-feat-cover { display: block; min-height: 200px; background: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 85%, #000 5%), var(--h,#1F75BC)); background-size: cover; background-position: center; }
.blog2-feat-cover--img { background-image: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 45%, transparent), color-mix(in srgb, var(--h,#1F75BC) 45%, transparent)), var(--img); }
.blog2-feat-x { padding: clamp(18px,2.2vw,28px); display: flex; flex-direction: column; gap: 10px; justify-content: center; }
.blog2-feat-x h2 { margin: 0; font-size: clamp(19px,2.2vw,26px); font-weight: 800; color: var(--ink); letter-spacing: -.01em; }
.blog2-feat-x p { margin: 0; color: var(--ink-2); font-size:14px; line-height: 1.55; }

.blog2-badges { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.blog2-cat { display: inline-flex; align-items: center; gap: 6px; font-size:10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--h,var(--blue)); }
.blog2-cat i { width: 7px; height: 7px; border-radius: 50%; background: var(--h,var(--blue)); display: inline-block; }
.blog2-star { display: inline-flex; align-items: center; gap: 5px; font-size:10px; font-weight: 700; color: #92660A; background: #FFF3D6; border: 1px solid #F4DFA0; border-radius: var(--r-pill); padding: 3px 9px; }

.blog2-meta { display: flex; gap: 14px; font-size:12px; color: var(--ink-2); }
.blog2-meta.sm { font-size: 12px; margin-top: 6px; }

.blog2-toolbar { margin: 18px 0 14px; }
.blog2-search { display: flex; gap: 8px; max-width: 420px; }
.blog2-search input { flex: 1; border: 1px solid var(--line); border-radius: var(--r-in); padding: 9px 12px; font: inherit; color: var(--ink); }
.blog2-search input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,117,188,.16); }

.blog2-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.blog2-chip { display: inline-flex; align-items: center; gap: 6px; font-size:12px; font-weight: 600; color: var(--ink-2); background: #fff; border: 1px solid var(--line); border-radius: var(--r-pill); padding: 7px 13px; text-decoration: none; transition: .14s; }
.blog2-chip:hover { border-color: var(--blue); color: var(--blue); }
.blog2-chip.is-active { background: var(--blue); border-color: var(--blue); color: #fff; }
.blog2-chip .k { font-weight: 700; opacity: .75; }

.blog2-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.blog2-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; box-shadow: var(--sh-card); text-decoration: none; transition: .16s; }
.blog2-card:hover { box-shadow: var(--sh-hov); transform: translateY(var(--lift,-3px)); }
.blog2-card-cover { display: block; height: 130px; background: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 85%, #000 5%), var(--h,#1F75BC)); background-size: cover; background-position: center; }
.blog2-card-cover--img { background-image: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 45%, transparent), color-mix(in srgb, var(--h,#1F75BC) 45%, transparent)), var(--img); }
.blog2-card-x { padding: 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.blog2-card-x h3 { margin: 0; font-size:16px; font-weight: 700; color: var(--ink); line-height: 1.35; }
.blog2-card-x p { margin: 0; font-size: 13px; color: var(--ink-2); line-height: 1.5; flex: 1; }

.blog2-art {padding-top: clamp(24px,3.5vh,40px); padding-bottom: 60px; }
.blog2-back { display: inline-flex; align-items: center; gap: 8px; font-size:13px; font-weight: 600; color: var(--ink-2); text-decoration: none; margin-bottom: 18px; }
.blog2-back:hover { color: var(--blue); }
.blog2-art h1 { margin: 10px 0 12px; font-size: clamp(24px,3vw,34px); font-weight: 800; letter-spacing: -.02em; color: var(--ink); }
.blog2-art-cover { margin: 18px 0; border-radius: var(--r-card); overflow: hidden; height: 600px; background: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 85%, #000 5%), var(--h,#1F75BC)); }
.blog2-art-cover img { width: 100%; max-height: 600px; object-fit: cover; display: block; }
.blog2-art-body p { font-size:15px; line-height: 1.75; color: var(--ink); margin: 0 0 16px; }

.blog2-related-h { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-2); margin: 36px 0 14px; }
.blog2-related { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.blog2-related-card { display: flex; flex-direction: column; gap: 8px; text-decoration: none; }
.blog2-related-cover { display: block; height: 80px; border-radius: var(--r-in); background: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 85%, #000 5%), var(--h,#1F75BC)); }
.blog2-related-card span:last-child { font-size: 13px; font-weight: 600; color: var(--ink); line-height: 1.4; }
.blog2-related-card:hover span:last-child { color: var(--blue); }

@media (max-width: 860px) {
    .blog2-feat { grid-template-columns: minmax(0,1fr); }
    .blog2-feat-cover { min-height: 140px; }
    .blog2-grid, .blog2-related { grid-template-columns: minmax(0,1fr); }
}

.di > i.bi { display: block; font-size: 19px; line-height: 21px; text-align: center; width: 21px; }

/* ═════════════ EVENIMENTE -- refacere vizuala dupa front/08-evenimente.html ═════════════
   Clase proprii paginii ("evt-...") ca sa nu se ciocneasca cu id-urile vechi
   (evList, evTy, evQ, evMon, epan...) pe care scriptul mock din main.js le
   asteapta pe macheta originala -- vezi evenimente.blade.php. Pagina de
   detaliu (evenimente-show.blade.php) foloseste in continuare .ev2-art/
   .ev2-related, neatinse aici. */
.evt { padding: clamp(20px, 3vh, 30px) 0 clamp(40px, 6vh, 72px); }
.evt-tool { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 14px; }
.evt-search { position: relative; display: flex; align-items: center; gap: 8px; height: 42px; padding: 0 13px; width: 320px; max-width: 100%; background: var(--white); border: var(--bw) solid var(--line); border-radius: var(--r-in); transition: border-color .18s, box-shadow .18s; }
.evt-search:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31, 117, 188, .13); }
.evt-search svg { width: 16px; height: 16px; color: var(--ink-2); flex: 0 0 auto; }
.evt-search input { flex: 1; min-width: 0; border: 0; background: none; outline: 0; font-size: 13.5px; font: inherit; }
.evt-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 12px; }
.evt-chip { display: inline-flex; align-items: center; gap: 7px; font-size: 12.5px; font-weight: 600; padding: 7px 13px; border-radius: var(--r-pill); border: var(--bw) solid var(--line); background: var(--white); color: var(--ink); transition: .15s; text-decoration: none; }
.evt-chip .dt { width: 8px; height: 8px; border-radius: 50%; background: var(--h, var(--blue)); flex: 0 0 auto; }
.evt-chip:hover { border-color: var(--blue); color: var(--blue); }
.evt-chip.is-on { background: var(--blue); border-color: var(--blue); color: #fff; }
.evt-chip.is-on .dt { background: #fff; }
.evt-chip .k { font-size: 10.5px; font-variant-numeric: tabular-nums; opacity: .7; }
.evt-chip--sm { font-size: 12px; padding: 6px 12px; }
.evt-chip--toggle { border-style: dashed; margin-left: auto; }
.evt-chip--toggle.is-on { border-style: solid; }
.evt-count-row { display: flex; align-items: center; gap: 14px; margin: 2px 0 16px; }
.evt-count { font-size: 13px; color: var(--ink-2); margin: 0; }
.evt-count b { font-size: 15px; font-weight: 800; color: var(--ink); font-variant-numeric: tabular-nums; }
.evt-clear { font-size: 12px; font-weight: 600; color: var(--ink-2); text-decoration: underline; text-decoration-color: var(--line); }
.evt-clear:hover { color: var(--h3); }
.evt-group { margin-bottom: clamp(20px, 2.6vh, 30px); }
.evt-group-h { display: flex; align-items: baseline; gap: 11px; margin: 0 0 11px; font-size: 11px; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); }
.evt-group-h span:first-child { text-transform: capitalize; }
.evt-group-h span:last-child { font-size: 10.5px; font-weight: 600; letter-spacing: .02em; text-transform: none; color: #93A7B8; }
.evt-group-l { display: flex; flex-direction: column; gap: 10px; }
.evt-card { display: grid; grid-template-columns: 78px minmax(0, 1fr); gap: 16px; align-items: center; padding: 15px 17px; background: var(--white); border: var(--bw) solid var(--line); border-radius: var(--r-card); box-shadow: var(--sh-card); transition: .18s; text-decoration: none; color: inherit; }
.evt-card:hover { transform: translateY(var(--lift)); box-shadow: var(--sh-hov); border-color: var(--h); }
.evt-card.is-past { opacity: .62; }
.evt-card.is-past:hover { opacity: 1; }
.evt-card-d { display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 10px 6px; border-radius: var(--r-in); background: color-mix(in srgb, var(--h) 10%, transparent); }
.evt-card-d b { font-size: 27px; font-weight: 800; line-height: 1; letter-spacing: -.03em; color: var(--h); font-variant-numeric: tabular-nums; }
.evt-card-d i { font-style: normal; margin-top: 2px; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--h); }
.evt-card-d u { text-decoration: none; margin-top: 4px; font-size: 9.5px; font-weight: 700; color: #fff; background: var(--h); border-radius: var(--r-pill); padding: 1px 6px; white-space: nowrap; }
.evt-card-x { min-width: 0; }
.evt-card-t { display: flex; align-items: center; gap: 7px; flex-wrap: wrap; font-size: 10.5px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--h); }
.evt-card-t em { font-style: normal; font-size: 9.5px; letter-spacing: .04em; color: var(--ok); background: var(--ok-bg); border-radius: var(--r-pill); padding: 2px 8px; }
.evt-card-t s { text-decoration: none; font-size: 9.5px; letter-spacing: .04em; color: var(--ink-2); background: #F1F5F9; border-radius: var(--r-pill); padding: 2px 8px; }
.evt-card-x h3 { margin: 6px 0 0; font-size: 17px; font-weight: 700; letter-spacing: -.012em; line-height: 1.28; color: var(--ink); }
.evt-card-x p { margin: 3px 0 0; font-size: 13px; line-height: 1.5; color: var(--ink-2); }
.evt-card-m { display: flex; flex-wrap: wrap; gap: 5px 15px; margin-top: 8px; font-size: 11.5px; color: var(--ink-2); }
.evt-card-m span { display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
.evt-card-m svg { width: 13px; height: 13px; color: #93A7B8; flex: 0 0 auto; }
.evt-empty { padding: clamp(36px, 7vh, 72px) 24px; text-align: center; background: var(--white); border: var(--bw) dashed var(--line); border-radius: var(--r-card); }
.evt-empty b { display: block; font-size: 17px; font-weight: 700; color: var(--ink); }
.evt-empty p { margin: 9px auto 18px; max-width: 52ch; font-size: 13.5px; line-height: 1.6; color: var(--ink-2); }
@media (max-width: 620px) {
  .evt-card { grid-template-columns: 60px minmax(0, 1fr); }
  .evt-chip--toggle { margin-left: 0; }
}

.ev2-head { padding: clamp(28px,4vh,46px) 0 clamp(18px,3vh,28px); }
.ev2-head h1 { margin: 10px 0 6px; font-size: clamp(26px,3.2vw,38px); font-weight: 800; letter-spacing: -.02em; color: var(--ink); }
.ev2-head .lede { margin: 0; color: var(--ink-2); font-size: 15px; max-width: 60ch; }

.ev2-badges { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.ev2-type { display: inline-flex; align-items: center; gap: 6px; font-size:10px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em; color: var(--h,var(--blue)); }
.ev2-type i { width: 7px; height: 7px; border-radius: 50%; background: var(--h,var(--blue)); display: inline-block; }
.ev2-free { display: inline-flex; align-items: center; gap: 5px; font-size:10px; font-weight: 700; color: #1B7A4A; background: #E4F6EC; border: 1px solid #B9E8CD; border-radius: var(--r-pill); padding: 3px 9px; }

.ev2-meta { display: flex; gap: 14px; flex-wrap: wrap; font-size:12px; color: var(--ink-2); }
.ev2-meta i { margin-right: 4px; }

.ev2-toolbar { margin: 18px 0 14px; display: flex; align-items: center; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.ev2-search { display: flex; gap: 8px; max-width: 420px; flex: 1; }
.ev2-search input { flex: 1; border: 1px solid var(--line); border-radius: var(--r-in); padding: 9px 12px; font: inherit; color: var(--ink); }
.ev2-search input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px rgba(31,117,188,.16); }
.ev2-past-toggle { display: inline-flex; align-items: center; gap: 7px; font-size:12px; color: var(--ink-2); white-space: nowrap; }

.ev2-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 18px; }
.ev2-chip { display: inline-flex; align-items: center; gap: 6px; font-size:12px; font-weight: 600; color: var(--ink-2); background: #fff; border: 1px solid var(--line); border-radius: var(--r-pill); padding: 7px 13px; text-decoration: none; transition: .14s; }
.ev2-chip:hover { border-color: var(--blue); color: var(--blue); }
.ev2-chip.is-active { background: var(--blue); border-color: var(--blue); color: #fff; }
.ev2-chip .k { font-weight: 700; opacity: .75; }

.ev2-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 18px; }
.ev2-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; box-shadow: var(--sh-card); text-decoration: none; transition: .16s; }
.ev2-card:hover { box-shadow: var(--sh-hov); transform: translateY(var(--lift,-3px)); }
.ev2-card-cover { display: block; height: 130px; background: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 85%, #000 5%), var(--h,#1F75BC)); }
.ev2-card-x { padding: 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.ev2-card-x h3 { margin: 0; font-size:16px; font-weight: 700; color: var(--ink); line-height: 1.35; }
.ev2-card-x p { margin: 0; font-size: 13px; color: var(--ink-2); line-height: 1.5; flex: 1; }

.ev2-art { padding-top: clamp(24px,3.5vh,40px); padding-bottom: 60px; }
.ev2-back { display: inline-flex; align-items: center; gap: 8px; font-size:13px; font-weight: 600; color: var(--ink-2); text-decoration: none; margin-bottom: 18px; }
.ev2-back:hover { color: var(--blue); }
.ev2-art h1 { margin: 10px 0 6px; font-size: clamp(24px,3vw,34px); font-weight: 800; letter-spacing: -.02em; color: var(--ink); }
.ev2-location { font-size: 14px; color: var(--ink-2); margin: 10px 0 0; }
.ev2-art-cover { margin: 18px 0; border-radius: var(--r-card); overflow: hidden; height: 500px; background: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 85%, #000 5%), var(--h,#1F75BC)); }
.ev2-art-cover img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ev2-art-body p { font-size:15px; line-height: 1.75; color: var(--ink); margin: 0 0 16px; }
.ev2-schedule p { font-size:14px; line-height: 1.7; color: var(--ink); margin: 0 0 8px; padding-left: 14px; border-left: 2px solid var(--h,var(--blue)); }

.ev2-related-h { font-size: 13px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--ink-2); margin: 36px 0 14px; }
.ev2-related { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.ev2-related-card { display: flex; flex-direction: column; gap: 8px; text-decoration: none; }
.ev2-related-cover { display: block; height: 80px; border-radius: var(--r-in); background: linear-gradient(135deg, color-mix(in srgb, var(--h,#1F75BC) 85%, #000 5%), var(--h,#1F75BC)); }

/* Inscriere la eveniment (evenimente-show.blade.php) -- oglindeste
   .act2-enroll/.act2-form/.act2-alert de la Activitati (activity-show.blade.php),
   dar cu prefixul ev2- ca sa nu se amestece stiluri intre cele doua pagini. */
.ev2-seats { font-size: 14px; color: var(--ink-2); margin: 14px 0 0; font-weight: 600; }
.ev2-enroll { background: #fff; border: 1px solid var(--line); border-radius: var(--r-card); padding: 22px; box-shadow: var(--sh-card); margin: 22px 0; max-width: 480px; }
.ev2-enroll h2 { margin: 0 0 12px; font-size: 18px; color: var(--ink); }
.ev2-enroll .ev2-form { display: flex; flex-direction: column; gap: 10px; }
.ev2-enroll label { font-size:12px; font-weight: 600; color: var(--ink-2); }
.ev2-enroll input { border: 1px solid var(--line); border-radius: var(--r-in); padding: 10px 12px; font: inherit; color: var(--ink); }
.ev2-enroll input:focus { outline: none; border-color: var(--h,var(--blue)); box-shadow: 0 0 0 3px color-mix(in srgb, var(--h,var(--blue)) 16%, transparent); }
.ev2-honeypot { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; overflow: hidden; }
.ev2-fine { font-size: 12px; color: var(--ink-2); margin: 4px 0 0; }
.ev2-full { color: var(--ink-2); font-size: 14px; }
.ev2-btn { display: inline-flex; align-items: center; justify-content: center; gap: 7px; font: inherit; font-weight: 700; font-size: 14px; border-radius: var(--r-pill); padding: 10px 20px; border: 1px solid transparent; cursor: pointer; text-decoration: none; }
.ev2-btn--primary { background: var(--h,var(--blue)); color: #fff; }
.ev2-btn--primary:hover { filter: brightness(.94); }
.ev2-alert { border-radius: var(--r-in); padding: 12px 14px; font-size:13px; margin-bottom: 14px; }
.ev2-alert--ok { background: var(--ok-bg, #E6F5EC); color: var(--ok, #1E8E5A); border: 1px solid rgba(30,142,90,.25); }
.ev2-alert--err { background: #FBE9EC; color: #8C2534; border: 1px solid rgba(206,62,82,.25); }
.ev2-alert--err ul { margin: 0; padding-left: 18px; }

.ev2-related-card span:last-child { font-size: 13px; font-weight: 600; color: var(--ink); line-height: 1.4; }
.ev2-related-card:hover span:last-child { color: var(--blue); }

@media (max-width: 860px) {
    .ev2-grid, .ev2-related { grid-template-columns: minmax(0,1fr); }
    .ev2-toolbar { flex-direction: column; align-items: stretch; }
}
