/* Figma 70:5654. Private refinements of the shared case-study components. */
.ai-review-page {
  --font-sans: "Noto Sans SC", "PingFang SC", "Microsoft YaHei", sans-serif;
  --review-figure-radius: 12px;
  --review-rule-width: 1px;
  --review-preview-height: 600px;
  --review-preview-blue: #377aff;
}
.ai-review-page .brand { flex-direction: column; align-items: flex-start; justify-content: center; gap: 0; }
.ai-review-page .brand-name,
.ai-review-page .brand-portfolio { line-height: var(--leading-body); }
.ai-review-page .directory-project { margin-bottom: 0; }
.ai-review-page .chapter-nav > ol { padding-top: var(--space-6); }
.ai-review-page .section-header { border-top-width: var(--review-rule-width); }
.ai-review-page .review-figure { margin-block: var(--space-6) 0; }
.ai-review-page .review-figure .figure-link { border-radius: var(--review-figure-radius); overflow: hidden; }
.ai-review-page #review-motivation { margin-top: var(--space-8); padding-top: var(--space-4); }
.ai-review-page #review-approach { margin-top: var(--space-6); }
.ai-review-page #review-approach h3 { margin-bottom: 0; }
.ai-review-page #review-three-steps { margin-top: var(--space-6); }
/* The native cloud workflow already includes its 24px top gap. */
.ai-review-page #yunxiao-submission-flow { margin-top: 0; }
.ai-review-page .review-anchor { display: block; scroll-margin-top: var(--space-8); }
.ai-review-page #interactive-report { padding-top: var(--space-6); }
.ai-review-page #report-functions { margin-top: var(--space-8); padding-top: 0; }
.ai-review-page #report-functions h3 { margin-bottom: var(--space-6); }
.ai-review-page #project-application h3 { margin-bottom: 0; }
.ai-review-page #review-results { margin-top: var(--space-6); }
.ai-review-page #project-summary { margin-top: var(--space-6); padding-top: 0; }
.ai-review-page #practice-summary { margin-top: var(--space-6); }
.ai-review-page #practice-summary h3 { margin-bottom: 0; }
.ai-review-page .block-related .review-related-cover { margin: 0; }
.ai-review-page .block-related .figure-link { aspect-ratio: auto; }
.ai-review-page .block-related .figure-link img { height: auto; object-fit: initial; }
.ai-review-page .case-footer { margin-top: calc(var(--space-10) * 3); }
.ai-review-page .review-document-heading { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-4); }
.ai-review-page .review-download { display: inline-flex; align-items: center; min-height: var(--target-size); color: var(--review-preview-blue); }
.ai-review-page .review-download:hover { text-decoration: underline; text-underline-offset: var(--space-1); }
.ai-review-page .review-download[aria-disabled] { color: var(--muted); }
.ai-review-page .review-markdown-region { height: var(--review-preview-height); overflow: auto; overscroll-behavior: contain; padding: var(--space-8); border: var(--review-rule-width) solid var(--rule); border-radius: var(--review-figure-radius); background: var(--surface); }
.ai-review-page .review-markdown-source { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font: inherit; }
.ai-review-page .review-preview-intro { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-2) var(--space-4); margin-bottom: var(--space-2); }
.ai-review-page .review-preview-links { display: flex; flex-wrap: wrap; gap: var(--space-4); font-size: var(--text-control); line-height: var(--leading-control); color: var(--review-preview-blue); }
.ai-review-page .review-preview-links a { display: inline-flex; align-items: center; min-height: var(--target-size); }
.ai-review-page .review-preview-links a:hover { text-decoration: underline; text-underline-offset: var(--space-1); }

/* The inline iframe itself is 600px high. The same instance enters the top layer. */
.ai-review-page .review-preview-dialog { position: relative; inset: auto; width: 100%; max-width: var(--content-max); height: var(--review-preview-height); max-height: none; margin: 0; padding: 0; border: 0; border-radius: var(--review-figure-radius); background: var(--surface); color: var(--ink); overflow: hidden; }
.ai-review-page .review-preview-panel { display: flex; flex-direction: column; width: 100%; height: 100%; min-width: 0; background: var(--surface); }
.ai-review-page .review-preview-frame { display: block; flex: 1; width: 100%; min-width: 0; min-height: 0; height: 100%; border: 0; background: var(--surface); }
.ai-review-page .review-preview-toolbar { display: none; }
.ai-review-page .review-preview-dialog.is-expanded { position: fixed; inset: 0; width: 100vw; max-width: none; height: 100vh; height: 100dvh; margin: 0; border: 0; border-radius: 0; }
.ai-review-page .review-preview-dialog::backdrop { background: var(--surface); }
.ai-review-page .review-preview-dialog.is-expanded .review-preview-toolbar { display: flex; flex: 0 0 auto; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: var(--space-2) var(--space-4); padding: var(--space-2) var(--space-4); border-bottom: var(--review-rule-width) solid var(--rule); font-size: var(--text-control); line-height: var(--leading-control); }
.ai-review-page .review-preview-controls { display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-4); }
.ai-review-page .review-preview-sound { margin-left: auto; }
.ai-review-page .review-preview-toolbar .portfolio-sound-toggle { position: static; }
.ai-review-page .review-preview-controls a,
.ai-review-page .review-preview-controls button { display: inline-flex; align-items: center; min-height: var(--target-size); }
.ai-review-page .review-preview-controls a { color: var(--review-preview-blue); }
.ai-review-page .review-preview-controls button { padding: 0 var(--space-3); border: var(--review-rule-width) solid var(--rule); border-radius: var(--space-2); background: var(--surface); color: var(--ink); cursor: pointer; }
.ai-review-page .review-preview-panel:fullscreen { width: 100vw; height: 100vh; height: 100dvh; }
.ai-review-page.has-open-review-preview { overflow: hidden; }

@media (max-width: 700px) {
  .ai-review-page .site-header { gap: var(--space-3); }
  .ai-review-page .brand { max-width: 54%; }
  .ai-review-page .brand-portfolio { display: block; font-size: 9px; line-height: var(--leading-small); }
  .ai-review-page .review-preview-dialog.is-expanded .review-preview-toolbar { padding-inline: var(--space-3); }
  .ai-review-page .review-markdown-region { padding: var(--space-4); }
  .ai-review-page .case-footer { margin-top: var(--space-14); }
}