/* ── MASTER RESPONSIVE MEDIA QUERIES ── */
    @media(max-width:1024px){
      .topbar-inner, .hero, .workspace {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px;
      }
    }

    @media(max-width:768px){
      .topbar-inner {
        padding: 12px 20px 10px;
      }
      .brand p {
        display: none;
      }
      .hero {
        padding-top: 16px;
      }

      .studio-select-wrap {
        flex-direction: column;
        align-items: stretch;
        gap: 14px;
        width: 100%;
      }
      .studio-select-btn {
        width: 100%;
        justify-content: space-between;
      }
      .studio-slide-container {
        width: 100%;
        padding-right: 32px;
        margin-top: 0;
        margin-bottom: 0;
      }
      .studio-slide-container.open {
        max-width: 100% !important;
      }

      #flowDetailOverlay {
        padding: 12px;
      }
      #flowDetailOverlay .flow-panel {
        padding: 18px;
        border-radius: 16px;
        height: 100%;
        max-height: 100%;
      }
      /* 窄螢幕：工具條改底部橫排，抽屜在畫布下方 */
      .flow-detail-body,
      .flow-panel.is-drawer-open .flow-detail-body {
        grid-template-columns: 1fr;
        grid-template-rows: minmax(160px, 1fr) auto auto;
        gap: 12px;
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
      }
      .flow-editor-side {
        min-height: 160px;
        order: 1;
      }
      /* 抽屜隨內容長高，由外層 flow-detail-body 統一捲動，避免內部裁切附加說明 */
      .tool-drawer {
        order: 2;
        min-height: 0;
        overflow: visible;
      }
      .tool-drawer-body {
        flex: none;
        min-height: 0;
        overflow: visible;
      }
      .tab-panel.active {
        height: auto;
        min-height: 0;
      }
      /* 蓋章：按鈕改橫排省高度，操作區永遠完整顯示 */
      .stamp-action-zone {
        margin-top: 8px;
      }
      .stamp-options {
        flex-direction: row;
        gap: 6px;
      }
      .stamp-opt-btn {
        flex: 1;
        min-width: 0;
        padding: 10px 6px;
        font-size: 12px;
      }
      .stamp-graphic-container {
        padding: 12px 10px 8px;
      }
      .test-stamp-preview {
        max-width: 100px;
      }
      .tool-rail {
        flex-direction: row;
        justify-content: center;
        order: 3;
        padding-top: 0;
      }
      .flow-progress-tracker {
        max-width: 100%;
      }
    }

    @media(max-width:680px){
      .hero-panel {
        padding: 20px;
        gap: 20px;
      }
      .hero-top-row {
        flex-direction: column;
        gap: 20px;
      }

      .focus-card {
        align-self: stretch;
        min-width: 0;
        padding: 18px 24px;
      }
      .hero h2 {
        font-size: 20px;
        text-align: left;
      }
      .hero-desc {
        font-size: 13px;
        line-height: 1.65;
      }

      .studio-card {
        padding: 20px;
      }
      .studio-title {
        font-size: 18px;
      }
    }

    @media(max-width:540px) {
      .topbar-inner {
        padding: 12px 16px 10px;
      }
      .hero, .workspace {
        padding-left: 14px;
        padding-right: 14px;
      }

      .topbar-add-btn {
        font-size: 0;
        padding: 8px 12px;
      }
      .topbar-add-btn::before {
        content: "＋ 工作室";
        font-size: 12px;
        font-weight: 600;
      }

      .ghost-btn {
        padding: 8px 10px;
        font-size: 12px;
      }
    }

    @media(max-width:375px) {
      .topbar-add-btn::before {
        content: "＋";
        font-size: 13px;
      }
      .ghost-btn {
        display: none;
      }
      .hero-panel {
        padding: 16px;
      }
      .studio-card {
        padding: 16px;
      }
      .overlay {
        padding: 12px;
      }
    }