/* Phone layout (<768px) for the fixed 1920x1080 dashboard mockups. Desktop untouched. */
@media (max-width:767px){
 #ift-stage,.ift-pg.on{width:auto!important;height:auto!important;min-height:100vh;overflow:visible!important;zoom:1!important}
 body{font-size:13.5px}
 header{height:auto!important;flex:none!important;flex-wrap:wrap!important;padding:calc(10px + env(safe-area-inset-top)) 14px 10px!important;gap:8px 10px!important;row-gap:8px}
 header .sep,header .grow{display:none!important}
 header .pill{font-size:11px!important;padding:4px 10px!important;white-space:normal!important}
 header .ht{flex:1 1 60%;min-width:0}
 .tabs,nav{display:flex!important;flex-wrap:nowrap!important;overflow-x:auto!important;-webkit-overflow-scrolling:touch;scrollbar-width:none;max-width:100%;margin-left:0!important}
 header .tabs{order:5;flex:1 1 100%}
 .tabs .tab,nav a{flex:none;white-space:nowrap}
 nav{height:auto!important;padding:0 10px!important;align-items:stretch!important}
 nav .r{display:none!important}
 .wrap,.main,.views{display:flex!important;flex-direction:column!important;padding:12px 12px 0!important;gap:12px!important;height:auto!important;min-height:0!important;flex:none!important}
 .kpis{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
 .k .v{font-size:22px!important}
 .grid,.ins,.starts,.exg,.mg,[style*="grid-template-columns:minmax"],[style*="grid-template-columns:1.1fr"],[style*="grid-template-columns:1.55fr"]{display:flex!important;flex-direction:column!important;gap:12px!important;height:auto!important}
 .exg{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .grid > *,.col,.view,.view.on,[style*="flex-direction:column"]{height:auto!important;min-height:0!important;flex:none!important;overflow:visible!important}
 .c{overflow:visible!important;height:auto!important;flex:none!important;padding:12px!important}
 .c h3{flex-wrap:wrap!important;white-space:normal!important;row-gap:4px}
 .c h3 .rd,.c h3 .h3r{margin-left:0!important}
 table{display:block;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap;max-width:100%}
 svg{max-width:100%;height:auto}
 .br span{width:42%!important;flex:none}.br{flex-wrap:nowrap}
 .fs{grid-template-columns:1fr!important;gap:4px!important}
 .mini3,.st,.kn{grid-template-columns:repeat(2,minmax(0,1fr))!important}
 .fill,.seq{display:flex!important;flex-direction:column!important}.seq span{transform:rotate(90deg);text-align:center}
 footer{height:auto!important;flex-direction:column!important;align-items:flex-start!important;white-space:normal!important;flex-wrap:wrap!important;gap:4px;padding:12px 14px calc(84px + env(safe-area-inset-bottom))!important;font-size:11.5px!important}
 [style*="width:120px"],[style*="width:150px"],[style*="width:160px"]{width:auto!important}
 /* ioVideo editor branch map: keep its geometry, scroll sideways */
 .canvas{overflow-x:auto!important;min-height:520px!important}
 #links,#canvas > svg{min-width:1250px}
 .diff{position:static!important;width:auto!important;margin:8px}
 .search{min-width:0!important}
 .md{width:94vw!important;padding:14px!important}
 div:has(> .c),section:has(> .c){display:flex!important;flex-direction:column!important;gap:12px!important;height:auto!important}
 .c,.c *{min-width:0}.c{max-width:100%!important;width:auto!important}
 .h3r,.c h3 > span,.bulk,.mf,.acc{flex-wrap:wrap!important;white-space:normal!important}
 .h3r{width:100%;gap:4px!important}
 .canvas{max-width:100%;overflow:auto!important}
 .ros td small,.c td small{white-space:normal}
 section.view:not(.on),[style*="display: none"],[style*="display:none"]{display:none!important}
 .ift-pg.on .wrap > *,.ift-pg.on .c{max-width:100%!important}
 .c[style*="flex-direction:row"]{flex-wrap:wrap!important;align-items:flex-start!important}
 .c[style*="flex-direction:row"] > .ti{flex:1 1 100%}
 #ift-stage .c *:not(td):not(th):not(code):not(.tab),.ift-pg.on .c *:not(td):not(th):not(code){white-space:normal!important}
 .leg,.lg{flex-wrap:wrap!important}
 html,body{overflow-x:hidden}
}