/* Components for the newer subpages (novinky, mesta, doprava, udalosti, nabor) and shop extras.
   Loaded after styles.css + theme.css + app.css; uses their tokens. */
.x-page{padding-top:150px;padding-bottom:90px;background:radial-gradient(ellipse at 90% 0,#f5e6630b,transparent 48%)}
.x-page code,.x-callout code{font:500 .875em/1.4 ui-monospace,SFMono-Regular,Consolas,monospace;padding:1px 6px;border:1px solid var(--line);background:var(--wash);color:var(--ink);white-space:nowrap}
.x-section{margin-top:56px}
.x-section>h2,.x-panel>h2,.x-day>h2{font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.035em;margin-bottom:18px}
.x-status{color:var(--muted);font-size:.9375rem;margin:-10px 0 18px}
.x-status:empty{display:none}
.x-note{margin-top:12px;color:var(--muted2);font-size:.875rem}
.x-empty{color:var(--muted);padding:18px 0}
.x-muted{color:var(--muted)}
.x-callout{margin-top:56px;padding:20px 24px;border:1px solid var(--line);border-left:2px solid var(--accent);background:var(--surface);color:var(--muted)}
.x-callout b{color:var(--ink)}
.x-callout a{color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px}
.x-chip{display:inline-flex;align-items:center;padding:4px 10px;border:1px solid var(--line);background:var(--wash);font-size:.8125rem;font-weight:600;color:var(--ink)}
.x-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.x-progress{position:relative;height:10px;margin-top:14px;background:var(--wash);border:1px solid var(--line);overflow:hidden}
.x-progress i{position:absolute;inset:0 auto 0 0;width:0;background:linear-gradient(90deg,var(--accent),var(--accent2));transition:width .8s ease}
.x-progress.is-thin{height:6px;border:0}
.x-toast{position:fixed;bottom:22px;left:50%;z-index:95;max-width:calc(100vw - 32px);padding:12px 18px;background:var(--accent);color:#1a1400;font-weight:600;font-size:.9375rem;transform:translate(-50%,140px);transition:transform .35s;pointer-events:none}
.x-toast.is-shown{transform:translate(-50%,0)}
.x-steps{list-style:none;margin:0;padding:0;counter-reset:step;display:grid;gap:12px}
.x-steps li{counter-increment:step;display:grid;grid-template-columns:40px 1fr;gap:2px 14px;padding:16px 18px;border:1px solid var(--line);background:var(--surface)}
.x-steps li::before{content:counter(step,decimal-leading-zero);grid-row:span 2;font:500 1.05rem/1.5 var(--heading);color:var(--accent-ink)}
.x-steps b{font-weight:600}
.x-steps span{color:var(--muted);font-size:.9375rem}
.x-panel{padding:26px;border:1px solid var(--line);background:var(--surface)}
.x-panel .x-steps li{background:var(--bg)}
.x-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:56px}
.x-two>.x-section{margin-top:0}
.x-table{width:100%;border-collapse:collapse;font-size:.9375rem}
.x-table th,.x-table td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
.x-table tbody th{font-weight:500;color:var(--muted)}
.x-table thead th{font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--muted2);border-bottom-color:var(--line)}
.x-table tr:last-child>*{border-bottom:0}
.x-table .is-num{text-align:right;white-space:nowrap}

/* novinky */
.live-version{display:inline-flex;align-items:center;gap:10px;margin:-16px 0 36px;padding:8px 14px;border:1px solid var(--line);background:var(--surface);font-size:.875rem;font-weight:600}
.live-version[hidden]{display:none}
.live-dot{width:9px;height:9px;border-radius:50%;background:#3ecf7a;box-shadow:0 0 0 4px #3ecf7a2e}
.changelog{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.release{display:grid;grid-template-columns:190px minmax(0,1fr);gap:28px;padding:30px;border:1px solid var(--line);background:var(--surface)}
.release.is-latest{border-color:#f5e66355;border-top:2px solid var(--accent);background:radial-gradient(ellipse at 100% 0,#f5e66314,transparent 55%),var(--surface)}
.release-side{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.release-side h2{font-size:2.4rem;line-height:1;letter-spacing:-.04em;font-weight:500}
.release.is-latest .release-side h2{color:var(--accent-ink)}
.release-side time{color:var(--muted);font-size:.875rem}
.release-tag,.release-live{font-size:.6875rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;padding:3px 8px}
.release-tag{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#1a1400}
.release-live{border:1px solid #3ecf7a66;color:#3ecf7a}
[data-theme="light"] .release-live{color:#1d7a3e;border-color:#1d7a3e66}
.release-title{font-size:1.45rem;font-weight:500;letter-spacing:-.025em;margin-bottom:18px}
.release-groups{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px 28px}
.release-group h4{margin:0 0 6px;font:700 .8125rem/1.4 Inter,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--ink2)}
.release-group ul{margin:0;padding:0;list-style:none}
.release-group li{position:relative;padding:4px 0 4px 16px;color:var(--muted);font-size:.9375rem;line-height:1.6}
.release-group li::before{content:"";position:absolute;left:1px;top:calc(4px + .8em - 3px);width:6px;height:6px;background:var(--accent);opacity:.8}
.release-group strong{color:var(--ink);font-weight:600}

/* mesta */
.x-city-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}
.x-city-card{display:flex;flex-direction:column;gap:10px;padding:24px;border:1px solid var(--line);border-top:2px solid #f5e66366;background:var(--surface);transition:transform .2s,border-color .2s}
.x-city-card:hover{transform:translateY(-4px);border-color:#f5e66388}
.x-city-card h2{font-size:1.5rem;letter-spacing:-.025em;font-weight:500;line-height:1.2}
.x-city-card-top{display:flex;align-items:center;gap:16px}
.x-kicker{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted2)}
.x-city-style{color:var(--muted);font-size:.9375rem}
.x-city-level{display:flex;align-items:center;gap:10px;flex-wrap:wrap;font-size:.8125rem}
.x-city-level .x-chip{color:var(--accent-ink)}
.x-facts{margin:4px 0 0;display:grid;gap:6px}
.x-facts div{display:flex;justify-content:space-between;gap:12px;padding-bottom:6px;border-bottom:1px solid var(--line);font-size:.9375rem}
.x-facts dt{color:var(--muted)}
.x-facts dd{margin:0;font-weight:500;text-align:right;overflow-wrap:anywhere}
.x-more{margin-top:auto;padding-top:8px;color:var(--accent-ink);font-weight:600;font-size:.875rem}
.x-back{display:inline-flex;gap:8px;align-items:center;min-height:44px;color:var(--muted);font-weight:500;margin-bottom:12px}
.x-back:hover{color:var(--accent-ink)}
.x-city-hero{display:flex;gap:32px;align-items:center;margin-bottom:34px}
.crest.is-big{width:120px;height:140px}
.crest.is-big::before{inset:7px}
.crest.is-big .crest-charge{font-size:2.8rem;margin-top:-16px}
.x-city-head{min-width:0}
.x-city-head .eyebrow{margin-bottom:12px}
.x-city-head h1{font-size:clamp(2.6rem,6vw,4.8rem);font-weight:500;line-height:1.05;letter-spacing:-.05em;overflow-wrap:anywhere}
.x-city-head .x-city-style{margin-top:10px;font-size:1.05rem}
.x-city-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.x-city-actions .primary-action{gap:12px;cursor:pointer;min-height:48px}
.x-copy code{background:#0000001a;border-color:#00000026;color:#1a1400}
.x-ghost{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:10px 18px;border:1px solid var(--line);background:var(--wash);font-weight:600;font-size:.9375rem}
.x-ghost:hover{border-color:var(--accent-ink);color:var(--accent-ink)}
.x-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.x-stat{display:flex;flex-direction:column;gap:4px;padding:18px 20px;border:1px solid var(--line);border-top:2px solid #f5e66366;background:var(--surface);min-width:0}
.x-stat-label{font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--muted2)}
.x-stat strong{font:500 1.6rem/1.2 var(--heading);letter-spacing:-.03em;overflow-wrap:anywhere}
.x-stat-note{font-size:.8125rem;color:var(--muted)}
.x-level{padding:26px;border:1px solid var(--line);background:var(--surface)}
.x-level-top{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.x-level-top h2{font-size:1.5rem;letter-spacing:-.03em}
.x-level-pct{font:600 1.3rem var(--heading);color:var(--accent-ink)}
.x-level-steps{list-style:none;margin:16px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);gap:6px}
.x-level-steps li{padding:8px 10px;border:1px solid var(--line);font-size:.8125rem;font-weight:600;color:var(--muted2);text-align:center}
.x-level-steps li.is-done{color:var(--ink);background:var(--wash)}
.x-level-steps li.is-current{color:#1a1400;background:linear-gradient(135deg,var(--accent),var(--accent2));border-color:transparent}
.x-timeline{list-style:none;margin:0;padding:0 0 0 22px;border-left:2px solid var(--line)}
.x-timeline li{position:relative;padding:0 0 22px 8px}
.x-timeline li::before{content:"";position:absolute;left:-29px;top:6px;width:12px;height:12px;background:var(--accent);box-shadow:0 0 0 4px var(--bg)}
.x-timeline time{display:block;font-size:.8125rem;font-weight:600;color:var(--accent-ink)}
.x-timeline p{color:var(--ink2)}

/* doprava */
.x-models{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.x-model{padding:24px;border:1px solid var(--line);border-top:2px solid #f5e66366;background:var(--surface)}
.x-model-ico{font-size:2rem;line-height:1}
.x-model h2{font-size:1.25rem;font-weight:500;letter-spacing:-.02em;margin:14px 0 8px}
.x-model p{color:var(--muted);font-size:.9375rem;line-height:1.65}
.x-model code{display:inline-block;margin-top:4px}
.x-filters{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.x-filters[hidden]{display:none}
.x-filter{min-height:40px;padding:8px 14px;border:1px solid var(--line);background:var(--wash);color:var(--ink2);font-weight:600;font-size:.875rem;cursor:pointer}
.x-filter[aria-pressed="true"]{background:linear-gradient(135deg,var(--accent),var(--accent2));color:#1a1400;border-color:transparent}
.x-table-wrap{border:1px solid var(--line);background:var(--surface);overflow-x:auto;padding:4px 14px}
.x-table-wrap>.x-empty{padding:18px 4px}
.x-lines{min-width:520px}
.x-kind{white-space:nowrap;font-weight:600}
.x-group-ico{font-size:1rem;letter-spacing:0}
.x-cmds{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:10px}
.x-cmd{display:flex;align-items:baseline;gap:14px;padding:14px 16px;border:1px solid var(--line);background:var(--surface)}
.x-cmd code{flex-shrink:0;color:var(--accent-ink)}
.x-cmd span{color:var(--muted);font-size:.9375rem}

/* udalosti */
.x-active{display:flex;gap:18px;align-items:center;margin-bottom:22px;padding:20px 24px;border:1px solid #ff7a7a55;border-left:3px solid #ff7a7a;background:linear-gradient(90deg,#ff7a7a1c,transparent 70%),var(--surface)}
.x-active.is-meteor{border-color:#baa4ef55;border-left-color:#baa4ef;background:linear-gradient(90deg,#baa4ef1c,transparent 70%),var(--surface)}
.x-active h2{font-size:1.3rem;letter-spacing:-.02em}
.x-active p{color:var(--muted);margin-top:4px}
.x-active-pulse{width:14px;height:14px;flex-shrink:0;border-radius:50%;background:#ff7a7a;animation:x-pulse 1.6s ease-in-out infinite}
.x-active.is-meteor .x-active-pulse{background:#baa4ef}
@keyframes x-pulse{50%{box-shadow:0 0 0 10px transparent;opacity:.5}0%{box-shadow:0 0 0 0 #ff7a7a66}}
.x-day{margin-top:44px}
.x-day:first-child{margin-top:0}
.x-day>h2{font-size:1.15rem;font-family:Inter,system-ui,sans-serif;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink);margin-bottom:14px}
.x-events{display:grid;gap:12px}
.x-event{display:grid;grid-template-columns:96px minmax(0,1fr) auto;gap:22px;align-items:center;padding:20px 22px;border:1px solid var(--line);background:var(--surface)}
.x-event-date{display:flex;flex-direction:column;align-items:center;padding:10px 6px;border:1px solid var(--line);background:var(--bg);text-align:center;line-height:1.3}
.x-event-date b{font:700 .75rem/1.4 Inter,system-ui,sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink)}
.x-event-date span{font:500 1.15rem/1.3 var(--heading)}
.x-event-date .x-event-time{font:500 .8125rem/1.4 Inter,system-ui,sans-serif;color:var(--muted)}
.x-event-main h3{font-size:1.25rem;font-weight:500;letter-spacing:-.02em}
.x-event-main p{color:var(--muted);font-size:.9375rem;margin-top:4px}
.x-event-meta{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:.8125rem!important}
.x-event-side{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.x-countdown{display:flex;gap:6px;font-size:.75rem;color:var(--muted)}
.x-countdown span{display:flex;align-items:baseline;gap:1px;min-width:46px;justify-content:center;padding:6px 6px;border:1px solid var(--line);background:var(--bg)}
.x-countdown b{font:600 1.15rem/1 var(--heading);color:var(--ink);font-variant-numeric:tabular-nums}
.x-countdown.is-live{padding:8px 12px;border:1px solid #3ecf7a66;color:#3ecf7a;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
[data-theme="light"] .x-countdown.is-live{color:#1d7a3e}
.x-remind{display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:8px 14px;border:1px solid var(--line);background:var(--wash);color:var(--ink);font-weight:600;font-size:.875rem;cursor:pointer}
.x-remind:hover:not(:disabled){border-color:var(--accent-ink)}
.x-remind[aria-pressed="true"]{border-color:var(--accent-ink);color:var(--accent-ink)}
.x-remind:disabled{opacity:.45;cursor:default}

/* nabor */
.x-roles{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:16px}
.x-role{--rank:var(--role);padding:26px;border:1px solid var(--line);border-top:2px solid var(--role);background:var(--surface)}
.x-role h2{font-size:1.4rem;font-weight:500;letter-spacing:-.025em;margin:16px 0 8px}
.x-role p{color:var(--muted);font-size:.9375rem}
.x-role ul{margin:14px 0 0;padding:0;list-style:none}
.x-role li{position:relative;padding:4px 0 4px 18px;font-size:.9375rem;color:var(--ink2)}
.x-role li::before{content:"✓";position:absolute;left:0;color:var(--role);font-weight:700}
.x-checks{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.x-checks li{position:relative;padding:14px 16px 14px 44px;border:1px solid var(--line);background:var(--surface);color:var(--ink2)}
.x-checks li::before{content:"✓";position:absolute;left:16px;top:14px;color:var(--accent-ink);font-weight:700}
.x-checks a{color:var(--accent-ink);text-decoration:underline;text-underline-offset:3px}
.x-form-card{max-width:860px;padding:34px;border:1px solid var(--line);border-top:2px solid var(--accent);background:var(--surface)}
.x-form-card>h2{font-size:clamp(1.6rem,3vw,2.2rem);letter-spacing:-.035em}
.x-form-card>.x-muted{margin:6px 0 24px;font-size:.9375rem}
.x-grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}
.x-field{margin:0 0 18px;border:0;padding:0;min-width:0}
.x-field>label,.x-field>legend{display:block;margin-bottom:6px;font-weight:600;font-size:.9375rem}
.x-field>label span[aria-hidden],.x-field>legend span[aria-hidden],.x-consent span[aria-hidden]{color:var(--accent-ink)}
.x-field input[type=text],.x-field input[type=number],.x-field textarea{width:100%;min-height:48px;padding:11px 14px;border:1px solid var(--field);background:var(--bg);color:var(--ink);font:400 1rem/1.5 Inter,system-ui,sans-serif;border-radius:0}
.x-field textarea{resize:vertical;min-height:110px}
.x-field input:focus-visible,.x-field textarea:focus-visible{outline:2px solid var(--accent-ink);outline-offset:2px;border-color:var(--accent-ink)}
.x-field input[aria-invalid="true"],.x-field textarea[aria-invalid="true"]{border-color:var(--danger)}
.x-field ::placeholder{color:var(--muted2);opacity:.85}
.x-role-pick{display:flex;flex-wrap:wrap;gap:10px}
.x-role-pick legend{width:100%}
.x-role-pick label{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:10px 16px;border:1px solid var(--field);background:var(--bg);font-weight:600;cursor:pointer}
.x-role-pick label:has(input:checked){border-color:var(--accent-ink);background:var(--wash);color:var(--accent-ink)}
.x-role-pick input,.x-consent input{width:18px;height:18px;accent-color:#e0b400;margin:0}
.x-role-pick .x-error{width:100%}
.x-hint{margin-top:6px;font-size:.8125rem;color:var(--muted2);display:flex;justify-content:space-between;gap:12px}
.x-count{margin-left:auto;font-variant-numeric:tabular-nums}
.x-error{margin-top:6px;font-size:.875rem;color:var(--danger);font-weight:500}
.x-error:empty{display:none}
.x-hp{position:absolute!important;left:-10000px;width:1px;height:1px;overflow:hidden}
.x-consent{display:flex;gap:12px;align-items:flex-start;font-size:.9375rem;color:var(--ink2);cursor:pointer}
.x-consent input{margin-top:3px;flex-shrink:0}
.x-form-foot{display:flex;flex-wrap:wrap;gap:16px;align-items:center;margin-top:24px}
.x-form-foot .primary-action{cursor:pointer;gap:20px}
.x-form-foot .primary-action:disabled{opacity:.6;cursor:progress}
.x-form-msg{flex:1;min-width:220px;font-size:.9375rem;font-weight:500}
.x-form-msg.is-ok{color:#3ecf7a}
[data-theme="light"] .x-form-msg.is-ok{color:#1d7a3e}
.x-form-msg.is-error{color:var(--danger)}
.x-form-msg.is-info{color:var(--muted)}

/* obchod extras */
.shop-goal{margin:-8px 0 40px}
.shop-goal .goal{--goal-radius:0;border-top:2px solid var(--accent)}
.x-compare-section{margin-top:100px}
.x-compare-scroll{position:relative;overflow-x:auto;border:1px solid var(--line);background:var(--surface);-webkit-overflow-scrolling:touch}
.x-compare{width:100%;min-width:900px;border-collapse:separate;border-spacing:0;font-size:.9375rem}
.x-compare th,.x-compare td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:center;white-space:nowrap}
.x-compare thead th{position:sticky;top:0;background:var(--surface);font:700 .875rem/1.3 var(--heading);letter-spacing:.06em;vertical-align:bottom}
.x-compare thead th span{display:block;width:10px;height:10px;margin:0 auto 6px;background:var(--rc);box-shadow:0 0 12px var(--rc)}
.x-compare th[scope=row]{text-align:left;font-weight:500;color:var(--ink2);white-space:normal;min-width:220px}
.x-compare .x-sticky{position:sticky;left:0;z-index:2;background:var(--surface);box-shadow:1px 0 0 var(--line)}
.x-compare thead .x-sticky{z-index:3}
.x-compare tbody tr:hover>*{background:color-mix(in srgb,var(--surface) 92%,var(--ink))}
.x-compare .is-hot{background:color-mix(in srgb,var(--surface) 90%,#f5e663)}
.x-compare .x-group th{padding-top:18px;font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--accent-ink);background:var(--surface)}
.x-compare .x-yes{color:#3ecf7a;font-weight:700}
[data-theme="light"] .x-compare .x-yes{color:#1d7a3e}
.x-compare .x-no{color:var(--muted2)}
.x-compare .x-price td{font-weight:600}
.x-compare .x-price small{display:block;font-weight:400;font-size:.75rem;color:var(--muted2)}
.x-compare-note{margin-top:12px;color:var(--muted2);font-size:.8125rem}
.x-compare-hint{display:none;margin-bottom:10px;color:var(--muted2);font-size:.8125rem}

@media(max-width:1100px){
  .x-models{grid-template-columns:repeat(2,minmax(0,1fr))}
  .x-stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .x-roles{grid-template-columns:1fr}
}
@media(max-width:760px){
  .x-page{padding-top:120px;padding-bottom:56px}
  .x-section,.x-two{margin-top:44px}
  .x-two{grid-template-columns:1fr}
  .release{grid-template-columns:1fr;gap:16px;padding:22px}
  .release-side{flex-direction:row;flex-wrap:wrap;align-items:baseline;gap:6px 12px}
  .release-side h2{font-size:2rem}
  .x-city-hero{flex-direction:column;align-items:flex-start;gap:18px}
  .crest.is-big{width:84px;height:98px}
  .crest.is-big .crest-charge{font-size:2rem;margin-top:-10px}
  .x-stats{gap:10px}
  .x-stat{padding:14px 16px}
  .x-stat strong{font-size:1.3rem}
  .x-level-steps{grid-template-columns:repeat(2,1fr)}
  .x-panel,.x-level{padding:20px}
  .x-models{grid-template-columns:1fr}
  .x-cmds{grid-template-columns:1fr}
  .x-cmd{flex-direction:column;gap:6px}
  .x-event{grid-template-columns:72px minmax(0,1fr);gap:14px;padding:16px}
  .x-event-side{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;justify-content:space-between;align-items:center}
  .x-countdown span{min-width:0;padding:5px 7px}
  .x-checks{grid-template-columns:1fr}
  .x-form-card{padding:22px}
  .x-grid2{grid-template-columns:1fr}
  .shop-goal{margin-bottom:30px}
  .x-compare-section{margin-top:72px}
  .x-compare-hint{display:block}
  .x-compare th[scope=row]{min-width:150px;max-width:170px}
}
.x-compare .x-group th{text-align:left}
.x-sticky-label{position:sticky;left:12px}
/* transport lines as stacked cards on phones */
@media(max-width:600px){
  .x-table-wrap{overflow:visible}
  .x-lines{min-width:0}
  .x-lines thead{display:none}
  .x-lines tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px 12px;padding:12px 0;border-bottom:1px solid var(--line)}
  .x-lines tr:last-child{border-bottom:0}
  .x-lines td{padding:0;border:0;text-align:left}
  .x-lines td:nth-child(1){grid-area:1/1}
  .x-lines td:nth-child(4){grid-area:1/2;font-weight:600}
  .x-lines td:nth-child(2){grid-area:2/1/3/3}
  .x-lines td:nth-child(3){grid-area:3/1}
  .x-lines td:nth-child(5){grid-area:3/2;color:var(--muted)}
  .x-lines td:nth-child(2)::before{content:"Odkud: ";color:var(--muted2)}
  .x-lines td:nth-child(3)::before{content:"Kam: ";color:var(--muted2)}
}

/* event (EVENT rank page + shop teaser): purple -> pink */
:root{--ev1:#9b3cff;--ev2:#ff4fb4;--ev-fill:linear-gradient(135deg,#8f2cf0,#e23d9c);--ev-ink:#d2a2ff;--ev-pink-ink:#ff8fcf;--ev-grad-text:linear-gradient(90deg,#b56cff,#ff6fc2)}
:root[data-theme="light"]{--ev-ink:#7a1fd1;--ev-pink-ink:#b0106c;--ev-grad-text:linear-gradient(90deg,#7a1fd1,#c8157f)}
.x-page.ev-page{background:radial-gradient(ellipse at 90% 0,#9b3cff1c,transparent 50%),radial-gradient(ellipse at 0 35%,#ff4fb40c,transparent 45%)}
[data-theme="light"] .x-page.ev-page{background:radial-gradient(ellipse at 90% 0,#9b3cff24,transparent 50%),radial-gradient(ellipse at 0 35%,#ff4fb412,transparent 45%)}
.ev-page .eyebrow{color:var(--ev-ink)!important}
.ev-page ::selection{background:#c86cff;color:#14001f}
.ev-text,.ev-hero h1 em{background:var(--ev-grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
.ev-hero{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:48px;align-items:center}
.ev-hero h1{margin-top:20px;font-size:clamp(3rem,6vw,5.5rem);font-weight:500;line-height:1.08;letter-spacing:-.055em}
.ev-hero h1 em{font-style:normal;font-weight:700;padding-right:.04em}
.ev-lead{margin-top:24px;max-width:620px;color:var(--muted);font-size:1.05rem}
.ev-lead b{color:var(--ink)}
.ev-tags{margin-top:22px}
.ev-tags .x-chip{border-color:color-mix(in srgb,var(--ev1) 45%,transparent);background:color-mix(in srgb,var(--ev1) 10%,transparent);color:var(--ev-ink)}
.ev-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.ev-button{display:inline-flex;align-items:center;gap:12px;min-height:48px;padding:10px 20px;background:var(--ev-fill);color:#fff!important;font-weight:600;font-size:.9375rem;box-shadow:0 12px 30px -12px #b03cffaa;transition:transform .15s,box-shadow .15s}
.ev-button:hover{transform:translateY(-2px);box-shadow:0 16px 34px -12px #e23d9caa}
.ev-button:focus-visible{outline:2px solid var(--ev-ink);outline-offset:3px}
.ev-page .x-ghost:hover{border-color:var(--ev-ink);color:var(--ev-ink)}
.ev-preview{margin:0;padding:20px;min-width:0;border:1px solid color-mix(in srgb,var(--ev1) 35%,var(--line));background:linear-gradient(160deg,#9b3cff17,transparent 60%),var(--surface);box-shadow:0 30px 60px -40px #9b3cff99}
.ev-preview-head{display:flex;align-items:center;gap:8px;margin-bottom:12px;font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted2)}
.ev-dot{width:8px;height:8px;border-radius:50%;background:#3ecf7a;box-shadow:0 0 0 3px #3ecf7a2e}
.ev-line{margin-top:6px;padding:9px 12px;background:#0d0f16eb;color:#e6e9ee;font:500 .875rem/1.55 ui-monospace,SFMono-Regular,Consolas,monospace;overflow-wrap:anywhere}
.ev-line b{color:#fff;font-weight:700}
.ev-line .ev-text{background:linear-gradient(90deg,#c58bff,#ff7cc8);-webkit-background-clip:text;background-clip:text}
.ev-line-join{color:#e9c8ff}
.ev-muted{color:#9aa3ae}
.ev-rank-plain{color:#f5e663;font-weight:700;letter-spacing:.06em}
.ev-preview-foot{margin-top:12px;color:var(--muted);font-size:.8125rem}
.ev-badge{display:inline-block;padding:1px 8px;background:var(--ev-fill);color:#fff;font:700 .75rem/1.6 'Space Grotesk',system-ui,sans-serif;letter-spacing:.12em;text-shadow:0 1px 0 #0003;vertical-align:1px;white-space:nowrap}
.ev-badge.is-small{padding:0 7px;font-size:.6875rem}
.ev-tag{display:inline-block;padding:2px 8px;border:1px solid color-mix(in srgb,var(--ev2) 55%,transparent);background:color-mix(in srgb,var(--ev2) 13%,transparent);color:var(--ev-pink-ink);font:700 .6875rem/1.5 Inter,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}
.ev-steps li::before{color:var(--ev-ink)}
.ev-steps a,.ev-perk a,.ev-faq a,.ev-empty a,.ev-callout a{color:var(--ev-ink);text-decoration:underline;text-underline-offset:3px}
.ev-steps code{white-space:normal}
.ev-durations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:16px}
.ev-duration{padding:22px;border:1px solid var(--line);border-top:2px solid color-mix(in srgb,var(--ev1) 65%,transparent);background:var(--surface);min-width:0}
.ev-duration-kicker{font-size:.75rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--muted2)}
.ev-duration strong{display:block;margin:6px 0;font:500 2rem/1.1 var(--heading);letter-spacing:-.03em}
.ev-duration p{color:var(--muted);font-size:.9375rem}
.ev-duration.is-forever{border:2px solid transparent;background:radial-gradient(ellipse at 100% 0,#ff4fb41f,transparent 60%) padding-box,linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(135deg,var(--ev1),var(--ev2)) border-box}
.ev-duration.is-forever strong{background:var(--ev-grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;font-weight:700}
.ev-stack{display:flex;gap:14px;align-items:flex-start;margin-top:14px;padding:16px 18px;border:1px dashed color-mix(in srgb,var(--ev1) 45%,var(--line));color:var(--muted)}
.ev-stack b{color:var(--ink)}
.ev-stack-ico{display:grid;place-items:center;flex-shrink:0;width:28px;height:28px;background:var(--ev-fill);color:#fff;font-weight:700}
.ev-perks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.ev-perk{display:flex;flex-direction:column;gap:10px;min-width:0;padding:24px;border:1px solid var(--line);border-top:2px solid color-mix(in srgb,var(--ev2) 55%,transparent);background:linear-gradient(150deg,#9b3cff0f,transparent 55%),var(--surface)}
.ev-perk.is-wide{grid-column:span 2}
.ev-perk.is-forever{grid-column:1/-1;border-color:color-mix(in srgb,var(--ev1) 30%,var(--line));border-top-color:var(--ev1);background:radial-gradient(ellipse at 100% 0,#ff4fb41c,transparent 55%),linear-gradient(150deg,#9b3cff17,transparent 55%),var(--surface)}
.ev-perk-ico{font-size:1.8rem;line-height:1}
.ev-perk h3{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;font:500 1.3rem/1.25 var(--heading);letter-spacing:-.02em}
.ev-perk h3 code{font-size:.8em}
.ev-perk p{color:var(--muted);font-size:.9375rem;line-height:1.65}
.ev-perk p b{color:var(--ink)}
.ev-perk code{white-space:normal}
.ev-mini{margin-top:auto;padding-top:4px;gap:6px}
.ev-mini .x-chip{padding:3px 8px;font-size:.75rem}
.ev-facts{margin:0;display:grid;gap:8px}
.ev-facts div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding-bottom:8px;border-bottom:1px solid var(--line)}
.ev-facts dt{color:var(--muted)}
.ev-facts dd{margin:0;font:600 1.2rem/1.2 var(--heading);color:var(--ev-ink);white-space:nowrap}
.ev-faq{display:grid;gap:10px;max-width:900px}
.ev-faq details{border:1px solid var(--line);background:var(--surface)}
.ev-faq details[open]{border-color:color-mix(in srgb,var(--ev1) 40%,var(--line))}
.ev-faq summary{position:relative;display:block;min-height:44px;padding:16px 50px 16px 18px;font-weight:600;cursor:pointer;list-style:none}
.ev-faq summary::-webkit-details-marker{display:none}
.ev-faq summary::after{content:"+";position:absolute;right:18px;top:50%;transform:translateY(-50%);font:500 1.4rem/1 var(--heading);color:var(--ev-ink);transition:transform .2s}
.ev-faq details[open] summary::after{transform:translateY(-50%) rotate(45deg)}
.ev-faq summary:focus-visible{outline:2px solid var(--ev-ink);outline-offset:2px}
.ev-faq details p{padding:0 18px 18px;color:var(--muted);line-height:1.7}
.ev-player{position:relative;border-top-color:transparent}
.ev-player::before{content:"";position:absolute;left:-1px;right:-1px;top:-2px;height:2px;background:linear-gradient(90deg,var(--ev1),var(--ev2))}
.ev-player img{box-shadow:0 0 0 2px color-mix(in srgb,var(--ev1) 45%,transparent),0 10px 24px -12px #9b3cffaa}
.ev-empty{grid-column:1/-1;padding:22px;border:1px dashed color-mix(in srgb,var(--ev1) 45%,var(--line));background:var(--surface);color:var(--muted)}
.ev-empty b{color:var(--ink)}
.ev-callout{border-left-color:var(--ev1)}
.x-compare-note a{color:var(--ev-ink);text-decoration:underline;text-underline-offset:3px}
/* shop teaser under the rank grid (obchod.js) */
.ev-shop{display:flex;flex-wrap:wrap;align-items:center;gap:16px 28px;margin-top:18px;padding:24px 26px;border:1px solid transparent;background:radial-gradient(ellipse at 100% 0,#ff4fb41c,transparent 55%) padding-box,linear-gradient(150deg,#9b3cff17,transparent 60%) padding-box,linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(135deg,var(--ev1),var(--ev2)) border-box}
.crate-odds{margin-top:18px;padding:24px 26px;border:1px solid var(--line,#ffffff22);background:var(--surface)}
.crate-odds h3{margin:0 0 6px}
.crate-odds-note{margin:0 0 16px;color:var(--muted,inherit)}
.crate-odds-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.crate-odds-col ul{margin:8px 0 0;padding-left:18px}
.crate-odds-tag{font-weight:700;letter-spacing:.06em;text-transform:uppercase;font-size:.8rem}
.crate-odds-col.is-common .crate-odds-tag{color:var(--rank-builder)}
.crate-odds-col.is-rare .crate-odds-tag{color:var(--rank-helper)}
.crate-odds-col.is-legendary .crate-odds-tag{color:var(--rank-dev)}
.ev-shop-copy{flex:1 1 320px;min-width:0}
.ev-shop-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px}
.ev-shop-kicker{font-size:.75rem;font-weight:600;letter-spacing:.1em;color:var(--ev-ink)}
.ev-shop h3{margin:10px 0 6px;font-size:1.6rem;font-weight:500;letter-spacing:-.03em}
.ev-shop h3 span{background:var(--ev-grad-text);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;font-weight:700}
.ev-shop p{color:var(--muted);font-size:.9375rem;line-height:1.65}
.ev-shop p b{color:var(--ink);font-weight:500}
@media(max-width:1100px){
  .ev-hero{grid-template-columns:1fr;gap:32px}
  .ev-preview{max-width:620px}
  .ev-perks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ev-perk.is-forever{grid-column:auto}
}
@media(max-width:760px){
  .ev-hero h1{font-size:clamp(2.6rem,11vw,4.5rem)}
  .ev-durations,.ev-perks{grid-template-columns:1fr}
  .ev-perk.is-wide,.ev-perk.is-forever{grid-column:auto}
  .ev-perk,.ev-duration{padding:20px}
  .ev-preview{padding:16px}
  .ev-shop{padding:20px}
  .ev-shop .ev-button{width:100%;justify-content:center}
}

/* hraci (player profiles) */
.pl-search{display:flex;gap:10px;margin-bottom:22px;max-width:620px}
.pl-search input{flex:1;min-width:0;min-height:54px;padding:12px 16px;border:1px solid var(--field);background:var(--surface);color:var(--ink);font:inherit;font-size:1rem}
.pl-search input:focus{outline:2px solid var(--accent-ink);outline-offset:1px}
.pl-search .primary-action{cursor:pointer;gap:12px}
.pl-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px}
.pl-card{display:flex;align-items:center;gap:14px;padding:16px;border:1px solid var(--line);border-top:2px solid #f5e66366;background:var(--surface);transition:transform .2s,border-color .2s;min-width:0}
.pl-card:hover{transform:translateY(-3px);border-color:#f5e66388}
.pl-card[hidden]{display:none}
.pl-card-head{width:56px;height:56px;flex:none;image-rendering:pixelated;background:var(--wash)}
.pl-card-text{display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.pl-card-name{display:flex;align-items:center;gap:8px;font-size:1.0625rem;font-weight:600;overflow-wrap:anywhere}
.pl-card-meta{font-size:.8125rem;color:var(--muted)}
.pl-dot{width:9px;height:9px;border-radius:50%;background:var(--muted2);flex:none;opacity:.6}
.pl-dot.is-on{background:#4ade80;opacity:1;box-shadow:0 0 0 3px #4ade8033}
.pl-badge{display:inline-flex;align-items:center;gap:7px;padding:3px 10px;border:1px solid color-mix(in srgb,var(--rank,var(--muted2)) 55%,transparent);color:var(--rank,var(--ink2));font-size:.75rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.pl-badge.is-team{--rank:var(--accent-ink)}
.pl-badge.is-online,.pl-badge.is-offline{text-transform:none;letter-spacing:0;font-weight:600;color:var(--ink2);border-color:var(--line)}
.pl-hero{display:flex;align-items:center;gap:26px;margin:8px 0 26px}
.pl-head{width:112px;height:112px;flex:none;image-rendering:pixelated;border:1px solid var(--line);background:var(--wash)}
.pl-hero h1{font-size:clamp(2.2rem,6vw,4rem);letter-spacing:-.05em;line-height:1.05;overflow-wrap:anywhere;margin:6px 0 12px}
.pl-badges{display:flex;flex-wrap:wrap;gap:8px}
.pl-ranks{list-style:none;margin:0 0 12px;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:10px}
.pl-ranks li{display:flex;align-items:center;gap:14px;padding:12px 16px;border:1px solid var(--line);background:var(--surface)}
.pl-rank-place{font:600 1.35rem/1 var(--heading);min-width:2.2em;color:var(--muted2)}
.pl-ranks li.is-top .pl-rank-place{color:var(--accent-ink)}
.pl-ranks li.is-1{border-color:#f5e66388}
.pl-rank-label{flex:1;font-weight:500}
.pl-rank-value{color:var(--muted);font-size:.875rem;text-align:right}
.pl-ach-sum{margin-bottom:10px;color:var(--muted)}
.pl-ach-sum b{color:var(--ink);font-size:1.25rem}
.pl-ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px;margin-top:18px}
.pl-ach{display:flex;gap:14px;align-items:flex-start;padding:14px 16px;border:1px solid var(--line);background:var(--surface);opacity:.55;filter:grayscale(1)}
.pl-ach.is-got{opacity:1;filter:none;border-color:#f5e66355}
.pl-ach-icon{font-size:1.8rem;line-height:1}
.pl-ach-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.pl-ach-text span{font-size:.875rem;color:var(--muted)}
.pl-ach-text small{font-size:.75rem;color:var(--muted2)}
.pl-gamestats{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px}
.pl-game{display:flex;flex-direction:column;gap:4px;padding:16px;border:1px solid var(--line);background:var(--surface)}
.pl-game-icon{font-size:1.4rem}
.pl-game strong{font:500 1.35rem/1.2 var(--heading);letter-spacing:-.02em}
.pl-game-label{font-size:.8125rem;color:var(--muted)}
.board-name a:hover,.pl-link:hover{color:var(--accent-ink)}
@media (max-width:640px){
  .pl-search .primary-action{padding:12px 16px}
  .pl-hero{gap:16px}
  .pl-head{width:80px;height:80px}
  .pl-grid,.pl-ranks,.pl-ach-grid{grid-template-columns:1fr}
  .pl-gamestats{grid-template-columns:repeat(2,minmax(0,1fr))}
}