@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;src:url(/fonts/Inter-normal-cyrillic-ext.woff2) format('woff2');unicode-range:U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;src:url(/fonts/Inter-normal-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;src:url(/fonts/Inter-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Inter';font-style:normal;font-weight:300 800;font-display:swap;src:url(/fonts/Inter-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400 900;font-display:swap;src:url(/fonts/PlayfairDisplay-italic-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400 900;font-display:swap;src:url(/fonts/PlayfairDisplay-italic-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:italic;font-weight:400 900;font-display:swap;src:url(/fonts/PlayfairDisplay-italic-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/PlayfairDisplay-normal-cyrillic.woff2) format('woff2');unicode-range:U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/PlayfairDisplay-normal-latin-ext.woff2) format('woff2');unicode-range:U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF}
@font-face{font-family:'Playfair Display';font-style:normal;font-weight:400 900;font-display:swap;src:url(/fonts/PlayfairDisplay-normal-latin.woff2) format('woff2');unicode-range:U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD}
:root {
--paper: #f6f1e8;
--paper-2: #efe7d9;
--paper-3: #e6dccb;
--card: #fffdf9;
--ink: #1c1a17;
--ink-2: #45403a;
--muted: #776f65;
--line: #ddd2c1;
--accent: #b2432a;
--accent-ink: #fff;
--accent-2: #13696d;
--gold: #a87f32;
--ok: #2f7d4f;
--warn: #b7791f;
--bad: #b3261e;
--shadow: 0 1px 2px rgb(40 30 20 / .06), 0 8px 24px -12px rgb(40 30 20 / .18);
--shadow-lg: 0 24px 60px -24px rgb(40 30 20 / .35);
--serif: 'Playfair Display', 'Georgia', 'Times New Roman', serif;
--sans: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
--r: 14px;
--r-sm: 9px;
--hdr: 68px;
--wrap: 1280px;
--gut: clamp(16px, 4vw, 40px);
--ease: cubic-bezier(.2, .7, .2, 1);
--ease-out: cubic-bezier(.16, 1, .3, 1);
color-scheme: light;
}
:root[data-theme="dark"] {
--paper: #141311; --paper-2: #1c1a17; --paper-3: #26231f; --card: #1d1b18;
--ink: #f2ece2; --ink-2: #d2c9bb; --muted: #9c9285; --line: #34302a;
--accent: #e2805f; --accent-ink: #1a0f0a; --accent-2: #55b8b3; --gold: #d6b46b;
--shadow: 0 1px 2px rgb(0 0 0 / .3), 0 8px 24px -12px rgb(0 0 0 / .6);
--shadow-lg: 0 24px 60px -24px rgb(0 0 0 / .8);
color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
:root[data-theme="auto"] {
--paper: #141311; --paper-2: #1c1a17; --paper-3: #26231f; --card: #1d1b18;
--ink: #f2ece2; --ink-2: #d2c9bb; --muted: #9c9285; --line: #34302a;
--accent: #e2805f; --accent-ink: #1a0f0a; --accent-2: #55b8b3; --gold: #d6b46b;
--shadow: 0 1px 2px rgb(0 0 0 / .3), 0 8px 24px -12px rgb(0 0 0 / .6);
--shadow-lg: 0 24px 60px -24px rgb(0 0 0 / .8);
color-scheme: dark;
}
}
@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .35s; animation-timing-function: var(--ease); }
::view-transition-group(*) { animation-duration: .45s; animation-timing-function: var(--ease-out); }
@media (prefers-reduced-motion: reduce) { @view-transition { navigation: none; } }
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; text-size-adjust: 100%; scroll-padding-top: calc(var(--hdr) + 16px); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
margin: 0; background: var(--paper); color: var(--ink);
font: 400 1.0625rem/1.65 var(--sans); font-feature-settings: 'ss01', 'cv11';
-webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility;
min-height: 100vh; display: flex; flex-direction: column; overflow-x: clip;
}
main { flex: 1; outline: none; }
img, svg, video, picture { display: block; max-width: 100%; }
img { height: auto; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: .18em; }
a:hover { color: var(--accent); }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
::selection { background: color-mix(in oklab, var(--accent) 30%, transparent); }
h1, h2, h3, h4 { font-family: var(--serif); font-weight: 500; line-height: 1.1; letter-spacing: -.012em; margin: 0 0 .5em; text-wrap: balance; hyphens: auto; }
h1 { font-size: clamp(2.3rem, 5.6vw, 4.6rem); }
h2 { font-size: clamp(1.7rem, 3.4vw, 2.6rem); }
h3 { font-size: clamp(1.2rem, 1.9vw, 1.45rem); }
p { margin: 0 0 1em; text-wrap: pretty; }
.i { width: 1.15em; height: 1.15em; flex: none; vertical-align: -.2em; }
.wrap { width: 100%; max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gut); }
.wrap--narrow { max-width: 860px; }
.kicker { font: 600 .74rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin: 0 0 .9em; display: flex; align-items: center; gap: .5em; }
.lead { font-size: clamp(1.08rem, 1.6vw, 1.3rem); line-height: 1.55; color: var(--ink-2); max-width: 62ch; }
.muted { color: var(--muted); }
.skip { position: absolute; left: -9999px; top: 8px; z-index: 1000; background: var(--ink); color: var(--paper); padding: .6em 1em; border-radius: 8px; }
.skip:focus { left: 8px; }
.sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
[hidden] { display: none !important; }
.only-dark { display: none; }
:root[data-theme="dark"] .only-dark { display: block; } :root[data-theme="dark"] .only-light { display: none; }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .only-dark { display: block; } :root[data-theme="auto"] .only-light { display: none; } }
.btn { display: inline-flex; align-items: center; gap: .55em; padding: .78em 1.3em; border-radius: 999px; border: 1px solid var(--ink); background: var(--ink); color: var(--paper);
font: 600 .92rem/1 var(--sans); text-decoration: none; transition: transform .25s var(--ease), background .25s, color .25s, border-color .25s; white-space: nowrap; }
.btn:hover { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); transform: translateY(-1px); }
.btn--ghost { background: transparent; color: var(--ink); border-color: var(--line); }
.btn--ghost:hover { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.btn--accent { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.btn--sm { padding: .55em .9em; font-size: .82rem; }
.ibtn { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 999px; border: 1px solid transparent; background: transparent; color: inherit; transition: background .2s, border-color .2s; }
.ibtn:hover { background: color-mix(in oklab, var(--ink) 8%, transparent); color: inherit; }
.ibtn .i { width: 20px; height: 20px; }
.more { display: inline-flex; align-items: center; gap: .4em; font-weight: 600; font-size: .95rem; text-decoration: none; }
.more .i { transition: transform .25s var(--ease); }
.more:hover .i { transform: translateX(4px); }
@media (prefers-reduced-motion: no-preference) {
.js [data-reveal] { opacity: 0; transform: translateY(22px); transition: opacity .8s var(--ease-out), transform .8s var(--ease-out); transition-delay: var(--d, 0s); }
.js [data-reveal].is-in { opacity: 1; transform: none; }
}
body::before { content: ''; position: fixed; inset: -50%; z-index: 9999; pointer-events: none; opacity: .045; mix-blend-mode: multiply;
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='220' height='220'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
:root[data-theme="dark"] body::before { mix-blend-mode: screen; opacity: .035; }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] body::before { mix-blend-mode: screen; opacity: .035; } }
.intro { position: fixed; inset: 0; z-index: 500; display: grid; place-items: center; background: #14100c; color: #f3c98b; pointer-events: none; }
.intro__in { display: grid; justify-items: center; gap: 18px; }
.intro svg { width: 92px; height: 92px; }
.intro svg * { stroke-dasharray: 1; stroke-dashoffset: 1; animation: introDraw 1.1s var(--ease-out) forwards; }
.intro svg rect:nth-child(2) { animation-delay: .18s; } .intro svg circle { animation-delay: .36s; }
.intro__t { font: 500 clamp(1.6rem, 4vw, 2.4rem)/1 var(--serif); color: #fff; overflow: hidden; }
.intro__t span { display: inline-block; transform: translateY(110%); animation: rise .9s var(--ease-out) .45s forwards; }
.intro__t em { color: #f3c98b; }
.intro.is-out { animation: curtain .9s cubic-bezier(.77, 0, .18, 1) forwards; }
@keyframes introDraw { to { stroke-dashoffset: 0; } }
@keyframes rise { to { transform: none; } }
@keyframes curtain { to { clip-path: inset(0 0 100% 0); } }
.intro { clip-path: inset(0 0 0 0); }
.sw { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .08em; margin-bottom: -.08em; }
.sw > * { display: inline-block; transform: translateY(105%); transition: transform 1.05s var(--ease-out); transition-delay: calc(var(--k) * 55ms + var(--d0, 0ms)); }
[data-split].is-in .sw > * { transform: none; }
.js [data-mask] { clip-path: inset(12% 6% 12% 6% round var(--r)); transition: clip-path 1.3s var(--ease-out); }
.js [data-mask] img { transform: scale(1.18); transition: transform 1.6s var(--ease-out); }
.js [data-mask].is-in { clip-path: inset(0 0 0 0 round var(--r)); }
.js [data-mask].is-in img { transform: none; }
.marquee { --gap: 3rem; display: flex; gap: var(--gap); overflow: hidden; user-select: none; mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee__g { flex: none; display: flex; gap: var(--gap); min-width: 100%; justify-content: space-around; animation: marq var(--dur, 40s) linear infinite; }
.marquee:hover .marquee__g { animation-play-state: paused; }
.marquee--rev .marquee__g { animation-direction: reverse; }
@keyframes marq { to { transform: translateX(calc(-100% - var(--gap))); } }
.marquee__it { display: inline-flex; align-items: center; gap: .6em; white-space: nowrap; text-decoration: none; }
.marquee__it .star { width: .55em; height: .55em; color: var(--accent); flex: none; }
[data-tilt] { transform: perspective(900px) rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)) translateZ(0); transition: transform .5s var(--ease-out); transform-style: preserve-3d; will-change: transform; }
[data-tilt].is-tilting { transition: transform .12s linear; }
[data-tilt] .glare { position: absolute; inset: 0; z-index: 3; pointer-events: none; border-radius: inherit; opacity: 0; transition: opacity .4s;
background: radial-gradient(circle at var(--gx, 50%) var(--gy, 50%), rgb(255 255 255 / .28), transparent 55%); }
[data-tilt].is-tilting .glare { opacity: 1; }
[data-magnetic] { transition: transform .4s var(--ease-out); }
[data-words] .wd { opacity: .16; transition: opacity .25s linear, color .25s; }
[data-words] .wd.on { opacity: 1; }
[data-words] .wd.acc.on { color: var(--accent); }
.no-js [data-words] .wd, .no-motion [data-words] .wd { opacity: 1; }
.hs { position: relative; }
.hs__sticky { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; justify-content: center; overflow: hidden; }
.hs__track { display: flex; gap: clamp(16px, 2vw, 28px); padding-inline: var(--gut); will-change: transform; }
.hs__track > * { flex: 0 0 clamp(280px, 30vw, 440px); }
.hs__head { padding-inline: var(--gut); margin: 0 auto 28px; width: 100%; max-width: var(--wrap); }
.hs__bar { height: 2px; background: var(--line); margin: 26px var(--gut) 0; position: relative; overflow: hidden; border-radius: 2px; }
.hs__bar i { position: absolute; inset: 0; background: var(--accent); transform-origin: 0 50%; transform: scaleX(var(--p, 0)); }
@media (max-width: 900px), (prefers-reduced-motion: reduce) {
.hs { height: auto !important; }
.hs__sticky { position: static; height: auto; padding-block: 56px; }
.hs__track { overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; transform: none !important; }
.hs__track::-webkit-scrollbar { display: none; }
.hs__track > * { scroll-snap-align: start; flex-basis: 78%; }
.hs__bar { display: none; }
}
[data-glow] { --mx: 50%; --my: 40%; }
[data-glow]::before { content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
background: radial-gradient(600px circle at var(--mx) var(--my), rgb(243 201 139 / .16), transparent 60%); transition: background .2s; }
.orn { display: flex; align-items: center; gap: 14px; color: var(--accent); margin: 0 0 18px; }
.orn::before, .orn::after { content: ''; height: 1px; flex: 1; background: linear-gradient(90deg, transparent, currentColor); opacity: .5; }
.orn::after { background: linear-gradient(90deg, currentColor, transparent); }
.orn svg { width: 22px; height: 22px; }
@media (prefers-reduced-motion: reduce) {
.sw > * { transform: none !important; transition: none; }
.js [data-mask] { clip-path: none; } .js [data-mask] img { transform: none; }
.marquee__g { animation: none; }
[data-tilt] { transform: none !important; }
[data-words] .wd { opacity: 1; }
.intro { display: none; }
}
.seen .intro { display: none; }
.rot { display: inline-block; transition: transform .38s var(--ease), opacity .38s; }
.rot--out { transform: translateY(-60%); opacity: 0; }
.rot--in { transform: translateY(60%); opacity: 0; transition: none; }
.js .uzmap .uzmap__r path { stroke-dasharray: 1; stroke-dashoffset: 0; }
.js .uzmap:not(.is-drawn) .uzmap__r path { stroke-dashoffset: 1; fill-opacity: 0; stroke: var(--accent); stroke-width: 2; }
.js .uzmap.is-drawn:not(.is-done) .uzmap__r path { stroke: var(--accent); stroke-width: 1.4; }
.js .uzmap .uzmap__r path { transition: stroke .8s, stroke-dashoffset 1.8s var(--ease-out) calc(var(--i, 0) * 70ms), fill-opacity .9s var(--ease) calc(.6s + var(--i, 0) * 70ms), fill .3s, transform .45s var(--ease-out), filter .3s; }
.js .uzmap:not(.is-drawn) .uzmap__l, .js .uzmap:not(.is-drawn) .uzmap__cap { opacity: 0; }
.uzmap__l, .uzmap__cap { transition: opacity .8s 1.4s; }
.uzmap__cap { animation: pulse 2.4s ease-out infinite; transform-box: fill-box; transform-origin: center; }
@keyframes pulse { 0% { stroke-width: 2.5; } 50% { stroke-width: 9; stroke-opacity: .35; } 100% { stroke-width: 2.5; } }
@media (prefers-reduced-motion: reduce) { .js .uzmap:not(.is-drawn) .uzmap__r path { stroke-dashoffset: 0; fill-opacity: 1; } .uzmap__cap { animation: none; } }
.notice { position: relative; z-index: 60; display: flex; align-items: center; justify-content: center; gap: .5em; padding: .55em var(--gut); background: var(--gold); color: #1c1a17; font-size: .84rem; font-weight: 500; text-align: center; }
.notice .i { flex: none; }
.hdr { position: sticky; top: 0; z-index: 50; height: var(--hdr); background: color-mix(in oklab, var(--paper) 86%, transparent);
backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); border-bottom: 1px solid color-mix(in oklab, var(--line) 70%, transparent);
transition: background .35s, border-color .35s, color .35s, transform .35s var(--ease); view-transition-name: header; }
.hdr__in { height: 100%; display: flex; align-items: center; gap: 24px; }
.hdr--over { position: fixed; inset: 0 0 auto 0; background: transparent; border-color: transparent; color: #fff; backdrop-filter: none; -webkit-backdrop-filter: none; }
.hdr--over.is-solid { background: color-mix(in oklab, var(--paper) 88%, transparent); color: var(--ink); border-color: color-mix(in oklab, var(--line) 70%, transparent);
backdrop-filter: saturate(1.4) blur(14px); -webkit-backdrop-filter: saturate(1.4) blur(14px); }
.hdr--over:not(.is-solid) a:hover { color: #fff; opacity: .8; }
.logo { display: inline-flex; align-items: center; gap: .55em; text-decoration: none; color: inherit; flex: none; }
.logo:hover { color: inherit; }
.logo__m { width: 30px; height: 30px; color: var(--accent); transition: transform .8s var(--ease-out); }
.hdr--over:not(.is-solid) .logo__m { color: #fff; }
.logo:hover .logo__m { transform: rotate(45deg); }
.logo__t { font: 600 1.18rem/1 var(--serif); letter-spacing: -.01em; white-space: nowrap; }
.logo__t em { font-style: italic; font-weight: 500; }
.logo--lg .logo__m { width: 40px; height: 40px; } .logo--lg .logo__t { font-size: 1.55rem; }
.hdr__nav { display: flex; gap: 2px; margin-inline: auto; }
.hdr__nav a { padding: .5em .8em; border-radius: 999px; font-size: .9rem; font-weight: 500; text-decoration: none; white-space: nowrap; transition: background .2s; }
.hdr__nav a:hover { background: color-mix(in oklab, currentColor 9%, transparent); color: inherit; }
.hdr__nav a[aria-current] { background: color-mix(in oklab, currentColor 10%, transparent); }
.hdr__tools { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.hdr__nav + .hdr__tools { margin-left: 0; }
.lang { display: inline-flex; gap: 2px; padding: 3px; border-radius: 999px; border: 1px solid color-mix(in oklab, currentColor 18%, transparent); }
.lang a { font: 600 .72rem/1 var(--sans); letter-spacing: .06em; padding: .55em .6em; border-radius: 999px; text-decoration: none; opacity: .7; }
.lang a[aria-current] { background: currentColor; opacity: 1; }
.lang a[aria-current] { color: var(--paper); background: var(--ink); }
.hdr--over:not(.is-solid) .lang a[aria-current] { color: #111; background: #fff; }
.hdr__burger { display: inline-grid; }
@media (max-width: 1240px) { .hdr__nav { display: none; } .hdr__tools { margin-left: auto !important; } }
.hdr__ldd { display: none; position: relative; }
.hdr__lddb { width: auto; min-width: 42px; padding: 0 .55em; font: 700 .74rem/1 var(--sans); letter-spacing: .06em; list-style: none; cursor: pointer; border-color: color-mix(in oklab, currentColor 22%, transparent); }
.hdr__lddb::-webkit-details-marker { display: none; }
.hdr__lddb::after { content: ''; width: 6px; height: 6px; margin-left: .45em; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .2s; }
.hdr__ldd { display: none; }
.hdr__ldd[open] .hdr__lddb::after { transform: translateY(1px) rotate(-135deg); }
.hdr__lddb { display: inline-flex; align-items: center; }
.hdr__lddp { position: absolute; right: 0; top: calc(100% + 8px); z-index: 60; min-width: 172px; padding: 6px; border-radius: 14px; background: var(--card); color: var(--ink); border: 1px solid var(--line); box-shadow: 0 18px 40px -16px rgb(0 0 0 / .35); }
.hdr__lddp a { display: flex; align-items: center; gap: .7em; padding: .7em .8em; border-radius: 10px; text-decoration: none; font-size: .95rem; color: var(--ink); }
.hdr__lddp a b { font: 700 .72rem/1 var(--sans); letter-spacing: .06em; min-width: 2.2em; color: var(--muted); }
.hdr__lddp a:hover { background: var(--paper-2); }
.hdr__lddp a[aria-current] { background: var(--paper-2); font-weight: 600; }
.hdr__lddp a[aria-current] b { color: var(--accent); }
.menu__acts { display: flex; align-items: center; gap: 4px; }
@media (max-width: 560px) { .hdr__theme { display: none; } .hdr__lang { display: none; } .hdr__ldd { display: block; } .logo__t { font-size: 1.05rem; } .hdr__in { gap: 8px; } }
@media (max-width: 380px) { .logo__t { font-size: .95rem; } .hdr__tools .ibtn { width: 38px; height: 38px; } .hdr__lddb { min-width: 38px; padding: 0 .45em; } }
.menu { position: fixed; inset: 0; z-index: 100; background: var(--paper); overflow-y: auto; overscroll-behavior: contain; }
.menu__in { min-height: 100%; display: flex; flex-direction: column; padding-bottom: 32px; }
.menu__top { height: var(--hdr); display: flex; align-items: center; justify-content: space-between; }
.menu__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 28px 40px; padding-block: 24px 32px; flex: 1; }
.menu__g ul { list-style: none; margin: 0; padding: 0; }
.menu__g li a { display: flex; align-items: center; gap: .7em; padding: .45em 0; font: 500 clamp(1.25rem, 2.4vw, 1.6rem)/1.2 var(--serif); text-decoration: none; }
.menu__g li a .i { color: var(--accent); width: 22px; height: 22px; }
.menu__regions { grid-column: span 2; }
.menu__regions ul { columns: 2; column-gap: 32px; }
.menu__regions li a { font: 500 1.02rem/1.3 var(--sans); padding: .35em 0; }
@media (max-width: 720px) { .menu__regions { grid-column: auto; } }
.menu__foot { border-top: 1px solid var(--line); padding-top: 18px; }
@media (prefers-reduced-motion: no-preference) {
.menu[data-open] .menu__g { animation: menuIn .6s var(--ease-out) both; }
.menu[data-open] .menu__g:nth-child(2) { animation-delay: .05s; } .menu[data-open] .menu__g:nth-child(3) { animation-delay: .1s; } .menu[data-open] .menu__g:nth-child(4) { animation-delay: .15s; }
.menu[data-open] { animation: fadeIn .3s var(--ease) both; }
}
@keyframes menuIn { from { opacity: 0; transform: translateY(18px); } }
@keyframes fadeIn { from { opacity: 0; } }
html.menu-open { overflow: hidden; }
.sdlg { width: min(720px, calc(100vw - 24px)); max-height: min(78vh, 720px); margin: 10vh auto auto; padding: 0; border: 1px solid var(--line); border-radius: 18px; background: var(--card); color: var(--ink); box-shadow: var(--shadow-lg); }
.sdlg::backdrop { background: rgb(20 16 12 / .45); backdrop-filter: blur(4px); }
.sdlg__f { display: flex; align-items: center; gap: 10px; padding: 10px 10px 10px 18px; border-bottom: 1px solid var(--line); }
.sdlg__f > .i { color: var(--muted); }
.sdlg__f input { flex: 1; border: 0; background: transparent; font-size: 1.15rem; padding: .6em 0; outline: none; }
.sdlg__res { padding: 8px; overflow-y: auto; max-height: calc(min(78vh, 720px) - 70px); }
.sres { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: 10px; text-decoration: none; }
.sres:hover, .sres[aria-selected="true"] { background: var(--paper-2); color: inherit; }
.sres__i { width: 36px; height: 36px; border-radius: 9px; display: grid; place-items: center; background: var(--paper-2); color: var(--accent); flex: none; }
.sres__t { font-weight: 600; } .sres__s { font-size: .85rem; color: var(--muted); }
.ftr { --ftr-fg: #f6f1e8; margin-top: clamp(64px, 10vw, 140px); background: #1c1a17; color: var(--ftr-fg); padding-block: 64px 28px; }   
.ftr a { text-decoration: none; }
.ftr a:hover { color: var(--gold); }
.ftr .logo__m { color: var(--gold); }
.ftr__top { display: grid; grid-template-columns: 1.6fr repeat(3, 1fr); gap: 40px; padding-bottom: 40px; border-bottom: 1px solid rgb(255 255 255 / .12); }
.ftr__brand p { color: rgb(255 255 255 / .62); max-width: 42ch; margin-top: 18px; font-size: .95rem; }
.ftr__col { display: flex; flex-direction: column; gap: .55em; font-size: .95rem; }
.ftr .kicker { color: var(--gold); }
.ftr__regions { display: flex; flex-wrap: wrap; gap: 8px 22px; padding-block: 28px; border-bottom: 1px solid rgb(255 255 255 / .12); font: 500 1.05rem/1.4 var(--serif); }
.ftr__bot { display: flex; flex-wrap: wrap; gap: 14px 28px; align-items: center; justify-content: space-between; padding-top: 22px; font-size: .82rem; color: rgb(255 255 255 / .55); }
.ftr__bot p { margin: 0; }
.ftr__links { display: flex; gap: 18px; }
.ftr .lang a[aria-current] { background: var(--ftr-fg); color: #1c1a17; }
:root[data-theme="dark"] .ftr { background: #0c0b0a; }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .ftr { background: #0c0b0a; } }
@media (max-width: 900px) { .ftr__top { grid-template-columns: 1fr 1fr; } .ftr__brand { grid-column: 1 / -1; } }
.phead { padding-block: clamp(28px, 5vw, 64px) clamp(24px, 4vw, 48px); }
.phead__t { max-width: 18ch; margin-bottom: .35em; }
.phead .lead { margin-bottom: 0; }
.phead__meta { display: flex; flex-wrap: wrap; gap: 10px 22px; margin-top: 22px; color: var(--ink-2); font-size: .95rem; }
.mi { display: inline-flex; align-items: center; gap: .45em; }
.mi .i { color: var(--accent); }
.phead--img { position: relative; min-height: min(78vh, 760px); display: flex; flex-direction: column; justify-content: flex-end; color: #fff; padding: 0; margin-top: 0; overflow: hidden; isolation: isolate; }
.phead--img .phead__media { position: absolute; inset: 0; z-index: -1; }
.phead--img .phead__media .pic, .phead--img .phead__media img { width: 100%; height: 100%; object-fit: cover; }
.phead--img::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(10 8 6 / .55) 0%, rgb(10 8 6 / .18) 45%, rgb(10 8 6 / 0) 70%), linear-gradient(180deg, rgb(10 8 6 / .45) 0%, rgb(10 8 6 / 0) 28%, rgb(10 8 6 / .08) 50%, rgb(10 8 6 / .8) 100%); }
.phead--img .phead__in { padding-block: calc(var(--hdr) + 40px) clamp(36px, 6vw, 72px); }
.phead--img .kicker { color: #f3c98b; }
.phead--img .lead, .phead--img .phead__meta { color: rgb(255 255 255 / .9); }
.phead--img .mi .i { color: #f3c98b; }
.phead--img .crumbs, .phead--img .crumbs a { color: rgb(255 255 255 / .8); }
.phead--img .phead__t { text-shadow: 0 2px 30px rgb(0 0 0 / .25); max-width: 20ch; }
.phead__credit { position: absolute; right: 0; bottom: 10px; text-align: right; font-size: .72rem; color: rgb(255 255 255 / .7); }
.phead__credit a { color: inherit; }
@media (prefers-reduced-motion: no-preference) {
@supports (animation-timeline: view()) {
[data-parallax] { animation: parallax linear both; animation-timeline: view(); animation-range: exit 0% exit 100%; }
@keyframes parallax { to { transform: translateY(18%) scale(1.06); } }
}
}
.crumbs ol { list-style: none; display: flex; flex-wrap: wrap; gap: .3em .5em; margin: 0 0 18px; padding: 0; font-size: .84rem; color: var(--muted); }
.crumbs li + li::before { content: '/'; margin-right: .5em; opacity: .5; }
.crumbs a { text-decoration: none; }
.sec { padding-block: clamp(40px, 7vw, 96px); }
.sec--tight { padding-block: clamp(28px, 4vw, 56px); }
.sec--alt { background: var(--paper-2); }
.sec__h { display: grid; grid-template-columns: 1fr auto; align-items: end; gap: 6px 24px; margin-bottom: clamp(22px, 3.5vw, 40px); }
.sec__h > * { grid-column: 1; }
.sec__h .more { grid-column: 2; grid-row: 1 / span 3; align-self: end; }
.sec__t { margin: 0; }
.sec__lead { color: var(--ink-2); margin: .5em 0 0; max-width: 60ch; }
@media (max-width: 640px) { .sec__h { grid-template-columns: 1fr; } .sec__h .more { grid-column: 1; grid-row: auto; margin-top: 8px; } }
.grid { display: grid; gap: clamp(16px, 2.2vw, 28px); }
.grid--2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 420px), 1fr)); }
.grid--3 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.grid--4 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
.grid--5 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 180px), 1fr)); }
.article { display: grid; grid-template-columns: minmax(0, 1fr) 340px; gap: clamp(28px, 5vw, 72px); align-items: start; }
.article__side { position: sticky; top: calc(var(--hdr) + 20px); display: flex; flex-direction: column; gap: 20px; }
@media (max-width: 980px) { .article { grid-template-columns: 1fr; } .article__side { position: static; } }
.progress { position: fixed; inset: 0 0 auto 0; height: 3px; z-index: 60; background: var(--accent); transform-origin: 0 50%; transform: scaleX(0); }
@supports (animation-timeline: scroll()) {
.progress { animation: grow linear both; animation-timeline: scroll(root); }
@keyframes grow { to { transform: scaleX(1); } }
}
@supports not (animation-timeline: scroll()) { .progress { display: none; } }
.err { padding-block: 12vh; text-align: left; }
.err__code { font: italic 500 clamp(5rem, 16vw, 11rem)/1 var(--serif); color: var(--accent); margin: 0; }
.pic { position: relative; display: block; overflow: hidden; background: var(--paper-3); }
.pic img { width: 100%; height: 100%; object-fit: cover; }
.ph { --h: 30; display: grid; place-items: center; color: hsl(var(--h) 45% 38% / .55);
background-color: hsl(var(--h) 38% 86%);
background-image:
radial-gradient(circle at 50% 50%, transparent 0 9px, hsl(var(--h) 40% 74% / .5) 9.5px 10.5px, transparent 11px),
conic-gradient(from 45deg at 50% 50%, hsl(var(--h) 42% 80%) 0 25%, transparent 0 50%, hsl(var(--h) 42% 80%) 0 75%, transparent 0),
linear-gradient(135deg, hsl(var(--h) 45% 88%), hsl(calc(var(--h) + 25) 40% 78%));
background-size: 44px 44px, 44px 44px, 100% 100%; }
:root[data-theme="dark"] .ph { background-color: hsl(var(--h) 22% 18%); color: hsl(var(--h) 40% 60% / .55);
background-image: radial-gradient(circle at 50% 50%, transparent 0 9px, hsl(var(--h) 25% 28% / .6) 9.5px 10.5px, transparent 11px),
conic-gradient(from 45deg at 50% 50%, hsl(var(--h) 22% 22%) 0 25%, transparent 0 50%, hsl(var(--h) 22% 22%) 0 75%, transparent 0),
linear-gradient(135deg, hsl(var(--h) 25% 16%), hsl(calc(var(--h) + 25) 22% 22%)); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .ph { background-color: hsl(var(--h) 22% 18%); color: hsl(var(--h) 40% 60% / .55);
background-image: radial-gradient(circle at 50% 50%, transparent 0 9px, hsl(var(--h) 25% 28% / .6) 9.5px 10.5px, transparent 11px),
conic-gradient(from 45deg at 50% 50%, hsl(var(--h) 22% 22%) 0 25%, transparent 0 50%, hsl(var(--h) 22% 22%) 0 75%, transparent 0),
linear-gradient(135deg, hsl(var(--h) 25% 16%), hsl(calc(var(--h) + 25) 22% 22%)); } }
.ph__i { width: 34%; height: 34%; max-width: 72px; max-height: 72px; stroke-width: 1.2; }
.credit { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .3em; font-size: .74rem; color: var(--muted); }
.credit .i { width: 13px; height: 13px; }
.credit a { color: inherit; }
.card { position: relative; }
.card__a { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.card__a:hover { color: inherit; }
.card__media { position: relative; border-radius: var(--r); overflow: hidden; aspect-ratio: 4 / 3; box-shadow: var(--shadow); isolation: isolate; }
.card__media .pic { position: absolute; inset: 0; transition: transform 1.1s var(--ease-out); }
.card__a:hover .card__media .pic { transform: scale(1.06); }
.card__b { padding: 14px 2px 4px; }
.card__k { font-size: .76rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 0 0 .45em; }
.card__t { font-size: clamp(1.18rem, 1.6vw, 1.38rem); margin: 0 0 .35em; transition: color .2s; }
.card__a:hover .card__t { color: var(--accent); }
.card__s { font-size: .95rem; color: var(--ink-2); margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.card--big .card__media { aspect-ratio: 16 / 11; }
.card--tall .card__media { aspect-ratio: 3 / 4; }
.badge { position: absolute; z-index: 2; top: 12px; left: 12px; display: inline-flex; align-items: center; gap: .35em; padding: .38em .7em; border-radius: 999px;
background: rgb(255 253 249 / .92); color: #1c1a17; font: 600 .72rem/1 var(--sans); letter-spacing: .02em; backdrop-filter: blur(6px); }
.badge .i { width: 13px; height: 13px; color: var(--accent); }
.badge--unesco { left: auto; right: 12px; background: #1d4f91; color: #fff; letter-spacing: .08em; }
.rcard { --h: 30; position: relative; border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); isolation: isolate; }
.rcard a { display: block; color: #fff; text-decoration: none; aspect-ratio: 4 / 5; position: relative; }
.rcard .pic { position: absolute; inset: 0; transition: transform 1.2s var(--ease-out); }
.rcard a:hover .pic { transform: scale(1.07); }
.rcard a::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 35%, hsl(var(--h) 40% 12% / .82)); z-index: 1; }
.rcard__b { position: absolute; inset: auto 0 0 0; padding: 20px; z-index: 2; }
.rcard__b .kicker { color: #f3c98b; margin-bottom: .5em; }
.rcard h3 { font-size: clamp(1.35rem, 2.2vw, 1.75rem); margin: 0 0 .2em; color: #fff; }
.rcard__n { font-size: .85rem; opacity: .85; margin: 0; }
.dcard a { display: flex; gap: 14px; align-items: center; text-decoration: none; padding: 10px; border-radius: var(--r); border: 1px solid var(--line); background: var(--card); transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.dcard a:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.dcard__m { width: 72px; height: 72px; border-radius: 10px; overflow: hidden; flex: none; }
.dcard__m .pic { width: 100%; height: 100%; }
.dcard h3 { font-size: 1.08rem; margin: 0 0 .2em; }
.dcard p { font-size: .84rem; color: var(--muted); margin: 0; }
.rail { position: relative; }
.rail__track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(270px, 26%); gap: clamp(16px, 2vw, 24px); overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none;
padding-inline: var(--gut); margin-inline: calc(var(--gut) * -1); scroll-padding-inline: var(--gut); padding-bottom: 6px; overscroll-behavior-x: contain; }
.rail__track::-webkit-scrollbar { display: none; }
.rail__track > * { scroll-snap-align: start; }
.rail__nav { display: flex; gap: 8px; justify-content: flex-end; margin-top: 14px; }
.rail__nav .ibtn { border-color: var(--line); }
.rail__nav .ibtn:disabled { opacity: .35; cursor: default; }
@media (max-width: 700px) { .rail__track { grid-auto-columns: 80%; } .rail__nav { display: none; } }
.rail .card[data-reveal], .rail .rcard[data-reveal] { opacity: 1; transform: none; }
.prose { font-size: 1.08rem; line-height: 1.75; max-width: 70ch; }
.prose h2 { font-size: clamp(1.45rem, 2.4vw, 1.9rem); margin: 1.6em 0 .6em; }
.prose h2:first-child { margin-top: 0; }
.prose p { margin: 0 0 1.1em; }
.prose--drop > p:first-of-type::first-letter { float: left; font: 500 4.1em/.82 var(--serif); margin: .07em .1em 0 0; color: var(--accent); }
.facts { border: 1px solid var(--line); border-radius: var(--r); padding: 20px 22px; background: var(--card); }
.facts dl { margin: 0; display: grid; gap: 0; }
.facts dl > div { display: grid; grid-template-columns: 42% 1fr; gap: 12px; padding: .62em 0; border-top: 1px dashed var(--line); font-size: .93rem; }
.facts dl > div:first-child { border-top: 0; }
.facts dt { color: var(--muted); }
.facts dd { margin: 0; font-weight: 500; }
.tips { border-radius: var(--r); padding: 20px 22px; background: color-mix(in oklab, var(--accent-2) 10%, var(--card)); border: 1px solid color-mix(in oklab, var(--accent-2) 25%, transparent); }
.tips .kicker { color: var(--accent-2); }
.tips ul { margin: 0; padding-left: 1.1em; display: grid; gap: .55em; font-size: .95rem; }
.srcs { font-size: .88rem; color: var(--muted); margin-top: 24px; }
.srcs summary { cursor: pointer; font-weight: 600; }
.srcs ol { columns: 2; column-gap: 28px; padding-left: 1.2em; }
@media (max-width: 640px) { .srcs ol { columns: 1; } }
.contacts { list-style: none; margin: 0; padding: 0; display: grid; gap: .7em; font-size: .95rem; }
.contacts li { display: flex; gap: .7em; align-items: flex-start; }
.contacts .i { color: var(--accent); margin-top: .2em; }
.contacts a { word-break: break-word; }
.box { border: 1px solid var(--line); border-radius: var(--r); padding: 20px 22px; background: var(--card); }
.gal { margin-top: clamp(36px, 6vw, 72px); }
.gal__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-top: 20px; }
.gal__it { margin: 0; }
.gal__it a { display: block; border-radius: var(--r-sm); overflow: hidden; aspect-ratio: 4 / 3; }
.gal__it--wide { grid-column: span 2; } .gal__it--wide a { aspect-ratio: auto; height: 100%; min-height: 220px; }
.gal__it .pic { width: 100%; height: 100%; transition: transform .8s var(--ease-out); }
.gal__it a:hover .pic { transform: scale(1.05); }
.gal__it figcaption { margin-top: 6px; }
@media (max-width: 700px) { .gal__grid { grid-template-columns: 1fr 1fr; } .gal__it--wide { grid-column: 1 / -1; } }
.lbox { position: fixed; inset: 0; z-index: 200; background: rgb(8 7 6 / .94); display: grid; place-items: center; padding: 4vh 4vw; }
.lbox img { max-width: 100%; max-height: 88vh; object-fit: contain; border-radius: 6px; animation: fadeIn .3s; }
.lbox .ibtn { position: absolute; color: #fff; background: rgb(255 255 255 / .1); }
.lbox [data-lb-close] { top: 16px; right: 16px; } .lbox [data-lb-prev] { left: 16px; top: 50%; } .lbox [data-lb-next] { right: 16px; top: 50%; }
.filters { display: flex; flex-wrap: wrap; gap: 14px 24px; align-items: flex-end; padding: 18px 0 24px; border-bottom: 1px solid var(--line); margin-bottom: 28px; }
.chips { border: 0; margin: 0; padding: 0; min-width: 0; }
.chips legend { padding: 0; }
.chips__row { display: flex; flex-wrap: wrap; gap: 8px; }
.chip { position: relative; }
.chip input { position: absolute; inset: 0; opacity: 0; pointer-events: none; }
.chip span { display: inline-flex; align-items: center; gap: .4em; padding: .5em .95em; border-radius: 999px; border: 1px solid var(--line); background: var(--card); font-size: .88rem; font-weight: 500; cursor: pointer; transition: all .2s; white-space: nowrap; }
.chip span small { color: var(--muted); font-weight: 500; }
.chip span:hover { border-color: var(--ink); }
.chip input:checked + span { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.chip input:checked + span small { color: inherit; opacity: .7; }
.chip input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.sel { display: grid; gap: 6px; }
.sel .kicker { margin: 0; }
.sel select { appearance: none; padding: .6em 2.4em .6em 1em; border-radius: 999px; border: 1px solid var(--line); background: var(--card) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23776f65' stroke-width='1.6'/%3E%3C/svg%3E") no-repeat right 1em center; font-size: .9rem; min-width: 200px; max-width: 100%; }
.count { color: var(--muted); font-size: .9rem; margin-bottom: 18px; }
.empty { text-align: center; padding: 64px 16px; color: var(--muted); }
.empty .i { width: 48px; height: 48px; margin: 0 auto 12px; color: var(--accent); stroke-width: 1.3; }
.pager { display: flex; gap: 6px; justify-content: center; align-items: center; margin-top: 40px; }
.pager a, .pager span { min-width: 42px; height: 42px; display: inline-grid; place-items: center; border-radius: 999px; text-decoration: none; font-weight: 500; }
.pager a:hover { background: var(--paper-2); }
.pager [aria-current] { background: var(--ink); color: var(--paper); }
.mmap { margin: 0; }
.mmap__box { position: relative; height: 280px; border-radius: var(--r); overflow: hidden; background: var(--paper-3); display: grid; place-items: center; border: 1px solid var(--line); }
.mmap__ph .i { width: 40px; height: 40px; color: var(--accent); }
.mmap figcaption { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.maplibregl-ctrl-attrib { font-size: 10px; }
.tbl { width: 100%; border-collapse: collapse; font-size: .95rem; }
.tbl th { text-align: left; font: 600 .72rem/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); padding: 10px 12px; border-bottom: 1px solid var(--line); }
.tbl td { padding: 12px; border-bottom: 1px solid var(--line); vertical-align: middle; }
.tbl tr:hover td { background: color-mix(in oklab, var(--paper-2) 60%, transparent); }
.tbl-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); }
.pill { display: inline-flex; align-items: center; gap: .35em; padding: .3em .7em; border-radius: 999px; font: 600 .75rem/1 var(--sans); background: var(--paper-2); white-space: nowrap; }
.pill--ok { background: color-mix(in oklab, var(--ok) 16%, transparent); color: var(--ok); }
.pill--warn { background: color-mix(in oklab, var(--warn) 18%, transparent); color: var(--warn); }
.pill--bad { background: color-mix(in oklab, var(--bad) 15%, transparent); color: var(--bad); }
.pill--info { background: color-mix(in oklab, var(--accent-2) 16%, transparent); color: var(--accent-2); }
.tabs { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin-bottom: 24px; }
.tabs a, .tabs button { padding: .8em 1.1em; border: 0; background: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-weight: 600; font-size: .92rem; text-decoration: none; color: var(--muted); }
.tabs a:hover, .tabs button:hover { color: var(--ink); }
.tabs [aria-current], .tabs [aria-selected="true"] { color: var(--ink); border-bottom-color: var(--accent); }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 24px; }
.stat__n { font: 500 clamp(2.2rem, 4.6vw, 3.6rem)/1 var(--serif); color: var(--accent); }
.stat__l { color: var(--ink-2); font-size: .92rem; margin-top: 8px; }
a.xl {
color: inherit;
text-decoration-line: underline;
text-decoration-thickness: 1px;
text-decoration-color: color-mix(in oklab, var(--accent) 42%, transparent);
text-underline-offset: .22em;
text-decoration-skip-ink: auto;
transition: color .2s var(--ease), text-decoration-color .2s var(--ease);
}
a.xl:hover,
a.xl:focus-visible {
color: var(--accent);
text-decoration-color: currentColor;
}
a.xl { -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.cx-dark a.xl { text-decoration-color: color-mix(in oklab, var(--gold) 50%, transparent); }
.cx-dark a.xl:hover,
.cx-dark a.xl:focus-visible { color: var(--gold); }
.facts dd a.xl,
.tips a.xl { text-decoration-color: color-mix(in oklab, var(--accent) 55%, transparent); }
.tips a.xl:hover { color: var(--accent-2); }
.prose--drop > p:first-of-type > a.xl:first-child::first-letter { color: var(--accent); text-decoration: none; }
@media (prefers-reduced-motion: reduce) { a.xl { transition: none; } }
@media print { a.xl { text-decoration: none; color: inherit; } }
.hero { position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: flex-end; color: #fff; overflow: hidden; isolation: isolate; background: #1b1712; }
.hero__media { position: absolute; inset: 0; z-index: -2; }
.hero__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.6s var(--ease); }
.hero__slide.is-on { opacity: 1; }
.hero__slide .pic, .hero__slide img { width: 100%; height: 100%; object-fit: cover; }
.hero__slide img { transform: scale(1.02); transform-origin: 60% 40%; transition: transform 9s linear; }
.hero__slide.is-on img { transform: scale(1.13) translate(-1.2%, -.8%); }
.hero__art { position: absolute; inset: 0;
background:
radial-gradient(ellipse at 70% 20%, rgb(226 128 95 / .55), transparent 55%),
radial-gradient(ellipse at 15% 80%, rgb(19 105 109 / .7), transparent 55%),
conic-gradient(from 45deg at 50% 50%, rgb(255 255 255 / .05) 0 25%, transparent 0 50%, rgb(255 255 255 / .05) 0 75%, transparent 0) 0 0 / 64px 64px,
linear-gradient(160deg, #3a2418, #14100c 60%, #0d2a2b); }
.hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgb(8 6 4 / .6) 0%, rgb(8 6 4 / .2) 50%, rgb(8 6 4 / 0) 75%), linear-gradient(180deg, rgb(8 6 4 / .5) 0%, rgb(8 6 4 / 0) 30%, rgb(8 6 4 / .15) 55%, rgb(8 6 4 / .85) 100%); }
.hero__in { padding-block: calc(var(--hdr) + 60px) clamp(56px, 9vh, 110px); }
.hero__k { color: #f3c98b; }
.hero__t { font-size: clamp(3.2rem, 11vw, 9.5rem); line-height: .92; letter-spacing: -.03em; max-width: 11ch; margin-bottom: .25em; font-weight: 500; }
.hero__t em { font-style: italic; color: #f3c98b; font-weight: 400; }
.hero__lead { font-size: clamp(1.05rem, 1.7vw, 1.3rem); max-width: 54ch; color: rgb(255 255 255 / .88); }
.hero__search { display: flex; align-items: center; gap: 10px; max-width: 640px; margin-top: 28px; padding: 6px 6px 6px 18px; border-radius: 999px; background: rgb(255 253 249 / .96); color: #1c1a17; box-shadow: var(--shadow-lg); }
.hero__search > .i { color: #776f65; }
.hero__search input { flex: 1; border: 0; background: transparent; outline: none; font-size: 1.05rem; padding: .7em 0; min-width: 0; color: #1c1a17; }
.hero__search--page { background: var(--card); color: var(--ink); border: 1px solid var(--line); box-shadow: var(--shadow); margin: 0 0 28px; }
.hero__search--page input { color: var(--ink); }
.hero__quick { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.hero__quick a { display: inline-flex; align-items: center; gap: .45em; padding: .55em 1em; border-radius: 999px; background: rgb(255 255 255 / .12); border: 1px solid rgb(255 255 255 / .22);
backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); font-size: .9rem; font-weight: 500; text-decoration: none; transition: background .2s; }
.hero__quick a:hover { background: rgb(255 255 255 / .24); color: #fff; }
.hero__caps { position: absolute; right: 0; bottom: 22px; display: grid; justify-items: end; pointer-events: none; }
.hero__cap { grid-area: 1 / 1; font-size: .8rem; color: rgb(255 255 255 / .82); text-decoration: none; opacity: 0; transition: opacity 1.2s; display: inline-flex; gap: .4em; align-items: center; }
.hero__cap.is-on { opacity: 1; }
.hero__down { position: absolute; left: 50%; bottom: 18px; translate: -50% 0; color: rgb(255 255 255 / .8); animation: bob 2.4s ease-in-out infinite; }
.hero__down .i { width: 28px; height: 28px; }
@keyframes bob { 50% { transform: translateY(6px); } }
@media (max-width: 700px) { .hero__caps { display: none; } .hero__search .btn { padding-inline: 1em; } }
@media (prefers-reduced-motion: reduce) { .hero__slide img { transition: none; transform: none; } .hero__down { animation: none; } }
.uzmap { position: relative; margin: 0 0 clamp(36px, 6vw, 64px); }
.uzmap svg { width: 100%; height: auto; overflow: visible; }
.uzmap__r path { fill: hsl(var(--h) 35% 84%); stroke: var(--paper); stroke-width: 1.6; transition: fill .3s, transform .45s var(--ease-out), filter .3s; transform-box: fill-box; transform-origin: center; }
.uzmap__r:hover path, .uzmap__r:focus-visible path, .uzmap__r.is-active path { fill: hsl(var(--h) 55% 52%); filter: drop-shadow(0 8px 14px hsl(var(--h) 40% 25% / .35)); }
.uzmap__r:hover path { transform: translateY(-3px); }
.uzmap__r:focus-visible { outline: none; }
.uzmap__r[data-region="toshkent-shahri"] path { fill: hsl(var(--h) 60% 48%); stroke-width: 1; }
:root[data-theme="dark"] .uzmap__r path { fill: hsl(var(--h) 22% 26%); stroke: var(--paper); }
:root[data-theme="dark"] .uzmap__r:hover path, :root[data-theme="dark"] .uzmap__r.is-active path { fill: hsl(var(--h) 50% 48%); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .uzmap__r path { fill: hsl(var(--h) 22% 26%); stroke: var(--paper); }
:root[data-theme="auto"] .uzmap__r:hover path, :root[data-theme="auto"] .uzmap__r.is-active path { fill: hsl(var(--h) 50% 48%); } }
.uzmap__l { font: 600 14px/1 var(--sans); fill: var(--ink-2); text-anchor: middle; pointer-events: none; paint-order: stroke; stroke: color-mix(in oklab, var(--paper) 70%, transparent); stroke-width: 3px; letter-spacing: .02em; transition: fill .2s; }
.uzmap__l.is-hot { fill: var(--ink); font-weight: 700; }
.uzmap__cap { fill: var(--accent); stroke: var(--paper); stroke-width: 2.5; pointer-events: none; }
.uzmap__cap-box { position: absolute; left: 0; bottom: 4%; max-width: 360px; padding: 18px 20px; border-radius: var(--r); background: color-mix(in oklab, var(--card) 92%, transparent); border: 1px solid var(--line); box-shadow: var(--shadow); backdrop-filter: blur(6px); }
.uzmap__cap-box p { margin: 0; }
.uzmap__cap-box h3 { margin: 0 0 .25em; }
.uzmap__cap-box .kicker { margin-bottom: .5em; }
@media (max-width: 760px) { .uzmap__l { font-size: 20px; } .uzmap__cap-box { position: static; max-width: none; margin-top: 12px; } }
.uzmap--mini { margin: 0; } .uzmap--mini .uzmap__l { display: none; } .uzmap--mini .uzmap__r:not(.is-active) path { fill: var(--paper-3); }
.uzmap--page { margin-top: 8px; }
.cats { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 12px; }
.cat { display: flex; flex-direction: column; gap: 10px; padding: 18px; border-radius: var(--r); border: 1px solid var(--line); background: var(--card); text-decoration: none; transition: transform .3s var(--ease), border-color .2s, box-shadow .3s; }
.cat .i { width: 30px; height: 30px; color: var(--accent); stroke-width: 1.5; transition: transform .4s var(--ease-out); }
.cat span { font: 500 1.1rem/1.2 var(--serif); }
.cat small { color: var(--muted); font-size: .8rem; }
.cat:hover { transform: translateY(-3px); border-color: var(--accent); box-shadow: var(--shadow); color: inherit; }
.cat:hover .i { transform: scale(1.12) rotate(-6deg); }
.rgrid .rcard:nth-child(7n + 1) a { aspect-ratio: 4 / 5; }
.hl { margin: 0; padding-left: 1.1em; display: grid; gap: .4em; font-size: .95rem; }
.pnocover { border-radius: var(--r); overflow: hidden; height: clamp(160px, 26vw, 320px); margin-bottom: 8px; }
.pnocover .pic { width: 100%; height: 100%; }
.slist { display: grid; gap: 4px; }
.rail--sm .rail__track { grid-auto-columns: minmax(260px, 24%); }
.hero__girih { position: absolute; inset: 0; width: 100%; height: 100%; z-index: -1; color: #f3c98b; opacity: .1; pointer-events: none;
mask-image: radial-gradient(ellipse at 70% 30%, #000 0%, transparent 65%); -webkit-mask-image: radial-gradient(ellipse at 70% 30%, #000 0%, transparent 65%); }
@media (prefers-reduced-motion: no-preference) { .hero__girih { animation: girihDrift 60s linear infinite; } }
@keyframes girihDrift { to { transform: translate3d(-96px, -96px, 0); } }
.hero[data-glow]::before { z-index: -1; }
.hero__rot { font: italic 400 clamp(1.15rem, 2.2vw, 1.6rem)/1.3 var(--serif); color: rgb(255 255 255 / .82); margin: -.2em 0 .9em; }
.hero__rot span { color: #f3c98b; font-style: normal; font-weight: 600; }
.hero__cap small { opacity: .7; margin-left: .3em; }
.hero__down { display: grid; justify-items: center; gap: 4px; font: 600 .66rem/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; text-decoration: none; }
.hero__t { text-wrap: balance; }
.hero__t .sw > * { transition-duration: 1.2s; }
.hero__t em { display: inline-block; }
.btn--light { background: #fff; color: #1c1a17; border-color: #fff; }
.btn--light:hover { background: var(--gold); border-color: var(--gold); color: #1c1a17; }
.mq-band { padding-block: clamp(18px, 3vw, 30px); border-block: 1px solid var(--line); background: var(--paper); overflow: hidden; }
.mq-band--end { margin-top: clamp(40px, 6vw, 80px); }
.marquee--big { --gap: clamp(1.4rem, 3vw, 2.6rem); font: 500 clamp(1.8rem, 5vw, 3.6rem)/1.1 var(--serif); letter-spacing: -.01em; }
.marquee--big .marquee__it { color: var(--ink); transition: color .25s; }
.marquee--big .marquee__it:hover { color: var(--accent); }
.marquee--big .marquee__it:nth-child(even) { font-style: italic; color: var(--ink-2); }
.marquee .dot { color: var(--accent); font-size: .5em; font-style: normal; }
.manifesto { padding-block: clamp(70px, 12vw, 160px); }
.manifesto__t { font: 400 clamp(1.7rem, 4.2vw, 3.6rem)/1.22 var(--serif); letter-spacing: -.015em; max-width: 26ch; margin: 0; text-wrap: pretty; }
.manifesto .kicker { margin-bottom: 1.6em; }
.hs.sec--alt { background: var(--paper-2); }
.hs .card__media { box-shadow: var(--shadow-lg); }
.hs .card--tall .card__media { aspect-ratio: 3 / 4.1; }
.hs__track > .card { transform-origin: center; }
@media (min-width: 901px) { .hs__track > .card:nth-child(even) { margin-top: 48px; } }
.band { position: relative; isolation: isolate; overflow: hidden; background: #15110d; color: #fff; padding-block: clamp(70px, 10vw, 140px) 0; }
.band::after { content: ''; position: absolute; inset: 0; z-index: -2; background:
radial-gradient(ellipse at 10% 10%, rgb(178 67 42 / .35), transparent 50%), radial-gradient(ellipse at 90% 80%, rgb(19 105 109 / .35), transparent 55%); }
.band__in { display: grid; grid-template-columns: 1fr 1.05fr; gap: clamp(32px, 6vw, 90px); align-items: center; }
.band .kicker { color: #f3c98b; }
.band__t { font-size: clamp(2.2rem, 5.4vw, 4.6rem); line-height: 1; color: #fff; max-width: 13ch; }
.band__lead { color: rgb(255 255 255 / .78); font-size: 1.08rem; max-width: 48ch; margin: 1.2em 0 2em; }
.band__img { margin: 0; border-radius: var(--r); overflow: hidden; box-shadow: 0 40px 80px -30px rgb(0 0 0 / .7); aspect-ratio: 4 / 5; position: relative; }
.band__img .pic { position: absolute; inset: 0; }
.band__img figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 40px 18px 14px; font-size: .78rem; color: rgb(255 255 255 / .85); background: linear-gradient(transparent, rgb(0 0 0 / .65)); }
.band__img .credit { color: rgb(255 255 255 / .75); }
.marquee--band { margin-top: clamp(50px, 7vw, 90px); padding-block: 22px; border-top: 1px solid rgb(255 255 255 / .12); --gap: 2.2rem; font: italic 400 clamp(1.3rem, 2.6vw, 2rem)/1.2 var(--serif); }
.marquee--band .marquee__it { color: rgb(255 255 255 / .82); }
.marquee--band .marquee__it:hover { color: #f3c98b; }
@media (max-width: 900px) { .band__in { grid-template-columns: 1fr; } .band__img { aspect-ratio: 4 / 3; } }
.bento { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: clamp(220px, 22vw, 300px); gap: clamp(12px, 1.6vw, 20px); }
.bento .rcard a { aspect-ratio: auto; height: 100%; }
.bento .rcard:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.bento .rcard:nth-child(2), .bento .rcard:nth-child(7) { grid-row: span 2; }
.bento .rcard:nth-child(6) { grid-column: span 2; }
.bento .rcard:nth-child(1) h3 { font-size: clamp(1.9rem, 3.4vw, 3rem); }
@media (max-width: 980px) { .bento { grid-template-columns: repeat(2, 1fr); } .bento .rcard:nth-child(n) { grid-column: auto; grid-row: auto; } .bento .rcard:nth-child(1) { grid-column: span 2; } }
@media (max-width: 560px) { .bento { grid-template-columns: 1fr; grid-auto-rows: 260px; } .bento .rcard:nth-child(1) { grid-column: auto; } }
.uzmap__cap-box img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: 10px; margin-bottom: 12px; animation: fadeIn .4s; }
.ftr__mark { font: 500 clamp(3.4rem, 13.5vw, 13rem)/.9 var(--serif); letter-spacing: -.035em; margin: 0 0 40px; color: var(--ftr-fg, #f6f1e8); white-space: nowrap; overflow: hidden; }
.ftr__mark em { color: var(--gold); font-weight: 400; }
.rhero { position: relative; }
.phead--region { min-height: min(92vh, 900px); }
.phead--region .phead__media .hero__slide { position: absolute; inset: 0; }
.phead--region .phead__t { font-size: clamp(2.8rem, 8vw, 6.6rem); line-height: .95; max-width: 14ch; }
.rhero .hero__caps { z-index: 2; bottom: 18px; }
.rhero .hero__cap { color: rgb(255 255 255 / .85); }
@media (max-width: 700px) { .phead--region { min-height: 82vh; } }
.feat { display: grid; grid-template-columns: 1.6fr 1fr; grid-template-rows: 1fr 1fr; gap: clamp(14px, 2vw, 24px); margin-bottom: 36px; }
.feat .card:first-child { grid-row: span 2; }
.feat .card__media { aspect-ratio: auto; height: 100%; min-height: 200px; }
.feat .card__a { position: relative; }
.feat .card--feat .card__b { position: absolute; inset: auto 0 0 0; padding: 22px; color: #fff; z-index: 2; pointer-events: none; }
.feat .card--feat .card__media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgb(10 8 6 / .78)); z-index: 1; }
.feat .card--feat .card__k { color: rgb(255 255 255 / .8); }
.feat .card--feat .card__t { color: #fff; font-size: clamp(1.3rem, 2.2vw, 1.9rem); }
.feat .card--feat:first-child .card__t { font-size: clamp(1.8rem, 3.6vw, 3rem); }
.feat .card--feat .card__s { color: rgb(255 255 255 / .82); }
.feat .card--feat .card__a:hover .card__t { color: #f3c98b; }
@media (max-width: 900px) { .feat { grid-template-columns: 1fr; grid-template-rows: none; } .feat .card:first-child { grid-row: auto; } .feat .card__media { aspect-ratio: 4 / 3; height: auto; } }
.soon { min-height: 70vh; display: flex; flex-direction: column; justify-content: center; padding-block: 10vh; }
.soon h1 { font-size: clamp(3rem, 9vw, 7rem); line-height: .95; }
.soon__star { width: 84px; height: 84px; color: var(--accent); margin-bottom: 28px; }
@media (prefers-reduced-motion: no-preference) { .soon__star { animation: spin 18s linear infinite; } }
@keyframes spin { to { transform: rotate(360deg); } }
.soon__more { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 16px; color: var(--muted); }
.notice-box { display: flex; gap: .6em; align-items: flex-start; border-color: color-mix(in oklab, var(--gold) 50%, var(--line)); background: color-mix(in oklab, var(--gold) 10%, var(--card)); }
.ckb { position: fixed; z-index: 150; left: 50%; bottom: max(14px, env(safe-area-inset-bottom)); width: min(560px, calc(100% - 24px));
display: grid; gap: 12px; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); color: var(--ink);
box-shadow: var(--shadow-lg); opacity: 0; visibility: hidden; transform: translate(-50%, 20px);
transition: opacity .35s var(--ease), transform .35s var(--ease), visibility 0s linear .35s; }
.ckb.is-on { opacity: 1; visibility: visible; transform: translate(-50%, 0); transition-delay: 0s; }
.ckb__t { margin: 0; font-size: .9rem; line-height: 1.5; color: var(--ink-2); }
.ckb__t a { color: var(--ink); font-weight: 600; white-space: nowrap; }
.ckb__b { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.ckb__btn { padding: .75em 1em; border-radius: 999px; border: 1px solid var(--ink); background: transparent; color: var(--ink); font: 600 .9rem/1.1 var(--sans);
transition: background .2s, color .2s; }
.ckb__btn:hover { background: var(--ink); color: var(--paper); }
.ckb__btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) { .ckb { transition: none; transform: translate(-50%, 0); } }
@media print { .ckb { display: none; } }
.st-ckt { margin: 0 0 1.1em; }
.st-ckt table { font-size: .9rem; }
.st-ckt code { font-size: .86em; white-space: nowrap; }
.st-choice { margin: 18px 0 0; }
.st-choice h3 { margin: 0 0 .35em; font-size: 1.2rem; }
.st-choice p { margin: 0 0 12px; font-size: .95rem; color: var(--ink-2); }
.st-choice__b { display: flex; flex-wrap: wrap; gap: 10px; }
.st-choice__b .btn[aria-pressed="true"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
:root { --st-1: #2a78d6; --st-2: #eb6834; --st-3: #1baf7a; }
:root[data-theme="dark"] { --st-1: #3987e5; --st-2: #d95926; --st-3: #199e70; }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] { --st-1: #3987e5; --st-2: #d95926; --st-3: #199e70; } }
.stk { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr)); gap: 12px; margin: 0 0 16px; }
.stk__t { display: grid; gap: 4px; align-content: start; min-width: 0; padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); }
.stk__l { font-size: .8rem; line-height: 1.3; color: var(--muted); }
.stk__v { font: 600 clamp(1.4rem, 2.6vw, 1.8rem)/1.15 var(--sans); color: var(--ink); overflow-wrap: anywhere; }
.stk__d { font-size: .74rem; line-height: 1.35; color: var(--muted); }
.stk__d b { font-weight: 700; }
.stk__d--up b { color: var(--ok); }
.stk__d--down b { color: var(--bad); }
.stl { list-style: none; margin: 0; padding: 0; display: grid; gap: 3px; }
.stl__r { position: relative; isolation: isolate; display: flex; align-items: center; gap: 10px; min-height: 34px; padding: 6px 10px; border-radius: 8px;
color: var(--ink); text-decoration: none; font-size: .9rem; line-height: 1.35; }
.stl__f { position: absolute; z-index: -1; inset: 0 auto 0 0; width: var(--v); border-radius: 8px; background: color-mix(in oklab, var(--st-1) 15%, transparent); }
a.stl__r:hover { color: var(--ink); }
a.stl__r:hover .stl__f { background: color-mix(in oklab, var(--st-1) 26%, transparent); }
.stl__l { flex: 1; min-width: 0; overflow-wrap: anywhere; }
.stl__x { color: var(--muted); font-size: .76rem; white-space: nowrap; }
.stl__v { font-weight: 600; font-variant-numeric: tabular-nums; white-space: nowrap; }
.st-empty { margin: 6px 0; color: var(--muted); font-size: .9rem; }
.st-flag { font-size: 1.05em; }
.st-num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.stc { margin: 0; min-width: 0; }
.st-leg { display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 0 0 8px; font-size: .82rem; color: var(--ink-2); }
.st-leg__k { display: inline-flex; align-items: center; gap: 6px; }
.st-leg__k::before { content: ''; width: 16px; height: 2px; border-radius: 2px; background: var(--st-1); }
.st-leg__k--2::before { background: var(--st-2); }
.st-leg__k--3::before { background: var(--st-3); }
.stc__plot { position: relative; height: clamp(170px, 26vw, 250px); margin: 12px 6px 0 46px; }
.stc__grid span { position: absolute; left: 0; right: 0; bottom: var(--y); border-top: 1px solid var(--line); }
.stc__grid b { position: absolute; right: calc(100% + 8px); top: -.65em; font: 500 .7rem/1.2 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; white-space: nowrap; }
.stc__svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }
.stc__area { fill: var(--st-1); opacity: .1; }
.stc__ln { fill: none; stroke: var(--st-1); stroke-width: 2px; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
.stc__ln--2 { stroke: var(--st-2); }
.stc__ln--3 { stroke: var(--st-3); }
.stc__hits { position: absolute; inset: 0; }
.stc__hit { position: absolute; top: 0; bottom: 0; left: var(--l); width: var(--w); outline: none; }
.stc__hit::before { content: ''; position: absolute; top: 0; bottom: 0; left: var(--c); border-left: 1px solid var(--muted); opacity: 0; }
.stc__hit:hover::before, .stc__hit:focus-visible::before { opacity: .6; }
.stc__dot { position: absolute; left: var(--c); bottom: var(--y); width: 10px; height: 10px; margin: 0 0 -5px -5px; border-radius: 50%; background: var(--st-1); box-shadow: 0 0 0 2px var(--card); opacity: 0; }
.stc__dot--2 { background: var(--st-2); }
.stc__dot--3 { background: var(--st-3); }
.stc__hit:hover .stc__dot, .stc__hit:focus-visible .stc__dot { opacity: 1; }
.stc__hit::after, .stb__c::after { content: attr(data-tip); display: none; position: absolute; z-index: 6; bottom: calc(100% + 8px); left: var(--c, 50%); transform: translateX(-50%);
white-space: pre; padding: 8px 10px; border-radius: 8px; background: var(--ink); color: var(--paper); font: 500 .74rem/1.45 var(--sans); box-shadow: var(--shadow); pointer-events: none; }
.stc__hit.is-l::after, .stb__c.is-l::after { transform: none; }
.stc__hit.is-r::after, .stb__c.is-r::after { transform: translateX(-100%); }
.stc__hit:hover::after, .stc__hit:focus-visible::after, .stb__c:hover::after, .stb__c:focus-visible::after { display: block; }
.stc__x { position: relative; height: 1.9em; margin: 6px 6px 0 46px; }
.stc__x span { position: absolute; left: var(--l); transform: translateX(-50%); font-size: .7rem; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
.stc__x .is-first { transform: none; }
.stc__x .is-last { transform: translateX(-100%); }
.stb { position: absolute; inset: 0; display: flex; align-items: stretch; gap: 2px; margin: 0; padding: 0; list-style: none; }
.stb__c { position: relative; flex: 1 1 0; min-width: 0; display: flex; align-items: flex-end; justify-content: center; outline: none; }
.stb__c span { width: 100%; max-width: 24px; height: var(--v); min-height: 2px; border-radius: 4px 4px 0 0; background: var(--st-1); }
.stb__c span.is-0 { height: 0; min-height: 0; }
.stb__c:hover span, .stb__c:focus-visible span { background: color-mix(in oklab, var(--st-1) 78%, var(--ink)); }
.stb__c:focus-visible { box-shadow: inset 0 0 0 2px color-mix(in oklab, var(--accent) 55%, transparent); border-radius: 4px; }
.stc__hit:focus-visible { box-shadow: inset 0 0 0 2px color-mix(in oklab, var(--accent) 55%, transparent); border-radius: 4px; }
.st-tv { margin-top: 10px; font-size: .85rem; }
.st-tv summary { width: max-content; max-width: 100%; cursor: pointer; color: var(--muted); font-weight: 600; }
.st-tv .tbl-wrap { margin-top: 8px; max-height: 320px; overflow: auto; }
.st-tbl { font-size: .84rem; }
.st-tbl th, .st-tbl td { padding: 7px 10px; }
.st-spark { display: block; width: 100%; height: 34px; overflow: visible; }
.st-spark path { fill: none; stroke: var(--st-1); stroke-width: 2px; vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
@media (max-width: 600px) {
.stc__x .st-sm { display: none; }
.stc__plot, .stc__x { margin-left: 38px; }
.stb { gap: 1px; }
}
.sto { display: grid; gap: 16px; min-width: 0; }
.sto__h h2 { margin: 0 0 .2em; font-size: clamp(1.4rem, 2.4vw, 1.85rem); }
.sto__h p { margin: 0; color: var(--muted); font-size: .9rem; }
.sto h3 { margin: 0 0 12px; font: 600 1rem/1.3 var(--sans); letter-spacing: 0; }
.sto .stk { margin: 0; }
.sto__chart, .sto__p { min-width: 0; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); }
.sto__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 14px; }
.sto__note { margin: 0; color: var(--muted); font-size: .82rem; }
.adm { --adm-w: 1240px; background: var(--paper); }
.adm .i { display: inline-block; vertical-align: -.18em; }
.adm-top { position: sticky; top: 0; z-index: 50; background: color-mix(in oklab, var(--card) 94%, transparent); backdrop-filter: blur(10px); border-bottom: 1px solid var(--line); }
.adm-top__in { max-width: var(--adm-w); margin: 0 auto; padding: 10px var(--gut); display: flex; align-items: center; gap: 10px 22px; flex-wrap: wrap; }
.adm-brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; color: var(--ink); font: 500 1.12rem/1 var(--serif); white-space: nowrap; }
.adm-brand:hover { color: var(--ink); }
.adm-brand .logo__m { width: 28px; height: 28px; color: var(--accent); flex: none; }
.adm-brand em { font-style: italic; color: var(--accent); }
.adm-brand small { font: 600 .64rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; padding: .38em .62em; border-radius: 999px; background: var(--ink); color: var(--paper); }
.adm-nav { display: flex; gap: 4px; flex-wrap: wrap; }
.adm-nav a { display: inline-flex; align-items: center; gap: .45em; padding: .55em .95em; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .9rem; color: var(--ink-2); white-space: nowrap; }
.adm-nav a:hover { background: var(--paper-2); color: var(--ink); }
.adm-nav a[aria-current] { background: var(--ink); color: var(--paper); }
.adm-me { margin-left: auto; display: flex; align-items: center; gap: 12px; font-size: .88rem; }
.adm-me__site, .adm-me__u { display: inline-flex; align-items: center; gap: .35em; color: var(--muted); text-decoration: none; white-space: nowrap; }
.adm-me__site:hover { color: var(--accent); }
.adm-me__out { margin: 0; }
.adm-main { width: 100%; max-width: var(--adm-w); margin: 0 auto; padding: 28px var(--gut) 64px; flex: 1; }
.adm-foot { width: 100%; max-width: var(--adm-w); margin: 0 auto; padding: 16px var(--gut) 28px; border-top: 1px solid var(--line); color: var(--muted); font-size: .8rem; }
.adm-foot p { margin: 0; }
.adm-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 12px 24px; margin-bottom: 18px; }
.adm-head__t { min-width: 0; }
.adm-head h1 { font-size: clamp(1.7rem, 3.4vw, 2.5rem); margin: 0; overflow-wrap: anywhere; }
.adm-head .kicker { margin-bottom: .55em; }
.adm-head__a { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.adm-lead { color: var(--ink-2); margin: .5em 0 0; max-width: 72ch; }
.adm-h2 { font-size: 1.35rem; display: flex; align-items: center; gap: .4em; margin: 0 0 14px; }
.adm-h3 { font: 600 1.02rem/1.3 var(--sans); display: flex; flex-wrap: wrap; align-items: center; gap: .45em; margin: 0 0 14px; letter-spacing: 0; }
.adm-h4 { font: 600 .95rem/1.3 var(--sans); display: flex; align-items: center; gap: .4em; margin: 0 0 12px; letter-spacing: 0; }
.adm-h2 .i, .adm-h3 .i, .adm-h4 .i { color: var(--accent); }
.adm-muted { color: var(--muted); }
.adm-small { font-size: .85rem; }
.adm-mono { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .82em; }
.adm-nowrap { white-space: nowrap; }
.adm-strong { font-weight: 600; text-decoration: none; }
.adm-strong:hover { text-decoration: underline; }
.adm-row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 14px 0 0; }
.adm-sec { margin-bottom: 18px; }
.adm-meta { display: flex; flex-wrap: wrap; gap: 6px 16px; align-items: center; color: var(--muted); font-size: .86rem; margin: 0 0 18px; }
.adm-meta span { display: inline-flex; align-items: center; gap: .3em; }
.adm-meta .i { width: 14px; height: 14px; }
.adm-list { list-style: none; padding: 0; margin: 0 0 14px; display: grid; gap: 8px; font-size: .92rem; }
.adm-flash { display: flex; gap: .55em; align-items: flex-start; padding: 12px 16px; border: 1px solid; border-radius: var(--r-sm); margin: 0 0 18px; font-size: .94rem; color: var(--ink); }
.adm-flash .i { margin-top: .18em; }
.adm-flash--ok { background: color-mix(in oklab, var(--ok) 12%, var(--card)); border-color: color-mix(in oklab, var(--ok) 35%, transparent); }
.adm-flash--ok .i { color: var(--ok); }
.adm-flash--bad { background: color-mix(in oklab, var(--bad) 10%, var(--card)); border-color: color-mix(in oklab, var(--bad) 35%, transparent); }
.adm-flash--bad .i { color: var(--bad); }
.adm-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin-bottom: 10px; }
.adm-stat { display: grid; gap: 6px; padding: 16px 18px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); text-decoration: none; color: var(--ink); transition: border-color .2s, transform .2s var(--ease); }
.adm-stat:hover { border-color: var(--accent); transform: translateY(-2px); color: var(--ink); }
.adm-stat .i { color: var(--accent); width: 20px; height: 20px; }
.adm-stat__n { font: 500 clamp(1.7rem, 3vw, 2.3rem)/1 var(--serif); }
.adm-stat__l { color: var(--muted); font-size: .85rem; }
.adm-cols { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 20px; align-items: start; margin-top: 18px; }
.adm-cols--even { grid-template-columns: repeat(auto-fit, minmax(min(100%, 440px), 1fr)); margin-top: 0; }
.adm-cols--even > .adm-sec { margin: 0; }
.adm-side { display: grid; gap: 16px; min-width: 0; }
.adm-side > * { min-width: 0; }
.adm-side .tbl-wrap { border: 0; }
@media (max-width: 1000px) { .adm-cols { grid-template-columns: minmax(0, 1fr); } }
.adm-form { display: grid; gap: 14px; }
.adm-form > .box { margin: 0; }
.adm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 14px 18px; align-items: start; }
.adm-grid + .adm-grid { margin-top: 16px; }
.adm-grid--coords { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) auto; align-items: end; margin-top: 16px; }
.adm-sec > .adm-grid--coords + .adm-hint, .adm-sec > .adm-grid--coords + .adm-err { margin: 8px 0 0; }
.adm-f { display: grid; gap: 6px; min-width: 0; margin: 0; }
.adm-f > label { font-weight: 600; font-size: .88rem; color: var(--ink-2); }
.adm-req { color: var(--bad); }
.adm-in { width: 100%; min-width: 0; padding: .62em .8em; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); color: var(--ink); font-size: .95rem; line-height: 1.45; transition: border-color .15s, box-shadow .15s; }
.adm-in:hover { border-color: color-mix(in oklab, var(--ink) 28%, var(--line)); }
.adm-in:focus { outline: none; border-color: var(--accent-2); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent-2) 22%, transparent); }
.adm-ta { resize: vertical; min-height: 4.6em; }
.adm-ta--big { min-height: 24em; line-height: 1.6; }
input[type="file"].adm-in { padding: .45em; }
.adm-f--err .adm-in { border-color: var(--bad); }
.adm-err { display: flex; gap: .35em; align-items: flex-start; color: var(--bad); font-size: .84rem; margin: 0; }
.adm-err .i { width: 15px; height: 15px; margin-top: .16em; }
.adm-hint { color: var(--muted); font-size: .82rem; margin: 0; line-height: 1.45; }
.adm-count { color: var(--muted); font-size: .76rem; margin: -2px 0 0; text-align: right; }
.adm-count.is-over { color: var(--warn); font-weight: 600; }
.adm-f--check label { display: inline-flex; align-items: center; gap: .55em; font-weight: 600; font-size: .95rem; color: var(--ink); cursor: pointer; }
.adm-f--check input { width: 18px; height: 18px; accent-color: var(--accent); }
.adm-f--btn { display: block; align-self: end; }
.adm-form > button:not(.adm-wide), .adm-form > .btn:not(.adm-wide) { justify-self: start; }
.adm-sec > .adm-hint { margin: -6px 0 14px; }
.adm-wide { width: 100%; justify-content: center; }
.adm-btn--bad { color: var(--bad); border-color: color-mix(in oklab, var(--bad) 40%, var(--line)); }
.adm-btn--bad:hover { background: var(--bad); border-color: var(--bad); color: #fff; }
.adm button.btn:disabled { opacity: .55; cursor: progress; transform: none; }
.adm-filters { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: end; margin-bottom: 16px; padding: 16px 18px; }
.adm-f--auto { flex: 1 1 200px; max-width: 280px; }
.adm-f--grow { flex: 3 1 240px; }
.adm-qs { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin: 18px 0 0; padding: 14px 16px; }
.adm-qs select { flex: 0 1 260px; width: auto; }
.adm-qs input { flex: 1 1 220px; width: auto; }
.adm-tbl { font-size: .9rem; }
.adm-tbl th, .adm-tbl td { padding: 10px 12px; }
.adm-tbl .pill { font-size: .7rem; }
.adm-num { text-align: right; }
.adm-main .pager { margin-top: 24px; }
@media (max-width: 700px) { .adm-hide-sm { display: none; } }
.adm-tabs { margin-bottom: 18px; }
.adm-dot { color: var(--bad); font-size: .7em; vertical-align: .2em; }
.adm-lang { display: grid; gap: 14px; }
.adm-lang + .adm-lang { margin-top: 26px; padding-top: 22px; border-top: 1px dashed var(--line); }
.adm-langs.is-tabs .adm-lang + .adm-lang { margin-top: 0; padding-top: 0; border-top: 0; }
.adm-langs.is-tabs .adm-lang__t { display: none; }
.adm-savebar { position: sticky; bottom: 0; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 12px 16px; margin: 0 0 24px;
background: color-mix(in oklab, var(--card) 94%, transparent); backdrop-filter: blur(8px); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow); }
.adm-imgs { list-style: none; margin: 0 0 20px; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: 14px; }
.adm-img { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: var(--r-sm); overflow: hidden; background: var(--paper); }
.adm-img__m { position: relative; display: block; aspect-ratio: 4 / 3; background: var(--paper-3); }
.adm-img__m img { width: 100%; height: 100%; object-fit: cover; }
.adm-img__cover { position: absolute; top: 8px; left: 8px; display: inline-flex; align-items: center; gap: .3em; padding: .32em .62em; border-radius: 999px; background: var(--accent); color: var(--accent-ink); font: 600 .72rem/1 var(--sans); }
.adm-img__cover .i { width: 12px; height: 12px; }
.adm-img__b { display: grid; gap: 4px; padding: 10px 12px 12px; }
.adm-img__c { display: flex; flex-wrap: wrap; align-items: center; gap: .3em; margin: 0; font-size: .8rem; overflow-wrap: anywhere; }
.adm-img__c .i { width: 13px; height: 13px; }
.adm-img__a { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 6px; }
.adm-img__a form { margin: 0; }
.adm-up { display: grid; gap: 14px; padding-top: 18px; border-top: 1px dashed var(--line); }
.adm-up .adm-h4 { margin: 0; }
.adm-up .adm-row { margin: 0; }
.adm-up__prev { margin-top: 8px; max-height: 140px; width: auto; border-radius: 8px; border: 1px solid var(--line); }
.adm-up__st { margin: 0; font-size: .88rem; color: var(--muted); }
.adm-up__st.is-bad { color: var(--bad); }
.adm-up__st.is-ok { color: var(--ok); }
.adm-notice-prev { border-radius: var(--r-sm); margin: 4px 0 16px; z-index: auto; }
.adm--bare { background: radial-gradient(1100px 520px at 50% -12%, color-mix(in oklab, var(--accent) 13%, transparent), transparent), var(--paper); }
.adm-bare { flex: 1; display: grid; align-content: center; justify-items: center; gap: 22px; padding: 48px var(--gut); }
.adm-brand--big { font-size: 1.4rem; }
.adm-brand--big .logo__m { width: 36px; height: 36px; }
.adm-login { width: min(420px, 100%); padding: 28px; box-shadow: var(--shadow-lg); }
.adm-login h1 { font-size: 1.85rem; margin-bottom: .3em; }
.adm-login .adm-lead { margin: 0 0 18px; font-size: .95rem; }
.adm-login .adm-flash { margin-bottom: 14px; }
.adm-login > .adm-hint { margin-top: 16px; }
.adm-errbox { width: min(560px, 100%); }
.adm-errbox h1 { font-size: 1.7rem; }
.adm-main .adm-errbox { margin: 24px auto; }
@media (max-width: 760px) {
.adm-top { position: static; }
.adm-top__in { gap: 8px 12px; padding-block: 8px; }
.adm-top__in > .adm-brand > span, .adm-me__site span, .adm-me__u span { display: none; }
.adm-nav { order: 3; width: 100%; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.adm-nav a { padding: .5em .8em; }
.adm-main { padding-top: 20px; }
.adm-savebar .adm-hint { display: none; }
.adm-f--auto { max-width: none; }
.adm-grid--coords { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.adm-grid--coords .adm-f--btn { grid-column: 1 / -1; }
}
.adm-tbl--compact th, .adm-tbl--compact td { padding: 8px 10px; font-size: .84rem; }
@media (min-width: 901px) and (max-width: 1700px) {
.adm-top__in { flex-wrap: nowrap; gap: 10px 14px; }
.adm-nav { flex-wrap: nowrap; gap: 2px; min-width: 0; overflow-x: auto; scrollbar-width: none; }
.adm-nav::-webkit-scrollbar { display: none; }
.adm-nav a { padding: .5em .7em; font-size: .86rem; }
.adm-me { gap: 8px; flex-shrink: 0; }
.adm-me__site span, .adm-me__u span { display: none; }
}
@media (min-width: 901px) and (max-width: 1280px) {
.adm-top__in > .adm-brand > span { display: none; }
.adm-nav a span { display: none; }
.adm-nav a { padding: .55em .75em; }
}
.page-cabinet main { --cab-w: 1120px; }
.page-cabinet .i { display: inline-block; vertical-align: -.18em; }
.cab-top { position: relative; overflow: hidden; isolation: isolate; background: var(--paper-2); border-bottom: 1px solid var(--line); padding-block: clamp(24px, 4.5vw, 52px) 0; }
.cab-top::before { content: ''; position: absolute; z-index: -1; inset: -40% -10% auto auto; width: min(560px, 70vw); aspect-ratio: 1; border-radius: 50%; opacity: .55;
background:
radial-gradient(circle at 50% 50%, transparent 0 9px, color-mix(in oklab, var(--accent) 22%, transparent) 9.5px 10.5px, transparent 11px),
conic-gradient(from 45deg at 50% 50%, color-mix(in oklab, var(--gold) 16%, transparent) 0 25%, transparent 0 50%, color-mix(in oklab, var(--gold) 16%, transparent) 0 75%, transparent 0);
background-size: 44px 44px; mask: radial-gradient(closest-side, #000 30%, transparent); -webkit-mask: radial-gradient(closest-side, #000 30%, transparent); }
.cab-top__in { max-width: var(--cab-w); }
.cab-top .crumbs ol { margin-bottom: 14px; }
.cab-top__t { font-size: clamp(2rem, 4.6vw, 3.3rem); margin: 0 0 .25em; max-width: 22ch; overflow-wrap: anywhere; }
.cab-top__lead { margin: 0; max-width: 64ch; }
.cab-top--hero { padding-bottom: clamp(26px, 4vw, 44px); }
.cab-top--hero .cab-top__t { font-size: clamp(2.3rem, 5.4vw, 4rem); }
.cab-top .kicker .i { color: var(--accent); }
.cab-steps { list-style: none; margin: 26px 0 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; counter-reset: s; }
.cab-step { display: flex; gap: 14px; align-items: flex-start; padding: 16px 18px; border-radius: var(--r); background: color-mix(in oklab, var(--card) 80%, transparent); border: 1px solid var(--line); }
.cab-step__n { flex: none; font: italic 500 2.3rem/1 var(--serif); color: var(--accent); min-width: .8em; }
.cab-step b { display: block; font-size: .98rem; margin-bottom: .2em; }
.cab-step p { margin: 0; font-size: .88rem; color: var(--ink-2); line-height: 1.5; }
@media (max-width: 820px) { .cab-steps { grid-template-columns: minmax(0, 1fr); } }
.cab-bar { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 18px; margin-top: 22px; }
.cab-tabs { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin-bottom: -1px; }
.cab-tabs::-webkit-scrollbar { display: none; }
.cab-tabs a { display: inline-flex; align-items: center; gap: .45em; padding: .78em 1.05em; border-radius: 12px 12px 0 0; border: 1px solid transparent; border-bottom: 0;
text-decoration: none; font-weight: 600; font-size: .92rem; color: var(--ink-2); white-space: nowrap; }
.cab-tabs a:hover { color: var(--ink); background: color-mix(in oklab, var(--card) 60%, transparent); }
.cab-tabs a[aria-current] { background: var(--paper); color: var(--ink); border-color: var(--line); }
.cab-tabs a[aria-current] .i { color: var(--accent); }
.cab-badge { display: inline-grid; place-items: center; min-width: 1.5em; height: 1.5em; padding: 0 .4em; border-radius: 999px; background: var(--accent); color: var(--accent-ink); font: 700 .72rem/1 var(--sans); }
.cab-out { margin: 0 0 10px; }
@media (max-width: 600px) {
.cab-bar { flex-wrap: nowrap; align-items: flex-end; gap: 6px; }
.cab-tabs { flex: 1 1 auto; min-width: 0; gap: 0; }
.cab-tabs a { padding: .72em .62em; font-size: .86rem; gap: .35em; }
.cab-out .btn { padding: .55em .65em; }
.cab-out .btn span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}
@media (max-width: 430px) { .cab-tabs a .i { display: none; } }
.cab-main { max-width: var(--cab-w); padding-block: clamp(22px, 3.5vw, 40px) 24px; }
.cab-sec { margin-top: clamp(26px, 4vw, 44px); }
.cab-h2 { font: 600 1.14rem/1.3 var(--sans); letter-spacing: 0; display: flex; flex-wrap: wrap; align-items: center; gap: .45em; margin: 0 0 14px; }
.cab-h2 .i { color: var(--accent); width: 1.2em; height: 1.2em; }
.cab-h2 small { font-weight: 600; font-size: .78rem; color: var(--muted); background: var(--paper-2); border-radius: 999px; padding: .25em .6em; }
.cab-h3 { font: 600 .98rem/1.3 var(--sans); margin: 0 0 12px; }
.cab-card { border: 1px solid var(--line); border-radius: var(--r); background: var(--card); padding: clamp(18px, 2.6vw, 26px); box-shadow: var(--shadow); min-width: 0; }
.cab-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 14px 0 0; }
.cab-actions form { margin: 0; }
.cab-wide { width: 100%; justify-content: center; }
.cab-btn--bad { color: var(--bad); border-color: color-mix(in oklab, var(--bad) 40%, var(--line)); }
.cab-btn--bad:hover { background: var(--bad); border-color: var(--bad); color: #fff; }
.page-cabinet button.btn:disabled { opacity: .55; cursor: progress; transform: none; }
.cab-empty { text-align: center; padding: clamp(28px, 5vw, 48px) 16px; color: var(--muted); border: 1px dashed var(--line); border-radius: var(--r); background: color-mix(in oklab, var(--card) 50%, transparent); }
.cab-empty > .i { width: 42px; height: 42px; margin: 0 auto 10px; color: var(--accent); display: block; stroke-width: 1.4; }
.cab-empty p { max-width: 56ch; margin-inline: auto; }
.cab-empty .cab-actions { justify-content: center; }
.cab-flash { display: flex; gap: .6em; align-items: flex-start; padding: 12px 16px; border: 1px solid; border-radius: var(--r-sm); margin: 0 0 18px; font-size: .95rem; color: var(--ink); }
.cab-flash .i { margin-top: .2em; flex: none; }
.cab-flash--ok { background: color-mix(in oklab, var(--ok) 12%, var(--card)); border-color: color-mix(in oklab, var(--ok) 35%, transparent); }
.cab-flash--ok .i { color: var(--ok); }
.cab-flash--bad { background: color-mix(in oklab, var(--bad) 10%, var(--card)); border-color: color-mix(in oklab, var(--bad) 35%, transparent); }
.cab-flash--bad .i { color: var(--bad); }
.cab-note { display: flex; gap: .6em; align-items: flex-start; padding: 12px 16px; border-radius: var(--r-sm); margin: 0 0 16px; font-size: .93rem;
background: color-mix(in oklab, var(--accent-2) 9%, var(--card)); border: 1px solid color-mix(in oklab, var(--accent-2) 26%, transparent); }
.cab-note .i { color: var(--accent-2); margin-top: .2em; flex: none; }
.cab-note--ok { background: color-mix(in oklab, var(--ok) 10%, var(--card)); border-color: color-mix(in oklab, var(--ok) 30%, transparent); }
.cab-note--ok .i { color: var(--ok); }
.cab-pill { gap: .35em; }
.cab-pill .i { width: 13px; height: 13px; }
.cab-auth { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: clamp(16px, 2.6vw, 28px); align-items: start; }
.cab-card--login { position: sticky; top: calc(var(--hdr) + 16px); }
@media (max-width: 860px) { .cab-auth { grid-template-columns: minmax(0, 1fr); } .cab-card--login { position: static; } }
.cab-card > .cab-hint:first-of-type { margin: -6px 0 16px; }
.cab-forgot { display: flex; gap: .55em; align-items: flex-start; margin-top: 16px !important; padding-top: 14px; border-top: 1px dashed var(--line); }
.cab-forgot .i { color: var(--muted); margin-top: .15em; flex: none; }
.cab-hp { position: absolute !important; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.cab-form { display: grid; gap: 14px; }
.cab-f { display: grid; gap: 6px; min-width: 0; margin: 0; }
.cab-f > label, .cab-form legend, .cab-f--check label { font-weight: 600; font-size: .88rem; color: var(--ink-2); }
.cab-must { color: var(--bad); }
.cab-tag { display: inline-block; font: 600 .68rem/1 var(--sans); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); background: var(--paper-2); border-radius: 999px; padding: .35em .6em; vertical-align: .1em; margin-left: .25em; }
.cab-in { width: 100%; min-width: 0; padding: .7em .85em; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); color: var(--ink); font-size: 1rem; line-height: 1.45;
transition: border-color .15s, box-shadow .15s; }
.cab-in:hover { border-color: color-mix(in oklab, var(--ink) 28%, var(--line)); }
.cab-in:focus { outline: none; border-color: var(--accent-2); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent-2) 22%, transparent); }
.cab-in[readonly] { background: var(--paper-2); color: var(--ink-2); }
select.cab-in { appearance: none; padding-right: 2.4em; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23776f65' stroke-width='1.6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .9em center; }
.cab-ta { resize: vertical; min-height: 4.8em; }
.cab-ta--big { min-height: 13em; line-height: 1.6; }
.cab-f--err .cab-in { border-color: var(--bad); }
.cab-err { display: flex; gap: .35em; align-items: flex-start; color: var(--bad); font-size: .85rem; margin: 0; }
.cab-err .i { width: 15px; height: 15px; margin-top: .16em; flex: none; }
.cab-hint { color: var(--muted); font-size: .84rem; margin: 0; line-height: 1.5; }
.cab-hint .i { width: 14px; height: 14px; vertical-align: -.15em; }
.cab-count { color: var(--muted); font-size: .76rem; margin: -2px 0 0; text-align: right; }
.cab-count.is-over { color: var(--warn); font-weight: 600; }
.cab-f--check label { display: flex; align-items: flex-start; gap: .6em; cursor: pointer; font-weight: 500; color: var(--ink); line-height: 1.45; }
.cab-f--check input { width: 18px; height: 18px; margin-top: .12em; accent-color: var(--accent); flex: none; }
.cab-f--btn { align-self: end; }
.cab-row2 { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 14px; }
@media (max-width: 520px) { .cab-row2 { grid-template-columns: minmax(0, 1fr); } }
.cab-pw { position: relative; display: block; }
.cab-pw .cab-in { padding-right: 3em; }
.cab-pw__b { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 38px; height: 38px; display: grid; place-items: center; border: 0; border-radius: 8px; background: transparent; color: var(--muted); }
.cab-pw__b:hover, .cab-pw__b[aria-pressed="true"] { color: var(--accent); background: var(--paper-2); }
.cab-cta { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.cab-cta__it { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: var(--r); border: 1px solid var(--line); background: var(--card); text-decoration: none; color: var(--ink);
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.cab-cta__it:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); color: var(--ink); }
.cab-cta__it > .i:first-child { width: 40px; height: 40px; padding: 9px; border-radius: 12px; background: color-mix(in oklab, var(--accent) 12%, transparent); color: var(--accent); flex: none; }
.cab-cta__it > span { display: grid; gap: 2px; flex: 1; min-width: 0; }
.cab-cta__it small { color: var(--muted); font-size: .84rem; }
.cab-cta__it > .i:last-child { color: var(--muted); transition: transform .25s var(--ease); }
.cab-cta__it:hover > .i:last-child { transform: translateX(4px); color: var(--accent); }
@media (max-width: 640px) { .cab-cta { grid-template-columns: minmax(0, 1fr); } }
.cab-vlist { display: grid; gap: 16px; }
.cab-v { display: grid; grid-template-columns: 240px minmax(0, 1fr); border: 1px solid var(--line); border-radius: var(--r); background: var(--card); overflow: hidden; box-shadow: var(--shadow); }
.cab-v__m { display: block; position: relative; min-height: 170px; }
.cab-v__m .vcov, .cab-v__m .pic { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 0; }
.cab-v__b { padding: 16px 20px 18px; min-width: 0; }
.cab-v__k { margin: 0 0 .3em; font-size: .76rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.cab-v__t { font-size: clamp(1.2rem, 2vw, 1.5rem); margin: 0 0 .45em; }
.cab-v__t a { text-decoration: none; }
.cab-v__st { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.cab-v__mini { margin-top: 12px; }
.cab-v--off { grid-template-columns: minmax(0, 1fr); box-shadow: none; opacity: .8; }
@media (max-width: 640px) { .cab-v { grid-template-columns: minmax(0, 1fr); } .cab-v__m { min-height: 0; aspect-ratio: 16 / 8; } }
.cab-mini { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cab-mini li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; padding: 12px 14px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); }
.cab-mini__k { font: 600 .7rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.cab-mini b { flex: 1 1 200px; min-width: 0; overflow-wrap: anywhere; }
.cab-search { display: grid; grid-template-columns: minmax(0, 2fr) minmax(0, 1fr) auto; gap: 12px 14px; align-items: end; margin-bottom: 18px; }
@media (max-width: 720px) { .cab-search { grid-template-columns: minmax(0, 1fr); } }
.cab-results { list-style: none; margin: 0; padding: 0; display: grid; gap: 10px; }
.cab-res { display: flex; align-items: center; gap: 12px; justify-content: space-between; padding: 10px 14px 10px 10px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); text-decoration: none; color: inherit;
transition: border-color .2s, box-shadow .25s; }
.cab-res:hover { border-color: var(--accent); box-shadow: var(--shadow); color: inherit; }
.cab-res__go { display: inline-flex; align-items: center; gap: .4em; font-weight: 600; font-size: .88rem; color: var(--accent); white-space: nowrap; }
.cab-pick { display: flex; align-items: center; gap: 14px; min-width: 0; }
.cab-pick__m { position: relative; width: 84px; height: 64px; border-radius: 10px; overflow: hidden; flex: none; background: var(--paper-3); }
.cab-pick__m .vcov, .cab-pick__m .pic { position: absolute; inset: 0; width: 100%; height: 100%; border-radius: 0; }
.cab-pick__m .vcov__mono { font-size: 1.6rem; }
.cab-pick__b { display: grid; gap: 2px; min-width: 0; }
.cab-pick__b b { font: 500 1.12rem/1.25 var(--serif); overflow-wrap: anywhere; }
.cab-pick__b small { color: var(--muted); font-size: .84rem; overflow-wrap: anywhere; }
.cab-claim .cab-pick { margin-bottom: 18px; padding-bottom: 16px; border-bottom: 1px dashed var(--line); }
.cab-newhint { margin-top: 22px; }
.cab-edhead { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; box-shadow: none; padding: 14px 16px; }
.cab-edhead .cab-actions { margin: 0; }
@media (max-width: 520px) { .cab-res { flex-wrap: wrap; } .cab-pick__m { width: 64px; height: 52px; } }
.cab-vform { gap: 18px; }
.cab-fs > .cab-h2 { margin-bottom: 16px; }
.cab-fs > .cab-hint { margin: -8px 0 14px; }
.cab-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 14px 18px; align-items: start; }
.cab-grid + .cab-grid, .cab-grid + .cab-f, .cab-kinds + .cab-grid { margin-top: 16px; }
.cab-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.cab-grid--3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 720px) { .cab-grid--3, .cab-grid--2 { grid-template-columns: minmax(0, 1fr); } }
.cab-stack { display: grid; gap: 14px; }
.cab-vform fieldset { border: 0; margin: 0; padding: 0; min-width: 0; }
.cab-vform legend { padding: 0; margin-bottom: 8px; }
.cab-vform fieldset + fieldset { margin-top: 18px; }
.cab-kinds__g + .cab-kinds__g { margin-top: 12px; }
.cab-kinds__h { margin: 0 0 6px; font: 600 .72rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.cab-kinds__row, .cab-feats__row, .cab-price__row { display: flex; flex-wrap: wrap; gap: 8px; }
.cab-kind, .cab-chip, .cab-pr { position: relative; }
.cab-kind input, .cab-chip input, .cab-pr input { position: absolute; opacity: 0; inset: 0; width: 100%; height: 100%; margin: 0; cursor: pointer; }
.cab-kind span, .cab-chip span { display: inline-flex; align-items: center; gap: .4em; padding: .55em 1em; border-radius: 999px; border: 1px solid var(--line); background: var(--paper); font-size: .9rem; font-weight: 500; transition: all .18s; }
.cab-kind input:checked + span, .cab-chip input:checked + span { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.cab-kind input:focus-visible + span, .cab-chip input:focus-visible + span, .cab-pr input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.cab-kind:hover span, .cab-chip:hover span, .cab-pr:hover span { border-color: var(--ink); }
.cab-chip input:checked + span::before { content: '✓'; font-weight: 700; }
.cab-pr span { display: grid; gap: 2px; justify-items: center; min-width: 92px; padding: .6em .9em; border-radius: var(--r-sm); border: 1px solid var(--line); background: var(--paper); text-align: center; transition: all .18s; }
.cab-pr b { font: 600 1rem/1.2 var(--sans); color: var(--gold); letter-spacing: .05em; }
.cab-pr small { font-size: .74rem; color: var(--muted); line-height: 1.3; }
.cab-pr input:checked + span { border-color: var(--accent); background: color-mix(in oklab, var(--accent) 10%, var(--paper)); box-shadow: 0 0 0 1px var(--accent); }
.cab-stars .cab-pr span { min-width: 64px; }
.cab-f--err.cab-kinds legend, .cab-f--err.cab-price legend { color: var(--bad); }
.cab-vform[data-group="stay"] [data-show="eat"], .cab-vform[data-group="eat"] [data-show="stay"] { display: none; }
.cab-ltabs { display: flex; gap: 4px; flex-wrap: wrap; border-bottom: 1px solid var(--line); margin-bottom: 18px; }
.cab-ltabs button { padding: .7em 1.05em; border: 0; background: none; border-bottom: 2px solid transparent; margin-bottom: -1px; font-weight: 600; font-size: .92rem; color: var(--muted); }
.cab-ltabs button:hover { color: var(--ink); }
.cab-ltabs [aria-selected="true"] { color: var(--ink); border-bottom-color: var(--accent); }
.cab-dot { color: var(--bad); font-size: .7em; vertical-align: .2em; }
.cab-lang { display: grid; gap: 14px; }
.cab-lang + .cab-lang { margin-top: 24px; padding-top: 20px; border-top: 1px dashed var(--line); }
.cab-langs.is-tabs .cab-lang + .cab-lang { margin-top: 0; padding-top: 0; border-top: 0; }
.cab-langs.is-tabs .cab-lang__t { display: none; }
.cab-savebar { position: sticky; bottom: 10px; z-index: 20; display: flex; flex-wrap: wrap; align-items: center; gap: 8px 16px; padding: 12px 16px;
background: color-mix(in oklab, var(--card) 94%, transparent); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); border: 1px solid var(--line); border-radius: var(--r); box-shadow: var(--shadow-lg); }
@media (max-width: 520px) { .cab-savebar .cab-hint { display: none; } .cab-savebar .btn { width: 100%; justify-content: center; } }
.cab-reqs { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.cab-req { padding: 16px 18px; border: 1px solid var(--line); border-left: 4px solid var(--line); border-radius: var(--r-sm); background: var(--card); scroll-margin-top: calc(var(--hdr) + 16px); }
.cab-req--pending { border-left-color: var(--warn); }
.cab-req--approved { border-left-color: var(--ok); }
.cab-req--rejected { border-left-color: var(--bad); }
.cab-req__h { display: flex; align-items: center; gap: 12px; }
.cab-req__ic { width: 38px; height: 38px; border-radius: 10px; display: grid; place-items: center; background: var(--paper-2); color: var(--accent); flex: none; }
.cab-req__t { display: grid; gap: 2px; flex: 1; min-width: 0; }
.cab-req__t small { color: var(--muted); font-size: .8rem; }
.cab-req__t b { font: 500 1.12rem/1.25 var(--serif); overflow-wrap: anywhere; }
.cab-req__t b a { text-decoration: none; }
.cab-req__adm { display: flex; gap: .55em; align-items: flex-start; margin: 12px 0 0; padding: 10px 12px; border-radius: var(--r-sm); background: color-mix(in oklab, var(--gold) 12%, var(--card)); font-size: .92rem; white-space: pre-line; }
.cab-req__adm .i { color: var(--gold); margin-top: .2em; flex: none; }
.cab-req__note { margin: 10px 0 0; font-size: .9rem; color: var(--ink-2); white-space: pre-line; overflow-wrap: anywhere; }
.cab-ch { margin-top: 10px; font-size: .9rem; }
.cab-ch summary { cursor: pointer; font-weight: 600; color: var(--accent-2); }
.cab-ch dl { margin: 10px 0 0; display: grid; gap: 0; }
.cab-ch dl > div { display: grid; grid-template-columns: minmax(120px, 30%) minmax(0, 1fr); gap: 12px; padding: .55em 0; border-top: 1px dashed var(--line); }
.cab-ch dt { color: var(--muted); }
.cab-ch dd { margin: 0; overflow-wrap: anywhere; }
.cab-old { color: var(--muted); text-decoration: line-through; text-decoration-color: color-mix(in oklab, var(--bad) 60%, transparent); }
.cab-new { font-weight: 500; }
.cab-arr { color: var(--muted); }
.cab-pre { white-space: pre-line; display: inline; }
@media (max-width: 560px) { .cab-ch dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; } .cab-req__h { flex-wrap: wrap; } }
.cab-period { display: inline-flex; gap: 3px; padding: 4px; border-radius: 999px; border: 1px solid var(--line); background: var(--card); margin: 0 0 18px; }
.cab-period a { padding: .5em 1em; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .88rem; color: var(--ink-2); white-space: nowrap; }
.cab-period a:hover { background: var(--paper-2); color: var(--ink); }
.cab-period a[aria-current] { background: var(--ink); color: var(--paper); }
.cab-soon { text-align: center; padding: clamp(32px, 6vw, 64px) 20px; border-radius: var(--r); border: 1px dashed color-mix(in oklab, var(--accent) 40%, var(--line));
background: radial-gradient(600px 220px at 50% 0%, color-mix(in oklab, var(--accent) 9%, transparent), transparent), var(--card); }
.cab-soon > .i { width: 48px; height: 48px; margin: 0 auto 12px; display: block; color: var(--accent); stroke-width: 1.4; }
.cab-soon .cab-h2 { justify-content: center; font: 500 clamp(1.4rem, 2.6vw, 1.9rem)/1.2 var(--serif); }
.cab-soon p { max-width: 58ch; margin: 0 auto; color: var(--ink-2); }
.cab-stats { min-width: 0; }
.cab-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 24px); align-items: start; }
.cab-cols__wide { grid-column: 1 / -1; }
@media (max-width: 860px) { .cab-cols { grid-template-columns: minmax(0, 1fr); } }
.cab-devs { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cab-devs li { display: flex; gap: 12px; align-items: center; padding: 10px 12px; border-radius: var(--r-sm); background: var(--paper-2); }
.cab-devs__ic { width: 36px; height: 36px; border-radius: 10px; display: grid; place-items: center; background: var(--card); color: var(--accent); flex: none; }
.cab-devs li > span:last-child { display: grid; gap: 2px; min-width: 0; }
.cab-devs small { color: var(--muted); font-size: .8rem; overflow-wrap: anywhere; }
.cab-since { margin-top: 18px; }
.cab-errbox { max-width: 620px; }
.cab-errbox__t { font-size: 1.05rem; }
.vown { margin: 0; }
.ftr__links { flex-wrap: wrap; row-gap: 6px; }
.vown a { display: flex; gap: .7em; align-items: flex-start; padding: 12px 14px; border-radius: var(--r-sm); border: 1px dashed color-mix(in oklab, var(--accent) 45%, var(--line)); text-decoration: none; font-size: .9rem; color: var(--ink-2);
background: color-mix(in oklab, var(--accent) 5%, transparent); transition: background .2s, border-color .2s; }
.vown a:hover { background: color-mix(in oklab, var(--accent) 10%, transparent); border-color: var(--accent); color: var(--ink); }
.vown .i { color: var(--accent); margin-top: .15em; flex: none; }
.vown b { color: var(--ink); }
.vhero--stay, .vcat--stay, .vcard--stay, .vdetail--stay, .vphead--stay, .vblock__g--stay, .vtile--stay { --vc: var(--accent-2); }
.vhero--eat, .vcat--eat, .vcard--eat, .vdetail--eat, .vphead--eat, .vblock__g--eat, .vtile--eat { --vc: var(--accent); }
.vcov {
--h: 30; --s: 0; --hh: calc(var(--h) + (var(--s) - 4) * 6);
position: relative; display: block; aspect-ratio: 4 / 3; border-radius: var(--r); overflow: hidden; isolation: isolate;
container-type: inline-size; color: #fff;
background:
radial-gradient(120% 90% at calc(62% + var(--s) * 5%) -12%, hsl(var(--hh) 56% 58% / .5), transparent 60%),
radial-gradient(90% 80% at 0% 112%, hsl(calc(var(--hh) + 48) 50% 30% / .55), transparent 70%),
linear-gradient(calc(150deg + var(--s) * 5deg), hsl(var(--hh) 38% 33%), hsl(calc(var(--hh) + 24) 44% 15%));
box-shadow: var(--shadow);
}
.vcov::before {
content: ''; position: absolute; inset: -12%; z-index: 0; opacity: .17; pointer-events: none;
background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cg fill='none' stroke='white' stroke-width='1.2'%3E%3Crect x='20' y='20' width='24' height='24'/%3E%3Crect x='20' y='20' width='24' height='24' transform='rotate(45 32 32)'/%3E%3Ccircle cx='32' cy='32' r='5'/%3E%3Cpath d='M0 0 20 20M64 0 44 20M0 64 20 44M64 64 44 44M32 0v15M32 64V49M0 32h15M64 32H49'/%3E%3C/g%3E%3C/svg%3E") calc(var(--s) * 9px) calc(var(--s) * 5px) / 60px 60px;
-webkit-mask-image: radial-gradient(120% 95% at 100% 0%, #000 18%, transparent 78%);
mask-image: radial-gradient(120% 95% at 100% 0%, #000 18%, transparent 78%);
transition: transform 1.6s var(--ease-out), opacity .6s;
}
.vcov--eat::before {
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='56' viewBox='0 0 56 56'%3E%3Cg fill='none' stroke='white' stroke-width='1.2'%3E%3Ccircle cx='28' cy='28' r='11'/%3E%3Ccircle cx='28' cy='28' r='3.5'/%3E%3Cpath d='M28 17c4 4 4 7 0 11-4-4-4-7 0-11zM28 39c4-4 4-7 0-11-4 4-4 7 0 11zM17 28c4-4 7-4 11 0-4 4-7 4-11 0zM39 28c-4-4-7-4-11 0 4 4 7 4 11 0z'/%3E%3Ccircle cx='0' cy='0' r='8'/%3E%3Ccircle cx='56' cy='0' r='8'/%3E%3Ccircle cx='0' cy='56' r='8'/%3E%3Ccircle cx='56' cy='56' r='8'/%3E%3Cpath d='M28 0v6M28 56v-6M0 28h6M56 28h-6'/%3E%3C/g%3E%3C/svg%3E");
background-size: 54px 54px;
}
.vcov::after {
content: ''; position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: 0; transition: opacity .45s;
background: radial-gradient(55% 45% at var(--mx, 50%) var(--my, 0%), rgb(255 255 255 / .2), transparent 70%);
}
.vcov.has-img .pic { position: absolute; inset: 0; z-index: 0; width: 100%; height: 100%; transition: transform 1.2s var(--ease-out); }
.vcov.has-img::before { inset: 0; opacity: 1; z-index: 1; mask-image: none; -webkit-mask-image: none;
background: linear-gradient(180deg, rgb(10 8 6 / .35), transparent 30%, transparent 48%, rgb(10 8 6 / .78)); }
.vcov__mono {
position: absolute; z-index: 1; right: -.02em; top: 50%; transform: translateY(-60%);
font: italic 400 160px/.8 var(--serif); font-size: 72cqw; letter-spacing: -.04em;
color: hsl(var(--hh) 70% 86% / .09); -webkit-text-stroke: 1.3px hsl(var(--hh) 75% 88% / .4);
pointer-events: none; user-select: none; transition: transform 1.3s var(--ease-out);
}
.vcov__kind {
position: absolute; z-index: 2; top: 12px; left: 12px; max-width: calc(100% - 96px);
display: inline-flex; align-items: center; gap: .45em; padding: .3em .8em .3em .32em; border-radius: 999px;
background: rgb(255 255 255 / .14); border: 1px solid rgb(255 255 255 / .24);
-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
font: 600 .66rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase;
}
.vcov__kind > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.vcov__kind .i { width: 26px; height: 26px; padding: 5px; border-radius: 50%; background: rgb(255 255 255 / .92); color: hsl(var(--hh) 50% 28%); flex: none; }
.vcov__st { color: hsl(40 85% 76%); font-size: .8rem; letter-spacing: .04em; font-weight: 400; flex: none; }
@container (max-width: 330px) {
.vcov__kind:has(.vcov__st) > span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.vcov__kind:has(.vcov__st) { gap: .4em; padding-right: .7em; }
}
.vcov__p { position: absolute; z-index: 2; top: 14px; right: 14px; padding: .42em .72em; border-radius: 999px; background: rgb(0 0 0 / .24);
font: 700 .76rem/1 var(--sans); letter-spacing: .08em; }
.vcov__p i { font-style: normal; opacity: .36; }
.vcov__foot { position: absolute; z-index: 2; left: 18px; right: 18px; bottom: 16px; display: block; }
.vcov__k { display: none; }
.vcov__t {
margin: 0; padding-top: 14px; color: #fff;
font: 500 1.4rem/1.06 var(--serif); font-size: clamp(1.25rem, 8.4cqw, 2.4rem); letter-spacing: -.015em;
text-shadow: 0 2px 22px rgb(0 0 0 / .28); overflow-wrap: anywhere;
display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden;
background: linear-gradient(hsl(var(--hh) 80% 80%), hsl(var(--hh) 80% 80%)) no-repeat 0 0 / 30px 2px;
transition: background-size .6s var(--ease-out);
}
.vcard { position: relative; min-width: 0; }
.vcard__a { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.vcard__a:hover { color: inherit; }
.vcard__a:hover .vcov::after { opacity: 1; }
.vcard__a:hover .vcov::before { transform: scale(1.07) rotate(1.5deg); opacity: .24; }
.vcard__a:hover .vcov__mono { transform: translateY(-62%) translateX(-5%); }
.vcard__a:hover .vcov__t { background-size: 72px 2px; }
.vcard__a:hover .vcov.has-img .pic { transform: scale(1.05); }
.vcard__a:focus-visible { outline: none; }
.vcard__a:focus-visible .vcov { outline: 3px solid var(--vc, var(--accent)); outline-offset: 3px; }
.vcard__b { flex: 1; display: flex; flex-direction: column; gap: 10px; padding: 14px 2px 2px; }
.vcard__s { margin: 0; color: var(--ink-2); font-size: .95rem; line-height: 1.5;
display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.vcard__m { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: .82rem; color: var(--muted); }
.vcard__loc { display: inline-flex; align-items: center; gap: .35em; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; font-weight: 500; }
.vcard__loc .i { width: 15px; height: 15px; color: var(--vc, var(--accent)); }
.vcard__fx { display: inline-flex; align-items: center; gap: 7px; color: var(--ink-2); flex: none; }
.vcard__fx .i { width: 17px; height: 17px; display: block; }
.vcard__fx small { font-weight: 600; font-size: .76rem; color: var(--muted); }
.rail .vcard[data-reveal] { opacity: 1; transform: none; }
.rail .vcard { height: 100%; }
@media (hover: hover) and (prefers-reduced-motion: no-preference) {
.vcard { perspective: 1100px; }
.vcov { transform: rotateX(var(--rx, 0deg)) rotateY(var(--ry, 0deg)); transition: transform .45s var(--ease-out), box-shadow .45s var(--ease-out); }
.vcard__a:hover .vcov { transform: translateY(-6px) rotateX(var(--rx, 3deg)) rotateY(var(--ry, 0deg)); box-shadow: var(--shadow-lg); }
}
@media (min-width: 1000px) {
.vcard--feature { grid-column: span 2; grid-row: span 2; }
.vcard--feature .vcov { aspect-ratio: auto; flex: 1 1 0; min-height: 340px; }
.vcard--feature .vcov__foot { left: 30px; right: 30%; bottom: 28px; }
.vcard--feature .vcov__t { font-size: clamp(2rem, 6.2cqw, 3.9rem); -webkit-line-clamp: 2; }
.vcard--feature .vcov__k { display: block; margin-top: 10px; max-width: 34ch; font: italic 400 1.15rem/1.35 var(--serif); color: rgb(255 255 255 / .82); }
.vcard--feature .vcov__mono { font-size: 52cqw; right: 3%; }
.vcard--feature .vcov__kind { top: 20px; left: 20px; font-size: .72rem; }
.vcard--feature .vcov__p { top: 22px; right: 22px; font-size: .86rem; }
.vcard--feature .vcard__b { flex: none; }
.vcard--feature .vcard__s { font-size: 1.04rem; -webkit-line-clamp: 2; max-width: 62ch; }
}
.vhero { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(22px, 4vw, 44px) clamp(20px, 3vw, 40px); }
.vhero::before { content: ''; position: absolute; z-index: -1; right: -8%; top: -42%; width: min(900px, 90vw); aspect-ratio: 1; border-radius: 50%;
background: radial-gradient(circle, color-mix(in oklab, var(--vc) 15%, transparent), transparent 58%); pointer-events: none; }
.vhero__in { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: clamp(24px, 5vw, 80px); align-items: center; }
.vhero .crumbs ol { margin-bottom: 20px; }
.vhero .kicker { color: var(--vc); }
.vhero__t { font-size: clamp(2.5rem, 6vw, 5.1rem); line-height: .97; letter-spacing: -.028em; max-width: 13ch; margin-bottom: .32em; }
.vhero__t em { font-style: italic; font-weight: 400; color: var(--vc); }
.vhero .lead { margin-bottom: 0; }
.vhero__stats { display: flex; flex-wrap: wrap; gap: 14px 0; margin: 30px 0 0; }
.vhero__stats > div { padding-inline: 0 28px; margin-right: 28px; border-right: 1px solid var(--line); }
.vhero__stats > div:last-child { border: 0; margin: 0; padding: 0; }
.vhero__stats dt { font: 500 clamp(1.9rem, 3.4vw, 2.7rem)/1 var(--serif); }
.vhero__stats dd { margin: 6px 0 0; color: var(--muted); font-size: .86rem; }
.vswitch { display: inline-flex; gap: 2px; padding: 4px; margin: 0 0 24px; border-radius: 999px; background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow); }
.vswitch a { display: inline-flex; align-items: center; gap: .5em; padding: .55em 1.05em .55em .85em; border-radius: 999px; text-decoration: none; font-weight: 600; font-size: .9rem; color: var(--ink-2); transition: background .25s, color .25s; }
.vswitch a:hover { color: var(--ink); background: var(--paper-2); }
.vswitch a small { font-weight: 500; font-size: .78rem; color: var(--muted); }
.vswitch a[aria-current] { background: var(--ink); color: var(--paper); }
.vswitch a[aria-current] small { color: inherit; opacity: .6; }
.vswitch .i { width: 18px; height: 18px; }
.vorbit { position: relative; width: min(100%, 420px); aspect-ratio: 1; justify-self: end; color: var(--vc); container-type: inline-size; }
.vorbit__rose { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; fill: none; stroke: currentColor; stroke-width: 1.1; }
.vorbit__rose .r-dash { stroke-dasharray: 2 7; stroke-width: 1.5; opacity: .7; }
.vorbit__rose .r-thin { opacity: .35; }
.vorbit__rose .r-star { stroke-width: 1.6; }
.vorbit__rose .r-fill { fill: color-mix(in oklab, currentColor 13%, transparent); }
.vorbit__rose .r-dot { fill: currentColor; }
.vorbit__ring { list-style: none; margin: 0; padding: 0; position: absolute; inset: 0; }
.vorbit__ring li { position: absolute; left: 50%; top: 50%; width: 0; height: 0; transform: rotate(var(--a)) translateY(-46cqw); }
.vorbit__ring span { position: absolute; left: -29px; top: -29px; width: 58px; height: 58px; border-radius: 50%; display: grid; place-items: center;
background: var(--card); color: var(--vc); border: 1px solid color-mix(in oklab, var(--vc) 35%, var(--line)); box-shadow: var(--shadow); transform: rotate(calc(var(--a) * -1)); }
.vorbit__ring .i { width: 26px; height: 26px; }
.vorbit__c { position: absolute; left: 50%; top: 50%; width: 21%; aspect-ratio: 1; translate: -50% -50%; display: grid; place-items: center; border-radius: 50%;
background: var(--vc); color: var(--card); box-shadow: 0 10px 30px -10px color-mix(in oklab, var(--vc) 70%, transparent); }
.vorbit__c .i { width: 44%; height: 44%; }
@media (prefers-reduced-motion: no-preference) {
.vorbit__ring { animation: vspin 90s linear infinite; }
.vorbit__ring span { animation: vspin 90s linear infinite reverse; }
.vorbit .vorbit__rose { animation: vspin 200s linear infinite reverse; }
.vorbit__c { animation: vpulse 4s ease-in-out infinite; }
}
@keyframes vspin { to { rotate: 360deg; } }
@keyframes vpulse { 50% { scale: 1.06; } }
@media (max-width: 900px) { .vhero__in { grid-template-columns: 1fr; } .vorbit { position: absolute; right: -90px; top: 6px; width: 260px; opacity: .28; z-index: -1; } .vorbit__ring, .vorbit__c { display: none; } }
@media (max-width: 560px) { .vorbit { right: -110px; top: -10px; width: 230px; opacity: .22; } .vswitch { margin-bottom: 18px; } .vhero__stats > div { padding-right: 18px; margin-right: 18px; } }
.vcat { padding-bottom: clamp(16px, 3vw, 32px); }
.vkinds { border: 0; margin: 0 0 14px; padding: 0; min-width: 0; }
.vkinds__row { display: flex; gap: 10px; margin-inline: calc(var(--gut) * -1); padding: 4px var(--gut) 6px; overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; scroll-padding-inline: var(--gut); }
.vkinds__row::-webkit-scrollbar { display: none; }
.vkind, .vprice__b, .vfx__it { position: relative; }
.vkind { flex: none; }
.vkind input { position: absolute; opacity: 0; pointer-events: none; }
.vkind > span { display: flex; align-items: center; gap: .65em; padding: 8px 16px 8px 8px; border-radius: 18px; border: 1px solid var(--line); background: var(--card); cursor: pointer; white-space: nowrap;
transition: background .25s, border-color .25s, color .25s, transform .3s var(--ease-out), box-shadow .3s; }
.vkind > span:hover { border-color: color-mix(in oklab, var(--vc) 50%, var(--line)); transform: translateY(-2px); box-shadow: var(--shadow); }
.vkind .i { width: 38px; height: 38px; padding: 8px; border-radius: 12px; background: color-mix(in oklab, var(--vc) 13%, transparent); color: var(--vc); transition: background .25s, color .25s, transform .4s var(--ease-out); }
.vkind > span:hover .i { transform: rotate(-8deg) scale(1.06); }
.vkind b { font-weight: 600; font-size: .95rem; }
.vkind small { color: var(--muted); font-size: .8rem; font-weight: 500; }
.vkind input:checked + span { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.vkind input:checked + span small { color: inherit; opacity: .65; }
.vkind input:checked + span .i { background: var(--vc); color: var(--card); }
.vkind input:focus-visible + span { outline: 2px solid var(--vc); outline-offset: 2px; }
.vkind.is-zero:not(:has(input:checked)) > span { opacity: .45; }
.vf { position: relative; }
.vf__bar { position: sticky; top: calc(var(--hdr) + 8px); z-index: 30; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 8px;
border-radius: 22px; background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow); }
.vf__panel, .vf__body { display: contents; }
.vf__head, .vf__foot, .vf__open, .vf__scrim { display: none; }
.vf__bar > .vsel { margin-left: auto; }
.vsel { position: relative; display: inline-grid; min-width: 0; }
.vsel__l { position: absolute; left: 16px; top: 9px; z-index: 1; font: 600 .62rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); pointer-events: none; white-space: nowrap; }
.vsel select { appearance: none; -webkit-appearance: none; height: 50px; min-width: 132px; max-width: 200px; padding: 20px 38px 6px 15px; border-radius: 16px; border: 1px solid var(--line);
background: var(--paper); font-size: .92rem; font-weight: 500; text-overflow: ellipsis; cursor: pointer; transition: border-color .2s, background .2s; }
.vsel select:hover { border-color: color-mix(in oklab, var(--ink) 40%, var(--line)); }
.vsel select:focus-visible { outline: 2px solid var(--vc); outline-offset: 2px; }
.vsel.is-on select { border-color: var(--ink); background: var(--card); }
.vsel.is-on .vsel__l { color: var(--vc); }
.vsel__i { position: absolute; right: 14px; top: 50%; translate: 0 -50%; width: 16px; height: 16px; color: var(--muted); pointer-events: none; }
.vsel select option:disabled { color: var(--muted); }
.vprice { position: relative; display: flex; align-items: stretch; gap: 3px; height: 50px; padding: 18px 5px 4px; border-radius: 16px; border: 1px solid var(--line); background: var(--paper); margin: 0; min-width: 0; }
.vprice legend { position: absolute; left: 16px; top: 9px; padding: 0; float: none; }
.vprice__row { display: flex; gap: 3px; }
.vprice__b input { position: absolute; opacity: 0; pointer-events: none; }
.vprice__b > span { display: grid; place-items: center; height: 100%; min-width: 42px; padding: 0 8px; border-radius: 10px; cursor: pointer; font-weight: 700; font-size: .84rem; letter-spacing: .04em; color: var(--ink-2); transition: background .2s, color .2s; }
.vprice__b > span:hover { background: var(--paper-2); }
.vprice__b small, .vprice__b i { display: none; }
.vprice__b input:checked + span { background: var(--ink); color: var(--paper); }
.vprice__b input:focus-visible + span { outline: 2px solid var(--vc); outline-offset: 1px; }
.vprice__b.is-zero > span { opacity: .4; }
.vfx { position: relative; }
.vfx__btn { display: inline-flex; align-items: center; height: 50px; min-width: 132px; padding: 20px 38px 6px 15px; border-radius: 16px; border: 1px solid var(--line); background: var(--paper);
font-size: .92rem; font-weight: 500; text-align: left; transition: border-color .2s, background .2s; }
.vfx__btn:hover { border-color: color-mix(in oklab, var(--ink) 40%, var(--line)); }
.vfx__btn.is-on { border-color: var(--ink); background: var(--card); }
.vfx__btn.is-on .vsel__l { color: var(--vc); }
.vfx__btn .vsel__i { transition: rotate .3s var(--ease-out); }
.vfx.is-open .vfx__btn .vsel__i { rotate: 180deg; }
html:not(.js) .vfx__btn { display: none; }
.vfx__panel { border: 0; margin: 0; padding: 0; min-width: 0; }
.vfx__panel legend { display: none; }
.js .vfx__panel { position: absolute; top: calc(100% + 10px); left: 0; z-index: 40; width: min(560px, calc(100vw - 32px)); padding: 14px; border-radius: 20px;
background: var(--card); border: 1px solid var(--line); box-shadow: var(--shadow-lg); display: none; }
.js .vfx.is-open .vfx__panel { display: block; }
@media (prefers-reduced-motion: no-preference) { .js .vfx.is-open .vfx__panel { animation: vpop .28s var(--ease-out); } }
@keyframes vpop { from { opacity: 0; transform: translateY(-6px) scale(.98); } }
.vfx__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 4px; }
.vfx__it input { position: absolute; opacity: 0; pointer-events: none; }
.vfx__it > span { display: flex; align-items: center; gap: .6em; padding: 8px 10px; border-radius: 12px; border: 1px solid transparent; cursor: pointer; font-size: .9rem; transition: background .2s, border-color .2s; }
.vfx__it > span:hover { background: var(--paper-2); }
.vfx__it .i { width: 30px; height: 30px; padding: 6px; border-radius: 9px; background: color-mix(in oklab, var(--vc) 11%, transparent); color: var(--vc); flex: none; }
.vfx__it small { margin-left: auto; color: var(--muted); font-size: .78rem; }
.vfx__it input:checked + span { background: color-mix(in oklab, var(--vc) 12%, var(--card)); border-color: color-mix(in oklab, var(--vc) 45%, transparent); font-weight: 600; }
.vfx__it input:checked + span .i { background: var(--vc); color: var(--card); }
.vfx__it input:focus-visible + span { outline: 2px solid var(--vc); outline-offset: 1px; }
.vfx__it.is-zero:not(:has(input:checked)) > span { opacity: .42; }
.vf__open { align-items: center; gap: .55em; height: 50px; padding: 0 18px 0 14px; border-radius: 16px; border: 1px solid var(--ink); background: var(--ink); color: var(--paper); font-weight: 600; font-size: .92rem; }
.vf__open .i { width: 19px; height: 19px; }
.vf__open b { min-width: 22px; height: 22px; padding: 0 6px; border-radius: 999px; display: grid; place-items: center; background: var(--vc); color: var(--card); font-size: .74rem; }
@media (max-width: 1180px) and (min-width: 1101px) {
.vsel select { max-width: 158px; min-width: 116px; padding-right: 34px; }
.vfx__btn { min-width: 116px; padding-right: 34px; }
.vprice__b > span { min-width: 34px; padding: 0 6px; }
.vsel__i { right: 11px; }
}
@media (max-width: 1100px) {
.vf__bar { top: calc(var(--hdr) + 6px); }
.js .vf__open { display: inline-flex; }
.js .vf__bar > .vsel select { min-width: 0; max-width: 46vw; }
.js .vf__panel { position: fixed; z-index: 130; left: 0; right: 0; bottom: 0; display: flex; flex-direction: column; max-height: min(88vh, 760px);
background: var(--card); color: var(--ink); border-radius: 24px 24px 0 0; box-shadow: 0 -20px 60px -20px rgb(0 0 0 / .45);
transform: translateY(104%); visibility: hidden; transition: transform .45s var(--ease-out), visibility 0s linear .45s; }
.js .vf__panel.is-open { transform: none; visibility: visible; transition: transform .45s var(--ease-out); }
.js .vf__head { display: flex; align-items: center; justify-content: space-between; position: relative; padding: 20px 12px 8px 20px; }
.vf__head h2 { margin: 0; font-size: 1.5rem; }
.vf__grip { position: absolute; left: 50%; top: 8px; translate: -50% 0; width: 44px; height: 5px; border-radius: 9px; background: var(--line); }
.js .vf__body { display: flex; flex-direction: column; gap: 14px; padding: 8px 20px 20px; overflow-y: auto; overscroll-behavior: contain; }
.js .vf__foot { display: flex; gap: 10px; padding: 12px 16px calc(12px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); }
.js .vf__foot .btn { justify-content: center; }
.js .vf__foot .btn--accent { flex: 1; }
.js .vf__body .vsel select { width: 100%; max-width: none; height: 56px; }
.js .vf__body .vsel__l { top: 11px; }
.js .vprice { height: auto; padding: 30px 6px 6px; }
.js .vprice__row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; width: 100%; }
.js .vprice__b > span { display: grid; place-items: start; gap: 2px; padding: 10px 12px; border: 1px solid var(--line); text-align: left; }
.js .vprice__b small { display: block; font-weight: 500; font-size: .76rem; letter-spacing: 0; color: inherit; opacity: .75; }
.js .vprice__b b { font-size: 1rem; }
.js .vfx__btn { display: none; }
.js .vfx__panel { position: static; display: block; width: auto; padding: 0; border: 0; box-shadow: none; background: none; animation: none; }
.js .vfx__panel legend { display: block; font: 600 .62rem/1 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin: 6px 0 10px; padding: 0; }
.vfx__grid { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); }
.js .vf__panel { width: min(100%, 680px); margin-inline: auto; }
.js .vf__scrim { display: block; position: fixed; inset: 0; z-index: 125; background: rgb(18 14 10 / .5); opacity: 0; transition: opacity .35s; }
.js .vf__scrim.is-on { opacity: 1; }
html.vf-lock { overflow: hidden; }
html.vf-lock .vf__bar { z-index: 140; }
.vkind > span { padding: 6px 14px 6px 6px; border-radius: 15px; gap: .55em; }
.vkind .i { width: 32px; height: 32px; padding: 7px; border-radius: 10px; }
.vkind b { font-size: .9rem; }
}
@media (max-width: 1100px) { html:not(.js) .vf__bar { position: static; } html:not(.js) .vsel select { max-width: none; } }
.vres { padding-top: clamp(18px, 3vw, 30px); }
.vres__h { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 18px; margin-bottom: clamp(18px, 3vw, 28px); }
.vres__n { margin: 0; color: var(--muted); font-size: .92rem; }
.vres__n b { font: 500 1.7rem/1 var(--serif); color: var(--ink); margin-right: .1em; }
.vact { list-style: none; display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; }
.vact a { display: inline-flex; align-items: center; gap: .45em; padding: .42em .6em .42em .9em; border-radius: 999px; font-size: .84rem; font-weight: 500; text-decoration: none;
background: color-mix(in oklab, var(--vc) 11%, var(--card)); border: 1px solid color-mix(in oklab, var(--vc) 32%, transparent); transition: background .2s, border-color .2s; }
.vact a:hover { color: inherit; border-color: var(--vc); background: color-mix(in oklab, var(--vc) 20%, var(--card)); }
.vact a .i { width: 14px; height: 14px; opacity: .7; }
.vact a.vact__reset { background: none; border-color: transparent; color: var(--muted); text-decoration: underline; text-underline-offset: .2em; }
.vgrid { display: grid; grid-template-columns: minmax(0, 1fr); gap: clamp(26px, 3vw, 38px) clamp(16px, 2vw, 28px); }
@media (min-width: 620px) { .vgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 1000px) { .vgrid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.vres .empty .i { color: var(--vc); }
.vres .pager { margin-top: clamp(36px, 5vw, 56px); }
@media (prefers-reduced-motion: no-preference) {
.vcat.is-busy .vgrid { opacity: .5; transition: opacity .25s .1s; }
.vcard.is-enter { animation: vIn .6s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 35ms); }
::view-transition-group(*.vcard) { animation-duration: .55s; animation-timing-function: var(--ease-out); }
::view-transition-new(*.vcard):only-child { animation: vIn .5s var(--ease-out) both; }
::view-transition-old(*.vcard):only-child { animation: vOut .25s ease both; }
}
@keyframes vIn { from { opacity: 0; transform: translateY(22px) scale(.97); } }
@keyframes vOut { to { opacity: 0; transform: scale(.94); } }
.vphead { min-height: min(70vh, 660px); margin-top: 0; }
.vphead .phead__media { background: var(--ink); }
.vphead .vcov--hero { position: absolute; inset: 0; aspect-ratio: auto; border-radius: 0; box-shadow: none; transform: none; }
.vphead .vcov--hero::before { opacity: .2; }
.vphead .vcov--hero .vcov__mono { font-size: 50cqw; right: 3%; top: 44%; -webkit-text-stroke-width: 2px; }
.vphead .kicker .i { width: 1.25em; height: 1.25em; }
.vphead .phead__in { padding-bottom: clamp(64px, 9vw, 120px); }
.vphead .phead__credit { bottom: clamp(46px, 6.6vw, 84px); }
.vstars { color: var(--gold); letter-spacing: .06em; }
.phead--img .vstars { color: #f3c98b; font-size: 1.1rem; }
.vstrip { position: relative; z-index: 2; margin-top: clamp(-72px, -6vw, -36px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
background: var(--card); border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow-lg); overflow: hidden; }
.vstrip__c { display: flex; flex-direction: column; gap: 7px; padding: 20px 22px; min-width: 0; }
.vstrip__c + .vstrip__c { border-left: 1px solid var(--line); }
.vstrip__k { font: 600 .66rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--vc); }
.vstrip__v { font: 500 1.7rem/1.1 var(--serif); overflow-wrap: anywhere; }
.vstrip__v--sm { font: 600 1rem/1.4 var(--sans); }
.vstrip__v--io { display: flex; flex-wrap: wrap; gap: 4px 16px; font: 500 1.35rem/1.2 var(--serif); }
.vstrip__v--io span { display: inline-flex; align-items: center; gap: .3em; }
.vstrip__v--io .i { width: 18px; height: 18px; color: var(--vc); }
.vprice-big { letter-spacing: .08em; } .vprice-big i { font-style: normal; opacity: .22; }
.vstrip__s { font-size: .82rem; color: var(--muted); line-height: 1.4; }
.vstrip__tel, .vstrip__go { display: inline-flex; align-items: center; gap: .45em; text-decoration: none; }
.vstrip__tel .i, .vstrip__go .i { color: var(--vc); width: 16px; height: 16px; }
.vstrip__go { font-weight: 600; color: var(--ink-2); }
@media (max-width: 900px) {
.vstrip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.vstrip__c:nth-child(n + 3) { grid-column: 1 / -1; border-left: 0; border-top: 1px solid var(--line); }
.vstrip__c { padding: 16px; }
.vstrip__v { font-size: 1.45rem; }
.vstrip__v--sm { font-size: .95rem; }
.vstrip__v--io { font-size: 1.2rem; }
}
.vdetail .article { margin-top: clamp(36px, 5vw, 64px); }
.vfeat { margin: 36px 0 28px; }
.vfeat .kicker { color: var(--vc); }
.vfeat .kicker .i { width: 18px; height: 18px; }
.vfeat ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 150px), 1fr)); gap: 10px; }
.vfeat li { display: flex; align-items: center; gap: .75em; padding: 10px 14px 10px 10px; border-radius: 14px; background: var(--card); border: 1px solid var(--line); font-size: .93rem; font-weight: 500;
transition: border-color .25s, transform .3s var(--ease-out); }
.vfeat li:hover { border-color: color-mix(in oklab, var(--vc) 45%, var(--line)); transform: translateY(-2px); }
.vfeat li .i { width: 38px; height: 38px; padding: 8px; border-radius: 11px; background: color-mix(in oklab, var(--vc) 12%, transparent); color: var(--vc); flex: none; }
.vdetail .tips { margin-top: 28px; }
.vnote { display: flex; gap: .7em; align-items: flex-start; margin: 28px 0 0; padding: 14px 16px; border-radius: 14px; background: var(--paper-2); color: var(--ink-2); font-size: .88rem; line-height: 1.55; }
.vnote .i { color: var(--ok); flex: none; margin-top: .2em; }
.vnote b { font-weight: 600; color: var(--ink); }
.vcontact .kicker { color: var(--vc); }
.vcontact .contacts .i { color: var(--vc); }
.vcontact__call { margin-top: 18px; width: 100%; justify-content: center; }
.vcontact__call.btn--accent { background: var(--vc); border-color: var(--vc); color: var(--card); }
.vnear { position: relative; height: 100%; }
.vnear__km { position: absolute; z-index: 3; top: 12px; left: 12px; display: inline-flex; align-items: center; gap: .35em; padding: .4em .72em; border-radius: 999px;
background: rgb(255 253 249 / .93); color: #1c1a17; font: 600 .74rem/1 var(--sans); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); pointer-events: none; }
.vnear__km .i { width: 13px; height: 13px; color: var(--accent); }
.vblock__g + .vblock__g { margin-top: clamp(34px, 5vw, 60px); }
.vblock__h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 20px; margin-bottom: 18px; }
.vblock__h h3 { display: inline-flex; align-items: center; gap: .55em; margin: 0; font-size: clamp(1.35rem, 2.2vw, 1.8rem); }
.vblock__h h3 .i { width: 42px; height: 42px; padding: 9px; border-radius: 13px; background: color-mix(in oklab, var(--vc) 14%, transparent); color: var(--vc); }
.vblock__h h3 small { font: 600 .82rem/1 var(--sans); color: var(--muted); padding: .35em .6em; border-radius: 999px; background: var(--paper-2); }
.vblock__h .more { color: var(--vc); }
.vblock .rail__track, .vhome .rail__track { grid-auto-columns: minmax(270px, 24%); }
@media (max-width: 700px) { .vblock .rail__track, .vhome .rail__track { grid-auto-columns: 80%; } }
.vhome__tiles { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(16px, 2.4vw, 28px); margin-bottom: clamp(36px, 5vw, 64px); }
@media (max-width: 760px) { .vhome__tiles { grid-template-columns: minmax(0, 1fr); } }
.vtile { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; min-height: 320px; padding: clamp(24px, 3.4vw, 40px);
border-radius: 26px; border: 1px solid color-mix(in oklab, var(--vc) 24%, var(--line));
background: linear-gradient(150deg, color-mix(in oklab, var(--vc) 15%, var(--card)), var(--card) 72%); transition: transform .5s var(--ease-out), box-shadow .5s var(--ease-out); }
.vtile:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); }
.vtile__art { position: absolute; z-index: -1; right: -16%; top: -26%; width: 60%; aspect-ratio: 1; color: var(--vc); opacity: .4; transition: transform 1.8s var(--ease-out);
-webkit-mask-image: radial-gradient(closest-side, #000 55%, transparent 100%); mask-image: radial-gradient(closest-side, #000 55%, transparent 100%); }
.vtile:hover .vtile__art { transform: rotate(22.5deg) scale(1.05); }
.vtile .kicker { color: var(--vc); }
.vtile__t { font-size: clamp(2.1rem, 4.4vw, 3.5rem); margin: 0 0 .12em; letter-spacing: -.02em; }
.vtile__a { text-decoration: none; }
.vtile__a::after { content: ''; position: absolute; inset: 0; z-index: 0; border-radius: inherit; }
.vtile__a:hover { color: inherit; }
.vtile__a:focus-visible { outline: none; }
.vtile:has(.vtile__a:focus-visible) { outline: 3px solid var(--vc); outline-offset: 3px; }
.vtile__n { margin: 0 0 18px; color: var(--ink-2); }
.vtile__n b { font: 500 1.7rem/1 var(--serif); color: var(--vc); margin-right: .15em; }
.vtile__kinds { list-style: none; margin: 0 0 22px; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: .93rem; font-weight: 500; }
.vtile__kinds li { display: inline-flex; align-items: center; gap: .45em; }
.vtile__kinds .i { color: var(--vc); width: 20px; height: 20px; }
.vtile__kinds small { color: var(--muted); font-weight: 500; }
.vtile__regs { position: relative; z-index: 1; margin: auto 0 0; padding-right: 70px; display: flex; flex-wrap: wrap; gap: 6px; }
.vtile__regs a { padding: .4em .8em; border-radius: 999px; background: var(--card); border: 1px solid var(--line); font-size: .82rem; font-weight: 500; text-decoration: none; transition: border-color .2s, color .2s; }
.vtile__regs a:hover { border-color: var(--vc); color: var(--vc); }
.vtile__regs small { color: var(--muted); }
.vtile__go { position: absolute; right: clamp(20px, 3vw, 32px); bottom: clamp(20px, 3vw, 32px); width: 54px; height: 54px; border-radius: 50%; display: grid; place-items: center;
background: var(--ink); color: var(--paper); transition: transform .45s var(--ease-out), background .3s; pointer-events: none; }
.vtile__go .i { width: 22px; height: 22px; }
@media (max-width: 560px) { .vtile__go { width: 44px; height: 44px; } .vtile__regs { padding-right: 52px; } .vtile { min-height: 0; } }
.vtile:hover .vtile__go { transform: rotate(45deg); background: var(--vc); color: var(--card); }
.vhome__picks > .kicker { margin-bottom: 16px; }
@media (prefers-reduced-motion: reduce) {
.vcov, .vcov::before, .vcov__mono, .vtile, .vtile__art, .vkind > span, .vkind .i { transition: none !important; }
.vcard__a:hover .vcov::before, .vcard__a:hover .vcov__mono, .vtile:hover .vtile__art, .vtile:hover { transform: none; }
}
.cx-dark {
--bg: var(--ink); --fg: var(--paper);
--fg-2: color-mix(in oklab, var(--paper) 74%, transparent);
--ln: color-mix(in oklab, var(--paper) 16%, transparent);
background: var(--bg); color: var(--fg);
}
:root[data-theme="dark"] .cx-dark {
--bg: var(--paper-2); --fg: var(--ink);
--fg-2: color-mix(in oklab, var(--ink) 72%, transparent);
--ln: color-mix(in oklab, var(--ink) 14%, transparent);
}
@media (prefers-color-scheme: dark) {
:root[data-theme="auto"] .cx-dark {
--bg: var(--paper-2); --fg: var(--ink);
--fg-2: color-mix(in oklab, var(--ink) 72%, transparent);
--ln: color-mix(in oklab, var(--ink) 14%, transparent);
}
}
.cx-dark .kicker, .cx-dark .mi .i { color: var(--gold); }
.cx-dark .crumbs ol, .cx-dark .crumbs a { color: var(--fg-2); }
.cx-dark .sec__t, .cx-dark h2, .cx-dark h3 { color: var(--fg); }
.cx-dark .sec__lead, .cx-dark .lead { color: var(--fg-2); }
.cx-dark .more { color: var(--fg); }
.cx-dark .more:hover { color: var(--gold); }
.cx-dark .btn--light { background: var(--fg); color: var(--bg); border-color: var(--fg); }
.cx-dark .btn--light:hover { background: var(--gold); border-color: var(--gold); color: var(--bg); }
.btn--line { background: transparent; color: inherit; border-color: color-mix(in oklab, currentColor 35%, transparent); }
.btn--line:hover { background: color-mix(in oklab, currentColor 12%, transparent); color: inherit; border-color: currentColor; }
.cx-dark .rail__nav .ibtn { border-color: var(--ln); color: var(--fg); }
.cx-dark .rail__nav .ibtn:hover { background: color-mix(in oklab, var(--fg) 10%, transparent); }
.cx-girih { position: absolute; inset: 0; pointer-events: none; z-index: -1; background: currentColor; opacity: .07;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.2'%3E%3Crect x='28' y='28' width='40' height='40'/%3E%3Crect x='28' y='28' width='40' height='40' transform='rotate(45 48 48)'/%3E%3Ccircle cx='48' cy='48' r='8'/%3E%3Cpath d='M0 48h20M76 48h20M48 0v20M48 76v20'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 96px 96px repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.2'%3E%3Crect x='28' y='28' width='40' height='40'/%3E%3Crect x='28' y='28' width='40' height='40' transform='rotate(45 48 48)'/%3E%3Ccircle cx='48' cy='48' r='8'/%3E%3Cpath d='M0 48h20M76 48h20M48 0v20M48 76v20'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 96px 96px repeat; }
.cx-hero { position: relative; isolation: isolate; overflow: hidden; padding-block: clamp(28px, 5vw, 64px) clamp(36px, 6vw, 80px); }
.cx-hero__in { position: relative; z-index: 1; }
.cx-hero__k { margin-bottom: 1.1em; }
.cx-hero__t { font-size: clamp(2.7rem, 8.6vw, 7.6rem); line-height: .93; letter-spacing: -.035em; font-weight: 500; max-width: 12.5ch; margin: 0 0 .32em; text-wrap: balance; }
.cx-hero__t em { font-style: italic; font-weight: 400; color: var(--accent); }
.cx-hero__lead { font-size: clamp(1.06rem, 1.6vw, 1.3rem); line-height: 1.55; color: var(--ink-2); max-width: 56ch; margin: 0; }
.cx-hero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 26px; margin-top: clamp(22px, 3vw, 34px); color: var(--ink-2); font-size: .95rem; }
.cx-hero__cta { display: flex; flex-wrap: wrap; gap: 10px; margin: clamp(24px, 3vw, 36px) 0 0; }
.cx-hero:not(.cx-hero--dark) { border-bottom: 1px solid var(--line); color: var(--ink); }
.cx-hero:not(.cx-hero--dark)::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
background: radial-gradient(ellipse 55% 75% at 96% 0%, color-mix(in oklab, var(--accent) 10%, transparent), transparent 70%); }
.cx-hero--dark { padding-top: calc(var(--hdr) + clamp(36px, 7vw, 100px)); padding-bottom: 0; }
.cx-hero--dark .cx-hero__in { padding-bottom: clamp(40px, 6vw, 80px); }
.cx-hero--dark .cx-hero__t em { color: var(--gold); }
.cx-hero--dark .cx-hero__lead, .cx-hero--dark .cx-hero__meta { color: var(--fg-2); }
.cx-hero--dark::before { content: ''; position: absolute; inset: 0; z-index: -2; pointer-events: none;
background: radial-gradient(ellipse 55% 60% at 85% 15%, color-mix(in oklab, var(--accent) 34%, transparent), transparent 70%),
radial-gradient(ellipse 50% 55% at 5% 95%, color-mix(in oklab, var(--accent-2) 30%, transparent), transparent 70%); }
.cx-hero--dark::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; opacity: .09; background: var(--fg);
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23000' stroke-width='1'%3E%3Crect x='28' y='28' width='40' height='40'/%3E%3Crect x='28' y='28' width='40' height='40' transform='rotate(45 48 48)'/%3E%3Ccircle cx='48' cy='48' r='8'/%3E%3Cpath d='M0 48h20M76 48h20M48 0v20M48 76v20'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 96px 96px repeat, radial-gradient(ellipse at 75% 30%, #000, transparent 70%);
-webkit-mask-composite: source-in;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='96' viewBox='0 0 96 96'%3E%3Cg fill='none' stroke='%23000' stroke-width='1'%3E%3Crect x='28' y='28' width='40' height='40'/%3E%3Crect x='28' y='28' width='40' height='40' transform='rotate(45 48 48)'/%3E%3Ccircle cx='48' cy='48' r='8'/%3E%3Cpath d='M0 48h20M76 48h20M48 0v20M48 76v20'/%3E%3C/g%3E%3C/svg%3E") 0 0 / 96px 96px repeat, radial-gradient(ellipse at 75% 30%, #000, transparent 70%);
mask-composite: intersect; }
.cx-hero__deco { position: absolute; z-index: 0; right: -.04em; bottom: -.16em; pointer-events: none; user-select: none; line-height: .8; }
.cx-hero__deco span { display: block; font: 500 clamp(9rem, 30vw, 28rem)/.8 var(--serif); letter-spacing: -.05em; white-space: nowrap; color: transparent;
-webkit-text-stroke: 1.5px color-mix(in oklab, var(--fg, var(--ink)) 22%, transparent); }
.cx-hero:not(.cx-hero--dark) .cx-hero__deco span { -webkit-text-stroke-color: color-mix(in oklab, var(--accent) 30%, transparent); }
.cx-hero__deco--month span { font-size: clamp(6rem, 19vw, 18rem); font-style: italic; }
.cx-hero__deco--days span { font-size: clamp(10rem, 34vw, 30rem); }
@media (max-width: 700px) { .cx-hero__deco { opacity: .7; } .cx-hero__deco--days { display: none; } }
.cx-stats { display: flex; flex-wrap: wrap; gap: 12px clamp(24px, 4vw, 56px); margin: 0; }
.cx-stats > div { display: flex; flex-direction: column-reverse; }
.cx-stats dd { margin: 0; font: 500 clamp(2rem, 4.2vw, 3.4rem)/1 var(--serif); letter-spacing: -.02em; color: var(--accent); font-variant-numeric: lining-nums; }
.cx-hero--dark .cx-stats dd { color: var(--fg); }
.cx-stats dt { font: 600 .72rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); margin-top: 6px; }
.cx-hero--dark .cx-stats dt { color: var(--gold); }
.cx-marq { --gap: clamp(1.4rem, 3vw, 2.6rem); padding-block: clamp(16px, 2.4vw, 26px); border-top: 1px solid var(--line); font: italic 400 clamp(1.2rem, 2.4vw, 1.9rem)/1.2 var(--serif); }
.cx-marq .marquee__it { color: var(--ink-2); transition: color .25s; }
.cx-marq .marquee__it:hover { color: var(--accent); }
.cx-marq small { font: 600 .68rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; font-style: normal; color: var(--muted); margin-left: .25em; }
.cx-marq--dark { border-color: var(--ln); }
.cx-marq--dark .marquee__it { color: var(--fg); }
.cx-marq--dark .marquee__it:hover { color: var(--gold); }
.cx-marq--dark small { color: var(--gold); }
.cx-marq--dark .marquee__it .star { color: var(--gold); }
.cx-marq--big { font: 500 clamp(1.9rem, 5.4vw, 4rem)/1.08 var(--serif); font-style: normal; letter-spacing: -.015em; border-bottom: 1px solid var(--line); }
.cx-marq--big .marquee__it { color: var(--ink); }
.cx-marq--big .marquee__it:nth-child(even) { font-style: italic; font-weight: 400; color: var(--ink-2); }
.cx-hero .cx-marq { margin-top: clamp(26px, 4vw, 48px); }
.cx-hero:not(.cx-hero--dark) .cx-marq--big { margin-bottom: calc(clamp(36px, 6vw, 80px) * -1); border-bottom: 0; }
.cx-hero__now { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5em; margin: clamp(22px, 3vw, 32px) 0 0; padding: .7em 1.1em; border-radius: 999px; border: 1px solid var(--ln); font-size: .95rem; color: var(--fg-2); }
.cx-hero__now b { color: var(--fg); font-weight: 600; }
.cx-hero__now .i { color: var(--gold); }
.cx-hero__ic { position: absolute; z-index: 0; right: max(var(--gut), calc((100vw - var(--wrap)) / 2 + var(--gut))); top: 50%; translate: 0 -50%;
width: clamp(120px, 20vw, 260px); aspect-ratio: 1; border-radius: 50%; display: grid; place-items: center; color: var(--accent);
background: radial-gradient(circle, color-mix(in oklab, var(--accent) 12%, var(--card)) 0 58%, transparent 59%),
repeating-conic-gradient(from 0deg, color-mix(in oklab, var(--accent) 22%, transparent) 0 6deg, transparent 6deg 15deg); }
.cx-hero__ic .i { width: 42%; height: 42%; stroke-width: 1.2; }
@media (prefers-reduced-motion: no-preference) { .cx-hero__ic { animation: cxSpin 80s linear infinite; } .cx-hero__ic .i { animation: cxSpin 80s linear infinite reverse; } }
@keyframes cxSpin { to { rotate: 360deg; } }
.cx-hero--item .cx-hero__t { font-size: clamp(2.4rem, 6.4vw, 5.6rem); max-width: 15ch; }
.cx-hero--item .cx-hero__in > *:not(.crumbs) { max-width: min(100%, 760px); }
@media (max-width: 900px) { .cx-hero__ic { width: 150px; right: -30px; top: 30px; translate: 0 0; opacity: .35; } }
@media (max-width: 600px) { .cx-hero__ic { display: none; } }
.cx-hero__cal { position: absolute; z-index: 0; right: max(var(--gut), calc((100vw - var(--wrap)) / 2 + var(--gut))); top: 50%; translate: 0 -50%; rotate: 4deg;
display: grid; justify-items: center; align-content: center; gap: 4px; width: clamp(140px, 18vw, 220px); aspect-ratio: 4 / 4.4; padding: 18px;
border-radius: 18px; background: var(--card); box-shadow: var(--shadow-lg); border-top: 14px solid var(--accent); }
.cx-hero__cal b { font: 500 clamp(3.6rem, 7vw, 6rem)/.9 var(--serif); }
.cx-hero__cal span { font: 600 .8rem/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
@media (max-width: 900px) { .cx-hero__cal { position: static; translate: none; rotate: 0deg; margin-top: 24px; width: 140px; } }
.cx-hero__icons { position: absolute; z-index: 0; right: max(var(--gut), calc((100vw - var(--wrap)) / 2 + var(--gut))); top: 50%; translate: 0 -50%;
display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(10px, 1.4vw, 18px); width: clamp(220px, 28vw, 380px); }
.cx-hero__icons span { display: grid; place-items: center; aspect-ratio: 1; border-radius: 22px; background: var(--card); border: 1px solid var(--line); color: var(--accent); box-shadow: var(--shadow); }
.cx-hero__icons span:nth-child(even) { background: color-mix(in oklab, var(--accent-2) 10%, var(--card)); color: var(--accent-2); }
.cx-hero__icons .i { width: 40%; height: 40%; stroke-width: 1.4; }
@media (prefers-reduced-motion: no-preference) { .cx-hero__icons span { animation: cxFloat 6s ease-in-out infinite; animation-delay: calc(var(--k) * -.7s); } }
@keyframes cxFloat { 50% { transform: translateY(-9px) rotate(-2deg); } }
@media (max-width: 1100px) { .cx-hero__icons { display: none; } }
@media (min-width: 1101px) { .cx-hero--guide .cx-hero__in > * { max-width: calc(100% - clamp(220px, 28vw, 380px) - 48px); } }
.cx-hero--hist .cx-hero__t { max-width: 11ch; }
.cx-hero--hist .cx-hero__deco { bottom: clamp(70px, 9vw, 120px); }
.cx-hero--hist .cx-hero__deco span { font-size: clamp(7rem, 21vw, 19rem); }
.cx-intro { padding-block: clamp(64px, 11vw, 150px) clamp(28px, 4vw, 56px); }
.cx-intro__t { font: 400 clamp(1.6rem, 3.9vw, 3.3rem)/1.22 var(--serif); letter-spacing: -.015em; max-width: 27ch; margin: 0; text-wrap: pretty; }
.cx-eranav, .cx-tabs, .cx-months { position: sticky; top: var(--hdr); z-index: 30; background: color-mix(in oklab, var(--paper) 88%, transparent);
-webkit-backdrop-filter: saturate(1.3) blur(14px); backdrop-filter: saturate(1.3) blur(14px); border-block: 1px solid var(--line); }
.cx-eranav__in, .cx-tabs ol, .cx-months ol { position: relative; display: flex; gap: 4px; list-style: none; margin: 0; padding: 8px 0; overflow-x: auto; scrollbar-width: none; overscroll-behavior-x: contain; }
.cx-eranav__in { max-width: var(--wrap); margin-inline: auto; padding-inline: var(--gut); }
.cx-eranav__in::-webkit-scrollbar, .cx-tabs ol::-webkit-scrollbar, .cx-months ol::-webkit-scrollbar { display: none; }
.cx-eranav a, .cx-tabs a, .cx-months a { display: inline-flex; align-items: baseline; gap: .45em; padding: .55em .85em; border-radius: 999px; font-size: .88rem; font-weight: 500;
white-space: nowrap; text-decoration: none; color: var(--ink-2); transition: background .25s, color .25s; }
.cx-eranav a:hover, .cx-tabs a:hover, .cx-months a:hover { background: color-mix(in oklab, var(--ink) 7%, transparent); color: var(--ink); }
.cx-eranav a { font-size: .85rem; }
@media (max-width: 1360px) { .cx-eranav__in { -webkit-mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); mask-image: linear-gradient(90deg, #000 calc(100% - 48px), transparent); } }
.cx-eranav__n { font: 600 .68rem/1 var(--sans); letter-spacing: .06em; color: var(--muted); font-variant-numeric: tabular-nums; }
.cx-eranav a.is-on, .cx-tabs a.is-on, .cx-months a.is-on { background: var(--ink); color: var(--paper); }
.cx-eranav a.is-on .cx-eranav__n { color: var(--gold); }
.cx-tlbar { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 24px; padding-block: clamp(26px, 4vw, 44px) 4px; scroll-margin-top: calc(var(--hdr) + 60px); }
.cx-tlf { min-width: 0; flex: 1 1 520px; }
.cx-tlf .chip { position: relative; } 
.cx-tlbar .count { margin: 0; }
.cx-tl-end { padding-block: 40px; color: var(--muted); text-align: center; }
.cx-era { position: relative; scroll-margin-top: calc(var(--hdr) + 58px); }
.cx-era + .cx-era { border-top: 1px solid var(--line); }
.cx-era__in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: 0 clamp(32px, 5vw, 88px); }
.cx-era__h { padding-block: clamp(44px, 6vw, 88px) 24px; }
.cx-era__hin { position: sticky; top: calc(var(--hdr) + 84px); }
.cx-era__no { display: flex; align-items: center; gap: .7em; margin: 0 0 1.1em; font: 600 .76rem/1 var(--sans); letter-spacing: .16em; color: var(--muted); font-variant-numeric: tabular-nums; }
.cx-era__no span { color: var(--accent); }
.cx-era__no::after { content: ''; width: 56px; height: 1px; background: currentColor; opacity: .5; }
.cx-era__t { font-size: clamp(2.3rem, 4.6vw, 4.3rem); line-height: .96; letter-spacing: -.03em; margin: 0 0 .28em; }
.cx-era__t a { text-decoration: none; background: linear-gradient(currentColor, currentColor) 0 100% / 0 2px no-repeat; transition: background-size .5s var(--ease-out), color .2s; }
.cx-era__t a:hover { color: var(--accent); background-size: 100% 2px; }
.cx-era__y { font: italic 400 clamp(1.08rem, 1.6vw, 1.32rem)/1.3 var(--serif); color: var(--accent); margin: 0 0 1em; }
.cx-era__s { color: var(--ink-2); max-width: 40ch; margin: 0 0 1em; }
.cx-era__n { font-size: .84rem; color: var(--muted); margin: 0 0 1.1em; }
.cx-era__img { position: relative; margin: 0 0 1.2em; max-width: 380px; aspect-ratio: 4 / 3; border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); background: var(--paper-3); }
.cx-era__img .pic { position: absolute; inset: 0; }
.cx-era__img img { filter: sepia(.25) saturate(.85) contrast(1.02); }
.cx-era__img figcaption { position: absolute; left: 10px; bottom: 10px; padding: .3em .7em; border-radius: 999px; font-size: .72rem; font-weight: 500;
background: color-mix(in oklab, var(--card) 86%, transparent); color: var(--ink); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
@media (max-height: 760px) and (min-width: 901px) { .cx-era__img { display: none; } }
.cx-evs { --pad: clamp(34px, 4vw, 58px); position: relative; list-style: none; margin: 0; padding: clamp(44px, 6vw, 88px) 0 clamp(36px, 5vw, 72px) var(--pad); }
.cx-evs::before, .cx-evs::after { content: ''; position: absolute; left: 0; top: 0; bottom: 0; width: 2px; border-radius: 2px; }
.cx-evs::before { background: var(--line); }
.cx-evs::after { background: linear-gradient(180deg, var(--gold), var(--accent)); transform-origin: 50% 0; transform: scaleY(var(--p, 0)); }
.no-js .cx-evs::after { transform: none; }
.cx-ev { position: relative; padding-bottom: clamp(40px, 5.5vw, 72px); scroll-margin-top: calc(var(--hdr) + 80px); }
.cx-ev:last-child { padding-bottom: 0; }
.cx-ev::before { content: ''; position: absolute; left: calc(var(--pad) * -1 - 7px); top: clamp(16px, 2.2vw, 26px); width: 16px; height: 16px; border-radius: 50%;
background: var(--paper); border: 2px solid color-mix(in oklab, var(--ink) 25%, var(--line)); transition: background .4s, border-color .4s, box-shadow .4s, scale .4s var(--ease-out); }
.cx-ev.is-past::before { background: var(--accent); border-color: var(--accent); }
.cx-ev.is-cur::before { scale: 1.25; box-shadow: 0 0 0 7px color-mix(in oklab, var(--accent) 20%, transparent); }
.cx-ev:target .cx-ev__c { outline: 2px solid color-mix(in oklab, var(--accent) 45%, transparent); outline-offset: 12px; border-radius: 4px; }
.cx-ev__yr { display: flex; align-items: baseline; flex-wrap: wrap; gap: .1em .45em; margin: 0 0 .3em; line-height: .9; }
.cx-ev__yr b { font: 500 clamp(2.7rem, 5.6vw, 4.8rem)/.9 var(--serif); letter-spacing: -.035em; font-variant-numeric: lining-nums; color: var(--ink); transition: color .7s var(--ease), -webkit-text-stroke-color .7s; }
.js .cx-ev__yr b { color: transparent; -webkit-text-stroke: 1.2px color-mix(in oklab, var(--ink) 42%, transparent); }
.js .cx-ev.is-past .cx-ev__yr b { color: var(--ink); -webkit-text-stroke-color: transparent; }
.js .cx-ev.is-cur .cx-ev__yr b { color: var(--accent); }
.cx-ev__yr small { font: 600 .72rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.cx-ev__c { max-width: 660px; }
.cx-ev__m { position: relative; margin: 14px 0 18px; border-radius: var(--r); overflow: hidden; aspect-ratio: 16 / 9; box-shadow: var(--shadow); background: var(--paper-3); }
.cx-ev__m .pic { position: absolute; inset: 0; }
.cx-ev__m img { filter: sepia(.18) saturate(.92); transition: filter .8s; }
.cx-ev__m:hover img { filter: none; }
.cx-ev__m figcaption { position: absolute; left: 12px; bottom: 12px; padding: .35em .8em; border-radius: 999px; font-size: .74rem; font-weight: 500;
background: color-mix(in oklab, var(--card) 86%, transparent); color: var(--ink); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.cx-ev__d { font: 600 .74rem/1.35 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 0 0 .55em; }
.cx-ev__t { font-size: clamp(1.32rem, 2.2vw, 1.8rem); line-height: 1.15; margin: 0 0 .45em; }
.cx-ev__x { color: var(--ink-2); margin: 0 0 1em; font-size: 1.02rem; line-height: 1.7; }
.cx-ev--empty::before { display: none; }
.cx-tags { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.cx-tag { display: inline-flex; align-items: center; gap: .38em; padding: .4em .8em; border-radius: 999px; border: 1px solid var(--line); background: var(--card);
font-size: .8rem; font-weight: 500; line-height: 1.2; text-decoration: none; transition: border-color .2s, color .2s, background .2s; }
.cx-tag .i { width: 13px; height: 13px; color: var(--accent); }
.cx-tag:hover { border-color: var(--accent); color: var(--accent); }
@media (max-width: 900px) {
.cx-era__in { grid-template-columns: 1fr; }
.cx-era__h { padding-block: 44px 0; }
.cx-era__hin { position: static; }
.cx-era__s { max-width: none; }
.cx-evs { padding-top: 30px; }
.cx-tlbar { align-items: stretch; }
}
@media (max-width: 560px) {
.cx-tlf .chips__row { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gut) * -1); padding-inline: var(--gut); padding-bottom: 4px; }
.cx-tlf .chips__row::-webkit-scrollbar { display: none; }
}
.cx-evs--single { padding-top: 8px; max-width: 820px; }
.cx-hero--era .cx-hero__t { max-width: 12ch; }
.cx-hero__deco--no span { font-size: clamp(12rem, 40vw, 34rem); font-style: italic; }
.cx-eralist ol { list-style: none; margin: 0; padding: 0; display: grid; }
.cx-eralist li a { display: grid; grid-template-columns: 14px 1fr; gap: 2px 12px; padding: .55em 0; text-decoration: none; position: relative; }
.cx-eralist li a::before { content: ''; grid-row: span 2; align-self: start; margin-top: .45em; width: 10px; height: 10px; border-radius: 50%; border: 2px solid var(--line); background: var(--card); z-index: 1; }
.cx-eralist li + li a::after { content: ''; position: absolute; left: 6px; top: -.55em; height: 1.4em; width: 2px; background: var(--line); }
.cx-eralist b { font-weight: 600; font-size: .95rem; }
.cx-eralist small { grid-column: 2; color: var(--muted); font-size: .8rem; }
.cx-eralist li[aria-current] a::before { background: var(--accent); border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in oklab, var(--accent) 18%, transparent); }
.cx-eralist li[aria-current] b { color: var(--accent); }
.cx-eralist a:hover b { color: var(--accent); }
.cx-np { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(12px, 2vw, 20px); padding-top: clamp(48px, 7vw, 96px); }
.cx-np__a { display: flex; flex-direction: column; gap: 8px; padding: clamp(22px, 3.4vw, 40px); border-radius: 20px; border: 1px solid var(--line); background: var(--card);
text-decoration: none; position: relative; overflow: hidden; isolation: isolate; transition: color .35s, border-color .35s; }
.cx-np__a::before { content: ''; position: absolute; inset: 0; z-index: -1; background: var(--ink); transform: scaleY(0); transform-origin: 50% 100%; transition: transform .55s var(--ease-out); }
.cx-np__a:hover { color: var(--paper); border-color: var(--ink); }
.cx-np__a:hover::before { transform: none; }
.cx-np__a--next { text-align: right; align-items: flex-end; }
.cx-np__k { display: inline-flex; align-items: center; gap: .45em; font: 600 .72rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.cx-np__a:hover .cx-np__k { color: var(--gold); }
.cx-np__t { font: 500 clamp(1.5rem, 3.4vw, 2.8rem)/1.02 var(--serif); letter-spacing: -.02em; }
.cx-np__s { font-size: .9rem; color: var(--muted); }
.cx-np__a:hover .cx-np__s { color: inherit; opacity: .7; }
@media (max-width: 640px) { .cx-np { grid-template-columns: 1fr; } .cx-np__a--next { text-align: left; align-items: flex-start; } }
.cx-pgrid { grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); }
@media (max-width: 560px) { .cx-pgrid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 12px; } .cx-pc__t { font-size: 1.05rem; } .cx-pc__r { font-size: .82rem; } }
.cx-pc { position: relative; }
.cx-pc__a { display: block; text-decoration: none; color: inherit; }
.cx-pc__a:hover { color: inherit; }
.cx-pc__m { position: relative; aspect-ratio: 4 / 5; border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); isolation: isolate; background: var(--paper-3); }
.cx-pc__m > .pic { position: absolute; inset: 0; transition: transform 1.1s var(--ease-out); }
.cx-pc__m img { filter: sepia(.2) saturate(.85); transition: filter .7s; }
.cx-pc__a:hover .cx-pc__m > .pic { transform: scale(1.05); }
.cx-pc__a:hover .cx-pc__m img { filter: none; }
.cx-pc__f { position: absolute; z-index: 2; top: 10px; left: 10px; width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center;
background: color-mix(in oklab, var(--card) 88%, transparent); color: var(--accent); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
.cx-pc__f .i { width: 17px; height: 17px; }
.cx-pc__b { padding: 12px 2px 0; }
.cx-pc__y { font: 600 .72rem/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--accent); margin: 0 0 .45em; font-variant-numeric: lining-nums; }
.cx-pc__t { font-size: clamp(1.12rem, 1.5vw, 1.32rem); line-height: 1.15; margin: 0 0 .25em; transition: color .2s; }
.cx-pc__a:hover .cx-pc__t { color: var(--accent); }
.cx-pc__r { font-size: .88rem; color: var(--ink-2); margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cx-mono span { font: italic 400 clamp(4.6rem, 9vw, 7.4rem)/1 var(--serif); letter-spacing: -.04em; transform: translateY(-.04em); }
.cx-mono--xl span { font-size: clamp(9rem, 26vw, 19rem); }
.rail .cx-pc[data-reveal], .rail .cx-cc[data-reveal], .rail .cx-rc[data-reveal], .rail .cx-fc[data-reveal] { opacity: 1; transform: none; }
.rail__track > .cx-pc { min-width: 0; }
.cx-filters { margin-top: 8px; }
.cx-pgroup { display: grid; grid-template-columns: minmax(180px, 250px) minmax(0, 1fr); gap: 20px clamp(24px, 4vw, 56px); padding-block: clamp(26px, 4vw, 44px); border-top: 1px solid var(--line); }
.cx-pgroup:first-of-type { border-top: 0; }
.cx-pgroup__h { position: sticky; top: calc(var(--hdr) + 24px); align-self: start; margin: 0; font-size: clamp(1.6rem, 2.8vw, 2.4rem); line-height: 1; }
.cx-pgroup__h a { text-decoration: none; }
.cx-pgroup__h a:hover { color: var(--accent); }
.cx-pgroup__h small { display: block; margin-top: .45em; font: italic 400 1rem/1.3 var(--serif); color: var(--accent); }
@media (max-width: 860px) { .cx-pgroup { grid-template-columns: 1fr; } .cx-pgroup__h { position: static; } }
.cx-ph { padding-block: clamp(22px, 4vw, 48px) clamp(36px, 5vw, 72px); border-bottom: 1px solid var(--line); position: relative; isolation: isolate; overflow: hidden; }
.cx-ph::before { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(ellipse 50% 70% at 100% 0%, color-mix(in oklab, var(--accent) 9%, transparent), transparent 70%); }
.cx-ph__in { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: clamp(28px, 5vw, 80px); align-items: end; }
.cx-ph__m { position: relative; margin: 0; aspect-ratio: 4 / 5; border-radius: calc(var(--r) * 1.4); overflow: hidden; box-shadow: var(--shadow-lg); background: var(--paper-3); }
.cx-ph__m > .pic { position: absolute; inset: 0; }
.cx-ph__m img { filter: sepia(.15); }
.cx-ph__m figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 36px 14px 10px; background: linear-gradient(transparent, rgb(0 0 0 / .55)); }
.cx-ph__m figcaption .credit { color: rgb(255 255 255 / .82); }
.cx-ph__b .kicker a { text-decoration: none; }
.cx-ph__t { font-size: clamp(2.5rem, 6.2vw, 5.6rem); line-height: .95; letter-spacing: -.03em; margin: 0 0 .25em; max-width: 13ch; }
.cx-ph__role { font: italic 400 clamp(1.2rem, 2.1vw, 1.65rem)/1.3 var(--serif); color: var(--accent); margin: 0 0 .9em; }
.cx-ph__life { display: flex; align-items: center; flex-wrap: wrap; gap: .3em .55em; margin: 0 0 1.1em; }
.cx-ph__life b { font: 500 clamp(2.3rem, 4.6vw, 3.8rem)/1 var(--serif); letter-spacing: -.03em; color: transparent; -webkit-text-stroke: 1.2px var(--ink); font-variant-numeric: lining-nums; }
.cx-ph__life i { width: clamp(36px, 6vw, 90px); height: 2px; background: var(--accent); }
.cx-ph__life small { font: 600 .72rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.cx-ph__life .cx-ph__one { font-size: clamp(1.6rem, 3vw, 2.4rem); -webkit-text-stroke: 0; color: var(--ink); }
.cx-ph__lead { font-size: clamp(1.04rem, 1.4vw, 1.18rem); line-height: 1.6; color: var(--ink-2); max-width: 56ch; margin: 0 0 1.2em; }
@media (max-width: 860px) {
.cx-ph__in { grid-template-columns: 1fr; align-items: start; }
.cx-ph__m { aspect-ratio: 5 / 4; max-height: 420px; }
}
.cx-box .kicker { margin-bottom: 1em; }
.cx-pms { display: grid; gap: 8px; }
.cx-pm { display: grid; grid-template-columns: 56px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 8px; border-radius: 12px; border: 1px solid var(--line); background: var(--card);
text-decoration: none; transition: border-color .2s, transform .3s var(--ease), box-shadow .3s; }
.cx-pm:hover { border-color: var(--accent); color: inherit; transform: translateY(-2px); box-shadow: var(--shadow); }
.cx-pm__m { width: 56px; height: 56px; border-radius: 9px; overflow: hidden; display: block; }
.cx-pm__m .pic { width: 100%; height: 100%; }
.cx-pm__m .ph__i { width: 50%; height: 50%; }
.cx-pm__b { display: grid; gap: 2px; min-width: 0; }
.cx-pm__b b { font-weight: 600; font-size: .95rem; line-height: 1.25; }
.cx-pm__b small { color: var(--muted); font-size: .78rem; }
.cx-pm__go { color: var(--muted); transition: color .2s, transform .3s var(--ease); }
.cx-pm:hover .cx-pm__go { color: var(--accent); transform: translate(2px, -2px); }
.cx-hero--cul .cx-hero__t, .cx-hero--people .cx-hero__t, .cx-hero--guide .cx-hero__t { max-width: 13ch; }
.cx-tabs ol, .cx-months ol { max-width: var(--wrap); }
.cx-tabs__in, .cx-months__in { display: flex; align-items: center; gap: 16px; }
.cx-tabs a { font-weight: 600; font-size: .92rem; align-items: center; }
.cx-tabs a .i { width: 17px; height: 17px; color: var(--accent); }
.cx-tabs a.is-on .i { color: var(--gold); }
.cx-tabs a small, .cx-months a small { font-weight: 500; font-size: .74rem; color: var(--muted); }
.cx-tabs a.is-on small, .cx-months a.is-on small { color: inherit; opacity: .7; }
.cx-fbar { padding-block: 18px 0; }
.cx-fbar__f { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 16px; }
.cx-culsec { scroll-margin-top: calc(var(--hdr) + 56px); }
.cx-center { text-align: center; }
.cx-bento { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(16px, 2vw, 26px); }
.cx-cc { position: relative; min-width: 0; }
.cx-cc__a { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.cx-cc__a:hover { color: inherit; }
.cx-cc__m { position: relative; aspect-ratio: 4 / 3; border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); isolation: isolate; background: var(--paper-3); }
.cx-cc__m .pic { position: absolute; inset: 0; transition: transform 1.1s var(--ease-out); }
.cx-cc__a:hover .cx-cc__m .pic { transform: scale(1.06); }
.cx-cc__b { padding: 13px 2px 2px; }
.cx-cc__k { font: 600 .7rem/1.35 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); margin: 0 0 .45em; }
.cx-cc__t { font-size: clamp(1.12rem, 1.5vw, 1.34rem); line-height: 1.15; margin: 0 0 .3em; transition: color .2s; }
.cx-cc__a:hover .cx-cc__t { color: var(--accent); }
.cx-cc__s { font-size: .92rem; color: var(--ink-2); margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cx-cc--big { grid-column: span 2; grid-row: span 2; }
.cx-cc--big .cx-cc__m { aspect-ratio: auto; flex: 1; min-height: 340px; }
.cx-cc--big .cx-cc__t { font-size: clamp(1.7rem, 3.2vw, 2.6rem); line-height: 1.02; letter-spacing: -.02em; }
.cx-cc--big .cx-cc__s { font-size: 1rem; -webkit-line-clamp: 4; max-width: 56ch; }
.cx-cc .ph__i { width: 30%; height: 30%; }
@media (max-width: 1000px) { .cx-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) {
.cx-bento { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 22px 12px; }
.cx-cc--big { grid-column: 1 / -1; grid-row: auto; }
.cx-cc--big .cx-cc__m { min-height: 0; aspect-ratio: 4 / 3; flex: none; }
.cx-cc:not(.cx-cc--big) .cx-cc__t { font-size: 1.04rem; }
.cx-cc:not(.cx-cc--big) .cx-cc__s { font-size: .84rem; -webkit-line-clamp: 2; }
.cx-cc:not(.cx-cc--big) .cx-cc__k { font-size: .62rem; letter-spacing: .06em; }
}
.cx-hero--ev .cx-hero__t { max-width: 11ch; }
.cx-months ol { padding-block: 8px; }
.cx-months a { flex-direction: column; align-items: center; gap: 2px; min-width: 64px; padding: .5em .7em; border-radius: 14px; }
.cx-months a span { font-weight: 600; }
.cx-months a small { min-height: 1em; }
.cx-months a[aria-disabled] { opacity: .38; pointer-events: none; }
.cx-months a.is-now:not(.is-on) { box-shadow: inset 0 0 0 1.5px var(--accent); color: var(--accent); }
.cx-upc__g { display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: clamp(16px, 2vw, 26px); align-items: start; }
@media (max-width: 1000px) { .cx-upc__g { grid-template-columns: 1fr 1fr; } .cx-upc__g > :first-child { grid-column: 1 / -1; } }
@media (max-width: 600px) { .cx-upc__g { grid-template-columns: 1fr; } }
.cx-cal .sec__h { margin-bottom: 8px; }
.cx-mon { display: grid; grid-template-columns: minmax(170px, 240px) minmax(0, 1fr); gap: 18px clamp(24px, 4vw, 56px); padding-block: clamp(24px, 3.4vw, 40px); border-top: 1px solid var(--line); scroll-margin-top: calc(var(--hdr) + 90px); }
.cx-mon__h { position: sticky; top: calc(var(--hdr) + 96px); align-self: start; margin: 0; display: grid; gap: 6px; }
.cx-mon__h span { font: italic 400 clamp(2rem, 3.8vw, 3.2rem)/1 var(--serif); letter-spacing: -.02em; }
.cx-mon__h small { font: 600 .7rem/1 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.cx-mon__b { display: grid; gap: 18px; min-width: 0; }
.cx-hols { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.cx-hols a { display: inline-flex; align-items: center; gap: .6em; padding: .45em .95em .45em .45em; border-radius: 999px; border: 1px solid color-mix(in oklab, var(--accent) 30%, var(--line));
background: var(--card); text-decoration: none; font-weight: 600; font-size: .9rem; transition: border-color .2s, transform .3s var(--ease), box-shadow .3s; }
.cx-hols a:hover { border-color: var(--accent); color: inherit; transform: translateY(-2px); box-shadow: var(--shadow); }
.cx-hols b { display: grid; place-items: center; min-width: 32px; height: 32px; padding: 0 6px; border-radius: 999px; background: var(--accent); color: var(--accent-ink); font: 600 .9rem/1 var(--serif); }
.cx-hols b .i { width: 16px; height: 16px; }
.cx-hols small { font-weight: 500; font-size: .74rem; color: var(--accent-2); }
.cx-hero__nows { display: flex; flex-wrap: wrap; gap: 10px; margin-top: clamp(22px, 3vw, 32px); }
.cx-hero__nows .cx-hero__now { margin: 0; }
.cx-hero__now a { color: inherit; }
.cx-mon__g { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: clamp(14px, 2vw, 22px); }
@media (max-width: 760px) { .cx-mon { grid-template-columns: 1fr; } .cx-mon__h { position: static; } }
.cx-fc { position: relative; min-width: 0; }
.cx-fc__a { display: flex; flex-direction: column; height: 100%; text-decoration: none; color: inherit; }
.cx-fc__a:hover { color: inherit; }
.cx-fc__m { position: relative; aspect-ratio: 16 / 10; border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); isolation: isolate; background: var(--paper-3); }
.cx-fc--big .cx-fc__m { aspect-ratio: 16 / 9.5; }
.cx-fc__m .pic { position: absolute; inset: 0; transition: transform 1.1s var(--ease-out); }
.cx-fc__a:hover .cx-fc__m .pic { transform: scale(1.06); }
.cx-fc__b { padding: 13px 2px 2px; display: grid; gap: .35em; }
.cx-fc__k { font: 600 .78rem/1.4 var(--sans); color: var(--accent); margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.cx-fc__t { font-size: clamp(1.15rem, 1.6vw, 1.38rem); line-height: 1.15; margin: 0; transition: color .2s; }
.cx-fc--big .cx-fc__t { font-size: clamp(1.6rem, 2.8vw, 2.3rem); }
.cx-fc__a:hover .cx-fc__t { color: var(--accent); }
.cx-fc__s { font-size: .92rem; color: var(--ink-2); margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cx-fc__r { display: inline-flex; align-items: center; gap: .35em; font-size: .8rem; color: var(--muted); margin: 0; }
.cx-fc__r .i { width: 14px; height: 14px; color: var(--accent); }
.cx-fc--past .cx-fc__m .pic { filter: grayscale(.85); opacity: .75; }
.cx-fc--past .cx-fc__t, .cx-fc--past .cx-fc__s { color: var(--muted); }
.cx-fc__past { position: absolute; z-index: 2; right: 12px; top: 12px; padding: .35em .75em; border-radius: 999px; background: var(--ink); color: var(--paper); font: 600 .68rem/1 var(--sans); letter-spacing: .1em; text-transform: uppercase; }
.cx-date { position: absolute; z-index: 2; left: 12px; top: 12px; margin: 0; display: grid; justify-items: center; min-width: 60px; padding: 8px 10px 9px; border-radius: 12px;
background: var(--card); color: var(--ink); box-shadow: var(--shadow); line-height: 1; }
.cx-date b { font: 500 1.9rem/1 var(--serif); }
.cx-date span { font: 600 .66rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); }
.cx-date--m span { font-size: .72rem; }
.cx-ggrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: clamp(14px, 1.8vw, 22px); padding-block: clamp(32px, 5vw, 56px) 0; }
.cx-gc { position: relative; min-width: 0; }
.cx-gc__a { position: relative; isolation: isolate; display: flex; flex-direction: column; gap: 12px; height: 100%; padding: clamp(20px, 2.2vw, 26px); border-radius: 18px;
border: 1px solid var(--line); background: var(--card); text-decoration: none; color: inherit; overflow: hidden; transition: border-color .3s, box-shadow .4s var(--ease-out); }
.cx-gc__a:hover { border-color: color-mix(in oklab, var(--accent) 60%, var(--line)); box-shadow: var(--shadow-lg); color: inherit; }
.cx-gc__i { width: 54px; height: 54px; flex: none; border-radius: 16px; display: grid; place-items: center; color: var(--accent);
background: color-mix(in oklab, var(--accent) 11%, var(--card)); transition: transform .6s var(--ease-out), background .3s, color .3s; }
.cx-gc__i .i { width: 27px; height: 27px; stroke-width: 1.5; }
.cx-gc__a:hover .cx-gc__i { background: var(--accent); color: var(--accent-ink); transform: rotate(-8deg) scale(1.06); }
.cx-gc__t { font-size: clamp(1.16rem, 1.5vw, 1.34rem); line-height: 1.18; margin: 0; }
.cx-gc__s { font-size: .92rem; color: var(--ink-2); margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cx-gc__go { display: inline-flex; align-items: center; gap: .4em; margin-top: auto; font-weight: 600; font-size: .86rem; color: var(--accent); }
.cx-gc__go .i { transition: transform .3s var(--ease); }
.cx-gc__a:hover .cx-gc__go .i { transform: translateX(4px); }
.cx-gc--big { grid-column: span 2; }
.cx-gc--big .cx-gc__a { background: var(--ink); color: var(--paper); border-color: var(--ink); padding: clamp(24px, 3vw, 36px); }
.cx-gc--big .cx-gc__t { font-size: clamp(1.6rem, 3vw, 2.4rem); line-height: 1.05; max-width: 16ch; }
.cx-gc--big .cx-gc__s { color: color-mix(in oklab, var(--paper) 75%, transparent); font-size: 1rem; max-width: 52ch; }
.cx-gc--big .cx-gc__i { width: 64px; height: 64px; background: color-mix(in oklab, var(--gold) 22%, transparent); color: var(--gold); }
.cx-gc--big .cx-gc__go { color: var(--gold); }
.cx-gc--big .cx-gc__a::after { content: ''; position: absolute; z-index: -1; right: -40px; bottom: -60px; width: 300px; height: 300px; opacity: .14; background: var(--gold);
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.1'%3E%3Crect x='9' y='9' width='22' height='22'/%3E%3Crect x='9' y='9' width='22' height='22' transform='rotate(45 20 20)'/%3E%3Ccircle cx='20' cy='20' r='4.6'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Cg fill='none' stroke='%23000' stroke-width='1.1'%3E%3Crect x='9' y='9' width='22' height='22'/%3E%3Crect x='9' y='9' width='22' height='22' transform='rotate(45 20 20)'/%3E%3Ccircle cx='20' cy='20' r='4.6'/%3E%3C/g%3E%3C/svg%3E") center / contain no-repeat;
transition: transform 1.2s var(--ease-out); }
.cx-gc--big .cx-gc__a:hover::after { transform: rotate(45deg) scale(1.08); }
.cx-gc--big .cx-gc__a:hover { color: var(--paper); }
.cx-gc--big .cx-gc__a:hover .cx-gc__i { background: var(--gold); color: var(--ink); }
:root[data-theme="dark"] .cx-gc--big .cx-gc__a { background: var(--paper-3); color: var(--ink); border-color: var(--line); }
:root[data-theme="dark"] .cx-gc--big .cx-gc__s { color: var(--ink-2); }
@media (prefers-color-scheme: dark) {
:root[data-theme="auto"] .cx-gc--big .cx-gc__a { background: var(--paper-3); color: var(--ink); border-color: var(--line); }
:root[data-theme="auto"] .cx-gc--big .cx-gc__s { color: var(--ink-2); }
}
@media (max-width: 620px) { .cx-gc--big { grid-column: auto; } }
.cx-ggrid--sm { grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); padding-top: 0; }
.cx-ggrid--sm .cx-gc__a { flex-direction: row; align-items: center; padding: 14px 16px; gap: 14px; }
.cx-ggrid--sm .cx-gc__i { width: 44px; height: 44px; border-radius: 12px; }
.cx-ggrid--sm .cx-gc__i .i { width: 22px; height: 22px; }
.cx-ggrid--sm .cx-gc__t { font-size: 1.02rem; flex: 1; }
.cx-ggrid--sm .cx-gc__go { display: none; }
.cx-hero--gd .cx-hero__t { font-size: clamp(2.2rem, 5.4vw, 4.6rem); }
.cx-hero__ic--g { border-radius: 32%; }
.cx-prose h2 { scroll-margin-top: calc(var(--hdr) + 24px); }
.cx-toc ol { list-style: none; margin: 0; padding: 0; display: grid; gap: 2px; counter-reset: toc; }
.cx-toc li { counter-increment: toc; }
.cx-toc a { display: grid; grid-template-columns: 26px 1fr; gap: 8px; padding: .5em .6em; border-radius: 10px; font-size: .92rem; line-height: 1.35; text-decoration: none; color: var(--ink-2); transition: background .2s, color .2s; }
.cx-toc a::before { content: counter(toc, decimal-leading-zero); font: 600 .72rem/1.9 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
.cx-toc a:hover { background: var(--paper-2); color: var(--ink); }
.cx-toc a.is-on { background: color-mix(in oklab, var(--accent) 10%, var(--card)); color: var(--accent); }
.cx-toc a.is-on::before { color: var(--accent); }
.cx-upd { display: flex; gap: 12px; align-items: center; }
.cx-upd > .i { width: 30px; height: 30px; color: var(--ok); flex: none; }
.cx-upd p { margin: 0; display: grid; font-size: .9rem; }
.cx-upd b { font-weight: 600; }
.cx-upd span { color: var(--ink-2); }
.cx-note { display: flex; gap: .6em; font-size: .84rem; color: var(--muted); margin: 0; }
.cx-note .i { flex: none; margin-top: .2em; color: var(--accent-2); }
.cx-srcbox { margin-top: clamp(32px, 4vw, 48px); padding: 22px 24px; border-radius: var(--r); border: 1px dashed var(--line); background: var(--card); }
.cx-srcbox .muted { font-size: .9rem; margin: 0 0 12px; }
.cx-src { margin: 0; padding-left: 1.4em; display: grid; gap: .4em; font-size: .9rem; }
.cx-src a { display: inline-flex; align-items: center; gap: .35em; word-break: break-all; }
.cx-src .i { width: 13px; height: 13px; color: var(--muted); }
.cx-srcs .cx-src { margin-top: 10px; }
.cx-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.cx-rmap { display: block; width: 100%; height: auto; overflow: visible; }
.cx-rmap__base { fill: var(--paper-3); stroke: var(--card); stroke-width: 3; stroke-linejoin: round; }
.cx-rmap__on { fill: color-mix(in oklab, var(--accent) 22%, var(--paper-3)); stroke: var(--card); stroke-width: 3; stroke-linejoin: round; }
.cx-rmap__ln { fill: none; stroke: var(--accent); stroke-width: 6; stroke-linecap: round; stroke-linejoin: round; }
.cx-rmap__pt { fill: var(--card); stroke: var(--accent); stroke-width: 5; }
.cx-rmap__pt.is-first { fill: var(--accent); }
@media (prefers-reduced-motion: no-preference) {
.js .cx-rmap__ln { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 2.4s var(--ease-out) .3s; }
.js .cx-rmap__pt { opacity: 0; transform-box: fill-box; transform-origin: center; transform: scale(.2); transition: opacity .4s, transform .6s var(--ease-out); transition-delay: calc(.35s + var(--k, 0) * .2s); }
.js .is-in .cx-rmap__ln, .js .is-in.cx-rmap__ln { stroke-dashoffset: 0; }
.js .is-in .cx-rmap__pt { opacity: 1; transform: none; }
}
.cx-rgrid { padding-bottom: 8px; }
.cx-rc { position: relative; min-width: 0; }
.cx-rc__a { display: flex; flex-direction: column; height: 100%; border-radius: 20px; border: 1px solid var(--line); background: var(--card); overflow: hidden; text-decoration: none; color: inherit;
transition: border-color .3s, box-shadow .4s var(--ease-out), transform .5s var(--ease-out); }
.cx-rc__a:hover { color: inherit; border-color: color-mix(in oklab, var(--accent) 45%, var(--line)); box-shadow: var(--shadow-lg); transform: translateY(-4px); }
.cx-rc__map { position: relative; padding: 22px 22px 10px; background: radial-gradient(ellipse at 30% 20%, color-mix(in oklab, var(--accent) 7%, transparent), transparent 70%), var(--paper-2); }
.cx-rc__map .cx-rmap { transition: transform 1s var(--ease-out); }
.cx-rc__a:hover .cx-rmap { transform: scale(1.03); }
.cx-rc__d { position: absolute; right: 16px; top: 10px; margin: 0; display: grid; justify-items: end; line-height: 1; }
.cx-rc__d b { font: 500 clamp(2.6rem, 4vw, 3.4rem)/1 var(--serif); letter-spacing: -.03em; color: var(--accent); }
.cx-rc__d span { font: 600 .66rem/1.5 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.cx-rc__b { flex: 1; display: flex; flex-direction: column; gap: 9px; padding: 16px 20px 20px; }
.cx-rc__k { font: 600 .7rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin: 0; }
.cx-rc__t { font-size: clamp(1.14rem, 1.5vw, 1.32rem); line-height: 1.18; margin: 0; transition: color .2s; }
.cx-rc__a:hover .cx-rc__t { color: var(--accent); }
.cx-rc__ch { display: flex; flex-wrap: wrap; gap: .15em .4em; font-size: .84rem; font-weight: 500; color: var(--ink-2); margin: 0; }
.cx-rc__ar { color: var(--accent); }
.cx-rc__s { font-size: .9rem; color: var(--ink-2); margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.cx-season { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: 3px; margin-top: auto; padding-top: 6px; }
.cx-season span { display: grid; place-items: center; height: 22px; border-radius: 6px; font: 600 .6rem/1 var(--sans); color: var(--muted); background: var(--paper-2); overflow: hidden; }
.cx-season span.on { background: color-mix(in oklab, var(--accent-2) 20%, var(--card)); color: var(--accent-2); }
.cx-season--big { gap: 6px; max-width: 760px; }
.cx-season--big span { height: 44px; border-radius: 10px; font-size: .76rem; letter-spacing: .02em; }
.cx-season--big span.on { background: var(--accent-2); color: var(--card); }
@media (prefers-reduced-motion: no-preference) {
.js .cx-season--big span.on { animation: cxPop .7s var(--ease-out) both; animation-delay: calc(var(--k) * 60ms + .3s); }
}
@keyframes cxPop { from { transform: scaleY(.3); opacity: 0; } }
@media (max-width: 560px) { .cx-season--big { gap: 3px; } .cx-season--big span { height: 36px; border-radius: 7px; font-size: .6rem; letter-spacing: 0; } }
.cx-dark .cx-rc__a { background: color-mix(in oklab, var(--fg) 5%, var(--bg)); border-color: var(--ln); color: var(--fg); }
.cx-dark .cx-rc__a:hover { border-color: color-mix(in oklab, var(--gold) 55%, transparent); }
.cx-dark .cx-rc__map { background: radial-gradient(ellipse at 30% 20%, color-mix(in oklab, var(--gold) 10%, transparent), transparent 70%), color-mix(in oklab, var(--fg) 3%, var(--bg)); }
.cx-dark .cx-rc__t { color: var(--fg); }
.cx-dark .cx-rc__a:hover .cx-rc__t, .cx-dark .cx-rc__d b, .cx-dark .cx-rc__k, .cx-dark .cx-rc__ar { color: var(--gold); }
.cx-dark .cx-rc__ch, .cx-dark .cx-rc__s, .cx-dark .cx-rc__d span { color: var(--fg-2); }
.cx-dark .cx-rmap__base { fill: color-mix(in oklab, var(--fg) 11%, var(--bg)); stroke: var(--bg); }
.cx-dark .cx-rmap__on { fill: color-mix(in oklab, var(--gold) 30%, var(--bg)); stroke: var(--bg); }
.cx-dark .cx-rmap__ln { stroke: var(--gold); }
.cx-dark .cx-rmap__pt { fill: var(--bg); stroke: var(--gold); }
.cx-dark .cx-rmap__pt.is-first { fill: var(--gold); }
.cx-dark .cx-season span { background: color-mix(in oklab, var(--fg) 8%, transparent); color: var(--fg-2); }
.cx-dark .cx-season span.on { background: color-mix(in oklab, var(--gold) 32%, transparent); color: var(--fg); }
.cx-hero--routes .cx-hero__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); grid-template-areas: 'c m' 'k m' 't m' 'l m' 'x m' 'y m'; column-gap: clamp(28px, 5vw, 72px); align-items: start; }
.cx-hero--routes .crumbs { grid-area: c; } .cx-hero--routes .cx-hero__k { grid-area: k; } .cx-hero--routes .cx-hero__t { grid-area: t; }
.cx-hero--routes .cx-hero__lead { grid-area: l; } .cx-hero--routes .cx-hero__meta { grid-area: x; }
.cx-allmap { grid-area: m; grid-row: 1 / -1; align-self: center; margin: 0; }
.cx-rmap--all .cx-rmap__base { fill: color-mix(in oklab, var(--fg) 13%, var(--bg)); stroke: color-mix(in oklab, var(--fg) 30%, var(--bg)); stroke-width: 1.6; }
.cx-rmap--all .cx-rmap__ln { stroke: var(--gold); stroke-width: 4; opacity: .9; transition: stroke-dashoffset 2.6s var(--ease-out), opacity .3s, stroke-width .3s, stroke .3s; transition-delay: calc(var(--k, 0) * .16s), 0s, 0s, 0s; }
.cx-rmap--all .cx-rmap__ln:nth-of-type(3n + 2) { stroke: var(--accent); }
.cx-rmap--all .cx-rmap__ln:nth-of-type(3n) { stroke: var(--accent-2); }
.cx-rmap--all.has-hot .cx-rmap__ln { opacity: .18; }
.cx-rmap--all .cx-rmap__ln.is-hot { opacity: 1; stroke-width: 8; stroke: var(--gold); }
@media (max-width: 900px) {
.cx-hero--routes .cx-hero__in { grid-template-columns: 1fr; grid-template-areas: 'c' 'k' 't' 'l' 'x' 'm'; }
.cx-allmap { grid-row: auto; margin-top: 28px; }
}
.cx-hero--trip .cx-hero__t { font-size: clamp(2.2rem, 5.6vw, 4.8rem); max-width: 17ch; }
.cx-hero--trip .cx-hero__in > *:not(.crumbs) { max-width: min(100%, 820px); }
.cx-hero__season { margin-top: clamp(26px, 4vw, 40px); }
.cx-hero__season .kicker { margin-bottom: .8em; }
.cx-trip__cover { margin-top: clamp(24px, 4vw, 40px); position: relative; }
.cx-trip__cover .pic { aspect-ratio: 21 / 9; border-radius: var(--r); overflow: hidden; }
.cx-trip__cover figcaption { margin-top: 6px; }
.cx-trip__in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 72px); align-items: start; }
.cx-trip__map { position: sticky; top: calc(var(--hdr) + 20px); }
.cx-tmap__box { position: relative; height: min(76vh, 720px); border-radius: 20px; overflow: hidden; background: var(--paper-2); border: 1px solid var(--line); box-shadow: var(--shadow); }
.cx-tmap__box > .cx-rmap--ph { position: absolute; inset: 8% 6%; width: 88%; height: 84%; }
.js .cx-rmap--ph .cx-rmap__ln { stroke-dashoffset: 0; transition: none; }
.js .cx-rmap--ph .cx-rmap__pt { opacity: 1; transform: none; transition: none; }
.cx-tmap__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; margin-top: 10px; }
.cx-tmap__note { display: inline-flex; align-items: center; gap: .4em; font-size: .78rem; color: var(--muted); }
.cx-tmap__note .i { width: 14px; height: 14px; }
@media (max-width: 980px) {
.cx-trip__in { grid-template-columns: 1fr; }
.cx-trip__map { position: static; order: -1; }
.cx-tmap__box { height: min(56vh, 420px); }
}
.cx-days { --c: 30px; position: relative; list-style: none; margin: 0; padding: 0; }
.cx-days::before, .cx-days::after { content: ''; position: absolute; left: var(--c); top: 12px; bottom: 12px; width: 2px; translate: -1px 0; border-radius: 2px; }
.cx-days::before { background: var(--line); }
.cx-days::after { background: linear-gradient(180deg, var(--gold), var(--accent)); transform-origin: 50% 0; transform: scaleY(var(--p, 0)); }
.no-js .cx-days::after { transform: none; }
.cx-day { position: relative; display: grid; grid-template-columns: calc(var(--c) * 2) minmax(0, 1fr); gap: 0 clamp(16px, 2.4vw, 28px); padding-bottom: clamp(30px, 4vw, 48px); scroll-margin-top: calc(var(--hdr) + 40px); }
.cx-day:last-child { padding-bottom: 0; }
.cx-day__n { position: relative; z-index: 1; width: calc(var(--c) * 2); height: calc(var(--c) * 2); margin: 0; border-radius: 50%; display: grid; place-items: center;
background: var(--paper); border: 2px solid color-mix(in oklab, var(--ink) 22%, var(--line)); transition: background .45s, border-color .45s, color .45s, box-shadow .45s; }
.cx-day__n b { font: 500 1.75rem/1 var(--serif); font-variant-numeric: lining-nums; }
.cx-day.is-past .cx-day__n { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.cx-day.is-cur .cx-day__n { box-shadow: 0 0 0 8px color-mix(in oklab, var(--accent) 18%, transparent); }
.cx-day__b { padding-top: 4px; display: grid; gap: 18px; min-width: 0; }
.cx-day__k { font: 600 .76rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); margin: 0; padding-top: 14px; }
.cx-stop { display: grid; gap: 10px; }
.cx-stop + .cx-stop { padding-top: 16px; border-top: 1px dashed var(--line); }
.cx-stop__r { margin: 0; }
.cx-stop__r a { display: inline-flex; align-items: center; gap: .35em; font: 600 .82rem/1.3 var(--sans); text-decoration: none; color: var(--ink); }
.cx-stop__r a:hover { color: var(--accent); }
.cx-stop__r .i { width: 15px; height: 15px; color: var(--accent); }
.cx-stop__t { font-size: 1.05rem; line-height: 1.68; margin: 0; color: var(--ink-2); }
.cx-stop .cx-pm { max-width: 440px; }
.cx-mk { display: block; }
.cx-mk__b { display: grid; place-items: center; min-width: 30px; height: 30px; padding: 0 7px; border-radius: 999px; border: 2px solid var(--paper); background: var(--accent); color: var(--accent-ink);
font: 700 .78rem/1 var(--sans); box-shadow: 0 4px 12px rgb(0 0 0 / .25); cursor: pointer; transition: transform .35s var(--ease-out), background .3s, box-shadow .3s; }
.cx-mk--approx .cx-mk__b { background: var(--card); color: var(--accent); border-color: var(--accent); border-style: dashed; }
.cx-mk.is-on { z-index: 2; }
.cx-mk.is-on .cx-mk__b { transform: scale(1.3); background: var(--ink); color: var(--paper); box-shadow: 0 0 0 6px color-mix(in oklab, var(--accent) 30%, transparent), 0 6px 16px rgb(0 0 0 / .3); }
.cx-hb .cx-marq--big { margin-bottom: clamp(26px, 4vw, 44px); }
.cx-hb--routes { position: relative; isolation: isolate; overflow: hidden; }
.cx-hb--routes::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none;
background: radial-gradient(ellipse 50% 60% at 90% 0%, color-mix(in oklab, var(--accent) 28%, transparent), transparent 70%),
radial-gradient(ellipse 45% 55% at 0% 100%, color-mix(in oklab, var(--accent-2) 26%, transparent), transparent 70%); }
.cx-rail .rail__track { grid-auto-columns: minmax(290px, 30%); }
@media (max-width: 700px) { .cx-rail .rail__track { grid-auto-columns: 84%; } }
.cx-rb__p, .cx-rb__r { margin-top: clamp(44px, 6vw, 80px); }
@media (prefers-reduced-motion: no-preference) {
@supports (animation-timeline: view()) {
.cx-era__img img, .cx-ev__m img, .cx-trip__cover img, .cx-cc--big .cx-cc__m img { scale: 1.14; animation: cxPar linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
@keyframes cxPar { from { translate: 0 -6%; } to { translate: 0 6%; } }
}
}
@media (prefers-reduced-motion: reduce) {
.cx-ev::before, .cx-ev__yr b, .cx-day__n, .cx-np__a::before, .cx-rc__a, .cx-gc__i, .cx-hero__ic, .cx-hero__icons span { transition: none !important; animation: none !important; }
.cx-evs::after, .cx-days::after { transform: none; }
.js .cx-ev__yr b { color: var(--ink); -webkit-text-stroke-color: transparent; }
}
@media print {
.cx-eranav, .cx-tabs, .cx-months, .cx-marq, .cx-hero__deco, .cx-trip__map, .cx-tlbar { display: none !important; }
.cx-dark { background: none; color: inherit; }
}
:root { --gk-s: 52%; --gk-l: 36%; --gk-ml: 50%; --gk-bs: 58%; --gk-bl: 93%; }
:root[data-theme="dark"] { --gk-s: 60%; --gk-l: 74%; --gk-ml: 62%; --gk-bs: 26%; --gk-bl: 21%; }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] { --gk-s: 60%; --gk-l: 74%; --gk-ml: 62%; --gk-bs: 26%; --gk-bl: 21%; } }
.gh, .gd-h {
--gh-bg: color-mix(in oklab, var(--ink) 94%, var(--accent-2));
--gh-fg: var(--paper);
--gh-mute: color-mix(in oklab, var(--gh-fg) 70%, transparent);
--gh-line: color-mix(in oklab, var(--gh-fg) 14%, transparent);
--gh-gold: color-mix(in oklab, var(--gold) 72%, var(--gh-fg));
}
:root[data-theme="dark"] :is(.gh, .gd-h) { --gh-bg: color-mix(in oklab, var(--paper-2) 90%, var(--accent-2)); --gh-fg: var(--ink); --gh-gold: var(--gold); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] :is(.gh, .gd-h) { --gh-bg: color-mix(in oklab, var(--paper-2) 90%, var(--accent-2)); --gh-fg: var(--ink); --gh-gold: var(--gold); } }
.gh__bg, .gd-h__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.gh__blob { position: absolute; border-radius: 50%; filter: blur(64px); opacity: .5; will-change: transform; }
.gh__blob--a { width: 48vw; height: 48vw; left: -14vw; top: -22vw; background: radial-gradient(circle, var(--accent), transparent 66%); animation: ghFloat 19s ease-in-out infinite alternate; }
.gh__blob--b { width: 42vw; height: 42vw; right: -12vw; top: 18%; background: radial-gradient(circle, var(--accent-2), transparent 66%); animation: ghFloat 23s ease-in-out -7s infinite alternate-reverse; }
.gh__blob--c { width: 36vw; height: 36vw; left: 28%; bottom: -24vw; background: radial-gradient(circle, var(--gold), transparent 66%); opacity: .32; animation: ghFloat 27s ease-in-out -13s infinite alternate; }
@keyframes ghFloat { 0% { transform: translate3d(0, 0, 0) scale(1); } 50% { transform: translate3d(5vw, 3vw, 0) scale(1.12); } 100% { transform: translate3d(-4vw, 7vw, 0) scale(.94); } }
.gh__grid { position: absolute; inset: 0; opacity: .55;
background-image: linear-gradient(var(--gh-line) 1px, transparent 1px), linear-gradient(90deg, var(--gh-line) 1px, transparent 1px);
background-size: 56px 56px; -webkit-mask-image: radial-gradient(ellipse 70% 60% at 72% 34%, #000, transparent 72%); mask-image: radial-gradient(ellipse 70% 60% at 72% 34%, #000, transparent 72%); }
.gx-orn { position: absolute; width: min(62vw, 780px); aspect-ratio: 1; right: -14vw; top: 46%; translate: 0 -50%; color: var(--gh-gold); opacity: .2; stroke-width: .45; animation: gxSpin 160s linear infinite; }
.gx-orn * { stroke-dasharray: 1; stroke-dashoffset: 1; animation: gxDraw 2.8s var(--ease-out) forwards; }
.gx-orn :nth-child(2) { animation-delay: .1s; } .gx-orn :nth-child(3) { animation-delay: .2s; } .gx-orn :nth-child(4) { animation-delay: .3s; }
.gx-orn :nth-child(5) { animation-delay: .45s; } .gx-orn :nth-child(6) { animation-delay: .55s; } .gx-orn :nth-child(7) { animation-delay: .7s; }
.gx-orn :nth-child(8) { animation-delay: .8s; } .gx-orn :nth-child(9) { animation-delay: .95s; } .gx-orn :nth-child(10) { animation-delay: 1.05s; }
.gx-orn .dots { stroke-dasharray: .004 .012; stroke-dashoffset: 0; stroke-width: 1.2; animation: none; }
@keyframes gxDraw { to { stroke-dashoffset: 0; } }
@keyframes gxSpin { to { rotate: 360deg; } }
.gh { position: relative; isolation: isolate; overflow: hidden; background: var(--gh-bg); color: var(--gh-fg); padding-top: calc(var(--hdr) + clamp(14px, 3vw, 40px)); }
.gh__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr); gap: clamp(28px, 5vw, 76px); align-items: center; padding-bottom: clamp(36px, 5vw, 64px); }
@media (max-width: 1060px) { .gh__in { grid-template-columns: minmax(0, 1fr); } }
.gh .crumbs ol, .gd-h .crumbs ol { color: var(--gh-mute); }
.gh .crumbs a:hover, .gd-h .crumbs a:hover { color: var(--gh-fg); }
.gh__k { color: var(--gh-gold); }
.gh__t { font-size: clamp(2.4rem, 7.6vw, 6.4rem); line-height: .94; letter-spacing: -.032em; margin: 0 0 .32em; max-width: 9ch; font-weight: 500; hyphens: manual; }
.gh__t em { font-style: italic; font-weight: 400; color: var(--gh-gold); }
.gx-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
.gx-w > span { display: inline-block; }
.gh__lead { font-size: clamp(1.02rem, 1.45vw, 1.2rem); line-height: 1.6; color: var(--gh-mute); max-width: 52ch; margin: 0; }
.gh__search { display: flex; align-items: center; gap: 10px; max-width: 600px; margin-top: 28px; padding: 6px 6px 6px 18px; border-radius: 999px; background: var(--card); color: var(--ink);
box-shadow: var(--shadow-lg), 0 0 0 1px var(--gh-line); transition: box-shadow .3s; }
.gh__search:focus-within { box-shadow: var(--shadow-lg), 0 0 0 3px color-mix(in oklab, var(--accent) 60%, transparent); }
.gh__search > .i { color: var(--muted); }
.gh__search input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none; font-size: 1.04rem; padding: .7em 0; color: var(--ink); }
.gh__search input::-webkit-search-cancel-button { filter: grayscale(1); }
.gh__stats { display: grid; grid-template-columns: repeat(4, auto); justify-content: start; gap: 14px clamp(20px, 3vw, 44px); margin: 32px 0 0; }
.gh__stats > div { display: flex; flex-direction: column-reverse; padding-left: 14px; border-left: 1px solid var(--gh-line); }
.gh__stats dd { margin: 0; font: 500 clamp(1.8rem, 3vw, 2.6rem)/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; }
.gh__stats dt { margin-top: 6px; font-size: .8rem; color: var(--gh-mute); letter-spacing: .02em; }
@media (max-width: 600px) { .gh__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } .gh__search .btn { padding-inline: 1em; } }
.gh__marq { --gap: 2.6rem; position: relative; border-top: 1px solid var(--gh-line); padding: 15px 0; font: 500 .95rem/1 var(--sans); color: var(--gh-mute); }
.gh__marq .marquee__it .i { width: 1.15em; height: 1.15em; color: var(--gh-gold); }
.gh__marq .marquee__it .star { color: var(--gh-line); margin-left: calc(var(--gap) - .6em); }
.ghl { position: relative; min-width: 0; }
.ghl__h { display: grid; gap: 6px; margin-bottom: 16px; }
.ghl__t { display: flex; align-items: center; gap: .5em; margin: 0; font-size: clamp(1.4rem, 2.2vw, 1.85rem); color: var(--gh-fg); }
.ghl__siren { position: relative; display: inline-grid; place-items: center; width: 1.6em; height: 1.6em; border-radius: 50%; background: color-mix(in oklab, var(--accent) 26%, transparent); color: var(--gh-gold); }
.ghl__siren .i { width: .8em; height: .8em; }
.ghl__siren::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 1.5px solid var(--accent); animation: ghPulse 2.4s var(--ease-out) infinite; }
.ghl__lead { margin: 0; font-size: .88rem; line-height: 1.5; color: var(--gh-mute); max-width: 56ch; }
.ghl__grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.ghl__it { --c: hsl(var(--kh) 78% 72%); position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "n ring" "l l" "s s";
align-items: center; gap: 2px 10px; padding: 14px 16px 13px; border-radius: 18px; text-decoration: none; color: var(--gh-fg);
background: color-mix(in oklab, var(--gh-fg) 6%, transparent); border: 1px solid var(--gh-line);
-webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px);
transition: transform .4s var(--ease-out), border-color .3s, background .3s, box-shadow .4s; }
.ghl__it::before { content: ''; position: absolute; inset: 0; z-index: -1; translate: -120% 0; transition: translate 1s var(--ease-out);
background: linear-gradient(105deg, transparent 30%, color-mix(in oklab, var(--gh-fg) 16%, transparent) 50%, transparent 70%); }
.ghl__it:hover, .ghl__it:focus-visible { color: var(--gh-fg); transform: translateY(-4px); border-color: color-mix(in oklab, var(--c) 65%, transparent);
background: color-mix(in oklab, var(--c) 15%, transparent); box-shadow: 0 22px 44px -22px color-mix(in oklab, var(--c) 80%, transparent); }
.ghl__it:hover::before { translate: 120% 0; }
.ghl__n { grid-area: n; font: 500 clamp(2rem, 3.1vw, 2.75rem)/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; letter-spacing: .01em;
background: linear-gradient(100deg, var(--gh-fg) 25%, var(--c) 85%); -webkit-background-clip: text; background-clip: text; color: transparent; }
.ghl__ring { grid-area: ring; position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--c); color: var(--gh-bg); }
.ghl__ring .i { width: 18px; height: 18px; }
.ghl__ring::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid var(--c); animation: ghPulse 2.8s var(--ease-out) infinite; animation-delay: calc(var(--i, 0) * .35s); }
.ghl__it:hover .ghl__ring .i { animation: ghRing .9s ease-in-out infinite; }
.ghl__l { grid-area: l; margin-top: 10px; font-weight: 600; font-size: .95rem; line-height: 1.25; }
.ghl__s { grid-area: s; font-size: .74rem; color: var(--gh-mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.ghl__ic { position: absolute; right: -10px; bottom: -14px; z-index: -1; color: var(--c); opacity: .12; transition: transform .6s var(--ease-out), opacity .4s; }
.ghl__ic .i { width: 86px; height: 86px; stroke-width: 1.3; }
.ghl__it:hover .ghl__ic { transform: rotate(-12deg) scale(1.12); opacity: .22; }
@keyframes ghPulse { 0% { transform: scale(1); opacity: .75; } 100% { transform: scale(2.1); opacity: 0; } }
@keyframes ghRing { 0%, 100% { rotate: 0deg; } 15% { rotate: -18deg; } 30% { rotate: 15deg; } 45% { rotate: -11deg; } 60% { rotate: 7deg; } 75% { rotate: -3deg; } }
@media (max-width: 420px) { .ghl__it { padding: 12px 12px 11px; border-radius: 15px; } .ghl__ring { width: 34px; height: 34px; } .ghl__l { font-size: .86rem; } }
.gls { padding-top: clamp(28px, 4vw, 56px); scroll-margin-top: calc(var(--hdr) + 8px); }
.gf { display: grid; gap: 18px; padding: clamp(16px, 2.4vw, 26px); border: 1px solid var(--line); border-radius: 22px; background: var(--card); box-shadow: var(--shadow); margin-bottom: 22px; }
.gf__row { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-end; }
.gf__sel { display: grid; gap: 7px; flex: 1 1 240px; min-width: 0; max-width: 420px; }
.gf__sel .kicker { margin: 0; color: var(--muted); }
.gf__sel .kicker .i { color: var(--accent); }
.gf__sel select { appearance: none; -webkit-appearance: none; width: 100%; padding: .72em 2.6em .72em 1em; border-radius: 14px; border: 1px solid var(--line); font-size: .95rem; cursor: pointer;
background-color: var(--paper); background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
background-position: calc(100% - 21px) 54%, calc(100% - 16px) 54%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; transition: border-color .2s, box-shadow .2s; }
.gf__sel select:hover { border-color: var(--ink-2); }
.gf__sel select:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 22%, transparent); }
.gf__sel select:disabled { opacity: .55; cursor: not-allowed; }
.gf__reset { margin-left: auto; }
.gk { border: 0; margin: 0; padding: 0; min-width: 0; }
.gk legend { padding: 0; margin-bottom: 10px; color: var(--muted); }
.gk legend .i { color: var(--accent); }
.gk__row { display: flex; flex-wrap: wrap; gap: 8px; }
.gk__c { position: relative; }
.gk__c input { position: absolute; opacity: 0; pointer-events: none; }
.gk__c span { display: inline-flex; align-items: center; gap: .45em; padding: .5em .85em .5em .72em; border-radius: 999px; border: 1px solid var(--line); background: var(--paper);
font-size: .86rem; font-weight: 500; white-space: nowrap; cursor: pointer; transition: background .2s, border-color .2s, color .2s, transform .25s var(--ease); }
.gk__c .i { width: 1.05em; height: 1.05em; color: hsl(var(--kh, 24) var(--gk-s) var(--gk-l)); }
.gk__c small { font-size: .74rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.gk__c span:hover { border-color: hsl(var(--kh, 24) var(--gk-s) var(--gk-ml)); transform: translateY(-1px); }
.gk__c input:checked + span { background: hsl(var(--kh, 24) var(--gk-s) var(--gk-l)); border-color: transparent; color: var(--paper); box-shadow: 0 8px 18px -10px hsl(var(--kh, 24) var(--gk-s) var(--gk-l)); }
.gk__c:not([style]) input:checked + span { background: var(--ink); box-shadow: none; }
.gk__c input:checked + span .i, .gk__c input:checked + span small { color: inherit; }
.gk__c input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (max-width: 700px) {
.gk__row { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; margin-right: calc(clamp(16px, 2.4vw, 26px) * -1); padding-right: 24px;
-webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.gk__row::-webkit-scrollbar { display: none; }
.gf__sel { max-width: none; }
}
.gls__bar { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px 16px; margin-bottom: 16px; }
.gls__bar .count { margin: 0; font-weight: 500; }
.gl { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 500px), 1fr)); gap: 10px 14px; }
.gl__grp { grid-column: 1 / -1; display: flex; align-items: center; gap: 14px; margin: 18px 0 2px; font: 500 clamp(1.15rem, 1.8vw, 1.35rem)/1.2 var(--serif); }
.gl__grp::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--line), transparent); }
.gl__grp:first-child { margin-top: 0; }
.gl__it { position: relative; display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 18px; background: var(--card); overflow: hidden;
transition: border-color .25s, box-shadow .35s, transform .35s var(--ease-out); }
.gl__it::before { content: ''; position: absolute; left: 0; top: 16px; bottom: 16px; width: 3px; border-radius: 0 3px 3px 0; background: hsl(var(--kh) var(--gk-s) var(--gk-ml));
transform: scaleY(.3); opacity: .55; transition: transform .45s var(--ease-out), opacity .3s; }
.gl__it:hover { border-color: color-mix(in oklab, hsl(var(--kh) var(--gk-s) var(--gk-ml)) 55%, var(--line)); box-shadow: var(--shadow); transform: translateY(-2px); }
.gl__it:hover::before { transform: none; opacity: 1; }
.gl__a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: start; padding: 15px 16px 10px; text-decoration: none; color: inherit; flex: 1; }
.gl__a:hover { color: inherit; }
.gl__ic { width: 44px; height: 44px; border-radius: 13px; display: grid; place-items: center; background: hsl(var(--kh) var(--gk-bs) var(--gk-bl)); color: hsl(var(--kh) var(--gk-s) var(--gk-l));
transition: transform .45s var(--ease-out); }
.gl__ic .i { width: 22px; height: 22px; }
.gl__it:hover .gl__ic { transform: rotate(-8deg) scale(1.07); }
.gl__b { display: grid; gap: 3px; min-width: 0; }
.gl__k { font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: hsl(var(--kh) var(--gk-s) var(--gk-l)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gl__n { font-weight: 600; font-size: 1.02rem; line-height: 1.32; transition: color .2s; }
.gl__a:hover .gl__n { color: var(--accent); }
.gl__ad { display: flex; gap: .4em; font-size: .86rem; line-height: 1.42; color: var(--muted); }
.gl__ad .i { width: 14px; height: 14px; margin-top: .18em; flex: none; }
.gl__go { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; color: var(--muted); transition: background .25s, color .25s, transform .4s var(--ease-out); }
.gl__go .i { width: 17px; height: 17px; }
.gl__a:hover .gl__go { background: var(--ink); color: var(--paper); transform: rotate(45deg); }
.gl__tels { display: flex; flex-wrap: wrap; gap: 6px; padding: 0 16px 14px 74px; }
.gl__tel { display: inline-flex; align-items: center; gap: .45em; min-height: 34px; padding: .38em .82em; border-radius: 999px; background: var(--paper-2); font-size: .84rem; font-weight: 600;
font-variant-numeric: tabular-nums; text-decoration: none; white-space: nowrap; transition: background .2s, color .2s, transform .25s var(--ease); }
.gl__tel .i { width: 14px; height: 14px; color: var(--accent-2); transition: color .2s; }
.gl__tel:hover { background: var(--accent-2); color: var(--paper); transform: translateY(-1px); }
.gl__tel:hover .i { color: inherit; animation: ghRing .8s ease-in-out; }
:root[data-theme="dark"] .gl__tel { background: var(--paper-3); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .gl__tel { background: var(--paper-3); } }
.gl__tel--hot { background: hsl(var(--kh) var(--gk-bs) var(--gk-bl)); color: hsl(var(--kh) var(--gk-s) var(--gk-l)); }
.gl__tel--hot .i { color: inherit; }
.gl__tel--hot:hover { background: hsl(var(--kh) var(--gk-s) var(--gk-l)); color: var(--paper); }
@media (max-width: 560px) {
.gl__a { gap: 12px; padding: 14px 14px 10px; }
.gl__ic { width: 40px; height: 40px; border-radius: 12px; }
.gl__go { display: none; }
.gl__a { grid-template-columns: auto minmax(0, 1fr); }
.gl__tels { padding: 0 14px 14px; }
.gl__tel { min-height: 40px; font-size: .9rem; flex: 1 1 auto; justify-content: center; }
}
.gr { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); gap: 12px; }
.gr__it { --h: 30; position: relative; isolation: isolate; overflow: hidden; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 12px 10px; padding: 18px 18px 16px;
border-radius: 18px; border: 1px solid var(--line); background: var(--card); text-decoration: none; transition: transform .4s var(--ease-out), border-color .25s, box-shadow .35s; }
.gr__it::before { content: ''; position: absolute; inset: 0; z-index: -1; opacity: 0; transition: opacity .45s;
background: radial-gradient(120% 140% at 100% 0%, hsl(var(--h) 62% 58% / .24), transparent 62%); }
.gr__it:hover { transform: translateY(-3px); border-color: hsl(var(--h) var(--gk-s) var(--gk-ml)); box-shadow: var(--shadow); color: inherit; }
.gr__it:hover::before, .gr__it.is-on::before { opacity: 1; }
.gr__it.is-on { border-color: var(--accent); }
.gr__n { font: 500 1.1rem/1.25 var(--serif); }
.gr__c { font: 500 1.75rem/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; color: hsl(var(--h) var(--gk-s) var(--gk-l)); }
.gr__bar { grid-column: 1 / -1; height: 4px; border-radius: 4px; background: var(--paper-3); overflow: hidden; }
.gr__bar i { display: block; height: 100%; width: calc(var(--p, 0) * 100%); border-radius: inherit; transform-origin: 0 50%;
background: linear-gradient(90deg, hsl(var(--h) var(--gk-s) var(--gk-ml)), var(--gold)); }
.gd-h { --c: hsl(var(--kh) 76% 72%); position: relative; isolation: isolate; overflow: hidden; background: var(--gh-bg); color: var(--gh-fg);
padding: calc(var(--hdr) + clamp(14px, 3vw, 36px)) 0 clamp(34px, 5vw, 64px); }
.gd-h .gh__blob--a { background: radial-gradient(circle, hsl(var(--kh) 70% 55%), transparent 66%); opacity: .45; }
.gd-h .gx-orn { width: min(56vw, 600px); right: -10vw; top: 50%; opacity: .17; color: var(--c); }
.gd-h__top { display: flex; gap: clamp(14px, 2vw, 22px); align-items: center; }
.gd-h__badge { position: relative; flex: none; display: grid; place-items: center; width: clamp(58px, 7vw, 82px); aspect-ratio: 1; border-radius: 24px; background: var(--c); color: var(--gh-bg);
box-shadow: 0 18px 40px -16px color-mix(in oklab, var(--c) 80%, transparent); }
.gd-h__badge .i { width: 46%; height: 46%; stroke-width: 1.6; }
.gd-h__badge::after { content: ''; position: absolute; inset: -8px; border-radius: 30px; border: 1.5px dashed color-mix(in oklab, var(--c) 70%, transparent); animation: gxSpin 26s linear infinite; }
.gd-h__tt { min-width: 0; }
.gd-h .kicker { color: var(--c); margin-bottom: .55em; }
.gd-h__t { font-size: clamp(1.9rem, 4.4vw, 3.5rem); margin: 0; max-width: 24ch; overflow-wrap: anywhere; }
.gd-h__lead { color: var(--gh-mute); margin: 20px 0 0; max-width: 66ch; }
.gd-h__cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 26px; }
.gd-cta { font-size: .98rem; padding: .88em 1.35em; }
.gd-cta.btn--accent .i { transition: transform .3s; }
.gd-cta.btn--accent:hover .i { animation: ghRing .9s ease-in-out infinite; }
.gd-cta--hot { background: var(--c); border-color: var(--c); color: var(--gh-bg); }
.gd-cta--hot:hover { background: var(--gh-fg); border-color: var(--gh-fg); color: var(--gh-bg); }
.gd-h .btn--ghost { color: var(--gh-fg); border-color: var(--gh-line); }
.gd-h .btn--ghost:hover { background: var(--gh-fg); border-color: var(--gh-fg); color: var(--gh-bg); }
.gd-h__chk { display: inline-flex; align-items: center; gap: .45em; margin: 22px 0 0; font-size: .85rem; color: var(--gh-mute); }
.gd-h__chk .i { color: var(--c); }
@media (max-width: 560px) { .gd-h__top { align-items: flex-start; } .gd-cta { width: 100%; justify-content: center; } }
.gd-card { border: 1px solid var(--line); border-radius: 22px; background: var(--card); padding: clamp(18px, 2.6vw, 28px); box-shadow: var(--shadow); }
.gd-card__t { display: flex; align-items: center; gap: .5em; font-size: clamp(1.3rem, 2vw, 1.55rem); margin: 0 0 18px; }
.gd-card__t .i { color: var(--accent); }
.gd-tels { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); gap: 10px; }
.gd-tel { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 18px; border: 1px solid var(--line); background: var(--paper); text-decoration: none;
transition: border-color .25s, transform .35s var(--ease-out), box-shadow .35s, background .25s; }
.gd-tel__ic { position: relative; flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center;
background: color-mix(in oklab, var(--accent-2) 14%, transparent); color: var(--accent-2); transition: background .25s, color .25s; }
.gd-tel > span:last-child { display: grid; min-width: 0; }
.gd-tel small { font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.gd-tel b { font-size: 1.14rem; font-weight: 600; font-variant-numeric: tabular-nums; letter-spacing: .01em; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gd-tel:hover { border-color: var(--accent-2); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.gd-tel:hover .gd-tel__ic { background: var(--accent-2); color: var(--paper); }
.gd-tel:hover .gd-tel__ic .i { animation: ghRing .9s ease-in-out; }
.gd-tel--hot { border-color: color-mix(in oklab, hsl(var(--kh) var(--gk-s) var(--gk-ml)) 45%, var(--line)); background: color-mix(in oklab, hsl(var(--kh) var(--gk-bs) var(--gk-bl)) 60%, var(--paper)); }
.gd-tel--hot .gd-tel__ic { background: hsl(var(--kh) var(--gk-bs) var(--gk-bl)); color: hsl(var(--kh) var(--gk-s) var(--gk-l)); }
.gd-tel--hot .gd-tel__ic::after { content: ''; position: absolute; inset: 0; border-radius: 50%; border: 2px solid hsl(var(--kh) var(--gk-s) var(--gk-ml)); animation: ghPulse 2.6s var(--ease-out) infinite; }
.gd-tel--hot:hover { border-color: hsl(var(--kh) var(--gk-s) var(--gk-ml)); }
.gd-tel--hot:hover .gd-tel__ic { background: hsl(var(--kh) var(--gk-s) var(--gk-l)); color: var(--paper); }
.gd-ons { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 16px; padding-top: 16px; border-top: 1px dashed var(--line); }
.gd-on { display: inline-flex; align-items: center; gap: 11px; padding: 10px 14px; border-radius: 14px; background: var(--paper-2); text-decoration: none; min-width: 0; max-width: 100%;
transition: background .2s, transform .25s var(--ease); }
.gd-on:hover { background: var(--paper-3); transform: translateY(-1px); color: inherit; }
.gd-on > span { display: grid; min-width: 0; font-weight: 600; font-size: .92rem; overflow-wrap: anywhere; }
.gd-on small { font-size: .68rem; color: var(--muted); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }
.gd-on > .i { color: var(--accent); }
.gd-on .gd-on__x { width: 13px; height: 13px; color: var(--muted); }
.gd-infos { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); gap: 12px; margin-top: 14px; }
.gd-inf { display: flex; gap: 14px; padding: 16px 18px; border-radius: 18px; border: 1px solid var(--line); background: var(--card); }
.gd-inf__ic { flex: none; width: 40px; height: 40px; border-radius: 12px; display: grid; place-items: center; background: hsl(var(--kh) var(--gk-bs) var(--gk-bl)); color: hsl(var(--kh) var(--gk-s) var(--gk-l)); }
.gd-inf h3 { margin: 0 0 .35em; }
.gd-inf p { margin: 0; font-size: .96rem; }
.gd-inf p.muted { font-size: .85rem; margin-top: .3em; }
.gd-note { display: flex; gap: .6em; align-items: flex-start; margin: 18px 0 0; padding: 12px 16px; border-radius: 14px; background: color-mix(in oklab, var(--gold) 13%, transparent); color: var(--ink-2); font-size: .88rem; }
.gd-note .i { color: var(--gold); margin-top: .18em; }
.gd-nomap { display: grid; place-items: center; gap: 6px; text-align: center; padding: 38px 20px; border-radius: var(--r); border: 1px dashed var(--line); color: var(--muted); font-size: .9rem;
background: repeating-linear-gradient(45deg, var(--paper-2) 0 10px, transparent 10px 20px); }
.gd-nomap .i { width: 30px; height: 30px; color: var(--accent); }
.gd-nomap p { margin: 0; }
.gd-big { align-self: flex-start; }
.gd-par .kicker { margin-bottom: .7em; }
.gd-par__a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 18px; border: 1px solid var(--line); background: var(--card);
text-decoration: none; transition: border-color .25s, transform .3s var(--ease-out), box-shadow .3s; }
.gd-par__a:hover { border-color: hsl(var(--kh) var(--gk-s) var(--gk-ml)); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.gd-par__a > span:nth-child(2) { font-weight: 600; font-size: .95rem; line-height: 1.3; }
.gd-par__a small { display: block; margin-bottom: 2px; font-size: .68rem; text-transform: uppercase; letter-spacing: .08em; font-weight: 600; color: hsl(var(--kh) var(--gk-s) var(--gk-l)); }
.gd-par__a > .i { color: var(--muted); }
.gb { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); gap: 14px; align-items: stretch; }
.gfc { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: 10px; padding: 22px 22px 18px; border-radius: 22px; border: 1px solid var(--line); background: var(--card);
box-shadow: var(--shadow); transition: transform .4s var(--ease-out), box-shadow .4s; }
.gfc::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 4px; background: linear-gradient(90deg, hsl(var(--kh) var(--gk-s) var(--gk-ml)), var(--gold)); }
.gfc::after { content: ''; position: absolute; z-index: -1; width: 240px; height: 240px; right: -90px; top: -110px; border-radius: 50%;
background: radial-gradient(circle, hsl(var(--kh) 70% 60% / .16), transparent 70%); transition: transform .6s var(--ease-out); }
.gfc:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.gfc:hover::after { transform: scale(1.35); }
.gfc__top { display: flex; align-items: center; gap: 10px; }
.gfc__ic { flex: none; width: 42px; height: 42px; border-radius: 12px; display: grid; place-items: center; background: hsl(var(--kh) var(--gk-bs) var(--gk-bl)); color: hsl(var(--kh) var(--gk-s) var(--gk-l)); }
.gfc__k { margin: 0; font-size: .72rem; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: hsl(var(--kh) var(--gk-s) var(--gk-l)); }
.gfc__n { font-size: clamp(1.15rem, 1.7vw, 1.35rem); margin: 0; }
.gfc__n a { text-decoration: none; }
.gfc__n a::after { content: ''; position: absolute; inset: 0; }
.gfc__ad { display: flex; gap: .45em; margin: 0; font-size: .9rem; color: var(--ink-2); }
.gfc__ad .i { width: 15px; height: 15px; margin-top: .2em; color: var(--muted); }
.gfc__tels { position: relative; z-index: 1; display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 6px; }
.gfc__more { position: relative; z-index: 1; font-size: .88rem; align-self: flex-start; }
.gb__kinds { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 8px; padding: 18px; border-radius: 22px; border: 1px dashed var(--line); background: color-mix(in oklab, var(--paper-2) 65%, transparent); }
.gb__k { display: inline-flex; align-items: center; gap: .45em; padding: .5em .8em; border-radius: 999px; background: var(--card); border: 1px solid var(--line); font-size: .86rem; font-weight: 500;
text-decoration: none; transition: border-color .2s, transform .25s var(--ease); }
.gb__k .i { width: 1em; height: 1em; color: hsl(var(--kh) var(--gk-s) var(--gk-l)); }
.gb__k small { color: var(--muted); font-size: .74rem; }
.gb__k:hover { border-color: hsl(var(--kh) var(--gk-s) var(--gk-ml)); transform: translateY(-1px); color: inherit; }
.gb__rest { margin-top: 14px; }
@media (prefers-reduced-motion: no-preference) {
.gx-w > span { animation: gxRise 1.15s var(--ease-out) both; animation-delay: calc(var(--k) * 90ms + 140ms); }
.gh__main > :not(.gh__t) { animation: gxUp .95s var(--ease-out) both; }
.gh__main > .crumbs { animation-delay: .05s; } .gh__main > .gh__k { animation-delay: .12s; } .gh__main > .gh__lead { animation-delay: .38s; }
.gh__main > .gh__search { animation-delay: .5s; } .gh__main > .gh__stats { animation-delay: .62s; }
.ghl__h { animation: gxUp .9s var(--ease-out) .3s both; }
.ghl__it { animation: gxPop .85s var(--ease-out) both; animation-delay: calc(.42s + var(--i, 0) * 75ms); }
.gd-h__badge { animation: gxPop .9s var(--ease-out) .1s both; }
.gd-h__tt, .gd-h__lead, .gd-h__cta, .gd-h__chk { animation: gxUp .9s var(--ease-out) both; }
.gd-h__tt { animation-delay: .18s; } .gd-h__lead { animation-delay: .3s; } .gd-h__cta { animation-delay: .42s; } .gd-h__chk { animation-delay: .52s; }
.js .gr__it[data-reveal] .gr__bar i { transform: scaleX(0); transition: transform 1.3s var(--ease-out) .25s; }
.js .gr__it[data-reveal].is-in .gr__bar i { transform: none; }
}
@keyframes gxRise { from { transform: translateY(108%); } }
@keyframes gxUp { from { opacity: 0; transform: translateY(20px); } }
@keyframes gxPop { from { opacity: 0; transform: translateY(18px) scale(.96); } }
@media (prefers-reduced-motion: reduce) {
.gh__blob, .gx-orn, .gx-orn *, .ghl__siren::after, .ghl__ring::after, .gd-h__badge::after, .gd-tel--hot .gd-tel__ic::after { animation: none !important; }
.gx-orn * { stroke-dashoffset: 0; }
.ghl__it:hover .ghl__ring .i, .gl__tel:hover .i, .gd-tel:hover .gd-tel__ic .i, .gd-cta.btn--accent:hover .i { animation: none; }
.ghl__it::before { display: none; }
}
.gh__jump { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; }
.gh .btn--ghost { color: var(--gh-fg); border-color: var(--gh-line); background: color-mix(in oklab, var(--gh-fg) 5%, transparent); }
.gh .btn--ghost:hover { background: var(--gh-fg); border-color: var(--gh-fg); color: var(--gh-bg); }
.gh .btn--ghost .i { color: var(--gh-gold); }
.gh .btn--ghost:hover .i { color: inherit; }
.gm { position: relative; isolation: isolate; scroll-margin-top: var(--hdr); }
.gm::before { content: ''; position: absolute; inset: 0 0 auto; height: 70%; z-index: -1; pointer-events: none;
background: radial-gradient(60% 80% at 85% 0%, color-mix(in oklab, var(--gold) 12%, transparent), transparent 70%), linear-gradient(180deg, var(--paper-2), var(--paper)); }
.gm__h { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 16px 32px; margin-bottom: clamp(20px, 3vw, 32px); }
.gm__h .sec__lead { max-width: 62ch; }
.gm__n { display: grid; justify-items: end; margin: 0; line-height: 1; }
.gm__n b { font: 500 clamp(3rem, 7vw, 5.4rem)/.9 var(--serif); font-variant-numeric: lining-nums; color: var(--gold); letter-spacing: -.03em; }
.gm__n span { margin-top: 6px; font-size: .82rem; color: var(--muted); letter-spacing: .04em; }
.gm__tabs { position: relative; }
.gm__r { position: absolute; width: 1px; height: 1px; opacity: 0; pointer-events: none; }
.gm__bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 20px; }
.gm__tab { display: inline-flex; align-items: center; gap: .5em; padding: .6em 1.05em .6em .85em; border-radius: 999px; border: 1px solid var(--line); background: var(--card);
font-size: .9rem; font-weight: 600; cursor: pointer; user-select: none; transition: background .25s, border-color .25s, color .25s, transform .25s var(--ease), box-shadow .3s; }
.gm__tab .i { width: 1.1em; height: 1.1em; color: hsl(var(--kh, 30) var(--gk-s) var(--gk-l)); transition: color .25s; }
.gm__tab small { font-size: .75rem; font-weight: 600; color: var(--muted); font-variant-numeric: tabular-nums; }
.gm__tab:hover { transform: translateY(-1px); border-color: hsl(var(--kh, 30) var(--gk-s) var(--gk-ml)); }
#gm-all:checked ~ .gm__bar [for="gm-all"] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
#gm-markaziy:checked ~ .gm__bar [for="gm-markaziy"], #gm-vazirlik:checked ~ .gm__bar [for="gm-vazirlik"],
#gm-qomita:checked ~ .gm__bar [for="gm-qomita"], #gm-agentlik:checked ~ .gm__bar [for="gm-agentlik"] {
background: hsl(var(--kh) var(--gk-s) var(--gk-l)); border-color: transparent; color: var(--paper); box-shadow: 0 10px 22px -12px hsl(var(--kh) var(--gk-s) var(--gk-l)); }
#gm-all:checked ~ .gm__bar [for="gm-all"] .i, #gm-all:checked ~ .gm__bar [for="gm-all"] small,
#gm-markaziy:checked ~ .gm__bar [for="gm-markaziy"] :is(.i, small), #gm-vazirlik:checked ~ .gm__bar [for="gm-vazirlik"] :is(.i, small),
#gm-qomita:checked ~ .gm__bar [for="gm-qomita"] :is(.i, small), #gm-agentlik:checked ~ .gm__bar [for="gm-agentlik"] :is(.i, small) { color: inherit; }
#gm-all:focus-visible ~ .gm__bar [for="gm-all"], #gm-markaziy:focus-visible ~ .gm__bar [for="gm-markaziy"], #gm-vazirlik:focus-visible ~ .gm__bar [for="gm-vazirlik"],
#gm-qomita:focus-visible ~ .gm__bar [for="gm-qomita"], #gm-agentlik:focus-visible ~ .gm__bar [for="gm-agentlik"] { outline: 2px solid var(--accent); outline-offset: 3px; }
#gm-markaziy:checked ~ .gm__grid > :not([data-k="markaziy"]), #gm-vazirlik:checked ~ .gm__grid > :not([data-k="vazirlik"]),
#gm-qomita:checked ~ .gm__grid > :not([data-k="qomita"]), #gm-agentlik:checked ~ .gm__grid > :not([data-k="agentlik"]) { display: none; }
.gm__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); gap: 14px; }
.gm__grp { grid-column: 1 / -1; display: flex; align-items: center; gap: .55em; margin: 14px 0 0; font: 600 .76rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase;
color: hsl(var(--kh) var(--gk-s) var(--gk-l)); }
.gm__grp:first-child { margin-top: 0; }
.gm__grp .i { width: 1.2em; height: 1.2em; }
.gm__grp small { color: var(--muted); letter-spacing: 0; }
.gm__grp::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, hsl(var(--kh) var(--gk-s) var(--gk-ml) / .45), transparent); }
.gm-card { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: 10px; padding: 18px 18px 14px; border-radius: 20px; border: 1px solid var(--line);
background: var(--card); transition: transform .4s var(--ease-out), border-color .3s, box-shadow .4s; }
.gm-card::before { content: ''; position: absolute; z-index: -1; width: 220px; height: 220px; right: -90px; top: -110px; border-radius: 50%;
background: radial-gradient(circle, hsl(var(--kh) 70% 60% / .15), transparent 70%); transition: transform .7s var(--ease-out); }
.gm-card:hover { transform: translateY(-3px); border-color: hsl(var(--kh) var(--gk-s) var(--gk-ml)); box-shadow: var(--shadow-lg); }
.gm-card:hover::before { transform: scale(1.5); }
.gm-card__top { display: flex; align-items: center; gap: 10px; min-width: 0; }
.gm-card__ic { flex: none; width: 44px; height: 44px; border-radius: 14px; display: grid; place-items: center; background: hsl(var(--kh) var(--gk-bs) var(--gk-bl)); color: hsl(var(--kh) var(--gk-s) var(--gk-l));
transition: transform .5s var(--ease-out); }
.gm-card__ic .i { width: 22px; height: 22px; }
.gm-card:hover .gm-card__ic { transform: rotate(-8deg) scale(1.06); }
.gm-card__kind { min-width: 0; font-size: .7rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: hsl(var(--kh) var(--gk-s) var(--gk-l)); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gm-card__short { margin-left: auto; flex: none; padding: .3em .65em; border-radius: 8px; background: var(--paper-2); font: 700 .78rem/1 var(--sans); letter-spacing: .04em; color: var(--ink-2); }
.gm-card__n { margin: 0; font-size: clamp(1.08rem, 1.5vw, 1.22rem); line-height: 1.25; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.gm-card__n a { text-decoration: none; }
.gm-card__n a::after { content: ''; position: absolute; inset: 0; z-index: 0; }
.gm-card__n a:hover { color: inherit; }
.gm-card__s { margin: 0; font-size: .88rem; line-height: 1.5; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.gm-card__foot { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: auto; padding-top: 6px; }
.gm-card__web { display: inline-flex; align-items: center; gap: .4em; min-height: 34px; padding: .38em .8em; border-radius: 999px; border: 1px solid var(--line); font-size: .82rem; font-weight: 500;
text-decoration: none; color: var(--ink-2); transition: border-color .2s, color .2s; max-width: 100%; }
.gm-card__web span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gm-card__web .i { width: 14px; height: 14px; color: var(--accent-2); }
.gm-card__web:hover { border-color: var(--accent-2); color: var(--ink); }
.gm-card__go { margin-left: auto; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; color: var(--muted); transition: background .25s, color .25s, transform .4s var(--ease-out); }
.gm-card__go .i { width: 17px; height: 17px; }
.gm-card:hover .gm-card__go { background: var(--ink); color: var(--paper); transform: rotate(45deg); }
.gm--subs .gm__grid { margin-top: 4px; }
.gd-h__short { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .5em; margin: 12px 0 0; padding: .35em .8em; border-radius: 999px; border: 1px solid var(--gh-line);
font: 700 .85rem/1.2 var(--sans); letter-spacing: .05em; color: var(--c); }
.gd-h__short span { font-weight: 500; letter-spacing: 0; color: var(--gh-mute); }
.gd-on--v { background: color-mix(in oklab, var(--accent-2) 12%, var(--paper-2)); }
.gd-on--v > .i { color: var(--accent-2); }
.gd-fn, .gd-sv, .gd-about { margin-top: 18px; border: 1px solid var(--line); border-radius: 22px; background: var(--card); padding: clamp(18px, 2.6vw, 28px); }
.gd-fn__l { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; counter-reset: fn; }
.gd-fn__l li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: baseline; padding: 12px 0; border-top: 1px dashed var(--line); font-size: 1rem; line-height: 1.5; }
.gd-fn__l li:first-child { border-top: 0; padding-top: 2px; }
.gd-fn__n { font: 500 1.5rem/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; color: hsl(var(--kh) var(--gk-s) var(--gk-ml)); min-width: 2ch; }
.gd-sv__lead { margin: -6px 0 14px; font-size: .9rem; color: var(--muted); }
.gd-sv__g { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 10px; }
.gd-sv__a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 16px; border: 1px solid var(--line); background: var(--paper);
text-decoration: none; font-size: .92rem; font-weight: 600; line-height: 1.35; transition: border-color .25s, transform .3s var(--ease-out), box-shadow .3s; }
.gd-sv__a:hover { border-color: var(--accent-2); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.gd-sv__ic { width: 36px; height: 36px; border-radius: 11px; display: grid; place-items: center; background: color-mix(in oklab, var(--accent-2) 14%, transparent); color: var(--accent-2); }
.gd-sv__x { width: 15px; height: 15px; color: var(--muted); transition: transform .3s var(--ease-out); }
.gd-sv__a:hover .gd-sv__x { transform: translate(2px, -2px); color: var(--accent-2); }
.gd-about .prose { font-size: 1.02rem; }
.gu { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 12px; }
.gu__it { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: 8px; padding: 18px 18px 14px; border-radius: 18px; border: 1px solid var(--line); background: var(--card);
transition: transform .4s var(--ease-out), border-color .3s, box-shadow .35s; }
.gu__it::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: linear-gradient(180deg, hsl(var(--h) 60% 52%), hsl(var(--kh) var(--gk-s) var(--gk-ml))); }
.gu__it:hover { transform: translateY(-2px); border-color: hsl(var(--h) var(--gk-s) var(--gk-ml)); box-shadow: var(--shadow); }
.gu__r { margin: 0; font: 600 .72rem/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: hsl(var(--h) var(--gk-s) var(--gk-l)); }
.gu__n { margin: 0; font-size: 1.05rem; line-height: 1.3; }
.gu__n a { text-decoration: none; }
.gu__ad { display: flex; gap: .4em; margin: 0; font-size: .85rem; color: var(--muted); }
.gu__ad .i { width: 14px; height: 14px; margin-top: .2em; flex: none; }
.gu__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin-top: auto; padding-top: 4px; }
.gu__all { margin-left: auto; display: inline-flex; align-items: center; gap: .35em; font-size: .85rem; font-weight: 600; text-decoration: none; }
.gu__all .i { width: 15px; height: 15px; transition: transform .3s var(--ease-out); }
.gu__all:hover .i { transform: translateX(3px); }
.gd .facts dt, .gd .facts dd { overflow-wrap: anywhere; hyphens: auto; }
@media (prefers-reduced-motion: no-preference) {
#gm-markaziy:checked ~ .gm__grid > [data-k="markaziy"], #gm-vazirlik:checked ~ .gm__grid > [data-k="vazirlik"],
#gm-qomita:checked ~ .gm__grid > [data-k="qomita"], #gm-agentlik:checked ~ .gm__grid > [data-k="agentlik"] { animation: gxPop .55s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 35ms); }
.js .gd-fn[data-reveal] li { opacity: 0; transform: translateX(-10px); transition: opacity .6s var(--ease-out), transform .6s var(--ease-out); transition-delay: calc(var(--i, 0) * 70ms + 150ms); }
.js .gd-fn[data-reveal].is-in li { opacity: 1; transform: none; }
}
@media (max-width: 560px) {
.gm__n { justify-items: start; }
.gm__bar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; margin-inline: calc(var(--gut) * -1); padding: 2px var(--gut) 4px; }
.gm__bar::-webkit-scrollbar { display: none; }
.gm__tab { flex: none; }
}
.bm {
--bm-place: var(--accent); --bm-hotel: var(--accent-2); --bm-restaurant: var(--gold);
--bm-org: hsl(224 46% 44%); --bm-transport: hsl(278 34% 47%); --bm-bank: hsl(146 42% 33%);
--bm-on: var(--card); --bm-ring: var(--card); --bm-shadow: var(--ink); --bm-line: var(--line);
--bm-glass: color-mix(in oklab, var(--card) 88%, transparent);
--bm-invert: none;
--pw: 392px; --peek: 172px;
}
:root[data-theme="dark"] .bm { --bm-org: hsl(224 70% 72%); --bm-transport: hsl(278 52% 76%); --bm-bank: hsl(146 45% 62%); --bm-on: var(--paper); --bm-ring: var(--paper-2); --bm-shadow: var(--paper); --bm-invert: invert(1); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .bm { --bm-org: hsl(224 70% 72%); --bm-transport: hsl(278 52% 76%); --bm-bank: hsl(146 45% 62%); --bm-on: var(--paper); --bm-ring: var(--paper-2); --bm-shadow: var(--paper); --bm-invert: invert(1); } }
.bm-c--place { --c: var(--bm-place); } .bm-c--hotel { --c: var(--bm-hotel); } .bm-c--restaurant { --c: var(--bm-restaurant); }
.bm-c--org { --c: var(--bm-org); } .bm-c--transport { --c: var(--bm-transport); } .bm-c--bank { --c: var(--bm-bank); }
body.page-map { height: 100vh; height: 100dvh; overflow: hidden; }
.page-map main { flex: 1 1 auto; min-height: 0; display: flex; position: relative; }
.page-map .ftr { display: none; }
.bm { position: relative; flex: 1; min-height: 0; min-width: 0; overflow: hidden; isolation: isolate; background: var(--paper-3); }
.bm > .bm__map { position: absolute; inset: 0; width: auto; height: auto; }
.bm__map:focus-visible { outline: none; }
.bm .maplibregl-canvas:focus-visible { outline: 2px solid var(--accent); outline-offset: -2px; }
html:not(.js) .bm__loader, html:not(.js) .bm-toggle { display: none; }
.bm__loader { position: absolute; inset: 0; z-index: 8; display: grid; place-content: center; justify-items: center; gap: 16px; color: var(--accent);
background-color: var(--paper-2);
background-image: radial-gradient(circle at 50% 45%, color-mix(in oklab, var(--accent) 14%, transparent), transparent 55%),
conic-gradient(from 45deg at 50% 50%, color-mix(in oklab, var(--line) 55%, transparent) 0 25%, transparent 0 50%, color-mix(in oklab, var(--line) 55%, transparent) 0 75%, transparent 0);
background-size: 100% 100%, 48px 48px; transition: opacity .7s var(--ease), visibility .7s; }
.bm__loader svg { width: 72px; height: 72px; }
.bm__loader svg * { stroke-dasharray: 1; stroke-dashoffset: 1; animation: bmDraw 1.5s var(--ease-out) infinite alternate; }
.bm__loader svg :nth-child(2) { animation-delay: .2s; } .bm__loader svg :nth-child(3) { animation-delay: .4s; }
.bm__loader p { margin: 0; font-size: .92rem; font-weight: 500; color: var(--ink-2); letter-spacing: .02em; }
.bm__loader.is-out { opacity: 0; visibility: hidden; }
.bm__loader.is-err svg * { animation: none; stroke-dashoffset: 0; }
.bm__loader.is-err p { color: var(--bad); }
@keyframes bmDraw { to { stroke-dashoffset: 0; } }
.bm-panel { position: absolute; z-index: 10; top: 16px; left: 16px; bottom: 16px; width: var(--pw); display: flex; flex-direction: column;
border-radius: 26px; background: var(--bm-glass); border: 1px solid color-mix(in oklab, var(--line) 85%, transparent); box-shadow: var(--shadow-lg);
-webkit-backdrop-filter: blur(20px) saturate(1.35); backdrop-filter: blur(20px) saturate(1.35); transition: transform .65s var(--ease-out), opacity .4s; }
.bm-panel__in { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; padding: 22px 20px 18px; display: flex; flex-direction: column; gap: 16px; scrollbar-width: thin; scrollbar-color: var(--line) transparent; }
.bm-panel__grip { display: none; }
.bm-panel__h .kicker { margin-bottom: .6em; }
.bm-panel__t { font-size: clamp(1.7rem, 2.3vw, 2.15rem); line-height: 1.02; margin: 0; letter-spacing: -.02em; }
.bm-panel__lead { margin: 10px 0 0; font-size: .87rem; line-height: 1.5; color: var(--ink-2); }
.bm.is-collapsed .bm-panel { transform: translateX(calc(-100% - 28px)); }
.bm-toggle { position: absolute; z-index: 11; top: 26px; left: calc(16px + var(--pw) + 10px); width: 38px; height: 38px; background: var(--bm-glass); border: 1px solid var(--line);
box-shadow: var(--shadow); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); transition: left .65s var(--ease-out), rotate .5s var(--ease-out), background .2s; }
.bm-toggle:hover { background: var(--card); }
.bm.is-collapsed .bm-toggle { left: 16px; rotate: 180deg; }
.bm-search { position: relative; display: flex; align-items: center; gap: 8px; padding: 4px 4px 4px 14px; border-radius: 16px; border: 1px solid var(--line); background: var(--paper);
transition: border-color .2s, box-shadow .25s; }
.bm-search > .i { color: var(--muted); }
.bm-search:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 22%, transparent); }
.bm-search input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; padding: .66em 0; font-size: 1rem; color: var(--ink); }
.bm-search input::-webkit-search-cancel-button { display: none; }
.bm-search__x { width: 36px; height: 36px; }
.bm-res { margin-top: -8px; padding: 6px; border-radius: 16px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); animation: bmFade .25s var(--ease-out); }
.bm-r { width: 100%; display: flex; align-items: center; gap: 11px; padding: 8px; border: 0; border-radius: 12px; background: none; text-align: left; color: inherit; }
.bm-r:hover, .bm-r[aria-selected="true"] { background: var(--paper-2); }
.bm-r > span:last-child { display: grid; min-width: 0; }
.bm-r b { font-weight: 600; font-size: .92rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bm-r small { font-size: .76rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bm-r__ic { flex: none; width: 34px; height: 34px; border-radius: 10px; display: grid; place-items: center; background: color-mix(in oklab, var(--c, var(--accent)) 16%, transparent); color: var(--c, var(--accent)); }
.bm-r__ic .i { width: 17px; height: 17px; }
.bm-r__none { margin: 0; padding: 12px; color: var(--muted); font-size: .9rem; }
.bm-layers { border: 0; margin: 0; padding: 0; min-width: 0; }
.bm-layers legend { padding: 0; margin-bottom: 10px; color: var(--muted); }
.bm-layers legend .i, .bm-region .kicker .i, .bm-kinds .kicker .i { color: var(--accent); }
.bm-layers__row { display: flex; flex-wrap: wrap; gap: 7px; }
.bm-layer { position: relative; min-width: 0; flex: 1 1 auto; }
.bm-layer input { position: absolute; opacity: 0; pointer-events: none; }
.bm-layer__in { display: flex; align-items: center; gap: 7px; height: 100%; padding: 4px 12px 4px 4px; border-radius: 999px; border: 1px solid var(--line); background: var(--paper);
cursor: pointer; font-size: .82rem; font-weight: 600; white-space: nowrap; transition: border-color .25s, background .25s, opacity .25s, transform .25s var(--ease); }
.bm-layer__in:hover { transform: translateY(-1px); }
.bm-layer__ic { flex: none; width: 29px; height: 29px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in oklab, var(--c) 16%, transparent); color: var(--c);
transition: background .3s, color .3s, transform .45s var(--ease-out); }
.bm-layer__ic .i { width: 16px; height: 16px; }
.bm-layer__t { flex: 1; min-width: 0; line-height: 1.2; overflow: hidden; text-overflow: ellipsis; }
.bm-layer small { color: var(--muted); font-size: .72rem; font-variant-numeric: tabular-nums; }
.bm-layer input:checked + .bm-layer__in { border-color: color-mix(in oklab, var(--c) 70%, transparent); background: color-mix(in oklab, var(--c) 9%, var(--card)); }
.bm-layer input:checked + .bm-layer__in .bm-layer__ic { background: var(--c); color: var(--bm-on); transform: rotate(-8deg); }
.bm-layer input:not(:checked) + .bm-layer__in { opacity: .66; }
.bm-layer input:focus-visible + .bm-layer__in { outline: 2px solid var(--accent); outline-offset: 2px; }
.bm-region { display: grid; gap: 8px; }
.bm-region .kicker { margin: 0; color: var(--muted); }
.bm-region select { appearance: none; -webkit-appearance: none; width: 100%; padding: .7em 2.6em .7em 1em; border-radius: 14px; border: 1px solid var(--line); font-size: .94rem; cursor: pointer; color: var(--ink);
background-color: var(--paper); background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
background-position: calc(100% - 21px) 54%, calc(100% - 16px) 54%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
.bm-region select:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 22%, transparent); }
.bm-kinds .kicker { margin: 0 0 8px; color: var(--muted); }
.bm-kinds__row { display: flex; flex-wrap: wrap; gap: 6px; }
.bm-kind { display: inline-flex; align-items: center; gap: .4em; padding: .42em .75em; border-radius: 999px; border: 1px solid var(--line); background: var(--paper); font-size: .8rem; font-weight: 500;
color: inherit; transition: background .2s, border-color .2s, color .2s; animation: bmFade .35s var(--ease-out) both; }
.bm-kind .i { width: 14px; height: 14px; color: var(--c); }
.bm-kind small { color: var(--muted); font-size: .72rem; }
.bm-kind:hover { border-color: var(--c); }
.bm-kind[aria-pressed="true"] { background: var(--c); border-color: var(--c); color: var(--bm-on); }
.bm-kind[aria-pressed="true"] .i, .bm-kind[aria-pressed="true"] small { color: inherit; }
.bm-list { display: flex; flex-direction: column; gap: 8px; }
.bm-list__h { display: flex; align-items: center; gap: 10px; margin: 0; font-size: .72rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.bm-list__h::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.bm-list__ol { list-style: none; margin: 0 -6px; padding: 0; display: grid; gap: 2px; }
.bm-list__ol > li { animation: bmItem .5s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 22ms); }
.bm-it { width: 100%; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; padding: 7px; border: 0; border-radius: 15px; background: none; text-align: left; color: inherit;
transition: background .2s; }
.bm-it:hover, .bm-it:focus-visible { background: color-mix(in oklab, var(--c) 9%, var(--paper-2)); }
.bm-it__m { width: 48px; height: 48px; border-radius: 13px; overflow: hidden; display: grid; place-items: center; background: color-mix(in oklab, var(--c) 15%, transparent); color: var(--c); }
.bm-it__m img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s var(--ease-out); }
.bm-it:hover .bm-it__m img { transform: scale(1.08); }
.bm-it__m .i { width: 21px; height: 21px; }
.bm-it__b { display: grid; min-width: 0; gap: 1px; }
.bm-it__b b { font-weight: 600; font-size: .92rem; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bm-it__b small { font-size: .76rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bm-it__go { width: 16px; height: 16px; color: var(--muted); transition: transform .3s var(--ease-out), color .2s; }
.bm-it:hover .bm-it__go { transform: translateX(3px); color: var(--c); }
.bm-list__empty { display: grid; justify-items: center; gap: 8px; padding: 22px 12px; text-align: center; color: var(--muted); font-size: .88rem; }
.bm-list__empty .i { width: 30px; height: 30px; color: var(--accent); }
.bm-noscript { padding: 12px; border-radius: 14px; background: var(--paper-2); font-size: .9rem; }
.bm-noscript p { margin: 0 0 8px; }
.bm .maplibregl-ctrl-top-right { top: 10px; right: 10px; }
.bm-ctl { display: grid; gap: 10px; }
.bm-ctl__g { display: grid; border-radius: 16px; overflow: hidden; background: var(--bm-glass); border: 1px solid var(--line); box-shadow: var(--shadow);
-webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.bm-ctl button { width: 44px; height: 44px; display: grid; place-items: center; border: 0; background: none; color: var(--ink); transition: background .2s, color .2s; }
.bm-ctl button + button { border-top: 1px solid var(--line); }
.bm-ctl button:hover { background: color-mix(in oklab, var(--accent) 12%, transparent); color: var(--accent); }
.bm-ctl .i { width: 19px; height: 19px; }
.bm-ctl .is-busy .i { animation: gxSpinBm 1s linear infinite; color: var(--accent); }
@keyframes gxSpinBm { to { rotate: 360deg; } }
.bm .maplibregl-ctrl.maplibregl-ctrl-attrib, .bm .maplibregl-ctrl-attrib.maplibregl-compact, .bm .maplibregl-ctrl-attrib.maplibregl-compact-show {
background: color-mix(in oklab, var(--card) 86%, transparent); color: var(--muted); font-size: 10.5px; border-radius: 12px; }
.bm .maplibregl-ctrl-attrib a { color: var(--ink-2); }
.bm .maplibregl-ctrl-attrib-button { filter: var(--bm-invert); }
.bm .maplibregl-ctrl-bottom-right { right: 6px; bottom: 6px; }
.bm-clw { cursor: pointer; }
.bm-cl { --s: 46px; position: relative; display: grid; place-items: center; width: var(--s); height: var(--s); padding: 0; border: 0; border-radius: 50%; background: none; color: var(--ink);
cursor: pointer; transition: transform .35s var(--ease-out); animation: bmPop .55s var(--ease-out) both; }
.bm-cl::before { content: ''; position: absolute; inset: -7px; z-index: -1; border-radius: 50%; background: radial-gradient(circle, color-mix(in oklab, var(--accent) 26%, transparent), transparent 68%);
animation: bmBreath 3.4s ease-in-out infinite; }
.bm-cl svg { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; filter: drop-shadow(0 4px 8px color-mix(in oklab, var(--bm-shadow) 30%, transparent)); }
.bm-cl svg circle { fill: none; stroke-width: 6.4; stroke: var(--c); transition: stroke-width .3s; }
.bm-cl svg .bm-cl__bg { fill: var(--card); stroke: var(--card); stroke-width: 9.5; }
.bm-cl b { position: relative; font: 700 .8rem/1 var(--sans); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.bm-cl:hover { transform: scale(1.12); }
.bm-cl:hover svg circle:not(.bm-cl__bg) { stroke-width: 7.4; }
.bm-cl:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
@keyframes bmPop { from { transform: scale(.4); opacity: 0; } }
@keyframes bmBreath { 50% { transform: scale(1.18); opacity: .55; } }
.bm-pop { z-index: 6; }
.bm-pop .maplibregl-popup-content { padding: 0; border-radius: 22px; background: var(--card); color: var(--ink); box-shadow: var(--shadow-lg); overflow: hidden; }
.bm-pop.maplibregl-popup-anchor-bottom .maplibregl-popup-tip, .bm-pop.maplibregl-popup-anchor-bottom-left .maplibregl-popup-tip, .bm-pop.maplibregl-popup-anchor-bottom-right .maplibregl-popup-tip { border-top-color: var(--card); }
.bm-pop.maplibregl-popup-anchor-top .maplibregl-popup-tip, .bm-pop.maplibregl-popup-anchor-top-left .maplibregl-popup-tip, .bm-pop.maplibregl-popup-anchor-top-right .maplibregl-popup-tip { border-bottom-color: var(--card); }
.bm-pop.maplibregl-popup-anchor-left .maplibregl-popup-tip { border-right-color: var(--card); }
.bm-pop.maplibregl-popup-anchor-right .maplibregl-popup-tip { border-left-color: var(--card); }
.bm-card { position: relative; width: 310px; max-width: 100%; animation: bmCard .55s var(--ease-out) both; }
.bm-card__m { position: relative; aspect-ratio: 16 / 10; overflow: hidden; display: grid; place-items: center; color: var(--c); background: color-mix(in oklab, var(--c) 14%, var(--paper-2)); }
.bm-card__m::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, color-mix(in oklab, var(--bm-shadow) 45%, transparent)); pointer-events: none; }
.bm-card__m img { width: 100%; height: 100%; object-fit: cover; animation: bmKen 9s ease-out both; }
.bm-card__m--ph { background-image: conic-gradient(from 45deg at 50% 50%, color-mix(in oklab, var(--c) 12%, transparent) 0 25%, transparent 0 50%, color-mix(in oklab, var(--c) 12%, transparent) 0 75%, transparent 0);
background-size: 34px 34px; }
.bm-card__m--ph::after { display: none; }
.bm-card__phi { width: 64px; height: 64px; stroke-width: 1.2; opacity: .85; }
.bm-card__badge { position: absolute; z-index: 1; left: 12px; bottom: 12px; display: inline-flex; align-items: center; gap: .4em; max-width: calc(100% - 24px); padding: .42em .78em .42em .6em; border-radius: 999px;
background: var(--c); color: var(--bm-on); font: 600 .74rem/1.1 var(--sans); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; box-shadow: var(--shadow); }
.bm-card__badge .i { width: 14px; height: 14px; }
.bm-card__b { padding: 14px 16px 16px; }
.bm-card__k { margin: 0 0 4px; font-size: .68rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.bm-card__t { font-size: 1.26rem; line-height: 1.15; margin: 0 0 14px; }
.bm-card__t a { text-decoration: none; }
.bm-card__t a:hover { color: var(--accent); }
.bm-card__a { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.bm-card__nav { margin-left: auto; border-color: var(--line); width: 38px; height: 38px; }
.bm-card__x { position: absolute; z-index: 2; top: 10px; right: 10px; width: 34px; height: 34px; background: color-mix(in oklab, var(--card) 82%, transparent); color: var(--ink);
-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); box-shadow: var(--shadow); }
.bm-card__x:hover { background: var(--card); }
@keyframes bmCard { from { opacity: 0; transform: translateY(12px) scale(.97); } }
@keyframes bmKen { from { transform: scale(1.12); } }
.bm-sheetcard { position: absolute; z-index: 20; left: 10px; right: 10px; bottom: 10px; }
.bm-sheetcard .bm-card { width: auto; display: grid; grid-template-columns: 40% minmax(0, 1fr); border-radius: 22px; overflow: hidden; background: var(--card); box-shadow: var(--shadow-lg);
animation: bmSheet .55s var(--ease-out) both; }
.bm-sheetcard .bm-card__m { aspect-ratio: auto; min-height: 168px; }
.bm-sheetcard .bm-card__badge { left: 8px; bottom: 8px; font-size: .66rem; }
.bm-sheetcard .bm-card__b { padding: 14px 14px 14px; }
.bm-sheetcard .bm-card__t { font-size: 1.08rem; margin-bottom: 10px; padding-right: 26px; }
.bm-sheetcard .bm-card__x { top: 8px; right: 8px; width: 32px; height: 32px; }
@keyframes bmSheet { from { opacity: 0; transform: translateY(40px); } }
.bm-tip { pointer-events: none; z-index: 5; }
.bm-tip .maplibregl-popup-content { padding: 7px 11px; border-radius: 12px; background: var(--ink); color: var(--paper); box-shadow: var(--shadow); display: grid; gap: 1px; animation: bmFade .2s var(--ease-out); }
.bm-tip .maplibregl-popup-content b { font: 600 .82rem/1.25 var(--sans); }
.bm-tip .maplibregl-popup-content small { font-size: .7rem; opacity: .7; }
.bm-tip .maplibregl-popup-tip { display: none; }
.bm-me { width: 18px; height: 18px; border-radius: 50%; background: var(--accent-2); border: 3px solid var(--card); box-shadow: var(--shadow); }
.bm-me span, .bm-me::after { content: ''; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid var(--accent-2); animation: bmPulse 2.2s var(--ease-out) infinite; }
.bm-me::after { animation-delay: 1.1s; }
@keyframes bmPulse { from { transform: scale(1); opacity: .8; } to { transform: scale(3.2); opacity: 0; } }
.bm-toast { position: absolute; z-index: 40; left: 50%; top: 16px; translate: -50% 0; margin: 0; padding: .7em 1.15em; border-radius: 999px; background: var(--ink); color: var(--paper);
font-size: .88rem; font-weight: 500; box-shadow: var(--shadow-lg); animation: bmCard .4s var(--ease-out); white-space: nowrap; max-width: calc(100% - 32px); overflow: hidden; text-overflow: ellipsis; }
@keyframes bmFade { from { opacity: 0; transform: translateY(-4px); } }
@keyframes bmItem { from { opacity: 0; transform: translateY(8px); } }
@keyframes bmIn { from { opacity: 0; translate: -24px 0; } }
@keyframes bmUp { from { opacity: 0; translate: 0 40px; } }
@media (prefers-reduced-motion: no-preference) {
.bm-panel { animation: bmIn .9s var(--ease-out) .1s both; }
.bm-toggle { animation: bmFade .6s var(--ease-out) .5s both; }
}
@media (min-width: 761px) and (max-width: 1100px) {
.bm { --pw: 336px; }
.bm-panel__in { padding: 18px 16px 16px; gap: 14px; }
.bm-panel__lead { display: none; }
}
@media (max-width: 760px) {
.bm-panel { top: auto; left: 0; right: 0; bottom: 0; width: auto; height: min(84%, 700px); border-radius: 24px 24px 0 0; border-bottom: 0;
transform: translateY(calc(100% - var(--peek))); transition: transform .55s var(--ease-out); }
.bm-panel.is-open { transform: none; }
.bm-panel.is-drag { transition: none; }
.bm.has-card .bm-panel { transform: translateY(100%); }
.bm-panel__grip { display: grid; place-items: center; flex: none; width: 100%; height: 28px; padding: 0; border: 0; background: none; cursor: grab; touch-action: none; }
.bm-panel__grip span { width: 44px; height: 5px; border-radius: 3px; background: color-mix(in oklab, var(--ink) 22%, transparent); }
.bm-panel__in { padding: 0 14px 18px; gap: 12px; }
.bm-panel__h { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.bm-layers legend { display: none; }
.bm-layers__row { display: flex; flex-wrap: nowrap; gap: 7px; overflow-x: auto; scrollbar-width: none; margin-inline: -14px; padding: 2px 14px 4px; }
.bm-layers__row::-webkit-scrollbar { display: none; }
.bm-layer { flex: none; }
.bm-layer__in { padding: 5px 12px 5px 5px; border-radius: 999px; white-space: nowrap; }
.bm-layer__ic { width: 30px; height: 30px; border-radius: 50%; }
.bm-layer small { display: none; }
.bm-toggle { display: none; }
.bm .maplibregl-ctrl-top-right { top: 8px; right: 8px; }
.bm .maplibregl-ctrl-bottom-right { bottom: calc(var(--peek) + 4px); }
.bm-ctl button { width: 42px; height: 42px; }
@media (prefers-reduced-motion: no-preference) { .bm-panel { animation: bmUp .8s var(--ease-out) .1s both; } }
}
@media (max-width: 760px) and (max-height: 560px) { .bm { --peek: 128px; } }
@media (prefers-reduced-motion: reduce) {
.bm__loader svg * { animation: none; stroke-dashoffset: 0; }
.bm-cl, .bm-cl::before, .bm-card, .bm-card__m img, .bm-sheetcard .bm-card, .bm-list__ol > li, .bm-kind, .bm-res, .bm-me span, .bm-me::after, .bm-toast, .bm-tip .maplibregl-popup-content { animation: none !important; }
.bm-panel, .bm-toggle { transition: none; }
}
.fb, .fbx {
--fb-bg: var(--ink);
--fb-fg: var(--paper);
--fb-mut: color-mix(in oklab, var(--fb-fg) 58%, var(--fb-bg));
--fb-line: color-mix(in oklab, var(--fb-fg) 12%, var(--fb-bg));
--fb-tile: color-mix(in oklab, var(--fb-fg) 9%, var(--fb-bg));
--fb-tile-2: color-mix(in oklab, var(--fb-fg) 15%, var(--fb-bg));
--fb-seam: color-mix(in oklab, var(--fb-bg) 85%, transparent);
--fb-amber: color-mix(in oklab, var(--gold) 62%, var(--fb-fg));
--fb-ok: color-mix(in oklab, var(--ok) 62%, var(--fb-fg));
--fb-warn: color-mix(in oklab, var(--warn) 66%, var(--fb-fg));
--fb-bad: color-mix(in oklab, var(--bad) 64%, var(--fb-fg));
--fb-info: color-mix(in oklab, var(--accent-2) 62%, var(--fb-fg));
--fb-go: color-mix(in oklab, var(--accent) 72%, var(--fb-fg));
}
:root[data-theme="dark"] :is(.fb, .fbx) { --fb-bg: var(--paper-2); --fb-fg: var(--ink); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] :is(.fb, .fbx) { --fb-bg: var(--paper-2); --fb-fg: var(--ink); } }
.ft { display: inline-flex; align-items: center; gap: 2px; font: 650 1em/1 var(--sans); font-variant-numeric: tabular-nums; font-feature-settings: 'tnum', 'zero';
white-space: nowrap; vertical-align: middle; perspective: 320px; position: relative; }
.ft b { position: relative; display: inline-grid; place-items: center; min-width: .74em; height: 1.36em; padding: 0 .07em; border-radius: .16em; font-weight: 650;
color: var(--fb-fg); background: linear-gradient(180deg, var(--fb-tile-2) 0 50%, var(--fb-tile) 50% 100%);
box-shadow: inset 0 -1px 0 color-mix(in oklab, var(--fb-bg) 60%, transparent), 0 1px 0 color-mix(in oklab, var(--fb-fg) 6%, transparent); transform-origin: 50% 50%; }
.ft b::after { content: ''; position: absolute; inset: 50% 0 auto; height: 1px; background: var(--fb-seam); }
.ft i { font-style: normal; display: inline-grid; place-items: center; min-width: .3em; color: var(--fb-mut); }
.ft--new b { color: var(--fb-amber); }
.ft--was { opacity: .55; }
.ft--was::after { content: ''; position: absolute; left: -3px; right: -3px; top: 50%; height: 2px; border-radius: 2px; background: var(--fb-amber); transform: rotate(-9deg); }
.ft--xl { font-size: clamp(2.6rem, 7vw, 5.4rem); gap: .06em; }
.ft--xl b { border-radius: .1em; min-width: .8em; height: 1.3em; }
@media (prefers-reduced-motion: no-preference) {
.ft b.is-flip { animation: ftFlip .52s var(--ease-out) both; animation-delay: calc(var(--i, 0) * 42ms); }
}
@keyframes ftFlip { 0% { transform: rotateX(-92deg); filter: brightness(1.7); } 55% { transform: rotateX(14deg); } 80% { transform: rotateX(-5deg); } 100% { transform: none; filter: none; } }
.fb__dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--ok); flex: none; margin-right: .5em; vertical-align: .05em;
box-shadow: 0 0 0 0 color-mix(in oklab, var(--ok) 55%, transparent); }
.is-stale .fb__dot { background: var(--warn); }
@media (prefers-reduced-motion: no-preference) { .fb__dot { animation: liveDot 2.2s var(--ease) infinite; } }
@keyframes liveDot { 0% { box-shadow: 0 0 0 0 color-mix(in oklab, var(--ok) 55%, transparent); } 70%, 100% { box-shadow: 0 0 0 9px color-mix(in oklab, var(--ok) 0%, transparent); } }
.fb { position: relative; color: var(--fb-fg); background: radial-gradient(120% 70% at 100% 0%, color-mix(in oklab, var(--fb-go) 9%, transparent), transparent 60%),
linear-gradient(180deg, color-mix(in oklab, var(--fb-fg) 4%, var(--fb-bg)), var(--fb-bg) 220px);
border-radius: 22px; padding: clamp(14px, 2.4vw, 28px); box-shadow: var(--shadow-lg); border: 1px solid var(--fb-line); isolation: isolate; }
.fb a { color: inherit; }
.fb a:hover { color: var(--fb-fg); }
.fb[data-dir="arr"] .only-dep, .fb[data-dir="dep"] .only-arr { display: none; }
.fb__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px 28px; flex-wrap: wrap; margin-bottom: 18px; }
.fb__ttl { display: flex; gap: 14px; align-items: center; min-width: 0; }
.fb__ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; flex: none; background: var(--fb-go); color: var(--fb-bg); }
.fb__ic .i { width: 26px; height: 26px; }
.fb__k { margin: 0 0 .35em; font: 600 .72rem/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase; color: var(--fb-mut); display: flex; align-items: center; }
.fb__h { margin: 0; font: 700 clamp(1.3rem, 2.6vw, 2rem)/1.1 var(--sans); letter-spacing: -.01em; color: var(--fb-fg); }
.fb__hs { color: var(--fb-mut); font-weight: 500; }
.fb__clock { display: grid; justify-items: end; gap: 6px; }
.fb__time { font-size: clamp(1.5rem, 2.6vw, 2.1rem); }
.fb__time .ft i { animation: none; }
@media (prefers-reduced-motion: no-preference) { .fb__time .ft i { animation: colon 2s steps(1) infinite; } }
@keyframes colon { 50% { opacity: .25; } }
.fb__date { font-size: .8rem; color: var(--fb-mut); }
.fb__date::first-letter { text-transform: uppercase; }
.fb__bar { display: flex; flex-wrap: wrap; gap: 10px 12px; align-items: center; margin-bottom: 12px; }
.fb__seg { display: inline-flex; gap: 2px; padding: 4px; border-radius: 999px; background: var(--fb-tile); max-width: 100%; }
.fb__seg a { display: inline-flex; align-items: center; gap: .45em; padding: .56em 1.05em; border-radius: 999px; font: 600 .88rem/1 var(--sans); color: var(--fb-mut); text-decoration: none; white-space: nowrap; transition: background .25s var(--ease), color .25s; }
.fb__seg a .i { width: 17px; height: 17px; }
.fb__seg a:hover { color: var(--fb-fg); }
.fb__seg a[aria-current] { background: var(--fb-fg); color: var(--fb-bg); }
.fb__q { position: relative; flex: 1 1 240px; display: flex; align-items: center; min-width: 0; margin-left: auto; max-width: 380px; }
.fb__q .i { position: absolute; left: 14px; color: var(--fb-mut); pointer-events: none; }
.fb__q input { width: 100%; padding: .66em 1em .66em 2.6em; border-radius: 999px; border: 1px solid var(--fb-line); background: var(--fb-tile); color: var(--fb-fg); font-size: .92rem; outline: none; transition: border-color .2s, background .2s; }
.fb__q input::placeholder { color: var(--fb-mut); }
.fb__q input:focus { border-color: var(--fb-go); background: color-mix(in oklab, var(--fb-fg) 12%, var(--fb-bg)); }
.fb__head .fb__more { align-self: center; }
.fb__more { margin-left: auto; display: inline-flex; align-items: center; gap: .4em; font-weight: 600; font-size: .9rem; text-decoration: none; color: var(--fb-fg); }
.fb__more .i { transition: transform .25s var(--ease); }
.fb__more:hover .i { transform: translateX(4px); }
.fb__notes:empty { display: none; }
.fb__notes { display: grid; gap: 8px; margin-bottom: 10px; }
.fb__note { display: flex; gap: .6em; align-items: flex-start; margin: 0; padding: .7em .9em; border-radius: 12px; font-size: .88rem; line-height: 1.45; background: var(--fb-tile); }
.fb__note .i { margin-top: .12em; }
.fb__note--warn { color: var(--fb-warn); background: color-mix(in oklab, var(--fb-warn) 13%, var(--fb-bg)); }
.fb__note--info { color: var(--fb-info); }
.fb__wrap { overflow-x: auto; margin-inline: -4px; padding-inline: 4px; scrollbar-width: thin; }
.fb__tbl { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .95rem; }
.fb__tbl th { text-align: left; font: 600 .68rem/1.2 var(--sans); letter-spacing: .13em; text-transform: uppercase; color: var(--fb-mut); padding: 10px 10px; border-bottom: 1px solid var(--fb-line); white-space: nowrap; }
.fb__tbl td { padding: 10px 10px; border-bottom: 1px solid var(--fb-line); vertical-align: middle; transition: background .3s; }
.fb__tbl tbody tr:last-child td { border-bottom: 0; }
.fb__r:hover td { background: color-mix(in oklab, var(--fb-fg) 4%, transparent); }
.fb__r.is-next td { background: color-mix(in oklab, var(--fb-go) 10%, transparent); }
.fb__r.is-next td:first-child { box-shadow: inset 3px 0 0 var(--fb-go); }
.fb__r.is-past td { opacity: .5; }
.fb__r.is-past:hover td { opacity: .85; }
.fb__r.is-cx .c-t .ft b, .fb__r.is-cx .fb__city { text-decoration: line-through; text-decoration-color: var(--fb-bad); }
.c-t { width: 1%; white-space: nowrap; font-size: 1.04rem; }
.fb__nt { display: inline-flex; align-items: flex-start; gap: 2px; margin-left: 8px; }
.fb__nt sup { font: 700 .62rem/1 var(--sans); color: var(--fb-amber); }
.c-fl { width: 1%; white-space: nowrap; font-size: .92rem; }
.fb__al { display: block; margin-top: 5px; font-size: .74rem; color: var(--fb-mut); white-space: nowrap; max-width: 15em; overflow: hidden; text-overflow: ellipsis; }
.fb__cs { display: inline-block; padding: 0 .35em; border-radius: 4px; background: var(--fb-tile-2); color: var(--fb-fg); font-weight: 600; cursor: help; }
.fb__city { font-weight: 650; text-transform: uppercase; letter-spacing: .045em; font-size: .98rem; overflow-wrap: anywhere; }
.fb__iata { display: inline-block; margin-left: .55em; padding: .18em .42em; border-radius: 5px; border: 1px solid var(--fb-line); font: 600 .68rem/1 var(--sans); letter-spacing: .06em; color: var(--fb-mut); vertical-align: .12em; }
.fb__sub { display: none; margin-top: 4px; font-size: .76rem; color: var(--fb-mut); }
.c-ap { white-space: nowrap; }
.fb__apc { display: inline-flex; gap: .5em; align-items: baseline; font-size: .88rem; color: var(--fb-mut); }
.fb__apc b { color: var(--fb-fg); letter-spacing: .06em; font-size: .82rem; }
.c-term, .c-desk, .c-belt, .c-gate { white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600; }
.c-st { width: 1%; white-space: nowrap; }
.fs { display: inline-flex; align-items: center; gap: .5em; padding: .4em .75em; border-radius: 999px; font: 600 .82rem/1.15 var(--sans); color: var(--fb-mut); background: color-mix(in oklab, currentColor 12%, transparent); }
.fs i { width: 7px; height: 7px; border-radius: 50%; background: currentColor; flex: none; }
.fs--ok { color: var(--fb-ok); } .fs--warn { color: var(--fb-warn); } .fs--bad { color: var(--fb-bad); } .fs--info { color: var(--fb-info); } .fs--go { color: var(--fb-go); }
.is-gone .fs { font-style: italic; }
@media (prefers-reduced-motion: no-preference) { .fs--go i { animation: blink 1.1s ease-in-out infinite; } }
@keyframes blink { 50% { opacity: .2; } }
.fb__sep td { padding: 20px 10px 8px; border-bottom: 1px dashed var(--fb-line); }
.fb__sep span { font: 600 .7rem/1 var(--sans); letter-spacing: .15em; text-transform: uppercase; color: var(--fb-mut); }
.fb__msg td { padding: 34px 14px; text-align: left; }
.fb__msg td > span { display: inline-block; vertical-align: middle; }
.fb__msg td > span:last-child { max-width: 52ch; color: var(--fb-fg); font-size: .95rem; line-height: 1.5; }
.fb__msg small { color: var(--fb-mut); }
.fb__mi { display: inline-grid !important; place-items: center; width: 44px; height: 44px; border-radius: 50%; margin-right: 14px; background: var(--fb-tile); color: var(--fb-mut); }
.fb__nomatch { display: flex; gap: .6em; align-items: center; justify-content: center; padding: 26px 10px; margin: 0; color: var(--fb-mut); }
.fb__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; margin-top: 14px; padding-top: 12px; border-top: 1px solid var(--fb-line); font-size: .8rem; color: var(--fb-mut); }
.fb__live { display: inline-flex; align-items: center; color: var(--fb-fg); font-weight: 500; }
.fb__live time { margin-left: .35em; color: var(--fb-mut); font-weight: 400; }
.fb__tz, .fb__src { display: inline-flex; align-items: center; gap: .4em; }
.fb__src { margin-left: auto; text-decoration: none; }
.fb__src .i, .fb__tz .i { width: 14px; height: 14px; }
.fb__prog { flex: 1 1 100%; height: 2px; border-radius: 2px; background: var(--fb-line); overflow: hidden; }
.fb__prog i { display: block; height: 100%; background: var(--fb-go); transform-origin: 0 50%; transform: scaleX(0); }
@media (prefers-reduced-motion: no-preference) { .fb__prog i.is-run { animation: fbProg var(--dur, 60s) linear forwards; } }
@media (prefers-reduced-motion: reduce) { .fb__prog { display: none; } }
@keyframes fbProg { from { transform: scaleX(0); } to { transform: scaleX(1); } }
.fb.is-loading .fb__tbl { opacity: .72; transition: opacity .2s; }
.fb.is-offline .fb__live .fb__dot { background: var(--warn); }
@media (prefers-reduced-motion: no-preference) {
.fb__r.is-in { animation: rowIn .6s var(--ease-out) both; animation-delay: calc(var(--r, 0) * 32ms); }
.fb__r.is-new td { animation: cellNew 2s var(--ease-out) both; }
.fb__tbl td.is-chg { animation: cellChg 2.2s var(--ease-out); }
}
@keyframes rowIn { from { opacity: 0; transform: translateY(-8px); } }
@keyframes cellNew { from { background: color-mix(in oklab, var(--fb-go) 22%, transparent); } }
@keyframes cellChg { from { background: color-mix(in oklab, var(--fb-amber) 24%, transparent); } }
.fb--mini { padding: clamp(14px, 2vw, 22px); }
.fb--mini .fb__head { margin-bottom: 12px; }
.fb--mini .fb__ic { width: 42px; height: 42px; border-radius: 13px; }
.fb--mini .fb__ic .i { width: 21px; height: 21px; }
.fb--mini .fb__h { font-size: clamp(1.1rem, 1.8vw, 1.35rem); }
.fb--mini .fb__sub { display: block; }
.fb--mini .fb__tbl td { padding: 9px 8px; }
.fb--mini .fb__msg td { padding: 22px 10px; }
@media (max-width: 900px) {
.fb--full :is(.c-fl, .c-term, .c-desk, .c-belt, .c-gate) { display: none; }
.fb--full .fb__sub { display: block; }
}
@media (max-width: 620px) {
.fb { border-radius: 18px; padding: 14px 12px; }
.fb__clock { display: none; }
.fb__ic { width: 42px; height: 42px; border-radius: 13px; }
.fb__hs { display: block; font-size: .78em; margin-top: 2px; }
.fb__hsep { display: none; }
.fb__bar { gap: 8px; }
.fb__seg { width: 100%; }
.fb__seg a { flex: 1; justify-content: center; padding: .6em .5em; font-size: .84rem; }
.fb__q { max-width: none; flex-basis: 100%; }
.fb__more { margin-left: 0; }
.fb .c-ap { display: none; }
.fb__tbl { font-size: .9rem; }
.fb__tbl th, .fb__tbl td { padding: 9px 5px; }
.c-t { font-size: .92rem; }
.fb__nt { display: flex; margin: 5px 0 0; }
.fb__city { font-size: .86rem; letter-spacing: .02em; }
.fb__iata { display: none; }
.fs { white-space: normal; font-size: .74rem; padding: .38em .6em; border-radius: 9px; max-width: 8.6em; }
.c-st { white-space: normal; }
.fb__src { margin-left: 0; }
}
.tbh { padding-block: clamp(22px, 4vw, 52px) clamp(18px, 3vw, 30px); }
.tbh__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 22px 48px; align-items: end; }
.tbh__t { font-size: clamp(2.1rem, 4.8vw, 3.9rem); max-width: 18ch; margin-bottom: .3em; }
.tbh .lead { margin-bottom: 0; }
.tbh .kicker { display: flex; align-items: center; }
.tbh__flap { padding: clamp(12px, 1.6vw, 18px); border-radius: 22px; background: var(--fb-bg); box-shadow: var(--shadow-lg); border: 1px solid var(--fb-line); }
.mi--live { text-decoration: none; font-weight: 600; }
@media (max-width: 760px) { .tbh__row { grid-template-columns: 1fr; } .tbh__flap { justify-self: start; order: -1; } .tbh__flap .ft--xl { font-size: 2.3rem; } }
.apstrip { margin: 0 calc(var(--gut) * -1) 16px; }
.apstrip__in { display: flex; gap: 8px; overflow-x: auto; padding: 4px var(--gut) 10px; scroll-snap-type: x proximity; scroll-padding-inline: var(--gut); scrollbar-width: thin; }
.apstrip a { flex: none; display: grid; gap: 3px; min-width: 86px; padding: .6em .95em; border-radius: 14px; border: 1px solid var(--line); background: var(--card); text-decoration: none; scroll-snap-align: start;
transition: border-color .2s, transform .25s var(--ease), background .2s; }
.apstrip a:hover { border-color: var(--ink); transform: translateY(-2px); color: inherit; }
.apstrip b { font: 700 .95rem/1 var(--sans); letter-spacing: .08em; }
.apstrip span { font-size: .76rem; color: var(--muted); white-space: nowrap; }
.apstrip a[aria-current] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.apstrip a[aria-current] span { color: color-mix(in oklab, var(--paper) 70%, var(--ink)); }
.tb-disc { display: flex; gap: .6em; align-items: flex-start; max-width: 80ch; margin: 16px 0 0; font-size: .86rem; color: var(--muted); }
.tb-disc .i { margin-top: .2em; flex: none; }
.apgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 12px; }
.apc { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 10px 14px; align-items: center; padding: 14px 16px; border-radius: 16px; border: 1px solid var(--line); background: var(--card); text-decoration: none;
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.apc:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.apc.is-cur { border-color: var(--ink); }
.apc__code { font-size: 1.1rem; }
.apc__b { display: grid; min-width: 0; }
.apc__b b { font-size: 1rem; }
.apc__b small { font-size: .76rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.apc__n { grid-column: 1 / -1; display: flex; align-items: center; gap: .4em; font-size: .82rem; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.apc__n .i { width: 15px; height: 15px; color: var(--accent); }
.apc__sep { width: 1px; height: 12px; background: var(--line); margin: 0 .4em; }
.phead--tr .phead__t { max-width: 16ch; }
.tgrid { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap: clamp(14px, 2vw, 22px); }
.tcard { --h: 30; position: relative; display: flex; flex-direction: column; gap: 6px; min-height: 250px; padding: clamp(18px, 2.4vw, 28px); border-radius: 24px; overflow: hidden; isolation: isolate;
text-decoration: none; color: var(--ink); border: 1px solid var(--line);
background: radial-gradient(130% 90% at 100% 100%, color-mix(in oklab, var(--accent) 10%, transparent), transparent 60%), var(--card);
transition: transform .4s var(--ease-out), box-shadow .4s var(--ease-out), border-color .3s; }
a.tcard:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: color-mix(in oklab, var(--accent) 50%, var(--line)); color: var(--ink); }
.tcard__ic { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 16px; background: var(--ink); color: var(--paper); margin-bottom: auto; }
.tcard__ic .i { width: 24px; height: 24px; }
.tcard__t { margin: 18px 0 0; font-size: clamp(1.5rem, 2.4vw, 2.1rem); }
.tcard__d { margin: 0; color: var(--ink-2); font-size: .95rem; max-width: 40ch; }
.tcard__k { margin: 0; font: 600 .72rem/1.2 var(--sans); letter-spacing: .15em; text-transform: uppercase; display: flex; align-items: center; color: var(--fb-mut); }
.tcard__go { position: absolute; right: 20px; bottom: 20px; display: grid; place-items: center; width: 42px; height: 42px; border-radius: 50%; border: 1px solid var(--line); background: var(--card); transition: transform .35s var(--ease-out), background .3s, color .3s; }
a.tcard:hover .tcard__go { transform: rotate(-45deg); background: var(--accent); color: var(--accent-ink); border-color: var(--accent); }
.tcard__art { position: absolute; z-index: -1; right: 18px; top: 18px; width: min(56%, 280px); height: auto; opacity: .9; pointer-events: none; overflow: visible; }
.tcard__art--metro { width: min(46%, 230px); }
.tcard__d { padding-right: 52px; }
.tcard--rail { grid-column: span 5; --h: 205; }
.tcard--metro { grid-column: span 5; }
.tcard--bus { grid-column: span 6; }
.tcard--city { grid-column: span 6; }
.tcard--air { grid-column: span 7; grid-row: span 2; color: var(--fb-fg); background: radial-gradient(100% 60% at 100% 0%, color-mix(in oklab, var(--fb-go) 16%, transparent), transparent 65%), var(--fb-bg); border-color: var(--fb-line); gap: 14px; }
.tcard--air .tcard__t { margin-top: 4px; color: var(--fb-fg); }
.tcard--air .tcard__d { color: var(--fb-mut); }
.tcard--air .fb { background: transparent; box-shadow: none; border: 0; padding: 0; border-radius: 0; }
.tcard--air .fb__head { display: none; }
.tcard__links { display: flex; flex-wrap: wrap; gap: 10px; margin: auto 0 0; }
.tcard__ghost { color: var(--fb-fg); border-color: var(--fb-line); }
.tcard__ghost:hover { background: var(--fb-fg); color: var(--fb-bg); border-color: var(--fb-fg); }
.tcard__art path, .tcard__art circle, .tcard__art rect { vector-effect: non-scaling-stroke; }
.tcard__art--metro path { fill: none; stroke-width: 7; stroke-linecap: round; stroke-linejoin: round; opacity: .85; }
.tcard__art--metro circle { fill: var(--card); stroke: var(--ink); stroke-width: 3; }
.tcard__track { fill: none; stroke: var(--ink-2); stroke-width: 6; stroke-linecap: round; opacity: .25; }
.tcard__track2 { fill: none; stroke: var(--card); stroke-width: 2; stroke-dasharray: 2 9; stroke-linecap: round; }
.tcard__art--rail circle { fill: var(--card); stroke: var(--accent-2); stroke-width: 3; }
.tcard__train rect { fill: var(--accent); }
.tcard__road { stroke: var(--ink-2); stroke-width: 8; opacity: .25; }
.tcard__lane { stroke: var(--card); stroke-width: 2; stroke-dasharray: 14 12; }
.tcard__hill { fill: color-mix(in oklab, var(--accent-2) 22%, transparent); }
.tcard__sky { fill: color-mix(in oklab, var(--gold) 26%, transparent); }
@media (prefers-reduced-motion: no-preference) {
.tcard__lane { animation: lane 1.6s linear infinite; }
.tcard__track2 { animation: lane 3s linear infinite reverse; }
}
@keyframes lane { to { stroke-dashoffset: -52; } }
@media (prefers-reduced-motion: reduce) { .tcard__train, .apmap__planes, .mx__train { display: none; } }
@media (max-width: 1060px) { .tcard--air { grid-column: 1 / -1; grid-row: auto; } .tcard--rail, .tcard--metro, .tcard--bus, .tcard--city { grid-column: span 6; } }
@media (max-width: 640px) { .tgrid > .tcard { grid-column: 1 / -1; } .tcard { min-height: 200px; border-radius: 20px; } }
.howto { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: clamp(18px, 3vw, 36px); }
.howto__it { position: relative; padding-top: 18px; border-top: 2px solid var(--ink); }
.howto__n { position: absolute; top: 14px; right: 0; font: italic 500 1.6rem/1 var(--serif); color: var(--muted); }
.howto__ic { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: color-mix(in oklab, var(--accent) 12%, var(--card)); color: var(--accent); margin-bottom: 14px; }
.howto__ic .i { width: 23px; height: 23px; }
.howto h3 { font-size: 1.3rem; margin-bottom: .45em; }
.howto p { margin: 0; color: var(--ink-2); font-size: .97rem; }
.tr-note { display: flex; gap: .6em; align-items: flex-start; margin: 22px 0 0; font-size: .86rem; color: var(--muted); max-width: 90ch; }
.tr-note .i { flex: none; margin-top: .2em; }
.tr-checked { font-size: .84rem; margin-top: 12px; }
.tr-small { font-size: .84rem; margin: 0; }
.tr-h2 { margin: 1.4em 0 .7em; font-size: clamp(1.4rem, 2.4vw, 1.9rem); }
.tr-h2--first { margin-top: 0; }
.apmap { margin: 0 0 8px; }
.apmap svg { width: 100%; height: auto; overflow: visible; }
.apmap__land path { fill: var(--paper-3); stroke: var(--paper); stroke-width: 1.4; }
.apmap__arcs path { fill: none; stroke: var(--accent); stroke-width: 1.6; stroke-dasharray: 3 6; opacity: .65; stroke-linecap: round; }
@media (prefers-reduced-motion: no-preference) { .apmap__arcs path { animation: lane 2.4s linear infinite; } }
.apmap__pl path { fill: var(--accent); }
.apmap__dot { fill: var(--accent-2); stroke: var(--paper); stroke-width: 2.4; transition: transform .3s var(--ease-out); transform-box: fill-box; transform-origin: center; }
.apmap__a.is-hub .apmap__dot { fill: var(--accent); }
.apmap__pulse { fill: none; stroke: var(--accent-2); stroke-width: 1.5; opacity: 0; transform-box: fill-box; transform-origin: center; }
@media (prefers-reduced-motion: no-preference) { .apmap__pulse { animation: mapPulse 2.6s var(--ease) infinite; } }
@keyframes mapPulse { 0% { opacity: .7; transform: scale(1); } 100% { opacity: 0; transform: scale(3.2); } }
.apmap text { font: 500 15px/1 var(--sans); fill: var(--ink-2); paint-order: stroke; stroke: var(--paper); stroke-width: 4px; stroke-linejoin: round; }
.apmap__c { font-weight: 700; fill: var(--ink); letter-spacing: .04em; }
.apmap__a:hover .apmap__dot, .apmap__a:focus-visible .apmap__dot { transform: scale(1.5); }
.apmap__a:hover text { fill: var(--accent); }
.apmap__a:focus-visible { outline: none; }
.apmap__cap { font-size: .84rem; color: var(--muted); margin-top: 6px; }
@media (max-width: 700px) { .apmap text { font-size: 22px; stroke-width: 5px; } .apmap__a:not(.is-hub) text tspan:not(.apmap__c) { display: none; } }
.aplist { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: 16px; margin-top: clamp(20px, 3vw, 36px); }
.apcard { display: flex; flex-direction: column; border-radius: 20px; border: 1px solid var(--line); background: var(--card); overflow: hidden; transition: transform .3s var(--ease-out), box-shadow .3s, border-color .3s; }
.apcard:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: color-mix(in oklab, var(--accent) 45%, var(--line)); }
.apcard__a { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; padding: 18px 18px 12px; text-decoration: none; flex: 1; }
.apcard__a:hover { color: inherit; }
.apcard__code { font-size: 1.35rem; align-self: start; }
.apcard__b { display: grid; gap: 4px; min-width: 0; }
.apcard__k { font: 600 .7rem/1.2 var(--sans); letter-spacing: .13em; text-transform: uppercase; color: var(--muted); }
.apcard__t { font: 500 1.22rem/1.2 var(--serif); }
.apcard__a:hover .apcard__t { color: var(--accent); }
.apcard__s { font-size: .88rem; color: var(--ink-2); display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.apcard__f { margin: 0; padding: 10px 18px 14px; border-top: 1px dashed var(--line); font-size: .84rem; }
.apcard__live { display: inline-flex; align-items: center; font-weight: 600; text-decoration: none; }
.apnext { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: 16px; }
.apcover { margin: 0 0 8px; border-radius: var(--r); overflow: hidden; }
.apcover .pic { aspect-ratio: 21 / 9; }
.apcover figcaption { padding: 6px 2px; }
.rpop { display: grid; gap: 10px; margin: 0 0 18px; }
.rpop .kicker { margin: 0; }
.rpop__l { display: flex; flex-wrap: wrap; gap: 8px; }
.rpop__a { display: inline-flex; align-items: center; gap: .45em; padding: .55em .95em; border-radius: 14px; border: 1px solid var(--line); background: var(--card); text-decoration: none; font-size: .92rem;
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.rpop__a .i { width: 15px; height: 15px; color: var(--accent); }
.rpop__a small { margin-left: .3em; padding: .1em .45em; border-radius: 999px; background: var(--paper-2); color: var(--muted); font-weight: 600; font-size: .74rem; }
.rpop__a:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.rtypes { margin-bottom: 16px; }
.rtypes .chip { text-decoration: none; }
.rtypes .chip span[aria-current] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.tr-nm { font-weight: 600; color: var(--ink-2); }
.tr-tbl .c-train { min-width: 11em; }
.rsearch { align-items: flex-end; }
.rsearch .sel select { min-width: 220px; }
.rsearch__swap { border: 1px solid var(--line); align-self: flex-end; margin-bottom: 2px; }
.rsearch__swap .i { transition: transform .4s var(--ease-out); }
.rsearch__swap:hover .i { transform: rotate(180deg); }
.tr-tbl .tbl td { vertical-align: top; }
.tr-tbl .c-train a { text-decoration: none; }
.tr-tbl .c-train a:hover b { color: var(--accent); }
.tr-tbl .c-dep b, .tr-tbl .c-arr b { font-size: 1.05rem; font-variant-numeric: tabular-nums; }
.tr-tbl .c-days { font-size: .84rem; color: var(--ink-2); min-width: 12em; }
.tr-tbl .c-dur { white-space: nowrap; }
.tr-tbl sup { font-size: .68rem; color: var(--warn); font-weight: 600; }
.tbadge { display: inline-block; padding: .2em .55em; border-radius: 6px; font: 600 .68rem/1.2 var(--sans); letter-spacing: .06em; text-transform: uppercase; background: var(--paper-2); color: var(--ink-2); vertical-align: .1em; }
.tbadge--highspeed { background: color-mix(in oklab, var(--accent) 16%, transparent); color: var(--accent); }
.tbadge--fast { background: color-mix(in oklab, var(--accent-2) 16%, transparent); color: var(--accent-2); }
.tbadge--night { background: color-mix(in oklab, var(--ink) 12%, transparent); color: var(--ink); }
.tr-soon { display: grid; justify-items: center; gap: 12px; text-align: center; padding: clamp(32px, 6vw, 72px) 16px; border: 1px dashed var(--line); border-radius: 22px; background: var(--card); }
.tr-soon > .i { width: 54px; height: 54px; color: var(--accent); stroke-width: 1.3; }
.tr-soon p { max-width: 58ch; margin: 0; color: var(--ink-2); }
.tline { list-style: none; margin: 18px 0 28px; padding: 0; --tl: var(--accent-2); }
.tline--highspeed { --tl: var(--accent); }
.tline__s { position: relative; display: grid; grid-template-columns: 8.5em 28px minmax(0, 1fr); align-items: start; gap: 0 12px; padding-bottom: 22px; }
.tline__s::before { content: ''; position: absolute; left: calc(8.5em + 12px + 13px); top: 8px; bottom: -8px; width: 3px; border-radius: 3px; background: var(--tl); opacity: .35; }
.tline__s.is-last::before { display: none; }
.tline__time { display: grid; justify-items: end; gap: 2px; font-variant-numeric: tabular-nums; }
.tline__time small { color: var(--muted); font-size: .72rem; }
.tline__time b { font-size: 1.02rem; }
.tline__time sup { color: var(--warn); font-size: .68rem; font-weight: 600; }
.tline__dot { width: 18px; height: 18px; margin: 3px auto 0; border-radius: 50%; background: var(--card); border: 3px solid var(--tl); position: relative; z-index: 1; }
.tline__s.is-first .tline__dot, .tline__s.is-last .tline__dot { background: var(--tl); width: 22px; height: 22px; margin-top: 1px; }
.tline__name { display: grid; gap: 2px; font-weight: 600; font-size: 1.04rem; }
.tline__name a { text-decoration: none; }
.tline__name small { font-weight: 400; font-size: .8rem; }
.st-live { margin-bottom: clamp(26px, 4vw, 40px); }
.fb--rail td.c-trn { width: 1%; white-space: nowrap; font-size: .9rem; }
.fb--rail .c-trn a { text-decoration: none; }
.fb__day { display: block; margin-top: 4px; font-size: .7rem; color: var(--fb-amber); font-weight: 600; letter-spacing: .04em; }
.seats { display: flex; flex-wrap: wrap; gap: 4px; }
.seat { display: inline-flex; gap: .35em; align-items: baseline; padding: .28em .55em; border-radius: 7px; background: var(--fb-tile); font-size: .76rem; color: var(--fb-mut); white-space: nowrap; }
.seat b { color: var(--fb-ok); font-size: .82rem; }
.seat--none { color: var(--fb-mut); font-style: italic; }
.fb--rail .fb__tz { flex: 1 1 260px; }
.fb--rail .fb__sub { display: none; }
@media (max-width: 620px) { .fb--rail .c-trn { display: none; } .fb--rail .fb__sub { display: block; } }
.stgroups { columns: 3 300px; column-gap: clamp(16px, 2.4vw, 28px); }
.stgroup { break-inside: avoid; margin-bottom: clamp(20px, 2.6vw, 30px); }
.stgroup__l { display: grid; gap: 10px; }
.stgroup__h { font-size: clamp(1.25rem, 2vw, 1.55rem); margin-bottom: .7em; display: flex; align-items: baseline; gap: .5em; }
.stgroup__h a { text-decoration: none; }
.stgroup__h small { font: 600 .8rem/1 var(--sans); color: var(--muted); }
.stcard { --h: 30; display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 16px; border: 1px solid var(--line); background: var(--card); text-decoration: none;
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.stcard:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.stcard__ic { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; flex: none; color: var(--accent-2); background: color-mix(in oklab, var(--accent-2) 13%, var(--card)); }
.stcard__b { display: grid; gap: 2px; min-width: 0; flex: 1; }
.stcard__b b { font-size: 1rem; line-height: 1.3; }
.stcard__b small { font-size: .8rem; color: var(--muted); }
.stcard__go { color: var(--muted); transition: transform .25s var(--ease); }
.stcard:hover .stcard__go { transform: translateX(3px); color: var(--accent); }
.bsearch { align-items: flex-end; }
.bsearch__in { flex: 1 1 260px; max-width: 420px; }
.bsearch__f { position: relative; display: flex; align-items: center; }
.bsearch__f .i { position: absolute; left: 14px; color: var(--muted); pointer-events: none; }
.bsearch__f input { width: 100%; padding: .62em 1em .62em 2.6em; border-radius: 999px; border: 1px solid var(--line); background: var(--card); font-size: .95rem; }
.bsearch__f input:focus { outline: 2px solid var(--accent); outline-offset: 1px; }
.bsearch__top { flex-basis: 100%; }
.bsearch__top .chip { text-decoration: none; }
.bsearch__top .chip span[aria-current] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.rt-tbl .tbl td { vertical-align: top; }
.rt-group th { padding: 18px 12px 10px; font: 500 1.15rem/1.2 var(--serif); letter-spacing: 0; text-transform: none; color: var(--ink); background: var(--paper-2); }
.rt-group th small { font: 500 .78rem/1 var(--sans); color: var(--muted); margin-left: .5em; }
.rt-group th .i { display: inline-block; vertical-align: -.12em; margin-right: .35em; color: var(--accent); }
.rt-tbl .c-route { min-width: 13em; }
.rt-tbl .c-route b { font-size: 1rem; }
.rt-st { font-size: .8rem; }
.rt-st a { color: var(--accent-2); text-decoration: none; }
.rt-times { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.rt-t { display: inline-block; padding: .2em .5em; border-radius: 6px; background: var(--paper-2); font: 600 .84rem/1.3 var(--sans); font-variant-numeric: tabular-nums; }
.rt-more { display: contents; }
.rt-more summary { list-style: none; cursor: pointer; padding: .2em .5em; border-radius: 6px; border: 1px dashed var(--line); font: 600 .8rem/1.3 var(--sans); color: var(--accent); }
.rt-more summary::-webkit-details-marker { display: none; }
.rt-more[open] summary { display: none; }
.rt-dd { margin-top: 6px; }
.rt-dd summary { cursor: pointer; font-size: .78rem; font-weight: 600; color: var(--accent-2); list-style: none; display: inline-flex; align-items: center; gap: .3em; }
.rt-dd summary::-webkit-details-marker { display: none; }
.rt-dd summary::after { content: '+'; font-weight: 700; }
.rt-dd[open] summary::after { content: '−'; }
.rt-mob, .tr-mob { display: none; }
.rt-days, .rt-note, .rt-op { display: block; margin-top: 6px; font-size: .78rem; color: var(--muted); line-height: 1.45; max-width: 46ch; }
.rt-note { color: var(--warn); }
.rt-note .i { display: inline-block; width: 13px; height: 13px; vertical-align: -.15em; }
.rt-tbl .c-dur { white-space: nowrap; }
.rt-tbl .c-price { font-size: .88rem; min-width: 9em; }
.dest { margin-bottom: 28px; padding: 18px 20px; border-radius: var(--r); background: var(--card); border: 1px solid var(--line); }
.dest__l { display: flex; flex-wrap: wrap; gap: 6px; margin: 0; }
.dest__l a { padding: .32em .75em; border-radius: 999px; background: var(--paper-2); font-size: .86rem; text-decoration: none; transition: background .2s, color .2s; }
.dest__l a:hover { background: var(--ink); color: var(--paper); }
@media (max-width: 680px) {
.rt-tbl :is(.c-dur, .c-price), .rt-tbl thead th:nth-child(n+3) { display: none; }
.rt-mob, .tr-mob { display: block; margin-top: 4px; font-size: .8rem; color: var(--ink-2); font-weight: 500; }
.rt-tbl .tbl td { padding: 10px 8px; }
.rt-tbl .c-route { min-width: 0; }
.tr-tbl:not(.rt-tbl) :is(.c-route, .c-days), .tr-tbl:not(.rt-tbl) thead th:is(:nth-child(2), :nth-child(6)) { display: none; }
}
.ctcard { display: grid; gap: 8px; padding: 22px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); text-decoration: none; transition: transform .3s var(--ease-out), box-shadow .3s, border-color .3s; }
.ctcard:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: var(--accent); color: inherit; }
.ctcard__k { font: 600 .72rem/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--accent); }
.ctcard__t { font: 500 1.4rem/1.2 var(--serif); }
.ctcard__s { color: var(--ink-2); font-size: .94rem; }
.ctcard__m { display: flex; flex-wrap: wrap; gap: 6px; }
.farebox p { margin: 0; font-size: .95rem; }
.mxwrap { margin: 0; position: relative; }
.mxwrap__legend { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.mxl { display: inline-flex; align-items: center; gap: .5em; padding: .5em .95em; border-radius: 999px; border: 1px solid var(--line); background: var(--card); font-weight: 600; font-size: .86rem; transition: all .2s; }
.mxl i { width: 22px; height: 6px; border-radius: 3px; background: var(--c, var(--ink)); }
.mxl:hover { border-color: var(--ink); }
.mxl.is-on { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.mxwrap__scroll { position: relative; border-radius: 24px; border: 1px solid var(--line); background: radial-gradient(80% 60% at 30% 20%, color-mix(in oklab, var(--accent-2) 6%, transparent), transparent 70%), var(--card); overflow: auto; }
.mx { display: block; width: 100%; min-width: 760px; height: auto; }
.mx__casing { fill: none; stroke: var(--card); stroke-width: 17; stroke-linejoin: round; stroke-linecap: round; }
.mx__path { fill: none; stroke: var(--c); stroke-width: 10; stroke-linejoin: round; stroke-linecap: round; }
.mx__line, .mx__s { transition: opacity .35s var(--ease); }
.mx__train { fill: var(--c); stroke: var(--card); stroke-width: 2; }
.mx__lk-o { stroke: var(--ink); stroke-width: 13; stroke-linecap: round; }
.mx__lk-i { stroke: var(--card); stroke-width: 6; stroke-linecap: round; }
.mx__s { cursor: pointer; outline: none; }
.mx__s circle { fill: var(--card); stroke: var(--c); stroke-width: 3.6; transform-box: fill-box; transform-origin: center; transition: transform .3s var(--ease-out), fill .2s; }
.mx__s.is-hub circle { stroke: var(--ink); stroke-width: 3.6; }
.mx__s text { font: 500 14.5px/1 var(--sans); fill: var(--ink-2); paint-order: stroke; stroke: var(--card); stroke-width: 4.5px; stroke-linejoin: round; transition: fill .2s; }
.mx__s.is-hub text { font-weight: 700; fill: var(--ink); }
.mx__s:hover circle, .mx__s:focus-visible circle, .mx__s.is-act circle { transform: scale(1.45); fill: var(--c); }
.mx__s:hover text, .mx__s:focus-visible text, .mx__s.is-act text { fill: var(--ink); font-weight: 700; }
.mx.has-hl .mx__line:not(.is-hl), .mx.has-hl .mx__s:not(.is-hl) { opacity: .14; }
.mxtip { position: absolute; z-index: 3; min-width: 180px; max-width: 260px; padding: 12px 14px; border-radius: 14px; background: var(--ink); color: var(--paper); box-shadow: var(--shadow-lg); font-size: .85rem; line-height: 1.4; pointer-events: none;
transform: translate(-50%, calc(-100% - 16px)); }
.mxtip b { display: block; font-size: 1rem; margin-bottom: 2px; }
.mxtip i { display: inline-block; width: 18px; height: 5px; border-radius: 3px; background: var(--c); margin-right: .45em; vertical-align: .2em; }
.mxtip small { display: block; opacity: .75; }
.mxwrap__cap { display: flex; gap: .5em; align-items: flex-start; font-size: .84rem; color: var(--muted); margin-top: 10px; }
.mxwrap__cap .i { flex: none; margin-top: .2em; }
.mxfacts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 150px), 1fr)); gap: 12px; margin: 18px 0 0; }
.mx-swipe { display: none; }
@media (max-width: 800px) { .mx-swipe { display: inline; } }
.mxfacts > div { padding: 16px 18px; border-radius: 16px; border: 1px solid var(--line); background: var(--card); }
.mxfacts dt { font: 600 .7rem/1.2 var(--sans); letter-spacing: .13em; text-transform: uppercase; color: var(--muted); margin-bottom: 6px; }
.mxfacts dd { margin: 0; font: 600 1rem/1.4 var(--sans); font-variant-numeric: tabular-nums; }
.mx-lh { margin: 1.6em 0 .7em; }
.mxlist { display: grid; gap: 10px; margin-bottom: 20px; }
.mxlist__l { border: 1px solid var(--line); border-radius: 16px; background: var(--card); overflow: hidden; }
.mxlist__l summary { display: flex; align-items: center; gap: 12px; padding: 14px 18px; cursor: pointer; list-style: none; }
.mxlist__l summary::-webkit-details-marker { display: none; }
.mxlist__l summary i { width: 32px; height: 8px; border-radius: 4px; background: var(--c); flex: none; }
.mxlist__l summary b { font-size: 1.05rem; }
.mxlist__l summary small { color: var(--muted); margin-left: auto; font-size: .8rem; text-align: right; }
.mxlist__l > p { margin: 0 18px 10px; font-size: .88rem; }
.mxlist__l ol { margin: 0; padding: 4px 18px 16px 40px; font-size: .93rem; }
.mxlist__l li { break-inside: avoid; padding: 3px 0; }
.mxlist__l li::marker { color: var(--c); font-weight: 700; }
.mxlist__tr { color: var(--accent-2); font-size: .78rem; }
.mxlist__tr .i { display: inline-block; width: 12px; height: 12px; vertical-align: -.1em; }
@media (max-width: 640px) { .mxwrap__scroll { border-radius: 18px; } }
.howgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); gap: 12px; }
.hcard { position: relative; display: flex; flex-direction: column; border-radius: 18px; border: 1px solid var(--line); background: var(--card); transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.hcard:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); }
.hcard__a { display: flex; gap: 14px; align-items: center; padding: 16px; text-decoration: none; flex: 1; }
.hcard__a:hover { color: inherit; }
.hcard__ic { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 15px; flex: none; color: var(--accent-2); background: color-mix(in oklab, var(--accent-2) 13%, var(--card)); }
.hcard--airport .hcard__ic { color: var(--paper); background: var(--ink); font: 700 .9rem/1 var(--sans); letter-spacing: .06em; }
.hcard__ic .i { width: 24px; height: 24px; }
.hcard__b { display: grid; gap: 3px; min-width: 0; }
.hcard__b small { font-size: .78rem; color: var(--muted); }
.hcard__b > small:first-child { font-weight: 600; letter-spacing: .1em; text-transform: uppercase; font-size: .68rem; }
.hcard__near { color: var(--accent); }
.hcard__b b { font-size: 1rem; line-height: 1.3; }
.hcard__s { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.hcard__live { display: flex; align-items: center; padding: 9px 16px; border-top: 1px dashed var(--line); font-size: .82rem; font-weight: 600; text-decoration: none; }
.sec--board .fb { margin-top: 4px; }
.page-metro .article__side { position: static; }
.tr-article > * { min-width: 0; }
.fb__r[data-fl] { cursor: pointer; }
.fb__fl { display: inline-block; text-decoration: none; border-radius: 6px; }
a.fb__city { text-decoration: none; color: var(--fb-fg); }
.fb__r[data-fl]:hover a.fb__city { text-decoration: underline; text-decoration-color: color-mix(in oklab, var(--fb-fg) 45%, transparent); text-underline-offset: 3px; }
.fb a[data-open]:focus-visible { outline: 2px solid var(--fb-go); outline-offset: 3px; }
.fb__radar { display: flex; align-items: center; gap: 5px; margin-top: 6px; font-size: .72rem; font-weight: 600; color: var(--fb-info); white-space: nowrap; }
.fb__radar .i { width: 13px; height: 13px; }
.fb__aps { display: flex; gap: 6px; overflow-x: auto; margin: 0 0 12px; padding: 2px 2px 6px; scrollbar-width: thin; }
.fb__aps a { flex: none; display: inline-flex; gap: .45em; align-items: baseline; padding: .45em .8em; border-radius: 999px; background: var(--fb-tile); color: var(--fb-mut); text-decoration: none; font-size: .8rem; transition: background .2s, color .2s; }
.fb__aps a:hover { color: var(--fb-fg); }
.fb__aps b { color: var(--fb-fg); letter-spacing: .06em; font-size: .74rem; }
.fb__aps a[aria-current] { background: var(--fb-fg); color: var(--fb-bg); }
.fb__aps a[aria-current] b { color: var(--fb-bg); }
@media (max-width: 620px) { .fb__radar { white-space: normal; } }
html.fd-open { overflow: hidden; }
.fdlg { width: min(660px, calc(100vw - 24px)); max-width: none; max-height: min(92vh, 1000px); padding: 0; border: 0; border-radius: 26px; background: var(--card); color: var(--ink); box-shadow: var(--shadow-lg); overflow: hidden; }
.fdlg[open] { display: flex; flex-direction: column; }
.fdlg::backdrop { background: rgb(12 10 8 / .58); backdrop-filter: blur(5px); }
.fdlg__body { flex: 1; min-height: 0; overflow: auto; overscroll-behavior: contain; outline: none; }
.fdlg__x { position: absolute; top: 14px; right: 14px; z-index: 4; display: grid; place-items: center; width: 40px; height: 40px; border: 0; border-radius: 50%; background: var(--fb-tile-2); color: var(--fb-fg); cursor: pointer; transition: background .2s; }
.fdlg__x:hover { background: var(--fb-go); color: var(--fb-bg); }
.fdlg__x .i { width: 18px; height: 18px; }
.fdlg__grab { display: none; }
.fdlg__load { display: grid; place-items: center; min-height: 280px; background: var(--fb-bg); }
.fdlg__spin { width: 36px; height: 36px; border-radius: 50%; border: 3px solid var(--fb-line); border-top-color: var(--fb-go); animation: fdspin .8s linear infinite; }
@keyframes fdspin { to { transform: rotate(360deg); } }
.fdlg__err { margin: 0; padding: 70px 26px 56px; text-align: center; color: var(--ink-2); }
@media (prefers-reduced-motion: no-preference) { .fdlg[open] { animation: fdIn .32s var(--ease-out); } }
@keyframes fdIn { from { opacity: 0; transform: translateY(14px) scale(.985); } }
.fd { padding-bottom: 22px; }
.fd__head { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 8px 16px; align-items: center; padding: 22px 66px 20px 22px; color: var(--fb-fg);
background: radial-gradient(120% 90% at 100% 0%, color-mix(in oklab, var(--fb-go) 16%, transparent), transparent 62%), var(--fb-bg); }
.fd__al { font-size: 1.15rem; }
.fd__id { min-width: 0; }
.fd__air { margin: 0 0 6px; font-size: .78rem; color: var(--fb-mut); letter-spacing: .03em; }
.fd__no { margin: 0; font-size: 1.45rem; line-height: 1; }
.fd__cs { margin: 8px 0 0; font-size: .74rem; color: var(--fb-mut); }
.fd__st { grid-column: 3; align-self: center; }
.fd__route { display: grid; grid-template-columns: minmax(0, 1fr) minmax(84px, .9fr) minmax(0, 1fr); align-items: center; gap: 12px; margin: 18px 20px 4px; padding: 18px; border-radius: 20px; background: var(--paper-2); }
.fd__pt { display: grid; gap: 3px; min-width: 0; justify-items: start; }
.fd__pt--to { text-align: right; justify-items: end; }
.fd__code { font-size: 1.05rem; }
.fd__city { margin-top: 6px; font-weight: 700; font-size: 1.02rem; line-height: 1.2; }
.fd__apn { font-size: .74rem; color: var(--muted); line-height: 1.35; }
.fd__tm { margin-top: 8px; font: 700 1.55rem/1.05 var(--sans); font-variant-numeric: tabular-nums; letter-spacing: -.01em; }
.fd__tm--none { color: var(--muted); font-weight: 500; }
.fd__tl { font-size: .74rem; color: var(--muted); }
.fd__mid { display: grid; gap: 8px; justify-items: center; text-align: center; color: var(--muted); font-size: .76rem; }
.fd__bar { position: relative; width: 100%; height: 4px; border-radius: 4px; background: var(--line); }
.fd__bar > i { position: absolute; inset: 0 auto 0 0; width: var(--p, 0%); border-radius: inherit; background: var(--accent); }
.fd__plane { position: absolute; top: 50%; left: var(--p, 0%); display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--paper-2); color: var(--accent); transform: translate(-50%, -50%); }
.fd__plane .i { width: 20px; height: 20px; transform: rotate(45deg); }
.fd__bar.is-unknown .fd__plane { left: 50%; color: var(--muted); }
@media (prefers-reduced-motion: no-preference) { .fd__bar > i { transition: width .8s var(--ease-out); } .fd__plane { transition: left .8s var(--ease-out); } }
.fd__rl { display: flex; align-items: center; gap: 7px; margin: 10px 20px 0; padding: 9px 14px; border-radius: 14px; background: color-mix(in oklab, var(--accent-2) 12%, var(--card)); color: var(--accent-2); font-weight: 600; font-size: .88rem; }
.fd__rl small { color: var(--muted); font-weight: 500; }
.fd__rl .i { width: 16px; height: 16px; flex: none; }
.fd__map { position: relative; height: 270px; margin: 14px 20px 0; border-radius: 18px; overflow: hidden; background: var(--paper-3); border: 1px solid var(--line); display: grid; place-items: center; }
.fd__mapph .i { width: 34px; height: 34px; color: var(--muted); }
.fd__mk { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: var(--accent); color: var(--accent-ink); box-shadow: 0 0 0 4px color-mix(in oklab, var(--accent) 25%, transparent); }
.fd__mk .i { width: 18px; height: 18px; transform: rotate(var(--tr, 0deg)); }
.fd__apmk { padding: 3px 7px; border-radius: 7px; background: var(--ink); color: var(--paper); font: 700 .7rem/1.2 var(--sans); letter-spacing: .06em; box-shadow: var(--shadow); }
.fd__sec { margin: 18px 20px 0; }
.fd__sec h3 { margin: 0 0 8px; font: 600 .7rem/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.fd__sec dl { display: grid; margin: 0; border-radius: 16px; border: 1px solid var(--line); overflow: hidden; }
.fd__sec dl > div { display: flex; justify-content: space-between; align-items: baseline; gap: 14px; padding: 10px 14px; border-top: 1px solid var(--line); }
.fd__sec dl > div:first-child { border-top: 0; }
.fd__sec dt { display: flex; align-items: center; gap: 8px; flex: 1 1 auto; min-width: 0; color: var(--muted); font-size: .87rem; }
.fd__sec dt .i { flex: none; width: 16px; height: 16px; color: var(--accent-2); }
.fd__sec dd { flex: 0 1 auto; max-width: 60%; margin: 0; text-align: right; font-weight: 600; font-size: .92rem; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.fd__sec .is-radar dt .i { color: var(--accent); }
.fd__sec .is-warn dd { color: var(--warn); }
.fd__tl { list-style: none; margin: 0; padding: 2px 0 0; }
.fd__ev { position: relative; display: grid; grid-template-columns: 5.2em minmax(0, 1fr); gap: 12px; padding: 0 0 13px 20px; }
.fd__ev::before { content: ''; position: absolute; left: 2px; top: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 3px var(--card); z-index: 1; }
.fd__ev::after { content: ''; position: absolute; left: 6px; top: 12px; bottom: -6px; width: 2px; background: var(--line); }
.fd__ev:last-child::after { display: none; }
.fd__ev--ok::before { background: var(--ok); } .fd__ev--warn::before { background: var(--warn); } .fd__ev--bad::before { background: var(--bad); }
.fd__ev--info::before { background: var(--accent-2); } .fd__ev--go::before { background: var(--accent); }
.fd__ev time { font-size: .84rem; font-weight: 600; color: var(--ink-2); font-variant-numeric: tabular-nums; white-space: nowrap; }
.fd__ev time small { color: var(--muted); font-weight: 500; }
.fd__ev b { font-weight: 600; font-size: .92rem; }
.fd__ev small { color: var(--muted); }
.fd__tag { display: inline-block; padding: 1px 6px; border-radius: 5px; background: color-mix(in oklab, var(--accent) 14%, transparent); color: var(--accent) !important; font-size: .66rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; }
.fd__hint { display: flex; gap: 8px; align-items: flex-start; margin: 0; padding: 10px 14px; border-radius: 14px; background: var(--paper-2); color: var(--ink-2); font-size: .86rem; line-height: 1.45; }
.fd > .fd__hint { margin: 16px 20px 0; }
.fd__hint .i { flex: none; width: 16px; height: 16px; margin-top: 2px; color: var(--gold); }
.fd__fine { margin: 8px 0 0; font-size: .76rem; color: var(--muted); line-height: 1.45; }
.fd > .fd__fine { margin: 6px 20px 0; }
.fd__links { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 20px 0; }
.fd__links .btn.is-done { border-color: var(--ok); color: var(--ok); }
.fd__src { margin: 14px 20px 0; font-size: .8rem; color: var(--muted); }
@media (max-width: 640px) {
.fdlg { width: 100%; max-height: 90vh; max-height: 90dvh; margin: auto 0 0; border-radius: 22px 22px 0 0; }
.fdlg__grab { display: block; position: absolute; top: 8px; left: 50%; z-index: 4; width: 42px; height: 5px; border-radius: 3px; background: var(--fb-line); transform: translateX(-50%); }
.fdlg__x { top: 12px; right: 12px; width: 36px; height: 36px; }
@media (prefers-reduced-motion: no-preference) { .fdlg[open] { animation: fdSheet .36s var(--ease-out); } }
.fd__head { padding: 24px 56px 16px 16px; gap: 8px 12px; }
.fd__head .fd__st { grid-column: 2 / -1; justify-self: start; }
.fd__no { font-size: 1.25rem; }
.fd__route { grid-template-columns: minmax(0, 1fr) 64px minmax(0, 1fr); gap: 8px; margin: 14px 14px 4px; padding: 14px 12px; }
.fd__tm { font-size: 1.25rem; }
.fd__sec, .fd__links, .fd__src, .fd > .fd__fine, .fd > .fd__hint, .fd__rl, .fd__map { margin-left: 14px; margin-right: 14px; }
.fd__map { height: 220px; }
.fd__sec dd { max-width: 55%; }
}
@keyframes fdSheet { from { transform: translateY(45%); opacity: .5; } }
.adm-meter { margin: 0 0 16px; }
.adm-meter__t { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 6px; font-size: .9rem; }
.adm-meter__t b { font-variant-numeric: tabular-nums; }
.adm-meter__bar { display: block; height: 8px; border-radius: 8px; background: var(--paper-3); overflow: hidden; }
.adm-meter__bar i { display: block; height: 100%; border-radius: inherit; background: var(--ok); }
.adm-meter.is-warn .adm-meter__bar i { background: var(--warn); }
.adm-meter.is-bad .adm-meter__bar i { background: var(--bad); }
.adm-meter .adm-hint { margin: 6px 0 0; }
.adm-dl { display: grid; gap: 6px; margin: 4px 0 12px; }
.adm-dl > div { display: grid; grid-template-columns: minmax(110px, 34%) 1fr; gap: 12px; font-size: .9rem; }
.adm-dl dt { color: var(--muted); }
.adm-dl dd { margin: 0; overflow-wrap: anywhere; }
.fd__ev time.is-nt { color: var(--muted); font-weight: 500; }
.au-tabs { margin: 0 0 18px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
.au-tabs a { display: inline-flex; align-items: center; gap: .4em; white-space: nowrap; }
.au-tabs .i { width: 16px; height: 16px; }
.au-badge { display: inline-grid; place-items: center; min-width: 1.6em; height: 1.6em; padding: 0 .45em; border-radius: 999px; background: var(--accent); color: var(--accent-ink); font: 700 .72rem/1 var(--sans); }
.au-stats { margin-bottom: 16px; }
.au-stats .adm-stat:not(a):hover { transform: none; border-color: var(--line); }
.au-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 14px; }
.au-chip { display: inline-flex; align-items: center; gap: .4em; padding: .45em .9em; border-radius: 999px; border: 1px solid var(--line); background: var(--card); text-decoration: none; font-weight: 600; font-size: .85rem; color: var(--ink-2); }
.au-chip:hover { border-color: var(--ink); color: var(--ink); }
.au-chip[aria-current] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.au-chip small { font-weight: 600; opacity: .7; }
.au-chips__sep { width: 1px; height: 22px; background: var(--line); margin: 0 6px; }
.au-kind { font: 600 .72rem/1 var(--sans); letter-spacing: .08em; text-transform: uppercase; padding: .4em .65em; border-radius: 6px; background: var(--paper-2); white-space: nowrap; }
.au-kind--claim { color: var(--accent-2); }
.au-kind--new { color: var(--ok); }
.au-kind--edit { color: var(--accent); }
.au-diff th[scope="row"] { font-weight: 600; color: var(--ink-2); width: 22%; min-width: 140px; vertical-align: top; text-transform: none; letter-spacing: 0; font-size: .86rem; }
.au-diff td { vertical-align: top; overflow-wrap: anywhere; }
.au-diff .au-old { color: var(--muted); background: color-mix(in oklab, var(--bad) 5%, transparent); }
.au-diff .au-new { background: color-mix(in oklab, var(--ok) 8%, transparent); font-weight: 500; }
.au-diff__c { width: 36px; text-align: center; }
.au-diff__c input { width: 18px; height: 18px; accent-color: var(--accent); }
.au-drift td.au-old { background: color-mix(in oklab, var(--warn) 10%, transparent); }
.au-drift__n { display: flex; gap: .35em; align-items: flex-start; margin: 8px 0 0; color: var(--warn); font-size: .82rem; font-weight: 600; }
.au-drift__n .i { width: 14px; height: 14px; margin-top: .15em; flex: none; }
.au-pre { white-space: pre-line; overflow-wrap: anywhere; margin: 0; }
div.au-pre { max-height: 22em; overflow: auto; font-size: .88rem; line-height: 1.55; }
.au-big { font-size: 1.1rem; }
.au-dl { margin: 0 0 12px; display: grid; gap: 0; }
.au-dl > div { display: grid; grid-template-columns: minmax(130px, 30%) minmax(0, 1fr); gap: 12px; padding: .55em 0; border-top: 1px dashed var(--line); font-size: .92rem; }
.au-dl dt { color: var(--muted); }
.au-dl dd { margin: 0; overflow-wrap: anywhere; }
.au-sim { margin-top: 14px; }
.au-main { min-width: 0; }
.au-main .tbl-wrap + .adm-hint { margin: 10px 0 0; }
.au-decide .adm-form + .adm-form { margin-top: 18px; padding-top: 18px; border-top: 1px dashed var(--line); }
.au-pass { border-color: color-mix(in oklab, var(--ok) 45%, var(--line)); background: color-mix(in oklab, var(--ok) 7%, var(--card)); margin-bottom: 18px; }
.au-pass__dl { margin: 0 0 10px; display: grid; gap: 10px; max-width: 520px; }
.au-pass__dl > div { display: grid; grid-template-columns: 90px minmax(0, 1fr); align-items: center; gap: 10px; }
.au-pass__dl dt { font-weight: 600; color: var(--ink-2); }
.au-pass__dl dd { margin: 0; }
.au-pass__dl input { font-size: 1.05rem; letter-spacing: .04em; }
.au-cols { margin-bottom: 18px; }
.au-row { margin: 0 0 8px; }
.au-row form { margin: 0; }
.au-link { margin-top: 14px; padding: 0; }
.au-found { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 6px; }
.au-found li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 12px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--paper); }
.au-found form { margin: 0; }
.au-danger { border-color: color-mix(in oklab, var(--bad) 35%, var(--line)); }
.au-danger .adm-h3 .i { color: var(--bad); }
.au-new summary { cursor: pointer; margin: 0; list-style: none; }
.au-new summary::-webkit-details-marker { display: none; }
.au-new[open] summary { margin-bottom: 12px; }
.au-new { margin-top: 22px; }
.au-admins { display: grid; grid-template-columns: minmax(0, 1fr); gap: 14px; }
.au-admins > * { min-width: 0; }
.au-admin .adm-meta { margin-bottom: 12px; }
.au-newadmin { max-width: 420px; }
@media (max-width: 700px) {
.au-diff thead { display: none; }
.au-diff, .au-diff tbody { display: block; }
.au-diff tr { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: start; gap: 0 10px; padding: 10px 12px; border-bottom: 1px solid var(--line); }
.au-diff tr:last-child { border-bottom: 0; }
.au-diff th[scope="row"], .au-diff td { display: block; grid-column: 1 / -1; width: auto; min-width: 0; border: 0; padding: 0; }
.au-diff td.au-diff__c { grid-column: 1; }
.au-diff td.au-diff__c + th[scope="row"] { grid-column: 2; }
.au-diff td.au-old, .au-diff td.au-new { margin-top: 8px; padding: 6px 8px; border-radius: 6px; }
.au-diff td[data-l]::before { content: attr(data-l); display: block; margin-bottom: 2px; font: 600 .66rem/1.3 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.au-diff th[scope="row"] { min-width: 0; }
.au-dl > div, .au-pass__dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}
:root { --bk-s: 56%; --bk-l1: 42%; --bk-l2: 30%; --bk-fg: var(--card); --bk-tl: 36%; --bk-tbl: 93%; }
:root[data-theme="dark"] { --bk-s: 52%; --bk-l1: 56%; --bk-l2: 40%; --bk-fg: var(--paper); --bk-tl: 74%; --bk-tbl: 20%; }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] { --bk-s: 52%; --bk-l1: 56%; --bk-l2: 40%; --bk-fg: var(--paper); --bk-tl: 74%; --bk-tbl: 20%; } }
.bkm { --mh: 200; --sz: 56px; position: relative; isolation: isolate; overflow: hidden; flex: none; display: grid; place-items: center; width: var(--sz); aspect-ratio: 1; border-radius: 30%;
color: var(--bk-fg); font: 600 calc(var(--sz) * .36)/1 var(--serif); letter-spacing: .02em;
background: radial-gradient(circle at 28% 22%, hsl(var(--mh) 72% calc(var(--bk-l1) + 14%)), transparent 58%),
linear-gradient(140deg, hsl(var(--mh) var(--bk-s) var(--bk-l1)), hsl(calc(var(--mh) + 38) 60% var(--bk-l2)));
box-shadow: inset 0 0 0 1px hsl(var(--mh) 60% 85% / .22), 0 10px 22px -14px hsl(var(--mh) 60% 25% / .7); }
.bkm::before { content: ''; position: absolute; inset: -30%; z-index: -1; opacity: .5;
background: repeating-conic-gradient(from 0deg, color-mix(in oklab, var(--bk-fg) 14%, transparent) 0 5deg, transparent 5deg 10deg);
-webkit-mask-image: radial-gradient(circle, transparent 30%, #000 32%, #000 52%, transparent 54%); mask-image: radial-gradient(circle, transparent 30%, #000 32%, #000 52%, transparent 54%); }
.bkm > span { position: relative; text-shadow: 0 1px 2px hsl(var(--mh) 60% 15% / .35); }
.bkm--xs { --sz: 26px; border-radius: 8px; }
.bkm--xs::before { display: none; }
.bkm--sm { --sz: 44px; }
.bkm--lg { --sz: clamp(72px, 9vw, 104px); }
.bk-tel { display: inline-flex; align-items: center; gap: .45em; min-height: 34px; padding: .38em .82em; border: 0; border-radius: 999px; background: var(--paper-2); color: inherit; font: 600 .84rem/1.2 var(--sans);
font-variant-numeric: tabular-nums; text-decoration: none; white-space: nowrap; cursor: pointer; transition: background .2s, color .2s, transform .25s var(--ease); }
.bk-tel .i { width: 14px; height: 14px; color: var(--accent-2); }
.bk-tel:hover { background: var(--accent-2); color: var(--paper); transform: translateY(-1px); }
.bk-tel:hover .i { color: inherit; }
:root[data-theme="dark"] .bk-tel { background: var(--paper-3); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .bk-tel { background: var(--paper-3); } }
.bk-tel--map { font-weight: 500; }
.bk-nets { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 5px; }
.bk-net { display: inline-flex; align-items: center; padding: .3em .62em; border-radius: 7px; border: 1px solid var(--line); background: var(--paper); font: 700 .7rem/1 var(--sans);
letter-spacing: .04em; color: var(--ink-2); }
.bk-net--visa { font-style: italic; letter-spacing: .08em; text-transform: uppercase; }
.bk-net--mastercard, .bk-net--unionpay { letter-spacing: 0; }
.bk-net--humo, .bk-net--uzcard { text-transform: uppercase; letter-spacing: .1em; }
.bh { position: relative; isolation: isolate; overflow: hidden; padding-top: clamp(20px, 4vw, 52px);
background: radial-gradient(90% 70% at 100% 0%, color-mix(in oklab, var(--gold) 13%, transparent), transparent 60%), var(--paper); border-bottom: 1px solid var(--line); }
.bh__bg, .bd-h__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.bh__guil { position: absolute; width: min(72vw, 860px); aspect-ratio: 1; right: -18vw; top: 50%; translate: 0 -50%; color: var(--gold); opacity: .42; }
.bh__guil svg { width: 100%; height: 100%; }
.bh__guil :is(path, circle) { fill: none; stroke: currentColor; stroke-width: .7; stroke-dasharray: 1; stroke-dashoffset: 0; }
.bh__glow { position: absolute; width: 48vw; height: 48vw; left: -14vw; top: -26vw; border-radius: 50%; filter: blur(50px);
background: radial-gradient(circle, color-mix(in oklab, var(--accent-2) 24%, transparent), transparent 66%); }
.bh__glow--b { left: auto; right: 6vw; top: auto; bottom: -30vw; background: radial-gradient(circle, color-mix(in oklab, var(--accent) 18%, transparent), transparent 66%); }
.bh__in { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, .92fr); gap: clamp(28px, 5vw, 76px); align-items: center; padding-bottom: clamp(30px, 5vw, 60px); }
@media (max-width: 1000px) { .bh__in { grid-template-columns: minmax(0, 1fr); } }
.bh__t { font-size: clamp(2.5rem, 6.2vw, 5.3rem); line-height: .98; letter-spacing: -.03em; margin: 0 0 .32em; font-weight: 500; max-width: 12ch; hyphens: manual; }
.bh__t em { font-style: italic; font-weight: 400; color: var(--accent); }
.bh__w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
.bh__w > span { display: inline-block; }
.bh__lead { font-size: clamp(1.02rem, 1.45vw, 1.18rem); line-height: 1.6; color: var(--ink-2); max-width: 56ch; margin: 0; }
.bh__stats { display: flex; flex-wrap: wrap; gap: 14px clamp(20px, 3vw, 40px); margin: 26px 0 0; }
.bh__stats > div { display: flex; flex-direction: column-reverse; padding-left: 14px; border-left: 2px solid color-mix(in oklab, var(--gold) 55%, transparent); }
.bh__stats dd { margin: 0; font: 500 clamp(1.8rem, 3vw, 2.5rem)/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; }
.bh__stats dt { margin-top: 6px; font-size: .8rem; color: var(--muted); }
.bh__go { display: flex; flex-wrap: wrap; gap: 10px; margin: 28px 0 0; }
.bh__go .btn .i { width: 1.1em; height: 1.1em; }
.bh__board { --bd-bg: color-mix(in oklab, var(--ink) 94%, var(--accent-2)); --bd-fg: var(--paper); --bd-mute: color-mix(in oklab, var(--bd-fg) 62%, transparent);
position: relative; overflow: hidden; display: grid; gap: 8px; padding: 18px 18px 14px; border-radius: 26px; background: var(--bd-bg); color: var(--bd-fg); box-shadow: var(--shadow-lg); }
:root[data-theme="dark"] .bh__board { --bd-bg: color-mix(in oklab, var(--paper-2) 88%, var(--accent-2)); --bd-fg: var(--ink); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .bh__board { --bd-bg: color-mix(in oklab, var(--paper-2) 88%, var(--accent-2)); --bd-fg: var(--ink); } }
.bh__board::before { content: ''; position: absolute; inset: 0; pointer-events: none; opacity: .5;
background: repeating-linear-gradient(0deg, color-mix(in oklab, var(--bd-fg) 4%, transparent) 0 1px, transparent 1px 4px); }
.bh__bt { position: relative; display: flex; justify-content: space-between; gap: 10px; margin: 0 0 4px; font: 600 .72rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--bd-mute); }
.bh__bt span:first-child { color: var(--gold); }
.bh__row { position: relative; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; grid-template-areas: "c n d" "c r r"; align-items: center; gap: 4px 14px;
padding: 12px; border-radius: 16px; background: color-mix(in oklab, var(--bd-fg) 5%, transparent); text-decoration: none; color: inherit; transition: background .25s; }
.bh__row:hover { background: color-mix(in oklab, var(--bd-fg) 9%, transparent); color: inherit; }
.bh__ccy { grid-area: c; display: grid; place-items: center; width: 58px; height: 58px; border-radius: 16px; background: color-mix(in oklab, var(--gold) 22%, transparent); color: var(--gold);
font: 700 1.02rem/1 var(--sans); letter-spacing: .08em; }
.bh__nm { grid-area: n; min-width: 0; font-size: .8rem; color: var(--bd-mute); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bh__diff { grid-area: d; }
.bh__rate { grid-area: r; display: flex; flex-wrap: nowrap; gap: 3px; perspective: 500px; font: 600 clamp(1.3rem, 2.3vw, 1.85rem)/1 var(--sans); font-variant-numeric: tabular-nums; }
.fx-dg { position: relative; display: inline-grid; place-items: center; width: 1.02em; height: 1.42em; border-radius: 6px; background: color-mix(in oklab, var(--bd-fg) 10%, transparent);
box-shadow: inset 0 -2px 0 color-mix(in oklab, var(--bd-bg) 40%, transparent); }
.fx-dg::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: color-mix(in oklab, var(--bd-bg) 70%, transparent); }
.fx-sp { display: inline-grid; place-items: end center; width: .32em; height: 1.42em; padding-bottom: .1em; }
.bh__src { position: relative; margin: 2px 4px 0; font-size: .7rem; color: var(--bd-mute); text-align: right; letter-spacing: .04em; }
.bh__tape { --gap: 2.4rem; border-top: 1px solid var(--line); padding: 13px 0; font: 500 .9rem/1 var(--sans); color: var(--ink-2); }
.bh__tape .marquee__it b, .fx-tape .marquee__it b { color: var(--ink); letter-spacing: .04em; }
.fx-diff { display: inline-flex; align-items: center; gap: .25em; padding: .25em .55em; border-radius: 999px; font: 600 .76rem/1 var(--sans); font-variant-numeric: tabular-nums; white-space: nowrap;
background: color-mix(in oklab, var(--muted) 12%, transparent); color: var(--muted); }
.fx-diff--up { background: color-mix(in oklab, var(--accent) 14%, transparent); color: var(--accent); }
.fx-diff--down { background: color-mix(in oklab, var(--accent-2) 14%, transparent); color: var(--accent-2); }
.bh__board .fx-diff--up { color: color-mix(in oklab, var(--accent) 70%, var(--bd-fg)); }
.bh__board .fx-diff--down { color: color-mix(in oklab, var(--accent-2) 60%, var(--bd-fg)); }
.fx { scroll-margin-top: var(--hdr); }
.fx__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin: -8px 0 22px; font-size: .88rem; }
.fx__meta a { display: inline-flex; align-items: center; gap: .35em; color: var(--muted); }
.fx__meta a .i { width: 13px; height: 13px; }
.fx__date { display: inline-flex; align-items: center; gap: .45em; padding: .4em .85em; border-radius: 999px; background: color-mix(in oklab, var(--accent-2) 12%, transparent); color: var(--accent-2); font-weight: 600; }
.fx__top { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)) minmax(0, 1.25fr); gap: 14px; align-items: stretch; }
@media (max-width: 1180px) { .fx__top { grid-template-columns: repeat(3, minmax(0, 1fr)); } .fx-cv { grid-column: 1 / -1; } }
@media (max-width: 760px) { .fx__top { grid-template-columns: minmax(0, 1fr); } }
.fx-card { position: relative; overflow: hidden; isolation: isolate; display: flex; flex-direction: column; gap: 6px; padding: 20px 20px 0; border-radius: 22px; border: 1px solid var(--line); background: var(--card);
box-shadow: var(--shadow); transition: transform .4s var(--ease-out), box-shadow .4s; }
.fx-card:hover { transform: translateY(-3px); box-shadow: var(--shadow-lg); }
.fx-card__h { display: flex; align-items: center; gap: 10px; min-width: 0; }
.fx-card__c { flex: none; padding: .42em .7em; border-radius: 10px; background: var(--ink); color: var(--paper); font: 700 .86rem/1 var(--sans); letter-spacing: .08em; }
.fx-card__nm { min-width: 0; font-size: .86rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fx-card__r { margin: 8px 0 0; display: flex; align-items: baseline; gap: .35em; flex-wrap: wrap; }
.fx-card__r b { font: 500 clamp(1.9rem, 3vw, 2.5rem)/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; letter-spacing: -.01em; }
.fx-card__r small { font-size: .85rem; color: var(--muted); }
.fx-card__f { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; font-size: .8rem; }
.fx-spark { display: block; flex: 1 1 54px; width: calc(100% + 40px); height: auto; min-height: 54px; margin: 10px -20px 0; overflow: visible; }
.fx-spark__a { fill: color-mix(in oklab, var(--accent-2) 14%, transparent); stroke: none; }
.fx-spark__l { fill: none; stroke: var(--accent-2); stroke-width: 1.8; vector-effect: non-scaling-stroke; stroke-dasharray: 1; stroke-dashoffset: 0; }
.fx-spark circle { fill: var(--accent-2); stroke: var(--card); stroke-width: 2; vector-effect: non-scaling-stroke; }
.fx-card:not(:has(.fx-spark)) { padding-bottom: 20px; }
.fx-cv { position: relative; overflow: hidden; isolation: isolate; display: grid; gap: 12px; align-content: start; padding: 20px; border-radius: 22px; color: var(--ink);
border: 1px solid color-mix(in oklab, var(--accent) 35%, var(--line)); background: linear-gradient(160deg, color-mix(in oklab, var(--accent) 8%, var(--card)), var(--card) 60%); box-shadow: var(--shadow); }
.fx-cv::after { content: ''; position: absolute; z-index: -1; width: 260px; height: 260px; right: -100px; bottom: -120px; border-radius: 50%;
background: radial-gradient(circle, color-mix(in oklab, var(--gold) 20%, transparent), transparent 70%); }
.fx-cv__t { display: flex; align-items: center; gap: .5em; margin: 0; font-size: 1.3rem; }
.fx-cv__t .i { color: var(--accent); }
.fx-cv__row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }
.fx-cv__f { display: grid; gap: 6px; min-width: 0; }
.fx-cv__f > span { font: 600 .72rem/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.fx-cv__f input, .fx-cv__f select { width: 100%; min-width: 0; padding: .7em .9em; border-radius: 14px; border: 1px solid var(--line); background: var(--paper); color: var(--ink); font-size: 1rem; }
.fx-cv__f input { font: 600 1.35rem/1.2 var(--sans); font-variant-numeric: tabular-nums; }
.fx-cv__f :is(input, select):focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 22%, transparent); }
.fx-cv.is-bad input { border-color: var(--bad); }
.fx-cv__swap { width: 48px; height: 48px; border: 1px solid var(--line); background: var(--card); }
.fx-cv__swap .i { width: 20px; height: 20px; color: var(--accent); transition: transform .5s var(--ease-out); }
.fx-cv.is-rev .fx-cv__swap .i { transform: rotate(180deg); }
.fx-cv__out { display: block; min-height: 2.6em; padding: 12px 14px; border-radius: 14px; background: color-mix(in oklab, var(--ink) 6%, transparent); font-size: 1rem; line-height: 1.3; }
.fx-cv__out b { font: 500 clamp(1.5rem, 2.6vw, 2rem)/1.1 var(--serif); font-variant-numeric: lining-nums tabular-nums; color: var(--accent); }
.fx-cv__from { color: var(--muted); }
.fx-cv__note { margin: 0; font-size: .8rem; color: var(--muted); }
.fx__sub { margin: 30px 0 12px; font: 600 .76rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); }
.fx__grid { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 8px; }
@media (max-width: 560px) { .fx__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .fx-mini { padding: 10px 12px; grid-template-areas: "c c" "r r" "n d"; } .fx-mini__r { justify-self: start; font-size: 1.05rem; } }
.fx-mini { display: grid; grid-template-columns: auto minmax(0, 1fr); grid-template-areas: "c r" "n d"; align-items: center; gap: 4px 12px; padding: 12px 14px; border-radius: 16px; border: 1px solid var(--line);
background: var(--card); transition: border-color .25s, transform .3s var(--ease-out); }
.fx-mini:hover { border-color: var(--accent-2); transform: translateY(-2px); }
.fx-mini__c { grid-area: c; font: 700 .9rem/1 var(--sans); letter-spacing: .08em; }
.fx-mini__nm { grid-area: n; min-width: 0; font-size: .74rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fx-mini__r { grid-area: r; justify-self: end; font: 600 1.02rem/1 var(--sans); font-variant-numeric: tabular-nums; }
.fx-mini .fx-diff { grid-area: d; justify-self: end; }
.fx__all { margin-top: 18px; }
.fx__all summary { display: inline-flex; align-items: center; gap: .5em; padding: .65em 1.1em; border-radius: 999px; border: 1px solid var(--line); background: var(--card); cursor: pointer; font-weight: 600; font-size: .9rem; list-style: none; }
.fx__all summary::-webkit-details-marker { display: none; }
.fx__all[open] summary { margin-bottom: 14px; background: var(--ink); color: var(--paper); border-color: var(--ink); }
.fx__all .tbl-wrap { max-height: 520px; overflow: auto; }
.fx__num { font-variant-numeric: tabular-nums; font-weight: 600; white-space: nowrap; }
.fx__none { display: flex; align-items: center; gap: .6em; padding: 18px 20px; border-radius: 16px; background: color-mix(in oklab, var(--warn) 12%, transparent); color: var(--ink-2); }
.fx__none .i { color: var(--warn); }
.bks { scroll-margin-top: var(--hdr); }
.bkf { display: grid; gap: 16px; padding: clamp(16px, 2.4vw, 24px); margin-bottom: 18px; border-radius: 22px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.bkf__row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }
.bkf__q { flex: 1 1 260px; display: flex; align-items: center; gap: 8px; padding: 0 14px; border-radius: 14px; border: 1px solid var(--line); background: var(--paper); min-width: 0; }
.bkf__q .i { color: var(--muted); }
.bkf__q input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; padding: .72em 0; font-size: .98rem; color: var(--ink); }
.bkf__q:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 20%, transparent); }
.bkf__sel { position: relative; flex: 0 1 260px; display: flex; align-items: center; min-width: 0; }
.bkf__sel > .i { position: absolute; left: 13px; color: var(--accent); pointer-events: none; }
.bkf__sel select { appearance: none; -webkit-appearance: none; width: 100%; padding: .72em 2.4em .72em 2.4em; border-radius: 14px; border: 1px solid var(--line); font-size: .92rem; cursor: pointer; color: var(--ink);
background-color: var(--paper); background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(135deg, var(--muted) 50%, transparent 50%);
background-position: calc(100% - 20px) 54%, calc(100% - 15px) 54%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; }
.bkf__sel select:focus-visible { outline: none; border-color: var(--accent); }
.bkf__reset { margin-left: auto; }
.bkf__g { border: 0; margin: 0; padding: 0; min-width: 0; }
.bkf__g legend { padding: 0; margin-bottom: 8px; color: var(--muted); }
.bkf__chips { display: flex; flex-wrap: wrap; gap: 7px; }
.bkc { position: relative; }
.bkc input { position: absolute; opacity: 0; pointer-events: none; }
.bkc > span { display: inline-flex; align-items: center; gap: .42em; padding: .48em .85em; border-radius: 999px; border: 1px solid var(--line); background: var(--paper); font-size: .85rem; font-weight: 500;
white-space: nowrap; cursor: pointer; transition: background .2s, border-color .2s, color .2s, transform .25s var(--ease); }
.bkc .i { width: 1.05em; height: 1.05em; color: var(--accent-2); }
.bkc small { font-size: .72rem; color: var(--muted); }
.bkc > span:hover { border-color: var(--ink-2); transform: translateY(-1px); }
.bkc input:checked + span { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.bkc input:checked + span :is(.i, small) { color: inherit; }
.bkc input:focus-visible + span { outline: 2px solid var(--accent); outline-offset: 2px; }
.bkc--net > span { font-weight: 700; letter-spacing: .03em; }
@media (max-width: 700px) {
.bkf__chips { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; padding-bottom: 2px; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.bkf__chips::-webkit-scrollbar { display: none; }
.bkc { flex: none; }
.bkf__sel { flex: 1 1 100%; }
}
.bk-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: 14px; }
.bk-card { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: 12px; padding: 18px 18px 14px; border-radius: 22px; border: 1px solid var(--line);
background: var(--card); transition: transform .45s var(--ease-out), border-color .3s, box-shadow .45s; }
.bk-card::before { content: ''; position: absolute; z-index: -1; inset: 0 0 auto; height: 4px; background: linear-gradient(90deg, hsl(var(--mh) var(--bk-s) var(--bk-l1)), hsl(calc(var(--mh) + 38) 60% var(--bk-l2))); opacity: .85; }
.bk-card::after { content: ''; position: absolute; z-index: -1; width: 240px; height: 240px; right: -110px; top: -120px; border-radius: 50%;
background: radial-gradient(circle, hsl(var(--mh) 70% 60% / .14), transparent 70%); transition: transform .7s var(--ease-out); }
.bk-card:hover { transform: translateY(-4px); border-color: hsl(var(--mh) 45% 60% / .7); box-shadow: var(--shadow-lg); }
.bk-card:hover::after { transform: scale(1.5); }
.bk-card:hover .bkm { transform: rotate(-6deg) scale(1.05); }
.bk-card .bkm { transition: transform .5s var(--ease-out); }
.bk-card__top { display: flex; gap: 14px; align-items: center; min-width: 0; }
.bk-card__tt { min-width: 0; }
.bk-card__own { display: flex; align-items: center; gap: .4em; margin: 0 0 3px; font: 600 .7rem/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: hsl(var(--mh) 45% var(--bk-tl)); }
.bk-card__own .i { width: 13px; height: 13px; }
.bk-card__n { margin: 0; font-size: 1.28rem; line-height: 1.15; }
.bk-card__n a { text-decoration: none; }
.bk-card__n a::after { content: ''; position: absolute; inset: 0; z-index: 0; }
.bk-card__n a:hover { color: inherit; }
.bk-card__full { margin: 3px 0 0; font-size: .8rem; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bk-svc { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.bk-svc li { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: hsl(var(--mh) 40% var(--bk-tbl)); color: hsl(var(--mh) 50% var(--bk-tl)); }
.bk-svc .i { width: 16px; height: 16px; }
.bk-card__foot { position: relative; z-index: 1; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: auto; padding-top: 4px; }
.bk-card__br { display: inline-flex; align-items: center; gap: .35em; font-size: .8rem; color: var(--muted); }
.bk-card__br .i { width: 14px; height: 14px; }
.bk-card__go { margin-left: auto; width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; color: var(--muted); transition: background .25s, color .25s, transform .4s var(--ease-out); }
.bk-card__go .i { width: 17px; height: 17px; }
.bk-card:hover .bk-card__go { background: var(--ink); color: var(--paper); transform: rotate(45deg); }
.bk-none { display: flex; align-items: center; justify-content: center; gap: .6em; padding: 36px 16px; color: var(--muted); }
.bk-none .i { width: 26px; height: 26px; color: var(--accent); }
.bkt__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); gap: 14px; }
.bkt__it { position: relative; display: flex; flex-direction: column; gap: 8px; padding: 22px; border-radius: 22px; border: 1px solid var(--line); background: var(--card); }
.bkt__it h3 { margin: 4px 0 0; font-size: 1.2rem; }
.bkt__it > p { margin: 0; font-size: .92rem; line-height: 1.55; color: var(--ink-2); }
.bkt__ic { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 15px; background: color-mix(in oklab, var(--gold) 16%, transparent); color: var(--gold); }
.bkt__ic .i { width: 24px; height: 24px; }
.bkt__k { margin: 8px 0 0 !important; font: 600 .7rem/1.2 var(--sans) !important; letter-spacing: .1em; text-transform: uppercase; color: var(--muted) !important; }
.bkt__banks, .bkt__sys { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }
.bkt__banks a { display: inline-flex; align-items: center; gap: .45em; padding: .3em .7em .3em .3em; border-radius: 999px; border: 1px solid var(--line); background: var(--paper); font-size: .8rem; font-weight: 600; text-decoration: none; }
.bkt__banks a:hover { border-color: hsl(var(--mh, 30) 45% 55%); color: inherit; }
.bkt__banks li:last-child > a:not([style]) { padding: .3em .75em; color: var(--muted); }
.bkt__sys li { padding: .35em .75em; border-radius: 8px; background: color-mix(in oklab, var(--accent-2) 10%, transparent); color: var(--accent-2); font-size: .8rem; font-weight: 600; }
.bd-h { --bdh-bg: color-mix(in oklab, var(--ink) 90%, hsl(var(--mh) 55% 35%)); --bdh-fg: var(--paper); --bdh-mute: color-mix(in oklab, var(--bdh-fg) 70%, transparent); --bdh-line: color-mix(in oklab, var(--bdh-fg) 15%, transparent);
position: relative; isolation: isolate; overflow: hidden; background: var(--bdh-bg); color: var(--bdh-fg); padding: calc(var(--hdr) + clamp(14px, 3vw, 36px)) 0 clamp(32px, 5vw, 60px); }
:root[data-theme="dark"] .bd-h { --bdh-bg: color-mix(in oklab, var(--paper-2) 86%, hsl(var(--mh) 50% 40%)); --bdh-fg: var(--ink); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .bd-h { --bdh-bg: color-mix(in oklab, var(--paper-2) 86%, hsl(var(--mh) 50% 40%)); --bdh-fg: var(--ink); } }
.bd-h .bh__guil { color: hsl(var(--mh) 70% 75%); opacity: .22; right: -14vw; width: min(62vw, 700px); }
.bd-h .bh__glow { background: radial-gradient(circle, hsl(var(--mh) 70% 55% / .35), transparent 66%); }
.bd-h .crumbs ol { color: var(--bdh-mute); }
.bd-h .crumbs a:hover { color: var(--bdh-fg); }
.bd-h__top { display: flex; align-items: center; gap: clamp(14px, 2.4vw, 26px); }
.bd-h__tt { min-width: 0; }
.bd-h .kicker { color: hsl(var(--mh) 70% 75%); margin-bottom: .55em; }
.bd-h .kicker .i { width: 1.1em; height: 1.1em; }
.bd-h__t { margin: 0; font-size: clamp(1.9rem, 4.4vw, 3.4rem); max-width: 22ch; overflow-wrap: anywhere; }
.bd-h__short { margin: 8px 0 0; font: 600 .95rem/1.2 var(--sans); color: var(--bdh-mute); letter-spacing: .02em; }
.bd-h__lead { margin: 20px 0 0; color: var(--bdh-mute); max-width: 66ch; }
.bd-h__cta { display: flex; flex-wrap: wrap; gap: 10px; margin: 24px 0 16px; }
.bd-h .btn--ghost { color: var(--bdh-fg); border-color: var(--bdh-line); }
.bd-h .btn--ghost:hover { background: var(--bdh-fg); border-color: var(--bdh-fg); color: var(--bdh-bg); }
.bd-h .bk-net { background: color-mix(in oklab, var(--bdh-fg) 8%, transparent); border-color: var(--bdh-line); color: var(--bdh-fg); }
.bd-h__chk { display: inline-flex; align-items: center; gap: .45em; margin: 18px 0 0; font-size: .85rem; color: var(--bdh-mute); }
.bd-card, .bd-about { margin-top: 18px; padding: clamp(18px, 2.6vw, 28px); border-radius: 22px; border: 1px solid var(--line); background: var(--card); }
.bd-card:first-child { margin-top: 0; box-shadow: var(--shadow); }
.bd-card__t { display: flex; align-items: center; gap: .5em; margin: 0 0 16px; font-size: clamp(1.3rem, 2vw, 1.55rem); }
.bd-card__t .i { color: var(--accent); }
.bd-tels { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 240px), 1fr)); gap: 10px; }
.bd-tel { display: flex; align-items: center; gap: 14px; padding: 14px 16px; border-radius: 18px; border: 1px solid var(--line); background: var(--paper); text-decoration: none;
transition: border-color .25s, transform .35s var(--ease-out), box-shadow .35s; }
.bd-tel:hover { border-color: var(--accent-2); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.bd-tel__ic { flex: none; width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in oklab, var(--accent-2) 14%, transparent); color: var(--accent-2); }
.bd-tel > span:last-child { display: grid; min-width: 0; }
.bd-tel small { font: 600 .7rem/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.bd-tel b { font-size: 1.14rem; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.bd-tel--short { border-color: color-mix(in oklab, var(--accent) 40%, var(--line)); background: color-mix(in oklab, var(--accent) 7%, var(--paper)); }
.bd-tel--short .bd-tel__ic { background: var(--accent); color: var(--accent-ink); }
.bd-ons { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 14px; padding-top: 14px; border-top: 1px dashed var(--line); }
.bd-ons:empty { display: none; }
.bd-on { display: inline-flex; align-items: center; gap: 11px; padding: 10px 14px; border-radius: 14px; background: var(--paper-2); text-decoration: none; max-width: 100%; }
a.bd-on:hover { background: var(--paper-3); color: inherit; }
.bd-on > span { display: grid; min-width: 0; font-weight: 600; font-size: .9rem; overflow-wrap: anywhere; }
.bd-on small { font: 600 .66rem/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.bd-on > .i { color: var(--accent); }
.bd-app { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding: 8px 0; }
.bd-app + .bd-app { border-top: 1px dashed var(--line); padding-top: 14px; }
.bd-app__n { flex: 1 1 100%; font-weight: 600; }
.bd-store { display: inline-flex; align-items: center; gap: 10px; padding: 9px 16px 9px 12px; border-radius: 14px; background: var(--ink); color: var(--paper); text-decoration: none;
transition: transform .3s var(--ease-out), box-shadow .3s; }
.bd-store:hover { color: var(--paper); transform: translateY(-2px); box-shadow: var(--shadow); }
.bd-store .i { width: 24px; height: 24px; }
.bd-store > span { display: grid; font: 600 1rem/1.1 var(--sans); }
.bd-store small { font-size: .66rem; font-weight: 500; opacity: .75; letter-spacing: .04em; }
.bd-svc { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); gap: 8px; }
.bd-svc li { display: flex; align-items: center; gap: 10px; padding: 10px 12px; border-radius: 14px; background: hsl(var(--mh) 40% var(--bk-tbl) / .6); font-size: .9rem; font-weight: 500; }
.bd-svc .i { flex: none; width: 34px; height: 34px; padding: 8px; border-radius: 10px; background: var(--card); color: hsl(var(--mh) 50% var(--bk-tl)); }
.bd-sub { margin: 18px 0 10px; color: var(--muted); }
.bd-about .prose { font-size: 1.02rem; }
.bd-note { display: flex; gap: .6em; align-items: flex-start; margin: 18px 0 0; padding: 12px 16px; border-radius: 14px; background: color-mix(in oklab, var(--gold) 13%, transparent); color: var(--ink-2); font-size: .88rem; }
.bd-note .i { color: var(--gold); margin-top: .18em; }
.bd-hq { padding: 18px 20px; border-radius: var(--r); border: 1px solid var(--line); background: var(--card); }
.bd-hq .kicker { margin-bottom: .6em; }
.bd-hq__a { display: flex; gap: .55em; margin: 0; font-size: .95rem; }
.bd-hq__a .i { color: var(--accent); margin-top: .2em; flex: none; }
.bd-hq__a small { color: var(--muted); }
.bd .facts code { font: 600 .9rem/1 ui-monospace, 'SFMono-Regular', Menlo, monospace; letter-spacing: .04em; }
.bd .facts dt, .bd .facts dd { overflow-wrap: anywhere; }
.bd-br-sec { --bk-c: hsl(var(--mh) var(--bk-s) var(--bk-l1)); scroll-margin-top: var(--hdr); }
.bd-jump { display: flex; flex-wrap: wrap; gap: 6px; margin: -6px 0 18px; }
.bd-jump a { display: inline-flex; align-items: center; gap: .4em; padding: .4em .85em; border-radius: 999px; border: 1px solid var(--line); background: var(--card); font-size: .84rem; font-weight: 500; text-decoration: none; }
.bd-jump a:hover { border-color: var(--ink-2); color: inherit; }
.bd-jump small { color: var(--muted); }
.bd-br { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); gap: 18px; align-items: start; }
@media (max-width: 900px) { .bd-br { grid-template-columns: minmax(0, 1fr); } }
.bd-br__map { position: sticky; top: calc(var(--hdr) + 16px); height: min(70vh, 560px); border-radius: 22px; overflow: hidden; border: 1px solid var(--line);
background: var(--paper-3); display: grid; place-items: center; }
.bd-br__map.maplibregl-map { position: sticky; }
@media (max-width: 900px) { .bd-br__map, .bd-br__map.maplibregl-map { position: relative; top: 0; height: 340px; } }
.bd-br__ph { display: grid; justify-items: center; gap: 8px; color: var(--muted); font-size: .85rem; }
.bd-br__ph .i { width: 34px; height: 34px; color: var(--accent); }
.bd-br__list { display: grid; gap: 16px; min-width: 0; }
.bd-grp { scroll-margin-top: calc(var(--hdr) + 12px); }
.bd-grp__t { display: flex; align-items: center; gap: .5em; margin: 0 0 10px; font-size: 1.2rem; }
.bd-grp__t::before { content: ''; width: 10px; height: 10px; border-radius: 3px; background: hsl(var(--h) 55% 50%); rotate: 45deg; }
.bd-grp__t small { font: 600 .78rem/1 var(--sans); color: var(--muted); }
.bd-grp__l { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.bd-b { padding: 14px 16px; border-radius: 18px; border: 1px solid var(--line); background: var(--card); transition: border-color .25s, box-shadow .3s; }
.bd-b:hover { border-color: hsl(var(--mh) 45% 60% / .7); box-shadow: var(--shadow); }
.bd-b:target { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 20%, transparent); }
.bd-b__n { margin: 0 0 4px; font-weight: 600; }
.bd-b__a { display: flex; gap: .45em; margin: 0 0 4px; font-size: .86rem; color: var(--ink-2); }
.bd-b__a .i { width: 14px; height: 14px; margin-top: .2em; flex: none; color: var(--muted); }
.bd-b__a small { color: var(--muted); }
.bd-b__act { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.bd-pop .maplibregl-popup-content { padding: 12px 14px; border-radius: 14px; background: var(--card); color: var(--ink); box-shadow: var(--shadow-lg); font-size: .86rem; }
.bd-pop .maplibregl-popup-content b { display: block; font-size: .95rem; margin-bottom: 2px; }
.bd-pop .maplibregl-popup-content p { margin: 2px 0 0; color: var(--ink-2); }
.bd-pop .bd-pop__k { font: 600 .66rem/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--accent); }
.bd-pop .bd-pop__k:empty { display: none; }
.bd-pop .bd-pop__act { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 8px; font-weight: 600; }
.bd-pop .maplibregl-popup-tip { border-top-color: var(--card); border-bottom-color: var(--card); }
.bd-pop .maplibregl-popup-close-button { color: var(--muted); font-size: 18px; padding: 2px 6px; }
.bkr__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); gap: 12px; }
.bkr__it { display: flex; gap: 14px; align-items: flex-start; padding: 16px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); transition: transform .35s var(--ease-out), border-color .3s, box-shadow .35s; }
.bkr__it:hover { transform: translateY(-2px); border-color: hsl(var(--mh) 45% 60% / .7); box-shadow: var(--shadow); }
.bkr__b { display: grid; gap: 4px; min-width: 0; }
.bkr__n { margin: 0; font-size: 1.08rem; }
.bkr__n a { text-decoration: none; }
.bkr__k { margin: 0; font: 600 .7rem/1.3 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: hsl(var(--mh) 45% var(--bk-tl)); }
.bkr__a { display: flex; gap: .4em; margin: 0 0 4px; font-size: .84rem; color: var(--muted); }
.bkr__a .i { width: 14px; height: 14px; margin-top: .2em; flex: none; }
.bkr__b .bk-tel { justify-self: start; }
.fx-tape { border-block: 1px solid var(--line); background: color-mix(in oklab, var(--paper-2) 70%, transparent); }
.fx-tape__in { display: flex; align-items: center; gap: 18px; padding-block: 10px; }
.fx-tape__lbl { flex: none; display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.fx-tape__lbl > .i { width: 34px; height: 34px; padding: 8px; border-radius: 10px; background: color-mix(in oklab, var(--gold) 18%, transparent); color: var(--gold); }
.fx-tape__lbl > span { display: grid; line-height: 1.2; }
.fx-tape__lbl b { font-size: .86rem; }
.fx-tape__lbl small { font-size: .74rem; color: var(--muted); }
.fx-tape__run { --gap: 2.2rem; flex: 1; min-width: 0; font: 500 .92rem/1 var(--sans); color: var(--ink-2); }
.fx-tape__run .marquee__it { gap: .5em; }
.fx-tape__more { flex: none; display: inline-flex; align-items: center; gap: .35em; font-size: .85rem; font-weight: 600; text-decoration: none; white-space: nowrap; }
@media (max-width: 760px) { .fx-tape__more { display: none; } .fx-tape__lbl small { display: none; } .fx-tape__in { gap: 12px; } }
@media (prefers-reduced-motion: no-preference) {
.bh__guil { animation: bkSpin 260s linear infinite; }
.bh__guil :is(path, circle) { stroke-dashoffset: 1; animation: bkDraw 3.4s var(--ease-out) forwards; animation-delay: calc(var(--g, 0) * 110ms + 100ms); }
.bh__w > span { animation: bkRise 1.1s var(--ease-out) both; animation-delay: calc(var(--k) * 90ms + 120ms); }
.bh__main > :not(.bh__t) { animation: bkUp .9s var(--ease-out) both; }
.bh__main > .kicker { animation-delay: .1s; } .bh__main > .bh__lead { animation-delay: .35s; } .bh__main > .bh__stats { animation-delay: .5s; } .bh__main > .bh__go { animation-delay: .62s; }
.bh__board { animation: bkPop 1s var(--ease-out) .25s both; }
.bh__row { animation: bkUp .8s var(--ease-out) both; animation-delay: calc(var(--r) * 120ms + .45s); }
.fx-dg { animation: fxFlip .8s var(--ease-out) both; animation-delay: calc(var(--k) * 55ms + .7s); transform-origin: 50% 50%; }
.bh__row:nth-of-type(2) .fx-dg { animation-delay: calc(var(--k) * 55ms + .85s); }
.bh__row:nth-of-type(3) .fx-dg { animation-delay: calc(var(--k) * 55ms + 1s); }
.bh__row:nth-of-type(4) .fx-dg { animation-delay: calc(var(--k) * 55ms + 1.15s); }
.js .fx-card[data-reveal] .fx-spark__l { stroke-dashoffset: 1; }
.js .fx-card[data-reveal].is-in .fx-spark__l { animation: bkDraw 1.8s var(--ease-out) .25s forwards; }
.fx-cv__swap.is-spin .i { animation: bkSpinOnce .6s var(--ease-out); }
}
@keyframes bkDraw { to { stroke-dashoffset: 0; } }
@keyframes bkSpin { to { rotate: 360deg; } }
@keyframes bkSpinOnce { from { rotate: -180deg; } }
@keyframes fxFlip { 0% { transform: rotateX(-95deg); opacity: 0; } 55% { transform: rotateX(14deg); opacity: 1; } 100% { transform: none; } }
@keyframes bkRise { from { transform: translateY(108%); } }
@keyframes bkUp { from { opacity: 0; transform: translateY(20px); } }
@keyframes bkPop { from { opacity: 0; transform: translateY(18px) scale(.96); } }
@media (prefers-reduced-motion: reduce) {
.bk-card, .bkm, .bk-card::after, .bd-tel, .bd-store, .fx-card { transition: none; }
}
.pz, .pz-blk {
--pz-ts: 56%; --pz-tl: 40%;
--pz-flap-bg: var(--ink); --pz-flap-fg: var(--paper);
--pz-blend: multiply;
--pz-air: repeating-linear-gradient(135deg, var(--accent) 0 14px, transparent 14px 21px, var(--accent-2) 21px 35px, transparent 35px 42px);
}
:root[data-theme="dark"] :is(.pz, .pz-blk) { --pz-ts: 52%; --pz-tl: 68%; --pz-flap-bg: var(--paper-3); --pz-flap-fg: var(--ink); --pz-blend: screen; }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] :is(.pz, .pz-blk) { --pz-ts: 52%; --pz-tl: 68%; --pz-flap-bg: var(--paper-3); --pz-flap-fg: var(--ink); --pz-blend: screen; } }
.pz-tile, .pz-rh, .pz-dh, .pz-jump a, .pz-dc { --pz-tint: hsl(var(--h, 20) var(--pz-ts) var(--pz-tl)); }
html:not(.js) :is(.pz-js, .pz-cp) { display: none !important; }
.pz-perf { --r: 5px;
-webkit-mask: radial-gradient(var(--r), #0000 97%, #000) round calc(-1.5 * var(--r)) calc(-1.5 * var(--r)) / calc(3 * var(--r)) calc(3 * var(--r)),
linear-gradient(#000 0 0) no-repeat 50% / calc(100% - 3 * var(--r)) calc(100% - 3 * var(--r));
mask: radial-gradient(var(--r), #0000 97%, #000) round calc(-1.5 * var(--r)) calc(-1.5 * var(--r)) / calc(3 * var(--r)) calc(3 * var(--r)),
linear-gradient(#000 0 0) no-repeat 50% / calc(100% - 3 * var(--r)) calc(100% - 3 * var(--r)); }
.pz-st { display: block; width: 100%; height: auto; overflow: visible; }
.pz-st__g { fill: none; stroke: currentColor; stroke-width: .65; stroke-linecap: round; stroke-dasharray: .01 1.7; opacity: .42; }
.pz-st__d { fill: none; stroke: var(--accent); stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; transition: opacity .3s; }
@keyframes pzDraw { from { stroke-dashoffset: 1; } to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: no-preference) {
.pz-env .pz-st__d { stroke-dasharray: 1; animation: pzDraw 1s var(--ease-out) both; animation-delay: calc(var(--i) * 110ms + .35s); }
.js .pz-how__art .pz-st__d { stroke-dasharray: 1; stroke-dashoffset: 1; }
.js .pz-how__art.is-in .pz-st__d { animation: pzDraw 1.1s var(--ease-out) both; animation-delay: calc(var(--i) * 120ms + .2s); }
}
.pz-pm { position: absolute; pointer-events: none; color: var(--accent); opacity: .82; mix-blend-mode: var(--pz-blend); overflow: visible; }
.pz-pm circle { fill: none; stroke: currentColor; }
.pz-pm__o { stroke-width: 2.4; }
.pz-pm__i { stroke-width: 1.1; }
.pz-pm__w path { stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; }
.pz-pm__t { font: 600 7.6px var(--sans); letter-spacing: .08em; fill: currentColor; }
.pz-pm__m { font: 700 12.5px var(--sans); letter-spacing: .05em; fill: currentColor; }
.pz-pm__s { font: 600 7px var(--sans); letter-spacing: .08em; fill: currentColor; }
@media (prefers-reduced-motion: no-preference) { .pz-pm { animation: pzStampIn .55s cubic-bezier(.2, .9, .3, 1.35) 1s both; } }
@keyframes pzStampIn { from { opacity: 0; transform: scale(1.7); } }
.pz-w { display: inline-block; overflow: hidden; vertical-align: top; padding-bottom: .12em; margin-bottom: -.12em; }
.pz-w > span { display: inline-block; }
@media (prefers-reduced-motion: no-preference) { .pz-w > span { animation: pzRise 1s var(--ease-out) both; animation-delay: calc(var(--k) * 90ms + 60ms); } }
@keyframes pzRise { from { transform: translateY(108%); } }
.pz-hero { position: relative; isolation: isolate; overflow: hidden; background: var(--paper-2); padding-block: clamp(18px, 3vw, 36px) clamp(44px, 6vw, 84px); }
.pz-hero__bg, .pz-rh__bg, .pz-dh__bg { position: absolute; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.pz-hero__air { position: absolute; left: 0; right: 0; bottom: 0; height: 9px; background: var(--pz-air); opacity: .85; }
.pz-hero__bg::before { content: ''; position: absolute; width: 60vw; height: 60vw; right: -18vw; top: -26vw; border-radius: 50%; background: radial-gradient(circle, color-mix(in oklab, var(--gold) 22%, transparent), transparent 65%); }
.pz-hero__in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(28px, 5vw, 76px); align-items: center; }
@media (max-width: 980px) { .pz-hero__in { grid-template-columns: minmax(0, 1fr); } }
.pz-hero__t { font-size: clamp(2.7rem, 7.2vw, 6rem); line-height: .95; letter-spacing: -.032em; margin: 0 0 .3em; max-width: 10ch; }
.pz-hero__t em { font-style: italic; font-weight: 400; color: var(--accent); }
.pz-hero__lead { font-size: clamp(1.05rem, 1.5vw, 1.25rem); line-height: 1.55; color: var(--ink-2); max-width: 54ch; margin: 0; }
.pz-search { display: flex; align-items: center; gap: 10px; max-width: 640px; margin-top: 26px; padding: 6px 6px 6px 18px; border-radius: 999px; background: var(--card);
border: 1px solid var(--line); box-shadow: var(--shadow); transition: border-color .2s, box-shadow .25s; }
.pz-search:focus-within { border-color: var(--accent); box-shadow: var(--shadow), 0 0 0 3px color-mix(in oklab, var(--accent) 22%, transparent); }
.pz-search > .i { color: var(--muted); }
.pz-search input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none; font-size: 1.05rem; padding: .72em 0; color: var(--ink); }
.pz-search input::placeholder { color: var(--muted); opacity: .85; }
@media (max-width: 480px) { .pz-search { padding-left: 14px; } .pz-search .btn { padding-inline: 1em; } .pz-search input { font-size: 1rem; } }
.pz-try { display: flex; flex-wrap: wrap; gap: 6px 8px; align-items: center; margin: 14px 0 0; font-size: .86rem; color: var(--muted); }
.pz-try span { margin-right: 2px; }
.pz-try a { padding: .3em .8em; border-radius: 999px; border: 1px dashed color-mix(in oklab, var(--ink) 25%, var(--line)); text-decoration: none; color: var(--ink-2); font-variant-numeric: tabular-nums; transition: border-color .2s, color .2s, background .2s; }
.pz-try a:hover { border-style: solid; border-color: var(--accent); color: var(--accent); background: var(--card); }
.pz-stats { display: flex; flex-wrap: wrap; gap: 14px clamp(22px, 3vw, 44px); margin: 30px 0 0; }
.pz-stats > div { display: flex; flex-direction: column-reverse; padding-left: 14px; border-left: 2px solid color-mix(in oklab, var(--accent) 55%, var(--line)); }
.pz-stats dd { margin: 0; font: 500 clamp(1.8rem, 3vw, 2.5rem)/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; }
.pz-stats dd small { font-size: .5em; color: var(--muted); margin-left: 2px; }
.pz-stats dt { margin-top: 6px; font-size: .8rem; color: var(--muted); }
.pz-env { position: relative; padding: clamp(6px, 2vw, 26px); }
.pz-env__card { position: relative; aspect-ratio: 16 / 10.4; padding: 10px; border-radius: 14px; background: var(--card); box-shadow: var(--shadow-lg); rotate: -2.5deg; }
.pz-env__card::before { content: ''; position: absolute; inset: 0; border-radius: inherit; background: var(--pz-air); opacity: .9; }
.pz-env__in { position: relative; height: 100%; border-radius: 6px; background: var(--card); overflow: hidden; }
.pz-env__in::before { content: ''; position: absolute; inset: 0; opacity: .5;
background: linear-gradient(160deg, transparent 49.6%, color-mix(in oklab, var(--line) 70%, transparent) 50%, transparent 50.4%), linear-gradient(20deg, transparent 49.6%, color-mix(in oklab, var(--line) 70%, transparent) 50%, transparent 50.4%); }
@media (prefers-reduced-motion: no-preference) { .pz-env__card { animation: pzFloat 8s ease-in-out infinite alternate; } }
@keyframes pzFloat { to { rotate: -1deg; translate: 0 -8px; } }
.pz-env__stamp { --r: 4px; position: absolute; right: 6%; top: 8%; width: 21%; aspect-ratio: 4 / 5; display: grid; place-items: center; align-content: center; gap: 4%; padding: 10px;
background: color-mix(in oklab, var(--accent-2) 16%, var(--card)); color: var(--accent-2); rotate: 4deg; outline: 1px solid color-mix(in oklab, var(--accent-2) 45%, transparent); outline-offset: -12px; }
.pz-env__sv .logo__m { width: clamp(26px, 4.4vw, 54px); height: auto; color: currentColor; }
.pz-env__sn { font: 600 clamp(.42rem, .8vw, .62rem)/1.15 var(--sans); letter-spacing: .14em; text-transform: uppercase; text-align: center; }
.pz-env .pz-pm { width: 52%; right: 13%; top: 7%; rotate: -9deg; }
.pz-env__to { position: absolute; right: 8%; top: 52%; width: 44%; display: grid; gap: 14px; }
.pz-env__to i { display: block; height: 3px; border-radius: 3px; background: color-mix(in oklab, var(--ink) 16%, transparent); }
@media (max-width: 560px) { .pz-env__to { gap: 9px; } .pz-env__to i { height: 2px; } }
.pz-env__to i:nth-child(1) { width: 62%; } .pz-env__to i:nth-child(3) { width: 84%; } .pz-env__to i:nth-child(4) { width: 48%; }
.pz-env__ix { position: absolute; left: 7%; bottom: 10%; width: 40%; color: var(--ink); }
.pz-env__ix.is-out .pz-st__d { opacity: 0; }
.pz-env__cap { display: block; margin-top: 8px; font: 600 clamp(.6rem, 1vw, .78rem)/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); transition: opacity .3s; }
.pz-env__ix.is-out .pz-env__cap { opacity: 0; }
@media (max-width: 980px) { .pz-env { max-width: 560px; } }
.pz-hero--q { padding-block: clamp(16px, 2.6vw, 30px) clamp(28px, 4vw, 44px); }
.pz-hero__tq { font-size: clamp(1.9rem, 4.4vw, 3.3rem); max-width: 26ch; margin: 0 0 .1em; overflow-wrap: anywhere; }
.pz-hero--q .pz-search { margin-top: 18px; }
.pz-results { padding-top: clamp(24px, 3.4vw, 40px); scroll-margin-top: calc(var(--hdr) + 12px); }
.pz-results__h { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 18px; margin-bottom: 16px; }
.pz-results__lead { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; margin: 0; color: var(--ink-2); }
.pz-results__in { display: inline-flex; align-items: center; gap: .4em; padding: .3em .8em; border-radius: 999px; background: var(--card); border: 1px solid var(--line); font-size: .86rem; font-weight: 600; }
.pz-results__in .i { color: var(--accent); }
.pz-res { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr)); gap: 10px; }
.pz-res__a { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; height: 100%; padding: 13px 16px; border: 1px solid var(--line); border-radius: 14px;
background: var(--card); text-decoration: none; transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.pz-res__a:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.pz-res__ix { font: 700 1.2rem/1 var(--sans); font-variant-numeric: tabular-nums; letter-spacing: .05em; padding: .5em .55em; border-radius: 10px;
background: color-mix(in oklab, var(--accent) 10%, transparent); color: var(--accent); }
.pz-res__a.is-hit .pz-res__ix { background: var(--accent); color: var(--accent-ink); }
.pz-res__b { display: grid; gap: 2px; min-width: 0; }
.pz-res__n { font-weight: 600; }
.pz-res__n small { color: var(--accent); font-weight: 600; font-size: .74rem; letter-spacing: .02em; }
.pz-res__ad { font-size: .88rem; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pz-res__w { font-size: .78rem; color: var(--muted); }
.pz-res__a > .i { color: var(--muted); transition: transform .25s var(--ease), color .2s; }
.pz-res__a:hover > .i { color: var(--accent); transform: translate(2px, -2px); }
.pz-regs { scroll-margin-top: var(--hdr); }
.pz-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 205px), 1fr)); gap: clamp(14px, 2vw, 22px); }
.pz-tile { --r: 5px; position: relative; display: grid; grid-template-rows: auto 1fr auto auto; gap: 3px; min-height: 200px; padding: calc(var(--r) * 2 + 14px) calc(var(--r) * 2 + 14px) calc(var(--r) * 2 + 12px);
text-decoration: none; color: var(--ink); background: color-mix(in oklab, var(--pz-tint) 11%, var(--card));
outline: 1px solid color-mix(in oklab, var(--pz-tint) 35%, transparent); outline-offset: calc(var(--r) * -2 - 4px);
transition: transform .45s var(--ease-out), background .3s; }
a.pz-tile:hover { color: var(--ink); background: color-mix(in oklab, var(--pz-tint) 19%, var(--card)); transform: translateY(-5px) rotate(-1.4deg); }
.pz-tile__pre { font: 500 clamp(2.9rem, 4.4vw, 3.6rem)/.9 var(--serif); letter-spacing: -.02em; color: var(--pz-tint); font-variant-numeric: lining-nums; }
.pz-tile__n { align-self: end; margin-top: 12px; font: 500 1.16rem/1.18 var(--serif); }
.pz-tile__c { font-size: .82rem; color: var(--ink-2); }
.pz-tile__r { margin-top: 8px; padding-top: 8px; border-top: 1px dashed color-mix(in oklab, var(--pz-tint) 40%, var(--line)); font: 600 .8rem/1 var(--sans); letter-spacing: .06em; font-variant-numeric: tabular-nums; color: var(--muted); }
@media (max-width: 560px) {
.pz-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.pz-tile { --r: 4px; min-height: 168px; padding: calc(var(--r) * 2 + 10px); outline-offset: calc(var(--r) * -2 - 3px); }
.pz-tile__pre { font-size: 2.4rem; }
.pz-tile__n { font-size: 1rem; }
.pz-tile__r { font-size: .72rem; letter-spacing: .02em; }
}
.pz-soon { display: flex; gap: .6em; align-items: flex-start; margin: 22px 0 0; padding: 14px 18px; border: 1px dashed var(--line); border-radius: var(--r); color: var(--muted); font-size: .9rem; }
.pz-soon .i { flex: none; margin-top: .2em; color: var(--gold); }
.pz-soon b { color: var(--ink-2); font-weight: 600; }
@media (prefers-reduced-motion: reduce) { a.pz-tile:hover { transform: none; } }
.pz-how__in { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: clamp(28px, 5vw, 80px); align-items: center; }
@media (max-width: 900px) { .pz-how__in { grid-template-columns: minmax(0, 1fr); } }
.pz-how__art { position: relative; padding: clamp(22px, 3.4vw, 40px) clamp(18px, 3vw, 36px) clamp(18px, 2.6vw, 30px); background: var(--card); border-radius: var(--r); border: 1px solid var(--line); box-shadow: var(--shadow); color: var(--ink); }
.pz-how__br { position: relative; height: 64px; margin-top: 12px; }
.pz-how__b { position: absolute; top: 0; display: grid; justify-items: center; gap: 2px; padding-top: 16px; font-size: .8rem; color: var(--muted); text-align: center; line-height: 1.25; }
.pz-how__b::before { content: ''; position: absolute; left: 0; right: 0; top: 0; height: 9px; border: 2px solid currentColor; border-top: 0; border-radius: 0 0 6px 6px; }
.pz-how__b b { font: 700 .95rem/1 var(--sans); letter-spacing: .08em; color: var(--ink); }
.pz-how__b--r { left: 2.1%; width: 27.7%; color: var(--accent); }
.pz-how__b--o { left: 36.2%; width: 61.7%; color: var(--accent-2); }
.pz-facts { list-style: none; margin: 0; padding: 0; display: grid; gap: 18px; counter-reset: f; }
.pz-facts li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 16px; align-items: start; }
.pz-facts__n { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; border: 1.5px solid var(--accent); color: var(--accent); font: 500 1.15rem/1 var(--serif); }
.pz-facts h3 { margin: .25em 0 .3em; font-size: 1.2rem; }
.pz-facts p { margin: 0; color: var(--ink-2); font-size: .96rem; }
.pz-rh, .pz-dh { position: relative; isolation: isolate; overflow: hidden; background: var(--paper-2); }
.pz-rh { padding-block: clamp(18px, 3vw, 34px) clamp(34px, 5vw, 58px); }
.pz-rh__bg::before, .pz-dh__bg::before { content: ''; position: absolute; width: 56vw; height: 56vw; right: -20vw; top: -30vw; border-radius: 50%; background: radial-gradient(circle, color-mix(in oklab, var(--pz-tint) 20%, transparent), transparent 65%); }
.pz-rh__in { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px 56px; align-items: center; }
.pz-rh__t { font-size: clamp(2.1rem, 5vw, 4rem); max-width: 18ch; margin-bottom: .3em; }
.pz-rh .lead { margin-bottom: 0; }
.pz-rh__stamp { --r: 6px; width: clamp(160px, 16vw, 214px); aspect-ratio: 4 / 5; display: grid; place-items: center; align-content: center; gap: 10px; padding: 30px 26px;
background: color-mix(in oklab, var(--pz-tint) 14%, var(--card)); color: var(--pz-tint); rotate: 4deg;
outline: 1px solid color-mix(in oklab, var(--pz-tint) 40%, transparent); outline-offset: -16px; }
.pz-rh__pre { font: 500 clamp(3.4rem, 6vw, 4.8rem)/.9 var(--serif); letter-spacing: -.02em; }
.pz-rh__rn { max-width: 100%; font: 600 .64rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; text-align: center; color: var(--ink-2); text-wrap: balance; }
.pz-rh__stamp .logo__m { width: 26px; height: 26px; color: currentColor; }
@media (prefers-reduced-motion: no-preference) { .pz-rh__stamp { animation: pzDrop .9s var(--ease-out) .15s both; } }
@keyframes pzDrop { from { opacity: 0; transform: translateY(-24px) rotate(-8deg) scale(1.08); } }
@media (max-width: 760px) { .pz-rh__in { grid-template-columns: minmax(0, 1fr); } .pz-rh__stamp { display: none; } }
.pz-rh__meta { display: flex; flex-wrap: wrap; gap: 14px clamp(22px, 3vw, 40px); margin: 26px 0 0; }
.pz-rh__meta > div { display: flex; flex-direction: column-reverse; padding-left: 12px; border-left: 2px solid color-mix(in oklab, var(--pz-tint) 60%, transparent); }
.pz-rh__meta dd { margin: 0; font: 500 clamp(1.35rem, 2.3vw, 1.9rem)/1.05 var(--serif); font-variant-numeric: lining-nums tabular-nums; }
.pz-rh__meta dd span { color: var(--muted); margin: 0 .08em; }
.pz-rh__meta dd.pz-rh__chk { font: 600 1rem/1.3 var(--sans); }
.pz-rh__meta dt { font-size: .78rem; color: var(--muted); margin-top: 6px; }
.pz-rh .pz-hero__air, .pz-dh .pz-hero__air { height: 6px; }
.pz-list { padding-top: clamp(20px, 3vw, 34px); }
.pz-bar { position: sticky; top: calc(var(--hdr) + 8px); z-index: 20; display: flex; align-items: center; gap: 8px 14px; padding: 7px 7px 7px 16px; margin-bottom: 14px;
border-radius: 18px; border: 1px solid var(--line); background: color-mix(in oklab, var(--card) 90%, transparent); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); box-shadow: var(--shadow); }
.pz-bar:focus-within { border-color: var(--accent); }
.pz-bar__f { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; }
.pz-bar__f > .i { color: var(--muted); }
.pz-bar__f input { flex: 1; min-width: 0; border: 0; background: transparent; outline: none; font-size: 1rem; padding: .62em 0; color: var(--ink); }
.pz-bar__n { font-size: .84rem; color: var(--muted); white-space: nowrap; font-variant-numeric: tabular-nums; }
@media (max-width: 560px) { .pz-bar__map span { display: none; } .pz-bar__map { padding: .55em .7em; } .pz-bar__n { font-size: .76rem; } }
@media (max-width: 400px) { .pz-bar__n { display: none; } }
.pz-jump { display: flex; flex-wrap: wrap; gap: 6px 8px; margin: 0 0 clamp(22px, 3.4vw, 36px); }
.pz-jump a { display: inline-flex; align-items: center; gap: .45em; padding: .42em .85em; border-radius: 999px; border: 1px solid var(--line); background: var(--card);
font-size: .86rem; font-weight: 500; text-decoration: none; white-space: nowrap; transition: border-color .2s, background .2s, color .2s; }
.pz-jump a small { color: var(--muted); font-variant-numeric: tabular-nums; font-weight: 600; }
.pz-jump a:hover { border-color: var(--pz-tint, var(--ink)); color: var(--ink); }
@media (max-width: 700px) {
.pz-jump:not(.pz-jump--wrap) { flex-wrap: nowrap; overflow-x: auto; margin-inline: calc(var(--gut) * -1); padding: 0 var(--gut) 4px; scrollbar-width: none; overscroll-behavior-x: contain; }
.pz-jump:not(.pz-jump--wrap)::-webkit-scrollbar { display: none; }
}
.pz-grp { margin-bottom: clamp(26px, 4vw, 46px); scroll-margin-top: calc(var(--hdr) + 86px); }
.pz-grp__h { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; padding-bottom: 10px; border-bottom: 2px solid var(--ink); }
.pz-grp__t { font-size: clamp(1.35rem, 2.3vw, 1.85rem); margin: 0; }
.pz-grp__n { color: var(--muted); font-size: .86rem; font-variant-numeric: tabular-nums; }
.pz-grp__more { margin-left: auto; display: inline-flex; align-items: center; gap: .3em; font-size: .84rem; font-weight: 600; text-decoration: none; color: var(--ink-2); }
.pz-grp__more .i { width: 1em; height: 1em; }
.pz-tbl { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: .95rem; }
.pz-c1 { width: 158px; } .pz-c2 { width: 23%; } .pz-c4 { width: 196px; }
@media (max-width: 1000px) { .pz-c2 { width: 26%; } .pz-c4 { width: 172px; } .pz-tbl { font-size: .9rem; } }
.pz-tbl th { text-align: left; font: 600 .68rem/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); padding: 11px 12px 8px; }
.pz-tbl td { padding: 7px 12px; border-top: 1px solid var(--line); vertical-align: middle; overflow-wrap: anywhere; }
.pz-tbl tbody tr { transition: background .15s; }
.pz-tbl tbody tr:hover { background: color-mix(in oklab, var(--paper-2) 75%, transparent); }
.pz-tbl td small { display: block; font-size: .74rem; font-weight: 600; color: var(--accent); }
.pz-tbl td:nth-child(3) { color: var(--ink-2); }
.pz-tbl td:nth-child(4) { white-space: nowrap; font-variant-numeric: tabular-nums; }
.pz-tbl td:nth-child(4) a { text-decoration: none; }
.pz-tbl td:nth-child(4) a:hover { text-decoration: underline; }
.pz-ix { white-space: nowrap; width: 1%; }
.pz-ix a { display: inline-block; font: 650 1.04rem/1 var(--sans); font-variant-numeric: tabular-nums; letter-spacing: .05em; padding: .34em .5em; border-radius: 8px; text-decoration: none;
color: var(--ink); background: color-mix(in oklab, var(--accent) 9%, transparent); transition: background .2s, color .2s; }
.pz-ix a:hover { background: var(--accent); color: var(--accent-ink); }
tr.is-main .pz-ix a { background: var(--pz-flap-bg); color: var(--pz-flap-fg); }
.pz-none { display: flex; align-items: center; gap: .6em; justify-content: center; padding: 40px 16px; color: var(--muted); }
.pz-none .i { width: 28px; height: 28px; color: var(--accent); }
@media (max-width: 700px) {
.pz-tbl thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.pz-tbl colgroup { display: none; }
.pz-tbl, .pz-tbl tbody { display: block; }
.pz-tbl tbody tr { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 3px 12px; padding: 12px 0; border-top: 1px solid var(--line); }
.pz-tbl tbody tr:first-child { border-top: 0; }
.pz-tbl tbody tr:hover { background: none; }
.pz-tbl td { display: block; padding: 0; border: 0; min-width: 0; }
.pz-tbl td.pz-ix { grid-row: span 3; width: auto; }
.pz-tbl td:nth-child(2) { font-weight: 600; }
.pz-tbl td:nth-child(3) { font-size: .9rem; overflow-wrap: anywhere; }
.pz-tbl td:nth-child(4) { font-size: .88rem; }
.pz-tbl td:empty { display: none; }
}
.pz-tag { display: inline-block; margin-left: .45em; padding: .22em .55em; border-radius: 999px; font: 600 .68rem/1.2 var(--sans); letter-spacing: .04em; text-transform: uppercase; vertical-align: .1em; white-space: nowrap;
background: var(--paper-2); color: var(--muted); border: 1px solid var(--line); }
.pz-tag--binosiz { background: color-mix(in oklab, var(--warn) 16%, transparent); color: var(--warn); border-color: color-mix(in oklab, var(--warn) 35%, transparent); }
.pz-tag--yopiq { background: color-mix(in oklab, var(--bad) 14%, transparent); color: var(--bad); border-color: color-mix(in oklab, var(--bad) 35%, transparent); }
.pz-tbl td .pz-tag { display: inline-block; margin: 2px 0 0; }
.pz-tbl td small + .pz-tag { margin-top: 3px; }
.pz-tbl tr.is-arch td { color: var(--muted); }
.pz-tbl tr.is-arch .pz-ix a { background: var(--paper-2); color: var(--muted); }
.pz-tbl tr.is-arch .pz-ix a:hover { background: var(--ink); color: var(--paper); }
.pz-tbl tr.is-off .pz-ix a { background: color-mix(in oklab, var(--bad) 10%, transparent); color: var(--bad); }
.pz-arch { margin-top: 10px; border: 1px dashed var(--line); border-radius: var(--r-sm); background: color-mix(in oklab, var(--paper-2) 60%, transparent); }
.pz-arch summary { display: flex; align-items: center; gap: .6em; padding: 11px 14px; cursor: pointer; list-style: none; font-size: .9rem; font-weight: 600; color: var(--ink-2); }
.pz-arch summary::-webkit-details-marker { display: none; }
.pz-arch summary .i { color: var(--muted); }
.pz-arch summary:hover { color: var(--ink); }
.pz-arch__chev { margin-left: auto; transition: transform .25s var(--ease); }
.pz-arch[open] .pz-arch__chev { transform: rotate(180deg); }
.pz-arch__lead { margin: 0; padding: 0 14px 10px; font-size: .86rem; color: var(--muted); max-width: 90ch; }
.pz-arch .pz-tw { border-top: 1px dashed var(--line); }
.pz-arch .pz-tbl thead { display: none; }
.pz-chip.is-arch { opacity: .7; }
.pz-chip.is-arch b { color: var(--muted); }
.pz-chip .pz-tag { margin-left: .4em; font-size: .6rem; padding: .15em .45em; }
.pz-dc.is-arch { opacity: .7; }
.pz-dc.is-arch .pz-dc__ix { color: var(--muted); }
.pz-res__n .pz-tag { font-size: .62rem; }
.pz-cp { display: inline-grid; place-items: center; width: 30px; height: 30px; margin-left: 4px; padding: 0; vertical-align: middle; border-radius: 8px;
border: 1px solid transparent; background: transparent; color: var(--muted); transition: color .2s, border-color .2s, background .2s; }
.pz-cp::before { content: ''; width: 15px; height: 15px; background: currentColor;
-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E") center / contain no-repeat;
mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect width='14' height='14' x='8' y='8' rx='2'/%3E%3Cpath d='M4 16c-1.1 0-2-.9-2-2V4c0-1.1.9-2 2-2h10c1.1 0 2 .9 2 2'/%3E%3C/svg%3E") center / contain no-repeat; }
.pz-cp:hover { color: var(--ink); border-color: var(--line); background: var(--card); }
.pz-cp.is-done { color: var(--ok); }
.pz-cp.is-done::before {
-webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E"); }
.pz-cp--txt { width: auto; height: auto; gap: .45em; grid-auto-flow: column; padding: .45em .85em; margin: 0; border-color: var(--line); border-radius: 999px; font: 600 .8rem/1 var(--sans); color: var(--ink-2); }
.pz-cp--txt::before { width: 13px; height: 13px; }
.pz-mapsec { scroll-margin-top: calc(var(--hdr) + 10px); }
.pz-map { position: relative; height: clamp(360px, 58vh, 580px); border-radius: var(--r); overflow: hidden; border: 1px solid var(--line); background: var(--paper-3); display: grid; place-items: center; }
.pz-map__ph { display: flex; align-items: center; gap: .5em; margin: 0; color: var(--muted); }
.pz-map .maplibregl-map { position: absolute; inset: 0; }
.pz-pop .maplibregl-popup-content { background: var(--card); color: var(--ink); border-radius: 12px; box-shadow: var(--shadow-lg); padding: 12px 34px 12px 14px; font: .88rem/1.4 var(--sans); }
.pz-pop .maplibregl-popup-tip { border-top-color: var(--card); border-bottom-color: var(--card); }
.pz-pop .maplibregl-popup-close-button { color: var(--muted); font-size: 18px; width: 28px; height: 28px; }
.pz-pop__c { display: grid; gap: 3px; }
.pz-pop__ix { justify-self: start; font: 700 1.1rem/1 var(--sans); letter-spacing: .05em; color: var(--accent); text-decoration: none; }
.pz-pop__ix:hover { text-decoration: underline; }
.pz-pop__c span { color: var(--ink-2); font-size: .84rem; }
.pz-others .pz-jump a small { color: var(--pz-tint); }
.pz-note { display: flex; gap: .55em; align-items: flex-start; max-width: 80ch; margin: 18px 0 0; font-size: .88rem; color: var(--muted); }
.pz-note .i { flex: none; margin-top: .2em; color: var(--accent-2); }
.pz-chk { display: flex; gap: .45em; align-items: center; margin: 10px 0 0; font-size: .88rem; font-weight: 500; color: var(--ok); }
.pz-chk:empty { display: none; }
.pz-dh { padding-block: clamp(18px, 3vw, 34px) clamp(36px, 5vw, 64px); }
.pz-dh__in { display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-areas: "cr cr" "main art"; gap: 0 64px; align-items: center; }
.pz-dh__cr { grid-area: cr; } .pz-dh__main { grid-area: main; } .pz-dh__art { grid-area: art; }
.pz-dh__cr .crumbs ol { margin-bottom: 12px; }
@media (max-width: 900px) { .pz-dh__in { grid-template-columns: minmax(0, 1fr); grid-template-areas: "cr" "art" "main"; row-gap: 8px; } .pz-dh__art { justify-self: start; } }
.pz-dh__t { font-size: clamp(1.9rem, 4.4vw, 3.5rem); max-width: 22ch; margin-bottom: .35em; }
.pz-dh__ad { display: flex; gap: .5em; align-items: flex-start; margin: 0; font-size: clamp(1.02rem, 1.4vw, 1.18rem); color: var(--ink-2); max-width: 60ch; }
.pz-dh__ad .i { color: var(--accent); margin-top: .22em; }
.pz-dh__cta { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.pz-dh__art { position: relative; padding: 8px 54px 40px 8px; }
.pz-dh .pz-pm { width: 210px; right: -40px; bottom: -6px; rotate: -12deg; }
@media (max-width: 480px) { .pz-dh__art { padding-right: 34px; } .pz-dh .pz-pm { width: 170px; right: -46px; } }
.pz-stamp { --r: 7px; position: relative; display: grid; justify-items: center; gap: 8px; padding: calc(var(--r) * 2 + 18px) calc(var(--r) * 2 + 20px); rotate: -2.5deg;
background: color-mix(in oklab, var(--pz-tint) 12%, var(--card)); outline: 1px solid color-mix(in oklab, var(--pz-tint) 40%, transparent); outline-offset: calc(var(--r) * -2 - 4px); }
@media (prefers-reduced-motion: no-preference) { .pz-stamp { animation: pzDrop .9s var(--ease-out) .1s both; } }
.pz-stamp__k { margin: 0; font: 600 .68rem/1 var(--sans); letter-spacing: .2em; text-transform: uppercase; color: var(--pz-tint); }
.pz-stamp__s { margin: 0; font: 500 1.25rem/1.15 var(--serif); text-align: center; max-width: 14ch; }
.pz-stamp__r { margin: 0; font: 600 .66rem/1.2 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); text-align: center; }
.pz-flap { display: flex; gap: .07em; margin: 4px 0 6px; font: 650 clamp(2.5rem, 6.2vw, 4.3rem)/1 var(--sans); font-variant-numeric: tabular-nums; perspective: 420px; }
.pz-flap b { position: relative; display: grid; place-items: center; width: .76em; height: 1.2em; border-radius: .11em; font-weight: 650; color: var(--pz-flap-fg);
background: linear-gradient(180deg, color-mix(in oklab, var(--pz-flap-fg) 12%, var(--pz-flap-bg)) 0 50%, var(--pz-flap-bg) 50% 100%);
box-shadow: 0 2px 0 color-mix(in oklab, var(--pz-flap-bg) 70%, transparent), inset 0 1px 0 color-mix(in oklab, var(--pz-flap-fg) 10%, transparent); }
.pz-flap b::after { content: ''; position: absolute; left: 0; right: 0; top: 50%; height: 1px; background: color-mix(in oklab, var(--pz-flap-bg) 55%, var(--pz-flap-fg) 6%); }
@media (prefers-reduced-motion: no-preference) { .pz-flap b { animation: pzFlip .7s var(--ease-out) both; animation-delay: calc(var(--i) * 85ms + .2s); } }
@keyframes pzFlip { 0% { transform: rotateX(-95deg); opacity: 0; } 60% { transform: rotateX(14deg); opacity: 1; } 100% { transform: none; } }
.pz-card { margin-bottom: 20px; padding: clamp(18px, 2.4vw, 26px); border: 1px solid var(--line); border-radius: var(--r); background: var(--card); }
.pz-card__t { display: flex; align-items: center; gap: .5em; margin: 0 0 12px; font-size: clamp(1.2rem, 1.9vw, 1.45rem); }
.pz-card__t .i { color: var(--accent); }
.pz-addr__l { list-style: none; margin: 0; padding: 0; display: grid; }
.pz-addr__l li { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 14px; align-items: center; padding: 12px 0; border-top: 1px dashed var(--line); }
.pz-addr__l li:first-child { border-top: 0; padding-top: 2px; }
.pz-addr__l p { margin: 0; overflow-wrap: anywhere; }
.pz-addr__l li:first-child p { font: 500 1.22rem/1.35 var(--serif); }
.pz-addr__lg { font: 700 .66rem/1 var(--sans); letter-spacing: .1em; padding: .5em .55em; border-radius: 6px; background: var(--paper-2); color: var(--muted); }
.pz-info dl { margin: 0; display: grid; }
.pz-info dl > div { display: grid; grid-template-columns: 36% minmax(0, 1fr); gap: 12px; padding: .7em 0; border-top: 1px dashed var(--line); }
.pz-info dl > div:first-child { border-top: 0; padding-top: 2px; }
.pz-info dt { color: var(--muted); }
.pz-info dd { margin: 0; font-weight: 500; overflow-wrap: anywhere; }
.pz-info__ix { font: 700 1.12rem/1 var(--sans); letter-spacing: .06em; font-variant-numeric: tabular-nums; }
@media (max-width: 520px) {
.pz-info dl > div { grid-template-columns: minmax(92px, 34%) minmax(0, 1fr); gap: 10px; }
.pz-addr__l li { gap: 10px; }
.pz-addr__l .pz-cp--txt { width: 34px; height: 34px; padding: 0; justify-content: center; }
.pz-addr__l .pz-cp--txt span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
.pz-addr__l li:first-child p { font-size: 1.12rem; }
}
@media (max-width: 340px) { .pz-info dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; } }
.pz-pn { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 4px 0 8px; }
.pz-pn__a { display: flex; align-items: center; gap: 12px; padding: 13px 16px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); text-decoration: none; min-width: 0;
transition: border-color .2s, transform .25s var(--ease); }
.pz-pn__a:hover { border-color: var(--accent); transform: translateY(-2px); color: inherit; }
.pz-pn__a span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pz-pn__a small { display: block; font-size: .7rem; font-weight: 600; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); }
.pz-pn__a b { font-variant-numeric: tabular-nums; letter-spacing: .03em; }
.pz-pn__a--next { justify-content: flex-end; text-align: right; grid-column: 2; }
.pz-pn__a .i { flex: none; color: var(--accent); }
@media (max-width: 460px) { .pz-pn { grid-template-columns: 1fr; } .pz-pn__a--next { grid-column: auto; } .pz-pn > span:empty { display: none; } }
.pz-nomap { display: grid; place-items: center; gap: 6px; padding: 34px 20px; text-align: center; border: 1px dashed var(--line); border-radius: var(--r); color: var(--muted); background: var(--card); }
.pz-nomap .i { width: 30px; height: 30px; color: var(--accent); }
.pz-nomap p { margin: 0; font-size: .9rem; }
.pz-notice { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 20px; padding: 16px 18px; border-radius: var(--r); border: 1px solid var(--line); border-left: 4px solid var(--muted); background: var(--card); }
.pz-notice > .i { flex: none; width: 22px; height: 22px; margin-top: 2px; color: var(--muted); }
.pz-notice b { display: block; font: 600 .74rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--muted); margin-bottom: 4px; }
.pz-notice p { margin: 0; color: var(--ink-2); font-size: .95rem; }
.pz-notice--binosiz { border-left-color: var(--warn); } .pz-notice--binosiz > .i, .pz-notice--binosiz b { color: var(--warn); }
.pz-notice--yopiq { border-left-color: var(--bad); } .pz-notice--yopiq > .i, .pz-notice--yopiq b { color: var(--bad); }
.pz-notice--arxiv { border-left-color: var(--gold); } .pz-notice--arxiv > .i, .pz-notice--arxiv b { color: var(--gold); }
.pz-info__cc { display: flex; gap: .5em; align-items: flex-start; margin: 14px 0 0; padding-top: 12px; border-top: 1px dashed var(--line); font-size: .86rem; color: var(--muted); }
.pz-info__cc .i { flex: none; margin-top: .2em; color: var(--accent-2); }
.pz-dh__cta .btn small { font-size: .72em; font-weight: 500; opacity: .75; }
.pz-sv__lead { margin: -4px 0 12px; font-size: .9rem; color: var(--muted); }
.pz-sv__l { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pz-sv__it { display: inline-flex; align-items: center; gap: .5em; padding: .5em .9em; border-radius: 999px; border: 1px solid var(--line); background: var(--paper-2); font-size: .88rem; font-weight: 500; }
.pz-sv__it .i { color: var(--accent-2); }
.pz-sv__it--ems { border-color: color-mix(in oklab, var(--accent) 40%, transparent); background: color-mix(in oklab, var(--accent) 9%, transparent); }
.pz-sv__it--ems .i { color: var(--accent); }
.pz-chips { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: 10px; }
.pz-chip { display: flex; align-items: center; gap: 12px; height: 100%; padding: 11px 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--card); text-decoration: none;
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.pz-chip:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.pz-chip b { font: 700 1.02rem/1 var(--sans); font-variant-numeric: tabular-nums; letter-spacing: .05em; color: var(--accent); }
.pz-chip.is-main b { padding: .25em .4em; margin: -.25em 0; border-radius: 6px; background: var(--pz-flap-bg); color: var(--pz-flap-fg); }
.pz-chip span { min-width: 0; font-size: .9rem; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 560px) { .pz-chips { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; } .pz-chip { gap: 8px; padding: 10px 11px; } .pz-chip b { font-size: .95rem; } .pz-chip span { font-size: .84rem; } }
.pz-dcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); gap: 12px; }
.pz-dc { --h: 20; position: relative; overflow: hidden; display: grid; gap: 3px; padding: 18px 18px 15px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); text-decoration: none;
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.pz-dc::before { content: ''; position: absolute; inset: 0 0 auto; height: 4px; background: var(--pz-air); opacity: .8; }
.pz-dc:hover { border-color: var(--accent); transform: translateY(-3px); box-shadow: var(--shadow); color: inherit; }
.pz-dc__ix { font: 500 1.75rem/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; letter-spacing: .01em; color: var(--accent); }
.pz-dc__n { margin-top: 6px; font-weight: 600; line-height: 1.25; }
.pz-dc__c { font-size: .8rem; color: var(--muted); }
.pz-toast { position: fixed; left: 50%; bottom: max(20px, env(safe-area-inset-bottom)); z-index: 120; max-width: calc(100vw - 32px); padding: .7em 1.15em; border-radius: 999px;
background: var(--ink); color: var(--paper); font-size: .9rem; font-weight: 600; box-shadow: var(--shadow-lg); pointer-events: none;
opacity: 0; transform: translate(-50%, 14px); transition: opacity .25s, transform .3s var(--ease-out); }
.pz-toast.is-on { opacity: 1; transform: translate(-50%, 0); }
@media (prefers-reduced-motion: reduce) {
.pz-env__card, .pz-stamp, .pz-rh__stamp, .pz-pm, .pz-flap b, .pz-w > span { animation: none !important; }
.pz-tile, .pz-chip, .pz-dc, .pz-res__a, .pz-pn__a { transition: none; }
}
:root { --wx-best: #2f8f5b; --wx-okRain: #3f9a8a; --wx-warm: #d59a2c; --wx-hot: #c9552f; --wx-cool: #6b8fb5; --wx-cold: #5d6fb0; --wx-na: var(--line);
--wx-sky-1: #cfe6f7; --wx-sky-2: #f6f1e8; --wx-sun: #e9b949; --wx-cloud: rgb(255 255 255 / .85); }
:root[data-theme="dark"] { --wx-best: #4fb97f; --wx-okRain: #5cc0ad; --wx-warm: #e0b35a; --wx-hot: #e2805f; --wx-cool: #86a9cf; --wx-cold: #8b9ad6;
--wx-sky-1: #1b2a3c; --wx-sky-2: #141311; --wx-sun: #f0c25a; --wx-cloud: rgb(255 255 255 / .12); }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] { --wx-best: #4fb97f; --wx-okRain: #5cc0ad; --wx-warm: #e0b35a; --wx-hot: #e2805f; --wx-cool: #86a9cf; --wx-cold: #8b9ad6;
--wx-sky-1: #1b2a3c; --wx-sky-2: #141311; --wx-sun: #f0c25a; --wx-cloud: rgb(255 255 255 / .12); } }
.wxi { width: 1.5em; height: 1.5em; flex: none; display: inline-block; vertical-align: middle; overflow: visible; }
.wxi--xs { width: 20px; height: 20px; }
.wxi--sm { width: 26px; height: 26px; }
.wxi--md { width: 34px; height: 34px; }
.wxi--lg { width: 60px; height: 60px; stroke-width: 1.5; }
.wxi--xl { width: clamp(84px, 10vw, 120px); height: clamp(84px, 10vw, 120px); stroke-width: 1.35; }
.wxi__sun { color: var(--wx-sun); }
.wxi__rays { color: var(--wx-sun); transform-box: fill-box; transform-origin: center; }
.wxi__moon { color: var(--gold); }
.wxi__back { opacity: .9; }
.wxi__cloud { color: currentColor; }
.wxi__drops, .wxi__fog { color: var(--accent-2); }
.wxi__flakes { color: var(--accent-2); stroke-width: 2.2; }
.wxi__bolt { color: var(--wx-warm); fill: color-mix(in oklab, var(--wx-warm) 25%, transparent); }
.wxi--cloud .wxi__back { opacity: .55; }
.wxi--fog .wxi__fog { opacity: .8; }
@media (prefers-reduced-motion: no-preference) {
.wxi--lg .wxi__rays, .wxi--xl .wxi__rays, .wxi--md .wxi__rays { animation: wxSpin 28s linear infinite; }
.wxi--lg .wxi__rays--q, .wxi--xl .wxi__rays--q, .wxi--md .wxi__rays--q { animation: wxPulse 3.2s ease-in-out infinite; }
.wxi--lg .wxi__drops path, .wxi--xl .wxi__drops path, .wxi--md .wxi__drops path { animation: wxDrop 1.5s ease-in infinite; }
.wxi--lg .wxi__flakes path, .wxi--xl .wxi__flakes path, .wxi--md .wxi__flakes path { animation: wxFlake 2.6s ease-in-out infinite; }
.wxi--lg .wxi__fog path, .wxi--xl .wxi__fog path { animation: wxFog 4s ease-in-out infinite alternate; }
.wxi--lg .wxi__bolt, .wxi--xl .wxi__bolt { animation: wxBolt 2.8s ease-in-out infinite; }
.wxi--xl .wxi__cloud, .wxi--lg .wxi__cloud { animation: wxFloat 5s ease-in-out infinite; }
.wxi__drops path:nth-child(2), .wxi__flakes path:nth-child(2), .wxi__flakes path:nth-child(5) { animation-delay: .5s !important; }
.wxi__drops path:nth-child(3), .wxi__flakes path:nth-child(3), .wxi__flakes path:nth-child(6) { animation-delay: 1s !important; }
.wxi__drops path:nth-child(4), .wxi__flakes path:nth-child(4) { animation-delay: .25s !important; }
.wxi__fog path:nth-child(2) { animation-delay: -2s !important; }
}
@keyframes wxSpin { to { transform: rotate(360deg); } }
@keyframes wxPulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }
@keyframes wxDrop { 0% { transform: translateY(-1.5px); opacity: 0; } 25% { opacity: 1; } 80% { opacity: 1; } 100% { transform: translateY(2.5px); opacity: 0; } }
@keyframes wxFlake { 0% { transform: translate(0, -1px); opacity: .2; } 50% { transform: translate(.6px, .8px); opacity: 1; } 100% { transform: translate(0, 2px); opacity: .2; } }
@keyframes wxFog { from { transform: translateX(-1.2px); } to { transform: translateX(1.2px); } }
@keyframes wxBolt { 0%, 60%, 100% { opacity: 1; } 62% { opacity: .2; } 66% { opacity: 1; } 70% { opacity: .3; } 74% { opacity: 1; } }
@keyframes wxFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-.6px); } }
.wx-arr { width: 14px; height: 14px; transform: rotate(var(--deg, 0deg)); color: var(--muted); flex: none; }
.wx-t { font: 500 1em/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; letter-spacing: -.03em; }
.wx-t i { font: 400 .5em/1 var(--sans); font-style: normal; opacity: .7; vertical-align: top; margin: .12em 0 0 .06em; display: inline-block; }
.wx-attr { color: inherit; text-decoration: none; }
.wx-attr:hover { color: var(--accent); }
.wx-attr-line { font-size: .78rem; margin: 14px 0 0; }
.wx-stale { display: inline-flex; align-items: center; gap: .4em; margin: 0; padding: .4em .8em; border-radius: 999px; font-size: .8rem; background: color-mix(in oklab, var(--warn) 16%, transparent); color: var(--warn); }
.wx-h3 { display: flex; align-items: baseline; gap: .5em; font-size: clamp(1.25rem, 1.8vw, 1.5rem); margin: 34px 0 14px; }
.wx-h3 .i { color: var(--accent); align-self: center; }
.wx-h3 small { font: 400 .85rem/1.2 var(--sans); color: var(--muted); }
.wx-sky { position: relative; isolation: isolate; overflow: hidden; background: linear-gradient(180deg, var(--wx-sky-1), var(--wx-sky-2) 92%); border-bottom: 1px solid var(--line); }
.wx-sky__art { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.wx-sky__sun { position: absolute; right: clamp(6%, 12vw, 18%); top: 14%; width: clamp(90px, 12vw, 170px); aspect-ratio: 1; border-radius: 50%;
background: radial-gradient(circle, var(--wx-sun) 0 55%, color-mix(in oklab, var(--wx-sun) 60%, transparent) 56% 62%, transparent 63%);
box-shadow: 0 0 80px 30px color-mix(in oklab, var(--wx-sun) 30%, transparent); opacity: .9; }
.wx-sky--night .wx-sky__sun { background: radial-gradient(circle at 60% 40%, var(--paper) 0 50%, transparent 52%); box-shadow: 0 0 60px 18px color-mix(in oklab, var(--paper) 25%, transparent); opacity: .85;
-webkit-mask: radial-gradient(circle at 38% 38%, transparent 0 40%, #000 42%); mask: radial-gradient(circle at 38% 38%, transparent 0 40%, #000 42%); }
.wx-sky__c { position: absolute; height: 34px; width: 120px; border-radius: 999px; background: var(--wx-cloud); filter: blur(.3px);
box-shadow: 30px -16px 0 -4px var(--wx-cloud), -28px -10px 0 -8px var(--wx-cloud), 0 0 30px color-mix(in oklab, var(--wx-cloud) 50%, transparent); }
.wx-sky__c--1 { right: 2%; top: 26%; transform: scale(1.3); }
.wx-sky__c--2 { right: 26%; top: 48%; transform: scale(.9); opacity: .8; }
.wx-sky__c--3 { right: 14%; top: 10%; transform: scale(.65); opacity: .7; }
@media (prefers-reduced-motion: no-preference) {
.wx-sky__c--1 { animation: wxCloud 46s linear infinite; } .wx-sky__c--2 { animation: wxCloud 64s linear infinite reverse; } .wx-sky__c--3 { animation: wxCloud 80s linear infinite; }
.wx-sky__sun { animation: wxGlow 6s ease-in-out infinite alternate; }
}
@keyframes wxCloud { 0% { translate: 0 0; } 50% { translate: -60px 6px; } 100% { translate: 0 0; } }
@keyframes wxGlow { from { filter: brightness(1); } to { filter: brightness(1.12); } }
.phead--wx .phead__t { max-width: 22ch; }
.phead--wx .phead__meta { gap: 10px 20px; }
@media (max-width: 700px) { .wx-sky__sun { right: -6%; top: 6%; opacity: .55; } .wx-sky__c { opacity: .5; } }
.wx-grid { display: grid; gap: clamp(14px, 2vw, 22px); grid-template-columns: repeat(auto-fill, minmax(min(100%, 290px), 1fr)); }
.wxc { position: relative; border-radius: 22px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); overflow: hidden; transition: transform .45s var(--ease-out), box-shadow .45s, border-color .3s; }
.wxc:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg); border-color: color-mix(in oklab, var(--accent-2) 40%, var(--line)); }
.wxc--resort { background: linear-gradient(160deg, color-mix(in oklab, var(--accent-2) 8%, var(--card)), var(--card) 60%); }
.wxc__a { display: flex; flex-direction: column; height: 100%; padding: 18px 18px 14px; text-decoration: none; color: inherit; }
.wxc__a:hover { color: inherit; }
.wxc__k { margin: 0 0 .3em; font: 600 .7rem/1.3 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.wxc__n { font-size: clamp(1.3rem, 1.7vw, 1.5rem); margin: 0; transition: color .2s; }
.wxc__a:hover .wxc__n { color: var(--accent); }
.wxc__now { display: grid; grid-template-columns: auto 1fr; grid-template-areas: "i t" "i d" "m m"; column-gap: 14px; align-items: center; margin: 12px 0 10px; }
.wxc__now .wxi { grid-area: i; }
.wxc__t { grid-area: t; margin: 0; font-size: clamp(2.6rem, 3.6vw, 3.3rem); line-height: 1; }
.wxc__d { grid-area: d; margin: 2px 0 0; font-size: .92rem; color: var(--ink-2); }
.wxc__d::first-letter { text-transform: uppercase; }
.wxc__m { grid-area: m; list-style: none; display: flex; flex-wrap: wrap; gap: 6px 16px; margin: 10px 0 0; padding: 0; font-size: .86rem; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.wxc__m li { display: inline-flex; align-items: center; gap: .35em; }
.wxc__m .i { width: 15px; height: 15px; color: var(--accent-2); }
.wxc__m small { color: var(--muted); }
.wxc__none { margin: 16px 0; font-size: .9rem; }
.wxc .wxd { margin-top: auto; }
.wxd { list-style: none; margin: 10px 0 0; padding: 10px 0 0; display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; border-top: 1px dashed var(--line); }
.wxd__it { display: grid; justify-items: center; gap: 3px; font-size: .74rem; line-height: 1.1; padding: 4px 0; border-radius: 10px; font-variant-numeric: tabular-nums; }
.wxd__it:first-child { background: color-mix(in oklab, var(--accent-2) 10%, transparent); }
.wxd__d { color: var(--muted); font-weight: 600; text-transform: capitalize; }
.wxd__hi { font-weight: 600; }
.wxd__lo { color: var(--muted); }
.wxb .wxd { grid-template-columns: repeat(5, 1fr); }
.wx-mx-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); -webkit-overflow-scrolling: touch; }
.wx-mx { width: 100%; min-width: 720px; border-collapse: separate; border-spacing: 0; font-size: .86rem; font-variant-numeric: tabular-nums; }
.wx-mx th { font: 600 .7rem/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); padding: 10px 8px; border-bottom: 1px solid var(--line); text-align: center; }
.wx-mx th.is-now { color: var(--accent); }
.wx-mx abbr { text-decoration: none; }
.wx-mx tbody th { text-align: left; text-transform: none; letter-spacing: 0; font: 500 .95rem/1.25 var(--sans); color: var(--ink); padding: 8px 14px; border-bottom: 1px solid var(--line); position: sticky; left: 0; background: var(--card); min-width: 150px; }
.wx-mx tbody th a { text-decoration: none; }
.wx-mx tbody th a:hover { color: var(--accent); text-decoration: underline; }
.wx-mx tbody th small { display: block; font-size: .72rem; color: var(--muted); }
.wx-mx__c { text-align: center; padding: 0; border-bottom: 1px solid var(--line); color: #fff; font-weight: 600; }
.wx-mx__c span, .wx-mx__c { line-height: 44px; }
.wx-mx__c--best { background: var(--wx-best); } .wx-mx__c--okRain { background: var(--wx-okRain); background-image: repeating-linear-gradient(135deg, transparent 0 6px, rgb(255 255 255 / .18) 6px 8px); }
.wx-mx__c--warm { background: var(--wx-warm); } .wx-mx__c--hot { background: var(--wx-hot); } .wx-mx__c--cool { background: var(--wx-cool); } .wx-mx__c--cold { background: var(--wx-cold); } .wx-mx__c--na { background: var(--wx-na); color: var(--muted); }
.wx-mx__c.is-now { box-shadow: inset 0 0 0 2px var(--ink); }
.wx-mx__f { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 10px 32px; margin-top: 16px; }
.wx-mx__f p { max-width: 70ch; font-size: .85rem; margin: 0; }
.wx-leg { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: .78rem; color: var(--ink-2); }
.wx-leg li { display: inline-flex; align-items: center; gap: .4em; }
.wxm__sw { width: 12px; height: 12px; border-radius: 3px; display: inline-block; }
.wxm__sw--best { background: var(--wx-best); } .wxm__sw--okRain { background: var(--wx-okRain); background-image: repeating-linear-gradient(135deg, transparent 0 3px, rgb(255 255 255 / .25) 3px 4px); }
.wxm__sw--warm { background: var(--wx-warm); } .wxm__sw--hot { background: var(--wx-hot); } .wxm__sw--cool { background: var(--wx-cool); } .wxm__sw--cold { background: var(--wx-cold); }
.wxm { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(12, 1fr); gap: 3px; }
.wxm__c { display: grid; justify-items: center; gap: 2px; padding: 7px 0 6px; border-radius: 8px; color: #fff; font-size: .72rem; line-height: 1; font-variant-numeric: tabular-nums; transition: transform .25s var(--ease); }
.wxm__c:hover { transform: translateY(-2px); }
.wxm__c--best { background: var(--wx-best); } .wxm__c--okRain { background: var(--wx-okRain); background-image: repeating-linear-gradient(135deg, transparent 0 5px, rgb(255 255 255 / .18) 5px 7px); }
.wxm__c--warm { background: var(--wx-warm); } .wxm__c--hot { background: var(--wx-hot); } .wxm__c--cool { background: var(--wx-cool); } .wxm__c--cold { background: var(--wx-cold); } .wxm__c--na { background: var(--wx-na); color: var(--muted); }
.wxm__c.is-now { box-shadow: 0 0 0 2px var(--card), 0 0 0 4px var(--ink); }
.wxm__m { font-weight: 600; opacity: .9; }
.wxm__t { font-size: .68rem; opacity: .9; }
.wxm--mini .wxm__c { padding: 5px 0; font-size: .62rem; border-radius: 5px; }
.wx-fc { padding-top: 10px; }
.wx-tabs { gap: 6px; border-bottom: 0; margin-bottom: 18px; }
.wx-tabs button { display: inline-flex; align-items: center; gap: .45em; padding: .55em 1em; border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--ink-2); font-size: .9rem; margin: 0; cursor: pointer; transition: background .2s, border-color .2s, color .2s; }
.wx-tabs button b { font-weight: 600; color: var(--ink); }
.wx-tabs button:hover { border-color: var(--accent); }
.wx-tabs button[aria-selected="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.wx-tabs button[aria-selected="true"] b { color: inherit; }
.js .wx-pane:not(.is-on) { display: none; }
.wx-pane + .wx-pane { margin-top: 40px; }
.wx-pane__h { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 24px; margin-bottom: 14px; }
.wx-pane__h .kicker { margin-bottom: .5em; }
.wx-pane__h .kicker a { color: inherit; }
.wx-pane__t { margin: 0; font-size: clamp(1.9rem, 3.4vw, 2.8rem); }
.wx-now { display: flex; align-items: center; gap: clamp(14px, 2.5vw, 28px); padding: 18px 22px; border-radius: 22px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.wx-now--big { padding: clamp(18px, 3vw, 32px) clamp(20px, 3.5vw, 40px); background: linear-gradient(135deg, color-mix(in oklab, var(--accent-2) 9%, var(--card)), var(--card) 55%, color-mix(in oklab, var(--gold) 10%, var(--card))); }
.wx-now--empty { padding: 20px; }
.wx-now--empty p { margin: 0; }
.wx-now__b { min-width: 0; flex: 1; }
.wx-now__t { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 18px; margin: 0; font-size: clamp(2.4rem, 5vw, 4.6rem); line-height: 1; }
.wx-now--big .wx-now__t { font-size: clamp(3rem, 6.5vw, 5.6rem); }
.wx-now__d { font: 400 clamp(1rem, 1.5vw, 1.25rem)/1.3 var(--sans); color: var(--ink-2); }
.wx-now__d::first-letter { text-transform: uppercase; }
.wx-now__m { list-style: none; margin: 12px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: .92rem; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.wx-now__m li { display: inline-flex; align-items: center; gap: .4em; }
.wx-now__m .i { width: 17px; height: 17px; color: var(--accent-2); }
.wx-now__m small { color: var(--muted); }
.wxb .wx-now { padding: 12px 14px; gap: 14px; border-radius: 16px; box-shadow: none; }
.wxb .wx-now__t { font-size: 2.2rem; }
.wxb .wx-now__m { margin-top: 6px; font-size: .84rem; gap: 6px 14px; }
.wx-hours { overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; padding-bottom: 6px; margin-inline: calc(var(--gut) * -1); padding-inline: var(--gut); }
.wxh { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; min-width: max-content; }
.wxh__it { position: relative; display: grid; justify-items: center; gap: 4px; width: 68px; padding: 10px 6px 8px; border-radius: 14px; border: 1px solid var(--line); background: var(--card); font-size: .78rem; font-variant-numeric: tabular-nums; }
.wxh__it::before { content: ''; position: absolute; left: 10px; right: 10px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: color-mix(in oklab, var(--wx-hot) calc(var(--p, .5) * 100%), var(--wx-cool)); opacity: .7; }
.wxh__it.is-now { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.wxh__it.is-now .wxi__cloud { color: var(--paper); }
.wxh__h { color: var(--muted); font-weight: 600; }
.wxh__it.is-now .wxh__h { color: color-mix(in oklab, var(--paper) 75%, transparent); }
.wxh__t { font: 600 1.05rem/1 var(--sans); }
.wxh__p { font-size: .68rem; color: var(--accent-2); white-space: nowrap; }
.wxh__p.is-0 { visibility: hidden; }
.wx-days { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.wxday { display: grid; grid-template-columns: 110px minmax(0, 1.3fr) minmax(0, 1fr) minmax(220px, 1.4fr); align-items: center; gap: 12px 18px; padding: 10px 16px; border-radius: 14px; border: 1px solid var(--line); background: var(--card); transition: border-color .25s, transform .3s var(--ease); }
.wxday:hover { border-color: color-mix(in oklab, var(--accent-2) 45%, var(--line)); transform: translateX(3px); }
.wxday:first-child { background: color-mix(in oklab, var(--accent-2) 7%, var(--card)); }
.wxday__n { display: grid; line-height: 1.2; }
.wxday__n b { font-weight: 600; text-transform: capitalize; }
.wxday__n small { color: var(--muted); font-size: .78rem; }
.wxday__s { display: flex; align-items: center; gap: 10px; min-width: 0; font-size: .92rem; color: var(--ink-2); }
.wxday__s span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wxday__s span::first-letter { text-transform: uppercase; }
.wxday__x { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .82rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.wxday__x span { display: inline-flex; align-items: center; gap: .3em; white-space: nowrap; }
.wxday__x .i { width: 14px; height: 14px; color: var(--accent-2); }
.wxday__r { display: grid; grid-template-columns: 3.2em 1fr 3.2em; align-items: center; gap: 10px; font-variant-numeric: tabular-nums; }
.wxday__lo { text-align: right; color: var(--muted); }
.wxday__hi { font-weight: 600; }
.wxday__bar { position: relative; height: 8px; border-radius: 999px; background: var(--paper-2); overflow: hidden; }
.wxday__bar i { position: absolute; top: 0; bottom: 0; left: var(--l, 0); width: var(--w, 50%); border-radius: inherit; background: linear-gradient(90deg, var(--wx-cool), var(--wx-warm), var(--wx-hot)); background-size: 300% 100%; background-position: calc(var(--l, 0%) * 1) 0; transform-origin: left; }
@media (prefers-reduced-motion: no-preference) { .js .wxday[data-reveal] .wxday__bar i { transform: scaleX(0); transition: transform .9s var(--ease-out) calc(var(--d, 0s) + .2s); } .js .wxday.is-in .wxday__bar i { transform: none; } }
@media (max-width: 860px) { .wxday { grid-template-columns: 90px minmax(0, 1fr); grid-template-areas: "n s" "r r" "x x"; gap: 8px 12px; } .wxday__n { grid-area: n; } .wxday__s { grid-area: s; } .wxday__r { grid-area: r; } .wxday__x { grid-area: x; } .wxday__x:empty { display: none; } }
.wx-clim__g { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(300px, 1fr); gap: clamp(18px, 3vw, 40px); align-items: start; }
@media (max-width: 960px) { .wx-clim__g { grid-template-columns: minmax(0, 1fr); } }
.wx-chart { margin: 0; padding: 16px 12px 10px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.wx-ch { width: 100%; height: auto; display: block; font-family: var(--sans); }
.wx-ch__ok { fill: color-mix(in oklab, var(--wx-best) 13%, transparent); }
.wx-ch__grid { stroke: var(--line); stroke-width: 1; }
.wx-ch__grid--0 { stroke: var(--muted); stroke-dasharray: 3 3; }
.wx-ch__ax { font-size: 11px; fill: var(--muted); }
.wx-ch__ax--p { fill: var(--accent-2); }
.wx-ch__bar { fill: color-mix(in oklab, var(--accent-2) 55%, transparent); transform-box: fill-box; transform-origin: bottom; }
.wx-ch__band { fill: color-mix(in oklab, var(--wx-warm) 14%, transparent); }
.wx-ch__line { fill: none; stroke-width: 2.4; stroke-linejoin: round; stroke-linecap: round; }
.wx-ch__hi { stroke: var(--wx-hot); }
.wx-ch__lo { stroke: var(--wx-cool); }
.wx-ch__dot--hi { fill: var(--wx-hot); stroke: var(--card); stroke-width: 1.5; }
.wx-ch__dot--lo { fill: var(--wx-cool); stroke: var(--card); stroke-width: 1.5; }
.wx-ch__now { fill: color-mix(in oklab, var(--ink) 6%, transparent); }
.wx-ch__m { font-size: 11.5px; fill: var(--ink-2); }
.wx-ch__m.is-now { fill: var(--accent); font-weight: 700; }
@media (prefers-reduced-motion: no-preference) {
.js [data-reveal] .wx-ch__line { stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset 1.6s var(--ease-out) .2s; }
.js [data-reveal].is-in .wx-ch__line { stroke-dashoffset: 0; }
.js [data-reveal] .wx-ch__bar { transform: scaleY(0); transition: transform .8s var(--ease-out) calc(var(--i, 0) * 45ms); }
.js [data-reveal].is-in .wx-ch__bar { transform: none; }
.js [data-reveal] .wx-ch__dot { opacity: 0; transition: opacity .4s 1.2s; }
.js [data-reveal].is-in .wx-ch__dot { opacity: 1; }
}
.wx-chart__leg { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 10px 8px 0; font-size: .8rem; color: var(--ink-2); }
.wx-chart__leg span { display: inline-flex; align-items: center; gap: .4em; }
.wx-sw { width: 14px; height: 4px; border-radius: 2px; display: inline-block; }
.wx-sw--hi { background: var(--wx-hot); } .wx-sw--lo { background: var(--wx-cool); } .wx-sw--pr { height: 10px; width: 10px; background: color-mix(in oklab, var(--accent-2) 55%, transparent); } .wx-sw--ok { height: 10px; width: 14px; background: color-mix(in oklab, var(--wx-best) 25%, transparent); }
.wx-best .wxm { margin-bottom: 8px; }
.wx-best__t { font: 500 1.08rem/1.45 var(--sans); margin: 14px 0 8px; }
.wx-best__l { margin: 0; padding-left: 1.1em; display: grid; gap: .4em; font-size: .92rem; color: var(--ink-2); }
.wx-best__e { margin: 14px 0 0; padding: 12px 14px; border-radius: 12px; background: color-mix(in oklab, var(--gold) 12%, transparent); font-size: .92rem; }
.wx-best__r { margin: 14px 0 0; font-size: .78rem; }
.wx-sun { margin-top: 26px; }
.wx-sun .kicker small { font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--muted); }
.wx-sun__row { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(12, 1fr); gap: 4px; align-items: end; height: 96px; }
.wx-sun__row li { display: grid; grid-template-rows: 1fr auto auto; justify-items: center; height: 100%; gap: 2px; font-size: .72rem; font-variant-numeric: tabular-nums; }
.wx-sun__row li i { align-self: end; width: 60%; height: calc(var(--p, 0) * 56px + 3px); border-radius: 4px 4px 2px 2px; background: linear-gradient(180deg, var(--wx-sun), color-mix(in oklab, var(--wx-sun) 60%, var(--wx-warm))); transform-origin: bottom; }
.wx-sun__row li span { font-weight: 600; }
.wx-sun__row li small { color: var(--muted); }
.wx-sun__none { margin-top: 20px; font-size: .88rem; }
.wx-tbl { margin-top: 22px; font-size: .9rem; }
.wx-tbl summary { cursor: pointer; font-weight: 600; margin-bottom: 10px; }
.tbl--num td { text-align: right; font-variant-numeric: tabular-nums; padding: 8px 10px; }
.tbl--num th { text-align: right; padding: 8px 10px; }
.tbl--num tbody th { text-align: left; white-space: nowrap; }
.wx-alt { margin-top: 36px; padding-top: 24px; border-top: 1px dashed var(--line); }
.wx-alt > p { max-width: 70ch; }
.wx-clim__g--alt { margin-top: 14px; }
.wx-tips { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); }
.wxs { padding: 20px 22px; border-radius: 18px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.wxs p:last-child { margin: 0; font-size: .95rem; color: var(--ink-2); }
.wxs .kicker small { font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--muted); }
.wxs--summer .kicker { color: var(--wx-hot); } .wxs--winter .kicker { color: var(--wx-cold); } .wxs--spring .kicker { color: var(--wx-best); } .wxs--autumn .kicker { color: var(--wx-warm); }
.wx-others { margin-bottom: 28px; }
.wx-others .chip { text-decoration: none; color: inherit; }
.wx-others .chip:hover span { border-color: var(--accent); color: var(--accent); }
.wx-others .chip--acc span { background: var(--ink); color: var(--paper); border-color: var(--ink); }
.wx-others .chip--acc:hover span { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.wx-src { font-size: .88rem; color: var(--ink-2); }
.wx-src ul { margin: 0 0 10px; padding-left: 1.1em; display: grid; gap: .4em; }
.wx-src p { margin: 0; font-size: .82rem; }
.wxb__g { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(280px, 1fr); gap: clamp(16px, 2.5vw, 32px); align-items: start; }
.wxb__g--d { grid-template-columns: minmax(0, 1fr); max-width: 640px; }
@media (max-width: 900px) { .wxb__g { grid-template-columns: minmax(0, 1fr); } }
.wxb__pts { display: grid; gap: 12px; }
.wxb__pt { padding: 14px 16px 12px; border-radius: 18px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.wxb__n { margin: 0 0 8px; font: 500 1.15rem/1.2 var(--serif); }
.wxb__n a { text-decoration: none; }
.wxb__n a:hover { color: var(--accent); }
.wxb__n small { font: 400 .78rem/1.2 var(--sans); color: var(--muted); margin-left: .4em; }
.wxb__cl p { margin: 12px 0 10px; font-size: .95rem; }
.wxb__cl .wx-leg { display: none; }
.wx-tape { border-block: 1px solid var(--line); background: var(--paper); }
.wx-tape__in { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 18px; padding-block: 10px; }
.wx-tape__lbl { display: inline-flex; align-items: center; gap: .6em; text-decoration: none; color: inherit; }
.wx-tape__lbl .i { width: 26px; height: 26px; color: var(--accent-2); }
.wx-tape__lbl span { display: grid; line-height: 1.15; }
.wx-tape__lbl b { font: 600 .92rem/1.15 var(--sans); }
.wx-tape__lbl small { font-size: .72rem; color: var(--muted); }
.wx-tape__run { --gap: 2.2rem; font-size: .92rem; }
.wx-tape__it { gap: .45em; color: inherit; }
.wx-tape__it b { font-weight: 600; }
.wx-tape__it span { font-variant-numeric: tabular-nums; color: var(--ink-2); }
.wx-tape__more { display: inline-flex; align-items: center; gap: .3em; white-space: nowrap; font-size: .88rem; font-weight: 600; text-decoration: none; }
@media (max-width: 720px) { .wx-tape__in { grid-template-columns: minmax(0, 1fr); gap: 8px; } .wx-tape__more { justify-self: end; } }
.st-tabs { flex-wrap: nowrap; overflow-x: auto; margin: 0 0 14px; scrollbar-width: thin; }
.st-tabs a { display: inline-flex; align-items: center; gap: .4em; white-space: nowrap; }
.st-tabs .i { width: 16px; height: 16px; }
.st-per { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 16px; margin: 0 0 16px; }
.st-per__pre { display: flex; flex-wrap: wrap; gap: 4px; }
.st-per__pre a { padding: .45em .85em; border: 1px solid var(--line); border-radius: 999px; background: var(--card); color: var(--ink-2); font-size: .85rem; font-weight: 600; text-decoration: none; }
.st-per__pre a:hover { border-color: var(--ink); color: var(--ink); }
.st-per__pre a[aria-current] { background: var(--ink); border-color: var(--ink); color: var(--paper); }
.st-per__c { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.st-per__c .adm-in { width: auto; padding: .4em .6em; font-size: .88rem; }
.st-note { display: flex; gap: .5em; align-items: flex-start; margin: 0 0 16px; padding: 10px 14px; border-radius: var(--r-sm); font-size: .85rem; color: var(--ink-2);
background: color-mix(in oklab, var(--accent-2) 10%, var(--card)); border: 1px solid color-mix(in oklab, var(--accent-2) 25%, transparent); }
.st-note .i { margin-top: .15em; color: var(--accent-2); }
.st-box { margin: 0 0 16px; min-width: 0; }
.st-box > .adm-hint { margin: 10px 0 0; }
.st-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 14px; margin: 0 0 16px; }
.st-grid--2 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); }
.st-panel { min-width: 0; margin: 0 0 16px; }
.st-grid > .st-panel { margin: 0; }
.st-panel__h { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 12px; margin: 0 0 10px; }
.st-panel__h .adm-h3 { margin: 0; }
.st-panel__h > a { color: var(--accent); font-size: .85rem; font-weight: 600; text-decoration: none; }
.st-panel__h > a.btn { color: inherit; }
.st-now { margin: 0 0 16px; }
.st-dot { display: inline-block; flex: none; width: 10px; height: 10px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 4px color-mix(in oklab, var(--ok) 22%, transparent); }
@media (prefers-reduced-motion: no-preference) { .st-dot { animation: st-pulse 2.2s ease-in-out infinite; } }
@keyframes st-pulse { 50% { box-shadow: 0 0 0 7px color-mix(in oklab, var(--ok) 6%, transparent); } }
.st-now__l { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); gap: 4px 14px; }
.st-now__l a { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 0 8px; padding: 6px 8px; border-radius: 8px; color: var(--ink); text-decoration: none; }
.st-now__l a:hover { background: var(--paper-2); color: var(--ink); }
.st-now__l .st-flag { grid-row: span 2; }
.st-now__p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: .9rem; font-weight: 600; }
.st-now__m { font-size: .78rem; color: var(--muted); }
.st-filters { align-items: end; }
.st-chips { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 0 0 12px; }
.st-chips .pill a { margin-left: .35em; font-size: 1.1em; line-height: 1; text-decoration: none; }
a.pill { text-decoration: none; color: inherit; }
.st-pg { display: grid; min-width: 0; color: var(--ink); text-decoration: none; }
.st-pg:hover .st-pg__n { color: var(--accent); }
.st-pg__n { font-weight: 600; overflow-wrap: anywhere; }
.st-pg__p { font-size: .76rem; color: var(--muted); overflow-wrap: anywhere; }
.st-wrap { overflow-wrap: anywhere; word-break: break-word; }
.st-tbl td { vertical-align: top; }
.st-sortb { all: unset; cursor: pointer; }
.st-sortb:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
th[aria-sort="ascending"] .st-sortb::after { content: ' ▲'; }
th[aria-sort="descending"] .st-sortb::after { content: ' ▼'; }
.st-kv { display: grid; grid-template-columns: minmax(110px, 34%) minmax(0, 1fr); gap: 8px 14px; margin: 0; font-size: .9rem; }
.st-kv dt { color: var(--muted); }
.st-kv dd { margin: 0; min-width: 0; overflow-wrap: anywhere; }
.st-kv--sm { margin-top: 14px; font-size: .85rem; }
.st-tl { list-style: none; margin: 0; padding: 0; }
.st-tl > li { display: grid; grid-template-columns: 74px minmax(0, 1fr); gap: 12px; padding: 9px 0; border-top: 1px solid var(--line); }
.st-tl > li:first-child { border-top: 0; }
.st-tl__t { font: 500 .8rem/1.6 var(--sans); color: var(--muted); font-variant-numeric: tabular-nums; }
.st-tl__b { min-width: 0; }
.st-tl__e { margin-top: 4px; padding-left: 4px; font-size: .84rem; color: var(--ink-2); overflow-wrap: anywhere; }
.st-flows { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: .86rem; }
.st-flows li { display: flex; flex-wrap: wrap; align-items: baseline; gap: 2px 8px; }
.st-flows a { overflow-wrap: anywhere; }
.st-flows span { color: var(--muted); }
.st-flows b { margin-left: auto; font-variant-numeric: tabular-nums; }
.st-dash__live { display: flex; align-items: center; gap: .55em; margin: 0 0 8px; font-weight: 600; }
.st-dash .st-kv--sm { margin: 0 0 10px; }
.st-brief { margin: 0 0 18px; }
.st-brief__n { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 22px; font-size: .92rem; }
.st-brief__n b { margin-right: .2em; font: 600 1.35rem/1 var(--sans); }
.st-brief__n .st-spark { flex: 1 1 160px; max-width: 320px; height: 30px; }
.st-brief .adm-hint { margin: 10px 0 0; }
@media (max-width: 760px) {
.st-per { justify-content: flex-start; }
.st-tl > li { grid-template-columns: 64px minmax(0, 1fr); gap: 8px; }
.st-kv { grid-template-columns: minmax(0, 1fr); gap: 2px; }
.st-kv dd { margin-bottom: 8px; }
}
.st-pnote { margin: 0 0 10px; }
.st-more { margin-top: 10px; }
.st-more > summary { display: inline-flex; align-items: center; gap: .4em; cursor: pointer; list-style: none; padding: .45em .9em; border: 1px solid var(--line); border-radius: 999px;
background: var(--card); color: var(--ink-2); font-size: .82rem; font-weight: 600; }
.st-more > summary::-webkit-details-marker { display: none; }
.st-more > summary::before { content: '＋'; font-weight: 400; }
.st-more[open] > summary::before { content: '－'; }
.st-more > summary:hover { border-color: var(--ink); color: var(--ink); }
.st-more[open] > summary { margin-bottom: 10px; }
.st-tl__n { color: var(--ink); font-weight: 700; }
.st-tl__more { margin-top: 4px; }
.st-tl__more > summary { cursor: pointer; width: max-content; max-width: 100%; font-size: .82rem; font-weight: 600; color: var(--accent); }
.st-tl__more[open] > summary { margin-bottom: 4px; }
.adm-main .pager { margin-top: 18px; }
.adm-main .pager { flex-wrap: wrap; row-gap: 8px; }
.st-grid--4 { grid-template-columns: repeat(auto-fit, minmax(min(100%, 270px), 1fr)); }
.pg-visa { --vz-free: var(--ok); --vz-ev: var(--accent-2); --vz-req: var(--bad); --vz-sp: var(--warn); }
.vz-h { position: relative; isolation: isolate; padding-top: clamp(16px, 3vw, 40px); border-bottom: 1px solid var(--line);
background: radial-gradient(80% 70% at 100% 0%, color-mix(in oklab, var(--accent-2) 12%, transparent), transparent 62%),
radial-gradient(60% 60% at 0% 100%, color-mix(in oklab, var(--gold) 12%, transparent), transparent 60%), var(--paper); }
.vz-h__bg, .vz-d__bg { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.vz-guil { position: absolute; width: min(70vw, 820px); aspect-ratio: 1; right: -14vw; top: 50%; translate: 0 -50%; opacity: .5;
background: repeating-radial-gradient(circle at 50% 50%, transparent 0 11px, color-mix(in oklab, var(--gold) 30%, transparent) 11px 12px),
repeating-conic-gradient(from 0deg, transparent 0 4deg, color-mix(in oklab, var(--accent-2) 10%, transparent) 4deg 5deg);
mask: radial-gradient(circle, #000 0 38%, transparent 70%); -webkit-mask: radial-gradient(circle, #000 0 38%, transparent 70%); border-radius: 50%; }
.vz-h__in { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); grid-template-areas: "main card" "stats card"; column-gap: clamp(26px, 5vw, 72px); row-gap: 0;
align-items: center; padding-bottom: clamp(30px, 5vw, 64px); }
.vz-h__main { grid-area: main; align-self: end; }
.vz-h__card { grid-area: card; }
.vz-h__stats { grid-area: stats; align-self: start; }
@media (max-width: 1000px) { .vz-h__in { grid-template-columns: minmax(0, 1fr); grid-template-areas: "main" "card" "stats"; row-gap: 24px; } .vz-h__stats { margin-top: 4px !important; } }
.vz-h .crumbs { margin-bottom: 18px; }
.vz-h__t { font-size: clamp(2.4rem, 5.8vw, 4.9rem); line-height: 1; letter-spacing: -.03em; margin: 0 0 .32em; font-weight: 500; max-width: 13ch; }
.vz-h__t em { font-style: italic; font-weight: 400; color: var(--accent); }
.vz-h__lead { font-size: clamp(1.02rem, 1.4vw, 1.15rem); line-height: 1.6; color: var(--ink-2); max-width: 58ch; margin: 0; }
.vz-h__stats { display: grid; grid-template-columns: repeat(4, minmax(0, auto)); justify-content: start; gap: 14px clamp(18px, 2.6vw, 34px); margin: 28px 0 0; }
@media (max-width: 620px) { .vz-h__stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.vz-h__stats > div { display: flex; flex-direction: column-reverse; justify-content: flex-end; padding-left: 13px; border-left: 2px solid color-mix(in oklab, var(--gold) 55%, transparent); }
.vz-h__stats > div:nth-child(1) { border-color: var(--vz-free); }
.vz-h__stats > div:nth-child(2) { border-color: var(--vz-ev); }
.vz-h__stats > div:nth-child(3) { border-color: var(--vz-req); }
.vz-h__stats > div:nth-child(4) { border-color: var(--vz-sp); }
.vz-h__stats dd { margin: 0; font: 500 clamp(1.8rem, 3vw, 2.5rem)/1 var(--serif); font-variant-numeric: lining-nums tabular-nums; }
.vz-h__stats dt { margin-top: 6px; font-size: .8rem; color: var(--muted); max-width: 16ch; line-height: 1.3; }
.vz-h__card { position: relative; z-index: 2; padding: clamp(20px, 2.6vw, 30px) clamp(18px, 2.4vw, 28px) 44px; border-radius: 26px; border: 1px solid var(--line);
background: linear-gradient(180deg, color-mix(in oklab, var(--accent-2) 5%, var(--card)), var(--card) 42%); box-shadow: var(--shadow-lg); }
.vz-h__card::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: .55; z-index: -1;
background: repeating-linear-gradient(115deg, transparent 0 9px, color-mix(in oklab, var(--accent-2) 7%, transparent) 9px 10px); mask: linear-gradient(180deg, #000, transparent 55%); -webkit-mask: linear-gradient(180deg, #000, transparent 55%); }
.vz-h__card::after { content: 'P<UZB<<VISA<<CHECK<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<'; position: absolute; left: 0; right: 0; bottom: 12px; padding-inline: 22px; overflow: hidden; white-space: nowrap;
font: 500 .78rem/1 ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; letter-spacing: .24em; color: color-mix(in oklab, var(--muted) 70%, transparent); }
.vz-h__asof { display: flex; align-items: center; gap: .45em; margin: 14px 0 0; font-size: .82rem; color: var(--muted); }
.vz-h__asof .i { color: var(--vz-free); }
.vz-st { position: absolute; display: grid; place-items: center; text-align: center; gap: 2px; padding: 10px 14px; border: 2.5px solid currentColor; border-radius: 14px;
font: 700 .9rem/1.05 var(--sans); letter-spacing: .14em; text-transform: uppercase; opacity: .28; mix-blend-mode: multiply; }
:root[data-theme="dark"] .vz-st { mix-blend-mode: screen; opacity: .22; }
@media (prefers-color-scheme: dark) { :root[data-theme="auto"] .vz-st { mix-blend-mode: screen; opacity: .22; } }
.vz-st b { font-size: 1.5rem; letter-spacing: .1em; }
.vz-st i { font-style: normal; font-size: .66rem; letter-spacing: .2em; }
.vz-st em { font: 600 1.6rem/1 var(--serif); font-style: normal; }
.vz-st::before { content: ''; position: absolute; inset: 4px; border: 1px dashed currentColor; border-radius: 10px; }
.vz-st--a { color: var(--vz-free); right: 3%; top: 10%; rotate: 12deg; }
.vz-st--b { color: var(--accent-2); right: 34%; bottom: 7%; rotate: -9deg; border-radius: 999px; padding: 18px 22px; }
.vz-st--b::before { border-radius: 999px; }
.vz-st--c { color: var(--accent); right: 41%; top: 6%; rotate: -16deg; width: 92px; height: 92px; border-radius: 50%; }
.vz-st--c::before { border-radius: 50%; }
.vz-st--d { color: var(--gold); right: 1%; bottom: 9%; rotate: 7deg; }
@media (max-width: 1000px) { .vz-st--b, .vz-st--c { display: none; } .vz-st--a { top: 2%; } .vz-st--d { bottom: 2%; } }
@media (prefers-reduced-motion: no-preference) {
.vz-st { animation: vz-stamp .7s var(--ease-out) both; }
.vz-st--b { animation-delay: .15s; } .vz-st--c { animation-delay: .3s; } .vz-st--d { animation-delay: .45s; }
}
@keyframes vz-stamp { from { opacity: 0; transform: scale(1.5); } }
.vz-calc { display: grid; gap: 10px; margin: 0; }
.vz-calc__k { display: flex; align-items: center; gap: .5em; margin: 0 0 4px; font: 500 clamp(1.3rem, 2vw, 1.6rem)/1.15 var(--serif); }
.vz-calc__k .i { color: var(--accent); width: 1.1em; height: 1.1em; }
.vz-calc__l { font: 600 .74rem/1.3 var(--sans); letter-spacing: .14em; text-transform: uppercase; color: var(--muted); }
.vz-calc__row { position: relative; display: flex; gap: 10px; align-items: stretch; }
.vz-calc__f { flex: 1; min-width: 0; }
.vz-calc__f select { width: 100%; min-width: 0; height: 100%; min-height: 52px; padding: .7em 2.4em .7em .9em; border-radius: 14px; border: 1px solid var(--line); background: var(--paper); color: var(--ink);
font-size: 1rem; appearance: none; -webkit-appearance: none;
background-image: linear-gradient(45deg, transparent 50%, var(--muted) 50%), linear-gradient(-45deg, transparent 50%, var(--muted) 50%);
background-position: calc(100% - 20px) 50%, calc(100% - 14px) 50%; background-size: 6px 6px; background-repeat: no-repeat; }
.vz-calc__f select:focus-visible { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 22%, transparent); }
.vz-calc__go { flex: none; justify-content: center; }
.vz-calc__h { margin: 2px 0 0; font-size: .84rem; color: var(--muted); }
@media (max-width: 560px) { .vz-calc__row { flex-direction: column; } .vz-calc__f { position: relative; } .vz-calc__go { width: 100%; padding-block: .9em; } }
.vz-calc--compact .vz-calc__row { flex-direction: column; }
.vz-calc--compact .vz-calc__f { position: relative; }
.vz-calc--compact .vz-calc__go { width: 100%; }
.vz-cb { position: static; }
.vz-cb__in { display: flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 14px; border-radius: 14px; border: 1px solid var(--line); background: var(--paper); }
.vz-cb__in:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 22%, transparent); }
.vz-cb__in .i { color: var(--muted); }
.vz-cb__flag { font-size: 1.45rem; line-height: 1; min-width: 1.2em; text-align: center; }
.vz-cb__in input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; padding: .7em 0; font-size: 1.02rem; color: var(--ink); }
.vz-cb__list { position: absolute; left: 0; right: 0; top: calc(100% + 6px); z-index: 40; max-height: min(340px, 52vh); overflow: auto; overscroll-behavior: contain; margin: 0; padding: 6px; list-style: none;
border-radius: 16px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow-lg); }
.vz-cb__it { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; cursor: pointer; }
.vz-cb__it[aria-selected="true"], .vz-cb__it:hover { background: color-mix(in oklab, var(--accent) 9%, transparent); }
.vz-cb__it > span:first-child { font-size: 1.3rem; line-height: 1; }
.vz-cb__nm { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 500; }
.vz-cb__m { display: inline-flex; align-items: center; gap: .4em; font-size: .76rem; color: var(--muted); white-space: nowrap; }
.vz-cb__none { padding: 12px; color: var(--muted); font-size: .92rem; }
@media (max-width: 480px) { .vz-cb__m { display: none; } }
.vz-dot { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--muted); flex: none; }
.vz-dot--visa_free { background: var(--vz-free); }
.vz-dot--evisa { background: var(--vz-ev); }
.vz-dot--visa_required { background: var(--vz-req); }
.vz-dot--special { background: var(--vz-sp); }
.vz-flt { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 14px 18px; padding: clamp(14px, 2vw, 20px); margin-bottom: 14px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.vz-flt .chips { flex: 1 1 520px; min-width: 0; }
.vz-flt .chip span { gap: .45em; }
.vz-flt__q { flex: 1 1 240px; display: flex; align-items: center; gap: 8px; padding: 0 14px; border-radius: 14px; border: 1px solid var(--line); background: var(--paper); min-width: 0; }
.vz-flt__q .i { color: var(--muted); }
.vz-flt__q input { flex: 1; min-width: 0; border: 0; outline: none; background: transparent; padding: .72em 0; font-size: .98rem; color: var(--ink); }
.vz-flt__q:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in oklab, var(--accent) 20%, transparent); }
.vz-tbl .tbl th[scope="row"] { font: inherit; text-transform: none; letter-spacing: 0; color: inherit; padding: 11px 12px; border-bottom: 1px solid var(--line); text-align: left; }
.vz-tbl .tbl td, .vz-tbl .tbl th[scope="row"] { vertical-align: middle; }
.vz-tbl tr[hidden] { display: none; }
.vz-cty { display: inline-flex; align-items: center; gap: .6em; font-weight: 600; text-decoration: none; }
.vz-cty:hover span:last-child { text-decoration: underline; }
.vz-flag { font-size: 1.45rem; line-height: 1; }
.vz-tr { display: flex; align-items: center; gap: .35em; margin: 3px 0 0 2.15em; font-size: .74rem; color: var(--muted); }
.vz-tr .i { width: 1em; height: 1em; }
.vz-nowrap { white-space: nowrap; }
.pg-visa .pill .i { width: 1em; height: 1em; }
@media (max-width: 760px) {
.vz-col-src { display: none; }
.vz-tbl .tbl { font-size: .9rem; }
.vz-tbl .tbl td, .vz-tbl .tbl th { padding: 9px 8px; }
.vz-nowrap { white-space: normal; }
}
@media (max-width: 430px) { .vz-tbl .pill { font-size: .68rem; padding: .3em .5em; } .vz-tr { margin-left: 0; } }
.vz-srcs { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.vz-srcs > .i { width: .95em; height: .95em; color: var(--muted); }
.vz-src { display: inline-flex; align-items: center; padding: .22em .62em; border-radius: 999px; border: 1px solid var(--line); background: var(--paper); color: var(--ink-2);
font: 600 .72rem/1.2 var(--sans); text-decoration: none; white-space: nowrap; transition: border-color .2s, color .2s; }
.vz-src:hover { border-color: var(--accent); color: var(--accent); }
.vz-after { margin: 10px 0 0; }
.vz-rules { columns: 3 320px; column-gap: 18px; }
.vz-rule { break-inside: avoid; display: inline-block; width: 100%; margin: 0 0 18px; padding: 22px 22px 18px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); }
.vz-rule__t { display: flex; align-items: center; gap: .6em; margin: 0 0 12px; font-size: 1.25rem; }
.vz-rule__t .i { width: 38px; height: 38px; padding: 9px; border-radius: 12px; background: color-mix(in oklab, var(--accent-2) 13%, transparent); color: var(--accent-2); }
.vz-rule__ul { margin: 0; padding: 0; list-style: none; }
.vz-rule__ul li { padding: 11px 0; border-top: 1px solid var(--line); }
.vz-rule__ul li:first-child { border-top: 0; padding-top: 0; }
.vz-rule__ul p { margin: 0 0 7px; font-size: .95rem; line-height: 1.55; color: var(--ink-2); }
.vz-code { display: inline-block; min-width: 3.4em; padding: .25em .5em; border-radius: 8px; background: color-mix(in oklab, var(--gold) 16%, transparent); color: var(--ink);
font: 700 .78rem/1.2 ui-monospace, 'SFMono-Regular', Menlo, Consolas, monospace; text-align: center; letter-spacing: .04em; }
.vz-types__note { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 8px; margin: 14px 0 0; font-size: .9rem; color: var(--ink-2); }
.vz-types__note > .i { color: var(--accent-2); }
.vz-types__note > span { flex: 1 1 320px; }
.vz-orgs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 320px), 1fr)); gap: 16px; align-items: start; }
.vz-org { display: grid; gap: 8px; padding: 20px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); }
.vz-org__t { display: flex; align-items: flex-start; gap: .55em; margin: 0; font-size: 1.1rem; line-height: 1.25; }
.vz-org__t .i { flex: none; width: 34px; height: 34px; padding: 8px; border-radius: 11px; background: color-mix(in oklab, var(--accent) 11%, transparent); color: var(--accent); margin-top: -4px; }
.vz-org__r { margin: 0; font-size: .88rem; color: var(--muted); }
.vz-org__ul { display: grid; gap: 7px; margin: 4px 0 0; padding: 0; list-style: none; font-size: .93rem; }
.vz-org__ul li { display: flex; align-items: flex-start; gap: .55em; min-width: 0; }
.vz-org__ul li > .i { margin-top: .2em; color: var(--muted); width: 1em; height: 1em; }
.vz-org__ul a { font-weight: 600; overflow-wrap: anywhere; }
.vz-org__ul small { display: block; color: var(--muted); font-size: .78rem; font-weight: 400; }
.vz-org__n { margin: 2px 0 0; padding: 9px 11px; border-radius: 10px; background: var(--paper-2); font-size: .84rem; color: var(--ink-2); }
.vz-org__s { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 4px 0 0; padding-top: 10px; border-top: 1px dashed var(--line); font-size: .78rem; color: var(--muted); }
.vz-warn { display: flex; align-items: flex-start; gap: 12px; margin: 22px 0 0; padding: 16px 18px; border-radius: 16px; border: 1px solid color-mix(in oklab, var(--warn) 40%, transparent);
background: color-mix(in oklab, var(--warn) 10%, var(--card)); }
.vz-warn > .i { flex: none; color: var(--warn); width: 22px; height: 22px; margin-top: 2px; }
.vz-warn p { margin: 0; font-size: .95rem; line-height: 1.55; }
.vz-two { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: clamp(28px, 5vw, 64px); align-items: start; }
@media (max-width: 1000px) { .vz-two { grid-template-columns: minmax(0, 1fr); } }
.vz-docs { margin: 0; padding: 0; list-style: none; counter-reset: vzd; }
.vz-doc { position: relative; padding: 14px 0 14px 40px; border-top: 1px solid var(--line); counter-increment: vzd; }
.vz-doc::before { content: counter(vzd); position: absolute; left: 0; top: 15px; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%;
background: color-mix(in oklab, var(--gold) 18%, transparent); color: var(--ink); font: 700 .74rem/1 var(--sans); }
.vz-doc p { margin: 0; }
.vz-doc__k { font-size: .76rem; letter-spacing: .04em; color: var(--muted); }
.vz-doc__k b { color: var(--ink); }
.vz-doc__t { margin: 3px 0 4px !important; font-weight: 600; line-height: 1.4; }
.vz-doc__t a { text-decoration-color: color-mix(in oklab, var(--accent) 45%, transparent); }
.vz-doc__e { font-size: .84rem; color: var(--ink-2); }
.vz-doc__e span { color: var(--muted); }
.vz-doc__l { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 4px !important; font-size: .8rem; color: var(--muted); }
.vz-doc__l a { font-weight: 600; }
.vz-docs--sm .vz-doc { padding-left: 34px; }
.vz-docs--sm .vz-doc::before { width: 22px; height: 22px; }
.vz-conf { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.vz-conf li { padding: 14px 16px; border-radius: 14px; border: 1px solid var(--line); border-left: 3px solid var(--gold); background: var(--card); }
.vz-conf p { margin: 0 0 8px; font-size: .92rem; line-height: 1.55; color: var(--ink-2); }
.vz-faq { border-top: 1px solid var(--line); }
.vz-faq__it { border-bottom: 1px solid var(--line); }
.vz-faq__it summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 18px 2px; cursor: pointer; list-style: none; font: 500 clamp(1.05rem, 1.6vw, 1.22rem)/1.35 var(--serif); }
.vz-faq__it summary::-webkit-details-marker { display: none; }
.vz-faq__it summary .i { flex: none; color: var(--accent); transition: transform .25s var(--ease); }
.vz-faq__it[open] summary .i { transform: rotate(180deg); }
.vz-faq__it p { margin: 0 0 20px; color: var(--ink-2); line-height: 1.65; }
.vz-guide { margin: 22px 0 0; }
.vz-d { --vz-c: var(--muted); position: relative; isolation: isolate; overflow: hidden; padding: clamp(16px, 3vw, 36px) 0 clamp(26px, 4vw, 48px); border-bottom: 1px solid var(--line);
background: radial-gradient(70% 90% at 100% 0%, color-mix(in oklab, var(--vz-c) 12%, transparent), transparent 62%), var(--paper); }
.vz-d--visa_free { --vz-c: var(--vz-free); }
.vz-d--evisa { --vz-c: var(--vz-ev); }
.vz-d--visa_required { --vz-c: var(--vz-req); }
.vz-d--special { --vz-c: var(--vz-sp); }
.vz-d .crumbs { margin-bottom: 16px; }
.vz-d__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: clamp(20px, 4vw, 56px); align-items: center; }
@media (max-width: 760px) { .vz-d__grid { grid-template-columns: minmax(0, 1fr); } }
.vz-d__t { font-size: clamp(1.9rem, 4.4vw, 3.5rem); line-height: 1.05; letter-spacing: -.02em; margin: 0 0 .4em; max-width: 22ch; }
.vz-d__flag { display: inline-block; font-size: .9em; line-height: 1; vertical-align: -.06em; margin-right: .1em; }
.vz-d__lead { margin: 0; max-width: 66ch; color: var(--ink-2); font-size: clamp(1rem, 1.3vw, 1.1rem); line-height: 1.6; }
.vz-big { --s: clamp(190px, 22vw, 250px); position: relative; width: var(--s); height: var(--s); display: grid; align-content: center; justify-items: center; gap: 4px; text-align: center;
border-radius: 50%; color: var(--vz-c); border: 3px solid currentColor; rotate: -8deg; background: color-mix(in oklab, var(--vz-c) 7%, var(--card));
box-shadow: inset 0 0 0 7px var(--card), inset 0 0 0 9px color-mix(in oklab, currentColor 60%, transparent), var(--shadow); }
.vz-big--visa_free { --vz-c: var(--vz-free); }
.vz-big--evisa { --vz-c: var(--vz-ev); }
.vz-big--visa_required { --vz-c: var(--vz-req); }
.vz-big--special { --vz-c: var(--vz-sp); }
@media (max-width: 760px) { .vz-big { justify-self: center; --s: 200px; } }
.vz-big__m { max-width: 80%; font: 800 .82rem/1.15 var(--sans); letter-spacing: .16em; text-transform: uppercase; }
.vz-big__n { font: 600 clamp(3.4rem, 6vw, 4.6rem)/.95 var(--serif); font-variant-numeric: lining-nums; }
.vz-big__n--inf { font-size: clamp(3.6rem, 6.4vw, 5rem); line-height: .8; }
.vz-big__n--ic .i { width: 64px; height: 64px; stroke-width: 1.4; }
.vz-big__u { font: 700 .74rem/1.2 var(--sans); letter-spacing: .16em; text-transform: uppercase; max-width: 70%; }
.vz-big__c { margin-top: 4px; padding-top: 6px; border-top: 1.5px dashed currentColor; font: 600 .66rem/1 ui-monospace, Menlo, Consolas, monospace; letter-spacing: .14em; opacity: .85; }
@media (prefers-reduced-motion: no-preference) { .vz-big { animation: vz-big .75s var(--ease-out) .15s both; } }
@keyframes vz-big { from { opacity: 0; transform: scale(1.6) rotate(10deg); } 60% { opacity: 1; } }
.vz-art { display: grid; grid-template-columns: minmax(0, 1fr) minmax(300px, 380px); gap: clamp(24px, 4vw, 48px); align-items: start; }
@media (max-width: 1000px) { .vz-art { grid-template-columns: minmax(0, 1fr); } }
.vz-art__main { display: grid; grid-template-columns: minmax(0, 1fr); gap: 22px; min-width: 0; }
.vz-art__main > *, .vz-art__side > * { min-width: 0; }
.vz-res__go .btn { white-space: normal; text-align: left; }
.vz-art__side { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; min-width: 0; }
.vz-art__side .vz-orgs { grid-template-columns: minmax(0, 1fr); }
.vz-side__t { margin: 8px 0 0; font-size: 1.35rem; }
.vz-side-calc { padding: 18px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); box-shadow: var(--shadow); }
.vz-res { --vz-c: var(--line); padding: clamp(20px, 3vw, 30px); border-radius: 22px; border: 1px solid var(--line); border-top: 4px solid var(--vz-c); background: var(--card); scroll-margin-top: calc(var(--hdr) + 12px); }
.vz-res--visa_free { --vz-c: var(--vz-free); }
.vz-res--evisa { --vz-c: var(--vz-ev); }
.vz-res--visa_required { --vz-c: var(--vz-req); }
.vz-res--special { --vz-c: var(--vz-sp); }
.vz-res--plain { border-top-width: 1px; }
.vz-res .kicker { color: var(--vz-c); }
.vz-res--plain .kicker { color: var(--accent); }
.vz-res__t { display: flex; align-items: center; gap: .5em; margin: 0 0 14px; font-size: clamp(1.45rem, 2.4vw, 2rem); }
.vz-res__t .i { flex: none; width: 1.1em; height: 1.1em; color: var(--vz-c); }
.vz-res--plain .vz-res__t .i { color: var(--accent-2); }
.vz-res__h { display: flex; align-items: center; gap: .5em; margin: 22px 0 10px; font-size: 1.15rem; }
.vz-res__h .i { color: var(--accent-2); }
.vz-res__p { margin: 0 0 12px; line-height: 1.65; }
.vz-res__p--mut { display: flex; gap: .5em; align-items: flex-start; font-size: .92rem; color: var(--ink-2); }
.vz-res__p--mut > .i { margin-top: .25em; color: var(--muted); width: 1em; height: 1em; }
.vz-res__note { display: flex; gap: .6em; align-items: flex-start; padding: 12px 14px; border-radius: 12px; background: color-mix(in oklab, var(--accent-2) 9%, transparent); font-size: .94rem; }
.vz-res__note > .i { margin-top: .2em; color: var(--accent-2); }
.vz-res__go { display: flex; flex-wrap: wrap; gap: 10px; margin: 6px 0 14px; }
.vz-res__ul { margin: 0; padding-left: 1.2em; display: grid; gap: 8px; line-height: 1.6; }
.vz-res__ul li::marker { color: var(--accent); }
.vz-res__ul--check { list-style: none; padding: 0; }
.vz-res__ul--check li { position: relative; padding-left: 1.7em; }
.vz-res__ul--check li::before { content: ''; position: absolute; left: .2em; top: .55em; width: .8em; height: .45em; border-left: 2px solid var(--vz-c); border-bottom: 2px solid var(--vz-c); rotate: -45deg; }
.vz-res__src { margin-top: 20px; padding-top: 4px; border-top: 1px solid var(--line); }
.vz-steps { margin: 0 0 12px; padding: 0; list-style: none; counter-reset: vzs; display: grid; gap: 10px; }
.vz-steps li { position: relative; padding: 2px 0 2px 46px; counter-increment: vzs; line-height: 1.55; min-height: 32px; }
.vz-steps li::before { content: counter(vzs); position: absolute; left: 0; top: 0; width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%;
background: color-mix(in oklab, var(--vz-c) 15%, transparent); color: var(--vz-c); font: 700 .9rem/1 var(--sans); }
.vz-same { display: flex; flex-wrap: wrap; gap: 8px; margin: 0; padding: 0; list-style: none; }
.vz-same a { display: inline-flex; align-items: center; gap: .45em; padding: .45em .85em; border-radius: 999px; border: 1px solid var(--line); background: var(--card); font-size: .9rem; font-weight: 500; text-decoration: none; }
.vz-same a:hover { border-color: var(--ink); color: inherit; }
@media print {
.vz-h__bg, .vz-d__bg, .vz-calc, .vz-flt, .vz-side-calc { display: none !important; }
.vz-big { animation: none; }
}
.dm { --mc-car: var(--gold); --mc-train: var(--accent-2); --mc-plane: var(--accent); --mc-bus: var(--ok); }
.dm-calc { padding-block: 0 clamp(28px, 4vw, 48px); }
.dm-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px 14px; padding: 18px 20px; border: 1px solid var(--line); border-radius: 22px; background: var(--card); box-shadow: var(--shadow); }
.dm-form .dm-sel { flex: 1 1 220px; min-width: 0; }
.dm-form .dm-sel select { width: 100%; min-width: 0; font-size: 1rem; padding-block: .72em; }
.dm-form .btn { flex: none; }
.dm-swap { flex: none; border: 1px solid var(--line); margin-bottom: 1px; }
.dm-swap .i { transition: transform .45s var(--ease-out); }
.dm-swap:hover .i, .dm-swap.is-spin .i { transform: rotate(180deg); }
.dm-form__err { flex: 1 0 100%; display: flex; align-items: center; gap: .5em; margin: 0; color: var(--bad); font-size: .9rem; }
@media (max-width: 640px) {
.dm-form { padding: 14px; border-radius: 18px; }
.dm-form .dm-sel { flex-basis: 100%; }
.dm-swap { order: 1; margin-left: auto; }
.dm-form .btn { order: 2; flex: 1; justify-content: center; }
}
.dm-pop { display: grid; gap: 10px; margin: 22px 0 0; }
.dm-pop .kicker { margin: 0; }
.dm-pop__l { display: flex; flex-wrap: wrap; gap: 8px; }
.dm-pop__a { display: inline-flex; align-items: center; gap: .45em; padding: .55em .95em; border-radius: 14px; border: 1px solid var(--line); background: var(--card); text-decoration: none; font-size: .92rem;
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.dm-pop__a .i { width: 15px; height: 15px; color: var(--accent); }
.dm-pop__a small { margin-left: .3em; padding: .1em .5em; border-radius: 999px; background: var(--paper-2); color: var(--muted); font-weight: 600; font-size: .74rem; font-variant-numeric: tabular-nums; }
.dm-pop__a:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: var(--shadow); color: inherit; }
.dm-hubs { margin: -8px 0 24px; }
@media (max-width: 640px) { .dm-hubs { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 8px; margin-inline: calc(-1 * var(--gut)); padding-inline: var(--gut); scrollbar-width: thin; -webkit-overflow-scrolling: touch; } .dm-hubs .chip { flex: none; } }
.dm-fcs { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 215px), 1fr)); gap: 12px; }
.dm-fc { position: relative; display: grid; gap: 10px; padding: 16px 16px 14px; border-radius: 18px; border: 1px solid var(--line); background: var(--card); text-decoration: none; color: inherit; overflow: hidden;
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.dm-fc::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--accent); opacity: 0; transition: opacity .25s; }
.dm-fc:hover { border-color: var(--accent); transform: translateY(-3px); box-shadow: var(--shadow); color: inherit; }
.dm-fc:hover::before { opacity: 1; }
.dm-fc--b { background: color-mix(in oklab, var(--card) 70%, var(--paper-2)); }
.dm-fc__h { display: grid; gap: 1px; min-width: 0; }
.dm-fc__h b { font: 500 1.12rem/1.2 var(--serif); }
.dm-fc__h small { color: var(--muted); font-size: .76rem; }
.dm-fc__km { display: flex; align-items: baseline; gap: .25em; font-variant-numeric: tabular-nums; }
.dm-fc__km b { font: 500 2rem/1 var(--serif); letter-spacing: -.02em; }
.dm-fc__km small { color: var(--muted); font-weight: 600; font-size: .8rem; }
.dm-fc__row { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 10px; font-size: .8rem; color: var(--ink-2); font-variant-numeric: tabular-nums; }
.dm-fc__m { display: inline-flex; align-items: center; gap: .4em; white-space: nowrap; }
.dm-fc__m .i { width: 15px; height: 15px; color: var(--accent-2); flex: none; }
.dm-fc__m.is-off { color: var(--muted); opacity: .6; }
.dm-fc__m.is-off .i { color: var(--muted); }
.dm-fc__tag { position: absolute; top: 12px; right: 12px; padding: .25em .6em; border-radius: 999px; font: 600 .66rem/1.2 var(--sans); letter-spacing: .08em; text-transform: uppercase; background: color-mix(in oklab, var(--ok) 16%, transparent); color: var(--ok); }
.dm-fc__tag--far { background: color-mix(in oklab, var(--accent) 14%, transparent); color: var(--accent); }
@media (max-width: 640px) {
.dm-fcs { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.dm-fc { padding: 12px 12px 10px; gap: 6px; border-radius: 14px; }
.dm-fc__h b { font-size: 1rem; overflow-wrap: anywhere; }
.dm-fc__h small { font-size: .7rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dm-fc__km b { font-size: 1.55rem; }
.dm-fc__row { grid-template-columns: minmax(0, 1fr); gap: 3px; font-size: .74rem; }
.dm-fc__tag { top: 9px; right: 9px; font-size: .58rem; padding: .2em .5em; }
}
.dm-map { margin: 0; }
.dm-map__box { position: relative; height: clamp(320px, 48vw, 560px); border-radius: 22px; overflow: hidden; border: 1px solid var(--line); background: var(--paper-2); isolation: isolate; }
.dm-map__ph { position: absolute; inset: 0; display: grid; place-items: center; color: var(--muted); }
.dm-map__ph .i { width: 44px; height: 44px; stroke-width: 1.2; opacity: .6; }
.dm-map__box .maplibregl-map { position: absolute; inset: 0; }
.dm-map__box .maplibregl-ctrl-attrib { font-size: .66rem; }
.dm-map figcaption { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; margin-top: 12px; font-size: .86rem; color: var(--muted); }
.dm-map__ov { position: absolute; left: 14px; top: 14px; z-index: 2; display: flex; flex-wrap: wrap; gap: 6px; pointer-events: none; max-width: calc(100% - 100px); }
.dm-map__ov span { display: inline-flex; align-items: center; gap: .45em; padding: .4em .8em; border-radius: 999px; background: color-mix(in oklab, var(--card) 88%, transparent); border: 1px solid var(--line); box-shadow: var(--shadow); font: 600 .78rem/1 var(--sans); color: var(--ink); backdrop-filter: blur(6px); font-variant-numeric: tabular-nums; }
.dm-map__ov i { display: inline-block; width: 18px; height: 0; border-top: 3px solid var(--accent); border-radius: 2px; }
.dm-map__ov i.is-dash { border-top-style: dashed; border-top-color: var(--accent-2); }
.dm-mk { position: relative; display: grid; place-items: center; cursor: default; }
.dm-mk a { position: absolute; inset: -6px; border-radius: 999px; }
.dm-mk__d { width: 12px; height: 12px; border-radius: 50%; background: var(--accent-2); border: 2.5px solid var(--card); box-shadow: 0 0 0 1px color-mix(in oklab, var(--ink) 20%, transparent), var(--shadow); transition: transform .2s var(--ease); }
.dm-mk__l { position: absolute; top: 100%; margin-top: 5px; padding: .22em .55em; border-radius: 7px; background: color-mix(in oklab, var(--card) 92%, transparent); border: 1px solid var(--line); font: 600 .72rem/1.2 var(--sans); color: var(--ink); white-space: nowrap; box-shadow: var(--shadow); pointer-events: none; transition: opacity .2s; }
.dm-mk__l small { color: var(--muted); font-weight: 500; margin-left: .35em; font-variant-numeric: tabular-nums; }
.dm-mk__l--t { top: auto; bottom: 100%; margin: 0 0 5px; }
.dm-mk__l--r { top: 50%; left: 100%; margin: 0 0 0 9px; transform: translateY(-50%); }
.dm-mk__l--l { top: 50%; right: 100%; margin: 0 9px 0 0; transform: translateY(-50%); }
.dm-mk--b .dm-mk__d { width: 9px; height: 9px; background: var(--muted); }
.dm-mk--b .dm-mk__l { opacity: 0; }
.dm-mk--hub .dm-mk__d, .dm-mk--pt .dm-mk__d { width: 16px; height: 16px; background: var(--accent); }
.dm-mk--hub .dm-mk__l, .dm-mk--pt .dm-mk__l { font-size: .82rem; background: var(--ink); color: var(--paper); border-color: var(--ink); }
.dm-mk:hover .dm-mk__d, .dm-mk:focus-within .dm-mk__d { transform: scale(1.35); }
.dm-mk:hover .dm-mk__l, .dm-mk:focus-within .dm-mk__l { opacity: 1; }
.dm-map__box.is-dense .dm-mk:not(.dm-mk--hub):not(.dm-mk--pt) .dm-mk__l { opacity: 0; }
@media (prefers-reduced-motion: no-preference) {
.dm-mk--hub .dm-mk__d::after, .dm-mk--pt .dm-mk__d::after { content: ''; position: absolute; inset: -3px; border-radius: 50%; border: 2px solid var(--accent); animation: dmPulse 2.2s var(--ease-out) infinite; }
}
@keyframes dmPulse { 0% { transform: scale(.7); opacity: .9; } 100% { transform: scale(2.4); opacity: 0; } }
.dm-mx__bar { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.dm-mx__wrap { max-height: min(78vh, 900px); overflow: auto; scrollbar-width: thin; }
.dm-mx__t { font-size: .82rem; border-collapse: separate; border-spacing: 0; min-width: 100%; }
.dm-mx__t th, .dm-mx__t td { padding: 5px 7px; text-align: center; white-space: nowrap; border-bottom: 1px solid var(--line); }
.dm-mx__t thead th { position: sticky; top: 0; z-index: 3; background: var(--card); vertical-align: bottom; height: 112px; padding-bottom: 8px; letter-spacing: 0; text-transform: none; font: 600 .76rem/1.1 var(--sans); color: var(--ink-2); }
.dm-mx__t thead th span { display: inline-block; writing-mode: vertical-rl; transform: rotate(180deg); max-height: 100px; }
.dm-mx__t .dm-mx__c0 { position: sticky; left: 0; z-index: 2; background: var(--card); text-align: left; font: 600 .82rem/1.2 var(--sans); color: var(--ink); border-right: 1px solid var(--line); min-width: 120px; }
.dm-mx__t thead .dm-mx__c0 { z-index: 4; }
.dm-mx__t td a { display: block; padding: .3em .2em; border-radius: 7px; text-decoration: none; font-variant-numeric: tabular-nums; color: var(--ink); transition: background .15s, color .15s; }
.dm-mx__t td a:hover { background: var(--accent); color: var(--accent-ink); }
.dm-mx__t td.dm-mx__self { color: var(--muted); background: color-mix(in oklab, var(--paper-2) 70%, transparent); }
.dm-mx__t tr:hover td { background: color-mix(in oklab, var(--paper-2) 60%, transparent); }
.dm-mx__t .is-hl, .dm-mx__t tr:hover .dm-mx__c0 { background: color-mix(in oklab, var(--accent) 12%, var(--card)); color: var(--accent); }
.dm-mx__t td.is-hl { background: color-mix(in oklab, var(--accent) 8%, var(--card)); }
.dm-mx--all .dm-mx__t { font-size: .76rem; }
.dm-mx--all .dm-mx__t th, .dm-mx--all .dm-mx__t td { padding: 4px 5px; }
@media (max-width: 640px) { .dm-mx__t .dm-mx__c0 { min-width: 96px; font-size: .76rem; } .dm-mx__t thead th { height: 96px; } }
.dm-note { display: flex; gap: .6em; align-items: flex-start; margin: 22px 0 0; font-size: .86rem; color: var(--muted); max-width: 90ch; }
.dm-note .i { flex: none; margin-top: .2em; }
.dm-src { margin-top: 18px; font-size: .86rem; color: var(--muted); }
.dm-src summary { display: inline-flex; align-items: center; gap: .5em; cursor: pointer; font-weight: 600; color: var(--ink-2); }
.dm-src ul { margin: 10px 0 0; padding-left: 1.2em; display: grid; gap: .4em; }
.dm-empty { display: flex; gap: .6em; align-items: center; margin: 0; padding: 18px 20px; border: 1px dashed var(--line); border-radius: var(--r); color: var(--muted); }
.dm-empty .i { flex: none; color: var(--accent); }
.dm-empty--sm { padding: 12px 14px; font-size: .9rem; }
.dm-phead .phead__meta { align-items: center; gap: 8px 14px; }
.dm-phead .phead__meta a.mi { text-decoration: none; padding: .35em .8em .35em .6em; border-radius: 999px; border: 1px solid var(--line); background: var(--card); font-size: .9rem; }
.dm-phead .phead__meta a.mi:hover { border-color: var(--accent); color: inherit; }
.dm-arrow .i { color: var(--muted); }
.dm-pair { display: grid; gap: clamp(18px, 2.6vw, 28px); padding-bottom: clamp(28px, 4vw, 48px); }
.dm-hero { position: relative; display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 10px clamp(18px, 3vw, 40px); padding: clamp(22px, 3vw, 36px) clamp(18px, 3vw, 40px); border-radius: 26px;
background: linear-gradient(135deg, color-mix(in oklab, var(--accent) 10%, var(--card)), var(--card) 45%, color-mix(in oklab, var(--accent-2) 12%, var(--card))); border: 1px solid var(--line); overflow: hidden; }
.dm-hero::after { content: ''; position: absolute; inset: auto -10% -60% auto; width: 46%; aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, color-mix(in oklab, var(--gold) 18%, transparent), transparent 70%); pointer-events: none; }
.dm-hero__n { display: grid; justify-items: center; text-align: center; gap: 2px; position: relative; z-index: 1; }
.dm-hero__n b { font: 500 clamp(2.6rem, 6vw, 4.6rem)/1 var(--serif); letter-spacing: -.03em; font-variant-numeric: tabular-nums lining-nums; }
.dm-hero__n span { font: 600 .9rem/1 var(--sans); color: var(--muted); margin-top: -4px; }
.dm-hero__n small { font: 600 .7rem/1.3 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--accent); margin-top: 6px; }
.dm-hero__n--t b { font-size: clamp(1.8rem, 4vw, 3rem); }
.dm-hero__n--air b { font-size: clamp(1.8rem, 4vw, 3rem); color: var(--ink-2); }
.dm-hero__sep { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; border: 1px dashed var(--line); color: var(--muted); }
@media (max-width: 760px) { .dm-hero { gap: 14px; } .dm-hero__sep { display: none; } .dm-hero__n { flex: 1 1 40%; } .dm-hero__n:first-child { flex-basis: 100%; } }
@media (prefers-reduced-motion: no-preference) {
.js .dm-hero__n b { opacity: 0; transform: translateY(14px); transition: opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.js .dm-hero.is-in .dm-hero__n b { opacity: 1; transform: none; }
.js .dm-hero.is-in .dm-hero__n:nth-child(3) b { transition-delay: .12s; } .js .dm-hero.is-in .dm-hero__n:nth-child(5) b { transition-delay: .22s; }
}
.dm-modes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 1100px) { .dm-modes { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 560px) { .dm-modes { grid-template-columns: minmax(0, 1fr); } }
.dm-mode { --mc: var(--accent); position: relative; display: flex; flex-direction: column; gap: 6px; padding: 18px 18px 16px; border-radius: 20px; border: 1px solid var(--line); background: var(--card); overflow: hidden;
transition: border-color .2s, transform .25s var(--ease), box-shadow .25s; }
.dm-mode::before { content: ''; position: absolute; inset: 0 0 auto 0; height: 4px; background: var(--mc); }
.dm-mode:hover { border-color: color-mix(in oklab, var(--mc) 60%, var(--line)); transform: translateY(-2px); box-shadow: var(--shadow); }
.dm-mode--car { --mc: var(--mc-car); } .dm-mode--train { --mc: var(--mc-train); } .dm-mode--plane { --mc: var(--mc-plane); } .dm-mode--bus { --mc: var(--mc-bus); }
.dm-mode__h { display: flex; align-items: center; gap: 10px; font: 600 .74rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--ink-2); margin-bottom: 6px; }
.dm-mode__h .i { width: 34px; height: 34px; padding: 7px; border-radius: 11px; color: var(--mc); background: color-mix(in oklab, var(--mc) 14%, var(--card)); }
.dm-mode__big { margin: 0; font: 500 clamp(1.6rem, 2.2vw, 2rem)/1.1 var(--serif); letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.dm-mode__sub { display: flex; flex-wrap: wrap; align-items: center; gap: .35em; margin: 0; font-size: .95rem; }
.dm-mode__sub .i { color: var(--mc); }
.dm-mode__sub a { text-decoration: none; }
.dm-mode__sub a:hover { color: var(--accent); }
.dm-mode__sub small { color: var(--muted); font-size: .82rem; }
.dm-mode__s { margin: 0; font-size: .84rem; color: var(--muted); line-height: 1.5; }
.dm-mode__s a { color: inherit; }
.dm-mode__none { margin: 4px 0 0; font: 500 1.05rem/1.35 var(--serif); color: var(--ink-2); }
.dm-mode__f { display: flex; flex-wrap: wrap; gap: 6px; margin-top: auto; padding-top: 10px; }
.dm-mode__f .btn { padding: .5em .8em; font-size: .78rem; }
.dm-mode__f .btn .i { width: 1em; height: 1em; }
.dm-live { display: inline-block; width: 8px; height: 8px; border-radius: 50%; background: var(--ok); box-shadow: 0 0 0 0 color-mix(in oklab, var(--ok) 50%, transparent); }
@media (prefers-reduced-motion: no-preference) { .dm-live { animation: dmLive 1.8s ease-out infinite; } }
@keyframes dmLive { 0% { box-shadow: 0 0 0 0 color-mix(in oklab, var(--ok) 55%, transparent); } 70% { box-shadow: 0 0 0 7px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
.dm-badge { display: inline-block; padding: .2em .55em; border-radius: 6px; font: 600 .66rem/1.2 var(--sans); letter-spacing: .06em; text-transform: uppercase; background: var(--paper-2); color: var(--ink-2); vertical-align: .1em; }
.dm-badge--highspeed { background: color-mix(in oklab, var(--accent) 16%, transparent); color: var(--accent); }
.dm-badge--fast { background: color-mix(in oklab, var(--accent-2) 16%, transparent); color: var(--accent-2); }
.dm-badge--night { background: color-mix(in oklab, var(--ink) 12%, transparent); color: var(--ink); }
.dm-times { display: inline-flex; flex-wrap: wrap; gap: 4px; }
.dm-times span { padding: .15em .5em; border-radius: 6px; background: var(--paper-2); font-variant-numeric: tabular-nums; font-size: .82rem; font-weight: 600; color: var(--ink-2); }
.dm-tbl .tbl { font-size: .92rem; }
.dm-tbl .tbl td { vertical-align: top; }
.dm-tbl .tbl tr.is-fast td { background: color-mix(in oklab, var(--ok) 8%, var(--card)); }
.dm-tbl .tbl tr.is-off td { opacity: .5; }
.dm-tbl .tbl td a { text-decoration: none; }
.dm-tbl .tbl td a:hover { color: var(--accent); }
.dm-trn { font-style: italic; font-family: var(--serif); font-size: 1.02em; }
.dm-dir__t { display: flex; align-items: center; gap: .5em; margin: 0 0 12px; font: 600 1rem/1.3 var(--sans); }
.dm-dir__t .i { color: var(--accent); }
.dm-rev { margin-top: 16px; border: 1px solid var(--line); border-radius: var(--r); background: var(--card); }
.dm-rev summary { display: flex; align-items: center; gap: .6em; padding: 14px 18px; cursor: pointer; font-weight: 600; list-style: none; }
.dm-rev summary::-webkit-details-marker { display: none; }
.dm-rev summary .i { color: var(--accent-2); transition: transform .35s var(--ease-out); }
.dm-rev[open] summary .i { transform: rotate(180deg); }
.dm-rev__b { padding: 0 18px 18px; }
.dm-rev__b .dm-tbl { border: 0; border-radius: 0; background: transparent; }
.dm-fl { display: grid; gap: 18px; }
.dm-fl__day .kicker { margin-bottom: 8px; }
.dm-fl__more { margin: 0; }
.dm-oths { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 20px 36px; }
.dm-oth__t { font: 500 1.25rem/1.25 var(--serif); margin: 0 0 12px; }
.dm-oth__l { list-style: none; margin: 0 0 12px; padding: 0; display: grid; }
.dm-oth__l a { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 2px 12px; padding: 11px 4px; border-top: 1px solid var(--line); text-decoration: none; transition: padding-left .2s var(--ease), color .2s; }
.dm-oth__l li:last-child a { border-bottom: 1px solid var(--line); }
.dm-oth__l a:hover { padding-left: 10px; color: inherit; }
.dm-oth__l a > .i { grid-column: 2; grid-row: 1 / span 2; color: var(--accent); transition: transform .25s var(--ease); }
.dm-oth__l a:hover > .i { transform: translateX(4px); }
.dm-oth__l b { font: 500 1.05rem/1.25 var(--serif); }
.dm-oth__l span { display: inline-flex; flex-wrap: wrap; align-items: center; gap: .3em; font-size: .82rem; color: var(--muted); font-variant-numeric: tabular-nums; }
.dm-oth__l span .i { width: 14px; height: 14px; }
.dm-blk__t td, .dm-blk__t th { white-space: nowrap; }
.dm-blk__t td a { text-decoration: none; }
.dm-blk__t td a:hover { color: var(--accent); }
.dm-blk__t td:first-child { white-space: normal; min-width: 150px; }
html:not(.js) .dm-swap { display: none; }
.mon-tabs { margin: 0 0 18px; overflow-x: auto; flex-wrap: nowrap; scrollbar-width: none; }
.mon-tabs a { display: inline-flex; align-items: center; gap: .4em; white-space: nowrap; }
.mon-tabs .i { width: 16px; height: 16px; }
.mon-inline { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.mon-hint { margin: 0 0 6px; }
.mon-main { min-width: 0; }
.mon-mt { margin-top: 22px; }
.mon-open { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.mon-stat--critical .i, .mon-stat--critical .adm-stat__n { color: var(--bad); }
.mon-stat--warn .i, .mon-stat--warn .adm-stat__n { color: var(--warn); }
.mon-stat--info .i { color: var(--accent-2); }
.mon-running { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; padding: 12px 16px; margin: 0 0 16px; border: 1px solid color-mix(in oklab, var(--accent-2) 40%, var(--line));
border-radius: var(--r-sm); background: color-mix(in oklab, var(--accent-2) 8%, var(--card)); font-size: .92rem; }
.mon-running .btn { margin-left: auto; }
.mon-spin { width: 14px; height: 14px; border-radius: 50%; border: 2px solid color-mix(in oklab, var(--accent-2) 30%, transparent); border-top-color: var(--accent-2);
animation: mon-spin 1s linear infinite; flex: none; }
@keyframes mon-spin { to { transform: rotate(360deg); } }
@media (prefers-reduced-motion: reduce) { .mon-spin { animation: none; } }
.mon-boxes { margin: 0 0 18px; align-items: stretch; }
.mon-boxes > .box { margin: 0; }
.mon-tbl td { vertical-align: top; }
.mon-c-field { max-width: 22ch; }
.mon-what { min-width: 220px; }
.mon-term { display: inline-block; margin-top: 3px; font-size: .86rem; color: var(--ink-2); overflow-wrap: anywhere; max-width: 46ch; }
.mon-sev { white-space: nowrap; }
.mon-url { overflow-wrap: anywhere; word-break: break-word; }
.mon-note { max-width: 42ch; overflow-wrap: anywhere; }
.mon-dl { margin: 0; display: grid; }
.mon-dl > div { display: grid; grid-template-columns: minmax(96px, 34%) minmax(0, 1fr); gap: 10px; padding: .5em 0; border-top: 1px dashed var(--line); font-size: .88rem; }
.mon-dl dt { color: var(--muted); }
.mon-dl dd { margin: 0; overflow-wrap: anywhere; }
.mon-warns { margin: 12px 0 0; padding: 10px 14px 10px 30px; border-radius: var(--r-sm); background: color-mix(in oklab, var(--warn) 9%, var(--card)); font-size: .85rem; }
.mon-warns .adm-h4 { margin: 0 0 6px -16px; }
.mon-warns li + li { margin-top: 4px; }
.adm-flash .mon-warns { background: none; padding: 0 0 0 18px; margin: 0; }
.mon-flash-sm { font-size: .85rem; padding: 10px 12px; }
.mon-listinfo li { line-height: 1.45; }
.mon-kindlong { margin: -6px 0 6px; }
.mon-pre { white-space: pre-line; overflow-wrap: anywhere; margin: 0; padding: 12px 14px; border-radius: var(--r-sm); background: var(--paper-2); font-size: .92rem; line-height: 1.6; max-height: 28em; overflow: auto; }
.mon-opt + .mon-opt { margin-top: 22px; padding-top: 18px; border-top: 1px dashed var(--line); }
.mon-opt .tbl-wrap { margin-bottom: 12px; }
.mon-suggest > .adm-hint { margin-top: 14px; }
.mon-diff td { vertical-align: top; }
.mon-diff .mon-old { color: var(--muted); background: color-mix(in oklab, var(--bad) 6%, transparent); text-decoration: line-through; text-decoration-color: color-mix(in oklab, var(--bad) 55%, transparent); }
.mon-diff .mon-new { background: color-mix(in oklab, var(--ok) 9%, transparent); font-weight: 500; }
.mon-scope { border: 0; padding: 0; margin: 0; display: grid; gap: 6px; }
.mon-scope legend { font-weight: 600; font-size: .88rem; color: var(--ink-2); margin-bottom: 4px; padding: 0; }
.mon-scope label { display: inline-flex; align-items: center; gap: .5em; font-size: .92rem; cursor: pointer; }
.mon-scope input { width: 17px; height: 17px; accent-color: var(--accent); }
.mon-later { margin-top: 16px; padding-top: 14px; border-top: 1px dashed var(--line); }
.mon-later .adm-hint { flex: 1 1 260px; }
.mon-difftbl { max-height: 26em; overflow: auto; }
.mon-banner { margin: 0 0 18px; padding: 14px 18px; border: 1px solid; border-radius: var(--r-sm); background: var(--card); }
.mon-banner .adm-h4 { margin: 0 0 6px; }
.mon-banner p { margin: 0 0 8px; font-size: .92rem; }
.mon-banner--critical { border-color: color-mix(in oklab, var(--bad) 45%, transparent); background: color-mix(in oklab, var(--bad) 8%, var(--card)); }
.mon-banner--critical .adm-h4 .i { color: var(--bad); }
.mon-banner--warn { border-color: color-mix(in oklab, var(--warn) 45%, transparent); background: color-mix(in oklab, var(--warn) 9%, var(--card)); }
.mon-banner--warn .adm-h4 .i { color: var(--warn); }
.mon-banner__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: .9rem; }
.mon-banner__list li { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; overflow-wrap: anywhere; }
.mon-badge { margin-left: 4px; text-decoration: none; }
.mon-badge .i { width: 12px; height: 12px; }
.mon-dash--critical { border-color: color-mix(in oklab, var(--bad) 45%, var(--line)); }
.mon-dash--warn { border-color: color-mix(in oklab, var(--warn) 45%, var(--line)); }
.mon-dash__n { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 6px; }
.mon-dash p:last-child { margin-bottom: 0; }
@media (max-width: 700px) {
.mon-tblwrap { border: 0; background: none; overflow: visible; }
.mon-tbl, .mon-tbl tbody { display: block; }
.mon-tbl thead { display: none; }
.mon-tbl tr { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; padding: 12px 14px; margin: 0 0 10px; border: 1px solid var(--line); border-radius: var(--r-sm); background: var(--card); }
.mon-tbl td { display: block; padding: 0; border: 0; }
.mon-tbl .mon-c-sev { grid-column: 1; }
.mon-tbl .mon-c-st { grid-column: 2; grid-row: 1; justify-self: end; }
.mon-tbl .mon-what, .mon-tbl .mon-c-item { grid-column: 1 / -1; }
.mon-tbl .mon-c-field { grid-column: 1; max-width: none; color: var(--muted); }
.mon-tbl .mon-c-seen { grid-column: 2; justify-self: end; }
}
@media (max-width: 760px) {
.mon-open { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
.mon-open .adm-stat { padding: 12px; }
.mon-running .btn { margin-left: 0; }
.mon-what { min-width: 0; }
.mon-term { max-width: none; }
.mon-dl > div { grid-template-columns: minmax(0, 1fr); gap: 2px; }
}