/* Responsive foundation for Oroko's existing application.
   Independent of PR #205; scoped to viewport and current page classes. */
@media (max-width:1199px) {
  #app,.app,.main,.editor-main,.editor-shell,.page { min-width:0; }
  .page-head,.pr52-head,.oroko-page-head { min-width:0; }
  .page-head h1,.pr52-head h1 { overflow-wrap:anywhere; }
  .oroko-library-page .process-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pr34-rm-board { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .oroko-settings-content,.b5-grid,.oroko-dev-grid { min-width:0; }
  .oroko-dev-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .pr52-toolbar>* { min-width:0; }
}
@media (max-width:820px) {
  /* Keep the existing drawer but make it an intentional modal navigation layer. */
  .sidebar { width:min(320px,86vw)!important;max-width:86vw;z-index:90!important;
    padding-bottom:env(safe-area-inset-bottom,0px)!important;overscroll-behavior:contain; }
  .sidebar .nav-list { overflow-y:auto; }
  .sidebar .nav-item,.sidebar .pr34-nav-button { min-height:44px; }
  .sidebar .nav-copy { min-width:0; }
  .sidebar .nav-copy strong { overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
  .oroko-mobile-scrim { position:fixed;inset:0;background:rgba(25,22,20,.34);
    z-index:89;display:none;border:0;width:100%;height:100%;padding:0;cursor:pointer; }
  body.oroko-mobile-nav-open .oroko-mobile-scrim { display:block; }
  body.oroko-mobile-nav-open { overflow:hidden; }
  #menuBtn,.menu-btn { color:var(--ink)!important;min-width:44px;min-height:44px;
    display:inline-grid;place-items:center; }
  .topbar { min-width:0; }
  .top-actions { gap:6px; }
  .top-actions #newProcessBtn { white-space:nowrap; }
  .main { min-width:0; }
  /* Tablet keeps two-up cards and an editorial reading width. */
  .oroko-library-page,.pr52-page,.pr34-page { width:100%;max-width:100%;box-sizing:border-box; }
  .oroko-library-page .process-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .oroko-library-page .process-card { min-width:0; }
  .oroko-library-page .page-head { gap:12px; }
  .oroko-library-page .library-toolbar { display:grid;grid-template-columns:minmax(0,1fr) minmax(155px,auto);align-items:center; }
  .oroko-library-page .search { max-width:none;min-width:0; }
  .oroko-library-page .library-toolbar .filter { min-width:0;width:100%; }
  .oroko-library-page .oroko-library-manage-menu { z-index:160; }
  .pr52-head { gap:12px; }
  .pr52-table-wrap { -webkit-overflow-scrolling:touch; }
  .pr52-modal { max-height:calc(100dvh - 32px); }
  /* Map: keep canvas large, move tools into the canvas rather than stacking them above it. */
  .editor-shell { min-height:calc(100dvh - 68px); }
  .editor-main { min-height:0; }
  .editor-toolbar { flex-direction:row!important;align-items:center!important;
    justify-content:space-between;flex-wrap:wrap;gap:6px!important;padding:8px 12px!important; }
  .editor-toolbar .state-switch { min-width:0;max-width:100%; }
  .editor-toolbar .canvas-controls { width:auto;flex:0 0 auto;overflow:visible; }
  .editor-toolbar .state-switch button { white-space:nowrap; }
  .canvas-wrap { height:calc(100dvh - 245px);min-height:390px;max-height:none; }
  .canvas { position:relative;touch-action:none; }
  .canvas-palette { left:10px!important;top:10px!important;max-width:calc(100% - 20px); }
  .canvas-minimap { display:none!important; }
  .inspector { width:min(420px,100%)!important;max-width:100vw;z-index:95!important; }
  .inspector.open { box-shadow:-8px 0 28px rgba(25,22,20,.16); }
  .oroko-mobile-canvas .legend-wrap { overflow-x:auto; }
  .oroko-mobile-canvas .legend { width:max-content;min-width:100%; }
  .oroko-mobile-canvas .canvas-palette button { min-height:44px; }
  .oroko-mobile-canvas .oroko-step-menu[hidden] { display:none!important; }
}
@media (max-width:767px) {
  .page,.pr52-page,.pr34-page { padding:20px 16px 42px!important; }
  .oroko-library-page .process-grid,.pr52-card-grid,.pr34-rm-board { grid-template-columns:minmax(0,1fr)!important; }
  .oroko-library-page .page-head { display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between; }
  .oroko-library-page .page-head h1 { font-size:26px; }
  .oroko-library-page .page-head p { font-size:12px;line-height:1.45; }
  .oroko-library-page .page-actions { width:auto!important;flex:0 0 auto; }
  .oroko-library-page .page-actions .btn { flex:none!important;min-height:44px; }
  .oroko-library-page .library-toolbar { grid-template-columns:minmax(0,1fr);gap:9px;margin:12px 0 18px; }
  .oroko-library-page .search { width:100%; }
  .oroko-library-page .search input { height:44px; }
  .oroko-library-page .filter { height:44px; }
  .oroko-library-page .process-card { min-height:0!important;padding:16px!important;gap:0; }
  .oroko-library-page .process-card h3 { margin:11px 0 6px;font-size:16px;line-height:1.3; }
  .oroko-library-page .process-card p { min-height:0!important;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden; }
  .oroko-library-page .process-card .card-bottom { padding-top:12px;margin-top:8px; }
  .oroko-library-page .process-card .card-meta { margin-top:8px; }
  .oroko-library-page .section-label { gap:8px; }
  .oroko-library-page .section-label>span { font-size:10px;white-space:nowrap; }
  .oroko-library-page .oroko-library-manage-menu { position:absolute;top:calc(100% + 6px);right:0;left:auto;
    width:min(240px,calc(100vw - 32px));max-height:55dvh;overflow:auto;box-shadow:0 10px 30px rgba(25,22,20,.12); }
  .oroko-library-page .oroko-library-manage-menu[hidden] { display:none!important; }
  .pr52-head h1,.pr34-page-head h1 { font-size:27px; }
  .pr52-head-actions .btn { min-height:44px; }
  .pr52-toolbar { display:grid;grid-template-columns:minmax(0,1fr);gap:8px; }
  .pr52-search,.pr52-filter { width:100%;min-width:0; }
  .pr52-search input,.pr52-filter { height:44px; }
  .pr52-table-wrap { margin-inline:0!important;border-radius:12px!important;border:1px solid var(--line)!important; }
  .pr34-rm-toolbar { display:grid;grid-template-columns:minmax(0,1fr); }
  .pr34-rm-toolbar input,.pr34-rm-toolbar select { width:100%;max-width:none;min-width:0;min-height:44px; }
  .pr34-rm-col { min-width:0;min-height:0; }
  .pr34-rm-card { min-height:44px; }
  .pr28-settings-workspace { padding:12px!important;gap:8px!important; }
  .b5-card,.oroko-settings-content .b5-card { min-width:0; }
  .b5-tabs { max-width:100%;overflow-x:auto;scrollbar-width:thin; }
  .b5-tab { white-space:nowrap;min-height:44px; }
  .oroko-settings-content,.oroko-dev-grid { display:grid;grid-template-columns:minmax(0,1fr)!important; }
  .oroko-settings-content input,.oroko-settings-content select,
  .oroko-settings-content textarea { width:100%;max-width:100%;box-sizing:border-box; }
  /* Phone map: preserve an editable canvas; minimise nonessential chrome. */
  .editor-toolbar { padding:7px 10px!important;gap:7px!important; }
  .editor-toolbar .state-switch { flex:1 1 auto;justify-content:center; }
  .editor-toolbar .state-switch button { flex:1;padding:8px 6px; }
  .editor-toolbar .canvas-controls { margin-left:auto; }
  .editor-toolbar .canvas-controls button { min-width:40px;min-height:40px; }
  .canvas-wrap { padding:0 8px 8px!important;height:calc(100dvh - 225px);min-height:380px; }
  .canvas-palette { left:8px!important;top:8px!important; }
  .canvas-palette .oroko-canvas-add { min-height:44px; }
  .inspector { width:100vw!important;top:68px!important;bottom:0!important; }
  .inspector .inspector-head { position:sticky;top:0;z-index:2;background:var(--surface); }
  .inspector .tabs { position:sticky;top:50px;z-index:2;background:var(--surface); }
  .oroko-procedure-page,.oroko-details-page,.oroko-analysis-page,.oroko-governance-page { max-width:100%; }
  .oroko-governance-tabs { overflow-x:auto; }
  .oroko-analysis-visuals { grid-template-columns:minmax(0,1fr); }
}
@media (max-width:420px) {
  .brand-area { flex-basis:auto!important;min-width:0; }
  .brand-area .brand { min-width:0; }
  .top-actions #newProcessBtn { font-size:11px;padding-inline:10px; }
  .oroko-library-page .page-head { flex-wrap:wrap; }
  .oroko-library-page .page-actions { margin-top:2px; }
  .editor-toolbar .state-switch { width:100%; }
  .editor-toolbar .canvas-controls { width:100%;justify-content:center; }
  .canvas-wrap { height:calc(100dvh - 270px); }
}
@media (prefers-reduced-motion:reduce) {
  .sidebar,.inspector,.process-card { transition:none!important; }
}