.ai-app-field,
.ai-app-library-page {
  position: relative;
  overflow: hidden;
  background: #f3ede1;
  color: #17130f;
}

.ai-app-field {
  min-height: 100vh;
  padding: clamp(120px, 13vh, 170px) clamp(28px, 8vw, 132px) clamp(100px, 12vh, 150px) clamp(94px, 12vw, 204px);
}

.ai-app-field::after,
.ai-app-library-hero::after {
  content: "";
  position: absolute;
  right: -12vw;
  bottom: -28vw;
  width: min(76vw, 1100px);
  aspect-ratio: 1;
  border: 1px solid rgba(180, 147, 79, 0.1);
  border-radius: 50%;
  pointer-events: none;
}

.ai-app-field .section-heading {
  position: relative;
  z-index: 2;
  width: min(820px, 80vw);
  margin-bottom: clamp(42px, 6vh, 76px);
}

.ai-app-home {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) minmax(300px, 0.55fr);
  gap: 18px;
}

.ai-app-home-minis {
  display: grid;
  grid-template-columns: 1fr;
  gap: 18px;
}

.ai-app-card {
  position: relative;
  display: grid;
  min-width: 0;
  overflow: hidden;
  border: 1px solid rgba(180, 147, 79, 0.34);
  background: rgba(255, 250, 239, 0.56);
}

.ai-app-card:hover {
  border-color: rgba(180, 147, 79, 0.68);
}

.ai-app-card-main {
  grid-template-rows: minmax(420px, 1fr) auto;
  min-height: 660px;
}

.ai-app-home-minis .ai-app-card {
  grid-template-columns: minmax(150px, 0.72fr) minmax(180px, 1fr);
  min-height: 320px;
}

.ai-app-visual {
  position: relative;
  min-height: 220px;
  overflow: hidden;
  background: #17130f;
}

.ai-app-visual video,
.ai-app-visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.ai-app-mark {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  color: rgba(216, 189, 120, 0.72);
  font: 700 10px/1.4 "Noto Sans SC", "Microsoft YaHei", sans-serif;
  letter-spacing: 0.2em;
}

.ai-app-mark i,
.ai-app-mark i::before {
  position: absolute;
  width: 46%;
  aspect-ratio: 1;
  border: 1px solid rgba(216, 189, 120, 0.18);
  border-radius: 50%;
  content: "";
}

.ai-app-mark i::before {
  width: 138%;
  left: -48%;
  top: 20%;
  border-color: rgba(138, 167, 199, 0.1);
}

.ai-app-copy {
  display: flex;
  min-width: 0;
  padding: clamp(24px, 3vw, 42px);
  flex-direction: column;
  justify-content: flex-end;
}

.ai-app-copy > span {
  color: #b4934f;
  font: 700 9px/1.4 "Noto Sans SC", "Microsoft YaHei", sans-serif;
  letter-spacing: 0.18em;
}

.ai-app-copy h3 {
  margin: 14px 0 10px;
  color: #17130f;
  font: 400 clamp(24px, 2.6vw, 42px)/1.3 "Noto Serif SC", "Songti SC", SimSun, serif;
}

.ai-app-home-minis .ai-app-copy h3 {
  font-size: clamp(20px, 1.8vw, 30px);
}

.ai-app-copy p {
  margin: 0;
  color: rgba(42, 36, 30, 0.62);
  font-size: 12px;
  line-height: 1.8;
}

.ai-app-open,
.ai-app-field-enter {
  display: inline-flex;
  min-height: 42px;
  padding: 0 18px;
  align-items: center;
  justify-content: center;
  border: 1px solid rgba(180, 147, 79, 0.48);
  color: #765f31;
  font: 700 11px/1 "Noto Sans SC", "Microsoft YaHei", sans-serif;
  letter-spacing: 0.08em;
  text-decoration: none;
}

.ai-app-open {
  margin-top: 20px;
  align-self: flex-start;
}

.ai-app-field-enter {
  position: relative;
  z-index: 2;
  margin-top: 26px;
  background: #4d6156;
  color: #f6f1e8;
  border-color: #4d6156;
}

.ai-app-library-hero {
  position: relative;
  min-height: 72vh;
  display: grid;
  align-content: center;
  padding: 130px clamp(28px, 9vw, 150px) 90px clamp(94px, 13vw, 220px);
  background: #f3ede1;
}

.ai-app-library-hero h1 {
  max-width: 900px;
  margin: 22px 0;
  font: 300 clamp(58px, 8vw, 132px)/1.06 "Noto Serif SC", "Songti SC", SimSun, serif;
}

.ai-app-library-hero .section-heading > p:last-child {
  max-width: 720px;
  color: rgba(42, 36, 30, 0.68);
  line-height: 1.9;
}

.ai-app-library-section {
  min-height: 100vh;
  padding: clamp(100px, 11vh, 150px) clamp(28px, 8vw, 132px);
  background: #100c08;
}

.ai-app-library-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.ai-app-library-grid .ai-app-card {
  grid-template-rows: minmax(260px, 1fr) auto;
  min-height: 500px;
  border-color: rgba(216, 189, 120, 0.28);
  background: rgba(32, 25, 21, 0.74);
}

.ai-app-library-grid .ai-app-copy {
  border-top: 1px solid rgba(216, 189, 120, 0.14);
}

.ai-app-library-grid .ai-app-copy h3 {
  color: #f6f1e8;
}

.ai-app-library-grid .ai-app-copy p {
  color: rgba(246, 241, 232, 0.58);
}

.ai-app-library-grid .ai-app-open {
  color: #d8bd78;
}

@media (max-width: 980px) {
  .ai-app-home {
    grid-template-columns: 1fr;
  }

  .ai-app-home-minis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .ai-app-home-minis .ai-app-card {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(220px, 1fr) auto;
  }

  .ai-app-library-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .ai-app-field,
  .ai-app-library-hero,
  .ai-app-library-section {
    min-height: auto;
    padding: 112px 22px 76px;
  }

  .ai-app-field .section-heading {
    width: 100%;
  }

  .ai-app-home-minis,
  .ai-app-library-grid {
    grid-template-columns: 1fr;
  }

  .ai-app-card-main {
    min-height: 540px;
    grid-template-rows: minmax(320px, 1fr) auto;
  }

  .ai-app-library-grid .ai-app-card {
    min-height: 460px;
  }
}

/* Homepage composition: one featured application, then editable secondary works below. */
.ai-app-home {
  display: block;
}

.ai-app-home-minis {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 18px;
}

.ai-app-home-minis .ai-app-card {
  grid-template-columns: 1fr;
  grid-template-rows: minmax(220px, 1fr) auto;
  min-height: 430px;
}

@media (max-width: 980px) {
  .ai-app-home-minis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .ai-app-home-minis {
    grid-template-columns: 1fr;
  }
}

/* v32: the featured application mirrors the centered 16:9 work showcase. */
.ai-app-home {
  width: 100%;
  margin: 0 auto;
}

.ai-app-card-main {
  display: block;
  min-height: 0;
}

.ai-app-card-main .ai-app-visual {
  width: 100%;
  min-height: 0;
  aspect-ratio: 16 / 9;
}

.ai-app-card-main .ai-app-copy {
  min-height: 170px;
}

.ai-app-home-minis {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 980px) {
  .ai-app-home-minis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .ai-app-home-minis {
    grid-template-columns: 1fr;
  }
}

.ai-app-visual iframe {
  display: block;
  width: 100%;
  height: 100%;
  min-height: inherit;
  border: 0;
  background: #090705;
}

/* v33: homepage display stays clean; editing controls live in the library page. */
.ai-app-field .ai-app-home {
  width: min(100%, 1280px);
  max-width: 1280px;
  margin-inline: auto;
}

.ai-app-field .ai-app-card-main .ai-app-visual {
  width: 100%;
  aspect-ratio: 16 / 9;
}

.ai-app-field .ai-app-home-minis {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 980px) {
  .ai-app-field .ai-app-home-minis {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
  .ai-app-field .ai-app-home-minis {
    grid-template-columns: 1fr;
  }
}
/* v34: library heading rhythm matches the visual works archive. */
.ai-app-library-section > .section-heading {
  width: min(880px, 86vw);
  margin-bottom: clamp(52px, 7vh, 88px);
}

.ai-app-library-section > .section-heading h2 {
  margin-top: 14px;
}

.ai-app-library-section > .section-heading > p:last-child {
  margin-top: 18px;
  max-width: 720px;
  line-height: 1.9;
}

/* v34: compact application library introduction and stable cards */
.ai-app-library-hero {
  min-height: 52vh;
  padding-top: clamp(108px, 11vh, 136px);
  padding-bottom: clamp(58px, 7vh, 84px);
}
.ai-app-library-hero h1 {
  margin: 14px 0;
  font-size: clamp(54px, 7vw, 108px);
}
.ai-app-library-section {
  min-height: auto;
  padding-top: clamp(70px, 8vh, 104px);
}
.ai-app-library-grid {
  grid-auto-rows: 1fr;
  align-items: stretch;
}
.ai-app-library-grid .ai-app-card {
  grid-template-rows: auto 1fr;
  min-height: 0;
  height: 100%;
}
.ai-app-library-grid .ai-app-visual {
  min-height: 0;
  aspect-ratio: 16 / 10;
}
.ai-app-library-grid .ai-app-copy {
  min-height: 190px;
}
@media (max-width: 760px) {
  .ai-app-library-hero { min-height: auto; padding-top: 108px; }
  .ai-app-library-grid .ai-app-copy { min-height: 0; }
}

/* v35 application viewer and compact archive */
.ai-app-library-hero {
  min-height: 44vh;
  padding-top: clamp(96px, 9vh, 116px);
  padding-bottom: calc(clamp(42px, 5vh, 62px) + 20px);
}
.ai-app-library-hero h1 {
  margin: 10px 0 12px;
  font-size: clamp(52px, 6.4vw, 94px);
}
.ai-app-library-section {
  padding-top: clamp(52px, 6vh, 76px);
}
.ai-app-library-section > .section-heading {
  margin-bottom: clamp(34px, 4.5vh, 54px);
}
.ai-app-library-section > .section-heading > p:last-child {
  max-width: 760px;
  margin-top: 14px;
  color: rgba(246, 241, 232, .62);
}
.ai-app-library-grid .ai-app-card {
  grid-template-rows: auto minmax(190px, 1fr);
}
.ai-app-library-grid .ai-app-visual {
  aspect-ratio: 16 / 10;
}
.ai-app-library-grid .ai-app-copy {
  min-height: 210px;
}
.ai-app-open {
  border-color: #4d6156;
  background: #4d6156;
  color: #f6f1e8;
  cursor: pointer;
}
.ai-app-visual[role="button"] {
  cursor: pointer;
}
.ai-app-visual[role="button"]:focus-visible,
.ai-app-open:focus-visible {
  outline: 2px solid #d8bd78;
  outline-offset: 3px;
}
.ai-app-viewer[hidden] {
  display: none;
}
.ai-app-viewer {
  position: fixed;
  inset: 0;
  z-index: 1600;
  display: grid;
  place-items: center;
  padding: clamp(16px, 4vw, 56px);
}
.ai-app-viewer-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(8, 6, 4, .9);
}
.ai-app-viewer-shell {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  width: min(1240px, 94vw);
  max-height: 90vh;
  overflow: hidden;
  border: 1px solid rgba(216, 189, 120, .4);
  background: #100c08;
  color: #f6f1e8;
}
.ai-app-viewer-stage {
  min-height: min(66vh, 720px);
  overflow: hidden;
  background: #080604;
}
.ai-app-viewer-stage .ai-app-visual,
.ai-app-viewer-stage video,
.ai-app-viewer-stage iframe,
.ai-app-viewer-stage img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: min(66vh, 720px);
  border: 0;
  object-fit: contain;
}
.ai-app-viewer-copy {
  padding: 22px 28px 26px;
  border-top: 1px solid rgba(216, 189, 120, .16);
}
.ai-app-viewer-copy > span {
  color: #b4934f;
  font-size: 9px;
  letter-spacing: .2em;
}
.ai-app-viewer-copy h2 {
  margin: 8px 0 6px;
  color: #f6f1e8;
  font: 400 clamp(26px, 3vw, 44px)/1.25 "Noto Serif SC", "Songti SC", SimSun, serif;
}
.ai-app-viewer-copy p {
  margin: 0;
  color: rgba(246, 241, 232, .62);
}
.ai-app-viewer-close {
  position: absolute;
  top: 14px;
  right: 14px;
  z-index: 3;
  display: grid;
  width: 42px;
  height: 42px;
  padding: 0;
  place-items: center;
  border: 1px solid rgba(216, 189, 120, .52);
  border-radius: 50%;
  background: rgba(16, 12, 8, .82);
  color: #d8bd78;
  font-size: 24px;
  cursor: pointer;
}
body.ai-app-viewer-open {
  overflow: hidden;
}
@media (max-width: 760px) {
  .ai-app-library-hero {
    min-height: auto;
    padding: 104px 22px 74px;
  }
  .ai-app-library-section {
    padding-top: 58px;
  }
  .ai-app-library-grid .ai-app-copy {
    min-height: 0;
  }
  .ai-app-viewer-stage,
  .ai-app-viewer-stage .ai-app-visual,
  .ai-app-viewer-stage video,
  .ai-app-viewer-stage iframe,
  .ai-app-viewer-stage img {
    min-height: 56vh;
  }
}

/* v37 application playback polish */
.ai-app-visual video[autoplay] {
  pointer-events: auto;
}
.ai-app-card .ai-app-open {
  min-width: 112px;
}
.ai-app-library-grid .ai-app-copy {
  justify-content: flex-start;
}


/* v39 aligned homepage and library applications */
.ai-app-field .ai-app-home {
  position: relative; left: 50%; transform: translateX(-50%);
  width: min(1320px, calc(100vw - 96px)) !important; max-width: none !important;
}
.ai-app-field .ai-app-card-main .ai-app-visual { aspect-ratio: 16 / 8.1 !important; }
.ai-app-field .ai-app-card-main .ai-app-copy {
  display: grid; grid-template-columns: minmax(0,1fr) auto; grid-template-rows: auto auto auto;
  min-height: 0 !important; padding: 13px 18px 15px !important; gap: 4px 20px !important;
}
.ai-app-field .ai-app-card-main .ai-app-copy > span,
.ai-app-field .ai-app-card-main .ai-app-copy > h3,
.ai-app-field .ai-app-card-main .ai-app-copy > p { grid-column: 1; margin: 0 !important; }
.ai-app-field .ai-app-card-main .ai-app-copy .ai-app-open { grid-column: 2; grid-row: 1 / 4; align-self: center; margin: 0 !important; }
.ai-app-field .ai-app-home-minis .ai-app-card { min-height: 0 !important; grid-template-rows: auto 1fr !important; }
.ai-app-field .ai-app-home-minis .ai-app-visual { aspect-ratio: 16 / 8.8 !important; min-height: 0 !important; }
.ai-app-field .ai-app-home-minis .ai-app-copy { min-height: 116px !important; padding: 12px 14px 14px !important; gap: 4px !important; }
.ai-app-field .ai-app-home-minis .ai-app-copy h3 { margin: 0 !important; font-size: clamp(18px,1.5vw,24px) !important; }
.ai-app-field .ai-app-home-minis .ai-app-copy p { display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.5!important; }
.ai-app-field-enter { transform: translateX(-20px); }
.ai-app-library-grid { grid-auto-rows: 1fr; align-items: stretch; }
.ai-app-library-grid .ai-app-card { height: 100%; min-height: 430px !important; grid-template-rows: auto 1fr !important; }
.ai-app-library-grid .ai-app-visual { width:100%; aspect-ratio:16 / 10; min-height:0!important; }
.ai-app-library-grid .ai-app-copy { min-height:0!important; padding:16px 18px 18px!important; }
@media (max-width:1080px) { .ai-app-field .ai-app-home { left:auto;transform:none;width:100%!important; } .ai-app-field-enter{transform:none;} }
@media (max-width:760px) { .ai-app-field .ai-app-card-main .ai-app-visual{aspect-ratio:16 / 9!important;} .ai-app-field .ai-app-card-main .ai-app-copy{grid-template-columns:1fr;} .ai-app-field .ai-app-card-main .ai-app-copy .ai-app-open{grid-column:1;grid-row:auto;margin-top:10px!important;} .ai-app-library-grid .ai-app-card{min-height:0!important;} }


/* v40: restore featured application side-copy composition */
.ai-app-showcase-shell { width:min(1320px,calc(100vw - 96px)); margin-inline:auto; }
.ai-app-showcase-shell .ai-app-home { position:static !important; left:auto !important; transform:none !important; width:100% !important; max-width:none !important; margin:0 !important; }
.ai-app-showcase-shell .ai-app-card-main {
  display:grid !important; grid-template-columns:minmax(0,1.68fr) minmax(270px,.56fr) !important;
  grid-template-rows:1fr !important; min-height:0 !important;
}
.ai-app-showcase-shell .ai-app-card-main .ai-app-visual { width:100%; height:100%; min-height:520px; aspect-ratio:auto !important; }
.ai-app-showcase-shell .ai-app-card-main .ai-app-copy {
  display:flex !important; min-height:520px !important; padding:clamp(26px,3vw,44px) !important;
  flex-direction:column; justify-content:center; border-top:0 !important; border-left:1px solid rgba(180,147,79,.22) !important;
}
.ai-app-showcase-shell .ai-app-card-main .ai-app-copy > * { margin-left:0 !important; text-align:left !important; }
.ai-app-showcase-shell .ai-app-field-enter { margin:2px 0 0 !important; transform:none !important; }
@media(max-width:1080px){.ai-app-showcase-shell{width:100%;}.ai-app-showcase-shell .ai-app-card-main{grid-template-columns:1fr!important;grid-template-rows:auto auto!important}.ai-app-showcase-shell .ai-app-card-main .ai-app-visual{min-height:0;aspect-ratio:16 / 9!important}.ai-app-showcase-shell .ai-app-card-main .ai-app-copy{min-height:0!important;border-left:0!important;border-top:1px solid rgba(180,147,79,.22)!important}}


/* v40 specificity fix: application copy stays on the right. */
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main {
  display:grid !important; grid-template-columns:minmax(0,1.68fr) minmax(270px,.56fr) !important; grid-template-rows:1fr !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual { height:100% !important; min-height:520px !important; aspect-ratio:auto !important; }
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  display:flex !important; min-height:520px !important; padding:clamp(26px,3vw,44px) !important; flex-direction:column !important; justify-content:center !important; border-top:0 !important; border-left:1px solid rgba(180,147,79,.22) !important;
}
@media(max-width:1080px){#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main{grid-template-columns:1fr!important;grid-template-rows:auto auto!important}#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual{min-height:0!important;aspect-ratio:16 / 9!important}#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy{min-height:0!important;border-left:0!important;border-top:1px solid rgba(180,147,79,.22)!important}}


/* v42 targeted homepage application composition */
#ai-apps .ai-app-showcase-shell { width: min(1330px, calc(100vw - 62px)) !important; }
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main {
  height: min(726px, calc((100vw - 96px) * .55)) !important;
  min-height: 505px !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  height: 100% !important;
  min-height: 505px !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  justify-content: flex-end !important;
  padding-bottom: clamp(28px, 3.2vw, 48px) !important;
}
.ai-app-open { border-style: solid !important; }
@media (max-width: 1080px) {
  #ai-apps .ai-app-showcase-shell { width: 100% !important; }
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main { height: auto !important; min-height: 0 !important; }
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy { height: auto !important; min-height: 0 !important; }
}


/* v43 item 1 final application size */
#ai-apps .ai-app-showcase-shell{width:min(1443px,calc(100vw - 16px))!important}
#ai-apps .ai-app-showcase-shell .ai-app-home>.ai-app-card-main{height:650px!important;min-height:650px!important}
#ai-apps .ai-app-showcase-shell .ai-app-home>.ai-app-card-main .ai-app-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home>.ai-app-card-main .ai-app-copy{height:648px!important;min-height:648px!important}
@media(max-width:1080px){#ai-apps .ai-app-showcase-shell{width:100%!important}#ai-apps .ai-app-showcase-shell .ai-app-home>.ai-app-card-main,#ai-apps .ai-app-showcase-shell .ai-app-home>.ai-app-card-main .ai-app-visual,#ai-apps .ai-app-showcase-shell .ai-app-home>.ai-app-card-main .ai-app-copy{height:auto!important;min-height:0!important}}


/* v47 precise requested AI application homepage height */
#ai-apps .ai-app-showcase-shell {
  width: min(calc(100% + 297px), calc(100vw - 16px)) !important;
  margin-left: -148px !important;
  margin-right: 0 !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  height: 498px !important;
  min-height: 498px !important;
  max-height: 498px !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main {
  height: auto !important;
  min-height: 0 !important;
  max-height: none !important;
}
@media (max-width:1080px) {
  #ai-apps .ai-app-showcase-shell { width: 100% !important; margin-left: 0 !important; }
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
  }
}


/* v48 application boundary aligns with credibility width */
#ai-apps .ai-app-showcase-shell {
  width: 100% !important;
  max-width: 100% !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  transform: none !important;
}
.ai-app-open[data-style-key] { border-style: solid !important; }


/* v49 targeted polish: unified arrows, safer feature widths, inline city case pages */
.method-enter,
.media-proof-enter,
.platform-enter,
.cg-arrow-link .cta-arrow,
.main-jump-link .cta-arrow,
.tool-jump-link .cta-arrow,
.hero-jump-link .cta-arrow,
.works-field-enter [aria-hidden="true"],
.ai-app-field-enter [aria-hidden="true"],
.cooperation-enter [aria-hidden="true"],
.subpage-return-link .cta-arrow {
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  outline: 0 !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  color: #d8bd78 !important;
}
.method-enter,
.media-proof-enter,
.platform-enter {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 22px !important;
  line-height: 1 !important;
}
.cooperation-enter .cta-arrow,
.cooperation-enter [aria-hidden="true"] {
  display: inline-block !important;
  margin-left: 10px !important;
  color: #d8bd78 !important;
}
.works-showcase-shell,
#ai-apps .ai-app-showcase-shell {
  width: min(1260px, calc(100vw - 96px)) !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  transform: none !important;
}
.works-home > .home-work-card-main .home-work-visual {
  min-height: 0 !important;
  height: clamp(360px, 42vw, 492px) !important;
  aspect-ratio: 16 / 9 !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main {
  min-height: 0 !important;
  height: auto !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  min-height: 0 !important;
  height: clamp(350px, 39vw, 468px) !important;
}
.subpage-return-wrap {
  background: transparent !important;
  border-top: 0 !important;
  margin-top: -1px !important;
  padding-top: 0 !important;
}
body:has(.city-os-page) .subpage-return-wrap,
body:has(.city-case-page) .subpage-return-wrap,
body:has(.ai-app-library-page) .subpage-return-wrap,
body:has(.visual-works-page) .subpage-return-wrap {
  background: #100c08 !important;
}
body:has(.city-os-page) .subpage-return-link,
body:has(.city-case-page) .subpage-return-link,
body:has(.ai-app-library-page) .subpage-return-link,
body:has(.visual-works-page) .subpage-return-link {
  color: #f6f1e8 !important;
}
@media (max-width: 1080px) {
  .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell { width: 100% !important; }
  .works-home > .home-work-card-main .home-work-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
    height: auto !important;
    min-height: 0 !important;
  }
}


/* v51 main feature media proportion refinement */
.works-showcase-shell,
#ai-apps .ai-app-showcase-shell {
  width: min(1320px, calc(100vw - 72px)) !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.works-home > .home-work-card-main .home-work-visual {
  height: clamp(400px, 43vw, 530px) !important;
  min-height: 400px !important;
  aspect-ratio: 16 / 9 !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  height: clamp(390px, 41vw, 510px) !important;
  min-height: 390px !important;
}
@media (max-width: 1080px) {
  .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell { width: 100% !important; }
  .works-home > .home-work-card-main .home-work-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
    height: auto !important;
    min-height: 0 !important;
  }
}


/* v52 requested final proportion and cooperation arrow cleanup */
.works-showcase-shell,
#ai-apps .ai-app-showcase-shell {
  width: min(1360px, calc(100vw - 64px)) !important;
  max-width: 100% !important;
}
.works-home > .home-work-card-main .home-work-visual {
  height: clamp(470px, 47vw, 620px) !important;
  min-height: 470px !important;
  aspect-ratio: 16 / 9 !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  height: clamp(460px, 45vw, 600px) !important;
  min-height: 460px !important;
}
.sequence .cooperation-grid .cooperation-enter > span,
.sequence .cooperation-grid .cooperation-enter .cta-arrow,
.sequence .cooperation-grid .cooperation-enter [aria-hidden="true"],
.cooperation-enter > span,
.cooperation-enter .cta-arrow,
.cooperation-enter [aria-hidden="true"] {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
}
.sequence .cooperation-grid .cooperation-enter,
.sequence .cooperation-grid .cooperation-enter.cg-arrow-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 10px !important;
}
@media (max-width: 1080px) {
  .works-home > .home-work-card-main .home-work-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
    height: auto !important;
    min-height: 0 !important;
  }
}


/* v54 screenshot fixes: restore better media proportions and remove cooperation arrow box */
.works-showcase-shell,
#ai-apps .ai-app-showcase-shell {
  width: min(1220px, calc(100vw - 160px)) !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.works-home > .home-work-card-main .home-work-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual {
  height: clamp(500px, 48vw, 660px) !important;
  min-height: 500px !important;
  aspect-ratio: 16 / 10 !important;
  object-fit: cover !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  height: clamp(500px, 48vw, 660px) !important;
  min-height: 500px !important;
}
.visual-works-page .works-library {
  padding-top: clamp(52px, 6vh, 78px) !important;
}
.visual-works-page .works-library .works-library-grid,
.visual-works-page [data-works-library] {
  margin-top: clamp(22px, 3vh, 36px) !important;
}
.sequence .cooperation-grid .cooperation-enter,
.sequence .cooperation-grid .cooperation-enter.cg-arrow-link {
  overflow: visible !important;
}
.sequence .cooperation-grid .cooperation-enter > span,
.sequence .cooperation-grid .cooperation-enter .cta-arrow,
.sequence .cooperation-grid .cooperation-enter [aria-hidden="true"],
.cooperation-enter > span,
.cooperation-enter .cta-arrow,
.cooperation-enter [aria-hidden="true"] {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
  width: auto !important;
  height: auto !important;
  min-width: 0 !important;
  min-height: 0 !important;
  padding: 0 !important;
  color: #d8bd78 !important;
}
@media (max-width: 1080px) {
  .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell { width: 100% !important; }
  .works-home > .home-work-card-main .home-work-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
  }
}


/* v55 requested refinements */
.works-showcase-shell,
#ai-apps .ai-app-showcase-shell {
  width: min(1390px, calc(100vw - 52px)) !important;
  max-width: 100% !important;
}
.works-home > .home-work-card-main .home-work-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual {
  height: clamp(540px, 50vw, 700px) !important;
  min-height: 540px !important;
  aspect-ratio: 16 / 10.6 !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  height: clamp(540px, 50vw, 700px) !important;
  min-height: 540px !important;
}
#works-library.managed-works {
  padding-top: clamp(28px, 3.5vh, 50px) !important;
}
#works-library .works-library-heading {
  margin-bottom: clamp(14px, 2vh, 24px) !important;
}
#works-library [data-managed-works],
#works-library .managed-works-grid {
  margin-top: 0 !important;
}
.subpage-return-wrap {
  background: inherit !important;
  border-top: 0 !important;
  margin-top: -1px !important;
}
body:has(#learning-path) .subpage-return-wrap,
body:has(#works-library) .subpage-return-wrap {
  background: #f9f5ea !important;
}
body:has(.city-os-page) .subpage-return-wrap,
body:has(#quancheng-case) .subpage-return-wrap,
body:has(#city-method-map) .subpage-return-wrap {
  background: #100c08 !important;
}
.sequence .cooperation-grid .cooperation-enter > span,
.sequence .cooperation-grid .cooperation-enter .cta-arrow,
.sequence .cooperation-grid .cooperation-enter [aria-hidden="true"],
.cooperation-enter > span,
.cooperation-enter .cta-arrow,
.cooperation-enter [aria-hidden="true"] {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}
@media (max-width: 1080px) {
  .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell { width: 100% !important; }
  .works-home > .home-work-card-main .home-work-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
  }
}

/* v57c final desktop proportion: works feature taller and a little wider */
.works-showcase-shell {
  width: min(1480px, calc(100vw - 40px)) !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.works-showcase-shell .works-home {
  width: 100% !important;
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.works-home > .home-work-card-main .home-work-visual {
  height: clamp(620px, 52vw, 760px) !important;
  min-height: 620px !important;
  aspect-ratio: 16 / 10.25 !important;
}
#ai-apps .ai-app-showcase-shell {
  width: min(1390px, calc(100vw - 64px)) !important;
  max-width: 100% !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home {
  width: 100% !important;
  max-width: none !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main {
  height: 620px !important;
  min-height: 620px !important;
}
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
#ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
  height: 618px !important;
  min-height: 618px !important;
}
.visual-works-page .works-library {
  padding-top: clamp(24px, 3vh, 42px) !important;
}
.visual-works-page .works-library .works-library-grid,
.visual-works-page [data-works-library],
#works-library [data-managed-works],
#works-library .managed-works-grid {
  margin-top: clamp(8px, 1.2vh, 16px) !important;
}
@media (max-width: 1080px) {
  .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell { width: 100% !important; }
  .works-home > .home-work-card-main .home-work-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-visual,
  #ai-apps .ai-app-showcase-shell .ai-app-home > .ai-app-card-main .ai-app-copy {
    height: auto !important;
    min-height: 0 !important;
  }
}

/* v59 focused refinements: taller home media and tighter visual works library rhythm */
.works-showcase-shell {
  width: min(1520px, calc(100vw - 32px)) !important;
}

.works-home > .home-work-card-main .home-work-visual {
  height: clamp(680px, 54vw, 820px) !important;
  min-height: 680px !important;
  aspect-ratio: 16 / 10.8 !important;
}

#ai-apps .ai-app-showcase-shell {
  width: min(1420px, calc(100vw - 48px)) !important;
}

#ai-apps .ai-app-showcase-shell .ai-app-card-main {
  height: 680px !important;
  min-height: 680px !important;
}

#ai-apps .ai-app-showcase-shell .ai-app-card-main .ai-app-visual,
#ai-apps .ai-app-showcase-shell .ai-app-card-main .ai-app-copy {
  height: 678px !important;
  min-height: 678px !important;
}

#works-library.managed-works {
  padding-top: clamp(8px, 1.2vh, 18px) !important;
}

#works-library .works-library-heading {
  margin-bottom: 12px !important;
}

#works-library [data-managed-works],
#works-library .managed-works-grid,
.visual-works-page .works-library .works-library-grid,
.visual-works-page [data-works-library] {
  margin-top: 0 !important;
}


/* v67: align works and AI application showcases; lower AI app library grid */
#works .works-showcase-shell,
#ai-apps .ai-app-showcase-shell {
  width: min(1420px, calc(100vw - 48px)) !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
.ai-app-library-section > .section-heading {
  margin-bottom: calc(clamp(34px, 4.5vh, 54px) + 20px) !important;
}
.ai-app-library-section .ai-app-library-grid {
  margin-top: 20px !important;
}
@media (max-width: 1080px) {
  #works .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell {
    width: 100% !important;
  }
  .ai-app-library-section .ai-app-library-grid {
    margin-top: 10px !important;
  }
}

/* v68: final align works showcase to the live AI application width */
#works .works-showcase-shell,
#ai-apps .ai-app-showcase-shell {
  width: min(1280px, calc(100vw - 64px)) !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}
@media (max-width: 1080px) {
  #works .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell {
    width: 100% !important;
  }
}


/* v69: final prelaunch refinements for requested buttons, works height, and responsive bounds */
#works > .section-heading,
#ai-apps > .section-heading {
  width: min(1280px, calc(100vw - 64px)) !important;
  max-width: min(1280px, calc(100vw - 64px)) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  box-sizing: border-box !important;
}

#works .works-home > .home-work-card-main .home-work-visual {
  height: clamp(644px, calc(54vw - 36px), 784px) !important;
  min-height: 644px !important;
  aspect-ratio: 16 / 10.8 !important;
}

.works-field-enter .cta-arrow,
.ai-app-field-enter .cta-arrow,
.tool-jump-link .cta-arrow,
.main-jump-link .cta-arrow {
  color: #d8bd78 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  opacity: 1 !important;
}

html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

img,
video,
iframe,
canvas {
  max-width: 100%;
}

.section-screen,
.section-light,
.section-dark,
.tools-entry,
.works-showcase,
.ai-app-field {
  max-width: 100vw;
  box-sizing: border-box;
}

@media (max-width: 1080px) {
  #works > .section-heading,
  #ai-apps > .section-heading,
  #works .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell {
    width: min(100%, calc(100vw - 32px)) !important;
    max-width: min(100%, calc(100vw - 32px)) !important;
  }
}

@media (max-width: 760px) {
  #works > .section-heading,
  #ai-apps > .section-heading,
  #works .works-showcase-shell,
  #ai-apps .ai-app-showcase-shell {
    width: 100% !important;
    max-width: 100% !important;
  }
  #works .works-home > .home-work-card-main .home-work-visual {
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 16 / 9 !important;
  }
  .tool-columns,
  .tool-entry,
  .main-jump-link,
  .tool-jump-link {
    min-width: 0 !important;
    max-width: 100% !important;
  }
  .tool-entry li {
    grid-template-columns: 1fr !important;
  }
}

/* v81: every library item exposes a stable standalone share page. */
.ai-app-share-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 20px;
}

.ai-app-share-actions .ai-app-open {
  margin-top: 0;
}

.ai-app-copy-link {
  min-height: 42px;
  padding: 0 16px;
  border: 1px solid rgba(216, 189, 120, .34);
  background: transparent;
  color: #d8bd78;
  font: 700 11px/1 "Noto Sans SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .08em;
  cursor: pointer;
}

.ai-app-copy-link:hover,
.ai-app-copy-link:focus-visible {
  border-color: rgba(216, 189, 120, .72);
  background: rgba(216, 189, 120, .08);
  outline: none;
}

.ai-share-toast {
  position: fixed;
  left: 50%;
  bottom: 34px;
  z-index: 2200;
  padding: 12px 18px;
  border: 1px solid rgba(216, 189, 120, .4);
  background: rgba(16, 12, 8, .94);
  color: #f6f1e8;
  font: 500 12px/1.4 "Noto Sans SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .06em;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, 12px);
  transition: opacity .2s ease, transform .2s ease;
}

.ai-share-toast.is-visible {
  opacity: 1;
  transform: translate(-50%, 0);
}

@media (max-width: 760px) {
  .ai-app-share-actions {
    align-items: stretch;
  }

  .ai-app-share-actions > * {
    flex: 1 1 150px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .ai-share-toast {
    transition: none;
  }
}


/* v70 targeted fixes: title alignment and visual works spacing */
#works > .section-heading,
#ai-apps > .section-heading {
  width: auto !important;
  max-width: 1040px !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
#works-library.managed-works {
  gap: 50px !important;
}
#works-library.managed-works .works-library-heading {
  margin-bottom: 0 !important;
}
#works-library.managed-works [data-managed-works],
#works-library.managed-works .managed-works-grid,
.visual-works-page .works-library .works-library-grid,
.visual-works-page [data-works-library] {
  margin-top: 0 !important;
}
@media (max-width: 760px) {
  #works > .section-heading,
  #ai-apps > .section-heading {
    max-width: none !important;
  }
  #works-library.managed-works {
    gap: 34px !important;
  }
}


/* v71 align works and ai apps headings with system sections */
@media (min-width: 761px) {
  #works > .section-heading,
  #ai-apps > .section-heading {
    margin-left: -2vw !important;
  }
}


/* v72 visual works library lower spacing */
#works-library.managed-works {
  gap: 70px !important;
}
@media (max-width: 760px) {
  #works-library.managed-works {
    gap: 46px !important;
  }
}

/* v72 targeted subpage refinements */
.city-case-pages-section .city-case-page-block {
  margin-top: -36px !important;
}
.ai-app-library-section .ai-app-library-grid {
  margin-top: -36px !important;
}
.city-case-copy {
  background: var(--city-copy-bg, rgba(26,22,17,.92)) !important;
}
.city-case-copy > span {
  color: var(--city-copy-meta-color, #b4934f) !important;
}
.city-case-copy h3 {
  color: var(--city-copy-title-color, #f6f1e8) !important;
}
.city-case-copy p {
  color: var(--city-copy-text-color, #bdb4a8) !important;
}
.course-managed-body {
  margin: 0;
  display: block;
  width: 100%;
}
.course-image-frame {
  margin: 0;
  width: 100%;
  border-top: 1px solid rgba(180,147,79,.28);
  background: transparent;
  overflow: visible;
}
.course-image-frame img {
  display: block;
  width: 100%;
  height: auto;
  max-width: 100%;
  max-height: none;
  object-fit: contain;
}
@media (max-width: 760px) {
  .city-case-pages-section .city-case-page-block,
  .ai-app-library-section .ai-app-library-grid { margin-top: -20px !important; }
}

/* The shared script resolves the exact color from the preceding section. */
.subpage-return-wrap {
  background: var(--subpage-return-bg, inherit) !important;
}