/* Shared responsive layout. Keep the desktop artwork and readable mobile controls. */
html { -webkit-text-size-adjust:100%; }
body:has(dialog[open]) { overflow:hidden; }
main, section, .course-title, .course-detail, .prepare-content,
.resource-file > div, .resource-card-heading > div { min-width:0; }
.text-link, .button, .header-cta, .dialog-close, .back-top { min-height:44px; }
.dialog-close, .back-top { min-width:44px; }
.text-link { max-width:100%; }
.text-link > span, .button > span { flex-shrink:0; }
.mobile-menu-toggle { display:none; }
.site-header #main-nav { display:flex; gap:clamp(12px,2.2vw,36px); }
.site-header #main-nav > a, .site-header #score-nav-toggle { font-size:16px; min-height:48px; }
.header-main .header-cta { font-size:16px; }
.section, .system-section { padding-inline:max(6%,calc((100% - 1320px)/2)); }
.course-detail, .course-resource p, .preparation-list p, .system-card ul,
.support-faq details > div{ overflow-wrap:anywhere; }
.course-title small, .course-duration, .course-resource .resource-label,
.pending-text, .download-label { font-size:14px; }
.course-detail, .course-resource strong, .course-resource .text-link,
.preparation-list p, .system-baseline, .system-card ul,
.official-links, .mcp-setup, .support-lead p:not(.eyebrow),
.support-faq details > div{ font-size:15px; }
.preparation-list strong, .operation-guides h4, .support-faq summary { font-size:17px; }
.operation-guides > div, .download-actions .text-link, .resource-bundle p,
.resource-summary, .configuration-list, .pending-files li { font-size:14px; }
.official-links a, .resource-official-links a { display:inline-flex; align-items:center; min-height:44px; }
.resource-file .text-link { flex-shrink:0; min-height:44px; min-width:56px; }
.resource-file strong, .resource-card-heading p, .resource-official-links { font-size:14px; }
.resource-file small, .pending-files small, .software-tags span { font-size:12px; }
.resource-bundle .button, .resource-bundle .text-link { font-size:15px; }
.resource-dialog, dialog { overscroll-behavior:contain; overflow-y:auto; }
.dialog-top { position:sticky; top:-1px; z-index:2; background:var(--paper); padding:5px 0; }
.resource-dialog .dialog-top { top:-1px; }
.score-toolbar { flex-wrap:wrap; }
.score-toolbar select, textarea { font-size:16px; min-height:44px; }
.score-toolbar select { max-width:100%; }
.score-toolbar label { flex-wrap:wrap; }
.score-toolbar .text-link, .score-toolbar > p, .score-toolbar label{ font-size:14px; }
.score-table-wrap { max-width:100%; overscroll-behavior-x:contain; -webkit-overflow-scrolling:touch; }
.score-table-wrap table { min-width:700px; }
.score-table-wrap th, .score-table-wrap td, .score-table-wrap td button { font-size:15px; }
.score-table-wrap td button { min-height:44px; }
.score-table-wrap td:last-child { font-size:26px; }
.table-scroll-hint { display:none; color:var(--muted); font-size:13px; margin:10px 0; }

@media (max-width:1000px) {
  .score-toolbar > p { flex-basis:100%; }
  .table-scroll-hint { display:flex; justify-content:space-between; gap:12px; }
  .score-table-wrap th:first-child, .score-table-wrap td:first-child { width:54px; min-width:54px; }
  .score-table-wrap th:nth-child(2), .score-table-wrap td:nth-child(2) {
    position:sticky; left:0; z-index:1; background:var(--paper); box-shadow:2px 0 0 var(--line); white-space:nowrap;
  }
  .score-table-wrap thead th:nth-child(2) { background:#eaf2f8; }
  .score-table-wrap tbody tr:first-child td:nth-child(2) { background:#f0f6fa; }
}
@media (max-width:900px) {
  .prepare { display:grid; grid-template-columns:1fr; }
  .prepare-art { min-height:320px; }
  .prepare-art > img { object-position:center 58%; }
  .prepare-art:after { background:linear-gradient(90deg,#ecf5fcf0, #ecf5fc80 45%,transparent 78%); }
  .prepare-art-text { padding:40px 6%; }
  .prepare-art-text h2 { font-size:36px; }
  .prepare-content { padding:42px 6%; }
  .preparation-list li { padding:20px 0; }
  .support { grid-template-columns:1fr; gap:32px; }
  .resource-grid { grid-template-columns:1fr; }
  .resource-summary { min-height:0; }
  .hero-content { padding-left:8%; }
  .hero h1 { font-size:clamp(52px,7.5vw,70px); }
  .hero-actions { flex-wrap:wrap; }
}
@media (min-width:681px) and (max-width:800px) {
  .site-header #main-nav { gap:8px; }
  .site-header #main-nav > a, .site-header #score-nav-toggle { font-size:15px; }
}
@media (max-width:680px) {
  .site-header { padding:0 max(16px,env(safe-area-inset-left)); }
  .header-main { height:72px; gap:8px; }
  .header-main .brand { min-width:0; font-size:13px; gap:8px; letter-spacing:.02em; }
  .header-main .brand small { font-size:10px; letter-spacing:.14em; }
  .brand-mark { flex-shrink:0; width:32px; height:32px; }
  .header-main .header-cta { margin-left:auto; padding:8px 10px; gap:6px; font-size:14px; }
  .header-cta .arrow-circle { display:none; }
  .nav-enhanced .mobile-menu-toggle { display:inline-flex; align-items:center; justify-content:center; gap:4px; padding:8px; min-height:44px; background:transparent; border:1px solid var(--line); font-size:14px; white-space:nowrap; }
  .mobile-menu-toggle span { display:inline-block; transition:transform .2s; }
  .mobile-menu-toggle[aria-expanded="true"] span { transform:rotate(45deg); }
  .site-header #main-nav { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 12px; padding:8px 0 12px; }
  .nav-enhanced .site-header:not(.navigation-open) #main-nav { display:none; }
  .site-header #main-nav > a, .site-header #score-nav-toggle { font-size:16px; text-align:left; padding:12px 10px; min-height:48px; border-bottom:1px solid var(--line); }
  .site-header #main-nav > a.active, .site-header #score-nav-toggle.active { color:var(--blue); background:#e9f2f8; }
  .site-header #main-nav a:after, #score-nav-toggle:after { display:none; }
  .site-header.navigation-open { max-height:calc(100svh - 8px); overflow-y:auto; overscroll-behavior:contain; }
  .score-nav-panel { position:static; padding:6px 0 14px; box-shadow:none; }
  .site-header .score-nav-panel nav { grid-template-columns:1fr; }
  .site-header .score-nav-panel nav a { display:grid; grid-template-columns:24px 1fr; padding:12px 10px; border-right:0; border-bottom:1px solid var(--line); font-size:16px; }
  .score-nav-panel a > span { margin:0; font-size:14px; }
  .score-nav-panel small { font-size:13px; }
  .hero { height:auto; min-height:calc(100svh - 72px); max-height:none; }
  .hero-content { padding:40px 24px 260px; max-width:none; }
  .hero h1 { font-size:clamp(43px,10.8vw,64px); margin-top:24px; }
  .hero .eyebrow { font-size:11px; letter-spacing:.13em; }
  .hero-art { inset:auto 0 0 auto; width:140%; height:76%; max-width:none; object-position:75% bottom; }
  .hero-wash { background:linear-gradient(#f5fafd 0%,#f5fafd 24%,#f5fafdc4 43%,#f5fafd00 67%); }
  .vertical-note { display:none; }
  .hero-actions { gap:16px; margin-top:28px; }
  .hero-actions .button, .hero-actions .text-link { font-size:15px; }
  .hero-actions .button { padding:12px 16px; gap:16px; }
  .hero-actions .text-link { gap:10px; }
  .event-meta { gap:34px; margin-top:26px; }
  .event-meta span { font-size:11px; }
  .event-meta strong { font-size:16px; }
  .scroll-cue { left:24px; bottom:20px; min-height:44px; font-size:12px; background:#f5fafde0; padding:4px 10px; }
  .section, .system-section { padding:48px 24px; }
  .section-heading { flex-direction:column; align-items:flex-start; gap:16px; }
  h2 { font-size:32px; }
  .section-heading .eyebrow { font-size:11px; }
  .prepare-art { min-height:300px; }
  .prepare-art-text, .prepare-content { padding:36px 24px; }
  .prepare-art-text h2 { font-size:34px; }
  .prepare-art-text p:last-child { font-size:15px; }
  .prepare-content h3 { font-size:30px; }
  .preparation-list li { gap:12px; }
  .operation-guides > div { align-items:flex-start; }
  .system-cards { grid-template-columns:1fr; gap:0; }
  .system-card, .system-card:nth-child(3) { padding:24px 0; border:0; border-top:1px solid var(--line); }
  .official-links { flex-direction:row; flex-wrap:wrap; gap:4px 18px; }
  .mcp-setup { flex-wrap:wrap; gap:12px; }
  .mcp-setup a { margin:0; white-space:normal; min-height:44px; display:inline-flex; align-items:center; }
  .download-actions { gap:10px 24px; }
  .download-actions .text-link { font-size:16px; }
  .course-row > summary { grid-template-columns:28px minmax(0,1fr) 28px; gap:8px 12px; padding:20px 0; }
  .course-number { grid-row:1 / 3; align-self:start; font-size:21px; }
  .course-title { font-size:23px; }
  .course-title small { font-size:14px; line-height:1.6; }
  .course-duration { display:block; grid-column:2; grid-row:2; font-size:13px; }
  .course-toggle { grid-column:3; grid-row:1 / 3; }
  .course-detail { padding:0 0 24px; font-size:15px; }
  .course-resource > div { grid-template-columns:1fr; gap:6px; }
  .course-resource .text-link { font-size:15px; padding:8px 0; }
  .score-toolbar label { flex-basis:100%; gap:10px; }
  .score-toolbar select { flex:1; min-width:0; }
  dialog, .resource-dialog { width:calc(100% - 24px); max-height:calc(100svh - 24px); padding:16px 20px 24px; }
  .resource-dialog h2, dialog h2 { font-size:28px; }
  .resource-bundle { display:block; padding:16px; }
  .resource-bundle .button, .resource-bundle .text-link { margin-top:14px; }
  .resource-bundle .button { width:100%; white-space:normal; }
  .resource-card h3 { font-size:23px; }
  .resource-card-heading { gap:10px; }
  .resource-grid { gap:28px; }
  .resource-file { gap:10px; }
  .pending-files li { gap:12px; }
  .support-faq summary { padding:20px 0; }
  .support-faq details > div { padding-right:0; }
  footer { display:flex; flex-wrap:wrap; padding:32px 24px; gap:20px; }
  footer > div { text-align:left; font-size:12px; }
  footer > p { flex-basis:100%; font-size:16px; }
  .back-top { margin-left:auto; flex-shrink:0; }
}
@media (max-width:360px) {
  .header-main .brand { font-size:12px; gap:6px; }
  .header-main .brand small { font-size:9px; }
  .hero-content { padding-inline:20px; }
  .hero-actions { gap:10px; }
  .hero-actions .button { gap:10px; padding-inline:12px; }
  .hero-actions .button, .hero-actions .text-link { font-size:14px; }
  .section, .system-section, .prepare-art-text, .prepare-content { padding-inline:20px; }
  .course-title { font-size:21px; }
  .resource-dialog, dialog { padding-inline:16px; }
}