@media (max-width: 800px) {
    html, body { max-width: 100%; overflow-x: hidden; }
    .management-shell { width: calc(100% - 24px); margin: 22px auto 34px; }
    .page-intro { display: block; margin-bottom: 18px; }
    .page-intro h1 { font-size: 31px; line-height: 1.2; }
    .intro-copy { margin-top: 7px; font-size: 12px; line-height: 1.6; }
    .intro-actions { justify-content: space-between; gap: 8px; margin-top: 15px; }
    .sync-status { font-size: 10px; }
    .gold-button { padding: 10px 12px; font-size: 11px; white-space: nowrap; }
    .project-bar { gap: 13px; padding: 15px; }
    .project-identity { min-width: 0; width: 100%; }
    .project-identity strong { font-size: 16px; }
    .project-meta { display: grid; grid-template-columns: 1fr 1fr; gap: 7px 12px; width: 100%; margin-left: 0; font-size: 10px; }
    .icon-button { position: absolute; right: 21px; }
    .metrics-grid { grid-template-columns: 1fr 1fr; gap: 8px; margin: 10px 0 14px; }
    .metric-card { min-height: 116px; padding: 13px; gap: 8px; }
    .metric-icon { width: 29px; height: 29px; font-size: 11px; }
    .metric-card strong { margin: 4px 0; font-size: 23px; }
    .metric-card span:not(.metric-icon), .metric-card em { font-size: 10px; }
    .mini-progress { right: 13px; bottom: 13px; left: 13px; }
    .workspace-tabs { width: 100%; overflow-x: auto; scrollbar-width: none; }
    .workspace-tabs::-webkit-scrollbar { display: none; }
    .workspace-tabs button { flex: 0 0 auto; padding: 11px 12px; white-space: nowrap; font-size: 11px; }
    .workspace-panel { display: block; }
    .panel-main, .panel-side { padding: 17px 14px; }
    .panel-side { border-top: 1px solid rgba(225,189,120,.2); border-left: 0; }
    .panel-heading { align-items: flex-start; flex-direction: column; margin-bottom: 14px; }
    .panel-heading h2 { font-size: 21px; }
    .filter-group { width: 100%; overflow-x: auto; }
    .filter-group button { flex: 1 0 auto; white-space: nowrap; }
    .table-head { display: none; }
    .order-row { grid-template-columns: 1.35fr 1fr; gap: 9px; padding: 14px 8px; }
    .order-row > span:nth-child(2) { grid-column: 2; grid-row: 1; text-align: right; }
    .order-row > span:nth-child(3) { grid-column: 1; }
    .order-row > span:nth-child(4) { grid-column: 2; text-align: right; }
    .phase-copy > div:first-child { align-items: flex-start; flex-direction: column; gap: 5px; }
    .showcase-summary { grid-template-columns: repeat(3, 1fr); }
    .summary-item { min-height: 88px; padding: 13px 9px; }
    .summary-number { font-size: 23px; }
    .summary-note { grid-column: span 3; min-height: 72px; padding: 15px; }
    .project-grid { grid-template-columns: 1fr; }
    .showcase-card.featured { grid-column: auto; display: block; }
    .project-visual, .featured .project-visual { min-height: 190px; }
    .showcase-content { padding: 17px; }
    .showcase-content p { min-height: 0; }
    .comment-form { grid-template-columns: 1fr 1fr; }
    .comment-form textarea { grid-column: span 2; grid-row: 1; }
    .comment-form button { grid-column: span 2; grid-row: 2; min-height: 32px; padding: 8px; }
    .hidden-panel { min-height: 280px; padding: 64px 17px; }

    .showcase-card.featured .project-visual,
    .project-visual { min-height: 260px; }
    .showcase-content { padding: 10px 12px 11px; }
    .showcase-content h2 { margin: 4px 0 3px; font-size: 17px; line-height: 1.18; }
    .showcase-content > p { margin-bottom: 5px; font-size: 10.5px; line-height: 1.3; }
    .project-facts { gap: 10px; margin: 4px 0; padding: 6px 0; }
    .detail-button { padding: 3px 0; }
    .comment-box { margin-top: 8px; padding-top: 8px; }
    .comment-heading { margin-bottom: 5px; }
    .empty-comments { margin-bottom: 5px; }
    .comment-form { margin-top: 5px; }
    .card-topline { margin-bottom: 5px; }
    .comment-form { grid-template-columns: 110px minmax(0, 1fr) auto; }
    .comment-form textarea { grid-column: auto; grid-row: auto; }
    .comment-form button { grid-column: auto; grid-row: auto; min-height: 0; }
}

@media (max-width: 420px) {
    .brand-copy { font-size: .68rem; }
    .brand-copy small { font-size: .44rem; }
    .management-shell { width: calc(100% - 20px); }
    .page-intro h1 { font-size: 28px; }
    .intro-actions { align-items: flex-start; flex-direction: column; }
    .metric-card { min-height: 112px; padding: 11px; }
    .metric-card strong { font-size: 21px; }
    .project-meta { grid-template-columns: 1fr; }
    .order-row { grid-template-columns: 1fr; }
    .order-row > span:nth-child(2), .order-row > span:nth-child(3), .order-row > span:nth-child(4) { grid-column: 1; grid-row: auto; text-align: left; }
    .order-row > span:nth-child(2) { margin-top: 3px; }
    .comment-form { grid-template-columns: 1fr 1fr; }
    .comment-form textarea { grid-column: span 2; grid-row: 1; }
    .comment-form button { grid-column: span 2; grid-row: 2; min-height: 32px; padding: 8px; }
}