:root {
  --shell-width: 1540px;
  --edge: #183c61;
  --edge-bright: #2d84bc;
  --cyan: #36cfff;
  --violet: #9b64ff;
  --surface: rgba(4, 14, 31, .91);
  --surface-soft: rgba(7, 22, 44, .84);
}

html { background: #020713; }

body {
  background-color: #020713;
  background-image:
    linear-gradient(rgba(2, 8, 22, .82), rgba(2, 8, 22, .93)),
    url('../images/hero-neon-megapolis-wide.png');
  background-size: cover;
  background-position: center top;
  background-attachment: fixed;
}

body::before {
  opacity: .13;
  background-size: 64px 64px;
  mask-image: linear-gradient(to bottom, #000 0, #000 65%, transparent 100%);
}

main { min-height: calc(100vh - 300px); }

.site-header {
  position: sticky;
  height: 80px;
  max-width: 1668px;
  margin: 0 auto;
  padding: 0 48px;
  gap: 46px;
  border: 1px solid #1b3f61;
  border-top: 0;
  background: rgba(2, 10, 24, .96);
  box-shadow: 0 8px 32px rgba(0, 0, 0, .55), inset 0 -1px rgba(52, 180, 255, .06);
}

.brand { gap: 12px; font-size: 28px; letter-spacing: -.02em; }
.brand-logo { display:block; width:215px; height:50px; object-fit:contain; }
.brand.compact .brand-logo { width:172px; height:40px; }
.brand-mark { width: 34px; height: 34px; clip-path: none; background: none; flex: 0 0 auto; filter: drop-shadow(0 0 8px rgba(62, 201, 255, .35)); }
.brand.compact { font-size: 20px; }
.brand.compact .brand-mark { width: 28px; height: 28px; }

.main-nav { height: 100%; align-items: center; gap: 24px; }
.main-nav a, .icon-link {
  position: relative;
  height: 100%;
  display: inline-flex;
  align-items: center;
  padding: 0 8px;
  border: 0;
  color: #bbcbe0;
  font-weight: 600;
}
.main-nav a::after {
  content: '';
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 4px;
  height: 3px;
  opacity: 0;
  background: linear-gradient(90deg, #28bfff, #735cff);
  box-shadow: 0 0 11px #26c7ff;
  transform: scaleX(.5);
  transition: .2s ease;
}
.main-nav a:hover, .main-nav a.active { color: #fff; }
.main-nav a:hover::after, .main-nav a.active::after { opacity: 1; transform: scaleX(1); }

.header-actions { gap: 18px; }
.coin-balance, .language-button {
  min-height: 43px;
  border: 1px solid #234e74;
  border-radius: 0;
  background: linear-gradient(180deg, rgba(7, 22, 45, .95), rgba(3, 12, 27, .95));
  clip-path: polygon(8px 0, calc(100% - 8px) 0, 100% 8px, 100% calc(100% - 8px), calc(100% - 8px) 100%, 8px 100%, 0 calc(100% - 8px), 0 8px);
}
.coin-balance { min-width: 136px; justify-content: center; padding: 7px 18px; color: #fff; font-size: 17px; letter-spacing: .03em; }
.coin { border-color: #d1950a; box-shadow: 0 0 9px rgba(255, 194, 46, .26); }
.language-button { min-width: 126px; justify-content: center; padding: 9px 16px; }
.language-menu { border-color: #234e74; background: #061226; }
.language-button, .language-menu button { display: flex; align-items: center; gap: 9px; }

.flag { display: inline-block; width: 26px; height: 17px; flex: 0 0 auto; border: 1px solid rgba(255,255,255,.28); }
.flag-ru { background: linear-gradient(to bottom,#fff 0 33.333%,#1856bd 33.333% 66.666%,#d52b1e 66.666% 100%); }
.flag-en { background: linear-gradient(135deg,#183a75 0 42%,#fff 42% 47%,#cf2734 47% 53%,#fff 53% 58%,#183a75 58% 100%); }
.coin-balance { min-width:0; padding:0; border:0; border-radius:0; background:none; clip-path:none; box-shadow:none; }
.language-button { min-width:0; padding:6px 0; border:0; border-radius:0; background:none; clip-path:none; }
.coin-balance:hover,.language-button:hover { background:none; filter:brightness(1.15); }
.header-coin { width:36px; height:36px; overflow:visible; }
.header-coin>path:first-child { fill:#07192e; stroke:#27caff; stroke-width:1.4; filter:drop-shadow(0 0 4px #27caff88); }
.header-coin circle { fill:#ffbf24; stroke:#ffe27a; stroke-width:1.5; }
.header-coin>path:last-child { fill:none; stroke:#3d2900; stroke-width:2.2; stroke-linecap:round; }
.header-diamond { width:34px; height:31px; overflow:visible; filter:drop-shadow(0 0 8px rgba(52,199,255,.45)); }
.flag-ru { background:#fff url('../images/flag-ru.svg') center/cover no-repeat; }
.flag-en { background:#012169 url('../images/flag-en.svg') center/cover no-repeat; }

.button {
  position: relative;
  min-width: 150px;
  border-radius: 0;
  border: 1px solid #2bbfed;
  padding: 12px 24px;
  text-transform: uppercase;
  letter-spacing: .035em;
  background: rgba(5, 29, 52, .92);
  clip-path: polygon(9px 0, calc(100% - 9px) 0, 100% 9px, 100% calc(100% - 9px), calc(100% - 9px) 100%, 9px 100%, 0 calc(100% - 9px), 0 9px);
  box-shadow: inset 0 0 28px rgba(50, 201, 255, .1);
}
.button::before { content: ''; position: absolute; inset: 3px; border: 1px solid rgba(92, 220, 255, .25); pointer-events: none; clip-path: inherit; }
.button:hover { color: #fff; transform: translateY(-2px); filter: brightness(1.16); box-shadow: 0 0 25px rgba(35, 200, 255, .3), inset 0 0 28px rgba(50, 201, 255, .14); }
.button-primary { border-color: #4bdcff; background: linear-gradient(180deg, #1769a4, #0a4779); }
.button-secondary { border-color: #a471ff; background: linear-gradient(180deg, #5330a0, #35206e); }
.button-danger { min-width: 134px; border-color: #ff5964; color: #ff7a82; background: rgba(44, 10, 22, .8); }
.header-login,.header-register { min-width:96px; border-radius:18px; clip-path:none; text-transform:none; }
.header-login::before,.header-register::before { display:none; }
.header-login { border-color:#438bc0; background:rgba(4,20,44,.72); }
.header-register { border-color:transparent; background:linear-gradient(105deg,#24c7ff,#2d82ff 55%,#824cff); }
.button-small { min-width: 130px; padding: 9px 18px; }
.button-icon { font-size: 19px; margin-right: 3px; }
.button-arrow { margin-left: auto; font-size: 22px; }

.hero {
  min-height: 520px;
  max-width: 1668px;
  margin: 0 auto;
  grid-template-columns: minmax(500px, .86fr) 1.14fr;
  padding: 58px 72px;
  background-image:
    linear-gradient(90deg, rgba(2, 10, 25, .94) 0%, rgba(3, 13, 31, .67) 35%, rgba(3, 14, 31, .08) 61%),
    url('../images/hero-neon-megapolis-wide.png');
  background-size: auto 100%;
  background-repeat: no-repeat;
  background-position: center center;
  border-left: 1px solid #173f62;
  border-right: 1px solid #173f62;
  border-bottom: 1px solid #2b668f;
}
.hero-copy { max-width: 570px; }
.hero h1, .page-hero h1 {
  font-size: clamp(52px, 5vw, 75px);
  line-height: 1.02;
  letter-spacing: .01em;
  max-width: 650px;
  background: linear-gradient(180deg,#fff 0 46%,#83dcff 59%,#269cd7 100%);
  background-clip: text;
  -webkit-background-clip: text;
  filter: drop-shadow(0 4px 0 rgba(0,0,0,.45));
}
.hero p { margin: 0 0 28px; max-width: 460px; font-size: 20px; }
.hero .button { min-width: 255px; justify-content: flex-start; }

.page-section, .narrow-section, .page-hero {
  position: relative;
  max-width: var(--shell-width);
  background: rgba(2, 9, 22, .76);
  border-left: 1px solid rgba(30, 77, 113, .5);
  border-right: 1px solid rgba(30, 77, 113, .5);
}
.page-section { padding: 36px 64px; }
.narrow-section { margin: 0 auto; padding: 70px 24px; max-width: 900px; background: transparent; border: 0; }
.narrow-section.wide { max-width: 1160px; }
.page-hero { margin: 0 auto; padding: 66px 64px; background: linear-gradient(90deg,rgba(2,10,25,.96),rgba(5,19,42,.78),rgba(9,36,65,.6)); border-bottom: 1px solid #255c84; }
.compact-hero { min-height: 250px; }

.section-heading { border-top: 1px solid #1b4b70; padding-top: 18px; }
.section-heading h2 { font-size: 21px; letter-spacing: .035em; }
.section-heading > a { padding: 8px 18px; border: 1px solid #255678; color: var(--cyan); clip-path: polygon(12px 0,100% 0,100% 100%,0 100%,0 12px); }

.panel, .program-card, .listing-card, .payment-card, .profile-summary > div, .contact-grid a, .empty-state {
  border-radius: 0;
  background: linear-gradient(135deg, rgba(4, 16, 35, .96), rgba(7, 27, 51, .9));
  border: 1px solid #23577d;
  box-shadow: 0 18px 45px rgba(0,0,0,.42), inset 0 0 34px rgba(27,135,200,.045);
  clip-path: polygon(10px 0, calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);
}
.program-card { min-height: 190px; padding: 26px; grid-template-columns: 118px 1fr; border-color: #5b43b0; background: linear-gradient(135deg,rgba(9,15,42,.97),rgba(27,15,62,.9)); }
.program-card.accent-1 { border-color: #176696; background: linear-gradient(135deg,rgba(4,16,35,.97),rgba(7,31,58,.9)); }
.program-card .program-symbol { border-color: var(--violet); color: #ab8aff; }
.program-card.accent-1 .program-symbol { border-color: var(--cyan); color: var(--cyan); }
.program-card h2,.program-card h3 { color: #a987ff; }
.program-card.accent-1 h2,.program-card.accent-1 h3 { color: #54d8ff; }
.program-symbol { width: 104px; height: 104px; border-width: 1px; box-shadow: 0 0 24px rgba(30,202,255,.16), inset 0 0 22px rgba(30,202,255,.15); }
.program-card h2, .program-card h3 { text-transform: uppercase; letter-spacing: .03em; }
.listing-card { display: grid; grid-template-columns: 52% 48%; min-height: 138px; transition: .2s ease; }
.listing-card::before { content: ''; width: 4px; position: absolute; inset: 12px auto 12px 0; background: var(--cyan); box-shadow: 0 0 10px var(--cyan); }
.listing-card { position: relative; }
.listing-image { height: 100%; min-height: 138px; }
.listing-body { padding: 18px 16px; }
.listing-body h3 { text-transform: uppercase; }
.listing-body p { margin: 5px 0; }

.input { border-color: #255879; border-radius: 0; background: rgba(2,8,20,.88); }
.site-footer {
  max-width: 1668px;
  margin: 0 auto;
  padding: 30px 72px;
  border: 1px solid #183e5f;
  background: rgba(2,9,22,.97);
}
.footer-brand { display:flex; align-items:center; gap:20px; }
.footer-brand p { margin:0; }
.footer-nav,.footer-socials { display:flex; align-items:center; gap:18px; }
.footer-socials a { display:grid; width:24px; height:24px; place-items:center; }
.footer-socials svg { width:20px; height:20px; fill:currentColor; }
.footer-legal { display:grid; gap:4px; color:var(--muted); font-size:12px; }
.payment-qr { display:block;width:180px;max-width:100%;margin:16px auto;padding:10px;background:#fff;border:1px solid #8067ff; }

/* The homepage follows the approved Neon Megapolis mockup exactly: one hero image,
   a plain dark page shell and dedicated illustrated program cards. */
.page-home {
  background-color:#020914;
  background-image:none;
}
.page-home::before { display:none; }
.page-home .hero {
  min-height:322px;
  height:clamp(322px,19.2vw,360px);
  padding:27px 72px;
  grid-template-columns:minmax(470px,.72fr) 1.28fr;
  background-color:#031126;
  background-image:url('../images/home-hero-mockup.png');
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center center;
}
.page-home .hero-copy { max-width:520px; transform:translateY(13px); }
.page-home .hero h1 {
  max-width:500px;
  margin-bottom:13px;
  font-family:Bahnschrift,'Arial Black',Impact,sans-serif;
  font-size:clamp(45px,3.55vw,58px);
  line-height:1;
  letter-spacing:.01em;
  padding-top:8px;
  overflow:visible;
}
.page-home .hero p { max-width:540px; margin:0 0 18px; font-size:18px; line-height:1.4; }
.page-home .hero .button-row { flex-wrap:nowrap; }
.page-home .hero .button { min-width:255px; min-height:58px; padding:13px 27px; justify-content:flex-start; }
.page-home .hero .button-icon { width:25px; height:25px; margin-right:10px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }

.page-home .page-section { max-width:1668px; padding:12px 64px 14px; background:#020b19; }
.page-home .section-heading { margin:0 0 4px; padding-top:5px; }
.page-home .hero + .page-section .section-heading { border-top:0; }
.page-home .hero + .page-section { padding-top:8px; padding-bottom:1px; }
.page-home .page-section + .page-section { padding-top:0; }
.page-home .home-program-grid { gap:18px; }
.home-program-card {
  position:relative;
  display:grid;
  grid-template-columns:145px minmax(210px,1fr) minmax(190px,275px);
  align-items:center;
  min-height:158px;
  overflow:hidden;
  border:1px solid #1a6391;
  background:linear-gradient(120deg,#06182f 0%,#071a34 58%,#041329 100%);
  clip-path:polygon(10px 0,calc(100% - 10px) 0,100% 10px,100% calc(100% - 10px),calc(100% - 10px) 100%,10px 100%,0 calc(100% - 10px),0 10px);
}
.home-program-card.tone-violet { border-color:#5940a3; background:linear-gradient(120deg,#0b1534 0%,#131548 58%,#100b31 100%); }
.home-program-icon { width:120px; height:125px; object-fit:cover; align-self:center; }
.home-program-copy { position:relative; z-index:2; padding:18px 8px; }
.home-program-copy h3 { margin:0 0 10px; color:#27caff; font-size:22px; text-transform:uppercase; }
.tone-violet .home-program-copy h3 { color:#8d53ff; }
.home-program-copy p { max-width:370px; margin:0 0 13px; color:#aebcd1; line-height:1.45; }
.program-link { display:inline-flex; min-width:175px; justify-content:center; gap:45px; padding:7px 14px; color:#31cdfd; border:1px solid #28bce9; font-weight:700; text-transform:uppercase; clip-path:polygon(8px 0,calc(100% - 8px) 0,100% 8px,100% calc(100% - 8px),calc(100% - 8px) 100%,8px 100%,0 calc(100% - 8px),0 8px); }
.tone-violet .program-link { color:#a875ff; border-color:#8a5bdf; }
.home-program-art { width:100%; height:100%; min-height:145px; object-fit:cover; object-position:center; mask-image:linear-gradient(90deg,transparent 0,#000 18%,#000 100%); }

/* Programs and city listings catalogs */
.page-programs,.page-market { background-color:#020914; background-image:none; }
.page-programs::before,.page-market::before { display:none; }
.catalog-hero {
  width:100%;
  max-width:1668px;
  min-height:245px;
  overflow:hidden;
  background-color:#031126;
  background-image:linear-gradient(90deg,rgba(2,10,25,.96) 0%,rgba(2,10,25,.72) 43%,rgba(2,10,25,.12) 76%),url('../images/home-hero-mockup.png');
  background-size:cover;
  background-repeat:no-repeat;
  background-position:center top;
}
.catalog-hero h1 { margin:0 0 15px; font-family:Bahnschrift,'Arial Black',Impact,sans-serif; font-size:clamp(46px,4.4vw,68px); }
.catalog-hero p { margin:0; font-size:18px; }
.market-hero { position:relative; }
.market-hero .create-listing-button { position:absolute; right:64px; bottom:55px; width:260px; min-width:260px; height:56px; min-height:56px; max-height:56px; padding:10px 24px; }
.catalog-section { max-width:1668px; min-height:470px; padding:24px 64px 42px; background:#020b19; }
.catalog-heading { margin-bottom:18px; padding-top:6px; }

.catalog-program-grid { gap:20px; }
.catalog-program-card {
  position:relative;
  display:grid;
  grid-template-columns:145px minmax(245px,1fr) minmax(180px,285px);
  align-items:center;
  min-height:220px;
  overflow:hidden;
  border:1px solid #1a6391;
  background:linear-gradient(120deg,#06182f 0%,#071a34 58%,#041329 100%);
  clip-path:polygon(11px 0,calc(100% - 11px) 0,100% 11px,100% calc(100% - 11px),calc(100% - 11px) 100%,11px 100%,0 calc(100% - 11px),0 11px);
}
.catalog-program-card.tone-violet { border-color:#5940a3; background:linear-gradient(120deg,#0b1534 0%,#131548 58%,#100b31 100%); }
.catalog-program-icon { width:140px; height:150px; object-fit:cover; }
.catalog-program-copy { position:relative; z-index:2; padding:24px 10px; }
.catalog-program-copy h2 { margin:0 0 12px; color:#28caff; font-size:24px; text-transform:uppercase; }
.tone-violet .catalog-program-copy h2 { color:#9360ff; }
.catalog-program-copy p { min-height:48px; margin:0 0 13px; color:#aebdd0; line-height:1.5; }
.catalog-program-meta { display:flex; align-items:center; gap:13px; margin:0 0 14px; color:#d9e7f4; }
.catalog-program-meta strong { display:flex; align-items:center; font-size:18px; }
.catalog-program-meta>span { padding-left:13px; border-left:1px solid #31506c; color:#91a6bb; }
.catalog-program-copy form { margin:0; }
.catalog-program-copy button.program-link { font:inherit; cursor:pointer; background:rgba(3,17,37,.74); }
.catalog-subscription-status { margin:-2px 0 12px; color:#65ebb1; font-size:14px; }
.program-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.program-renew-button { padding:7px 0; color:#91a6bb; border:0; border-bottom:1px dashed #4c6b86; background:transparent; cursor:pointer; }
.program-renew-button:hover { color:#fff; border-color:#7bdfff; }
.catalog-program-art { width:100%; height:100%; min-height:205px; object-fit:cover; mask-image:linear-gradient(90deg,transparent 0,#000 17%,#000 100%); }

.program-detail-section { max-width:1280px; }
.program-detail { grid-template-columns:minmax(340px,.9fr) minmax(360px,1.1fr); align-items:center; overflow:hidden; }
.program-detail-visual { position:relative; min-height:340px; overflow:hidden; border:1px solid #245c82; background:#031126; clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px); }
.program-detail-art { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.program-detail-visual::after { content:''; position:absolute; inset:0; background:linear-gradient(90deg,rgba(2,10,25,.35),transparent 55%),linear-gradient(0deg,rgba(2,10,25,.72),transparent 55%); }
.program-detail-icon { position:absolute; z-index:2; left:20px; bottom:18px; width:105px; height:105px; filter:drop-shadow(0 0 10px #27caff66); }

.market-filter { align-items:center; margin:0 0 22px; padding:14px; border:1px solid #1f4c70; background:#041327; }
.filter-input { position:relative; display:block; flex:1; max-width:520px; }
.filter-input svg { position:absolute; z-index:2; left:14px; top:50%; width:20px; height:20px; transform:translateY(-50%); fill:none; stroke:#54d8ff; stroke-width:1.7; }
.filter-input .input { max-width:none; padding-left:44px; }
.market-filter .button { min-width:145px; }
.market-listing-grid { grid-template-columns:repeat(auto-fill,minmax(430px,1fr)); justify-content:start; gap:18px; }
.listing-grid .listing-card { display:block; width:100%; height:285px; min-height:0; }
.listing-card>a { display:grid; grid-template-columns:205px minmax(0,1fr); grid-template-rows:1fr; width:100%; height:100%; }
.listing-grid .listing-image { width:205px; height:285px; min-height:0; overflow:hidden; }
.listing-grid .listing-image img { display:block; width:205px; height:285px; object-fit:cover; object-position:center; }
.listing-grid .listing-body { display:flex; flex-direction:column; min-width:0; min-height:0; padding:17px 19px; }
.listing-kicker { display:block; margin-bottom:4px; color:#6f8ba4; font-size:11px; letter-spacing:.12em; text-transform:uppercase; }
.listing-body h3 { color:#eef8ff; }
.listing-body p strong { color:#dcecff; }
.listing-description { max-height:112px; margin:5px 0 8px!important; overflow-x:hidden; overflow-y:auto; color:#8fa5ba!important; line-height:1.35; overflow-wrap:anywhere; scrollbar-width:thin; scrollbar-color:#2b7198 #061126; }
.listing-price { display:flex; align-items:center; margin-top:auto; color:#fff; font-size:18px; }
.listing-price .coin.small { flex:0 0 20px; width:20px; min-width:20px; height:20px; min-height:20px; aspect-ratio:1; }
.listing-price strong { min-width:0; overflow-wrap:anywhere; }
.market-empty { min-height:180px; display:grid; place-items:center; background:linear-gradient(135deg,#041327,#071b34); }
.market-tabs { display:flex; gap:8px; margin:0 0 20px; padding-bottom:10px; overflow-x:auto; border-bottom:1px solid #1f4c70; }
.market-tabs a { flex:0 0 auto; padding:11px 17px; color:#aebed0; border:1px solid transparent; border-bottom:2px solid transparent; }
.market-tabs a:hover { color:#fff; border-color:#23597c; }
.market-tabs a.active { color:#fff; border-color:#3b82ad; border-bottom-color:var(--cyan); background:#071a31; box-shadow:inset 0 -8px 18px #29cfff12; }
.personal-market-section { min-height:70vh; padding-top:42px; }
.personal-market-section .catalog-heading h1 { margin:0; font-size:30px; text-transform:uppercase; }
.personal-listing-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(460px,1fr)); gap:16px; }
.personal-listing-card { display:grid; grid-template-columns:205px minmax(0,1fr); height:285px; max-height:285px; overflow:hidden; border:1px solid #23597c; background:linear-gradient(120deg,#061327,#091b35); box-shadow:var(--shadow); }
.personal-listing-image { height:285px; min-height:0; overflow:hidden; background:#061126; }
.personal-listing-image img { display:block; width:100%; height:285px; min-height:0; object-fit:cover; object-position:center; }
.personal-listing-image .image-placeholder { height:285px; min-height:0; }
.personal-listing-body { display:grid; align-content:center; justify-items:start; gap:10px; min-width:0; overflow:hidden; padding:17px 19px; }
.personal-listing-heading { display:flex; align-items:start; justify-content:space-between; gap:18px; width:100%; }
.personal-listing-heading h2 { margin:2px 0 0; color:#eef8ff; text-transform:uppercase; }
.personal-listing-meta { display:flex; align-items:center; gap:28px; color:#aebed0; }
.personal-listing-meta .listing-price { margin:0; }
.personal-listing-description { width:100%; max-height:92px; margin:0; overflow-x:hidden; overflow-y:auto; color:#8fa5ba; line-height:1.35; overflow-wrap:anywhere; scrollbar-width:thin; scrollbar-color:#2b7198 #061126; }
.personal-listing-actions { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.personal-listing-actions form { margin:0; }
.admin-note,.deal-state { width:100%; margin:0; padding:10px 12px; color:#b8c9d9; border-left:3px solid var(--violet); background:#0c1530; }
.deal-state { border-left-color:var(--cyan); }
.status-moderation { border-color:#d19a38; color:#ffd77c; }
.status-active { border-color:#26b77f; color:#65ebb1; }
.status-rejected { border-color:#c34856; color:#ff98a1; }
.status-reserved { border-color:#674fd0; color:#aa98ff; }
.status-sold { border-color:#4581aa; color:#9edcff; }
.listing-detail-section { max-width:1280px; }
.listing-detail-section .listing-detail { grid-template-columns:minmax(0,820px) minmax(330px,400px); justify-content:center; align-items:start; }
.listing-detail-section .gallery { grid-template-columns:repeat(auto-fill,minmax(220px,1fr)); align-content:start; }
.gallery-thumbnail { position:relative; height:220px; min-width:0; padding:0; overflow:hidden; cursor:zoom-in; border:1px solid #27587a; background:#061126; }
.gallery-thumbnail img { display:block; width:100%; height:220px; aspect-ratio:auto; object-fit:cover; object-position:center; border:0; transition:transform .2s ease; }
.gallery-thumbnail:hover img { transform:scale(1.035); }
.gallery-thumbnail span { position:absolute; right:8px; bottom:8px; padding:5px 8px; color:#fff; font-size:11px; background:#020914d9; border:1px solid #39779e; }
.listing-detail-description { max-height:180px; overflow:auto; white-space:pre-wrap; color:#aebed0; line-height:1.5; }
.image-lightbox { width:calc(100vw - 40px); max-width:1200px; height:calc(100vh - 40px); max-height:900px; padding:18px; overflow:hidden; border:1px solid #3a89b6; background:#020713; box-shadow:0 25px 80px #000; }
.image-lightbox::backdrop { background:#000c; backdrop-filter:blur(5px); }
.image-lightbox[open] { display:grid; place-items:center; }
.image-lightbox img { display:block; max-width:100%; max-height:calc(100vh - 76px); object-fit:contain; }
.image-lightbox-close { position:absolute; z-index:2; top:9px; right:11px; width:40px; height:40px; cursor:pointer; color:#fff; font-size:30px; line-height:1; border:1px solid #5bbfe9; background:#06162de8; }
.admin-page>h1 { margin-top:0; font-size:40px; }
.admin-stat-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:14px; margin:0 0 20px; }
.admin-stat-grid>div { display:grid; gap:8px; padding:20px; border:1px solid #23597c; background:linear-gradient(135deg,#061327,#0a1d36); }
.admin-stat-grid small { color:#91a7bc; text-transform:uppercase; letter-spacing:.08em; }
.admin-stat-grid strong { color:#65ddff; font-size:30px; }
.admin-section { min-width:0; }
.admin-section h2 { margin-top:0; }
.admin-section-heading>div { display:flex; align-items:center; gap:12px; }
.admin-search-form { display:grid; grid-template-columns:minmax(0,1fr) 160px; gap:10px; }
.admin-user-results { display:grid; grid-template-columns:repeat(auto-fill,minmax(310px,1fr)); gap:12px; margin-top:16px; }
.admin-user-card { min-width:0; padding:18px; border:1px solid #27587a; background:#061126; }
.admin-user-card h3 { margin:10px 0 14px; }
.admin-user-card dl { display:grid; gap:8px; margin:0; }
.admin-user-card dl>div { display:grid; grid-template-columns:90px minmax(0,1fr); gap:10px; padding-bottom:7px; border-bottom:1px solid #1c3852; }
.admin-user-card dt { color:#7f98af; }
.admin-user-card dd { min-width:0; margin:0; overflow-wrap:anywhere; }
.admin-help { color:#8fa5ba; }
.subscription-history-user { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:18px 0 12px; color:#8fa5ba; }
.subscription-history-user strong { color:#f4f9ff; font-size:18px; }
.subscription-history-table { margin-top:12px; }
.subscription-history-table th { white-space:nowrap; }
.subscription-history-table td { vertical-align:middle; }
.status.pending { border-color:#aa86ff; color:#c9b5ff; }
.status.expired { border-color:#6a7686; color:#9aa9b9; }
.admin-section .admin-row>div:first-child { display:grid; gap:5px; min-width:0; }
.admin-section .admin-row small { display:block; color:#839bb1; }

@media (max-width: 1180px) {
  .site-header { padding: 0 24px; gap: 22px; }
  .main-nav { gap: 8px; }
  .header-actions { gap: 8px; }
  .language-button { min-width: auto; }
  .hero { grid-template-columns: 1fr .7fr; padding: 56px 42px; background-position: 53% center; }
  .hero .button { min-width: 210px; }
  .brand-logo { width:184px; height:43px; }
  .page-home .hero { grid-template-columns:minmax(440px,.9fr) 1.1fr; padding:35px 42px; }
  .page-home .hero .button { min-width:205px; }
  .home-program-card { grid-template-columns:105px 1fr; }
  .home-program-art { position:absolute; z-index:0; right:0; top:0; width:45%; opacity:.35; }
  .home-program-icon { width:104px; }
  .catalog-program-card { grid-template-columns:110px 1fr; }
  .catalog-program-icon { width:108px; height:120px; }
  .catalog-program-art { position:absolute; z-index:0; right:0; top:0; width:45%; opacity:.32; }
}

@media (max-width: 1050px) {
  .main-nav { top: 80px; height: auto; align-items: stretch; border-bottom: 1px solid #225474; }
  .main-nav a { height: auto; padding: 14px 20px; }
  .hero { grid-template-columns: 1fr; }
  .page-home .hero { grid-template-columns:1fr; }
  .listing-card { grid-template-columns: 1fr; }
  .listing-image { height: 190px; }
  .listing-card>a { grid-template-columns:205px minmax(0,1fr); }
  .listing-detail-section .listing-detail { grid-template-columns:1fr; }
  .market-hero .create-listing-button { position:static; margin-top:22px; }
}

@media (max-width: 700px) {
  html, body { width: 100%; max-width: 100%; overflow-x: hidden; }
  .site-header { min-height: 68px; height: auto; padding: 10px 14px; gap: 8px; }
  .brand { font-size: 19px; }
  .brand-logo { width:142px; height:33px; }
  .brand-mark { width: 27px; height: 27px; }
  .header-actions { width: 100%; max-width: 100%; flex: 1 0 100%; order: 3; margin-left: 0; justify-content: space-between; gap: 7px; }
  .header-actions > * { flex: 0 0 auto; }
  .coin-balance { min-width: 104px; padding: 7px 9px; }
  .language-button { min-width: 72px; padding: 8px 0; }
  .coin-balance { min-width:78px; padding:0; }
  .header-actions .button-danger { min-width: 92px; padding: 8px 10px; font-size: 12px; }
  .header-actions .button-danger::after { content: none; }
  .main-nav { top: 68px; }
  .hero {
    width: 100vw;
    max-width: 100vw;
    min-width: 0;
    min-height: 650px;
    padding: 52px 20px 260px;
    align-items: start;
    background-size: auto 100%;
    background-position: 62% center;
    background-image: linear-gradient(180deg,rgba(2,10,25,.96) 0%,rgba(3,13,30,.77) 48%,rgba(2,10,24,.1) 72%),url('../images/hero-neon-megapolis-wide.png');
  }
  .page-home .hero {
    width:100%;
    min-height:620px;
    height:auto;
    padding:42px 20px 275px;
    background-position:66% center;
  }
  .page-home .hero-copy { transform:none; }
  .page-home .hero h1 { font-size:clamp(36px,11vw,46px); }
  .page-home .hero .button-row { display:grid; grid-template-columns:1fr; }
  .page-home .hero .button { width:100%; min-width:0; }
  .hero > *, .hero-copy { min-width: 0; width: 100%; max-width: calc(100vw - 40px); }
  .hero h1 { width:100%; max-width:100%; white-space:normal; font-size: clamp(33px, 9.4vw, 40px); overflow-wrap: break-word; }
  .hero p { font-size: 17px; }
  .hero-copy p { max-width: 100%; overflow-wrap: break-word; }
  .button-row { display:grid; grid-template-columns:minmax(0,1fr); width:100%; max-width:100%; }
  .hero .button { width: 100%; min-width: 0; }
  .page-section, .page-hero { padding: 34px 18px; }
  .program-card { grid-template-columns: 78px 1fr; gap: 15px; padding: 18px; }
  .home-program-card { grid-template-columns:82px 1fr; min-height:150px; }
  .home-program-icon { width:82px; height:95px; }
  .home-program-copy { padding:15px 12px 15px 0; }
  .home-program-copy h3 { font-size:18px; }
  .home-program-copy p { font-size:14px; }
  .program-link { min-width:145px; gap:25px; }
  .home-program-art { display:none; }
  .catalog-hero { min-height:280px; padding:42px 20px; background-position:66% top; }
  .catalog-hero h1 { font-size:38px; }
  .catalog-section { padding:24px 18px 35px; }
  .catalog-program-card { grid-template-columns:82px 1fr; min-height:215px; }
  .catalog-program-icon { width:82px; height:95px; }
  .catalog-program-copy { padding:18px 12px 18px 0; }
  .catalog-program-copy h2 { font-size:18px; }
  .catalog-program-copy p { min-height:0; font-size:14px; }
  .catalog-program-art { display:none; }
  .program-detail { grid-template-columns:1fr; }
  .program-detail-visual { min-height:250px; }
  .catalog-program-meta { flex-wrap:wrap; }
  .market-filter { display:grid; grid-template-columns:1fr; }
  .filter-input,.market-filter .button { width:100%; max-width:none; }
  .listing-grid .listing-card { height:auto; }
  .listing-card>a { grid-template-columns:1fr; grid-template-rows:185px auto; }
  .listing-grid .listing-image,.listing-grid .listing-image img { width:100%; height:185px; }
  .personal-market-section .catalog-heading { align-items:flex-start; gap:14px; }
  .personal-market-section .catalog-heading h1 { font-size:23px; }
  .personal-listing-card { grid-template-columns:1fr; }
  .personal-listing-grid { grid-template-columns:1fr; }
  .personal-listing-card { height:auto; max-height:none; }
  .personal-listing-image,.personal-listing-image img,.personal-listing-image .image-placeholder { min-height:185px; height:185px; }
  .personal-listing-heading { flex-direction:column; }
  .personal-listing-meta { flex-wrap:wrap; gap:14px 24px; }
  .listing-detail-section .gallery { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .gallery-thumbnail,.gallery-thumbnail img { height:160px; }
  .admin-stat-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-search-form { grid-template-columns:1fr; }
  .program-symbol { width: 72px; height: 72px; }
  .program-card .card-footer { grid-column: 1/-1; }
  .section-heading h2 { font-size: 18px; }
  .site-footer { padding: 30px 20px; }
}
