/* 播放器、工具版本与详情正文；移动规则与 style.css 的手机货架配套。 */
*, *::before, *::after { box-sizing: border-box; }
html, body { max-width: 100%; }
.page, .panel, .course-layout > *, .lesson-layout > *, .card-body { min-width: 0; }
.tabs a { display: block; border: 0; padding: 10px 18px; border-radius: 9px; color: var(--muted); font-size: 14px; text-decoration: none; white-space: nowrap; }
.tabs a[aria-selected="true"] { background: #fff; color: var(--deep); box-shadow: 0 2px 6px #1a18140c; font-weight: 600; }
.media-player { margin-bottom: 24px; }
.media-player video { display: block; width: 100%; max-height: 70vh; background: #161b18; border-radius: 18px; }
.player p { padding: 28px; }
.text-button { border: 0; background: transparent; color: inherit; text-decoration: underline; cursor: pointer; font: inherit; }
.upload-status { display: inline-block; padding: 12px 18px; border-radius: 10px; background: #f0eee8; color: #76796e; }
.version-select { display: block; margin: 18px 0; }
.version-select select { display: block; margin-top: 10px; width: 100%; max-width: 100%; padding: 12px; border: 1px solid #d9ddd5; border-radius: 10px; background: #fff; font: inherit; }
.lesson-content { overflow-wrap: anywhere; }
.lesson-content pre, .lesson-content code { white-space: pre-wrap; overflow-wrap: anywhere; }
.lesson-content table { display: block; max-width: 100%; overflow: auto; border-collapse: collapse; }
.lesson-content td, .lesson-content th { padding: 8px; border: 1px solid #d9ddd5; }
.lesson-content img { max-width: 100%; height: auto; }
.access-gate { margin-top: 24px; }
.access-gate p { margin-top: 0; }
.tool-detail { width: 100%; max-width: 920px; overflow-wrap: anywhere; }
.tool-detail .hero h1 { margin-top: 16px; }
.tool-section { width: 100%; min-width: 0; margin-bottom: 20px; }
.tool-section h2 { font-size: 22px; margin-bottom: 16px; }
.tool-section p + p { margin-top: 12px; }
.tool-summary { font-size: 18px; font-weight: 600; }
.tool-section ul, .tool-steps { margin: 0; padding-left: 1.5em; }
.tool-section li + li { margin-top: 12px; }
.tool-steps li p { margin: 6px 0 0; }
.tool-version-facts { display: grid; grid-template-columns: minmax(0, 90px) minmax(0, 1fr); }
.tool-version-facts dd { min-width: 0; margin-left: 0; overflow-wrap: anywhere; }
.tool-acquire { padding: 12px 0; }
.tool-acquire .btn { max-width: 100%; white-space: normal; }
.tool-acquire button:disabled { cursor: default; background: #eeefea; color: #85857f; border-color: #dedfd8; }
.tool-detail-page .modal { max-width: calc(100vw - 32px); }
.tool-detail-page .modal input { max-width: 100%; }
[hidden] { display: none !important; }
@media (max-width: 760px) {
  .tabs a { min-width: 0; padding: 11px 2px; border-radius: 11px; font-size: 12px; line-height: 22px; text-align: center; }
  .tool-detail, .lesson-content { word-break: keep-all; overflow-wrap: break-word; }
  .tool-detail .hero { padding-bottom: 26px; }
  .tool-detail .hero h1 { margin-top: 14px; font-size: clamp(28px, 7.7vw, 32px); }
  .tool-section { margin-bottom: 24px; padding: 24px 22px; }
  .tool-section h2 { font-size: 22px; line-height: 1.45; margin-bottom: 18px; }
  .tool-section p { font-size: 14px; line-height: 1.9; }
  .tool-section .tool-summary { font-size: 16px; font-weight: 600; line-height: 1.8; color: var(--ink); }
  .tool-section p + p { margin-top: 16px; }
  .tool-section ul, .tool-steps { padding-left: 1.3em; font-size: 14px; line-height: 1.9; }
  .tool-section li + li { margin-top: 16px; }
  .tool-steps li { padding-left: 4px; }
  .tool-steps li::marker { color: var(--brass); }
  .tool-steps strong { font-size: 15px; color: var(--ink); }
  .tool-steps li p { margin-top: 8px; }
  .tool-steps code, .command, .cmd { display: block; max-width: 100%; white-space: pre-wrap; font-size: 12px; line-height: 1.8; }
  .tool-steps code, .file-text, .file-text strong, .tool-version-facts dd, .lesson-content code, .lesson-content pre { min-width: 0; word-break: break-all; overflow-wrap: anywhere; }
  .version-form { width: 100%; }
  .version-select { width: 100%; margin: 0 0 24px; font-size: 14px; }
  .version-select select { width: 100%; min-height: 52px; margin-top: 12px; padding: 13px 34px 13px 14px; font-size: 16px; }
  .tool-version-facts { grid-template-columns: minmax(0, 1fr); gap: 0; margin: 0; font-size: 14px; line-height: 1.85; }
  .tool-version-facts dt { padding-top: 16px; margin-top: 16px; border-top: 1px solid var(--line); font-size: 12px; }
  .tool-version-facts dt:first-child { margin-top: 0; }
  .tool-version-facts dd { padding-top: 5px; font-size: 13px; }
  .tool-acquire { padding: 0; margin: 28px 0 0; }
  .tool-acquire .btn { display: flex; width: 100%; min-height: 52px; padding: 14px 18px; font-size: 15px; }
  .tool-acquire .small-note { margin-top: 12px; }
  .lesson-content { font-size: 14px; line-height: 1.9; }
  .lesson-content h2 { margin-top: 28px; }
  .lesson-content h3 { font-size: 18px; margin: 24px 0 12px; }
  .lesson-content p + p { margin-top: 16px; }
  .lesson-content ul, .lesson-content ol { padding-left: 1.4em; }
  .lesson-content li + li { margin-top: 10px; }
  .lesson-content pre { padding: 16px; border-radius: 12px; background: #f0f2ec; font-size: 12px; }
  .lesson-content code { font-size: 12px; }
  .lesson-content table { font-size: 13px; }
  .lesson-content td, .lesson-content th { min-width: 100px; padding: 12px; }
}